@solfacil/girassol 0.2.6 → 0.2.7

package/dist/types/components/menus/menu-item/menu-item-link/types.d.ts

@@ -0,0 +1,6 @@
+export interface LinkData {
+    text?: string;
+    link?: string;
+    active?: boolean;
+    external?: boolean;
+}

package/dist/types/components/{menu-item/MenuItemLink.vue.d.ts → menus/menu-navigation-links/MenuNavigationLinks.vue.d.ts}

@@ -1,13 +1,12 @@
+import type { LinkData } from '@components/menus/menu-item/menu-item-link/types';
 declare const _default: {
     new (...args: any[]): {
         $: import("vue").ComponentInternalInstance;
         $data: {};
         $props: Partial<{}> & Omit<Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
             id: string;
-            text?: string | undefined;
-            link?: string | undefined;
-            active?: boolean | undefined;
-            external?: boolean | undefined;
+            label?: string | undefined;
+            linkItems: LinkData[];
         }>>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>;
         $attrs: {
             [x: string]: unknown;
@@ -24,10 +23,8 @@ declare const _default: {
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
             id: string;
-            text?: string | undefined;
-            link?: string | undefined;
-            active?: boolean | undefined;
-            external?: boolean | undefined;
+            label?: string | undefined;
+            linkItems: LinkData[];
         }>>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {}> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
             created?: ((() => void) | (() => void)[]) | undefined;
@@ -50,22 +47,21 @@ declare const _default: {
         $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
     } & Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
         id: string;
-        text?: string | undefined;
-        link?: string | undefined;
-        active?: boolean | undefined;
-        external?: boolean | undefined;
+        label?: string | undefined;
+        linkItems: LinkData[];
     }>>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
     __isFragment?: undefined;
     __isTeleport?: undefined;
     __isSuspense?: undefined;
 } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     id: string;
