nuxt-ignis 0.2.5 → 0.3.0

package/.nuxt/types/schema.d.ts

@@ -0,0 +1,450 @@
+import { NuxtModule, RuntimeConfig } from '@nuxt/schema'
+declare module '@nuxt/schema' {
+  interface NuxtOptions {
+    /**
+     * Configuration for `@nuxt/eslint`
+     */
+    ["eslint"]: typeof import("@nuxt/eslint").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/fonts`
+     */
+    ["fonts"]: typeof import("@nuxt/fonts").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/image`
+     */
+    ["image"]: typeof import("@nuxt/image").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@pinia/nuxt`
+     */
+    ["pinia"]: typeof import("@pinia/nuxt").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/scripts`
+     */
+    ["scripts"]: typeof import("@nuxt/scripts").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `nuxt-security`
+     */
+    ["security"]: typeof import("nuxt-security").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@vueuse/nuxt`
+     */
+    ["vueuse"]: typeof import("@vueuse/nuxt").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/test-utils/module`
+     */
+    ["testUtils"]: typeof import("@nuxt/test-utils/module").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/devtools`
+     */
+    ["devtools"]: typeof import("@nuxt/devtools").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/telemetry`
+     */
+    ["telemetry"]: typeof import("@nuxt/telemetry").default extends NuxtModule<infer O> ? O : Record<string, any>
+  }
+  interface NuxtConfig {
+    /**
+     * Configuration for `@nuxt/eslint`
+     */
+    ["eslint"]?: typeof import("@nuxt/eslint").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/fonts`
+     */
+    ["fonts"]?: typeof import("@nuxt/fonts").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/image`
+     */
+    ["image"]?: typeof import("@nuxt/image").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@pinia/nuxt`
+     */
+    ["pinia"]?: typeof import("@pinia/nuxt").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/scripts`
+     */
+    ["scripts"]?: typeof import("@nuxt/scripts").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `nuxt-security`
+     */
+    ["security"]?: typeof import("nuxt-security").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@vueuse/nuxt`
+     */
+    ["vueuse"]?: typeof import("@vueuse/nuxt").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/test-utils/module`
+     */
+    ["testUtils"]?: typeof import("@nuxt/test-utils/module").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/devtools`
+     */
+    ["devtools"]?: typeof import("@nuxt/devtools").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/telemetry`
+     */
+    ["telemetry"]?: typeof import("@nuxt/telemetry").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    modules?: (undefined | null | false | NuxtModule<any> | string | [NuxtModule | string, Record<string, any>] | ["@nuxt/eslint", Exclude<NuxtConfig["eslint"], boolean>] | ["@nuxt/fonts", Exclude<NuxtConfig["fonts"], boolean>] | ["@nuxt/image", Exclude<NuxtConfig["image"], boolean>] | ["@pinia/nuxt", Exclude<NuxtConfig["pinia"], boolean>] | ["@nuxt/scripts", Exclude<NuxtConfig["scripts"], boolean>] | ["nuxt-security", Exclude<NuxtConfig["security"], boolean>] | ["@vueuse/nuxt", Exclude<NuxtConfig["vueuse"], boolean>] | ["@nuxt/test-utils/module", Exclude<NuxtConfig["testUtils"], boolean>] | ["@nuxt/devtools", Exclude<NuxtConfig["devtools"], boolean>] | ["@nuxt/telemetry", Exclude<NuxtConfig["telemetry"], boolean>])[],
+  }
+}
+declare module 'nuxt/schema' {
+  interface NuxtOptions {
+    /**
+     * Configuration for `@nuxt/eslint`
+     * @see https://www.npmjs.com/package/@nuxt/eslint
+     */
+    ["eslint"]: typeof import("@nuxt/eslint").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/fonts`
+     * @see https://www.npmjs.com/package/@nuxt/fonts
+     */
+    ["fonts"]: typeof import("@nuxt/fonts").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/image`
+     * @see https://www.npmjs.com/package/@nuxt/image
+     */
+    ["image"]: typeof import("@nuxt/image").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@pinia/nuxt`
+     * @see https://www.npmjs.com/package/@pinia/nuxt
+     */
+    ["pinia"]: typeof import("@pinia/nuxt").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/scripts`
+     * @see https://www.npmjs.com/package/@nuxt/scripts
+     */
+    ["scripts"]: typeof import("@nuxt/scripts").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `nuxt-security`
+     * @see https://www.npmjs.com/package/nuxt-security
+     */
+    ["security"]: typeof import("nuxt-security").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@vueuse/nuxt`
+     * @see https://www.npmjs.com/package/@vueuse/nuxt
+     */
+    ["vueuse"]: typeof import("@vueuse/nuxt").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/test-utils/module`
+     * @see https://www.npmjs.com/package/@nuxt/test-utils/module
+     */
+    ["testUtils"]: typeof import("@nuxt/test-utils/module").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/devtools`
+     * @see https://www.npmjs.com/package/@nuxt/devtools
+     */
+    ["devtools"]: typeof import("@nuxt/devtools").default extends NuxtModule<infer O> ? O : Record<string, any>
+    /**
+     * Configuration for `@nuxt/telemetry`
+     * @see https://www.npmjs.com/package/@nuxt/telemetry
+     */
+    ["telemetry"]: typeof import("@nuxt/telemetry").default extends NuxtModule<infer O> ? O : Record<string, any>
+  }
+  interface NuxtConfig {
+    /**
+     * Configuration for `@nuxt/eslint`
+     * @see https://www.npmjs.com/package/@nuxt/eslint
+     */
+    ["eslint"]?: typeof import("@nuxt/eslint").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/fonts`
+     * @see https://www.npmjs.com/package/@nuxt/fonts
+     */
+    ["fonts"]?: typeof import("@nuxt/fonts").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/image`
+     * @see https://www.npmjs.com/package/@nuxt/image
+     */
+    ["image"]?: typeof import("@nuxt/image").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@pinia/nuxt`
+     * @see https://www.npmjs.com/package/@pinia/nuxt
+     */
+    ["pinia"]?: typeof import("@pinia/nuxt").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/scripts`
+     * @see https://www.npmjs.com/package/@nuxt/scripts
+     */
+    ["scripts"]?: typeof import("@nuxt/scripts").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `nuxt-security`
+     * @see https://www.npmjs.com/package/nuxt-security
+     */
+    ["security"]?: typeof import("nuxt-security").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@vueuse/nuxt`
+     * @see https://www.npmjs.com/package/@vueuse/nuxt
+     */
+    ["vueuse"]?: typeof import("@vueuse/nuxt").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/test-utils/module`
+     * @see https://www.npmjs.com/package/@nuxt/test-utils/module
+     */
+    ["testUtils"]?: typeof import("@nuxt/test-utils/module").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/devtools`
+     * @see https://www.npmjs.com/package/@nuxt/devtools
+     */
+    ["devtools"]?: typeof import("@nuxt/devtools").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    /**
+     * Configuration for `@nuxt/telemetry`
+     * @see https://www.npmjs.com/package/@nuxt/telemetry
+     */
+    ["telemetry"]?: typeof import("@nuxt/telemetry").default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+    modules?: (undefined | null | false | NuxtModule<any> | string | [NuxtModule | string, Record<string, any>] | ["@nuxt/eslint", Exclude<NuxtConfig["eslint"], boolean>] | ["@nuxt/fonts", Exclude<NuxtConfig["fonts"], boolean>] | ["@nuxt/image", Exclude<NuxtConfig["image"], boolean>] | ["@pinia/nuxt", Exclude<NuxtConfig["pinia"], boolean>] | ["@nuxt/scripts", Exclude<NuxtConfig["scripts"], boolean>] | ["nuxt-security", Exclude<NuxtConfig["security"], boolean>] | ["@vueuse/nuxt", Exclude<NuxtConfig["vueuse"], boolean>] | ["@nuxt/test-utils/module", Exclude<NuxtConfig["testUtils"], boolean>] | ["@nuxt/devtools", Exclude<NuxtConfig["devtools"], boolean>] | ["@nuxt/telemetry", Exclude<NuxtConfig["telemetry"], boolean>])[],
+  }
+  interface RuntimeConfig {
+   app: {
+      buildId: string,
+
+      baseURL: string,
+
+      buildAssetsDir: string,
+
+      cdnURL: string,
+   },
+
+   nitro: {
+      envPrefix: string,
+   },
+
+   "nuxt-scripts": {
+      version: string,
+   },
+
+   private: {
+      basicAuth: boolean,
+   },
+
+   security: {
+      strict: boolean,
+
+      headers: {
+         crossOriginResourcePolicy: string,
+
+         crossOriginOpenerPolicy: string,
+
+         crossOriginEmbedderPolicy: string,
+
+         contentSecurityPolicy: {
+            "base-uri": Array<string>,
+
+            "font-src": Array<string>,
+
+            "form-action": Array<string>,
+
+            "frame-ancestors": Array<string>,
+
+            "img-src": Array<string>,
+
+            "object-src": Array<string>,
+
+            "script-src-attr": Array<string>,
+
+            "style-src": Array<string>,
+
+            "script-src": Array<string>,
+
+            "upgrade-insecure-requests": boolean,
+         },
+
+         originAgentCluster: string,
+
+         referrerPolicy: string,
+
+         strictTransportSecurity: {
+            maxAge: number,
+
+            includeSubdomains: boolean,
+         },
+
+         xContentTypeOptions: string,
+
+         xDNSPrefetchControl: string,
+
+         xDownloadOptions: string,
+
+         xFrameOptions: string,
+
+         xPermittedCrossDomainPolicies: string,
+
+         xXSSProtection: string,
+
+         permissionsPolicy: {
+            camera: Array<any>,
+
+            "display-capture": Array<any>,
+
+            fullscreen: Array<any>,
+
+            geolocation: Array<any>,
+
+            microphone: Array<any>,
+         },
+      },
+
+      requestSizeLimiter: {
+         maxRequestSizeInBytes: number,
+
+         maxUploadFileRequestInBytes: number,
+
+         throwError: boolean,
+      },
+
+      rateLimiter: {
+         tokensPerInterval: number,
+
+         interval: number,
+
+         headers: boolean,
+
+         driver: {
+            name: string,
+         },
+
+         whiteList: any,
+
+         throwError: boolean,
+      },
+
+      xssValidator: {
+         methods: Array<string>,
+
+         throwError: boolean,
+      },
+
+      corsHandler: {
+         origin: string,
+
+         methods: Array<string>,
+
+         preflight: {
+            statusCode: number,
+         },
+      },
+
+      allowedMethodsRestricter: {
+         methods: string,
+
+         throwError: boolean,
+      },
+
+      hidePoweredBy: boolean,
+
+      enabled: boolean,
+
+      csrf: boolean,
+
+      nonce: boolean,
+
+      removeLoggers: boolean,
+
+      ssg: {
+         meta: boolean,
+
+         hashScripts: boolean,
+
+         hashStyles: boolean,
+
+         nitroHeaders: boolean,
+
+         exportToPresets: boolean,
+      },
+
+      sri: boolean,
+   },
+  }
+  interface PublicRuntimeConfig {
+   ignis: {
+      log: {
+         level: string,
+      },
+
+      ssr: boolean,
+
+      pages: boolean,
+
+      preset: {
+         ui: string,
+
+         db: string,
+
+         forms: string,
+      },
+
+      core: {
+         eslint: boolean,
+
+         fonts: boolean,
+
+         image: boolean,
+
+         pinia: boolean,
+
+         time: boolean,
+
+         scripts: boolean,
+
+         security: boolean,
+
+         vueuse: boolean,
+      },
+
+      ui: boolean,
+
+      tailwind: boolean,
+
+      neon: boolean,
+
+      supabase: boolean,
+
+      i18n: {
+         enabled: boolean,
+
+         default: string,
+
+         config: string,
+      },
+
+      formkit: {
+         enabled: boolean,
+
+         default: string,
+
+         config: string,
+      },
+
+      vueform: boolean,
+
+      content: boolean,
+
+      openprops: boolean,
+
+      pslo: {
+         enabled: boolean,
+
+         content: boolean,
+      },
+
+      seo: boolean,
+
+      auth: boolean,
+
+      warn: {
+         duplicates: boolean,
+      },
+   },
+
+   "nuxt-scripts": {
+      version: string,
+
+      defaultScriptOptions: {
+         trigger: string,
+      },
+   },
+  }
+}
+declare module 'vue' {
+        interface ComponentCustomProperties {
+          $config: RuntimeConfig
+        }
+      }

