@solfacil/girassol 0.2.7 → 0.2.8

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

@@ -9,7 +9,9 @@ declare const _default: {
             link?: LinkData['link'];
             active?: LinkData['active'];
             external?: LinkData['external'];
-        }>>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>;
+        }>>> & {
+            onClicked?: (() => any) | undefined;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>;
         $attrs: {
             [x: string]: unknown;
         };
@@ -21,7 +23,7 @@ declare const _default: {
         }>;
         $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;
+        $emit: (event: "clicked") => void;
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
             id: string;
@@ -29,7 +31,11 @@ declare const _default: {
             link?: LinkData['link'];
             active?: LinkData['active'];
             external?: LinkData['external'];
-        }>>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {}> & {
+        }>>> & {
+            onClicked?: (() => any) | undefined;
+        }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            clicked: () => void;
+        }, string, {}> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
             created?: ((() => void) | (() => void)[]) | undefined;
             beforeMount?: ((() => void) | (() => void)[]) | undefined;
@@ -55,7 +61,9 @@ declare const _default: {
         link?: LinkData['link'];
         active?: LinkData['active'];
         external?: LinkData['external'];
-    }>>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
+    }>>> & {
+        onClicked?: (() => any) | undefined;
+    } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
     __isFragment?: undefined;
     __isTeleport?: undefined;
     __isSuspense?: undefined;
