@autoafleveren/ui 0.1.3 → 0.1.5

package/dist/config/eslint.cjs

@@ -182,5 +182,7 @@ module.exports = {
       pattern: '.*\\.spec\\.[tj]sx?$',
       allTestPattern: '.*\\.(test|spec)\\.[tj]sx?$',
     }],
+    '@typescript-eslint/no-floating-promises': 'off',
+    'vue/no-v-text-v-html-on-component': 'off',
   },
 };

package/dist/config/tailwind/config.cjs

@@ -74,12 +74,18 @@ module.exports = {
         800: '#166534',
         900: '#14532d',
       },
+      indigo: {
+        900: '#162C87',
+      }
     },
     screens,
     extend: {
       width: {
         141: '34.375rem',
       },
+      scale: {
+        flip: '-1',
+      }
     },
   },
   plugins: [],

package/dist/types/components/AppButton/AppButton.vue.d.ts

@@ -30,9 +30,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     colorType: ColorType;
     disabled: boolean;
 }>, {
-    leadingIcon: (_: {}) => any;
-    default: (_: {}) => any;
-    trailingIcon: (_: {}) => any;
+    leadingIcon?(_: {}): any;
+    default?(_: {}): any;
+    trailingIcon?(_: {}): any;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
@@ -45,12 +45,15 @@ type __VLS_TypePropsToRuntimeProps<T> = {
     };
 };
 type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
         default: D[K];
-    } : P[K];
+    }> : P[K];
 };
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/types/components/AppButton/ButtonIconSlot.vue.d.ts

@@ -3,7 +3,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     loading?: boolean | undefined;
 }>>>, {}>, {
-    default: (_: {}) => any;
+    default?(_: {}): any;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/dist/types/components/AppCard/AppCard.vue.d.ts

@@ -0,0 +1,55 @@
+import type { Action } from './index.d';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    bordered?: boolean | undefined;
+    title?: string | undefined;
+    icon?: string | undefined;
+    actions?: Action[] | undefined;
+}>, {
+    title: undefined;
+    icon: undefined;
+    bordered: boolean;
+    actions: undefined;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    bordered?: boolean | undefined;
+    title?: string | undefined;
+    icon?: string | undefined;
+    actions?: Action[] | undefined;
+}>, {
+    title: undefined;
+    icon: undefined;
+    bordered: boolean;
+    actions: undefined;
+}>>>, {
+    title: string;
+    icon: string;
+    bordered: boolean;
+    actions: Action[];
+}>, {
+    icon?(_: {}): any;
+    title?(_: {}): any;
+    default?(_: {}): any;
+    actions?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/types/components/AppCard/CardAction.vue.d.ts

@@ -0,0 +1,16 @@
+import type { Action } from './index.d';
+declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
+    item: Action;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    item: Action;
+}>>>, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/types/components/AppCard/CardIconSlot.vue.d.ts

@@ -0,0 +1,23 @@
+import type { Component } from 'vue';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
+    icon?: string | Component | undefined;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    icon?: string | Component | undefined;
+}>>>, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/AppLicensePlate/AppLicensePlate.vue.d.ts

@@ -0,0 +1,41 @@
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    license?: string | undefined;
+    country?: "NL" | undefined;
+}>, {
+    license: undefined;
+    country: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    license?: string | undefined;
+    country?: "NL" | undefined;
+}>, {
+    license: undefined;
+    country: string;
+}>>>, {
+    license: string;
+    country: "NL";
+}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/types/components/AppLoader/AppLoader.vue.d.ts

@@ -21,7 +21,10 @@ type __VLS_TypePropsToRuntimeProps<T> = {
     };
 };
 type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
         default: D[K];
-    } : P[K];
+    }> : P[K];
 };
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/types/components/index.d.ts

@@ -1,3 +1,5 @@
 export { default as AppButton } from './AppButton/AppButton.vue';
+export { default as AppCard } from './AppCard/AppCard.vue';
 export { default as AppLoader } from './AppLoader/AppLoader.vue';
 export { default as AppNavigationMenu } from './AppNavigationMenu/AppNavigationMenu.vue';
+export { default as AppLicensePlate } from './AppLicensePlate/AppLicensePlate.vue';

package/dist/types/composables/useNavigation/index.d.ts

@@ -140,7 +140,7 @@ export declare function useNavigation(): {
     }[]>;
     mainMenuOpen: import("vue").Ref<boolean>;
     mobileMenuOpen: import("vue").Ref<boolean>;
