feat: vite docs to nuxt docs

apps/docs/docs/.vitepress/config.ts

@@ -1,6 +1,6 @@
 import path from 'path'
 
-import VueI18n from '@intlify/vite-plugin-vue-i18n'
+// import VueI18n from '@intlify/vite-plugin-vue-i18n'
 import Unocss from 'unocss/vite'
 import { defineConfig } from 'vitepress'
 
@@ -71,11 +71,11 @@ export default defineConfig({
     },
     build: { target: 'esnext' },
     plugins: [
-      VueI18n({
-        runtimeOnly: true,
-        compositionOnly: true,
-        include: [path.resolve(__dirname, './locales/**')]
-      }),
+      // VueI18n({
+      //   runtimeOnly: true,
+      //   compositionOnly: true,
+      //   include: [path.resolve(__dirname, './locales/**')]
+      // }),
       Unocss({
         configFile: '../../unocss.config.ts'
       })

apps/docs/docs/.vitepress/i18n/index.ts

@@ -32,9 +32,8 @@ const defaultLocal = await loadDateFNSLocale(options.locale)
 export const i18n = createI18n(options)
 
 // setup i18n instance with global
-export async function setupI18n(app: App) {
+export function setupI18n(app: App) {
   const huntersofbook = createHuntersofbook({
-    i18n,
     dateFnsLanguage: defaultLocal
   })
   app.use(i18n)

apps/docs/docs/.vitepress/i18n/useLocale.ts

@@ -23,7 +23,7 @@ export function useLocale() {
 
   // Switching the language will change the locale of useI18n
   // And submit to configuration modification
-  async function changeLocale(locale: LocaleType) {
+  function changeLocale(locale: LocaleType) {
     // const globalI18n = i18n.global;
     // const currentLocale = unref(globalI18n.locale);
     // console.log(currentLocale, "currentLocale", locale, "locale");

apps/docs/docs/.vitepress/theme/index.ts

@@ -10,21 +10,21 @@ import Tab from '../../../components/Tabs/Tab.vue'
 import Tabs from '../../../components/Tabs/Tabs.vue'
 import { extractFileNameFromPath } from '../../../utils'
 import 'uno.css'
-import { setupI18n } from '../i18n'
+// import { setupI18n } from '../i18n'
 import { setupStore } from '../stores'
 
 async function setupApp(app: App) {
   // 挂载vuex状态管理
   setupStore(app)
   // Multilingual configuration
   // Asynchronous case: language files may be obtained from the server side
-  await setupI18n(app)
+  // await setupI18n(app)
 }
 export default {
   ...DefaultTheme,
   Layout() {
     return h(DefaultTheme.Layout, null, {
-      'nav-bar-content-before': () => h(Language)
+      'nav-bar-content-before': () => h('div')
     })
   },
   async enhanceApp({ app }) {

apps/docs/docs/demos/hdatetime/unixMillisecondTimestamp.vue

@@ -1,7 +1,7 @@
-<script setup lang="ts">
+<!-- <script setup lang="ts">
 import { HDateTime } from '@huntersofbook/ui'
 </script>
 
 <template>
   <HDateTime value="1661182742000" type="unixMillisecondTimestamp" />
-</template>
+</template> -->

apps/docs/docs/demos/hdatetime/useTimeFromNow.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<!-- <script setup lang="ts">
 import { useTimeFromNow } from 'huntersofbook'
 const date = new Date()
 const data = useTimeFromNow(date, 100)
@@ -8,4 +8,4 @@ const data = useTimeFromNow(date, 100)
   <div>
     {{ data }}
   </div>
-</template>
+</template> -->

apps/docs/docs/demos/hdatetime/useTimeFromNowStrict.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<!-- <script setup lang="ts">
 import { useTimeFromNowStrict } from 'huntersofbook'
 const date = new Date()
 const data = useTimeFromNowStrict(date, 100)
@@ -8,4 +8,4 @@ const data = useTimeFromNowStrict(date, 100)
   <div>
     {{ data }}
   </div>
-</template>
+</template> -->

apps/docs/docs/docs/ui/index.md

@@ -2,5 +2,5 @@
 
 It is a UI structure that comes together with many open source projects and its own specially written components/composables. New components will come in the future.
 
-- [HDateTime](./hdatetime/index.md)
+<!-- - [HDateTime](./hdatetime/index.md) -->
 - ... new components and composables coming soon

apps/docs/docs/index.md

@@ -17,11 +17,31 @@ hero:
     - theme: alt
       text: Discord
       link: https://discord.gg/N3vW4jrzdX
-features:
-  - icon: 🔗
-    title: Vue 3 
-    details: All project Vue 3 support
-  - icon: 🌐
-    title: Open source
-    details: Everyone can contribute to the development of this code
 ---
+
+
+<div class="px-16">
+<div class="grid sm:gap-y-12 gap-y-16 gap-x-8 md:grid-cols-3 sm:grid-cols-2 sm:justify-start sm:text-left justify-center text-center max-w-[1152px] all-max-w-[300px] container mx-auto my-36">
+  <!-- DX -->
+  <div>
+    <div class="i-logos-vue text-primary text-3xl inline-flex shrink-0 p-2"></div>
+    <p class="text-high-emphasis font-semibold text-xl">Vue 3</p>
+    <span class="text-sm">All project Vue 3 support. </span>
+  </div>
+
+  <!-- Flexibility -->
+  <div>
+    <div class="i-logos-nuxt-icon i-fluent-emoji-four-leaf-clover text-primary text-3xl inline-flex shrink-0 p-2"></div>
+    <p class="text-high-emphasis font-semibold text-xl">Nuxt 3</p>
+    <span class="text-sm">Same packages Nuxt 3 support.</span>
+  </div>
+
+  <!-- Powerful tools -->
+  <div>
+    <div class="i-fluent-emoji-high-voltage text-primary text-3xl inline-flex shrink-0 p-2"></div>
+    <p class="text-high-emphasis font-semibold text-xl">Powerful tools</p>
+    <span class="text-sm">Anu is build on top of powerful tools like UnoCSS, VueUse, etc. This saves your lot of development time.</span>
+  </div>
+
+</div>
+</div>

apps/docs/package.json

@@ -12,6 +12,7 @@
   "author": "",
   "license": "ISC",
   "devDependencies": {
+    "@iconify-json/logos": "^1.1.16",
     "@iconify-json/ph": "^1.1.2",
     "@unocss/preset-icons": "^0.45.12",
     "unocss": "^0.45.12",
@@ -22,7 +23,7 @@
   "dependencies": {
     "@huntersofbook/form-naiveui": "workspace:*",
     "@huntersofbook/ui": "workspace:*",
-    "@intlify/vite-plugin-vue-i18n": "7.0.0-beta.2",
+    "@intlify/vite-plugin-vue-i18n": "7.0.0-beta.3",
     "autoprefixer": "10.4.11",
     "huntersofbook": "workspace:*",
     "pinia": "^2.0.21",

apps/nuxt-docs/.gitignore

@@ -0,0 +1,12 @@
+node_modules
+*.iml
+.idea
+*.log*
+.nuxt
+.vscode
+.DS_Store
+coverage
+dist
+sw.*
+.env
+.output

apps/nuxt-docs/README.md

@@ -0,0 +1,11 @@
+[![nuxt-content](/docs/public/cover_dark.png "@nuxt/content image")](https://content.nuxtjs.org)
+
+# Documentation
+
+This documentation uses [Docus](https://github.com/nuxt-themes/docus).
+
+## 💻 Development
+
+- Install dependencies using `yarn install`
+- Start using `yarn dev`
+- Build using `yarn build`

apps/nuxt-docs/app.config.ts

@@ -0,0 +1,46 @@
+export default defineAppConfig({
+  docus: {
+    title: 'huntersofbook',
+    description: 'We open the tools we use in our projects to all developers.',
+    layout: 'docs',
+    image: 'https://content.nuxtjs.org/preview.png',
+    url: 'https://content.nuxtjs.org',
+    debug: false,
+    socials: {
+      twitter: '@huntersofbook',
+      github: 'huntersofbook/huntersofbook'
+    },
+    github: {
+      root: 'apps/nuxt-docs/content',
+      edit: true,
+      releases: true
+    },
+    cover: {
+      src: '/cover.jpg',
+      alt: 'Content made easy for Vue developers'
+    },
+    header: {
+      title: false,
+      logo: false
+    },
+    footer: {
+      credits: {
+        icon: 'IconDocus',
+        text: 'Powered by Docus',
+        href: 'https://docus.com'
+      },
+      icons: [
+        {
+          label: 'NuxtJS',
+          href: 'https://nuxtjs.org',
+          component: 'IconNuxt'
+        },
+        {
+          label: 'VueJS',
+          href: 'https://vuejs.org',
+          component: 'uim:vuejs'
+        }
+      ]
+    }
+  }
+})

apps/nuxt-docs/components/content/Ellipsis.vue

@@ -0,0 +1,14 @@
+<template>
+  <div class="absolute left-0 top-0 w-full max-w-full">
+    <div class="ellipsis" />
+  </div>
+</template>
+
+<style lang="postcss" scoped>
+.ellipsis {
+  @apply h-[160px] md:w-[600px];
+  background: linear-gradient(97.62deg, rgba(0, 71, 225, 0.22) 2.27%, rgba(26, 214, 255, 0.22) 50.88%, rgba(0, 220, 130, 0.22) 98.48%);
+  filter: blur(169px);
+  transform: matrix(-0.95, -0.3, -0.3, 0.95, 200, 250);
+}
+</style>

apps/nuxt-docs/components/content/ExampleCard.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="p-6 border bg-white dark:bg-black dark:border-gray-700 rounded">
+    <slot />
+  </div>
+</template>

apps/nuxt-docs/components/content/ExampleHero.vue

@@ -0,0 +1,8 @@
+<template>
+  <section>
+    <h1 class="text-4xl">
+      <slot />
+    </h1>
+    <slot name="description" />
+  </section>
+</template>

apps/nuxt-docs/components/content/ExampleIconCard.vue

@@ -0,0 +1,26 @@
+<script setup>
+defineProps({
+  title: {
+    type: String,
+    default: 'Default title'
+  },
+  description: {
+    type: String,
+    default: 'Default description'
+  },
+  icon: {
+    type: String,
+    default: 'IconMarkdown'
+  }
+})
+</script>
+
+<template>
+  <div class="p-6 border bg-white dark:bg-black dark:border-gray-700 rounded">
+    <component :is="icon" class="w-20 h-20" />
+    <h2 class="text-3xl font-semibold mb-2">
+      {{ title }}
+    </h2>
+    <p>{{ description }}</p>
+  </div>
+</template>

apps/nuxt-docs/components/content/ExampleMultiselect.vue

@@ -0,0 +1,19 @@
+<template>
+  <div>Not working on content v2 docs!</div>
+</template>
+
+<script>
+export default {
+  props: {
+    options: {
+      type: [Array, String],
+      default: () => []
+    }
+  },
+  data () {
+    return {
+      value: null
+    }
+  }
+}
+</script>

apps/nuxt-docs/components/content/ExampleTheTitle.vue

@@ -0,0 +1,5 @@
+<template>
+  <h1 class="text-4xl">
+    <ContentSlot :use="$slots.default" unwrap="p" />
+  </h1>
+</template>

apps/nuxt-docs/components/content/HeroAnnouncement.vue

@@ -0,0 +1,19 @@
+<script setup>
+defineProps({
+  to: {
+    type: String,
+    default: ''
+  },
+  label: {
+    type: String,
+    default: ''
+  }
+})
+</script>
+
+<template>
+  <NuxtLink :to="to" class="hover:bg-primary-200 text-primary-900 bg-primary-100 transition dark:bg-transparent hover:dark:bg-primary-900 dark:border-primary-700 dark:text-primary-100 border border-primary-400 mb-8 px-4 py-2 rounded-md flex gap-x-1 inline-flex items-center justify-center">
+    <Icon name="heroicons-solid:sparkles" class="h-4 w-4" />
+    <span class="font-medium text-sm">{{ label }}</span>
+  </NuxtLink>
+</template>

apps/nuxt-docs/components/content/IconCopy.vue

@@ -0,0 +1,17 @@
+<template>
+  <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+      d="M19.0781 6H8.67187C7.19624 6 6 7.19624 6 8.67187V19.0781C6 20.5538 7.19624 21.75 8.67187 21.75H19.0781C20.5538 21.75 21.75 20.5538 21.75 19.0781V8.67187C21.75 7.19624 20.5538 6 19.0781 6Z"
+      stroke="currentColor"
+      stroke-width="1.49375"
+      stroke-linejoin="round"
+    />
+    <path
+      d="M17.9766 6L18 4.875C17.998 4.17942 17.7208 3.51289 17.229 3.02103C16.7371 2.52918 16.0706 2.25198 15.375 2.25H5.25C4.45507 2.25235 3.69338 2.56917 3.13128 3.13128C2.56917 3.69338 2.25235 4.45507 2.25 5.25V15.375C2.25198 16.0706 2.52918 16.7371 3.02103 17.229C3.51289 17.7208 4.17942 17.998 4.875 18H6"
+      stroke="currentColor"
+      stroke-width="1.49375"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+  </svg>
+</template>

apps/nuxt-docs/components/content/IconHeart.vue

@@ -0,0 +1,9 @@
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24">
+    <path
+      class="icon"
+      fill="currentColor"
+      d="M12 21.638h-.014C9.403 21.59 1.95 14.856 1.95 8.478c0-3.064 2.525-5.754 5.403-5.754 2.29 0 3.83 1.58 4.646 2.73.813-1.148 2.353-2.73 4.644-2.73 2.88 0 5.404 2.69 5.404 5.755 0 6.375-7.454 13.11-10.037 13.156H12zM7.354 4.225c-2.08 0-3.903 1.988-3.903 4.255 0 5.74 7.035 11.596 8.55 11.658 1.52-.062 8.55-5.917 8.55-11.658 0-2.267-1.822-4.255-3.902-4.255-2.528 0-3.94 2.936-3.952 2.965-.23.562-1.156.562-1.387 0-.015-.03-1.426-2.965-3.955-2.965z"
+    />
+  </svg>
+</template>

apps/nuxt-docs/components/content/IconMarkdown.vue

@@ -0,0 +1,12 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 26 26"
+    height="64"
+    fill="currentColor"
+  >
+    <path
+      d="M 24 5 L 2 5 C 1 5 0 5.9375 0 6.875 L 0 18 C 0 18.9375 1 20 2 20 L 24 20 C 25 20 26 18.9375 26 18 L 26 6.875 C 26 5.9375 25 5 24 5 Z M 14 17 L 12 17 L 12 11 L 9 14.039063 L 6 11 L 6 17 L 4 17 L 4 8 L 6 8 L 9 11.398438 L 12 8 L 14 8 Z M 20 17 L 17 13 L 19 13 L 19 8 L 21 8 L 21 13 L 23 13 Z"
+    />
+  </svg>
+</template>

apps/nuxt-docs/components/content/IconSearch.vue

@@ -0,0 +1,12 @@
+<template>
+  <svg
+    fill="none"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    stroke-width="2"
+    viewBox="0 0 24 24"
+    stroke="currentColor"
+  >
+    <path d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+  </svg>
+</template>