@zap-wunschlachen/wl-shared-components 1.0.24 → 1.0.26

package/src/i18n/i18n.ts

@@ -1,16 +1,16 @@
-import { createI18n } from 'vue-i18n';
-import enMessages from './locales/en.json';
-import deMessages from './locales/de.json';
-
-const libraryMessages = {
-  en: enMessages,
-  de: deMessages,
-};
-
-export const createInternalI18n = () => {
-  return createI18n({
-    locale: 'de',
-    fallbackLocale: 'de',
-    messages: libraryMessages,
-  });
+import { createI18n } from 'vue-i18n';
+import enMessages from './locales/en.json';
+import deMessages from './locales/de.json';
+
+const libraryMessages = {
+  en: enMessages,
+  de: deMessages,
+};
+
+export const createInternalI18n = () => {
+  return createI18n({
+    locale: 'de',
+    fallbackLocale: 'de',
+    messages: libraryMessages,
+  });
 };

package/src/i18n/locales/de.json

@@ -1,31 +1,31 @@
-{
-  "wl": {
-    "date_input": {
-      "placeholder": "TT.MM.JJJJ",
-      "invalid_date": "Bitte ein gültiges Datum eingeben",
-      "min_date_error": "Das Datum darf nicht vor {date} liegen",
-      "max_date_error": "Das Datum darf nicht nach {date} liegen"
-    },
-    "input": {
-      "placeholder": "Geben Sie Ihren Text ein"
-    },
-    "otp_input": {
-      "enter_sms_code": "Bitte den per SMS gesendeten Code eingeben",
-      "code_was_sent": "Code an Nummer {phoneNumber} gesendet",
-      "confirm": "Bestätigen",
-      "resend": "Code erneut senden"
-    },
-    "appointment_card": {
-      "uhr": "Uhr",
-      "unknown_patient": "Unbekannter Patient",
-      "confirm": "Termin bestätigen",
-      "cancel": "Termin stornieren",
-      "reschedule": "Termin verschieben",
-      "reschedule_after_cancellation": "Diesen Termin nochmal buchen",
-      "cancelled": "Termin storniert",
-      "fill_form_title": "Anamnesebogen benötigt!",
-      "fill_form_description": "Bitte füllen Sie diesen vor ihren Termin aus",
-      "anamnese_form": "Anamnesebogen"
-    }
-  }
+{
+  "wl": {
+    "date_input": {
+      "placeholder": "TT.MM.JJJJ",
+      "invalid_date": "Bitte ein gültiges Datum eingeben",
+      "min_date_error": "Das Datum darf nicht vor {date} liegen",
+      "max_date_error": "Das Datum darf nicht nach {date} liegen"
+    },
+    "input": {
+      "placeholder": "Geben Sie Ihren Text ein"
+    },
+    "otp_input": {
+      "enter_sms_code": "Bitte den per SMS gesendeten Code eingeben",
+      "code_was_sent": "Code an Nummer {phoneNumber} gesendet",
+      "confirm": "Bestätigen",
+      "resend": "Code erneut senden"
+    },
+    "appointment_card": {
+      "uhr": "Uhr",
+      "unknown_patient": "Unbekannter Patient",
+      "confirm": "Termin bestätigen",
+      "cancel": "Termin stornieren",
+      "reschedule": "Termin verschieben",
+      "reschedule_after_cancellation": "Diesen Termin nochmal buchen",
+      "cancelled": "Termin storniert",
+      "fill_form_title": "Anamnesebogen benötigt!",
+      "fill_form_description": "Bitte füllen Sie diesen vor ihren Termin aus",
+      "anamnese_form": "Anamnesebogen"
+    }
+  }
 }

package/src/i18n/locales/en.json

@@ -1,31 +1,31 @@
-{
-  "wl": {
-    "date_input": {
-      "placeholder": "DD.MM.YYYY",
-      "invalid_date": "Please enter a valid date",
-      "min_date_error": "The date must not be before {date}",
-      "max_date_error": "The date must not be after {date}"
-    },
-    "input": {
-      "placeholder": "Enter your text"
-    },
-    "otp_input": {
-      "enter_sms_code": "Please enter the code sent via SMS",
-      "code_was_sent": "Code sent to number {phoneNumber}",
-      "confirm": "Confirm",
-      "resend": "Resend code"
-    },
-    "appointment_card": {
-      "uhr": "o'clock",
-      "unknown_patient": "Unknown patient",
-      "confirm": "Confirm appointment",
-      "cancel": "Cancel appointment",
-      "reschedule": "Reschedule appointment",
-      "reschedule_after_cancellation": "Book this appointment again",
-      "cancelled": "Appointment cancelled",
-      "fill_form_title": "Medical history form required!",
-      "fill_form_description": "Please fill this out before your appointment",
-      "anamnese_form": "Medical history form"
-    }
-  }
+{
+  "wl": {
+    "date_input": {
+      "placeholder": "DD.MM.YYYY",
+      "invalid_date": "Please enter a valid date",
+      "min_date_error": "The date must not be before {date}",
+      "max_date_error": "The date must not be after {date}"
+    },
+    "input": {
+      "placeholder": "Enter your text"
+    },
+    "otp_input": {
+      "enter_sms_code": "Please enter the code sent via SMS",
+      "code_was_sent": "Code sent to number {phoneNumber}",
+      "confirm": "Confirm",
+      "resend": "Resend code"
+    },
+    "appointment_card": {
+      "uhr": "o'clock",
+      "unknown_patient": "Unknown patient",
+      "confirm": "Confirm appointment",
+      "cancel": "Cancel appointment",
+      "reschedule": "Reschedule appointment",
+      "reschedule_after_cancellation": "Book this appointment again",
+      "cancelled": "Appointment cancelled",
+      "fill_form_title": "Medical history form required!",
+      "fill_form_description": "Please fill this out before your appointment",
+      "anamnese_form": "Medical history form"
+    }
+  }
 }

package/src/index.ts

@@ -1,34 +1,34 @@
-// src/index.ts
-
-// Import global CSS files
-import './assets/css/base.css';
-import './assets/css/variables.css';
-
-// Import all components
-import * as components from './components';
-
-// Import the App type from Vue
-import type { App } from 'vue';
-import { createInternalI18n } from './i18n/i18n';
-
-// Define the install function with proper typing
-const install = (app: App) => {
-  if (!app?.config?.globalProperties?.$i18n) {
-    const i18n = createInternalI18n();
-    app.use(i18n);
-  }
-
-  const prefix = 'WL'; // Hardcoded prefix
-  for (const [componentName, component] of Object.entries(components)) {
-    app.component(`${prefix}${componentName}`, component);
-  }
-};
-
-// Export the install function as a named export
-export const WlSharedComponents = { install };
-
-// Export each individual component
-export * from './components';
-
-// Export utilities
-export * from './utils';
+// src/index.ts
+
+// Import global CSS files
+import './assets/css/base.css';
+import './assets/css/variables.css';
+
+// Import all components
+import * as components from './components';
+
+// Import the App type from Vue
+import type { App } from 'vue';
+import { createInternalI18n } from './i18n/i18n';
+
+// Define the install function with proper typing
+const install = (app: App) => {
+  if (!app?.config?.globalProperties?.$i18n) {
+    const i18n = createInternalI18n();
+    app.use(i18n);
+  }
+
+  const prefix = 'WL'; // Hardcoded prefix
+  for (const [componentName, component] of Object.entries(components)) {
+    app.component(`${prefix}${componentName}`, component);
+  }
+};
+
+// Export the install function as a named export
+export const WlSharedComponents = { install };
+
+// Export each individual component
+export * from './components';
+
+// Export utilities
+export * from './utils';

package/src/main.ts

@@ -1,11 +1,11 @@
-import { createApp } from 'vue';
-import App from '../App.vue';
-import vuetify from './plugins/vuetify'; // Import the Vuetify plugin
-import { createInternalI18n } from './i18n/i18n';
-import './assets/css/base.css';
-import './assets/css/variables.css';
-
-const app = createApp(App);
-app.use(vuetify); // Register Vuetify here
-app.use(createInternalI18n());
-app.mount('#app');
+import { createApp } from 'vue';
+import App from '../App.vue';
+import vuetify from './plugins/vuetify'; // Import the Vuetify plugin
+import { createInternalI18n } from './i18n/i18n';
+import './assets/css/base.css';
+import './assets/css/variables.css';
+
+const app = createApp(App);
+app.use(vuetify); // Register Vuetify here
+app.use(createInternalI18n());
+app.mount('#app');

package/src/plugins/vuetify.ts

@@ -1,131 +1,139 @@
-import { createVuetify } from 'vuetify';
-import type { ThemeDefinition } from 'vuetify';
-import 'vuetify/styles';
-import '@mdi/font/css/materialdesignicons.css'; // Import Material Design Icons CSS
-import heroicons from '../../heroicons';
-import { aliases as mdiAliases, mdi } from 'vuetify/iconsets/mdi'; // Import mdi icons
-import * as components from 'vuetify/components';
-import * as directives from 'vuetify/directives';
-
-// Define light and dark themes using direct hex color values with PascalCase
-const lightTheme: ThemeDefinition = {
-  variables: {
-    'activated-opacity': '0.2', // Adjust to your desired opacity
-    'hover-opacity': '0.2',
-  },
-  dark: false,
-  colors: {
-    'Dental-Blue-0': '#172774',
-    'Dental-Blue-1': '#111c54',
-    'Dental-Blue--1': '#4f5b95',
-    'Dental-Blue--2': '#7079a8',
-    'Dental-Blue--3': '#9198bc',
-    'Dental-Blue--4': '#cacdde',
-    'Dental-Blue--5': '#e5e6ee',
-    'Dental-Blue--6': '#f6f6f8',
-    'Dental-Light-Blue-4': '#293e52',
-    'Dental-Light-Blue-3': '#69849e',
-    'Dental-Light-Blue-2': '#93b1cf',
-    'Dental-Light-Blue-1': '#adcbe9',
-    'Dental-Light-Blue-0': '#c5e1fc',
-    'Dental-Light-Blue--1': '#dcecfc',
-    'Dental-Light-Blue--2': '#edf5fc',
-    'Dental-Light-Blue--3': '#f8fafd',
-    'Dental-Air-5': '#2e3133',
-    'Dental-Air-4': '#70767b',
-    'Dental-Air-3': '#99a2a9',
-    'Dental-Air-2': '#c5d1d9',
-    'Dental-Air-1': '#dbe8f1',
-    'Dental-Air-0': '#e4f2fb',
-    'Dental-Air--1': '#f4f9fd',
-    'Dental-Air--2': '#f9fbfd',
-    'Power-Red-3': '#1e050f',
-    'Power-Red-2': '#4a0d26',
-    'Power-Red-1': '#891747',
-    'Power-Red-0': '#f4297e',
-    'Power-Red--1': '#f769a5',
-    'Power-Red--2': '#fa9fc5',
-    'Power-Red--3': '#fcc9df',
-    'Power-Red--4': '#feeaf2',
-    'Light-Gum-4': '#1f1c1b',
-    'Light-Gum-3': '#4c4444',
-    'Light-Gum-2': '#b6a3a2',
-    'Light-Gum-1': '#edd4d2',
-    'Light-Gum-0': '#fce2df',
-    'Light-Gum--1': '#fdeeec',
-    'Light-Gum--2': '#fef3f2',
-    'Light-Gum--3': '#fef9f9',
-    'Warm-Light-5': '#10100e',
-    'Warm-Light-4': '#34322e',
-    'Warm-Light-3': '#5c5952',
-    'Warm-Light-2': '#cec7b8',
-    'Warm-Light-1': '#f0e8d6',
-    'Warm-Light-0': '#fff6e4',
-    'Warm-Light--1': '#fff8eb',
-    'Warm-Light--2': '#fffbf4',
-    'Soft-Concrete-5': '#1e1e1e',
-    'Soft-Concrete-4': '#4a4a4b',
-    'Soft-Concrete-3': '#676769',
-    'Soft-Concrete-2': '#c1c1c2',
-    'Soft-Concrete-1': '#dddddf',
-    'Soft-Concrete-0': '#f5f5f7',
-    'Soft-Concrete--1': '#f9f9fb',
-    'Soft-Concrete--2': '#fbfbfc',
-    'Error-Red-1': '#630112',
-    'Error-Red-0': '#b00020',
-    'Error-Red--1': '#e3a6b1',
-    'Success-Green-1': '#037a72',
-    'Success-Green-0': '#03dac6',
-    'Success-Green--1': '#f3fdfc',
-    'Warning-1': '#4f4700',
-    'Warning-0': '#ffe600',
-    'Warning--1': '#fff8db',
-    'Check-1': '#037a2c',
-    'Check-0': '#01d449',
-    'Check--1': '#d8fde4',
-    Trkis: '#bae6ea',
-  },
-};
-
-const darkTheme: ThemeDefinition = {
-  dark: true,
-  colors: {
-    'Dental-Blue-0': '#111c54',
-    'Dental-Light-Blue-0': '#adcbe9',
-    'Dental-Air-0': '#2e3133',
-    'Power-Red-0': '#4a0d26',
-    'Light-Gum-0': '#b6a3a2',
-    'Warm-Light-0': '#34322e',
-    'Soft-Concrete-0': '#4a4a4b',
-    'Error-Red-0': '#630112',
-    'Success-Green-0': '#037a72',
-    'Warning-0': '#4f4700',
-  },
-};
-
-export default createVuetify({
-  icons: {
-    // Set 'mdi' or 'heroicons' as the default set
-    defaultSet: 'mdi', // You can change this to 'heroicons' if you prefer
-
-    // Aliases for common icons (default aliases from mdi)
-    aliases: {
-      ...mdiAliases,
-    },
-
-    // Define both icon sets
-    sets: {
-      mdi, // Material Design Icons
-      heroicons, // Custom Heroicons set
-    },
-  },
-  components,
-  directives,
-  theme: {
-    defaultTheme: 'light',
-    themes: {
-      light: lightTheme,
-      dark: darkTheme,
-    },
-  },
-});
+import { createVuetify } from 'vuetify';
+import type { ThemeDefinition } from 'vuetify';
+import 'vuetify/styles';
+import '@mdi/font/css/materialdesignicons.css'; // Import Material Design Icons CSS
+import heroicons from '../../heroicons';
+import { aliases as mdiAliases, mdi } from 'vuetify/iconsets/mdi'; // Import mdi icons
+import * as components from 'vuetify/components';
+import * as directives from 'vuetify/directives';
+
+// Define light and dark themes using direct hex color values with PascalCase
+const lightTheme: ThemeDefinition = {
+  variables: {
+    'activated-opacity': '0.2', // Adjust to your desired opacity
+    'hover-opacity': '0.2',
+  },
+  dark: false,
+  colors: {
+    'Dental-Blue-0': '#172774',
+    'Dental-Blue-1': '#111c54',
+    'Dental-Blue--1': '#4f5b95',
+    'Dental-Blue--2': '#7079a8',
+    'Dental-Blue--3': '#9198bc',
+    'Dental-Blue--4': '#cacdde',
+    'Dental-Blue--5': '#e5e6ee',
+    'Dental-Blue--6': '#f6f6f8',
+    'Dental-Light-Blue-4': '#293e52',
+    'Dental-Light-Blue-3': '#69849e',
+    'Dental-Light-Blue-2': '#93b1cf',
+    'Dental-Light-Blue-1': '#adcbe9',
+    'Dental-Light-Blue-0': '#c5e1fc',
+    'Dental-Light-Blue--1': '#dcecfc',
+    'Dental-Light-Blue--2': '#edf5fc',
+    'Dental-Light-Blue--3': '#f8fafd',
+    'Dental-Air-5': '#2e3133',
+    'Dental-Air-4': '#70767b',
+    'Dental-Air-3': '#99a2a9',
+    'Dental-Air-2': '#c5d1d9',
+    'Dental-Air-1': '#dbe8f1',
+    'Dental-Air-0': '#e4f2fb',
+    'Dental-Air--1': '#f4f9fd',
+    'Dental-Air--2': '#f9fbfd',
+    'Power-Red-3': '#1e050f',
+    'Power-Red-2': '#4a0d26',
+    'Power-Red-1': '#891747',
+    'Power-Red-0': '#f4297e',
+    'Power-Red--1': '#f769a5',
+    'Power-Red--2': '#fa9fc5',
+    'Power-Red--3': '#fcc9df',
+    'Power-Red--4': '#feeaf2',
+    'Light-Gum-4': '#1f1c1b',
+    'Light-Gum-3': '#4c4444',
+    'Light-Gum-2': '#b6a3a2',
+    'Light-Gum-1': '#edd4d2',
+    'Light-Gum-0': '#fce2df',
+    'Light-Gum--1': '#fdeeec',
+    'Light-Gum--2': '#fef3f2',
+    'Light-Gum--3': '#fef9f9',
+    'Warm-Light-5': '#10100e',
+    'Warm-Light-4': '#34322e',
+    'Warm-Light-3': '#5c5952',
+    'Warm-Light-2': '#cec7b8',
+    'Warm-Light-1': '#f0e8d6',
+    'Warm-Light-0': '#fff6e4',
+    'Warm-Light--1': '#fff8eb',
+    'Warm-Light--2': '#fffbf4',
+    'Warm-Air--3': '#fffbf4',
+    'Warm-Air--4': '#fffdfa',
+    'Soft-Concrete-5': '#1e1e1e',
+    'Soft-Concrete-4': '#4a4a4b',
+    'Soft-Concrete-3': '#676769',
+    'Soft-Concrete-2': '#c1c1c2',
+    'Soft-Concrete-1': '#dddddf',
+    'Soft-Concrete-0': '#f5f5f7',
+    'Soft-Concrete--1': '#f9f9fb',
+    'Soft-Concrete--2': '#fbfbfc',
+    'Error-Red-1': '#630112',
+    'Error-Red-0': '#b00020',
+    'Error-Red--1': '#e3a6b1',
+    'Success-Green-1': '#037a72',
+    'Success-Green-0': '#03dac6',
+    'Success-Green--1': '#f3fdfc',
+    'Warning-1': '#4f4700',
+    'Warning-0': '#ffe600',
+    'Warning--1': '#fff8db',
+    'Check-1': '#037a2c',
+    'Check-0': '#01d449',
+    'Check--1': '#d8fde4',
+    Trkis: '#bae6ea',
+    /*White Cocoon*/
+    'Light-Nude-3': '#fffcf8',
+    'Dark-Nude-0': '#c4aea1',
+    'Night-Nude-0': '#a1978f',
+    'Dark-Nude-2': '#7F7168',
+    'Dark-Nude-3': '#453D39',
+  },
+};
+
+const darkTheme: ThemeDefinition = {
+  dark: true,
+  colors: {
+    'Dental-Blue-0': '#111c54',
+    'Dental-Light-Blue-0': '#adcbe9',
+    'Dental-Air-0': '#2e3133',
+    'Power-Red-0': '#4a0d26',
+    'Light-Gum-0': '#b6a3a2',
+    'Warm-Light-0': '#34322e',
+    'Soft-Concrete-0': '#4a4a4b',
+    'Error-Red-0': '#630112',
+    'Success-Green-0': '#037a72',
+    'Warning-0': '#4f4700',
+  },
+};
+
+export default createVuetify({
+  icons: {
+    // Set 'mdi' or 'heroicons' as the default set
+    defaultSet: 'mdi', // You can change this to 'heroicons' if you prefer
+
+    // Aliases for common icons (default aliases from mdi)
+    aliases: {
+      ...mdiAliases,
+    },
+
+    // Define both icon sets
+    sets: {
+      mdi, // Material Design Icons
+      heroicons, // Custom Heroicons set
+    },
+  },
+  components,
+  directives,
+  theme: {
+    defaultTheme: 'light',
+    themes: {
+      light: lightTheme,
+      dark: darkTheme,
+    },
+  },
+});

package/src/shims-vue.d.ts

@@ -1,10 +1,10 @@
-// src/shims-vue.d.ts
-declare module '*.vue' {
-  import { DefineComponent } from 'vue';
-  const component: DefineComponent<
-    Record<string, unknown>,
-    Record<string, unknown>,
-    any
-  >;
-  export default component;
-}
+// src/shims-vue.d.ts
+declare module '*.vue' {
+  import { DefineComponent } from 'vue';
+  const component: DefineComponent<
+    Record<string, unknown>,
+    Record<string, unknown>,
+    any
+  >;
+  export default component;
+}