abichinger · abichinger · Nov 11, 2024 · Nov 11, 2024 · Nov 11, 2024 · Nov 11, 2024
diff --git a/ant/README.md b/ant/README.md
@@ -10,6 +10,7 @@
 <a href="https://www.npmjs.com/package/@vue-js-cron/ant">Ant</a> |
 <a href="https://www.npmjs.com/package/@vue-js-cron/element-plus">Element Plus</a> |
 <a href="https://www.npmjs.com/package/@vue-js-cron/naive-ui">Naive UI</a> |
+<a href="https://www.npmjs.com/package/@vue-js-cron/prime">PrimeVue</a> |
 <a href="https://www.npmjs.com/package/@vue-js-cron/quasar">Quasar</a> |
 <a href="https://www.npmjs.com/package/@vue-js-cron/vuetify">Vuetify</a>
 </p>

diff --git a/core/README.md b/core/README.md
@@ -10,6 +10,7 @@
 <a href="https://www.npmjs.com/package/@vue-js-cron/ant">Ant</a> |
 <a href="https://www.npmjs.com/package/@vue-js-cron/element-plus">Element Plus</a> |
 <a href="https://www.npmjs.com/package/@vue-js-cron/naive-ui">Naive UI</a> |
+<a href="https://www.npmjs.com/package/@vue-js-cron/prime">PrimeVue</a> |
 <a href="https://www.npmjs.com/package/@vue-js-cron/quasar">Quasar</a> |
 <a href="https://www.npmjs.com/package/@vue-js-cron/vuetify">Vuetify</a>
 </p>

diff --git a/demo/package-lock.json b/demo/package-lock.json
diff --git a/demo/package.json b/demo/package.json
@@ -17,7 +17,8 @@
     "@vue-js-cron/element-plus": "file:../element-plus",
     "@vue-js-cron/light": "file:../light",
     "@vue-js-cron/vuetify": "file:../vuetify",
-    "@vue-js-cron/naive-ui": "file:../naive-ui"
+    "@vue-js-cron/naive-ui": "file:../naive-ui",
+    "@vue-js-cron/prime": "file:../prime"
   },
   "devDependencies": {
     "@tsconfig/node18": "^18.2.2",

diff --git a/demo/prime/index.html b/demo/prime/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <link rel="icon" href="/favicon.ico">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Vite App</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/prime-main.ts"></script>
+  </body>
+</html>
diff --git a/demo/src/presets/Noir.ts b/demo/src/presets/Noir.ts
@@ -0,0 +1,50 @@
+import { definePreset } from '@primevue/themes'
+import Aura from '@primevue/themes/aura'
+
+export const Noir = definePreset(Aura, {
+  semantic: {
+    primary: {
+      50: '{surface.50}',
+      100: '{surface.100}',
+      200: '{surface.200}',
+      300: '{surface.300}',
+      400: '{surface.400}',
+      500: '{surface.500}',
+      600: '{surface.600}',
+      700: '{surface.700}',
+      800: '{surface.800}',
+      900: '{surface.900}',
+      950: '{surface.950}',
+    },
+    colorScheme: {
+      light: {
+        primary: {
+          color: '{primary.950}',
+          contrastColor: '#ffffff',
+          hoverColor: '{primary.900}',
+          activeColor: '{primary.800}',
+        },
+        highlight: {
+          background: '{primary.950}',
+          focusBackground: '{primary.700}',
+          color: '#ffffff',
+          focusColor: '#ffffff',
+        },
+      },
+      dark: {
+        primary: {
+          color: '{primary.50}',
+          contrastColor: '{primary.950}',
+          hoverColor: '{primary.100}',
+          activeColor: '{primary.200}',
+        },
+        highlight: {
+          background: '{primary.50}',
+          focusBackground: '{primary.300}',
+          color: '{primary.950}',
+          focusColor: '{primary.950}',
+        },
+      },
+    },
+  },
+})
diff --git a/demo/src/prime-main.ts b/demo/src/prime-main.ts
@@ -0,0 +1,28 @@
+// Generated file, do not modify
+import './assets/main.css'
+import { createApp } from 'vue'
+import App from './App.vue'
+import type { App as VueApp } from 'vue'
+import { customSetup } from './setup'
+
+export async function setup(app: VueApp) {
+  // imports
+  await import('primeicons/primeicons.css')
+
+  // uses
+  let module = null
+
+  // register cron component
+  await import('@vue-js-cron/prime/dist/prime.css')
+  module = await import('@vue-js-cron/prime')
+  app.component('cron-editor', module['CronPrime'])
+}
+
+async function main() {
+  const app = createApp(App)
+  await setup(app)
+  await customSetup('prime', app)
+  app.mount('#app')
+}
+
+main()
diff --git a/demo/src/setup.ts b/demo/src/setup.ts
@@ -28,6 +28,22 @@ async function customAntSetup() {
   }
 }
 
