@teammodlr/ui-kit 2.1.8 → 2.1.9

package/src/components/badge/style/Badge.css.ts

@@ -1,135 +1,135 @@
-import {createVar, style, styleVariants} from "@vanilla-extract/css";
-import {themeVars} from "../../../styles/theme.css";
+import { createVar, style, styleVariants } from '@vanilla-extract/css';
+import { themeVars } from '../../../styles/theme.css';
 
 const borderRadiuses = {
     xs: '2px',
     sm: '3px',
     md: '4px',
     lg: '6px',
-    xl: '8px',
+    xl: '8px'
 };
 
 const vars = {
     color: createVar(),
     backgroundColor: createVar(),
-    radius: createVar(),
+    radius: createVar()
 };
 
 export const base = style({
     vars: {
-        [vars.radius]: borderRadiuses.md,
+        [vars.radius]: borderRadiuses.md
     },
-    boxSizing: "border-box",
-    appearance: "none",
+    boxSizing: 'border-box',
+    appearance: 'none',
     border: 0,
-    display: "inline-flex",
-    position: "static",
+    display: 'inline-flex',
+    position: 'static',
     borderRadius: vars.radius,
     backgroundColor: vars.backgroundColor,
-    overflow: "hidden",
-    padding: `${themeVars.space['0.5']} ${themeVars.space[1]}`,
-})
+    overflow: 'hidden',
+    padding: `${themeVars.space['0.5']} ${themeVars.space[1]}`
+});
 
 export const text = style({
     color: vars.color,
     margin: 0,
     padding: 0,
     fontSize: themeVars.fontSize.xsmall,
-    fontWeight: "500",
+    fontWeight: '500',
     letterSpacing: '0.5px',
     textTransform: 'uppercase',
     lineHeight: themeVars.fontSize.base,
     overflow: 'hidden',
     textOverflow: 'ellipsis',
-    whiteSpace: 'nowrap',
-})
+    whiteSpace: 'nowrap'
+});
 
 export const variant = styleVariants({
     primary: {
         vars: {
             [vars.backgroundColor]: themeVars.color.blue[500],
-            [vars.color]: '#FFFFFF',
+            [vars.color]: '#FFFFFF'
         }
     },
     dark: {
         vars: {
             [vars.backgroundColor]: themeVars.color.saxe[800],
-            [vars.color]: '#FFFFFF',
-        },
+            [vars.color]: '#FFFFFF'
+        }
     },
     default: {
         vars: {
             [vars.color]: 'white',
-            [vars.backgroundColor]: themeVars.color.gray[500],
-        }              
+            [vars.backgroundColor]: themeVars.color.gray[500]
+        }
     },
     tertiary: {
         vars: {
             [vars.color]: themeVars.color.gray[100],
-            [vars.backgroundColor]: themeVars.color.gray[400],
-        }   
+            [vars.backgroundColor]: themeVars.color.gray[400]
+        }
     },
     success: {
         vars: {
             [vars.backgroundColor]: themeVars.color.green[500],
-            [vars.color]: '#FFFFFF',
+            [vars.color]: '#FFFFFF'
         }
     },
     warning: {
         vars: {
             [vars.backgroundColor]: themeVars.color.amber[400],
-            [vars.color]: themeVars.color.gray[800],
+            [vars.color]: themeVars.color.gray[800]
         }
     },
     error: {
         vars: {
             [vars.backgroundColor]: themeVars.color.red[500],
-            [vars.color]: '#FFFFFF',
+            [vars.color]: '#FFFFFF'
         }
-    },
+    }
 });
 
 export const secondary = styleVariants({
     primary: {
         vars: {
             [vars.backgroundColor]: themeVars.color.blue[100],
-            [vars.color]: themeVars.color.blue[600],
+            [vars.color]: themeVars.color.blue[600]
         }
     },
     dark: {
         vars: {
             [vars.backgroundColor]: themeVars.color.saxe[100],
-            [vars.color]: themeVars.color.saxe[900],
+            [vars.color]: themeVars.color.saxe[900]
         }
     },
     default: {
         vars: {
             [vars.backgroundColor]: themeVars.color.gray[100],
-            [vars.color]: themeVars.color.gray[600],
-        }              
+            [vars.color]: themeVars.color.gray[600]
+        }
     },
     tertiary: {
         vars: {
             [vars.backgroundColor]: themeVars.color.gray[100],
-            [vars.color]: themeVars.color.gray[400],
-        }   
+            [vars.color]: themeVars.color.gray[400]
+        }
     },
     success: {
         vars: {
             [vars.backgroundColor]: themeVars.color.green[100],
-            [vars.color]: themeVars.color.green[600],
+            [vars.color]: themeVars.color.green[600]
         }
     },
     warning: {
         vars: {
             [vars.backgroundColor]: themeVars.color.amber[100],
-            [vars.color]: themeVars.color.amber[600],
+            [vars.color]: themeVars.color.amber[600]
         }
     },
     error: {
         vars: {
             [vars.backgroundColor]: themeVars.color.red[100],
-            [vars.color]: themeVars.color.red[600],
+            [vars.color]: themeVars.color.red[600]
         }
-    },
+    }
 });