package/app.vue

@@ -1,59 +1,39 @@
 <template>
-  <div class="p-3">
-    <div class="ignis-header">
-      <img src="/nuxt-ignis.png" class="ignis-logo" :title :alt>
-      <h1 class="my-4 text-4xl text-amber-400 font-bold">
-        {{ useT("title") }}
-      </h1>
-      <img src="/nuxt-ignis.png" class="ignis-logo" :title :alt>
-    </div>
-    <div>{{ useT("subtitle") }}</div>
+  <UApp v-if="ui">
     <NuxtPage v-if="pages" />
-    <AppFeatureList v-else />
-    <CurrentTime />
-    <div class="link text-xs">
-      <NuxtLink to="https://github.com/AloisSeckar/nuxt-ignis">
-        https://github.com/AloisSeckar/nuxt-ignis
-      </NuxtLink>
-    </div>
+    <IgnisInfo v-else />
+  </UApp>
+  <div v-else>
+    <NuxtPage v-if="pages" />
+    <IgnisInfo v-else />
   </div>
 </template>
 
 <script setup lang="ts">
-import { useT } from '#imports' // requires explicit import for some reason
-
 useHead({
   title: useAppConfig().textTitle,
   htmlAttrs: {
     lang: 'en',
   },
   bodyAttrs: {
-    class: 'bg-slate-900 m-auto text-center text-white',
+    class: 'ignis-body',
   },
 })
 initConsola()
 
 log.info('Nuxt Ignis was here!')
 
