maz-ui 3.43.4 → 3.44.0

package/package.json

@@ -1,16 +1,31 @@
 {
   "name": "maz-ui",
-  "version": "3.43.4",
+  "type": "module",
+  "version": "3.44.0",
   "description": "A standalone components library for Vue.Js 3 & Nuxt.Js 3",
   "author": "Louis Mazel <me@loicmazuel.com>",
-  "main": "./modules/index.cjs",
-  "module": "./modules/index.mjs",
-  "types": "./types/modules/index.d.ts",
-  "type": "module",
-  "bin": {
-    "maz": "./bin/maz.mjs",
-    "maz-ui": "./bin/maz.mjs"
+  "license": "MIT",
+  "homepage": "https://maz-ui.com/",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/LouisMazel/maz-ui.git"
+  },
+  "bugs": {
+    "url": "https://github.com/LouisMazel/maz-ui/issues"
   },
+  "keywords": [
+    "vue",
+    "nuxt",
+    "components",
+    "vue-component",
+    "framework",
+    "library",
+    "ui",
+    "nuxt",
+    "nuxt3",
+    "module",
+    "nuxt-module"
+  ],
   "exports": {
     ".": {
       "types": "./types/modules/index.d.ts",
@@ -40,21 +55,27 @@
     "./package.json": "./package.json",
     "./*": "./*"
   },
+  "main": "./modules/index.cjs",
+  "module": "./modules/index.mjs",
+  "types": "./types/modules/index.d.ts",
+  "bin": {
+    "maz": "./bin/maz.mjs",
+    "maz-ui": "./bin/maz.mjs"
+  },
   "files": [
+    "bin",
     "components",
-    "modules",
     "css",
-    "tailwindcss",
-    "nuxt",
-    "types",
     "icons",
+    "modules",
+    "nuxt",
     "resolvers",
-    "bin"
+    "tailwindcss",
+    "types"
   ],
-  "lint-staged": {
-    "*": "prettier -w -u",
-    "*.{js,ts,vue,mjs,mts,cjs}": "cross-env NODE_ENV=production eslint --fix",
-    "*.{vue,css,scss,postcss,pcss}": "stylelint --fix --allow-empty-input"
+  "engines": {
+    "node": ">= 6.0.0",
+    "npm": ">= 3.0.0"
   },
   "peerDependencies": {
     "@nuxt/kit": "^3.4.0",
@@ -69,134 +90,107 @@
     "vue-router": "^4.0.0"
   },
   "peerDependenciesMeta": {
-    "dropzone": {
-      "optional": true
-    },
-    "libphonenumber-js": {
+    "@nuxt/kit": {
       "optional": true
     },
     "chart.js": {
       "optional": true
     },
-    "vue-router": {
+    "dayjs": {
       "optional": true
     },
-    "dayjs": {
+    "defu": {
       "optional": true
     },
-    "nuxt": {
+    "dropzone": {
       "optional": true
     },
-    "@nuxt/kit": {
+    "libphonenumber-js": {
       "optional": true
     },
-    "defu": {
+    "nuxt": {
       "optional": true
     },
     "unplugin-vue-components": {
       "optional": true
+    },
+    "vue-router": {
+      "optional": true
     }
   },
   "dependencies": {
     "@mazui/cli": "latest"
   },
   "devDependencies": {
-    "@babel/core": "^7.24.5",
-    "@babel/preset-env": "^7.24.5",
-    "@babel/preset-typescript": "^7.24.1",
+    "@babel/core": "^7.24.7",
+    "@babel/preset-env": "^7.24.7",
+    "@babel/preset-typescript": "^7.24.7",
     "@nuxt/kit": "^3.11.2",
     "@nuxt/schema": "^3.11.2",
     "@types/dropzone": "^5.7.8",
-    "@types/google.maps": "^3.55.8",
-    "@vitejs/plugin-vue": "^5.0.4",
-    "@vitest/coverage-v8": "^1.5.3",
-    "@vue/compiler-sfc": "^3.4.26",
-    "@vue/eslint-config-prettier": "^9.0.0",
-    "@vue/eslint-config-typescript": "^13.0.0",
-    "@vue/test-utils": "^2.4.5",
+    "@types/google.maps": "^3.55.9",
+    "@vitejs/plugin-vue": "^5.0.5",
+    "@vitest/coverage-v8": "^1.6.0",
+    "@vue/compiler-sfc": "^3.4.27",
+    "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.5.1",
     "autoprefixer": "^10.4.19",
     "c8": "^9.1.0",
     "chalk": "5.3.0",
-    "chart.js": "^4.4.2",
+    "chart.js": "^4.4.3",
     "dayjs": "^1.11.11",
     "defu": "^6.1.4",
     "dropzone": "^5.9.3",
-    "eslint-plugin-vue": "^9.25.0",
     "eslint-plugin-vuejs-accessibility": "^2.3.0",
     "fs": "0.0.2",
-    "jsdom": "^24.0.0",
+    "jsdom": "^24.1.0",
     "json-templater": "^1.2.0",
-    "libphonenumber-js": "^1.10.61",
+    "libphonenumber-js": "^1.11.3",
     "minimist": "^1.2.8",
     "nuxt": "^3.11.2",
     "onchange": "^7.1.0",
     "path": "^0.12.7",
     "postcss": "^8.4.38",
-    "postcss-html": "^1.6.0",
+    "postcss-html": "^1.7.0",
     "postcss-import": "^16.1.0",
     "postcss-nested": "^6.0.0",
     "postcss-simple-vars": "^7.0.1",
     "postcss-url": "^10.1.3",
-    "prettier-plugin-tailwindcss": "^0.5.14",
-    "replace-in-file": "^7.1.0",
-    "rimraf": "^5.0.5",
-    "sass": "^1.76.0",
-    "semver": "^7.6.0",
+    "replace-in-file": "^7.2.0",
+    "rimraf": "^5.0.7",
+    "sass": "^1.77.4",
+    "semver": "^7.6.2",
     "sirv": "^2.0.4",
-    "stylelint": "^16.5.0",
+    "stylelint": "^16.6.1",
     "stylelint-config-recommended-vue": "^1.5.0",
     "stylelint-config-standard": "^36.0.0",
     "stylelint-config-standard-scss": "^13.1.0",
     "stylelint-config-tailwindcss": "^0.0.7",
-    "tailwindcss": "^3.4.3",
+    "tailwindcss": "^3.4.4",
     "unplugin-vue-components": "^0.27.0",
-    "vite": "^5.2.11",
+    "vite": "^5.2.13",
     "vite-plugin-css-injected-by-js": "^3.5.1",
-    "vite-plugin-lib-inject-css": "^2.0.1",
-    "vite-plugin-static-copy": "^1.0.4",
+    "vite-plugin-lib-inject-css": "^2.1.1",
+    "vite-plugin-static-copy": "^1.0.5",
     "vite-svg-loader": "^5.1.0",
-    "vitest": "^1.5.3",
+    "vitest": "^1.6.0",
     "vitest-canvas-mock": "^0.3.3",
-    "vue": "^3.4.26",
+    "vue": "^3.4.27",
     "vue-chartjs": "^5.3.1",
     "vue-loader": "^17.4.2",
-    "vue-router": "^4.3.2",
-    "vue-tsc": "^2.0.16"
-  },
-  "engines": {
-    "node": ">= 6.0.0",
-    "npm": ">= 3.0.0"
+    "vue-router": "^4.3.3",
+    "vue-tsc": "^2.0.21"
   },
-  "bugs": {
-    "url": "https://github.com/LouisMazel/maz-ui/issues"
-  },
-  "homepage": "https://maz-ui.com/",
-  "keywords": [
-    "vue",
-    "nuxt",
-    "components",
-    "vue-component",
-    "framework",
-    "library",
-    "ui",
-    "nuxt",
-    "nuxt3",
-    "module",
-    "nuxt-module"
-  ],
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/LouisMazel/maz-ui.git"
+  "lint-staged": {
+    "*.{js,ts,vue,mjs,mts,cjs}": "cross-env NODE_ENV=production eslint --fix",
+    "*.{vue,css,scss,postcss,pcss}": "stylelint --fix --allow-empty-input"
   },
-  "license": "MIT",
   "scripts": {
     "maz": "maz",
     "lint": "pnpm lint:js && pnpm lint:style",
-    "lint:nofix": "cross-env NODE_ENV=production eslint --ext .ts,.js,.mjs,.mts,.cjs,.vue .",
-    "lint:js": "cross-env NODE_ENV=production eslint --fix .",
+    "lint:nofix": "cross-env NODE_ENV=production eslint",
+    "lint:js": "pnpm lint:nofix --fix",
     "lint:style": "stylelint --fix \"./**/*.{vue,css,scss,postcss,pcss}\"",
-    "format": "prettier . --write",
     "build": "pnpm typecheck && pnpm build:lib",
     "build:lib": "node --loader ts-node/esm build/vite.config.ts",
     "get-icon-list": "node --loader ts-node/esm build/get-icon-list.ts",

package/resolvers/unplugin-directives-resolver.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentResolver } from 'unplugin-vue-components';
+import type { ComponentResolver } from 'unplugin-vue-components';
 /**
  * Resolver for Maz-UI (directives)
  *

package/resolvers/unplugin-vue-components-resolver.d.ts

@@ -1,4 +1,4 @@
-import { type ComponentResolver } from 'unplugin-vue-components';
+import type { ComponentResolver } from 'unplugin-vue-components';
 /**
  * Resolver for Maz-UI (components)
  *

package/tailwindcss/tailwind.config.ts

@@ -5,15 +5,18 @@ import plugin from 'tailwindcss/plugin'
 import type { Config } from 'tailwindcss'
 
 import { utilities } from './variables/utilities'
-import { screens, getNumericScreensFromTailwind } from './variables/breakpoints'
+import { getNumericScreensFromTailwind, screens } from './variables/breakpoints'
 import { zIndex } from './variables/z-indexes'
 import { getColors } from './utils/colors'
 
 export { getNumericScreensFromTailwind }
 
-export default {
+export const baseConfig = {
   darkMode: ['class', '[class~="dark"]'],
   content: [],
+  corePlugins: {
+    preflight: false,
+  },
   theme: {
     extend: {
       fontFamily: {
@@ -42,3 +45,7 @@ export default {
     }),
   ],
 } satisfies Config
+
+export const tailwindConfig = { ...baseConfig, corePlugins: { preflight: true } } satisfies Config
+
+export default baseConfig

package/tailwindcss/utils/colors.ts

@@ -1,5 +1,5 @@
 import type { ThemeConfig } from 'tailwindcss/types/config'
-import { baseColors, variations, variatingColors } from '../variables/colors'
+import { baseColors, variatingColors, variations } from '../variables/colors'
 
 export function getColors() {
   const colors: Record<keyof typeof variatingColors & keyof typeof baseColors, string> = {
@@ -9,8 +9,8 @@ export function getColors() {
   for (const color of Object.keys(variatingColors)) {
     colors[color] = variations.reduce(
       (colorVariations, variation) => {
-        colorVariations[variation] =
-          variation === 'DEFAULT'
+        colorVariations[variation]
+          = variation === 'DEFAULT'
             ? `var(--maz-color-${color})`
             : `var(--maz-color-${color}-${variation})`
         return colorVariations

package/tailwindcss/variables/colors.ts

@@ -1,23 +1,23 @@
 export const baseColors = {
-  transparent: 'transparent',
-  black: 'var(--maz-color-black)',
+  'transparent': 'transparent',
+  'black': 'var(--maz-color-black)',
   'black-contrast': 'var(--maz-color-black-contrast)',
-  white: 'var(--maz-color-white)',
+  'white': 'var(--maz-color-white)',
   'white-contrast': 'var(--maz-color-white-contrast)',
-  current: 'currentColor',
-  normal: 'var(--maz-color-text)',
-  color: 'var(--maz-color-bg)',
-  border: 'var(--maz-border-color)',
+  'current': 'currentColor',
+  'normal': 'var(--maz-color-text)',
+  'color': 'var(--maz-color-bg)',
+  'border': 'var(--maz-border-color)',
   'color-light': 'var(--maz-color-bg-light)',
   'color-lighter': 'var(--maz-color-bg-lighter)',
-  theme: 'var(--maz-color-bg-theme)',
+  'theme': 'var(--maz-color-bg-theme)',
   'theme-hover': 'var(--maz-color-bg-theme-hover)',
   'bg-dark': 'var(--maz-bg-color-dark)',
   'bg-light': 'var(--maz-bg-color-light)',
-  light: 'var(--maz-color-text-light)',
-  dark: 'var(--maz-color-text-dark)',
-  muted: 'var(--maz-color-muted)',
-  overlay: 'var(--maz-bg-overlay)',
+  'light': 'var(--maz-color-text-light)',
+  'dark': 'var(--maz-color-text-dark)',
+  'muted': 'var(--maz-color-muted)',
+  'overlay': 'var(--maz-bg-overlay)',
 }
 
 export const variations = [

package/tailwindcss/variables/utilities.ts

@@ -2,12 +2,12 @@ import type { CSSRuleObject } from 'tailwindcss/types/config'
 
 export const utilities = {
   '.padded-container': {
-    width: '100%',
+    'width': '100%',
     'padding-left': 'var(--maz-container-padding)',
     'padding-right': 'var(--maz-container-padding)',
   },
   '.padded-container-no-p': {
-    width: '100%',
+    'width': '100%',
     'padding-left': 'calc(50% - var(--maz-container-max-width) / 2)',
     'padding-right': 'calc(50% - var(--maz-container-max-width) / 2)',
   },

package/tailwindcss/variables/z-indexes.ts

@@ -1,15 +1,16 @@
 import type { ThemeConfig } from 'tailwindcss/types/config'
+
 export const zIndex = {
-  1: '1',
-  2: '2',
-  3: '3',
-  4: '4',
-  5: '5',
-  15: '15',
-  25: '25',
-  35: '35',
-  45: '45',
-  75: '75',
-  100: '100',
+  '1': '1',
+  '2': '2',
+  '3': '3',
+  '4': '4',
+  '5': '5',
+  '15': '15',
+  '25': '25',
+  '35': '35',
+  '45': '45',
+  '75': '75',
+  '100': '100',
   'default-backdrop': '1050',
 } satisfies ThemeConfig['zIndex']

package/types/components/MazAccordion.vue.d.ts

@@ -1,8 +1,8 @@
-export type Props = {
+export interface Props {
     id?: string;
     modelValue?: number;
     contentClass?: unknown;
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
     id: undefined;
     modelValue: number;

package/types/components/MazAvatar.vue.d.ts

@@ -1,6 +1,6 @@
 import type { Color } from './types';
 export type { Color };
-export type Props = {
+export interface Props {
     /** The source of the image */
     src?: string | null;
     /** The caption of the avatar */
@@ -44,7 +44,7 @@ export type Props = {
     fallbackSrc?: string;
     /** Load the fallback image by default */
     noPhoto?: boolean;
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
     src: undefined;
     caption: undefined;
@@ -89,8 +89,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     href: string;
     fallbackSrc: string;
     target: string;
-    to: string | Record<string, unknown>;
     roundedSize: "sm" | "md" | "lg" | "xl" | "none" | "full";
+    to: string | Record<string, unknown>;
     buttonColor: Color;
     letterCount: number;
 }, {}>, {

package/types/components/MazBackdrop.vue.d.ts

@@ -1,5 +1,5 @@
 import { type HTMLAttributes } from 'vue';
-export type Props = {
+export interface Props {
     modelValue?: boolean;
     teleportSelector?: string;
     beforeClose?: () => Promise<void> | void;
@@ -8,7 +8,7 @@ export type Props = {
     transitionName?: string;
     backdropClass?: HTMLAttributes['class'];
     backdropContentClass?: HTMLAttributes['class'];
-};
+}
 declare function close(): void;
 declare function toggleModal(value: any): Promise<void>;
 declare function onBackdropAnimationEnter(): void;

package/types/components/MazBadge.vue.d.ts

@@ -1,14 +1,14 @@
 import type { Color } from './types';
 export type BadgeColor = Color | 'gray';
 export type BadgeRoundedSize = 'none' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
-export type Props = {
+export interface Props {
     color?: BadgeColor;
     size?: string;
     nowrap?: boolean;
     outline?: boolean;
     pastel?: boolean;
     roundedSize?: BadgeRoundedSize;
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
     color: string;
     size: string;

package/types/components/MazBtn.vue.d.ts

@@ -1,9 +1,10 @@
-import { type FunctionalComponent, type SVGAttributes, type ComponentPublicInstance, type Component, type HTMLAttributes } from 'vue';
+import { type Component, type ComponentPublicInstance, type FunctionalComponent, type HTMLAttributes, type SVGAttributes } from 'vue';
 import type { Color, Size } from './types';
 export type { Color, Size };
 export type Icon = FunctionalComponent<SVGAttributes> | ComponentPublicInstance | Component;
-export type Props = {
-    /** The variant of the button - Change UI of component (link or button style)
+export interface Props {
+    /**
+     * The variant of the button - Change UI of component (link or button style)
      * @values `'button' | 'link'`
      * @deprecated Use the component <MazLink /> instead
      */
@@ -53,7 +54,8 @@ export type Props = {
      * @default false
      */
     block?: boolean;
-    /** If true, the button will have no underline on hover (useful with `variant="link"`)
+    /**
+     * If true, the button will have no underline on hover (useful with `variant="link"`)
      * @default false
      */
     noUnderline?: boolean;
@@ -99,7 +101,7 @@ export type Props = {
     noElevation?: boolean;
     /** The class applied to the content wrapper (<span />) of the button */
     contentClass?: HTMLAttributes['class'];
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
     variant: string;
     size: string;

package/types/components/MazCard.vue.d.ts

@@ -1,8 +1,8 @@
 import { type HTMLAttributes } from 'vue';
+import type { RouterLinkProps } from 'vue-router';
 import type { MazGalleryImage } from './types';
-import { type RouterLinkProps } from 'vue-router';
 export type { MazGalleryImage } from './types';
-export type Props = {
+export interface Props {
     /** Images displayed */
     images?: MazGalleryImage[];
     /** Card variant: Must be `column | row | row-reverse | column-reverse` */
@@ -53,7 +53,7 @@ export type Props = {
     header?: string;
     /** The card will be displayed in full width */
     block?: boolean;
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
     images: undefined;
     orientation: string;

package/types/components/MazCardSpotlight.vue.d.ts

@@ -1,7 +1,7 @@
 import { type HTMLAttributes, type StyleValue } from 'vue';
 import type { Color } from './types';
 export type { Color };
-export type Props = {
+export interface Props {
     /**
      * The color of the component.
      * @default primary
@@ -32,7 +32,7 @@ export type Props = {
      * @default 0.95
      */
     innerOpacity?: number;
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
     noElevation: boolean;
     color: string;

package/types/components/MazCarousel.vue.d.ts

@@ -1,4 +1,4 @@
-export type Props = {
+export interface Props {
     /** Do not display the scroll buttons */
     noScrollBtn?: boolean;
     /** Aria label for the previous button */
@@ -7,7 +7,7 @@ export type Props = {
     ariaLabelNextButton?: string;
     /** Hide the scrollbar when not active */
     hideScrollbar?: boolean;
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
     ariaLabelPreviousButton: string;
     ariaLabelNextButton: string;

package/types/components/MazChart.vue.d.ts

@@ -1,5 +1,5 @@
 import { type PropType } from 'vue';
-import { type ChartType, type ChartData, type UpdateMode } from 'chart.js';
+import { type ChartData, type ChartType, type UpdateMode } from 'chart.js';
 export type { ChartType, ChartData, UpdateMode };
 declare const _default: import("vue").DefineComponent<{
     /**

package/types/components/MazCheckbox.vue.d.ts

@@ -1,7 +1,7 @@
 import { type HTMLAttributes } from 'vue';
 import type { Color, Size } from './types';
 export type { Color, Size };
-export type Props = {
+export interface Props {
     style?: HTMLAttributes['style'];
     class?: HTMLAttributes['class'];
     modelValue?: boolean | (string | number)[];
@@ -12,7 +12,7 @@ export type Props = {
     size?: Size;
     label?: string;
     disabled?: boolean;
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
     style: undefined;
     class: undefined;

package/types/components/MazCircularProgressBar.vue.d.ts

@@ -1,4 +1,4 @@
-import { type Color } from './types';
+import type { Color } from './types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     /**
      * The percentage value of the progress bar

package/types/components/MazDialog.vue.d.ts

@@ -1,5 +1,5 @@
 import { type Props as MazBackdropProps } from './MazBackdrop.vue';
-export type Props = {
+export interface Props {
     /** @model Modal's model value */
     modelValue?: boolean;
     /** Title of the modal in header */
@@ -16,7 +16,7 @@ export type Props = {
     scrollable?: boolean;
     /** Persistent dialog (not closable by clicking outside and remove close button) */
     persistent?: boolean;
-};
+}
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<Props & MazBackdropProps>, {
     title: undefined;
     noClose: boolean;