package/src/components/breadcrumb/examples/index.stories.ts

@@ -1,20 +1,16 @@
-import MBreadcrumb from "../Breadcrumb.vue";
-import MBreadcrumbItem from "../BreadcrumbItem.vue";
+import MBreadcrumb from '../Breadcrumb.vue';
+import MBreadcrumbItem from '../BreadcrumbItem.vue';
 
-import {
-    MBreadcrumbBasic
-} from "./index";
+import { MBreadcrumbBasic } from './index';
 
-import {
-    createStory
-} from "../../../__storybook__";
+import { createStory } from '../../../__storybook__';
 
 export default {
     component: MBreadcrumb,
     subcomponents: {
         MBreadcrumbItem
     },
-    title: 'Components/Breadcrumb',
-}
+    title: 'Components/Breadcrumb'
+};
 
 export const Basic = createStory(MBreadcrumbBasic);

package/src/components/breadcrumb/style/Breadcrumb.css.ts

@@ -1,40 +1,40 @@
-import {globalStyle, style} from "@vanilla-extract/css";
-import {themeVars} from "../../../styles/theme.css";
+import { globalStyle, style } from '@vanilla-extract/css';
+import { themeVars } from '../../../styles/theme.css';
 
 export const base = style({
-    display: "flex",
-    position: "relative",
+    display: 'flex',
+    position: 'relative',
     margin: 0,
     padding: 0,
-    listStyle: "none",
-    boxSizing: "border-box",
+    listStyle: 'none',
+    boxSizing: 'border-box'
 });
 
 export const item = style({
-    display: "flex",
-    alignItems: "center",
-    fontSize: themeVars.fontSize.base,
+    display: 'flex',
+    alignItems: 'center',
+    fontSize: themeVars.fontSize.base
 });
 
 export const link = style({
     padding: `0 ${themeVars.space[2]}`,
     color: themeVars.color.gray[600],
-    cursor: "pointer",
-    textDecoration: "none",
+    cursor: 'pointer',
+    textDecoration: 'none',
     outline: 0,
     transition: `color 0.2s ${themeVars.transition.default}`,
-    ":hover": {
-        color: themeVars.color.blue[500],
+    ':hover': {
+        color: themeVars.color.blue[500]
     }
 });
 
 export const separator = style({
     padding: `0 ${themeVars.space[1]}`,
-    display: "inline-flex",
+    display: 'inline-flex',
     color: themeVars.color.gray[300],
-    userSelect: "none"
+    userSelect: 'none'
 });
 
 globalStyle(`${base} ${item}:last-child ${separator}`, {
-    display: "none"
-});
+    display: 'none'
+});

package/src/components/breadcrumb/style/index.ts

@@ -1 +1 @@
-export * from "./Breadcrumb.css";
+export * from './Breadcrumb.css';

package/src/components/breadcrumb/symbol.ts

@@ -1,4 +1,4 @@
-import type {InjectionKey} from "vue";
+import type { InjectionKey } from 'vue';
 
 export interface BreadcrumbOptions {
     label: string;
@@ -11,7 +11,8 @@ export interface BreadcrumbItemState {
 
 export interface BreadcrumbState {
     separator: string;
-    refreshItems: () => void
+    refreshItems: () => void;
 }
 
-export const BREADCRUMB_STATE: InjectionKey<BreadcrumbState> = Symbol('BREADCRUMB_STATE');
+export const BREADCRUMB_STATE: InjectionKey<BreadcrumbState> =
+    Symbol('BREADCRUMB_STATE');

package/src/components/button/examples/index.stories.ts

@@ -1,4 +1,4 @@
-import MButton from "../Button.vue";
+import MButton from '../Button.vue';
 import {
     MButtonBasic,
     MButtonSize,
@@ -8,13 +8,13 @@ import {
     MButtonDisabled,
     MButtonIconLeft,
     MButtonIcon
-} from "./index";
+} from './index';
 
 import {
     variantArgType,
     createStory,
     sizeArgType
-} from "../../../__storybook__";
+} from '../../../__storybook__';
 
 export default {
     component: MButton,
@@ -23,7 +23,7 @@ export default {
         ...variantArgType(),
         ...sizeArgType()
     }
-}
+};
 
 export const Basic = createStory(MButtonBasic);
 export const Size = createStory(MButtonSize);