-const title = useT('title')
-const alt = title
-
-const pages = useRuntimeConfig().public.ignis.pages
+const config = useRuntimeConfig().public.ignis
+const pages = config.pages
+const ui = config.ui || config.preset.ui
 </script>
 
 <style scoped>
-.ignis-header {
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  margin-bottom: 10px;
-}
-.ignis-logo {
-  display: inline;
-  width: 64px;
-  height: 64px;
-}
-.ignis-title {
-  margin-top: 15px;
+/* bg-slate-900 m-auto text-center text-white */
+.ignis-body {
+  margin: auto;
+  background-color: #0f172a;
+  color: white;
+  text-align: center;
 }
 </style>

package/assets/css/nuxt-ui.css

@@ -0,0 +1,16 @@
+/*
+  This will import Tailwind CSS for Nuxt UI
+  https://ui.nuxt.com/getting-started/installation/nuxt#import-tailwind-css-and-nuxt-ui-in-your-css
+
+  NUXT_PUBLIC_IGNIS_PRESET_UI=nuxt-ui or NUXT_PUBLIC_IGNIS_UI=true is required for se this feature
+*/
+
+@import "tailwindcss";
+@import "@nuxt/ui";
+
+/*
+// Tailwind v4 way of defining custom classes
+@utility <name> {
+  // css rules here
+}
+*/

package/assets/css/tailwind.css

@@ -1,49 +1,15 @@
-/* 
-  This file is auto-imported when using Tailwind CSS
+/*
+  This will import Tailwind CSS
+  https://tailwindcss.com/docs/installation/
 
-  Use @apply if you don't want to define style for each element separately
-
-  Read more at:
-  https://tailwindcss.com/docs/reusing-styles#extracting-classes-with-apply
-  https://tailwindcss.com/docs/functions-and-directives#apply
-
-  Use correct @layer to keep your Tailwind CSS organized:
-  https://bloggie.io/@kinopyo/organize-your-css-in-the-tailwind-style-with-layer-directive
-
-  And most importantly: THINK TWICE before using this approach!
+  NUXT_PUBLIC_IGNIS_PRESET_UI=tailwind or NUXT_PUBLIC_IGNIS_TAILWIND=true is required for se this feature
 */
 
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@layer base {
-
-    /* 
-      Tailwind CSS classes might be auto-applied to all respective elements like this.
-      However, I recommend NOT to use it like that, because this obsfucates code logic
-      and makes maintaing harder (even you should soon forgot styles are defined here)
-    */
-
-    /* NOTE: For setting "body" tag attributes, it is better to use useHead() composable - @see `app.vue`*/
-    /*
-    body {
-        @apply bg-slate-900;
-    }
-    */
+@import "tailwindcss";
 
+/*
+// Tailwind v4 way of defining custom classes
+@utility <name> {
+  // css rules here
 }
-
-@layer components {
-
-    /* 
-      Following classes are available to use throughout the app as shorthands.
-      Although still discouraged by Tailwind CSS authors, this usage makes more
-      sense, because the class name is visible and trackable in SFC templates.
-    */
-
-    .link {
-        @apply my-2 text-amber-400 hover:text-amber-200;
-    }
-
-}
+*/

package/components/AppFeature.vue

@@ -22,10 +22,13 @@
 -->
 
 <template>
-  <div class="m-1 px-2 py-1 border border-amber-300 font-bold text-lg text-feature hover:bg-slate-700">
+  <div
+    class="feature"
+    :class="active ? '' : 'feature-disabled'"
+    :title="active ? 'Active' : 'Inactive'">
     {{ text }}
-    <div v-if="showIcon" style="display: inline;">
-      <Icon name="ic:sharp-add-reaction" style="color: yellow" />
+    <div v-if="active && showIcon" class="icon">
+      <Icon name="ic:sharp-add-reaction" class="icon-color" />
     </div>
   </div>
 </template>
@@ -43,6 +46,7 @@
 const props = defineProps({
   text: { type: String, required: true },
   optionalText: { type: String, default: 'default' },
+  active: { type: Boolean, default: true },
 })
 
 /**
@@ -61,3 +65,43 @@ const showIcon = config.preset.ui === 'nuxt-ui' || config.ui
 log.debug(props.text)
 log.debug(props.optionalText)
 </script>
+
+<style scoped>
+/* avoid Tailwind CSS styles here, because Tailwind may not be enabled */
+
+/* m-1! px-2 py-1 border! border-amber-300 font-bold text-lg text-feature bg-emerald-700 hover:bg-slate-700 */
+.feature {
+  margin: 4px;
+  padding: 4px 12px;
+  border: 2px solid #fcd34d;
+  font-weight: bold;
+  background-color: #047857;
+  color: #f1f5f9;
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+.feature:hover {
+  background-color: #334155;
+  color: #3CB371;
+}
+
+/* text-gray-700 bg-gray-300! hover:bg-slate-400! */
+.feature-disabled {
+  background-color: #cbd5e1;
+  color: #334155;
+}
+.feature-disabled:hover {
+  background-color: #94a3b8;
+  color: #f1f5f9;
+}
+
+/* additional styles for displaying smiley icons */
+
+.icon {
+  display: inline;
+}
+
+.icon-color {
+  color: yellow;
+}
+</style>