-    navigationComponent: import("vue").ShallowRef<Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions> | "a">;
+    navigationComponent: import("vue").ShallowRef<"a" | Component>;
     logo: import("vue").Ref<string | import("vue").FunctionalComponent<any, any> | {
         new (...args: any[]): any;
         __isFragment?: undefined;

package/dist/types/layouts/Auth/Auth.vue.d.ts

@@ -1,5 +1,5 @@
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>, {
-    default: (_: {}) => any;
+    default?(_: {}): any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/types/layouts/Base/Base.vue.d.ts

@@ -1,6 +1,7 @@
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>, {
-    default: (_: {}) => any;
-    sidebar: (_: {}) => any;
+    top?(_: {}): any;
+    default?(_: {}): any;
+    sidebar?(_: {}): any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/ui-library.css

@@ -1,3 +1,3 @@
 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
 
-/*! tailwindcss v3.3.2 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:Inter;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}:root{--color-primary:#e25c2a;--color-primary-active:#c2410c;--color-secondary:#1e243b;--color-secondary-active:#1e243b}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.visible{visibility:visible}.\!static{position:static!important}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.bottom-5{bottom:1.25rem}.right-5{right:1.25rem}.top-0{top:0}.top-20{top:5rem}.z-50{z-index:50}.order-1{order:1}.order-2{order:2}.order-3{order:3}.mx-auto{margin-left:auto;margin-right:auto}.mb-2{margin-bottom:.5rem}.mb-auto{margin-bottom:auto}.ml-3{margin-left:.75rem}.mr-3{margin-right:.75rem}.mt-2{margin-top:.5rem}.mt-5{margin-top:1.25rem}.mt-auto{margin-top:auto}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.\!h-6{height:1.5rem!important}.h-0{height:0}.h-10{height:2.5rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-full{height:100%}.h-screen{height:100vh}.min-h-screen{min-height:100vh}.\!w-20{width:5rem!important}.w-0{width:0}.w-1\/2{width:50%}.w-1\/3{width:33.333333%}.w-10{width:2.5rem}.w-141{width:34.375rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-full{width:100%}.max-w-full{max-width:100%}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.grow-0{flex-grow:0}.-translate-y-2{--tw-translate-y:-0.5rem}.-translate-y-2,.translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-0{--tw-translate-y:0px}.translate-y-full{--tw-translate-y:100%}.transform,.translate-y-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-3{gap:.75rem}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.\!rounded-full{border-radius:9999px!important}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-sm{border-radius:.125rem}.rounded-l-2xl{border-top-left-radius:1rem;border-bottom-left-radius:1rem}.border{border-width:1px}.border-0{border-width:0}.border-primary{border-color:var(--color-primary)}.border-transparent{border-color:#0000}.bg-primary{background-color:var(--color-primary)}.bg-transparent{background-color:initial}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-zinc-100{--tw-bg-opacity:1;background-color:rgb(244 244 245/var(--tw-bg-opacity))}.bg-zinc-50{--tw-bg-opacity:1;background-color:rgb(250 250 250/var(--tw-bg-opacity))}.object-fill{-o-object-fit:fill;object-fit:fill}.\!p-2{padding:.5rem!important}.p-4{padding:1rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pl-7{padding-left:1.75rem}.text-center{text-align:center}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.font-semibold{font-weight:600}.capitalize{text-transform:capitalize}.text-black{--tw-text-opacity:1;color:rgb(30 30 30/var(--tw-text-opacity))}.text-primary{color:var(--color-primary)}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.text-zinc-900{--tw-text-opacity:1;color:rgb(24 24 27/var(--tw-text-opacity))}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.hover\:bg-primary-active:hover{background-color:var(--color-primary-active)}.hover\:text-primary:hover{color:var(--color-primary)}.focus\:outline-none:focus{outline:2px solid #0000;outline-offset:2px}.enabled\:hover\:bg-primary:hover:enabled{background-color:var(--color-primary)}.enabled\:hover\:bg-primary-active:hover:enabled{background-color:var(--color-primary-active)}.enabled\:hover\:text-white:hover:enabled{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:select-none:disabled{-webkit-user-select:none;-moz-user-select:none;user-select:none}.disabled\:opacity-50:disabled{opacity:.5}@media (min-width:992px){.md\:sticky{position:sticky}.md\:top-0{top:0}.md\:order-2{order:2}.md\:order-3{order:3}.md\:-ml-5{margin-left:-1.25rem}.md\:block{display:block}.md\:\!flex{display:flex!important}.md\:flex{display:flex}.md\:hidden{display:none}.md\:h-auto{height:auto}.md\:max-h-screen{max-height:100vh}.md\:\!w-20{width:5rem!important}.md\:w-1\/2{width:50%}.md\:w-10{width:2.5rem}.md\:max-w-lg{max-width:32rem}.md\:grow-0{flex-grow:0}.md\:flex-row{flex-direction:row}.md\:justify-center{justify-content:center}.md\:rounded-l-2xl{border-top-left-radius:1rem;border-bottom-left-radius:1rem}.md\:bg-primary{background-color:var(--color-primary)}.md\:bg-secondary{background-color:var(--color-secondary)}.md\:px-24{padding-left:6rem;padding-right:6rem}.md\:pr-7{padding-right:1.75rem}.md\:text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.md\:hover\:bg-primary-active:hover{background-color:var(--color-primary-active)}}@media (min-width:1200px){.lg\:hidden{display:none}}
+/*! tailwindcss v3.3.2 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:Inter;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}:root{--color-primary:#e25c2a;--color-primary-active:#c2410c;--color-secondary:#1e243b;--color-secondary-active:#1e243b}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.visible{visibility:visible}.\!static{position:static!important}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.bottom-5{bottom:1.25rem}.right-5{right:1.25rem}.top-0{top:0}.top-20{top:5rem}.top-5{top:1.25rem}.z-50{z-index:50}.order-1{order:1}.order-2{order:2}.order-3{order:3}.order-4{order:4}.mx-auto{margin-left:auto;margin-right:auto}.mb-2{margin-bottom:.5rem}.mb-auto{margin-bottom:auto}.ml-3{margin-left:.75rem}.ml-auto{margin-left:auto}.mr-3{margin-right:.75rem}.mt-2{margin-top:.5rem}.mt-5{margin-top:1.25rem}.mt-auto{margin-top:auto}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.\!h-6{height:1.5rem!important}.h-0{height:0}.h-10{height:2.5rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-full{height:100%}.h-screen{height:100vh}.min-h-screen{min-height:100vh}.\!w-20{width:5rem!important}.w-0{width:0}.w-1\/2{width:50%}.w-1\/3{width:33.333333%}.w-10{width:2.5rem}.w-141{width:34.375rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-full{width:100%}.max-w-full{max-width:100%}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.grow-0{flex-grow:0}.-translate-y-2{--tw-translate-y:-0.5rem}.-translate-y-2,.translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-0{--tw-translate-y:0px}.translate-y-full{--tw-translate-y:100%}.transform,.translate-y-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-3{gap:.75rem}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.\!rounded-full{border-radius:9999px!important}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-sm{border-radius:.125rem}.rounded-xl{border-radius:.75rem}.rounded-l-2xl{border-top-left-radius:1rem;border-bottom-left-radius:1rem}.rounded-l-lg{border-top-left-radius:.5rem;border-bottom-left-radius:.5rem}.rounded-r-lg{border-top-right-radius:.5rem;border-bottom-right-radius:.5rem}.border{border-width:1px}.border-0{border-width:0}.border-primary{border-color:var(--color-primary)}.border-transparent{border-color:#0000}.bg-indigo-900{--tw-bg-opacity:1;background-color:rgb(22 44 135/var(--tw-bg-opacity))}.bg-primary{background-color:var(--color-primary)}.bg-transparent{background-color:initial}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-yellow-400{--tw-bg-opacity:1;background-color:rgb(250 204 21/var(--tw-bg-opacity))}.bg-zinc-100{--tw-bg-opacity:1;background-color:rgb(244 244 245/var(--tw-bg-opacity))}.bg-zinc-50{--tw-bg-opacity:1;background-color:rgb(250 250 250/var(--tw-bg-opacity))}.object-fill{-o-object-fit:fill;object-fit:fill}.\!p-2{padding:.5rem!important}.p-4{padding:1rem}.p-8{padding:2rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pl-4{padding-left:1rem}.pl-7{padding-left:1.75rem}.text-center{text-align:center}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.text-black{--tw-text-opacity:1;color:rgb(30 30 30/var(--tw-text-opacity))}.text-primary{color:var(--color-primary)}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.text-zinc-600{--tw-text-opacity:1;color:rgb(82 82 91/var(--tw-text-opacity))}.text-zinc-900{--tw-text-opacity:1;color:rgb(24 24 27/var(--tw-text-opacity))}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.shadow{--tw-shadow:0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-zinc-200{--tw-shadow-color:#e4e4e7;--tw-shadow:var(--tw-shadow-colored)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.before\:absolute:before{content:var(--tw-content);position:absolute}.before\:left-0:before{content:var(--tw-content);left:0}.before\:top-0:before{content:var(--tw-content);top:0}.before\:hidden:before{content:var(--tw-content);display:none}.before\:h-full:before{content:var(--tw-content);height:100%}.before\:w-1:before{content:var(--tw-content);width:.25rem}.before\:bg-primary:before{content:var(--tw-content);background-color:var(--color-primary)}.empty\:px-0:empty{padding-left:0;padding-right:0}.hover\:bg-primary-active:hover{background-color:var(--color-primary-active)}.hover\:text-primary:hover{color:var(--color-primary)}.focus\:outline-none:focus{outline:2px solid #0000;outline-offset:2px}.enabled\:hover\:bg-primary:hover:enabled{background-color:var(--color-primary)}.enabled\:hover\:bg-primary-active:hover:enabled{background-color:var(--color-primary-active)}.enabled\:hover\:text-white:hover:enabled{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:select-none:disabled{-webkit-user-select:none;-moz-user-select:none;user-select:none}.disabled\:opacity-50:disabled{opacity:.5}@media (min-width:992px){.md\:sticky{position:sticky}.md\:top-0{top:0}.md\:order-3{order:3}.md\:order-4{order:4}.md\:-ml-5{margin-left:-1.25rem}.md\:block{display:block}.md\:\!flex{display:flex!important}.md\:flex{display:flex}.md\:hidden{display:none}.md\:h-auto{height:auto}.md\:max-h-screen{max-height:100vh}.md\:\!w-20{width:5rem!important}.md\:w-1\/2{width:50%}.md\:w-10{width:2.5rem}.md\:max-w-lg{max-width:32rem}.md\:grow-0{flex-grow:0}.md\:flex-row{flex-direction:row}.md\:justify-center{justify-content:center}.md\:rounded-l-2xl{border-top-left-radius:1rem;border-bottom-left-radius:1rem}.md\:bg-primary{background-color:var(--color-primary)}.md\:bg-secondary{background-color:var(--color-secondary)}.md\:px-12{padding-left:3rem;padding-right:3rem}.md\:px-24{padding-left:6rem;padding-right:6rem}.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}.md\:py-14{padding-top:3.5rem;padding-bottom:3.5rem}.md\:pr-12{padding-right:3rem}.md\:text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.md\:hover\:bg-primary-active:hover{background-color:var(--color-primary-active)}}@media (min-width:1200px){.lg\:hidden{display:none}}

package/dist/ui.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),f=require("@headlessui/vue"),x={"extra-small":["h-4","w-4"],small:["h-5","w-5"],medium:["h-7","w-7"],large:["h-10","w-10"]},b=e.createElementVNode("circle",{stroke:"currentColor",class:"opacity-25","stroke-width":"4",cx:"12",cy:"12",r:"10"},null,-1),C=e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:`M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962
-        7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z`},null,-1),B=[b,C],v=e.defineComponent({__name:"AppLoader",props:{size:{default:"medium"}},setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass([e.unref(x)[n.size],"animate-spin"]),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none"},B,2))}}),N={class:"app-button__icon h-4"},E=e.defineComponent({__name:"ButtonIconSlot",props:{loading:{type:Boolean}},setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("span",N,[n.loading?(e.openBlock(),e.createBlock(v,{key:0,class:"w-4"})):e.renderSlot(t.$slots,"default",{key:1},void 0,!0)]))}});const M=(n,t)=>{const a=n.__vccOpts||n;for(const[o,r]of t)a[o]=r;return a},w=M(E,[["__scopeId","data-v-04d5f165"]]),V={plain:["text-primary","border-0"],primary:["text-white","bg-primary","border-transparent","enabled:hover:bg-primary-active"],secondary:["text-primary","bg-transparent","border-primary","enabled:hover:text-white","enabled:hover:bg-primary"]},$={small:["px-5","py-2"],medium:["px-5","py-3"],large:["px-5","py-4"]},z=["type","disabled"],I=e.defineComponent({__name:"AppButton",props:{size:{default:"medium"},type:{default:"button"},colorType:{default:"primary"},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1}},setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("button",{type:n.type,disabled:n.disabled||n.loading,class:e.normalizeClass([[...e.unref(V)[n.colorType],...e.unref($)[n.size]],"app-button inline-flex items-center whitespace-nowrap rounded-lg border text-sm font-semibold transition-colors focus:outline-none disabled:cursor-not-allowed disabled:select-none disabled:opacity-50"])},[t.$slots.leadingIcon||n.loading?(e.openBlock(),e.createBlock(w,{key:0,loading:n.loading,class:"mr-3","data-test-leading-icon":""},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"leadingIcon")]),_:3},8,["loading"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"default"),t.$slots.trailingIcon?(e.openBlock(),e.createBlock(w,{key:1,class:"ml-3","data-test-trailing-icon":""},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"trailingIcon")]),_:3})):e.createCommentVNode("",!0)],10,z))}}),i={navigationItems:e.ref([]),mainMenuOpen:e.ref(!1),mobileMenuOpen:e.ref(!1),navigationComponent:e.shallowRef("a"),logo:e.ref(null),contactRoute:e.ref()};function p(){function n(l){i.navigationItems.value=e.isRef(l)?l==null?void 0:l.value:l}function t(l){i.navigationComponent.value=l}function a(l){i.logo.value=l}function o(){i.mainMenuOpen.value=!0}function r(){i.mainMenuOpen.value=!1}function s(){i.mainMenuOpen.value=!i.mainMenuOpen.value}function d(){i.mobileMenuOpen.value=!0}function m(){i.mobileMenuOpen.value=!1}function c(){i.mobileMenuOpen.value=!i.mobileMenuOpen.value}return{...i,setNavigationItems:n,setNavigationComponent:t,setLogo:a,openMainMenu:o,closeMainMenu:r,toggleMainMenu:s,openMobileMenu:d,closeMobileMenu:m,toggleMobileMenu:c}}const u={layoutImage:e.ref(null),colors:{primaryColor:e.ref(null),primaryColorActive:e.ref(null),secondaryColor:e.ref(null),secondaryColorActive:e.ref(null)}};function k(){function n(o){u.layoutImage.value=o}function t(o,r){u.colors.primaryColor.value=o,u.colors.primaryColorActive.value=r,document.documentElement.style.setProperty("--color-primary",o),document.documentElement.style.setProperty("--color-primary-active",r)}function a(o,r){u.colors.secondaryColor.value=o,u.colors.secondaryColorActive.value=r,document.documentElement.style.setProperty("--color-secondary",o),document.documentElement.style.setProperty("--color-secondary-active",r)}return{...u,setLayoutImage:n,setPrimaryColors:t,setSecondaryColors:a}}function S(n,t){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"})])}function L(n,t){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M6 18L18 6M6 6l12 12"})])}const O={class:"pl-7 text-lg font-semibold text-zinc-900 md:hidden","data-test-name":""},h=e.defineComponent({__name:"NavigationItem",props:{item:null},setup(n){const t=n,{navigationComponent:a}=p(),o=e.ref(!1),r=e.computed(()=>o.value||typeof t.item.icon!="string"),s=e.computed(()=>o.value?v:t.item.icon);async function d(m){var c,l,g;(c=t.item)!=null&&c.onClick&&(m.preventDefault(),o.value=!0,await Promise.resolve((g=(l=t.item)==null?void 0:l.onClick)==null?void 0:g.call(l)),o.value=!1)}return(m,c)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(a)),{to:n.item.to,href:n.item.href,class:e.normalizeClass([{"md:bg-primary":n.item.active??!1,"!rounded-full":n.item.rounded??!1,"mb-2":!n.item.bottom,"mt-2":n.item.bottom??!1},"flex h-10 w-full cursor-pointer items-center rounded-lg text-center transition-colors md:w-10 md:justify-center md:hover:bg-primary-active"]),onClick:d},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(r)?e.unref(s):"span"),{class:e.normalizeClass([{"!h-6":!e.unref(r)},"h-4 w-4 text-zinc-900 md:text-white"]),size:o.value?"extra-small":void 0,"data-test-icon":""},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)?"":n.item.icon),1)]),_:1},8,["class","size"])),e.createElementVNode("span",O,e.toDisplayString(n.item.name),1)]),_:1},8,["to","href","class"]))}}),y=e.defineComponent({__name:"SupportItem",setup(n){const{contactRoute:t,navigationComponent:a}=p();return(o,r)=>e.unref(t)?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(a)),{key:0,to:e.unref(a)!=="a"?e.unref(t):void 0,href:e.unref(a)?e.unref(t):void 0,class:"fixed bottom-5 right-5 z-50 mt-2 flex h-10 w-10 justify-center rounded-full bg-primary py-2 text-white transition-colors hover:bg-primary-active","data-test-help-icon":""},{default:e.withCtx(()=>[e.createTextVNode(" ? ")]),_:1},8,["to","href"])):e.createCommentVNode("",!0)}}),A={class:"flex items-center justify-between bg-zinc-50 px-2 py-4 text-black md:hidden"},j=["innerHTML"],P=e.createElementVNode("div",{class:"w-1/3"},null,-1),T={class:"relative flex h-full w-full flex-1 flex-col bg-white focus:outline-none","data-test-navigation-wrapper":""},D={class:"h-0 flex-1 overflow-y-auto p-4","data-test-navigation-links-wrapper":""},R={"aria-label":"MainMenu",class:"mt-5"},F={class:"mb-auto"},H=e.defineComponent({__name:"Mobile",setup(n){const{logo:t,navigationItems:a,mobileMenuOpen:o,toggleMobileMenu:r,closeMobileMenu:s}=p(),d=e.computed(()=>o.value?L:S);return(m,c)=>(e.openBlock(),e.createElementBlock("div",A,[e.createElementVNode("div",{class:"inline-flex w-1/3 cursor-pointer items-center justify-start rounded-sm !p-2 hover:text-primary focus:outline-none","data-test-menu-icon-wrapper":"",onClick:c[0]||(c[0]=(...l)=>e.unref(r)&&e.unref(r)(...l))},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(d)),{class:"block h-6 w-6 text-black","aria-hidden":"true"}))]),e.createElementVNode("div",{class:"w-1/3","data-test-logo-wrapper":"",innerHTML:e.unref(t)},null,8,j),P,e.createVNode(e.unref(f.TransitionRoot),{show:e.unref(o),as:"template"},{default:e.withCtx(()=>[e.createVNode(e.unref(f.Dialog),{as:"div",class:"fixed inset-0 top-20 z-50 flex -translate-y-2 lg:hidden",onClose:e.unref(s)},{default:e.withCtx(()=>[e.createVNode(e.unref(f.TransitionChild),{as:"template",enter:"transition ease-in-out duration-300 transform","enter-from":"translate-y-full","enter-to":"translate-y-0",leave:"transition ease-in-out duration-300 transform","leave-from":"translate-y-0","leave-to":"translate-y-full"},{default:e.withCtx(()=>[e.createElementVNode("div",T,[e.createElementVNode("div",D,[e.createElementVNode("nav",R,[e.createElementVNode("ul",F,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(a),l=>(e.openBlock(),e.createElementBlock("li",{key:l.name,"data-test-navigation-item":""},[e.createVNode(h,{item:l},null,8,["item"])]))),128))])]),e.createVNode(y)])])]),_:1})]),_:1},8,["onClose"])]),_:1},8,["show"]),e.createVNode(y)]))}}),q={class:"mx-auto mb-auto"},G={class:"mx-auto mt-auto"},_=e.defineComponent({__name:"AppNavigationMenu",setup(n){const{navigationItems:t,mainMenuOpen:a}=p();return(o,r)=>(e.openBlock(),e.createElementBlock("div",null,[e.createElementVNode("aside",{class:e.normalizeClass([{"px-3 md:!w-20":e.unref(a)},"sticky top-0 hidden h-screen w-0 flex-col justify-center overflow-hidden py-5 transition-all duration-500 md:flex"]),"data-test-main-menu":""},[e.createElementVNode("ul",q,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(t).filter(s=>s.bottom!==!0),s=>(e.openBlock(),e.createElementBlock("li",{key:s.name,"data-test-top-navigation-item":""},[e.createVNode(h,{item:s},null,8,["item"])]))),128))]),e.createElementVNode("ul",G,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(t).filter(s=>s.bottom),s=>(e.openBlock(),e.createElementBlock("li",{key:s.name,"data-test-bottom-navigation-item":""},[e.createVNode(h,{item:s},null,8,["item"])]))),128)),e.createElementVNode("li",null,[e.createVNode(y,{class:"!static"})])])],2),e.createVNode(H)]))}}),J={class:"flex min-h-screen flex-col md:flex-row md:bg-secondary"},K={class:"flex h-full grow items-center justify-center bg-white px-10 transition-all md:h-auto md:w-1/2 md:grow-0 md:rounded-l-2xl md:px-24"},Q={class:"mx-auto md:max-w-lg"},U={class:"hidden w-1/2 md:block","data-test-layout-image-wrapper":""},W=["src"],X=e.defineComponent({__name:"Auth",setup(n){const{layoutImage:t}=k();return(a,o)=>(e.openBlock(),e.createElementBlock("div",J,[e.createVNode(e.unref(_)),e.createElementVNode("main",K,[e.createElementVNode("div",Q,[e.renderSlot(a.$slots,"default")])]),e.createElementVNode("div",U,[e.unref(t)?(e.openBlock(),e.createElementBlock("img",{key:0,src:e.unref(t),class:"h-screen w-full object-fill"},null,8,W)):e.createCommentVNode("",!0)])]))}}),Y={class:"flex min-h-screen flex-col md:flex-row md:bg-secondary"},Z={class:"order-3 flex h-full grow bg-zinc-100 px-2 py-8 transition-all md:order-2 md:h-auto md:rounded-l-2xl md:pr-7"},ee={class:"w-full"},te={id:"sidebar-wrapper",class:"order-2 w-141 max-w-full shrink-0 grow-0 rounded-l-2xl bg-white px-4 py-8 md:sticky md:top-0 md:order-3 md:-ml-5 md:max-h-screen","data-test-layout-sidebar-wrapper":""},ne=e.defineComponent({__name:"Base",setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("div",Y,[e.createVNode(e.unref(_),{class:"order-1"}),e.createElementVNode("main",Z,[e.createElementVNode("div",ee,[e.renderSlot(t.$slots,"default")])]),e.createElementVNode("div",te,[e.renderSlot(t.$slots,"sidebar")])]))}});exports.AppButton=I;exports.AppLoader=v;exports.AppNavigationMenu=_;exports.AuthLayout=X;exports.BaseLayout=ne;exports.useLayout=k;exports.useNavigation=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),y=require("@headlessui/vue"),C={"extra-small":["h-4","w-4"],small:["h-5","w-5"],medium:["h-7","w-7"],large:["h-10","w-10"]},b=e.createElementVNode("circle",{stroke:"currentColor",class:"opacity-25","stroke-width":"4",cx:"12",cy:"12",r:"10"},null,-1),B=e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:`M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962
+        7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z`},null,-1),N=[b,B],h=e.defineComponent({__name:"AppLoader",props:{size:{default:"medium"}},setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass([e.unref(C)[n.size],"animate-spin"]),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none"},N,2))}}),$={class:"app-button__icon h-4"},V=e.defineComponent({__name:"ButtonIconSlot",props:{loading:{type:Boolean}},setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("span",$,[n.loading?(e.openBlock(),e.createBlock(h,{key:0,class:"w-4"})):e.renderSlot(t.$slots,"default",{key:1},void 0,!0)]))}});const g=(n,t)=>{const a=n.__vccOpts||n;for(const[o,r]of t)a[o]=r;return a},x=g(V,[["__scopeId","data-v-04d5f165"]]),E={plain:["text-primary","border-0"],primary:["text-white","bg-primary","border-transparent","enabled:hover:bg-primary-active"],secondary:["text-primary","bg-transparent","border-primary","enabled:hover:text-white","enabled:hover:bg-primary"]},M={small:["px-5","py-2"],medium:["px-5","py-3"],large:["px-5","py-4"]},S=["type","disabled"],z=e.defineComponent({__name:"AppButton",props:{size:{default:"medium"},type:{default:"button"},colorType:{default:"primary"},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1}},setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("button",{type:n.type,disabled:n.disabled||n.loading,class:e.normalizeClass([[...e.unref(E)[n.colorType],...e.unref(M)[n.size]],"app-button inline-flex items-center whitespace-nowrap rounded-lg border text-sm font-semibold transition-colors focus:outline-none disabled:cursor-not-allowed disabled:select-none disabled:opacity-50"])},[t.$slots.leadingIcon||n.loading?(e.openBlock(),e.createBlock(x,{key:0,loading:n.loading,class:"mr-3","data-test-leading-icon":""},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"leadingIcon")]),_:3},8,["loading"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"default"),t.$slots.trailingIcon?(e.openBlock(),e.createBlock(x,{key:1,class:"ml-3","data-test-trailing-icon":""},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"trailingIcon")]),_:3})):e.createCommentVNode("",!0)],10,S))}}),I={key:0,class:"app-card__icon absolute right-5 top-5 h-5 text-primary"},L=e.defineComponent({__name:"CardIconSlot",props:{icon:null},setup(n){const t=n;return(a,o)=>a.$slots.default||n.icon?(e.openBlock(),e.createElementBlock("div",I,[e.renderSlot(a.$slots,"default",{},()=>[t.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(typeof t.icon=="string"?"span":t.icon),{key:0,"data-test-icon-component":"",innerHTML:t.icon},null,8,["innerHTML"])):e.createCommentVNode("",!0)],!0)])):e.createCommentVNode("",!0)}});const A=g(L,[["__scopeId","data-v-14ba04ea"]]),i={navigationItems:e.ref([]),mainMenuOpen:e.ref(!1),mobileMenuOpen:e.ref(!1),navigationComponent:e.shallowRef("a"),logo:e.ref(null),contactRoute:e.ref()};function p(){function n(l){i.navigationItems.value=e.isRef(l)?l==null?void 0:l.value:l}function t(l){i.navigationComponent.value=l}function a(l){i.logo.value=l}function o(){i.mainMenuOpen.value=!0}function r(){i.mainMenuOpen.value=!1}function s(){i.mainMenuOpen.value=!i.mainMenuOpen.value}function u(){i.mobileMenuOpen.value=!0}function d(){i.mobileMenuOpen.value=!1}function c(){i.mobileMenuOpen.value=!i.mobileMenuOpen.value}return{...i,setNavigationItems:n,setNavigationComponent:t,setLogo:a,openMainMenu:o,closeMainMenu:r,toggleMainMenu:s,openMobileMenu:u,closeMobileMenu:d,toggleMobileMenu:c}}const m={layoutImage:e.ref(null),colors:{primaryColor:e.ref(null),primaryColorActive:e.ref(null),secondaryColor:e.ref(null),secondaryColorActive:e.ref(null)}};function w(){function n(o){m.layoutImage.value=o}function t(o,r){m.colors.primaryColor.value=o,m.colors.primaryColorActive.value=r,document.documentElement.style.setProperty("--color-primary",o),document.documentElement.style.setProperty("--color-primary-active",r)}function a(o,r){m.colors.secondaryColor.value=o,m.colors.secondaryColorActive.value=r,document.documentElement.style.setProperty("--color-secondary",o),document.documentElement.style.setProperty("--color-secondary-active",r)}return{...m,setLayoutImage:n,setPrimaryColors:t,setSecondaryColors:a}}const D=e.defineComponent({__name:"CardAction",props:{item:null},setup(n){const t=n,{navigationComponent:a}=p(),o=e.ref(!1),r=e.computed(()=>o.value||typeof t.item.icon!="string"),s=e.computed(()=>o.value?h:t.item.icon);async function u(d){var c,l,f;(c=t.item)!=null&&c.onClick&&(d.preventDefault(),o.value=!0,await Promise.resolve((f=(l=t.item)==null?void 0:l.onClick)==null?void 0:f.call(l)),o.value=!1)}return(d,c)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(a)),{to:n.item.to,href:n.item.href,class:"app-card__action ml-auto flex justify-center text-zinc-600",onClick:u},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(r)?e.unref(s):"span"),{class:e.normalizeClass([{"!h-6":!e.unref(r)},"h-4 w-4"]),size:o.value?"extra-small":void 0,"data-test-icon":""},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)?"":n.item.icon),1)]),_:1},8,["class","size"])),e.createElementVNode("span",{class:e.normalizeClass([{"pl-4":n.item.icon},"text-sm"]),"data-test-name":""},e.toDisplayString(n.item.name),3)]),_:1},8,["to","href"]))}});const T=g(D,[["__scopeId","data-v-0e561723"]]),O={key:1,class:"text-4xl font-bold text-zinc-900","data-test-title":""},P={class:"mt-2","data-test-content":""},j=e.defineComponent({__name:"AppCard",props:{bordered:{type:Boolean,default:!1},title:{default:void 0},icon:{default:void 0},actions:{default:void 0}},setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([{"before:hidden":!n.bordered},"relative w-full overflow-hidden rounded-xl bg-white p-8 text-sm text-zinc-600 shadow shadow-zinc-200 before:absolute before:left-0 before:top-0 before:h-full before:w-1 before:bg-primary"])},[t.$slots.icon||n.icon?(e.openBlock(),e.createBlock(A,{key:0,icon:n.icon,"data-test-icon":""},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"icon")]),_:3},8,["icon"])):e.createCommentVNode("",!0),n.title||t.$slots.title?(e.openBlock(),e.createElementBlock("h3",O,[e.renderSlot(t.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(n.title),1)])])):e.createCommentVNode("",!0),e.createElementVNode("div",P,[e.renderSlot(t.$slots,"default")]),e.renderSlot(t.$slots,"actions",{},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.actions,o=>(e.openBlock(),e.createElementBlock("div",{key:o.name,class:"flex w-full"},[e.createVNode(T,{item:o},null,8,["item"])]))),128))])],2))}});function H(n,t){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"})])}function R(n,t){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M6 18L18 6M6 6l12 12"})])}const F={class:"pl-7 text-lg font-semibold text-zinc-900 md:hidden","data-test-name":""},v=e.defineComponent({__name:"NavigationItem",props:{item:null},setup(n){const t=n,{navigationComponent:a}=p(),o=e.ref(!1),r=e.computed(()=>o.value||typeof t.item.icon!="string"),s=e.computed(()=>o.value?h:t.item.icon);async function u(d){var c,l,f;(c=t.item)!=null&&c.onClick&&(d.preventDefault(),o.value=!0,await Promise.resolve((f=(l=t.item)==null?void 0:l.onClick)==null?void 0:f.call(l)),o.value=!1)}return(d,c)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(a)),{to:n.item.to,href:n.item.href,class:e.normalizeClass([{"md:bg-primary":n.item.active??!1,"!rounded-full":n.item.rounded??!1,"mb-2":!n.item.bottom,"mt-2":n.item.bottom??!1},"flex h-10 w-full cursor-pointer items-center rounded-lg text-center transition-colors md:w-10 md:justify-center md:hover:bg-primary-active"]),onClick:u},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(r)?e.unref(s):"span"),{class:e.normalizeClass([{"!h-6":!e.unref(r)},"h-4 w-4 text-zinc-900 md:text-white"]),size:o.value?"extra-small":void 0,"data-test-icon":""},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)?"":n.item.icon),1)]),_:1},8,["class","size"])),e.createElementVNode("span",F,e.toDisplayString(n.item.name),1)]),_:1},8,["to","href","class"]))}}),_=e.defineComponent({__name:"SupportItem",setup(n){const{contactRoute:t,navigationComponent:a}=p();return(o,r)=>e.unref(t)?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(a)),{key:0,to:e.unref(a)!=="a"?e.unref(t):void 0,href:e.unref(a)?e.unref(t):void 0,class:"fixed bottom-5 right-5 z-50 mt-2 flex h-10 w-10 justify-center rounded-full bg-primary py-2 text-white transition-colors hover:bg-primary-active","data-test-help-icon":""},{default:e.withCtx(()=>[e.createTextVNode(" ? ")]),_:1},8,["to","href"])):e.createCommentVNode("",!0)}}),q={class:"flex items-center justify-between bg-zinc-50 px-2 py-4 text-black md:hidden"},G=["innerHTML"],J=e.createElementVNode("div",{class:"w-1/3"},null,-1),K={class:"relative flex h-full w-full flex-1 flex-col bg-white focus:outline-none","data-test-navigation-wrapper":""},Q={class:"h-0 flex-1 overflow-y-auto p-4","data-test-navigation-links-wrapper":""},U={"aria-label":"MainMenu",class:"mt-5"},W={class:"mb-auto"},X=e.defineComponent({__name:"Mobile",setup(n){const{logo:t,navigationItems:a,mobileMenuOpen:o,toggleMobileMenu:r,closeMobileMenu:s}=p(),u=e.computed(()=>o.value?R:H);return(d,c)=>(e.openBlock(),e.createElementBlock("div",q,[e.createElementVNode("div",{class:"inline-flex w-1/3 cursor-pointer items-center justify-start rounded-sm !p-2 hover:text-primary focus:outline-none","data-test-menu-icon-wrapper":"",onClick:c[0]||(c[0]=(...l)=>e.unref(r)&&e.unref(r)(...l))},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(u)),{class:"block h-6 w-6 text-black","aria-hidden":"true"}))]),e.createElementVNode("div",{class:"w-1/3","data-test-logo-wrapper":"",innerHTML:e.unref(t)},null,8,G),J,e.createVNode(e.unref(y.TransitionRoot),{show:e.unref(o),as:"template"},{default:e.withCtx(()=>[e.createVNode(e.unref(y.Dialog),{as:"div",class:"fixed inset-0 top-20 z-50 flex -translate-y-2 lg:hidden",onClose:e.unref(s)},{default:e.withCtx(()=>[e.createVNode(e.unref(y.TransitionChild),{as:"template",enter:"transition ease-in-out duration-300 transform","enter-from":"translate-y-full","enter-to":"translate-y-0",leave:"transition ease-in-out duration-300 transform","leave-from":"translate-y-0","leave-to":"translate-y-full"},{default:e.withCtx(()=>[e.createElementVNode("div",K,[e.createElementVNode("div",Q,[e.createElementVNode("nav",U,[e.createElementVNode("ul",W,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(a),l=>(e.openBlock(),e.createElementBlock("li",{key:l.name,"data-test-navigation-item":""},[e.createVNode(v,{item:l},null,8,["item"])]))),128))])]),e.createVNode(_)])])]),_:1})]),_:1},8,["onClose"])]),_:1},8,["show"]),e.createVNode(_)]))}}),Y={class:"mx-auto mb-auto"},Z={class:"mx-auto mt-auto"},k=e.defineComponent({__name:"AppNavigationMenu",setup(n){const{navigationItems:t,mainMenuOpen:a}=p();return(o,r)=>(e.openBlock(),e.createElementBlock("div",null,[e.createElementVNode("aside",{class:e.normalizeClass([{"px-3 md:!w-20":e.unref(a)},"sticky top-0 hidden h-screen w-0 flex-col justify-center overflow-hidden py-5 transition-all duration-500 md:flex"]),"data-test-main-menu":""},[e.createElementVNode("ul",Y,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(t).filter(s=>s.bottom!==!0),s=>(e.openBlock(),e.createElementBlock("li",{key:s.name,"data-test-top-navigation-item":""},[e.createVNode(v,{item:s},null,8,["item"])]))),128))]),e.createElementVNode("ul",Z,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(t).filter(s=>s.bottom),s=>(e.openBlock(),e.createElementBlock("li",{key:s.name,"data-test-bottom-navigation-item":""},[e.createVNode(v,{item:s},null,8,["item"])]))),128)),e.createElementVNode("li",null,[e.createVNode(_,{class:"!static"})])])],2),e.createVNode(X)]))}}),ee={class:"flex text-sm font-bold"},te={class:"rounded-l-lg bg-indigo-900 px-2 py-1.5 text-white","data-test-country-code":""},ne={class:"rounded-r-lg bg-yellow-400 px-2 py-1.5 uppercase text-zinc-900","data-test-license-plate":""},oe=e.defineComponent({__name:"AppLicensePlate",props:{license:{default:void 0},country:{default:"NL"}},setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("div",ee,[e.createElementVNode("span",te,e.toDisplayString(n.country),1),e.createElementVNode("span",ne,[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(n.license),1)])])]))}}),ae={class:"flex min-h-screen flex-col md:flex-row md:bg-secondary"},le={class:"flex h-full grow items-center justify-center bg-white px-10 transition-all md:h-auto md:w-1/2 md:grow-0 md:rounded-l-2xl md:px-24"},re={class:"mx-auto md:max-w-lg"},se={class:"hidden w-1/2 md:block","data-test-layout-image-wrapper":""},ce=["src"],ie=e.defineComponent({__name:"Auth",setup(n){const{layoutImage:t}=w();return(a,o)=>(e.openBlock(),e.createElementBlock("div",ae,[e.createVNode(e.unref(k)),e.createElementVNode("main",le,[e.createElementVNode("div",re,[e.renderSlot(a.$slots,"default")])]),e.createElementVNode("div",se,[e.unref(t)?(e.openBlock(),e.createElementBlock("img",{key:0,src:e.unref(t),class:"h-screen w-full object-fill"},null,8,ce)):e.createCommentVNode("",!0)])]))}}),de={class:"flex min-h-screen flex-col md:flex-row md:bg-secondary"},ue=e.createElementVNode("div",{id:"top",class:"order-2 px-4 empty:px-0"},null,-1),me={class:"order-4 flex h-full grow bg-zinc-100 px-4 py-8 transition-all md:order-3 md:h-auto md:rounded-l-2xl md:px-6 md:pr-12"},pe={class:"w-full"},fe={id:"sidebar-wrapper",class:"order-3 w-141 max-w-full shrink-0 grow-0 rounded-l-2xl bg-white px-4 py-8 md:sticky md:top-0 md:order-4 md:-ml-5 md:max-h-screen md:px-12 md:py-14","data-test-layout-sidebar-wrapper":""},he=e.defineComponent({__name:"Base",setup(n){return(t,a)=>(e.openBlock(),e.createElementBlock("div",de,[e.createVNode(e.unref(k),{class:"order-1"}),e.renderSlot(t.$slots,"top",{},()=>[ue]),e.createElementVNode("main",me,[e.createElementVNode("div",pe,[e.renderSlot(t.$slots,"default")])]),e.createElementVNode("div",fe,[e.renderSlot(t.$slots,"sidebar")])]))}});exports.AppButton=z;exports.AppCard=j;exports.AppLicensePlate=oe;exports.AppLoader=h;exports.AppNavigationMenu=k;exports.AuthLayout=ie;exports.BaseLayout=he;exports.useLayout=w;exports.useNavigation=p;

package/dist/ui.css

@@ -1 +1 @@
-.app-button__icon[data-v-04d5f165]>*{height:100%!important}
+.app-button__icon[data-v-04d5f165]>*{height:100%!important}.app-card__icon[data-v-14ba04ea]>*{height:100%!important}.app-card__action[data-v-0e561723]>*{height:100%!important}

package/dist/ui.js

@@ -1,58 +1,58 @@
-import { defineComponent as f, openBlock as a, createElementBlock as c, normalizeClass as b, unref as n, createElementVNode as s, createBlock as v, renderSlot as y, withCtx as _, createCommentVNode as M, ref as p, shallowRef as T, isRef as E, computed as k, resolveDynamicComponent as C, createTextVNode as j, toDisplayString as A, createVNode as m, Fragment as I, renderList as z } from "vue";
-import { TransitionRoot as R, Dialog as V, TransitionChild as D } from "@headlessui/vue";
-const H = {
+import { defineComponent as p, openBlock as a, createElementBlock as c, normalizeClass as x, unref as n, createElementVNode as l, createBlock as y, renderSlot as d, withCtx as v, createCommentVNode as b, resolveDynamicComponent as $, ref as h, shallowRef as E, isRef as D, computed as I, createTextVNode as z, toDisplayString as C, Fragment as L, renderList as B, createVNode as m } from "vue";
+import { TransitionRoot as H, Dialog as R, TransitionChild as V } from "@headlessui/vue";
+const F = {
   "extra-small": ["h-4", "w-4"],
   small: ["h-5", "w-5"],
   medium: ["h-7", "w-7"],
   large: ["h-10", "w-10"]
-}, F = /* @__PURE__ */ s("circle", {
+}, q = /* @__PURE__ */ l("circle", {
   stroke: "currentColor",
   class: "opacity-25",
   "stroke-width": "4",
   cx: "12",
   cy: "12",
   r: "10"
-}, null, -1), q = /* @__PURE__ */ s("path", {
+}, null, -1), G = /* @__PURE__ */ l("path", {
   class: "opacity-75",
   fill: "currentColor",
   d: `M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962
         7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z`
-}, null, -1), G = [
-  F,
-  q
-], P = /* @__PURE__ */ f({
+}, null, -1), J = [
+  q,
+  G
+], S = /* @__PURE__ */ p({
   __name: "AppLoader",
   props: {
     size: { default: "medium" }
   },
   setup(t) {
-    return (e, l) => (a(), c("svg", {
-      class: b([n(H)[t.size], "animate-spin"]),
+    return (e, s) => (a(), c("svg", {
+      class: x([n(F)[t.size], "animate-spin"]),
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
       fill: "none"
-    }, G, 2));
+    }, J, 2));
   }
-}), J = { class: "app-button__icon h-4" }, K = /* @__PURE__ */ f({
+}), K = { class: "app-button__icon h-4" }, Q = /* @__PURE__ */ p({
   __name: "ButtonIconSlot",
   props: {
     loading: { type: Boolean }
   },
   setup(t) {
-    return (e, l) => (a(), c("span", J, [
-      t.loading ? (a(), v(P, {
+    return (e, s) => (a(), c("span", K, [
+      t.loading ? (a(), y(S, {
         key: 0,
         class: "w-4"
-      })) : y(e.$slots, "default", { key: 1 }, void 0, !0)
+      })) : d(e.$slots, "default", { key: 1 }, void 0, !0)
     ]));
   }
 });
-const Q = (t, e) => {
-  const l = t.__vccOpts || t;
+const N = (t, e) => {
+  const s = t.__vccOpts || t;
   for (const [o, r] of e)
-    l[o] = r;
-  return l;
-}, N = /* @__PURE__ */ Q(K, [["__scopeId", "data-v-04d5f165"]]), U = {
+    s[o] = r;
+  return s;
+}, j = /* @__PURE__ */ N(Q, [["__scopeId", "data-v-04d5f165"]]), U = {
   plain: [
     "text-primary",
     "border-0"
@@ -74,7 +74,7 @@ const Q = (t, e) => {
   small: ["px-5", "py-2"],
   medium: ["px-5", "py-3"],
   large: ["px-5", "py-4"]
-}, X = ["type", "disabled"], Me = /* @__PURE__ */ f({
+}, X = ["type", "disabled"], Se = /* @__PURE__ */ p({
   __name: "AppButton",
   props: {
     size: { default: "medium" },
@@ -84,114 +84,220 @@ const Q = (t, e) => {
     loading: { type: Boolean, default: !1 }
   },
   setup(t) {
-    return (e, l) => (a(), c("button", {
+    return (e, s) => (a(), c("button", {
       type: t.type,
       disabled: t.disabled || t.loading,
-      class: b([[
+      class: x([[
         ...n(U)[t.colorType],
         ...n(W)[t.size]
       ], "app-button inline-flex items-center whitespace-nowrap rounded-lg border text-sm font-semibold transition-colors focus:outline-none disabled:cursor-not-allowed disabled:select-none disabled:opacity-50"])
     }, [
-      e.$slots.leadingIcon || t.loading ? (a(), v(N, {
+      e.$slots.leadingIcon || t.loading ? (a(), y(j, {
         key: 0,
         loading: t.loading,
         class: "mr-3",
         "data-test-leading-icon": ""
       }, {
-        default: _(() => [
-          y(e.$slots, "leadingIcon")
+        default: v(() => [
+          d(e.$slots, "leadingIcon")
         ]),
         _: 3
-      }, 8, ["loading"])) : M("", !0),
-      y(e.$slots, "default"),
-      e.$slots.trailingIcon ? (a(), v(N, {
+      }, 8, ["loading"])) : b("", !0),
+      d(e.$slots, "default"),
+      e.$slots.trailingIcon ? (a(), y(j, {
         key: 1,
         class: "ml-3",
         "data-test-trailing-icon": ""
       }, {
-        default: _(() => [
-          y(e.$slots, "trailingIcon")
+        default: v(() => [
+          d(e.$slots, "trailingIcon")
         ]),
         _: 3
-      })) : M("", !0)
+      })) : b("", !0)
     ], 10, X));
   }
-}), d = {
-  navigationItems: p([]),
-  mainMenuOpen: p(!1),
-  mobileMenuOpen: p(!1),
-  navigationComponent: T("a"),
-  logo: p(null),
-  contactRoute: p()
+}), Y = {
+  key: 0,
+  class: "app-card__icon absolute right-5 top-5 h-5 text-primary"
+}, Z = /* @__PURE__ */ p({
+  __name: "CardIconSlot",
+  props: {
+    icon: null
+  },
+  setup(t) {
+    const e = t;
+    return (s, o) => s.$slots.default || t.icon ? (a(), c("div", Y, [
+      d(s.$slots, "default", {}, () => [
+        e.icon ? (a(), y($(typeof e.icon == "string" ? "span" : e.icon), {
+          key: 0,
+          "data-test-icon-component": "",
+          innerHTML: e.icon
+        }, null, 8, ["innerHTML"])) : b("", !0)
+      ], !0)
+    ])) : b("", !0);
+  }
+});
+const ee = /* @__PURE__ */ N(Z, [["__scopeId", "data-v-14ba04ea"]]), _ = {
+  navigationItems: h([]),
+  mainMenuOpen: h(!1),
+  mobileMenuOpen: h(!1),
+  navigationComponent: E("a"),
+  logo: h(null),
+  contactRoute: h()
 };
-function $() {
+function A() {
   function t(i) {
-    d.navigationItems.value = E(i) ? i == null ? void 0 : i.value : i;
+    _.navigationItems.value = D(i) ? i == null ? void 0 : i.value : i;
   }
   function e(i) {
-    d.navigationComponent.value = i;
+    _.navigationComponent.value = i;
   }
-  function l(i) {
-    d.logo.value = i;
+  function s(i) {
+    _.logo.value = i;
   }
   function o() {
-    d.mainMenuOpen.value = !0;
+    _.mainMenuOpen.value = !0;
   }
   function r() {
-    d.mainMenuOpen.value = !1;
+    _.mainMenuOpen.value = !1;
   }
   function u() {
-    d.mainMenuOpen.value = !d.mainMenuOpen.value;
+    _.mainMenuOpen.value = !_.mainMenuOpen.value;
   }
   function w() {
-    d.mobileMenuOpen.value = !0;
+    _.mobileMenuOpen.value = !0;
   }
-  function x() {
-    d.mobileMenuOpen.value = !1;
+  function g() {
+    _.mobileMenuOpen.value = !1;
   }
-  function h() {
-    d.mobileMenuOpen.value = !d.mobileMenuOpen.value;
+  function f() {
+    _.mobileMenuOpen.value = !_.mobileMenuOpen.value;
   }
   return {
-    ...d,
+    ..._,
     setNavigationItems: t,
     setNavigationComponent: e,
-    setLogo: l,
+    setLogo: s,
     openMainMenu: o,
     closeMainMenu: r,
     toggleMainMenu: u,
     openMobileMenu: w,
-    closeMobileMenu: x,
-    toggleMobileMenu: h
+    closeMobileMenu: g,
+    toggleMobileMenu: f
   };
 }
-const g = {
-  layoutImage: p(null),
+const k = {
+  layoutImage: h(null),
   colors: {
-    primaryColor: p(null),
-    primaryColorActive: p(null),
-    secondaryColor: p(null),
-    secondaryColorActive: p(null)
+    primaryColor: h(null),
+    primaryColorActive: h(null),
+    secondaryColor: h(null),
+    secondaryColorActive: h(null)
   }
 };
-function Y() {
+function te() {
   function t(o) {
-    g.layoutImage.value = o;
+    k.layoutImage.value = o;
   }
   function e(o, r) {
-    g.colors.primaryColor.value = o, g.colors.primaryColorActive.value = r, document.documentElement.style.setProperty("--color-primary", o), document.documentElement.style.setProperty("--color-primary-active", r);
+    k.colors.primaryColor.value = o, k.colors.primaryColorActive.value = r, document.documentElement.style.setProperty("--color-primary", o), document.documentElement.style.setProperty("--color-primary-active", r);
   }
-  function l(o, r) {
-    g.colors.secondaryColor.value = o, g.colors.secondaryColorActive.value = r, document.documentElement.style.setProperty("--color-secondary", o), document.documentElement.style.setProperty("--color-secondary-active", r);
+  function s(o, r) {
+    k.colors.secondaryColor.value = o, k.colors.secondaryColorActive.value = r, document.documentElement.style.setProperty("--color-secondary", o), document.documentElement.style.setProperty("--color-secondary-active", r);
   }
   return {
-    ...g,
+    ...k,
     setLayoutImage: t,
     setPrimaryColors: e,
-    setSecondaryColors: l
+    setSecondaryColors: s
   };
 }
-function Z(t, e) {
+const ne = /* @__PURE__ */ p({
+  __name: "CardAction",
+  props: {
+    item: null
+  },
+  setup(t) {
+    const e = t, { navigationComponent: s } = A(), o = h(!1), r = I(() => o.value || typeof e.item.icon != "string"), u = I(() => o.value ? S : e.item.icon);
+    async function w(g) {
+      var f, i, M;
+      (f = e.item) != null && f.onClick && (g.preventDefault(), o.value = !0, await Promise.resolve((M = (i = e.item) == null ? void 0 : i.onClick) == null ? void 0 : M.call(i)), o.value = !1);
+    }
+    return (g, f) => (a(), y($(n(s)), {
+      to: t.item.to,
+      href: t.item.href,
+      class: "app-card__action ml-auto flex justify-center text-zinc-600",
+      onClick: w
+    }, {
+      default: v(() => [
+        (a(), y($(n(r) ? n(u) : "span"), {
+          class: x([{ "!h-6": !n(r) }, "h-4 w-4"]),
+          size: o.value ? "extra-small" : void 0,
+          "data-test-icon": ""
+        }, {
+          default: v(() => [
+            z(C(n(r) ? "" : t.item.icon), 1)
+          ]),
+          _: 1
+        }, 8, ["class", "size"])),
+        l("span", {
+          class: x([{ "pl-4": t.item.icon }, "text-sm"]),
+          "data-test-name": ""
+        }, C(t.item.name), 3)
+      ]),
+      _: 1
+    }, 8, ["to", "href"]));
+  }
+});
+const oe = /* @__PURE__ */ N(ne, [["__scopeId", "data-v-0e561723"]]), ae = {
+  key: 1,
+  class: "text-4xl font-bold text-zinc-900",
+  "data-test-title": ""
+}, se = {
+  class: "mt-2",
+  "data-test-content": ""
+}, Ne = /* @__PURE__ */ p({
+  __name: "AppCard",
+  props: {
+    bordered: { type: Boolean, default: !1 },
+    title: { default: void 0 },
+    icon: { default: void 0 },
+    actions: { default: void 0 }
+  },
+  setup(t) {
+    return (e, s) => (a(), c("div", {
+      class: x([{ "before:hidden": !t.bordered }, "relative w-full overflow-hidden rounded-xl bg-white p-8 text-sm text-zinc-600 shadow shadow-zinc-200 before:absolute before:left-0 before:top-0 before:h-full before:w-1 before:bg-primary"])
+    }, [
+      e.$slots.icon || t.icon ? (a(), y(ee, {
+        key: 0,
+        icon: t.icon,
+        "data-test-icon": ""
+      }, {
+        default: v(() => [
+          d(e.$slots, "icon")
+        ]),
+        _: 3
+      }, 8, ["icon"])) : b("", !0),
+      t.title || e.$slots.title ? (a(), c("h3", ae, [
+        d(e.$slots, "title", {}, () => [
+          z(C(t.title), 1)
+        ])
+      ])) : b("", !0),
+      l("div", se, [
+        d(e.$slots, "default")
+      ]),
+      d(e.$slots, "actions", {}, () => [
+        (a(!0), c(L, null, B(t.actions, (o) => (a(), c("div", {
+          key: o.name,
+          class: "flex w-full"
+        }, [
+          m(oe, { item: o }, null, 8, ["item"])
+        ]))), 128))
+      ])
+    ], 2));
+  }
+});
+function le(t, e) {
   return a(), c("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
@@ -200,14 +306,14 @@ function Z(t, e) {
     stroke: "currentColor",
     "aria-hidden": "true"
   }, [
-    s("path", {
+    l("path", {
       "stroke-linecap": "round",
       "stroke-linejoin": "round",
       d: "M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"
     })
   ]);
 }
-function ee(t, e) {
+function ie(t, e) {
   return a(), c("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
@@ -216,31 +322,31 @@ function ee(t, e) {
     stroke: "currentColor",
     "aria-hidden": "true"
   }, [
-    s("path", {
+    l("path", {
       "stroke-linecap": "round",
       "stroke-linejoin": "round",
       d: "M6 18L18 6M6 6l12 12"
     })
   ]);
 }
-const te = {
+const re = {
   class: "pl-7 text-lg font-semibold text-zinc-900 md:hidden",
   "data-test-name": ""
-}, B = /* @__PURE__ */ f({
+}, O = /* @__PURE__ */ p({
   __name: "NavigationItem",
   props: {
     item: null
   },
   setup(t) {
-    const e = t, { navigationComponent: l } = $(), o = p(!1), r = k(() => o.value || typeof e.item.icon != "string"), u = k(() => o.value ? P : e.item.icon);
-    async function w(x) {
-      var h, i, L;
-      (h = e.item) != null && h.onClick && (x.preventDefault(), o.value = !0, await Promise.resolve((L = (i = e.item) == null ? void 0 : i.onClick) == null ? void 0 : L.call(i)), o.value = !1);
+    const e = t, { navigationComponent: s } = A(), o = h(!1), r = I(() => o.value || typeof e.item.icon != "string"), u = I(() => o.value ? S : e.item.icon);
+    async function w(g) {
+      var f, i, M;
+      (f = e.item) != null && f.onClick && (g.preventDefault(), o.value = !0, await Promise.resolve((M = (i = e.item) == null ? void 0 : i.onClick) == null ? void 0 : M.call(i)), o.value = !1);
     }
-    return (x, h) => (a(), v(C(n(l)), {
+    return (g, f) => (a(), y($(n(s)), {
       to: t.item.to,
       href: t.item.href,
-      class: b([{
+      class: x([{
         "md:bg-primary": t.item.active ?? !1,
         "!rounded-full": t.item.rounded ?? !1,
         "mb-2": !t.item.bottom,
@@ -248,88 +354,88 @@ const te = {
       }, "flex h-10 w-full cursor-pointer items-center rounded-lg text-center transition-colors md:w-10 md:justify-center md:hover:bg-primary-active"]),
       onClick: w
     }, {
-      default: _(() => [
-        (a(), v(C(n(r) ? n(u) : "span"), {
-          class: b([{ "!h-6": !n(r) }, "h-4 w-4 text-zinc-900 md:text-white"]),
+      default: v(() => [
+        (a(), y($(n(r) ? n(u) : "span"), {
+          class: x([{ "!h-6": !n(r) }, "h-4 w-4 text-zinc-900 md:text-white"]),
           size: o.value ? "extra-small" : void 0,
           "data-test-icon": ""
         }, {
-          default: _(() => [
-            j(A(n(r) ? "" : t.item.icon), 1)
+          default: v(() => [
+            z(C(n(r) ? "" : t.item.icon), 1)
           ]),
           _: 1
         }, 8, ["class", "size"])),
-        s("span", te, A(t.item.name), 1)
+        l("span", re, C(t.item.name), 1)
       ]),
       _: 1
     }, 8, ["to", "href", "class"]));
   }
-}), O = /* @__PURE__ */ f({
+}), P = /* @__PURE__ */ p({
   __name: "SupportItem",
   setup(t) {
-    const { contactRoute: e, navigationComponent: l } = $();
-    return (o, r) => n(e) ? (a(), v(C(n(l)), {
+    const { contactRoute: e, navigationComponent: s } = A();
+    return (o, r) => n(e) ? (a(), y($(n(s)), {
       key: 0,
-      to: n(l) !== "a" ? n(e) : void 0,
-      href: n(l) ? n(e) : void 0,
+      to: n(s) !== "a" ? n(e) : void 0,
+      href: n(s) ? n(e) : void 0,
       class: "fixed bottom-5 right-5 z-50 mt-2 flex h-10 w-10 justify-center rounded-full bg-primary py-2 text-white transition-colors hover:bg-primary-active",
       "data-test-help-icon": ""
     }, {
-      default: _(() => [
-        j(" ? ")
+      default: v(() => [
+        z(" ? ")
       ]),
       _: 1
-    }, 8, ["to", "href"])) : M("", !0);
+    }, 8, ["to", "href"])) : b("", !0);
   }
-}), ne = { class: "flex items-center justify-between bg-zinc-50 px-2 py-4 text-black md:hidden" }, oe = ["innerHTML"], ae = /* @__PURE__ */ s("div", { class: "w-1/3" }, null, -1), le = {
+}), ce = { class: "flex items-center justify-between bg-zinc-50 px-2 py-4 text-black md:hidden" }, ue = ["innerHTML"], de = /* @__PURE__ */ l("div", { class: "w-1/3" }, null, -1), me = {
   class: "relative flex h-full w-full flex-1 flex-col bg-white focus:outline-none",
   "data-test-navigation-wrapper": ""
-}, se = {
+}, pe = {
   class: "h-0 flex-1 overflow-y-auto p-4",
   "data-test-navigation-links-wrapper": ""
-}, ie = {
+}, fe = {
   "aria-label": "MainMenu",
   class: "mt-5"
-}, re = { class: "mb-auto" }, ce = /* @__PURE__ */ f({
+}, _e = { class: "mb-auto" }, he = /* @__PURE__ */ p({
   __name: "Mobile",
   setup(t) {
     const {
       logo: e,
-      navigationItems: l,
+      navigationItems: s,
       mobileMenuOpen: o,
       toggleMobileMenu: r,
       closeMobileMenu: u
-    } = $(), w = k(() => o.value ? ee : Z);
-    return (x, h) => (a(), c("div", ne, [
-      s("div", {
+    } = A(), w = I(() => o.value ? ie : le);
+    return (g, f) => (a(), c("div", ce, [
+      l("div", {
         class: "inline-flex w-1/3 cursor-pointer items-center justify-start rounded-sm !p-2 hover:text-primary focus:outline-none",
         "data-test-menu-icon-wrapper": "",
-        onClick: h[0] || (h[0] = //@ts-ignore
+        onClick: f[0] || (f[0] = //@ts-ignore
         (...i) => n(r) && n(r)(...i))
       }, [
-        (a(), v(C(n(w)), {
+        (a(), y($(n(w)), {
           class: "block h-6 w-6 text-black",
           "aria-hidden": "true"
         }))
       ]),
-      s("div", {
+      l("div", {
         class: "w-1/3",
         "data-test-logo-wrapper": "",
         innerHTML: n(e)
-      }, null, 8, oe),
-      ae,
-      m(n(R), {
+      }, null, 8, ue),
+      de,
+      m(n(H), {
         show: n(o),
         as: "template"
       }, {
-        default: _(() => [
-          m(n(V), {
+        default: v(() => [
+          m(n(R), {
             as: "div",
             class: "fixed inset-0 top-20 z-50 flex -translate-y-2 lg:hidden",
             onClose: n(u)
           }, {
-            default: _(() => [
-              m(n(D), {
+            default: v(() => [
+              m(n(V), {
                 as: "template",
                 enter: "transition ease-in-out duration-300 transform",
                 "enter-from": "translate-y-full",
@@ -338,20 +444,20 @@ const te = {
                 "leave-from": "translate-y-0",
                 "leave-to": "translate-y-full"
               }, {
-                default: _(() => [
-                  s("div", le, [
-                    s("div", se, [
-                      s("nav", ie, [
-                        s("ul", re, [
-                          (a(!0), c(I, null, z(n(l), (i) => (a(), c("li", {
+                default: v(() => [
+                  l("div", me, [
+                    l("div", pe, [
+                      l("nav", fe, [
+                        l("ul", _e, [
+                          (a(!0), c(L, null, B(n(s), (i) => (a(), c("li", {
                             key: i.name,
                             "data-test-navigation-item": ""
                           }, [
-                            m(B, { item: i }, null, 8, ["item"])
+                            m(O, { item: i }, null, 8, ["item"])
                           ]))), 128))
                         ])
                       ]),
-                      m(O)
+                      m(P)
                     ])
                   ])
                 ]),
@@ -363,90 +469,120 @@ const te = {
         ]),
         _: 1
       }, 8, ["show"]),
-      m(O)
+      m(P)
     ]));
   }
-}), ue = { class: "mx-auto mb-auto" }, de = { class: "mx-auto mt-auto" }, S = /* @__PURE__ */ f({
+}), ve = { class: "mx-auto mb-auto" }, ye = { class: "mx-auto mt-auto" }, T = /* @__PURE__ */ p({
   __name: "AppNavigationMenu",
   setup(t) {
-    const { navigationItems: e, mainMenuOpen: l } = $();
+    const { navigationItems: e, mainMenuOpen: s } = A();
     return (o, r) => (a(), c("div", null, [
-      s("aside", {
-        class: b([{ "px-3 md:!w-20": n(l) }, "sticky top-0 hidden h-screen w-0 flex-col justify-center overflow-hidden py-5 transition-all duration-500 md:flex"]),
+      l("aside", {
+        class: x([{ "px-3 md:!w-20": n(s) }, "sticky top-0 hidden h-screen w-0 flex-col justify-center overflow-hidden py-5 transition-all duration-500 md:flex"]),
         "data-test-main-menu": ""
       }, [
-        s("ul", ue, [
-          (a(!0), c(I, null, z(n(e).filter((u) => u.bottom !== !0), (u) => (a(), c("li", {
+        l("ul", ve, [
+          (a(!0), c(L, null, B(n(e).filter((u) => u.bottom !== !0), (u) => (a(), c("li", {
             key: u.name,
             "data-test-top-navigation-item": ""
           }, [
-            m(B, { item: u }, null, 8, ["item"])
+            m(O, { item: u }, null, 8, ["item"])
           ]))), 128))
         ]),
-        s("ul", de, [
-          (a(!0), c(I, null, z(n(e).filter((u) => u.bottom), (u) => (a(), c("li", {
+        l("ul", ye, [
+          (a(!0), c(L, null, B(n(e).filter((u) => u.bottom), (u) => (a(), c("li", {
             key: u.name,
             "data-test-bottom-navigation-item": ""
           }, [
-            m(B, { item: u }, null, 8, ["item"])
+            m(O, { item: u }, null, 8, ["item"])
           ]))), 128)),
-          s("li", null, [
-            m(O, { class: "!static" })
+          l("li", null, [
+            m(P, { class: "!static" })
           ])
         ])
       ], 2),
-      m(ce)
+      m(he)
+    ]));
+  }
+}), ge = { class: "flex text-sm font-bold" }, xe = {
+  class: "rounded-l-lg bg-indigo-900 px-2 py-1.5 text-white",
+  "data-test-country-code": ""
+}, be = {
+  class: "rounded-r-lg bg-yellow-400 px-2 py-1.5 uppercase text-zinc-900",
+  "data-test-license-plate": ""
+}, je = /* @__PURE__ */ p({
+  __name: "AppLicensePlate",
+  props: {
+    license: { default: void 0 },
+    country: { default: "NL" }
+  },
+  setup(t) {
+    return (e, s) => (a(), c("div", ge, [
+      l("span", xe, C(t.country), 1),
+      l("span", be, [
+        d(e.$slots, "default", {}, () => [
+          z(C(t.license), 1)
+        ])
+      ])
     ]));
   }
-}), me = { class: "flex min-h-screen flex-col md:flex-row md:bg-secondary" }, pe = { class: "flex h-full grow items-center justify-center bg-white px-10 transition-all md:h-auto md:w-1/2 md:grow-0 md:rounded-l-2xl md:px-24" }, fe = { class: "mx-auto md:max-w-lg" }, he = {
+}), we = { class: "flex min-h-screen flex-col md:flex-row md:bg-secondary" }, $e = { class: "flex h-full grow items-center justify-center bg-white px-10 transition-all md:h-auto md:w-1/2 md:grow-0 md:rounded-l-2xl md:px-24" }, Ce = { class: "mx-auto md:max-w-lg" }, ke = {
   class: "hidden w-1/2 md:block",
   "data-test-layout-image-wrapper": ""
-}, _e = ["src"], Ce = /* @__PURE__ */ f({
+}, Me = ["src"], Te = /* @__PURE__ */ p({
   __name: "Auth",
   setup(t) {
-    const { layoutImage: e } = Y();
-    return (l, o) => (a(), c("div", me, [
-      m(n(S)),
-      s("main", pe, [
-        s("div", fe, [
-          y(l.$slots, "default")
+    const { layoutImage: e } = te();
+    return (s, o) => (a(), c("div", we, [
+      m(n(T)),
+      l("main", $e, [
+        l("div", Ce, [
+          d(s.$slots, "default")
         ])
       ]),
-      s("div", he, [
+      l("div", ke, [
         n(e) ? (a(), c("img", {
           key: 0,
           src: n(e),
           class: "h-screen w-full object-fill"
-        }, null, 8, _e)) : M("", !0)
+        }, null, 8, Me)) : b("", !0)
       ])
     ]));
   }
-}), ye = { class: "flex min-h-screen flex-col md:flex-row md:bg-secondary" }, ve = { class: "order-3 flex h-full grow bg-zinc-100 px-2 py-8 transition-all md:order-2 md:h-auto md:rounded-l-2xl md:pr-7" }, ge = { class: "w-full" }, we = {
+}), Ie = { class: "flex min-h-screen flex-col md:flex-row md:bg-secondary" }, ze = /* @__PURE__ */ l("div", {
+  id: "top",
+  class: "order-2 px-4 empty:px-0"
+}, null, -1), Ae = { class: "order-4 flex h-full grow bg-zinc-100 px-4 py-8 transition-all md:order-3 md:h-auto md:rounded-l-2xl md:px-6 md:pr-12" }, Le = { class: "w-full" }, Be = {
   id: "sidebar-wrapper",
-  class: "order-2 w-141 max-w-full shrink-0 grow-0 rounded-l-2xl bg-white px-4 py-8 md:sticky md:top-0 md:order-3 md:-ml-5 md:max-h-screen",
+  class: "order-3 w-141 max-w-full shrink-0 grow-0 rounded-l-2xl bg-white px-4 py-8 md:sticky md:top-0 md:order-4 md:-ml-5 md:max-h-screen md:px-12 md:py-14",
   "data-test-layout-sidebar-wrapper": ""
-}, $e = /* @__PURE__ */ f({
+}, Ee = /* @__PURE__ */ p({
   __name: "Base",
   setup(t) {
-    return (e, l) => (a(), c("div", ye, [
-      m(n(S), { class: "order-1" }),
-      s("main", ve, [
-        s("div", ge, [
-          y(e.$slots, "default")
+    return (e, s) => (a(), c("div", Ie, [
+      m(n(T), { class: "order-1" }),
+      d(e.$slots, "top", {}, () => [
+        ze
+      ]),
+      l("main", Ae, [
+        l("div", Le, [
+          d(e.$slots, "default")
         ])
       ]),
-      s("div", we, [
-        y(e.$slots, "sidebar")
+      l("div", Be, [
+        d(e.$slots, "sidebar")
       ])
     ]));
   }
 });
 export {
-  Me as AppButton,
-  P as AppLoader,
-  S as AppNavigationMenu,
-  Ce as AuthLayout,
-  $e as BaseLayout,
-  Y as useLayout,
-  $ as useNavigation
+  Se as AppButton,
+  Ne as AppCard,
+  je as AppLicensePlate,
+  S as AppLoader,
+  T as AppNavigationMenu,
+  Te as AuthLayout,
+  Ee as BaseLayout,
+  te as useLayout,
+  A as useNavigation
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@autoafleveren/ui",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "type": "module",
   "files": [
     "dist/*",
@@ -56,45 +56,45 @@
   "dependencies": {
     "@headlessui/vue": "^1.7.13",
     "@heroicons/vue": "^2.0.17",
-    "@vitejs/plugin-vue": "^4.1.0",
+    "@vitejs/plugin-vue": "^4.2.1",
     "autoprefixer": "^10.4.14",
-    "tailwindcss": "^3.3.1",
-    "vite": "^4.3.1",
+    "tailwindcss": "^3.3.2",
+    "vite": "^4.3.5",
     "vue": "^3.2.47",
-    "vue-docgen-api": "^4.67.0"
+    "vue-docgen-api": "^4.71.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.21.4",
-    "@babel/preset-typescript": "^7.21.4",
+    "@babel/core": "^7.21.8",
+    "@babel/preset-typescript": "^7.21.5",
     "@mdx-js/react": "^2.3.0",
     "@programic/eslint-plugin": "^6.2.0",
     "@rushstack/eslint-patch": "^1.2.0",
-    "@storybook/addon-actions": "^7.0.6",
-    "@storybook/addon-docs": "^7.0.6",
-    "@storybook/addon-essentials": "^7.0.6",
-    "@storybook/addon-interactions": "^7.0.6",
-    "@storybook/addon-links": "^7.0.6",
+    "@storybook/addon-actions": "^7.0.9",
+    "@storybook/addon-docs": "^7.0.9",
+    "@storybook/addon-essentials": "^7.0.9",
+    "@storybook/addon-interactions": "^7.0.9",
+    "@storybook/addon-links": "^7.0.10",
     "@storybook/addon-postcss": "^2.0.0",
-    "@storybook/addon-styling": "^1.0.1",
-    "@storybook/addons": "^7.0.6",
-    "@storybook/builder-vite": "^7.0.6",
-    "@storybook/client-api": "^7.0.6",
-    "@storybook/preview-web": "^7.0.6",
+    "@storybook/addon-styling": "^1.0.6",
+    "@storybook/addons": "^7.0.9",
+    "@storybook/builder-vite": "^7.0.9",
+    "@storybook/client-api": "^7.0.9",
+    "@storybook/preview-web": "^7.0.9",
     "@storybook/testing-library": "^0.1.0",
-    "@storybook/theming": "^7.0.6",
-    "@storybook/vue3": "^7.0.6",
-    "@storybook/vue3-vite": "^7.0.6",
+    "@storybook/theming": "^7.0.9",
+    "@storybook/vue3": "^7.0.10",
+    "@storybook/vue3-vite": "^7.0.9",
     "@types/eslint": "^8.37.0",
     "@types/jsdom": "^21.1.1",
-    "@types/node": "^18.15.11",
-    "@types/react": "^18.0.37",
-    "@types/react-dom": "^18.0.11",
-    "@typescript-eslint/eslint-plugin": "^5.59.1",
-    "@typescript-eslint/parser": "^5.59.1",
-    "@vue/test-utils": "^2.3.2",
-    "@vue/tsconfig": "^0.1.3",
+    "@types/node": "^20.1.1",
+    "@types/react": "^18.2.6",
+    "@types/react-dom": "^18.2.4",
+    "@typescript-eslint/eslint-plugin": "^5.59.5",
+    "@typescript-eslint/parser": "^5.59.5",
+    "@vue/test-utils": "^2.4.0-alpha.0",
+    "@vue/tsconfig": "^0.3.2",
     "babel-loader": "^9.1.2",
-    "eslint": "^8.39.0",
+    "eslint": "^8.40.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-import-resolver-typescript": "^3.5.5",
     "eslint-plugin-import": "^2.27.5",
@@ -102,21 +102,21 @@
     "eslint-plugin-tailwindcss": "^3.11.0",
     "eslint-plugin-unicorn": "^46.0.0",
     "eslint-plugin-vitest": "^0.1.4",
-    "eslint-plugin-vue": "^9.11.0",
-    "jsdom": "^21.1.1",
-    "postcss": "^8.4.22",
+    "eslint-plugin-vue": "^9.11.1",
+    "jsdom": "^22.0.0",
+    "postcss": "^8.4.23",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "storybook": "^7.0.6",
+    "storybook": "^7.0.9",
     "storybook-dark-mode": "^3.0.0",
-    "typescript": "^4.9.5",
+    "typescript": "^5.0.4",
     "vite-plugin-externals": "^0.6.2",
     "vite-plugin-singlefile": "^0.13.5",
-    "vitest": "^0.30.1",
-    "vue-eslint-parser": "^9.1.1",
-    "vue-loader": "^17.0.1",
+    "vitest": "^0.31.0",
+    "vue-eslint-parser": "^9.2.1",
+    "vue-loader": "^17.1.0",
     "vue-template-compiler": "^2.7.14",
-    "vue-tsc": "~1.2.1"
+    "vue-tsc": "~1.6.4"
   },
   "stableVersion": "0.0.2"
 }