feat: nuxt 3 module (jd-solanki#81)

therealokoro · Nov 18, 2022 · f3c7768 · f3c7768
1 parent 64af63e
commit f3c7768
Show file tree

Hide file tree

Showing 16 changed files with 4,180 additions and 89 deletions.
diff --git a/packages/anu-nuxt/.editorconfig b/packages/anu-nuxt/.editorconfig
@@ -0,0 +1,12 @@
+root = true
+
+[*]
+indent_size = 2
+indent_style = space
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
diff --git a/packages/anu-nuxt/.eslintignore b/packages/anu-nuxt/.eslintignore
@@ -0,0 +1,2 @@
+dist
+node_modules
diff --git a/packages/anu-nuxt/.eslintrc b/packages/anu-nuxt/.eslintrc
@@ -0,0 +1,4 @@
+{
+    "root": true,
+    "extends": ["../../.eslintrc"]
+}
diff --git a/packages/anu-nuxt/.gitignore b/packages/anu-nuxt/.gitignore
@@ -0,0 +1,51 @@
+# Dependencies
+node_modules
+
+# Logs
+*.log*
+
+# Temp directories
+.temp
+.tmp
+.cache
+
+# Yarn
+**/.yarn/cache
+**/.yarn/*state*
+
+# Generated dirs
+dist
+
+# Nuxt
+.nuxt
+.output
+.vercel_build_output
+.build-*
+.env
+.netlify
+
+# Env
+.env
+
+# Testing
+reports
+coverage
+*.lcov
+.nyc_output
+
+# VSCode
+.vscode
+
+# Intellij idea
+*.iml
+.idea
+
+# OSX
+.DS_Store
+.AppleDouble
+.LSOverride
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
diff --git a/packages/anu-nuxt/.nuxtrc b/packages/anu-nuxt/.nuxtrc
@@ -0,0 +1 @@
+imports.autoImport=false
diff --git a/packages/anu-nuxt/README.md b/packages/anu-nuxt/README.md
@@ -0,0 +1,53 @@
+
+## Install
+
+### pnpm
+```
+pnpm add @anu-vue/nuxt && pnpm add -D @unocss/nuxt @iconify-json/bx
+```
+
+### Add to nuxt.config.ts
+```ts
+export default {
+  modules: [
+    '@anu-vue/nuxt',
+    '@unocss/nuxt',
+  ],
+}
+```
+
+## Create Config File
+unocss.config.ts
+
+```ts
+import type { UnocssNuxtOptions } from '@unocss/nuxt'
+import presetIcons from '@unocss/preset-icons'
+import presetUno from '@unocss/preset-uno'
+import { presetCore, presetThemeDefault } from 'anu-vue'
+
+export default <UnocssNuxtOptions>{
+  preflight: false,
+  presets: [
+    presetUno(),
+    presetIcons({
+      scale: 1.2,
+      extraProperties: {
+        'height': '1.5em',
+        'flex-shrink': '0',
+        'display': 'inline-block',
+      },
+    }),
+
+    // anu-vue presets
+    presetCore(),
+    presetThemeDefault(),
+  ],
+  include: [/.*\/anu-nuxt\.js(.*)?$/, './**/*.vue', './**/*.md'],
+}
+```
+
+
+
+## 💚 Credits
+
+Library Write [productdevbook](https://github.com/productdevbook)
diff --git a/packages/anu-nuxt/package.json b/packages/anu-nuxt/package.json
@@ -0,0 +1,53 @@
+{
+  "name": "@anu-vue/nuxt",
+  "version": "0.0.0",
+  "description": "Nuxt 3 Anu UI library",
+  "author": "Mehmet - @productdevbook <hi@productdevbook.com>",
+  "license": "MIT",
+  "private": false,
+  "funding": "https://github.com/sponsors/productdevbook",
+  "homepage": "https://github.com/jd-solanki/anu/tree/main/packages/anu-nuxt#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jd-solanki/anu.git",
+    "directory": "packages/anu-nuxt"
+  },
+  "bugs": {
+    "url": "https://github.com/jd-solanki/anu/issues"
+  },
+  "keywords": [
+    "nuxt 3",
+    "anu-nuxt",
+    "vue 3"
+  ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./dist/module.mjs",
+      "require": "./dist/module.cjs"
+    }
+  },
+  "main": "./dist/module.cjs",
+  "types": "./dist/types.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "pnpm dev:prepare && pnpm nuxt-module-build",
+    "dev": "pnpm dev:prepare && nuxi dev playground",
+    "dev:build": "nuxi build playground",
+    "dev:prepare": "nuxt-module-build --stub && nuxi prepare playground",
+    "prepublishOnly": "npm run build"
+  },
+  "dependencies": {
+    "@css-render/vue3-ssr": "^0.15.11",
+    "@nuxt/kit": "^3.0.0",
+    "anu-vue": "^0.10.0",
+    "defu": "^6.1.1"
+  },
+  "devDependencies": {
+    "@nuxt/module-builder": "^0.2.1",
+    "@nuxt/schema": "^3.0.0",
+    "nuxt": "^3.0.0"
+  }
+}
diff --git a/packages/anu-nuxt/playground/app.vue b/packages/anu-nuxt/playground/app.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts"></script>
+
+<template>
+  <div>
+    <NuxtPage />
+  </div>
+</template>
diff --git a/packages/anu-nuxt/playground/nuxt.config.ts b/packages/anu-nuxt/playground/nuxt.config.ts
@@ -0,0 +1,7 @@
+import { defineNuxtConfig } from 'nuxt/config'
+
+import anu from '..'
+
+export default defineNuxtConfig({
+  modules: [anu, '@unocss/nuxt'],
+})
diff --git a/packages/anu-nuxt/playground/package.json b/packages/anu-nuxt/playground/package.json
@@ -0,0 +1,8 @@
+{
+  "private": true,
+  "name": "my-module-playground",
+  "devDependencies": {
+    "@iconify-json/bx": "^1.1.4",
+    "@unocss/nuxt": "^0.46.5"
+  }
+}
diff --git a/packages/anu-nuxt/playground/pages/index.vue b/packages/anu-nuxt/playground/pages/index.vue
@@ -0,0 +1,144 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const isDialogShown = ref(false)
+</script>
+
+<template>
+  <div class="max-w-2xl mx-auto space-y-10">
+    <div class="grid-row">
+      <AAlert>
+        Fruitcake I love liquorice apple pie croissant.
+      </AAlert>
+
+      <AAlert color="success">
+        Fruitcake I love liquorice apple pie croissant.
+      </AAlert>
+
+      <AAlert color="info">
+        Fruitcake I love liquorice apple pie croissant.
+      </AAlert>
+
+      <AAlert color="warning">
+        Fruitcake I love liquorice apple pie croissant.
+      </AAlert>
+
+      <AAlert color="danger">
+        Fruitcake I love liquorice apple pie croissant.
+      </AAlert>
+    </div>
+
+    <div class="flex flex-wrap gap-4">
+      <!-- Content prop -->
+      <AAvatar content="A" />
+
+      <!-- Default slot -->
+      <AAvatar color="success">
+        JD
+      </AAvatar>
+
+      <!-- icon -->
+      <AAvatar
+        color="info"
+        icon="i-bx-support"
+      />
+
+      <!-- Image -->
+      <AAvatar src="/images/demo/portrait-1.jpg" />
+    </div>
+
+    <div class="flex items-center flex-wrap gap-8">
+      <!-- Icon -->
+      <ABadge :content="9">
+        <i class="i-bx-bell w-6 h-6" />
+      </ABadge>
+
+      <!-- Button -->
+      <ABadge :content="9">
+        <ABtn>
+          Button
+        </ABtn>
+      </ABadge>
+
+      <!-- Avatar -->
+      <ABadge
+        :content="9"
+        offset-x="16"
+        offset-y="16"
+      >
+        <AAvatar src="/images/demo/portrait-1.jpg" />
+      </ABadge>
+    </div>
+
+    <div class="flex flex-wrap gap-4">
+      <ABtn>Primary</ABtn>
+
+      <ABtn color="success">
+        Success
+      </ABtn>
+
+      <ABtn color="info">
+        Info
+      </ABtn>
+
+      <ABtn color="warning">
+        Warning
+      </ABtn>
+
+      <ABtn color="danger">
+        Danger
+      </ABtn>
+    </div>
+
+    <div class="grid-row sm:grid-cols-2 cards-demo-container">
+      <!-- 👉 Using props -->
+      <ACard
+        title="Card title"
+        subtitle="Chocolate cake tiramisu donut"
+        text="Ice cream sweet pie pie dessert sweet danish. Jelly jelly beans cupcake jelly-o chocolate bonbon chocolate bar."
+      />
+
+      <!-- 👉 Using custom content (without props) -->
+      <ACard>
+        <div class="a-card-body a-card-spacer">
+          <ATypography
+            title="Card title"
+            subtitle="Chocolate cake tiramisu donut"
+          />
+          <p class="text-sm">
+            Ice cream sweet pie pie dessert sweet danish. Jelly jelly beans cupcake jelly-o chocolate bonbon chocolate bar.
+          </p>
+        </div>
+      </ACard>
+    </div>
+
+    <div class="flex flex-wrap gap-2">
+      <AChip>Primary</AChip>
+      <AChip color="success">
+        Success
+      </AChip>
+      <AChip color="info">
+        Info
+      </AChip>
+      <AChip color="warning">
+        Warning
+      </AChip>
+      <AChip color="danger">
+        Danger
+      </AChip>
+    </div>
+
+    <div>
+      <ADialog
+        v-model="isDialogShown"
+        title="Dialog title"
+        subtitle="Chocolate cake tiramisu donut"
+        text="Ice cream sweet pie pie dessert sweet danish. Jelly jelly beans cupcake jelly-o chocolate bonbon chocolate bar."
+      />
+
+      <ABtn @click="isDialogShown = true">
+        Show dialog
+      </ABtn>
+    </div>
+  </div>
+</template>
diff --git a/packages/anu-nuxt/playground/unocss.config.ts b/packages/anu-nuxt/playground/unocss.config.ts
@@ -0,0 +1,25 @@
+import type { UnocssNuxtOptions } from '@unocss/nuxt'
+import presetIcons from '@unocss/preset-icons'
+import presetUno from '@unocss/preset-uno'
+import { presetCore, presetThemeDefault } from 'anu-vue'
+
+export default <UnocssNuxtOptions>{
+  preflight: false,
+  presets: [
+    presetUno(),
+    presetIcons({
+      scale: 1.2,
+      extraProperties: {
+        'height': '1.5em',
+        'flex-shrink': '0',
+        'display': 'inline-block',
+      },
+    }),
+
+    // anu-vue presets
+    presetCore(),
+    presetThemeDefault(),
+  ],
+  include: [/.*\/anu-vue\.js(.*)?$/, './**/*.vue', './**/*.md'],
+
+}