@solfacil/girassol 0.2.4 → 0.2.7

package/dist/types/index.d.ts

@@ -10,6 +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/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';
@@ -413,9 +416,6 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                class: {
-                    type: import("vue").PropType<string>;
-                };
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
@@ -423,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>;
                 } & {
@@ -461,9 +464,6 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                class: {
-                    type: import("vue").PropType<string>;
-                };
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
@@ -471,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>;
                 } & {
@@ -521,9 +524,6 @@ export declare const components: {
             } & {
                 default: string;
             };
-            class: {
-                type: import("vue").PropType<string>;
-            };
             id: {
                 type: import("vue").PropType<string>;
                 required: true;
@@ -531,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>;
             } & {
@@ -559,9 +562,6 @@ export declare const components: {
         } & {
             default: string;
         };
-        class: {
-            type: import("vue").PropType<string>;
-        };
         id: {
             type: import("vue").PropType<string>;
             required: true;
@@ -569,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>;
         } & {
@@ -612,9 +615,6 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                class: {
-                    type: import("vue").PropType<string>;
-                };
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
@@ -622,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>;
                 } & {
@@ -655,9 +658,6 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                class: {
-                    type: import("vue").PropType<string>;
-                };
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
@@ -665,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>;
                 } & {
@@ -709,9 +712,6 @@ export declare const components: {
             } & {
                 default: string;
             };
-            class: {
-                type: import("vue").PropType<string>;
-            };
             id: {
                 type: import("vue").PropType<string>;
                 required: true;
@@ -719,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>;
             } & {
@@ -742,9 +745,6 @@ export declare const components: {
         } & {
             default: string;
         };
-        class: {
-            type: import("vue").PropType<string>;
-        };
         id: {
             type: import("vue").PropType<string>;
             required: true;
@@ -752,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>;
         } & {
@@ -2627,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: {
@@ -2854,6 +2857,362 @@ export declare const components: {
             default: (_: {}) => any;
         };
     });
+    SolMenu: {
+        new (...args: any[]): {
+            $: import("vue").ComponentInternalInstance;
+            $data: {};
+            $props: Partial<{
+                label: string;
+                position: ("bottom" | "top") | ("right" | "left");
+            }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+                label: {
+                    type: import("vue").PropType<string>;
+                } & {
+                    default: string;
+                };
+                id: {
+                    type: import("vue").PropType<string>;
+                    required: true;
+                };
+                position: {
+                    type: import("vue").PropType<("bottom" | "top") | ("right" | "left")>;
+                } & {
+                    default: string;
+                };
+            }>> & {
+                onChange?: ((value: string) => any) | undefined;
+            } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "label" | "position">;
+            $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: "change", value: string) => void;
+            $el: any;
+            $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+                label: {
+                    type: import("vue").PropType<string>;
+                } & {
+                    default: string;
+                };
+                id: {
+                    type: import("vue").PropType<string>;
+                    required: true;
+                };
+                position: {
+                    type: import("vue").PropType<("bottom" | "top") | ("right" | "left")>;
+                } & {
+                    default: string;
+                };
+            }>> & {
+                onChange?: ((value: string) => any) | undefined;
+            }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+                change: (value: string) => void;
+            }, string, {
+                label: string;
+                position: ("bottom" | "top") | ("right" | "left");
+            }> & {
+                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<{
+            label: {
+                type: import("vue").PropType<string>;
+            } & {
+                default: string;
+            };
+            id: {
+                type: import("vue").PropType<string>;
+                required: true;
+            };
+            position: {
+                type: import("vue").PropType<("bottom" | "top") | ("right" | "left")>;
+            } & {
+                default: string;
+            };
+        }>> & {
+            onChange?: ((value: string) => any) | undefined;
+        } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
+        __isFragment?: undefined;
+        __isTeleport?: undefined;
+        __isSuspense?: undefined;
+    } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+        label: {
+            type: import("vue").PropType<string>;
+        } & {
+            default: string;
+        };
+        id: {
+            type: import("vue").PropType<string>;
+            required: true;
+        };
+        position: {
+            type: import("vue").PropType<("bottom" | "top") | ("right" | "left")>;
+        } & {
+            default: string;
+        };
+    }>> & {
+        onChange?: ((value: string) => any) | undefined;
+    }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        change: (value: string) => void;
+    }, string, {
+        label: string;
+        position: ("bottom" | "top") | ("right" | "left");
+    }> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: {
+            label: (_: {
+                isOpen: boolean;
+            }) => any;
+            default: (_: {}) => any;
+        };
+    });
+    SolMenuItemLink: {
+        new (...args: any[]): {
+            $: import("vue").ComponentInternalInstance;
+            $data: {};
+            $props: Partial<{}> & Omit<Readonly<import("vue").ExtractPropTypes<{
+                id: {
+                    type: import("vue").PropType<string>;
+                    required: true;
+                };
+                text: {
+                    type: import("vue").PropType<string>;
+                };
+                link: {
+                    type: import("vue").PropType<string>;
+                };
+                active: {
+                    type: import("vue").PropType<boolean>;
+                };
+                external: {
+                    type: import("vue").PropType<boolean>;
+                };
+            }>> & 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;
+                };
+                text: {
+                    type: import("vue").PropType<string>;
+                };
+                link: {
+                    type: import("vue").PropType<string>;
+                };
+                active: {
+                    type: import("vue").PropType<boolean>;
+                };
+                external: {
+                    type: import("vue").PropType<boolean>;
+                };
+            }>>, {}, 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;
+            };
+            text: {
+                type: import("vue").PropType<string>;
+            };
+            link: {
+                type: import("vue").PropType<string>;
+            };
+            active: {
+                type: import("vue").PropType<boolean>;
+            };
+            external: {
+                type: import("vue").PropType<boolean>;
+            };
+        }>> & 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;
+        };
+        text: {
+            type: import("vue").PropType<string>;
+        };
+        link: {
+            type: import("vue").PropType<string>;
+        };
+        active: {
+            type: import("vue").PropType<boolean>;
+        };
+        external: {
+            type: import("vue").PropType<boolean>;
+        };
+    }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: {
+            default: (_: {
+                id: string;
+                active: boolean | undefined;
+                link: string | undefined;
+                text: string | undefined;
+                external: boolean | undefined;
+            }) => 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, };
+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.4",
+  "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/safelist.ts