+async function customPrimeSetup(app: App) {
+  const PrimeVue = await import('primevue/config')
+  const { Noir } = await import('@/presets/Noir')
+
+  app.use(PrimeVue.default, {
+    theme: {
+      preset: Noir,
+      options: {
+        prefix: 'p',
+        darkModeSelector: '.p-dark',
+        cssLayer: false,
+      },
+    },
+  })
+}
+
 export const customSetup = async (flavor: string, app: App) => {
   switch (flavor) {
     case 'ant':
@@ -45,5 +61,8 @@ export const customSetup = async (flavor: string, app: App) => {
       break
     case 'naive-ui':
       break
+    case 'prime':
+      await customPrimeSetup(app)
+      break
   }
 }
diff --git a/demo/vite.config.ts b/demo/vite.config.ts
@@ -22,6 +22,7 @@ export default defineConfig({
         light: resolve(__dirname, 'light/index.html'),
         'element-plus': resolve(__dirname, 'element-plus/index.html'),
         'naive-ui': resolve(__dirname, 'naive-ui/index.html'),
+        prime: resolve(__dirname, 'prime/index.html'),
         quasar: resolve(__dirname, 'quasar/index.html'),
         vuetify: resolve(__dirname, 'vuetify/index.html'),
       },

diff --git a/docs/src/.vuepress/components/cron-demo.vue b/docs/src/.vuepress/components/cron-demo.vue
@@ -2,11 +2,11 @@
   <div class="cron-demo">
     <p>Flavor</p>
     <v-select 
-      :model-value="flavor"
-      @update:model-value="selectFlavor" 
+      v-model="flavor"
       :items="flavors" 
-      item-value="name" 
-      item-title="name">
+      item-value="value"
+      item-title="name"
+      return-object>
     </v-select>
 
     <p>Locale</p>
@@ -58,13 +58,21 @@ export default {
       {
         name: 'Naive UI',
       },
+      {
+        name: 'PrimeVue',
+        value: 'prime'
+      },
       {
         name: 'Quasar',
       },
       {
         name: 'Vuetify',
       },
-    ]
+    ].map(f => ({
+      name: f.name,
+      value: f.value ?? f.name.replace(' ', '-').toLowerCase()
+    }))
+
     const locales = [
       {
         name: 'English',
@@ -124,12 +132,6 @@ export default {
     const format = ref(formats[0])
     const disabled = ref(false)
 
-    const selectFlavor = (name) => {
-      let i = flavors.map(f => f.name).indexOf(name)
-      i = i >= 0 ? i : 0
-      flavor.value = flavors[i]
-    }
-
     const src = computed(() => {
       const params = {
         locale: locale.value,
@@ -138,16 +140,16 @@ export default {
         ...(disabled.value ? { disabled:true } : {})
       }
       const query = new URLSearchParams(params)
-      const path = 'demo/' + flavor.value.name.replace(' ', '-').toLowerCase() + '/index.html?' + query.toString()
+      const path = 'demo/' + flavor.value.value + '/index.html?' + query.toString()
 
+      console.log("src", path)
       return withBase(path)
     })
 
     return {
       src,
       flavor: flavor,
       flavors,
-      selectFlavor,
       toggle: ref(0),
       locales,
       locale: locale,

diff --git a/docs/src/guide/getting-started-ant.md b/docs/src/guide/getting-started-ant.md
@@ -7,8 +7,11 @@ The fastest way to get started, is to use one of the prebuilt components.
 - cron-ant - cron editor for [Ant Design Vue](https://antdv.com/)
 - [cron-element-plus](./getting-started-element-plus) - cron editor for [Element Plus](https://element-plus.org/en-US/)
 - [cron-naive](./getting-started-naive-ui) - cron editor for [Naive UI](https://www.naiveui.com)
+- [cron-prime](./getting-started-prime) - cron editor for [PrimeVue](https://primevue.org/)
 - [cron-quasar](./getting-started-quasar) - cron editor for [Quasar](https://quasar.dev/)
 - [cron-vuetify](./getting-started-vuetify) - cron editor for [Vuetify.js](https://next.vuetifyjs.com/en/)
+
+
 ## Requirements
 
 Make sure to install and setup all requirements.

diff --git a/docs/src/guide/getting-started-core.md b/docs/src/guide/getting-started-core.md
@@ -7,9 +7,12 @@ The fastest way to get started, is to use one of the prebuilt components.
 - [cron-ant](./getting-started-ant) - cron editor for [Ant Design Vue](https://antdv.com/)
 - [cron-element-plus](./getting-started-element-plus) - cron editor for [Element Plus](https://element-plus.org/en-US/)
 - [cron-naive](./getting-started-naive-ui) - cron editor for [Naive UI](https://www.naiveui.com)
+- [cron-prime](./getting-started-prime) - cron editor for [PrimeVue](https://primevue.org/)
 - [cron-quasar](./getting-started-quasar) - cron editor for [Quasar](https://quasar.dev/)
 - [cron-vuetify](./getting-started-vuetify) - cron editor for [Vuetify.js](https://next.vuetifyjs.com/en/)
 
+
+
 ## Installation
 
 Open up a terminal and run the following command:

diff --git a/docs/src/guide/getting-started-element-plus.md b/docs/src/guide/getting-started-element-plus.md
@@ -7,8 +7,11 @@ The fastest way to get started, is to use one of the prebuilt components.
 - [cron-ant](./getting-started-ant) - cron editor for [Ant Design Vue](https://antdv.com/)
 - cron-element-plus - cron editor for [Element Plus](https://element-plus.org/en-US/)
 - [cron-naive](./getting-started-naive-ui) - cron editor for [Naive UI](https://www.naiveui.com)
+- [cron-prime](./getting-started-prime) - cron editor for [PrimeVue](https://primevue.org/)
 - [cron-quasar](./getting-started-quasar) - cron editor for [Quasar](https://quasar.dev/)
 - [cron-vuetify](./getting-started-vuetify) - cron editor for [Vuetify.js](https://next.vuetifyjs.com/en/)
+
+
 ## Requirements
 
 Make sure to install and setup all requirements.

diff --git a/docs/src/guide/getting-started-light.md b/docs/src/guide/getting-started-light.md
@@ -7,9 +7,12 @@ The fastest way to get started, is to use one of the prebuilt components.
 - [cron-ant](./getting-started-ant) - cron editor for [Ant Design Vue](https://antdv.com/)
 - [cron-element-plus](./getting-started-element-plus) - cron editor for [Element Plus](https://element-plus.org/en-US/)
 - [cron-naive](./getting-started-naive-ui) - cron editor for [Naive UI](https://www.naiveui.com)
+- [cron-prime](./getting-started-prime) - cron editor for [PrimeVue](https://primevue.org/)
 - [cron-quasar](./getting-started-quasar) - cron editor for [Quasar](https://quasar.dev/)
 - [cron-vuetify](./getting-started-vuetify) - cron editor for [Vuetify.js](https://next.vuetifyjs.com/en/)
 
+
+
 ## Installation
 
 Open up a terminal and run the following command:

diff --git a/docs/src/guide/getting-started-naive-ui.md b/docs/src/guide/getting-started-naive-ui.md
@@ -7,8 +7,11 @@ The fastest way to get started, is to use one of the prebuilt components.
 - [cron-ant](./getting-started-ant) - cron editor for [Ant Design Vue](https://antdv.com/)
 - [cron-element-plus](./getting-started-element-plus) - cron editor for [Element Plus](https://element-plus.org/en-US/)
 - cron-naive - cron editor for [Naive UI](https://www.naiveui.com)
+- [cron-prime](./getting-started-prime) - cron editor for [PrimeVue](https://primevue.org/)
 - [cron-quasar](./getting-started-quasar) - cron editor for [Quasar](https://quasar.dev/)
 - [cron-vuetify](./getting-started-vuetify) - cron editor for [Vuetify.js](https://next.vuetifyjs.com/en/)
+
+
 ## Requirements
 
 Make sure to install and setup all requirements.