-    text?: string | undefined;
-    link?: string | undefined;
-    active?: boolean | undefined;
-    external?: boolean | undefined;
+    label?: string | undefined;
+    linkItems: LinkData[];
 }>>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: {
+        label: (_: {
+            isOpen: boolean;
+        }) => any;
         default: (_: {
             id: string;
             active: boolean | undefined;

package/dist/types/components/menus/menu-navigation-links/index.d.ts

@@ -0,0 +1,2 @@
+import SolMenuNavigationLinks from './MenuNavigationLinks.vue';
+export { SolMenuNavigationLinks, };

package/dist/types/index.d.ts

@@ -10,8 +10,9 @@ import { SolDropdown } from './components/dropdown/';
 import { SolSelect } from './components/forms/select';
 import { SolChip } from './components/informations/chip';
 import { SolAccordion } from './components/accordion/';
-import { SolMenu } from './components/menu/';
-import { SolMenuItemLink } from './components/menu-item';
+import { SolMenu } from './components/menus/menu';
+import { SolMenuItemLink } from './components/menus/menu-item/menu-item-link/';
+import { SolMenuNavigationLinks } from './components/menus/menu-navigation-links';
 import 'virtual:windi-base.css';
 import 'virtual:windi-components.css';
 import 'virtual:windi-utilities.css';
@@ -415,9 +416,6 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                class: {
-                    type: import("vue").PropType<string>;
-                };
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
@@ -425,6 +423,9 @@ export declare const components: {
                 invert: {
                     type: import("vue").PropType<boolean>;
                 };
+                class: {
+                    type: import("vue").PropType<string>;
+                };
                 modelValue: {
                     type: import("vue").PropType<string>;
                 } & {
@@ -463,9 +464,6 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                class: {
-                    type: import("vue").PropType<string>;
-                };
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
@@ -473,6 +471,9 @@ export declare const components: {
                 invert: {
                     type: import("vue").PropType<boolean>;
                 };
+                class: {
+                    type: import("vue").PropType<string>;
+                };
                 modelValue: {
                     type: import("vue").PropType<string>;
                 } & {
@@ -523,9 +524,6 @@ export declare const components: {
             } & {
                 default: string;
             };
-            class: {
-                type: import("vue").PropType<string>;
-            };
             id: {
                 type: import("vue").PropType<string>;
                 required: true;
@@ -533,6 +531,9 @@ export declare const components: {
             invert: {
                 type: import("vue").PropType<boolean>;
             };
+            class: {
+                type: import("vue").PropType<string>;
+            };
             modelValue: {
                 type: import("vue").PropType<string>;
             } & {
@@ -561,9 +562,6 @@ export declare const components: {
         } & {
             default: string;
         };
-        class: {
-            type: import("vue").PropType<string>;
-        };
         id: {
             type: import("vue").PropType<string>;
             required: true;
@@ -571,6 +569,9 @@ export declare const components: {
         invert: {
             type: import("vue").PropType<boolean>;
         };
+        class: {
+            type: import("vue").PropType<string>;
+        };
         modelValue: {
             type: import("vue").PropType<string>;
         } & {
@@ -614,9 +615,6 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                class: {
-                    type: import("vue").PropType<string>;
-                };
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
@@ -624,6 +622,9 @@ export declare const components: {
                 invert: {
                     type: import("vue").PropType<boolean>;
                 };
+                class: {
+                    type: import("vue").PropType<string>;
+                };
                 modelValue: {
                     type: import("vue").PropType<string | number>;
                 } & {
@@ -657,9 +658,6 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                class: {
-                    type: import("vue").PropType<string>;
-                };
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
@@ -667,6 +665,9 @@ export declare const components: {
                 invert: {
                     type: import("vue").PropType<boolean>;
                 };
+                class: {
+                    type: import("vue").PropType<string>;
+                };
                 modelValue: {
                     type: import("vue").PropType<string | number>;
                 } & {
@@ -711,9 +712,6 @@ export declare const components: {
             } & {
                 default: string;
             };
-            class: {
-                type: import("vue").PropType<string>;
-            };
             id: {
                 type: import("vue").PropType<string>;
                 required: true;
@@ -721,6 +719,9 @@ export declare const components: {
             invert: {
                 type: import("vue").PropType<boolean>;
             };
+            class: {
+                type: import("vue").PropType<string>;
+            };
             modelValue: {
                 type: import("vue").PropType<string | number>;
             } & {
@@ -744,9 +745,6 @@ export declare const components: {
         } & {
             default: string;
         };
-        class: {
-            type: import("vue").PropType<string>;
-        };
         id: {
             type: import("vue").PropType<string>;
             required: true;
@@ -754,6 +752,9 @@ export declare const components: {
         invert: {
             type: import("vue").PropType<boolean>;
         };
+        class: {
+            type: import("vue").PropType<string>;
+        };
         modelValue: {
             type: import("vue").PropType<string | number>;
         } & {
@@ -2629,7 +2630,7 @@ export declare const components: {
             }>;
             $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
             $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
-            $emit: ((event: "close") => void) & ((event: "update:selected") => void);
+            $emit: ((event: "update:selected") => void) & ((event: "close") => void);
             $el: any;
             $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
                 label: {
@@ -2862,7 +2863,7 @@ export declare const components: {
             $data: {};
             $props: Partial<{
                 label: string;
-                position: ("top" | "bottom") | ("right" | "left");
+                position: ("bottom" | "top") | ("right" | "left");
             }> & Omit<Readonly<import("vue").ExtractPropTypes<{
                 label: {
                     type: import("vue").PropType<string>;
@@ -2874,7 +2875,7 @@ export declare const components: {
                     required: true;
                 };
                 position: {
-                    type: import("vue").PropType<("top" | "bottom") | ("right" | "left")>;
+                    type: import("vue").PropType<("bottom" | "top") | ("right" | "left")>;
                 } & {
                     default: string;
                 };
@@ -2905,7 +2906,7 @@ export declare const components: {
                     required: true;
                 };
                 position: {
-                    type: import("vue").PropType<("top" | "bottom") | ("right" | "left")>;
+                    type: import("vue").PropType<("bottom" | "top") | ("right" | "left")>;
                 } & {
                     default: string;
                 };
@@ -2915,7 +2916,7 @@ export declare const components: {
                 change: (value: string) => void;
             }, string, {
                 label: string;
-                position: ("top" | "bottom") | ("right" | "left");
+                position: ("bottom" | "top") | ("right" | "left");
             }> & {
                 beforeCreate?: ((() => void) | (() => void)[]) | undefined;
                 created?: ((() => void) | (() => void)[]) | undefined;
@@ -2947,7 +2948,7 @@ export declare const components: {
                 required: true;
             };
             position: {
-                type: import("vue").PropType<("top" | "bottom") | ("right" | "left")>;
+                type: import("vue").PropType<("bottom" | "top") | ("right" | "left")>;
             } & {
                 default: string;
             };
@@ -2968,7 +2969,7 @@ export declare const components: {
             required: true;
         };
         position: {
-            type: import("vue").PropType<("top" | "bottom") | ("right" | "left")>;
+            type: import("vue").PropType<("bottom" | "top") | ("right" | "left")>;
         } & {
             default: string;
         };
@@ -2978,10 +2979,12 @@ export declare const components: {
         change: (value: string) => void;
     }, string, {
         label: string;
-        position: ("top" | "bottom") | ("right" | "left");
+        position: ("bottom" | "top") | ("right" | "left");
     }> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
         $slots: {
-            label: (_: {}) => any;
+            label: (_: {
+                isOpen: boolean;
+            }) => any;
             default: (_: {}) => any;
         };
     });
@@ -3106,6 +3109,110 @@ export declare const components: {
             }) => any;
         };
     });
+    SolMenuNavigationLinks: {
+        new (...args: any[]): {
+            $: import("vue").ComponentInternalInstance;
+            $data: {};
+            $props: Partial<{}> & Omit<Readonly<import("vue").ExtractPropTypes<{
+                id: {
+                    type: import("vue").PropType<string>;
+                    required: true;
+                };
+                label: {
+                    type: import("vue").PropType<string>;
+                };
+                linkItems: {
+                    type: import("vue").PropType<import("./components/menus/menu-item/menu-item-link/types").LinkData[]>;
+                    required: true;
+                };
+            }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>;
+            $attrs: {
+                [x: string]: unknown;
+            };
+            $refs: {
+                [x: string]: unknown;
+            };
+            $slots: Readonly<{
+                [name: string]: import("vue").Slot | undefined;
+            }>;
+            $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+            $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
+            $emit: (event: string, ...args: any[]) => void;
+            $el: any;
+            $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+                id: {
+                    type: import("vue").PropType<string>;
+                    required: true;
+                };
+                label: {
+                    type: import("vue").PropType<string>;
+                };
+                linkItems: {
+                    type: import("vue").PropType<import("./components/menus/menu-item/menu-item-link/types").LinkData[]>;
+                    required: true;
+                };
+            }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {}> & {
+                beforeCreate?: ((() => void) | (() => void)[]) | undefined;
+                created?: ((() => void) | (() => void)[]) | undefined;
+                beforeMount?: ((() => void) | (() => void)[]) | undefined;
+                mounted?: ((() => void) | (() => void)[]) | undefined;
+                beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
+                updated?: ((() => void) | (() => void)[]) | undefined;
+                activated?: ((() => void) | (() => void)[]) | undefined;
+                deactivated?: ((() => void) | (() => void)[]) | undefined;
+                beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
+                beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
+                destroyed?: ((() => void) | (() => void)[]) | undefined;
+                unmounted?: ((() => void) | (() => void)[]) | undefined;
+                renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+                renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
+                errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
+            };
+            $forceUpdate: () => void;
+            $nextTick: typeof import("vue").nextTick;
+            $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
+        } & Readonly<import("vue").ExtractPropTypes<{
+            id: {
+                type: import("vue").PropType<string>;
+                required: true;
+            };
+            label: {
+                type: import("vue").PropType<string>;
+            };
+            linkItems: {
+                type: import("vue").PropType<import("./components/menus/menu-item/menu-item-link/types").LinkData[]>;
+                required: true;
+            };
+        }>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
+        __isFragment?: undefined;
+        __isTeleport?: undefined;
+        __isSuspense?: undefined;
+    } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+        id: {
+            type: import("vue").PropType<string>;
+            required: true;
+        };
+        label: {
+            type: import("vue").PropType<string>;
+        };
+        linkItems: {
+            type: import("vue").PropType<import("./components/menus/menu-item/menu-item-link/types").LinkData[]>;
+            required: true;
+        };
+    }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: {
+            label: (_: {
+                isOpen: boolean;
+            }) => any;
+            default: (_: {
+                id: string;
+                active: boolean | undefined;
+                link: string | undefined;
+                text: string | undefined;
+                external: boolean | undefined;
+            }) => any;
+        };
+    });
 };
 export declare function install(App: App): void;
-export { SolButton, SolButtonDestructive, SolInput, SolTextarea, SolTextfield, SolTextfieldPassword, SolRadio, SolRadioGroup, SolCheckbox, SolCheckboxGroup, SolSwitch, SolDropdown, SolSelect, SolChip, SolAccordion, SolMenu, SolMenuItemLink, };
+export { SolButton, SolButtonDestructive, SolInput, SolTextarea, SolTextfield, SolTextfieldPassword, SolRadio, SolRadioGroup, SolCheckbox, SolCheckboxGroup, SolSwitch, SolDropdown, SolSelect, SolChip, SolAccordion, SolMenu, SolMenuItemLink, SolMenuNavigationLinks, };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@solfacil/girassol",
   "description": "Girassol design system",
-  "version": "0.2.6",
+  "version": "0.2.7",
   "authors": [
     {
       "name": "Kevin Martin",
@@ -57,17 +57,17 @@
     "pre-commit": "./.husky/run-staged-tests.js"
   },
   "dependencies": {
-    "@vueuse/core": "^9.0.0",
+    "@vueuse/core": "^9.1.0",
     "gluegun": "latest",
     "vue": "^3.2.37"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.25.2",
-    "@babel/core": "^7.18.6",
-    "@babel/preset-env": "^7.18.6",
+    "@antfu/eslint-config": "^0.26.1",
+    "@babel/core": "^7.18.10",
+    "@babel/preset-env": "^7.18.10",
     "@commitlint/cli": "^17.0.3",
     "@commitlint/config-conventional": "^17.0.3",
-    "@iconify/json": "^2.1.84",
+    "@iconify/json": "^2.1.89",
     "@storybook/addon-a11y": "^6.5.9",
     "@storybook/addon-actions": "^6.5.9",
     "@storybook/addon-essentials": "^6.5.9",
@@ -77,14 +77,14 @@
     "@storybook/vue3": "^6.5.9",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/user-event": "^14.2.1",
-    "@testing-library/vue": "^6.6.0",
+    "@testing-library/vue": "^6.6.1",
     "@types/jest-axe": "^3.5.4",
     "@types/node": "^17.0.41",
     "@typescript-eslint/eslint-plugin": "^5.30.0",
     "@typescript-eslint/parser": "^5.30.0",
     "@vitejs/plugin-vue": "^3.0.1",
     "babel-loader": "^8.2.5",
-    "c8": "^7.11.3",
+    "c8": "^7.12.0",
     "cli-spinner": "^0.2.10",
     "commitizen": "^4.2.4",
     "copyfiles": "^2.4.1",
@@ -107,12 +107,12 @@
     "ts-node": "^10.8.1",
     "typescript": "^4.7.4",
     "unplugin-icons": "^0.14.7",
-    "vite": "^3.0.3",
+    "vite": "^3.0.5",
     "vite-plugin-inspect": "^0.5.1",
     "vite-plugin-windicss": "^1.8.7",
-    "vitest": "^0.19.1",
+    "vitest": "^0.21.1",
     "vue-loader": "^17.0.0",
-    "vue-tsc": "^0.39.2",
+    "vue-tsc": "^0.40.0",
     "windicss": "^3.5.6"
   },
   "repository": {

package/theme/solfacil/screens.ts

@@ -1,5 +1,5 @@
 export const screens = {
   'sm': { max: '767px' },
-  'md': { min: '768px', max: '1365px' },
+  'md': { min: '768px' },
   'lg': { min: '1366px' },
 }

package/theme/solfacil/utilities.ts

@@ -112,6 +112,17 @@ export const componentTypos = plugin(({ addUtilities, theme }) => {
     lineHeight: wrapperThemeType('lineHeight.xs'),
   }
   const body = {
+    '.fonts-body-x-large-regular': {
+      ...bodyCommons,
+      fontSize: wrapperThemeType('fontSize.xs'),
+      fontWeight: wrapperThemeType('fontWeight.regular'),
+    },
+    '.fonts-body-x-large-bold': {
+      ...bodyCommons,
+      fontSize: wrapperThemeType('fontSize.xs'),
+      fontWeight: wrapperThemeType('fontWeight.bold'),
+    },
+
     '.fonts-body-large-regular': {
       ...bodyCommons,
       fontSize: wrapperThemeType('fontSize.2xs'),

package/vite.config.ts

@@ -33,6 +33,7 @@ export default defineConfig({
     alias: {
       '@': path.resolve(currentPath, './src'),
       '@assets': path.resolve(currentPath, './src/assets'),
+      '@composables': path.resolve(currentPath, './src/composables'),
       '@components': path.resolve(currentPath, './src/components'),
       '@forms': path.resolve(currentPath, './src/components/forms'),
       '@themes': path.resolve(currentPath, 'theme'),
@@ -42,7 +43,7 @@ export default defineConfig({
   plugins: [
     vue({
       include: [/\.vue$/],
-    }),
+    }) as any,
 
     WindiCSS(),