@teammodlr/ui-kit 2.1.8 → 2.1.9

package/lib/install.d.ts

@@ -1,4 +1,4 @@
 declare const _default: {
-    install: (app: import("vue").App<any>, installOptions?: import("./create").ModlrUIOptions) => void;
+    install: (app: import("vue").App<any>, installOptions?: import("./create").ModlrUIOptions | undefined) => void;
 };
 export default _default;

package/lib/nuxt.js

@@ -1,33 +1,35 @@
-import { defineNuxtModule, addPlugin, createResolver } from '@nuxt/kit'
-import { fileURLToPath } from 'node:url'
+import { defineNuxtModule, addPlugin, createResolver } from '@nuxt/kit';
+import { fileURLToPath } from 'node:url';
 
 export default defineNuxtModule({
     meta: {
         name: '@teammodlr/ui-kit',
         configKey: 'modlr',
         compatibility: {
-            nuxt: '^3.0.0-rc.1',
-        },
+            nuxt: '^3.0.0-rc.1'
+        }
     },
     defaults: {
-        prefix: 'M',
+        prefix: 'M'
     },
     async setup(options, nuxt) {
         // Create resolver to resolve relative paths
-        const { resolve } = createResolver(import.meta.url)
+        const { resolve } = createResolver(import.meta.url);
 
-        nuxt.options.runtimeConfig.public.modlrUiOptions = options
+        nuxt.options.runtimeConfig.public.modlrUiOptions = options;
 
         // plugin install
-        addPlugin(resolve('./nuxt.plugin.js'))
+        addPlugin(resolve('./nuxt.plugin.js'));
 
         // nuxt install
-        nuxt.hook('components:dirs', (dirs) => {
+        nuxt.hook('components:dirs', dirs => {
             dirs.push({
-                path: fileURLToPath(new URL('../src/components', import.meta.url)),
+                path: fileURLToPath(
+                    new URL('../src/components', import.meta.url)
+                ),
                 extensions: ['vue', 'tsx'],
-                prefix: options?.prefix ? options?.prefix : 'M',
-            })
-        })
-    },
-})
+                prefix: options?.prefix ? options?.prefix : 'M'
+            });
+        });
+    }
+});

package/lib/nuxt.plugin.js

@@ -1,8 +1,8 @@
-import { defineNuxtPlugin } from '#app'
-import create from '../create'
+import { defineNuxtPlugin } from '#app';
+import create from '../create';
 
-export default defineNuxtPlugin((nuxtApp) => {
-    const UI = create(nuxtApp.$config.modlrUiOptions)
+export default defineNuxtPlugin(nuxtApp => {
+    const UI = create(nuxtApp.$config.modlrUiOptions);
 
-    nuxtApp.vueApp.use(UI)
-})
+    nuxtApp.vueApp.use(UI);
+});

package/package.json