@@ -22,6 +22,8 @@ export function safelist({ activeSafeList = true, data }: Args): string[] {
     const colsSpan = range(14).map(i => `col-span-${i}`)
 
     return [
+      'debug',
+      'debug-all',
       ...colors,
       ...spacing,
       ...gaps,

package/theme/solfacil/index.ts

@@ -5,7 +5,8 @@ import spacing from './spacing'
 import effects from './effects'
 import misc from './miscs'
 
-import { componentTypos ,debug, maxLines, outlinesForFocus, placeholder } from './utilities'
+import { screens } from './screens'
+import { componentTypos, debug, maxLines, outlinesForFocus, placeholder } from './utilities'
 
 
 export {
@@ -15,6 +16,7 @@ export {
   borders,
   effects,
   misc,
+  screens,
 }
 
 export const utilities = {

package/theme/solfacil/miscs.ts

@@ -1,8 +1,19 @@
+import { sizings } from './spacing'
+
 export default {
   width: {
     'fit-content': 'fit-content',
+    ...sizings,
   },
-
+  
+  height: sizings,
+  minHeight: sizings,  
+  maxHeight: sizings,
+  minWidth: sizings,
+  maxWidth: sizings,
+  
+  spacing: sizings,
+  
   colors: {
     transparent: 'transparent',
   },

package/theme/solfacil/screens.ts

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