@sit-onyx/nuxt 1.0.0-alpha.4 → 1.0.0-alpha.40

package/README.md

@@ -10,10 +10,10 @@
 
 # @sit-onyx/nuxt
 
-A Nuxt module to easily integrate onyx into [Nuxt Js](https://nuxt.com/) projects.
+A Nuxt module to easily integrate onyx into [Nuxt](https://nuxt.com/) projects.
 Created by [Schwarz IT](https://it.schwarz).
 
-## Adding it to a nuxt project
+## Adding it to a Nuxt project
 
 Install the module in your Nuxt application with one command:
 

package/dist/module.d.mts

@@ -1,6 +1,16 @@
 import * as _nuxt_schema from '@nuxt/schema';
 
 interface ModuleOptions {
+    /**
+     * By default, the global onyx styles (`global.css` file) will be included
+     * which applies some global styles like background color and font styles.
+     * This is recommended when building a whole application with onyx.
+     *
+     * You can set this option to `true` to disable this.
+     *
+     * @see https://onyx.schwarz/development/#installation
+     */
+    disableGlobalStyles?: boolean;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions>;
 

package/dist/module.d.ts

@@ -1,6 +1,16 @@
 import * as _nuxt_schema from '@nuxt/schema';
 
 interface ModuleOptions {
+    /**
+     * By default, the global onyx styles (`global.css` file) will be included
+     * which applies some global styles like background color and font styles.
+     * This is recommended when building a whole application with onyx.
+     *
+     * You can set this option to `true` to disable this.
+     *
+     * @see https://onyx.schwarz/development/#installation
+     */
+    disableGlobalStyles?: boolean;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions>;
 

package/dist/module.json

@@ -1,9 +1,9 @@
 {
-  "name": "onyx-nuxt",
+  "name": "@sit-onyx/nuxt",
   "configKey": "onyx",
-  "version": "1.0.0-alpha.3",
+  "version": "1.0.0-alpha.39",
   "builder": {
-    "@nuxt/module-builder": "0.7.0",
+    "@nuxt/module-builder": "0.8.0",
     "unbuild": "unknown"
   }
 }

package/dist/module.mjs

@@ -1,15 +1,20 @@
-import { defineNuxtModule, addComponent } from '@nuxt/kit';
+import { defineNuxtModule, useLogger, createResolver, addComponent, addPlugin } from '@nuxt/kit';
 import * as onyx from 'sit-onyx';
 
 const module = defineNuxtModule({
   meta: {
-    name: "onyx-nuxt",
+    name: "@sit-onyx/nuxt",
     configKey: "onyx"
   },
   defaults: {},
-  setup(_options, nuxt) {
+  setup(options, nuxt) {
+    const logger = useLogger("@sit-onyx/nuxt");
+    const { resolve } = createResolver(import.meta.url);
     nuxt.options.postcss.plugins.cssnano = { preset: ["default", { calc: false }] };
     nuxt.options.css.push("sit-onyx/style.css");
+    if (!options.disableGlobalStyles) {
+      nuxt.options.css.push("sit-onyx/global.css");
+    }
     Object.keys(onyx).filter((namedExport) => namedExport.startsWith("Onyx")).forEach((component) => {
       addComponent({
         filePath: "sit-onyx",
@@ -17,7 +22,44 @@ const module = defineNuxtModule({
         export: component
       });
     });
+    const i18nModuleIndex = getModuleIndex(
+      nuxt.options.modules,
+      "@nuxtjs/i18n",
+      "@nuxtjs/i18n-edge"
+    );
+    const onyxModuleIndex = getModuleIndex(nuxt.options.modules, "@sit-onyx/nuxt");
+    if (onyxModuleIndex > i18nModuleIndex) {
+      logger.warn(
+        "The @nuxtjs/i18n module was registered before the @sit-onyx/nuxt module. The default translations of onyx won't be loaded, please register the @sit-onyx/nuxt module before @nuxtjs/i18n"
+      );
+    }
+    if (i18nModuleIndex >= 0) {
+      const registerOnyxLocales = (register) => {
+        register({
+          langDir: resolve("./runtime/locales"),
+          locales: [
+            // we need to use .js files instead of .ts because the .ts files would be compiled to .js in the build step, so
+            // when projects use this nuxt module, .ts files will throw a "can not find file" error
+            { code: "de-DE", file: "de-DE.js" },
+            { code: "en-US", file: "en-US.js" },
+            { code: "ko-KR", file: "ko-KR.js" }
+          ]
+        });
+      };
+      nuxt.hook("i18n:registerModule", registerOnyxLocales);
+      addPlugin({ src: resolve("./runtime/plugins/onyx") });
+    }
   }
 });
+function getModuleIndex(modules, ...moduleNames) {
+  for (let i = 0; i < modules.length; i++) {
+    const module = modules[i];
+    if (typeof module === "string" && moduleNames.includes(module))
+      return i;
+    if (Array.isArray(module) && moduleNames.includes(module[0]))
+      return i;
+  }
+  return -1;
+}
 
 export { module as default };

package/dist/runtime/locales/de-DE.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/runtime/locales/de-DE.js

@@ -0,0 +1,7 @@
+// @ts-check
+import { defineI18nLocale } from "#i18n";
+import deDE from "sit-onyx/locales/de-DE.json";
+
+export default defineI18nLocale(() => {
+  return { onyx: deDE };
+});

package/dist/runtime/locales/en-US.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/runtime/locales/en-US.js

@@ -0,0 +1,7 @@
+// @ts-check
+import { defineI18nLocale } from "#i18n";
+import enUS from "sit-onyx/locales/en-US.json";
+
+export default defineI18nLocale(() => {
+  return { onyx: enUS };
+});

package/dist/runtime/locales/ko-KR.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/runtime/locales/ko-KR.js

@@ -0,0 +1,7 @@
+// @ts-check
+import { defineI18nLocale } from "#i18n";
+import koKR from "sit-onyx/locales/ko-KR.json";
+
+export default defineI18nLocale(() => {
+  return { onyx: koKR };
+});

package/dist/runtime/plugins/onyx.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("#app").Plugin<Record<string, unknown>> & import("#app").ObjectPlugin<Record<string, unknown>>;
+export default _default;

package/dist/runtime/plugins/onyx.js

@@ -0,0 +1,25 @@
+import { computed, watchEffect } from "#imports";
+import { defineNuxtPlugin, useNuxtApp } from "nuxt/app";
+import { provideI18n, syncGlobalOptionalText } from "sit-onyx";
+export default defineNuxtPlugin({
+  name: "onyx:plugin",
+  // @ts-ignore: dependency comes from @nuxtjs/i18n
+  dependsOn: ["i18n:plugin"],
+  setup: (app) => {
+    const { t: translate, localeProperties } = useNuxtApp().$i18n;
+    const t = computed(() => {
+      return (key, placeholders) => {
+        return translate(`onyx.${key}`, placeholders?.n ?? 1, { named: placeholders });
+      };
+    });
+    provideI18n(app.vueApp, {
+      locale: computed(() => localeProperties.value.iso ?? "en-US"),
+      t
+    });
+    app.hook("app:beforeMount", () => {
+      watchEffect(() => {
+        syncGlobalOptionalText(translate(`onyx.optional`));
+      });
+    });
+  }
+});

package/dist/types.d.mts

@@ -1,16 +1 @@
-
-import type { ModuleOptions } from './module.js'
-
-
-declare module '@nuxt/schema' {
-  interface NuxtConfig { ['onyx']?: Partial<ModuleOptions> }
-  interface NuxtOptions { ['onyx']?: ModuleOptions }
-}
-
-declare module 'nuxt/schema' {
-  interface NuxtConfig { ['onyx']?: Partial<ModuleOptions> }
-  interface NuxtOptions { ['onyx']?: ModuleOptions }
-}
-
-
-export type { ModuleOptions, default } from './module.js'
+export { type ModuleOptions, default } from './module.js'

package/dist/types.d.ts

@@ -1,16 +1 @@
-
-import type { ModuleOptions } from './module'
-
-
-declare module '@nuxt/schema' {
-  interface NuxtConfig { ['onyx']?: Partial<ModuleOptions> }
-  interface NuxtOptions { ['onyx']?: ModuleOptions }
-}
-
-declare module 'nuxt/schema' {
-  interface NuxtConfig { ['onyx']?: Partial<ModuleOptions> }
-  interface NuxtOptions { ['onyx']?: ModuleOptions }
-}
-
-
-export type { ModuleOptions, default } from './module'
+export { type ModuleOptions, default } from './module'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sit-onyx/nuxt",
-  "version": "1.0.0-alpha.4",
+  "version": "1.0.0-alpha.40",
   "description": "A Nuxt module to easily integrate onyx into Nuxt projects",
   "author": "Schwarz IT KG",
   "license": "Apache-2.0",
@@ -26,17 +26,19 @@
     "dist"
   ],
   "dependencies": {
-    "@nuxt/kit": "^3.11.2"
+    "@nuxt/kit": "^3.12.2"
   },
   "devDependencies": {
-    "@nuxt/devtools": "^1.3.3",
-    "@nuxt/module-builder": "~0.7.0",
-    "@nuxt/schema": "^3.11.2",
+    "@nuxt/devtools": "^1.3.7",
+    "@nuxt/module-builder": "~0.8.0",
+    "@nuxt/schema": "^3.12.2",
     "@nuxt/test-utils": "^3.13.1",
-    "nuxt": "^3.11.2"
+    "@nuxtjs/i18n": "^8.3.1",
+    "nuxt": "^3.12.2",
+    "vue-i18n": "^9.13.1"
   },
   "peerDependencies": {
-    "sit-onyx": "^1.0.0-alpha.124"
+    "sit-onyx": "^1.0.0-alpha.159"
   },
   "scripts": {
     "dev": "nuxi dev playground",