@@ -1,82 +1,92 @@
 {
-  "name": "@teammodlr/ui-kit",
-  "version": "2.1.8",
-  "description": "",
-  "main": "lib/index.cjs.js",
-  "module": "lib/index.es.js",
-  "typings": "lib/index.d.ts",
-  "files": [
-    "lib",
-    "src",
-    "*.d.ts"
-  ],
-  "exports": {
-    ".": {
-      "import": "./lib/index.es.js",
-      "require": "./lib/index.cjs.js"
+    "name": "@teammodlr/ui-kit",
+    "version": "2.1.9",
+    "description": "",
+    "main": "lib/index.cjs.js",
+    "module": "lib/index.es.js",
+    "typings": "lib/index.d.ts",
+    "files": [
+        "lib",
+        "src",
+        "*.d.ts"
+    ],
+    "exports": {
+        ".": {
+            "import": "./lib/index.es.js",
+            "require": "./lib/index.cjs.js"
+        },
+        "./nuxt": "./lib/nuxt.js",
+        "./style": "./lib/style.css",
+        "./styles": "./lib/style.css",
+        "./nuxt.plugin": "./lib/nuxt.plugin.js",
+        "./nuxt.plugin.js": "./lib/nuxt.plugin.js"
     },
-    "./nuxt": "./lib/nuxt.js",
-    "./style": "./lib/style.css",
-    "./styles": "./lib/style.css",
-    "./nuxt.plugin": "./lib/nuxt.plugin.js",
-    "./nuxt.plugin.js": "./lib/nuxt.plugin.js"
-  },
-  "sideEffects": false,
-  "scripts": {
-    "dev": "npm run storybook",
-    "storybook": "storybook dev -p 6006",
-    "build": "npm run build:vite && npm run gen-types",
-    "build:vite": "vite build",
-    "build:storybook": "storybook build",
-    "gen-types": "vue-tsc --declaration --emitDeclarationOnly -p tsconfig.vitest.json --composite false",
-    "release:prepare": "npm run build",
-    "release": "bumpp --execute=\"npm run release:prepare\" --all",
-    "release:publish": "npm run release && npm publish"
-  },
-  "keywords": [],
-  "author": "",
-  "license": "ISC",
-  "devDependencies": {
-    "@babel/core": "^7.21.0",
-    "@nuxt/kit": "^3.3.2",
-    "@nuxt/schema": "^3.3.2",
-    "@storybook/addon-actions": "^7.2.1",
-    "@storybook/addon-essentials": "^7.2.1",
-    "@storybook/addon-interactions": "^7.2.1",
-    "@storybook/addon-links": "^7.2.1",
-    "@storybook/addons": "^7.2.1",
-    "@storybook/testing-library": "^0.2.0",
-    "@storybook/theming": "^7.2.1",
-    "@storybook/vue3": "^7.2.1",
-    "@storybook/vue3-vite": "^7.2.1",
-    "@types/jsdom": "^21.1.0",
-    "@types/node": "^18.14.1",
-    "@vanilla-extract/css": "^1.12.0",
-    "@vanilla-extract/vite-plugin": "^3.8.2",
-    "@vitejs/plugin-vue": "^4.2.3",
-    "@vue/tsconfig": "^0.4.0",
-    "@vueuse/core": "^10.4.1",
-    "babel-loader": "^9.1.2",
-    "bumpp": "^9.1.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "storybook": "^7.2.1",
-    "ts-node": "^10.9.1",
-    "typescript": "^5.1.6",
-    "vite": "^4.4.8",
-    "vue": "^3.3.4",
-    "vue-loader": "^17.2.2",
-    "vue-tsc": "^1.8.8",
-    "vueuc": "^0.4.51"
-  },
-  "dependencies": {
-    "@floating-ui/vue": "^1.0.0",
-    "@popperjs/core": "^2.11.6",
-    "@vanilla-extract/dynamic": "^2.0.3",
-    "@vitejs/plugin-vue-jsx": "^3.0.1",
-    "@vueuse/integrations": "^10.0.0-beta.2",
-    "focus-trap": "^7.4.0",
-    "maska": "^2.1.9",
-    "treemate": "^0.3.11"
-  }
+    "sideEffects": false,
+    "scripts": {
+        "dev": "npm run storybook",
+        "storybook": "storybook dev -p 6006",
+        "lint": "npx eslint . -c ./.config/.eslintrc.yml",
+        "build": "npm run build:vite && npm run gen-types",
+        "build:vite": "vite build",
+        "build:storybook": "storybook build",
+        "gen-types": "vue-tsc --declaration --emitDeclarationOnly -p tsconfig.vitest.json --composite false",
+        "release:prepare": "npm run build",
+        "release": "bumpp --execute=\"npm run release:prepare\" --all",
+        "release:publish": "npm run release && npm publish"
+    },
+    "keywords": [],
+    "author": "",
+    "license": "ISC",
+    "devDependencies": {
+        "@babel/core": "^7.21.0",
+        "@nuxt/kit": "^3.3.2",
+        "@nuxt/schema": "^3.3.2",
+        "@storybook/addon-actions": "^7.2.1",
+        "@storybook/addon-essentials": "^7.2.1",
+        "@storybook/addon-interactions": "^7.2.1",
+        "@storybook/addon-links": "^7.2.1",
+        "@storybook/addons": "^7.2.1",
+        "@storybook/testing-library": "^0.2.0",
+        "@storybook/theming": "^7.2.1",
+        "@storybook/vue3": "^7.2.1",
+        "@storybook/vue3-vite": "^7.2.1",
+        "@types/jsdom": "^21.1.0",
+        "@types/node": "^18.14.1",
+        "@typescript-eslint/eslint-plugin": "^6.6.0",
+        "@typescript-eslint/parser": "^6.6.0",
+        "@vanilla-extract/css": "^1.12.0",
+        "@vanilla-extract/vite-plugin": "^3.8.2",
+        "@vitejs/plugin-vue": "^4.2.3",
+        "@vue/tsconfig": "^0.4.0",
+        "@vueuse/core": "^10.4.1",
+        "babel-loader": "^9.1.2",
+        "bumpp": "^9.1.1",
+        "eslint": "^8.49.0",
+        "eslint-plugin-github": "^4.10.0",
+        "eslint-plugin-jsonc": "^2.9.0",
+        "eslint-plugin-prettier": "^5.0.0",
+        "eslint-plugin-vue": "^9.17.0",
+        "prettier": "^3.0.3",
+        "prettier-eslint": "^15.0.1",
+        "react": "^18.2.0",
+        "react-dom": "^18.2.0",
+        "storybook": "^7.2.1",
+        "ts-node": "^10.9.1",
+        "typescript": "^5.1.6",
+        "vite": "^4.4.8",
+        "vue": "^3.3.4",
+        "vue-loader": "^17.2.2",
+        "vue-tsc": "^1.8.8",
+        "vueuc": "^0.4.51"
+    },
+    "dependencies": {
+        "@floating-ui/vue": "^1.0.0",
+        "@popperjs/core": "^2.11.6",
+        "@vanilla-extract/dynamic": "^2.0.3",
+        "@vitejs/plugin-vue-jsx": "^3.0.1",
+        "@vueuse/integrations": "^10.0.0-beta.2",
+        "focus-trap": "^7.4.0",
+        "maska": "^2.1.9",
+        "treemate": "^0.3.11"
+    }
 }

package/src/__storybook__/argTypes.ts

@@ -1,4 +1,4 @@
-import { placementWhileList } from "../composables/usePopper";
+import { placementWhileList } from '../composables/usePopper';
 
 export const sizeArgType = () => ({
     size: {
@@ -18,16 +18,9 @@ export const sizeArgType = () => ({
 
 export const colorArgType = () => ({
     color: {
-        options: [
-            'white',
-            'black',
-            'green',
-            'red',
-            'yellow',
-            'blue',
-        ],
+        options: ['white', 'black', 'green', 'red', 'yellow', 'blue'],
         control: {
-            type: 'select',
+            type: 'select'
         }
     }
 });
@@ -50,12 +43,11 @@ export const variantArgType = () => ({
     }
 });
 
-
 export const popperPositionArgType = () => ({
     placement: {
         options: placementWhileList,
         control: {
-            type: 'select',
+            type: 'select'
         }
     }
-})
+});

package/src/__storybook__/createStory.ts

@@ -3,13 +3,13 @@ import type { Component } from 'vue';
 
 export const createStory =
     (component: Component, storyArgs: { classes?: string } = {}) =>
-        (args: any) => ({
-            setup: () => () =>
-                h(
-                    'div',
-                    {
-                        class: `storybook-example ${storyArgs.classes || ''}`
-                    },
-                    [h(component, args)]
-                )
-        });
+    (args: any) => ({
+        setup: () => () =>
+            h(
+                'div',
+                {
+                    class: `storybook-example ${storyArgs.classes || ''}`
+                },
+                [h(component, args)]
+            )
+    });

package/src/call.ts

@@ -1,34 +1,34 @@
-type AnyFunction = (...args: any[]) => any
+type AnyFunction = (...args: any[]) => any;
 
-function call (funcs: MaybeArray<() => void>): void
-function call<A1> (funcs: MaybeArray<(a1: A1) => void>, a1: A1): void
-function call<A1, A2> (
+function call(funcs: MaybeArray<() => void>): void;
+function call<A1>(funcs: MaybeArray<(a1: A1) => void>, a1: A1): void;
+function call<A1, A2>(
     funcs: MaybeArray<(a1: A1, a2: A2) => void>,
     a1: A1,
     a2: A2
-): void
-function call<A1, A2, A3> (
+): void;
+function call<A1, A2, A3>(
     funcs: MaybeArray<(a1: A1, a2: A2, a3: A3) => void>,
     a1: A1,
     a2: A2,
     a3: A3
-): void
-function call<A1, A2, A3, A4> (
+): void;
+function call<A1, A2, A3, A4>(
     funcs: MaybeArray<(a1: A1, a2: A2, a3: A3, a4: A4) => void>,
     a1: A1,
     a2: A2,
     a3: A3,
     a4: A4
-): void
-function call<A extends any[]> (
+): void;
+function call<A extends any[]>(
     funcs: AnyFunction[] | AnyFunction,
     ...args: A
 ): void {
     if (Array.isArray(funcs)) {
-        funcs.forEach((func) => (call as any)(func, ...args))
-    } else return funcs(...args)
+        funcs.forEach(func => (call as any)(func, ...args));
+    } else return funcs(...args);
 }
 
-export { call }
+export { call };
 
-export type MaybeArray<T> = T | T[]
+export type MaybeArray<T> = T | T[];

package/src/components/avatar/Avatar.vue

@@ -1,5 +1,5 @@
 <template>
-    <span 
+    <span
         :class="classes"
         ref="avatar"
     >

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

@@ -1,4 +1,4 @@
-import MAvatar from "../Avatar.vue";
+import MAvatar from '../Avatar.vue';
 
 import {
     MAvatarBasic,
@@ -6,12 +6,9 @@ import {
     MAvatarCustomSize,
     MAvatarVariant,
     MAvatarSlot
-} from "./index";
+} from './index';
 
-import {
-    colorArgType,
-    createStory, sizeArgType
-} from "../../../__storybook__";
+import { colorArgType, createStory, sizeArgType } from '../../../__storybook__';
 
 export default {
     component: MAvatar,
@@ -19,7 +16,7 @@ export default {
     argTypes: {
         ...sizeArgType()
     }
-}
+};
 
 export const Basic = createStory(MAvatarBasic);
 export const Sizes = createStory(MAvatarSize);

package/src/components/avatar/style/Avatar.css.ts

@@ -1,12 +1,12 @@
-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 sizes = {
     xs: '16px',
     sm: '24px',
     md: '32px',
     lg: '40px',
-    xl: '96px',
+    xl: '96px'
 };
 
 const borderRadiuses = {
@@ -14,12 +14,12 @@ const borderRadiuses = {
     sm: '3px',
     md: '4px',
     lg: '6px',
-    xl: '8px',
+    xl: '8px'
 };
 
 export const vars = {
     size: createVar(),
-    radius: createVar(),
+    radius: createVar()
 };
 
 export const base = style({
@@ -47,33 +47,33 @@ export const size = styleVariants({
     xs: {
         vars: {
             [vars.size]: sizes.xs,
-            [vars.radius]: borderRadiuses.xs,
+            [vars.radius]: borderRadiuses.xs
         }
     },
     sm: {
         vars: {
             [vars.size]: sizes.sm,
-            [vars.radius]: borderRadiuses.sm,
-        },
+            [vars.radius]: borderRadiuses.sm
+        }
     },
     md: {
         vars: {
             [vars.size]: sizes.md,
-            [vars.radius]: borderRadiuses.md,
-        },
+            [vars.radius]: borderRadiuses.md
+        }
     },
     lg: {
         vars: {
             [vars.size]: sizes.lg,
-            [vars.radius]: borderRadiuses.lg,
-        },
+            [vars.radius]: borderRadiuses.lg
+        }
     },
     xl: {
         vars: {
             [vars.size]: sizes.xl,
-            [vars.radius]: borderRadiuses.xl,
-        },
-    },
+            [vars.radius]: borderRadiuses.xl
+        }
+    }
 });
 
 export const image = style({
@@ -81,10 +81,10 @@ export const image = style({
     width: '100%',
     height: '100%',
     flex: '1 1 100%'
-})
+});
 
 export const rounded = style({
-    borderRadius: '9999px',
+    borderRadius: '9999px'
 });
 
 export const outline = style({

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

@@ -1,14 +1,9 @@
-import MAvatarGroup from "../AvatarGroup.vue";
-import MAvatar from "../../avatar/Avatar.vue";
+import MAvatarGroup from '../AvatarGroup.vue';
+import MAvatar from '../../avatar/Avatar.vue';
 
-import {
-    MAvatarGroupBasic
-} from "./index";
+import { MAvatarGroupBasic } from './index';
 
-import {
-    createStory,
-    sizeArgType
-} from "../../../__storybook__";
+import { createStory, sizeArgType } from '../../../__storybook__';
 
 export default {
     component: MAvatarGroup,
@@ -19,6 +14,6 @@ export default {
     argTypes: {
         ...sizeArgType()
     }
-}
+};
 
 export const Basic = createStory(MAvatarGroupBasic);

package/src/components/avatargroup/style/AvatarGroup.css.ts

@@ -1,12 +1,17 @@
-import { createVar, globalStyle, style, styleVariants } from "@vanilla-extract/css";
-import { themeVars } from "../../../styles/theme.css";
+import {
+    createVar,
+    globalStyle,
+    style,
+    styleVariants
+} from '@vanilla-extract/css';
+import { themeVars } from '../../../styles/theme.css';
 
 const sizes = {
     xs: '16px',
     sm: '24px',
     md: '32px',
     lg: '40px',
-    xl: '96px',
+    xl: '96px'
 };
 
 export const base = style({
@@ -17,5 +22,5 @@ export const base = style({
 });
 
 export const item = style({
-    marginRight: '-10px',
+    marginRight: '-10px'
 });

package/src/components/avatargroup/symbol.ts

@@ -1,12 +1,11 @@
-import type {InjectionKey} from "vue";
-import type {Size} from "../../types/props";
+import type { InjectionKey } from 'vue';
+import type { Size } from '../../types/props';
 
 export type Options = {
     src: string;
     srcSet: string;
     alt: string;
-}
-
+};
 
 export interface AvatarGroupState {
     max: number;
@@ -14,4 +13,5 @@ export interface AvatarGroupState {
     rounded: boolean;
 }
 
-export const AVATAR_GROUP_STATE: InjectionKey<AvatarGroupState> = Symbol('AVATAR_GROUP_STATE');
+export const AVATAR_GROUP_STATE: InjectionKey<AvatarGroupState> =
+    Symbol('AVATAR_GROUP_STATE');

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

@@ -1,14 +1,12 @@
-import MBadge from "../Badge.vue";
+import MBadge from '../Badge.vue';
 
-import {
-    MBadgeBasic,
-} from "./index";
+import { MBadgeBasic } from './index';
 
 import {
     variantArgType,
     createStory,
     sizeArgType
-} from "../../../__storybook__";
+} from '../../../__storybook__';
 
 export default {
     component: MBadge,
@@ -16,6 +14,6 @@ export default {
     argTypes: {
         ...variantArgType()
     }
-}
+};
 
 export const Basic = createStory(MBadgeBasic);