@@ -65,7 +73,11 @@ declare const _default: {
     link?: LinkData['link'];
     active?: LinkData['active'];
     external?: LinkData['external'];
-}>>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+}>>> & {
+    onClicked?: (() => any) | undefined;
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    clicked: () => void;
+}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: {
         default: (_: {
             id: string;

package/dist/types/index.d.ts

@@ -24,14 +24,19 @@ export declare const components: {
             $: import("vue").ComponentInternalInstance;
             $data: {};
             $props: Partial<{
-                size: "small" | "large" | "medium";
                 onColor: boolean;
+                size: "small" | "large" | "medium";
                 variant: "primary" | "secondary" | "tertiary";
             }> & Omit<Readonly<import("vue").ExtractPropTypes<{
                 id: {
                     type: import("vue").PropType<string>;
                     required: true;
                 };
+                onColor: {
+                    type: import("vue").PropType<boolean>;
+                } & {
+                    default: boolean;
+                };
                 disabled: {
                     type: import("vue").PropType<boolean>;
                 };
@@ -43,17 +48,12 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                onColor: {
-                    type: import("vue").PropType<boolean>;
-                } & {
-                    default: boolean;
-                };
                 variant: {
                     type: import("vue").PropType<"primary" | "secondary" | "tertiary">;
                 } & {
                     default: string;
                 };
-            }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "size" | "onColor" | "variant">;
+            }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "onColor" | "size" | "variant">;
             $attrs: {
                 [x: string]: unknown;
             };
@@ -72,6 +72,11 @@ export declare const components: {
                     type: import("vue").PropType<string>;
                     required: true;
                 };
+                onColor: {
+                    type: import("vue").PropType<boolean>;
+                } & {
+                    default: boolean;
+                };
                 disabled: {
                     type: import("vue").PropType<boolean>;
                 };
@@ -83,19 +88,14 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-                onColor: {
-                    type: import("vue").PropType<boolean>;
-                } & {
-                    default: boolean;
-                };
                 variant: {
                     type: import("vue").PropType<"primary" | "secondary" | "tertiary">;
                 } & {
                     default: string;
                 };
             }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
-                size: "small" | "large" | "medium";
                 onColor: boolean;
+                size: "small" | "large" | "medium";
                 variant: "primary" | "secondary" | "tertiary";
             }> & {
                 beforeCreate?: ((() => void) | (() => void)[]) | undefined;
@@ -122,6 +122,11 @@ export declare const components: {
                 type: import("vue").PropType<string>;
                 required: true;
             };
+            onColor: {
+                type: import("vue").PropType<boolean>;
+            } & {
+                default: boolean;
+            };
             disabled: {
                 type: import("vue").PropType<boolean>;
             };
@@ -133,11 +138,6 @@ export declare const components: {
             } & {
                 default: string;
             };
-            onColor: {
-                type: import("vue").PropType<boolean>;
-            } & {
-                default: boolean;
-            };
             variant: {
                 type: import("vue").PropType<"primary" | "secondary" | "tertiary">;
             } & {
@@ -152,6 +152,11 @@ export declare const components: {
             type: import("vue").PropType<string>;
             required: true;
         };
+        onColor: {
+            type: import("vue").PropType<boolean>;
+        } & {
+            default: boolean;
+        };
         disabled: {
             type: import("vue").PropType<boolean>;
         };
@@ -163,19 +168,14 @@ export declare const components: {
         } & {
             default: string;
         };
-        onColor: {
-            type: import("vue").PropType<boolean>;
-        } & {
-            default: boolean;
-        };
         variant: {
             type: import("vue").PropType<"primary" | "secondary" | "tertiary">;
         } & {
             default: string;
         };
     }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
-        size: "small" | "large" | "medium";
         onColor: boolean;
+        size: "small" | "large" | "medium";
         variant: "primary" | "secondary" | "tertiary";
     }> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
         $slots: {
@@ -420,9 +420,6 @@ export declare const components: {
                     type: import("vue").PropType<string>;
                     required: true;
                 };
-                invert: {
-                    type: import("vue").PropType<boolean>;
-                };
                 class: {
                     type: import("vue").PropType<string>;
                 };
@@ -431,6 +428,9 @@ export declare const components: {
                 } & {
                     default: string;
                 };
+                invert: {
+                    type: import("vue").PropType<boolean>;
+                };
                 error: {
                     type: import("vue").PropType<string>;
                 };
@@ -468,9 +468,6 @@ export declare const components: {
                     type: import("vue").PropType<string>;
                     required: true;
                 };
-                invert: {
-                    type: import("vue").PropType<boolean>;
-                };
                 class: {
                     type: import("vue").PropType<string>;
                 };
@@ -479,6 +476,9 @@ export declare const components: {
                 } & {
                     default: string;
                 };
+                invert: {
+                    type: import("vue").PropType<boolean>;
+                };
                 error: {
                     type: import("vue").PropType<string>;
                 };
@@ -528,9 +528,6 @@ export declare const components: {
                 type: import("vue").PropType<string>;
                 required: true;
             };
-            invert: {
-                type: import("vue").PropType<boolean>;
-            };
             class: {
                 type: import("vue").PropType<string>;
             };
@@ -539,6 +536,9 @@ export declare const components: {
             } & {
                 default: string;
             };
+            invert: {
+                type: import("vue").PropType<boolean>;
+            };
             error: {
                 type: import("vue").PropType<string>;
             };
@@ -566,9 +566,6 @@ export declare const components: {
             type: import("vue").PropType<string>;
             required: true;
         };
-        invert: {
-            type: import("vue").PropType<boolean>;
-        };
         class: {
             type: import("vue").PropType<string>;
         };
@@ -577,6 +574,9 @@ export declare const components: {
         } & {
             default: string;
         };
+        invert: {
+            type: import("vue").PropType<boolean>;
+        };
         error: {
             type: import("vue").PropType<string>;
         };
@@ -619,9 +619,6 @@ export declare const components: {
                     type: import("vue").PropType<string>;
                     required: true;
                 };
-                invert: {
-                    type: import("vue").PropType<boolean>;
-                };
                 class: {
                     type: import("vue").PropType<string>;
                 };
@@ -630,6 +627,9 @@ export declare const components: {
                 } & {
                     default: string;
                 };
+                invert: {
+                    type: import("vue").PropType<boolean>;
+                };
                 error: {
                     type: import("vue").PropType<string>;
                 };
@@ -662,9 +662,6 @@ export declare const components: {
                     type: import("vue").PropType<string>;
                     required: true;
                 };
-                invert: {
-                    type: import("vue").PropType<boolean>;
-                };
                 class: {
                     type: import("vue").PropType<string>;
                 };
@@ -673,6 +670,9 @@ export declare const components: {
                 } & {
                     default: string;
                 };
+                invert: {
+                    type: import("vue").PropType<boolean>;
+                };
                 error: {
                     type: import("vue").PropType<string>;
                 };
@@ -716,9 +716,6 @@ export declare const components: {
                 type: import("vue").PropType<string>;
                 required: true;
             };
-            invert: {
-                type: import("vue").PropType<boolean>;
-            };
             class: {
                 type: import("vue").PropType<string>;
             };
@@ -727,6 +724,9 @@ export declare const components: {
             } & {
                 default: string;
             };
+            invert: {
+                type: import("vue").PropType<boolean>;
+            };
             error: {
                 type: import("vue").PropType<string>;
             };
@@ -749,9 +749,6 @@ export declare const components: {
             type: import("vue").PropType<string>;
             required: true;
         };
-        invert: {
-            type: import("vue").PropType<boolean>;
-        };
         class: {
             type: import("vue").PropType<string>;
         };
@@ -760,6 +757,9 @@ export declare const components: {
         } & {
             default: string;
         };
+        invert: {
+            type: import("vue").PropType<boolean>;
+        };
         error: {
             type: import("vue").PropType<string>;
         };
@@ -2755,7 +2755,7 @@ export declare const components: {
                     type: import("vue").PropType<string>;
                     required: true;
                 };
-                invert: {
+                onColor: {
                     type: import("vue").PropType<boolean>;
                 };
                 disabled: {
@@ -2785,7 +2785,7 @@ export declare const components: {
                     type: import("vue").PropType<string>;
                     required: true;
                 };
-                invert: {
+                onColor: {
                     type: import("vue").PropType<boolean>;
                 };
                 disabled: {
@@ -2823,7 +2823,7 @@ export declare const components: {
                 type: import("vue").PropType<string>;
                 required: true;
             };
-            invert: {
+            onColor: {
                 type: import("vue").PropType<boolean>;
             };
             disabled: {
@@ -2843,7 +2843,7 @@ export declare const components: {
             type: import("vue").PropType<string>;
             required: true;
         };
-        invert: {
+        onColor: {
             type: import("vue").PropType<boolean>;
         };
         disabled: {
@@ -2853,6 +2853,7 @@ export declare const components: {
         title: string;
     }> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
         $slots: {
+            icon: (_: {}) => any;
             title: (_: {}) => any;
             default: (_: {}) => any;
         };
@@ -2879,9 +2880,7 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-            }>> & {
-                onChange?: ((value: string) => any) | undefined;
-            } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "label" | "position">;
+            }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "label" | "position">;
             $attrs: {
                 [x: string]: unknown;
             };
@@ -2893,7 +2892,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: "change", value: string) => void;
+            $emit: (event: string, ...args: any[]) => void;
             $el: any;
             $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
                 label: {
@@ -2910,11 +2909,7 @@ export declare const components: {
                 } & {
                     default: string;
                 };
-            }>> & {
-                onChange?: ((value: string) => any) | undefined;
-            }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-                change: (value: string) => void;
-            }, string, {
+            }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
                 label: string;
                 position: ("bottom" | "top") | ("right" | "left");
             }> & {
@@ -2952,9 +2947,7 @@ export declare const components: {
             } & {
                 default: string;
             };
-        }>> & {
-            onChange?: ((value: string) => any) | undefined;
-        } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
+        }>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
         __isFragment?: undefined;
         __isTeleport?: undefined;
         __isSuspense?: undefined;
@@ -2973,11 +2966,7 @@ export declare const components: {
         } & {
             default: string;
         };
-    }>> & {
-        onChange?: ((value: string) => any) | undefined;
-    }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-        change: (value: string) => void;
-    }, string, {
+    }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
         label: string;
         position: ("bottom" | "top") | ("right" | "left");
     }> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
@@ -2985,7 +2974,9 @@ export declare const components: {
             label: (_: {
                 isOpen: boolean;
             }) => any;
-            default: (_: {}) => any;
+            default: (_: {
+                close: () => void;
+            }) => any;
         };
     });
     SolMenuItemLink: {
@@ -3009,7 +3000,9 @@ export declare const components: {
                 external: {
                     type: import("vue").PropType<boolean>;
                 };
-            }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>;
+            }>> & {
+                onClicked?: (() => any) | undefined;
+            } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>;
             $attrs: {
                 [x: string]: unknown;
             };
@@ -3021,7 +3014,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: string, ...args: any[]) => void;
+            $emit: (event: "clicked") => void;
             $el: any;
             $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
                 id: {
@@ -3040,7 +3033,11 @@ export declare const components: {
                 external: {
                     type: import("vue").PropType<boolean>;
                 };
-            }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {}> & {
+            }>> & {
+                onClicked?: (() => any) | undefined;
+            }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+                clicked: () => void;
+            }, string, {}> & {
                 beforeCreate?: ((() => void) | (() => void)[]) | undefined;
                 created?: ((() => void) | (() => void)[]) | undefined;
                 beforeMount?: ((() => void) | (() => void)[]) | undefined;
@@ -3077,7 +3074,9 @@ export declare const components: {
             external: {
                 type: import("vue").PropType<boolean>;
             };
-        }>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
+        }>> & {
+            onClicked?: (() => any) | undefined;
+        } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
         __isFragment?: undefined;
         __isTeleport?: undefined;
         __isSuspense?: undefined;
@@ -3098,7 +3097,11 @@ export declare const components: {
         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 () => {
+    }>> & {
+        onClicked?: (() => any) | undefined;
+    }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        clicked: () => void;
+    }, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
         $slots: {
             default: (_: {
                 id: string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@solfacil/girassol",
   "description": "Girassol design system",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "authors": [
     {
       "name": "Kevin Martin",

package/public/main.css

@@ -1,41 +1,41 @@
+/* latin-ext */
 @font-face {
-  font-family: "Lato";
-  src: url("./fonts/lato/Lato-Regular.ttf");
+  font-family: 'Lato';
+  font-style: normal;
   font-weight: 400;
+  font-display: swap;
+  src: url(https://fonts.gstatic.com/s/lato/v23/S6uyw4BMUTPHjxAwXjeu.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
 }
-
-@font-face {
-  font-family: "Lato";
-  src: url("./fonts/lato/Lato-Bold.ttf");
-  font-weight: bold;
-}
-
+/* latin */
 @font-face {
-  font-family: "Lato";
-  src: url("./fonts/lato/Lato-Medium.ttf");
-  font-weight: 500;
-}
-
-
-@font-face {
-  font-family: "Rubik";
-  src: url("./fonts/rubik/Rubik-Regular.ttf");
+  font-family: 'Lato';
+  font-style: normal;
   font-weight: 400;
+  font-display: swap;
+  src: url(https://fonts.gstatic.com/s/lato/v23/S6uyw4BMUTPHjx4wXg.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
-
+/* latin-ext */
 @font-face {
-  font-family: "Rubik";
-  src: url("./fonts/rubik/Rubik-Bold.ttf");
-  font-weight: bold;
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(https://fonts.gstatic.com/s/lato/v23/S6u9w4BMUTPHh6UVSwaPGR_p.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
 }
-
+/* latin */
 @font-face {
-  font-family: "Rubik";
-  src: url("./fonts/rubik/Rubik-Medium.ttf");
-  font-weight: 500;
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap; 
+  src: url(https://fonts.gstatic.com/s/lato/v23/S6u9w4BMUTPHh6UVSwiPGQ.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
 
 @font-face {
-  font-family: "Roboto Slab";
-  src: url("./fonts/roboto-slab/RobotoSlab.ttf");
-}
+  font-family: 'Grotesk';
+  src: url('https://cdn.solfacil.com.br/commons/fonts/PPRightGrotesk-WideMedium.woff2')
+}

package/theme/solfacil/typography.ts

@@ -2,7 +2,7 @@ export default {
   fontFamily: {
     sans: ['"Lato"', 'sans-serif'],
     base: ['"Lato"', 'sans-serif'],
-    highlight: ['"Rubik"'],
+    highlight: ['"Grotesk"',  'sans-serif'],
   },
 
   fontSize: {
@@ -38,7 +38,6 @@ export default {
 
   fontWeight: {
     regular: 400,
-    medium: 500,
     bold: 700,
   },
 

package/theme/solfacil/utilities.ts

@@ -8,7 +8,7 @@ export const componentTypos = plugin(({ addUtilities, theme }) => {
     fontFamily: wrapperThemeType('fontFamily.highlight'),
     color: wrapperThemeType('colors.neutral.low.dark'),
     lineHeight: wrapperThemeType('lineHeight.xs'),
-    fontWeight: wrapperThemeType('fontWeight.medium'),
+    fontWeight: wrapperThemeType('fontWeight.regular'),
   }
   const display = {
     '.fonts-display-large': {
@@ -42,7 +42,7 @@ export const componentTypos = plugin(({ addUtilities, theme }) => {
     fontFamily: wrapperThemeType('fontFamily.highlight'),
     lineHeight: wrapperThemeType('lineHeight.xs'),
     color: wrapperThemeType('colors.neutral.low.dark'),
-    fontWeight: wrapperThemeType('fontWeight.medium'),
+    fontWeight: wrapperThemeType('fontWeight.regular'),
 
   }
   const heading = {
@@ -129,7 +129,7 @@ export const componentTypos = plugin(({ addUtilities, theme }) => {
       fontWeight: wrapperThemeType('fontWeight.regular'),
     },
 
-    '.fonts-body-larger-bold': {
+    '.fonts-body-large-bold': {
       ...bodyCommons,
       fontSize: wrapperThemeType('fontSize.2xs'),
       fontWeight: wrapperThemeType('fontWeight.bold'),
@@ -214,11 +214,7 @@ export const outlinesForFocus = plugin(({ addUtilities }) => {
     '.outline-focused': {
       outline: '2px solid #8250DF',
       outlineOffset: '2px',
-    },
-
-    '.outline-focused-invert': {
-      outline: '2px solid #ffffff',
-      outlineOffset: '0px',
+      outlineStyle: 'auto',
     },
   })
 })