@maz-ui/mcp 5.0.0-beta.2 → 5.0.0-beta.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/mcp.d.mts +22 -9
- package/dist/mcp.d.ts +22 -9
- package/dist/mcp.mjs +160 -83
- package/docs/generated-docs/maz-avatar.doc.md +25 -25
- package/docs/generated-docs/maz-btn.doc.md +1 -1
- package/docs/generated-docs/maz-checkbox.doc.md +16 -17
- package/docs/generated-docs/maz-circular-progress-bar.doc.md +1 -1
- package/docs/generated-docs/maz-code-highlight.doc.md +11 -0
- package/docs/generated-docs/maz-date-picker.doc.md +41 -41
- package/docs/generated-docs/maz-drawer.doc.md +7 -8
- package/docs/generated-docs/maz-expand-animation.doc.md +4 -4
- package/docs/generated-docs/maz-fullscreen-loader.doc.md +5 -5
- package/docs/generated-docs/maz-gallery.doc.md +15 -15
- package/docs/generated-docs/maz-input-code.doc.md +16 -16
- package/docs/generated-docs/maz-input-phone-number.doc.md +42 -38
- package/docs/generated-docs/maz-input-price.doc.md +14 -14
- package/docs/generated-docs/maz-input-tags.doc.md +16 -16
- package/docs/generated-docs/maz-input.doc.md +33 -33
- package/docs/generated-docs/maz-lazy-img.doc.md +14 -14
- package/docs/generated-docs/maz-loading-bar.doc.md +4 -4
- package/docs/generated-docs/maz-pull-to-refresh.doc.md +10 -10
- package/docs/generated-docs/maz-radio-buttons.doc.md +17 -17
- package/docs/generated-docs/maz-radio.doc.md +16 -16
- package/docs/generated-docs/maz-reading-progress-bar.doc.md +4 -4
- package/docs/generated-docs/maz-sidebar-content.doc.md +5 -0
- package/docs/generated-docs/maz-sidebar-footer.doc.md +5 -0
- package/docs/generated-docs/maz-sidebar-group.doc.md +11 -0
- package/docs/generated-docs/maz-sidebar-header.doc.md +5 -0
- package/docs/generated-docs/maz-sidebar-menu-button.doc.md +27 -0
- package/docs/generated-docs/maz-sidebar-menu-item.doc.md +5 -0
- package/docs/generated-docs/maz-sidebar-menu-sub.doc.md +16 -0
- package/docs/generated-docs/maz-sidebar-menu.doc.md +5 -0
- package/docs/generated-docs/maz-sidebar-separator.doc.md +0 -0
- package/docs/generated-docs/maz-sidebar-trigger.doc.md +5 -0
- package/docs/generated-docs/maz-sidebar.doc.md +36 -0
- package/docs/generated-docs/maz-slider.doc.md +1 -1
- package/docs/generated-docs/maz-spinner.doc.md +4 -4
- package/docs/generated-docs/maz-switch.doc.md +14 -14
- package/docs/generated-docs/maz-table.doc.md +5 -5
- package/docs/generated-docs/maz-textarea.doc.md +25 -24
- package/docs/generated-docs/maz-ticker.doc.md +1 -1
- package/docs/generated-docs/maz-window-mockup.doc.md +23 -0
- package/docs/src/blog/v4.md +1 -1
- package/docs/src/blog/v5.md +5 -7
- package/docs/src/components/maz-btn.md +1 -1
- package/docs/src/components/maz-code-highlight.md +233 -0
- package/docs/src/components/maz-container.md +2 -2
- package/docs/src/components/maz-date-picker.md +1 -1
- package/docs/src/components/maz-dialog.md +46 -0
- package/docs/src/components/maz-icon.md +2 -2
- package/docs/src/components/maz-input-phone-number.md +106 -103
- package/docs/src/components/maz-sidebar.md +719 -0
- package/docs/src/components/maz-textarea.md +27 -1
- package/docs/src/components/maz-timeline.md +60 -0
- package/docs/src/components/maz-window-mockup.md +249 -0
- package/docs/src/directives/click-outside.md +8 -15
- package/docs/src/directives/fullscreen-img.md +1 -1
- package/docs/src/directives/lazy-img.md +5 -5
- package/docs/src/directives/tooltip.md +24 -1
- package/docs/src/directives/zoom-img.md +1 -1
- package/docs/src/ecosystem/eslint-config.md +95 -1
- package/docs/src/{guide/icons.md → ecosystem/icons/index.md} +1 -1
- package/docs/src/ecosystem/node/exec-promise.md +87 -0
- package/docs/src/ecosystem/node/index.md +53 -0
- package/docs/src/ecosystem/node/logger.md +146 -0
- package/docs/src/ecosystem/node/print-banner.md +93 -0
- package/docs/src/{guide → ecosystem}/nuxt.md +81 -47
- package/docs/src/{guide → ecosystem}/themes.md +153 -72
- package/docs/src/{guide → ecosystem}/translations.md +1 -1
- package/docs/src/ecosystem/utils/camel-case.md +31 -0
- package/docs/src/{helpers → ecosystem/utils}/capitalize.md +2 -3
- package/docs/src/ecosystem/utils/check-availability.md +79 -0
- package/docs/src/ecosystem/utils/cookie.md +80 -0
- package/docs/src/{helpers → ecosystem/utils}/currency.md +2 -2
- package/docs/src/{helpers → ecosystem/utils}/date.md +2 -2
- package/docs/src/ecosystem/utils/debounce-callback.md +38 -0
- package/docs/src/ecosystem/utils/debounce-id.md +69 -0
- package/docs/src/ecosystem/utils/debounce.md +65 -0
- package/docs/src/ecosystem/utils/fetch-locale-ip.md +33 -0
- package/docs/src/ecosystem/utils/format-json.md +33 -0
- package/docs/src/ecosystem/utils/format-phone-number.md +37 -0
- package/docs/src/ecosystem/utils/get-browser-locale.md +29 -0
- package/docs/src/ecosystem/utils/get-error-message.md +39 -0
- package/docs/src/ecosystem/utils/idle-timeout.md +90 -0
- package/docs/src/ecosystem/utils/index.md +60 -0
- package/docs/src/ecosystem/utils/is-client.md +32 -0
- package/docs/src/ecosystem/utils/is-equal.md +38 -0
- package/docs/src/ecosystem/utils/is-server.md +31 -0
- package/docs/src/ecosystem/utils/is-standalone-mode.md +43 -0
- package/docs/src/ecosystem/utils/kebab-case.md +36 -0
- package/docs/src/ecosystem/utils/normalize-string.md +77 -0
- package/docs/src/{helpers → ecosystem/utils}/number.md +2 -2
- package/docs/src/ecosystem/utils/pascal-case.md +35 -0
- package/docs/src/ecosystem/utils/script-loader.md +77 -0
- package/docs/src/ecosystem/utils/sleep.md +59 -0
- package/docs/src/ecosystem/utils/snake-case.md +36 -0
- package/docs/src/ecosystem/utils/swipe-handler.md +91 -0
- package/docs/src/ecosystem/utils/textarea-autogrow.md +41 -0
- package/docs/src/ecosystem/utils/throttle-id.md +48 -0
- package/docs/src/ecosystem/utils/throttle.md +57 -0
- package/docs/src/ecosystem/utils/truthy-filter.md +31 -0
- package/docs/src/ecosystem/utils/types/deep-key-of.md +48 -0
- package/docs/src/ecosystem/utils/types/deep-partial.md +42 -0
- package/docs/src/ecosystem/utils/types/deep-required.md +39 -0
- package/docs/src/ecosystem/utils/types/flatten-object-keys.md +44 -0
- package/docs/src/ecosystem/utils/types/generic-instance-type.md +42 -0
- package/docs/src/ecosystem/utils/types/infer-maybe-ref.md +35 -0
- package/docs/src/ecosystem/utils/upper-first.md +32 -0
- package/docs/src/ecosystem/utils/user-visibility.md +69 -0
- package/docs/src/guide/getting-started.md +15 -13
- package/docs/src/guide/global-defaults.md +101 -0
- package/docs/src/guide/maz-ui-provider.md +6 -3
- package/docs/src/guide/migration-v4.md +13 -9
- package/docs/src/guide/migration-v5.md +67 -12
- package/docs/src/guide/resolvers.md +7 -7
- package/docs/src/guide/tailwind.md +4 -0
- package/docs/src/guide/vue.md +4 -4
- package/docs/src/index.md +12 -12
- package/docs/src/plugins/aos.md +1 -1
- package/docs/src/plugins/wait.md +1 -1
- package/package.json +6 -5
- package/docs/src/helpers/camel-case.md +0 -14
- package/docs/src/helpers/check-availability.md +0 -14
- package/docs/src/helpers/debounce-callback.md +0 -14
- package/docs/src/helpers/debounce-id.md +0 -14
- package/docs/src/helpers/debounce.md +0 -14
- package/docs/src/helpers/is-client.md +0 -14
- package/docs/src/helpers/is-equal.md +0 -14
- package/docs/src/helpers/is-standalone-mode.md +0 -14
- package/docs/src/helpers/kebab-case.md +0 -14
- package/docs/src/helpers/normalize-string.md +0 -14
- package/docs/src/helpers/pascal-case.md +0 -14
- package/docs/src/helpers/script-loader.md +0 -14
- package/docs/src/helpers/sleep.md +0 -14
- package/docs/src/helpers/snake-case.md +0 -14
- package/docs/src/helpers/throttle-id.md +0 -14
- package/docs/src/helpers/throttle.md +0 -14
- /package/docs/src/{guide → ecosystem/icons}/icon-set.md +0 -0
- /package/docs/src/{guide → ecosystem}/mcp.md +0 -0
- /package/docs/src/{helpers → ecosystem/utils}/country-code-to-unicode-flag.md +0 -0
- /package/docs/src/{helpers → ecosystem/utils}/get-country-flag-url.md +0 -0
|
@@ -13,7 +13,7 @@ Performance has also been significantly improved thanks to optimal tree-shaking,
|
|
|
13
13
|
|
|
14
14
|
::: tip Connected to Maz-UI MCP
|
|
15
15
|
|
|
16
|
-
Follow the [MCP](/
|
|
16
|
+
Follow the [MCP](/ecosystem/mcp) guide to connect your AI assistant to Maz-UI's documentation for a smooth migration process.
|
|
17
17
|
|
|
18
18
|
:::
|
|
19
19
|
|
|
@@ -41,6 +41,10 @@ v4.0.0 isn't just an update, it's a **complete rebuild** that transforms Maz-UI
|
|
|
41
41
|
- **Dynamic CSS Variables**: Automatic CSS variable generation
|
|
42
42
|
- **Intelligent dark mode**: Configurable strategies for dark mode based on system preferences and user choice stored in cookies
|
|
43
43
|
|
|
44
|
+
::: tip Theming further evolved in v5
|
|
45
|
+
The theme system has been rewritten on top of native `light-dark()` + `color-scheme` + `color-mix(in oklch)` in v5. If you are upgrading past v4, see the dedicated [v5 migration guide](./migration-v5.md#theming-native-css-rewrite-new-non-breaking-by-default) for the full theming changes (new `lightClass`, `Promise<void>` returns, removed JS helpers).
|
|
46
|
+
:::
|
|
47
|
+
|
|
44
48
|
#### Complete Internationalization
|
|
45
49
|
|
|
46
50
|
- **9 supported languages by default**: EN, FR, DE, ES, IT, PT, JA, ZH-CN
|
|
@@ -688,12 +692,12 @@ app.use(MazUi, {
|
|
|
688
692
|
<script setup>
|
|
689
693
|
import { useTheme } from 'maz-ui/composables'
|
|
690
694
|
|
|
691
|
-
const { isDark, toggleDarkMode,
|
|
695
|
+
const { isDark, toggleDarkMode, updateTheme } = useTheme()
|
|
692
696
|
|
|
693
697
|
// Change theme
|
|
694
|
-
|
|
698
|
+
updateTheme('ocean')
|
|
695
699
|
|
|
696
|
-
// Toggle dark mode
|
|
700
|
+
// Toggle dark mode (v5: returns Promise<void>, optional { animate } param)
|
|
697
701
|
toggleDarkMode()
|
|
698
702
|
</script>
|
|
699
703
|
|
|
@@ -704,7 +708,7 @@ toggleDarkMode()
|
|
|
704
708
|
</template>
|
|
705
709
|
```
|
|
706
710
|
|
|
707
|
-
**📖 Complete documentation:** [Theme Guide](/
|
|
711
|
+
**📖 Complete documentation:** [Theme Guide](/ecosystem/themes)
|
|
708
712
|
|
|
709
713
|
## Translation System
|
|
710
714
|
|
|
@@ -744,7 +748,7 @@ setLocale('fr')
|
|
|
744
748
|
</template>
|
|
745
749
|
```
|
|
746
750
|
|
|
747
|
-
**📖 Complete documentation:** [Translation Guide](/
|
|
751
|
+
**📖 Complete documentation:** [Translation Guide](/ecosystem/translations)
|
|
748
752
|
|
|
749
753
|
## Common Errors and Solutions
|
|
750
754
|
|
|
@@ -901,10 +905,10 @@ app.use(MazUi)
|
|
|
901
905
|
## Additional Resources
|
|
902
906
|
|
|
903
907
|
- **[Official v4 Documentation](https://maz-ui.com)** - Complete documentation
|
|
904
|
-
- **[Theme Guide](/
|
|
905
|
-
- **[Translation Guide](/
|
|
908
|
+
- **[Theme Guide](/ecosystem/themes)** - Advanced theme system
|
|
909
|
+
- **[Translation Guide](/ecosystem/translations)** - Internationalization
|
|
906
910
|
- **[Vue Installation Guide](/guide/vue)** - Vue setup
|
|
907
|
-
- **[Nuxt Installation Guide](/
|
|
911
|
+
- **[Nuxt Installation Guide](/ecosystem/nuxt)** - Nuxt setup
|
|
908
912
|
- **[Resolvers Guide](/guide/resolvers)** - Smart auto-imports
|
|
909
913
|
- **[Complete Changelog](https://github.com/LouisMazel/maz-ui/blob/master/CHANGELOG.md)** - All changes
|
|
910
914
|
|
|
@@ -23,7 +23,7 @@ npx @maz-ui/upgrade ./ --dry-run
|
|
|
23
23
|
npx @maz-ui/upgrade ./
|
|
24
24
|
```
|
|
25
25
|
|
|
26
|
-
It
|
|
26
|
+
It handles the mechanical part of the migration (CSS subpath imports, prop renames, CSS var renames, Nuxt config keys, custom preset color keys, and `package.json` version bumps)
|
|
27
27
|
|
|
28
28
|
What it can't decide for you: the `MazIcon` API simplification (section 4), `MazBadge` numeric size mapping (section 9), `foundation.radius` → `scales.rounded.md` reshape (section 11) and `MazChart` `update-mode` defaults (section 8). Those are best handled with the MCP server below.
|
|
29
29
|
|
|
@@ -557,7 +557,7 @@ rg "color\s*=\s*['\"]background['\"]" src/
|
|
|
557
557
|
|
|
558
558
|
### Theme colors are now emitted as OKLCh
|
|
559
559
|
|
|
560
|
-
`@maz-ui/themes` now ships its bundled presets (`mazUi`, `ocean`, `pristine`, `obsidian`) in `oklch()` form, and the
|
|
560
|
+
`@maz-ui/themes` now ships its bundled presets (`mazUi`, `ocean`, `pristine`, `obsidian`, `nova`) in `oklch()` form, and the runtime CSS variables (`--maz-primary`, `--maz-primary-100`, …) therefore hold OKLCh colors. The 50–950 scale is derived in CSS via OKLCh relative color syntax — `oklch(from var(--maz-X) clamp(0, calc(l ± offset), 1) calc(c * mult) h)` — perceptually uniform, chroma-preserving, and live-reactive to base color overrides.
|
|
561
561
|
|
|
562
562
|
This is **transparent for consumers**:
|
|
563
563
|
|
|
@@ -568,16 +568,8 @@ This is **transparent for consumers**:
|
|
|
568
568
|
|
|
569
569
|
You only need to do something if you were:
|
|
570
570
|
|
|
571
|
-
- **Reading the channel format** of a color from `--maz-*` in JS — the value used to be an `hsl(...)` string, it's now an `oklch(...)` string. Use `getComputedStyle(...).getPropertyValue(...)` and a CSS color parser if you need channels.
|
|
572
|
-
- **Calling
|
|
573
|
-
|
|
574
|
-
```ts
|
|
575
|
-
// v4: HSL L percentage
|
|
576
|
-
adjustColorLightness('hsl(210 50% 40%)', 20) // → 'hsl(210 50% 60%)'
|
|
577
|
-
|
|
578
|
-
// v5: OKLCh L (0..1)
|
|
579
|
-
adjustColorLightness('hsl(210 50% 40%)', 0.2) // → 'oklch(0.65 0.108 232.62)'
|
|
580
|
-
```
|
|
571
|
+
- **Reading the channel format** of a color from `--maz-*` in JS — the value used to be an `hsl(...)` string, it's now an `oklch(...)` string (and at runtime the base may resolve through `light-dark()`). Use `getComputedStyle(...).getPropertyValue(...)` and a CSS color parser if you need channels.
|
|
572
|
+
- **Calling the legacy JS palette helpers** (`generateColorScale`, `adjustColorLightness`, `getContrastColor`, `parseHSL`) — these exports were removed in v5. See [BREAKING — removed exports](#breaking-removed-exports) for replacements.
|
|
581
573
|
|
|
582
574
|
Why the switch: OKLCh is perceptually uniform, so generated scales (`primary-50` → `primary-950`) ramp consistently across hues — yellow-700 won't look muddy compared to blue-700 anymore. It also unlocks Display P3 colors when you author a vivid preset.
|
|
583
575
|
|
|
@@ -615,6 +607,69 @@ Four bundled presets remain (`mazUi`, `pristine`, `ocean`, `obsidian`) plus a ne
|
|
|
615
607
|
|
|
616
608
|
Switching to one of the bundled presets does not require any code change beyond the preset name. If you depended on the previous (washed-out gray) `secondary` color in a custom theme, override it back via `colors.{light,dark}.secondary` in your preset.
|
|
617
609
|
|
|
610
|
+
### Theming: native CSS rewrite (new — non-breaking by default)
|
|
611
|
+
|
|
612
|
+
The `@maz-ui/themes` CSS pipeline was rewritten to lean on native CSS instead of JS:
|
|
613
|
+
|
|
614
|
+
- Base colors are now emitted as a single `--maz-X: light-dark(L, D)` declaration. The browser resolves it for you.
|
|
615
|
+
- Color scales `--maz-X-50` through `--maz-X-950` are derived via OKLCh relative color syntax at runtime, so any override on the base color cascades through the whole scale automatically (and preserves its chroma).
|
|
616
|
+
- `:root` declares `color-scheme: light dark` so native widgets (scrollbars, native `<select>`, date pickers, autofill) follow the active mode out of the box.
|
|
617
|
+
- A `<meta name="color-scheme">` tag is **automatically injected** at boot (Vue + Nuxt SSR). No user action — prevents the Flash of inAccurate coloR Theme.
|
|
618
|
+
|
|
619
|
+
Consumer-visible CSS surface is unchanged: `var(--maz-primary)`, `--maz-primary-500`, Tailwind utilities `bg-primary/60`, `bg-primary-500`, etc. all keep working.
|
|
620
|
+
|
|
621
|
+
#### `lightClass` (new — optional, default `'light'`)
|
|
622
|
+
|
|
623
|
+
Mirror of `darkClass`. When `colorMode === 'light'` and `darkModeStrategy === 'class'`, this class is added to `<html>` to force `color-scheme: only light`. Default `'light'` — set to `false`/custom string if it clashes with an existing class in your app:
|
|
624
|
+
|
|
625
|
+
```ts
|
|
626
|
+
app.use(MazUi, {
|
|
627
|
+
theme: {
|
|
628
|
+
preset: mazUi,
|
|
629
|
+
darkClass: 'dark',
|
|
630
|
+
lightClass: 'light', // new
|
|
631
|
+
},
|
|
632
|
+
})
|
|
633
|
+
```
|
|
634
|
+
|
|
635
|
+
Non-breaking: if you never explicitly forced light, nothing changes.
|
|
636
|
+
|
|
637
|
+
#### `setColorMode` / `toggleDarkMode` now return `Promise<void>`
|
|
638
|
+
|
|
639
|
+
Both functions are now async to support the optional `{ animate: true }` parameter (View Transitions). Existing callers that ignored the return value keep working — `await` is only required when you need to chain.
|
|
640
|
+
|
|
641
|
+
```ts
|
|
642
|
+
const { setColorMode, toggleDarkMode } = useTheme()
|
|
643
|
+
|
|
644
|
+
// Existing v4 call — still works, return value ignored
|
|
645
|
+
setColorMode('dark')
|
|
646
|
+
toggleDarkMode()
|
|
647
|
+
|
|
648
|
+
// v5 — await to chain after the change is applied
|
|
649
|
+
await setColorMode('dark')
|
|
650
|
+
|
|
651
|
+
// v5 — animated full-page switch via document.startViewTransition()
|
|
652
|
+
await toggleDarkMode({ animate: true })
|
|
653
|
+
await setColorMode('dark', { animate: true })
|
|
654
|
+
```
|
|
655
|
+
|
|
656
|
+
The View Transitions glue is lazy-imported — when `animate` is not used, it stays out of your boot bundle. Browsers that don't support the API apply the change immediately with no animation.
|
|
657
|
+
|
|
658
|
+
#### BREAKING — removed exports
|
|
659
|
+
|
|
660
|
+
The JS-based palette generator is gone. The following helpers used to be exported from `@maz-ui/themes` and **no longer exist** in v5:
|
|
661
|
+
|
|
662
|
+
| Removed export | Replacement |
|
|
663
|
+
| --- | --- |
|
|
664
|
+
| `generateColorScale(base, mode)` | The scale is now generated in CSS via `oklch(from var(--maz-X) clamp(0, calc(l ± offset), 1) calc(c * mult) h)`. Read the live value from `--maz-X-{50..950}`, or replicate the formula inline. |
|
|
665
|
+
| `parseHSL(value)` | Use a CSS color parser or `parseColorAsOklch` from `@maz-ui/themes/utils/color-conversions`. |
|
|
666
|
+
| `adjustColorLightness(color, amount)` | Inline with `oklch(from <color> calc(l + N) c h)` to shift lightness while preserving chroma and hue. |
|
|
667
|
+
| `getContrastColor(color)` | Use the preset's `*-foreground` token, which is what components consume internally. |
|
|
668
|
+
|
|
669
|
+
`colorToHex`, `parseColorAsOklch` and `formatAsOklch` are **preserved**, now exported from `@maz-ui/themes/utils/color-conversions`.
|
|
670
|
+
|
|
671
|
+
If you were importing any of the removed helpers from `@maz-ui/themes`, replace them before upgrading.
|
|
672
|
+
|
|
618
673
|
### Preset name persistence (new — opt-out, no breaking change)
|
|
619
674
|
|
|
620
675
|
`@maz-ui/themes` now persists the active preset name in a `maz-preset` cookie (1-year TTL, `SameSite=Lax`) — same shape as the existing `maz-color-mode` cookie:
|
|
@@ -12,7 +12,7 @@ head:
|
|
|
12
12
|
Supercharge your Vue development with Maz-UI's intelligent auto-import resolvers. Never write import statements again while maintaining perfect tree-shaking and TypeScript support.
|
|
13
13
|
|
|
14
14
|
::: tip Vue Only Feature
|
|
15
|
-
Auto-import resolvers are designed for Vue projects using build tools like Vite or Webpack. For Nuxt users, everything is already integrated in the [@maz-ui/nuxt module](/
|
|
15
|
+
Auto-import resolvers are designed for Vue projects using build tools like Vite or Webpack. For Nuxt users, everything is already integrated in the [@maz-ui/nuxt module](/ecosystem/nuxt).
|
|
16
16
|
:::
|
|
17
17
|
|
|
18
18
|
## Why Use Auto-Import Resolvers?
|
|
@@ -229,7 +229,7 @@ function showSuccess() {
|
|
|
229
229
|
|
|
230
230
|
| Category | Composables |
|
|
231
231
|
| -------------------- | --------------------------------------------------- |
|
|
232
|
-
| **UI Management** | [`useToast`](./../composables/use-toast.md), [`useDialog`](./../composables/use-dialog.md), [`useTheme`](./../
|
|
232
|
+
| **UI Management** | [`useToast`](./../composables/use-toast.md), [`useDialog`](./../composables/use-dialog.md), [`useTheme`](./../ecosystem/themes.md#usetheme-composable-api), [`useWait`](./../composables/use-wait.md) |
|
|
233
233
|
| **Responsive** | [`useBreakpoints`](./../composables/use-breakpoints.md), [`useWindowSize`](./../composables/use-window-size.md) |
|
|
234
234
|
| **User Interaction** | [`useUserVisibility`](./../composables/use-user-visibility.md), [`useIdleTimeout`](./../composables/use-idle-timeout.md), [`useSwipe`](./../composables/use-swipe.md) |
|
|
235
235
|
| **Form Handling** | [`useFormValidator`](./../composables/use-form-validator.md) |
|
|
@@ -237,10 +237,10 @@ function showSuccess() {
|
|
|
237
237
|
|
|
238
238
|
**Most used available formatters and utilities:**
|
|
239
239
|
|
|
240
|
-
| Category
|
|
241
|
-
|
|
|
242
|
-
| **Formatters**
|
|
243
|
-
| **Utilities**
|
|
240
|
+
| Category | Utilities/Formatters |
|
|
241
|
+
| -------------- | -------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
242
|
+
| **Formatters** | [`formatCurrency`](./../ecosystem/utils/currency.md), [`formatDate`](./../ecosystem/utils/date.md), [`sleep`](./../ecosystem/utils/sleep.md) |
|
|
243
|
+
| **Utilities** | [`debounce`](./../ecosystem/utils/debounce.md), [`throttle`](./../ecosystem/utils/throttle.md), [`isEqual`](./../ecosystem/utils/is-equal.md) |
|
|
244
244
|
|
|
245
245
|
## Advanced Configuration
|
|
246
246
|
|
|
@@ -670,7 +670,7 @@ const toast = useToast()
|
|
|
670
670
|
|
|
671
671
|
- [unplugin-vue-components](https://github.com/antfu/unplugin-vue-components) - The underlying auto-import system
|
|
672
672
|
- [unplugin-auto-import](https://github.com/antfu/unplugin-auto-import) - Auto-import for composables and utilities
|
|
673
|
-
- [Nuxt Module](/
|
|
673
|
+
- [Nuxt Module](/ecosystem/nuxt) - All auto-imports included out of the box
|
|
674
674
|
|
|
675
675
|
---
|
|
676
676
|
|
|
@@ -47,6 +47,10 @@ Each one comes with `bg-X`, `text-X`, `border-X`, an 11-step scale (`bg-X-50`
|
|
|
47
47
|
<div class="bg-success-100 text-success-700">Saved!</div>
|
|
48
48
|
```
|
|
49
49
|
|
|
50
|
+
::: info Alpha utilities and scales in v5
|
|
51
|
+
`bg-primary/60`, `text-primary/40`, `border-primary/50` and the rest of Tailwind's alpha syntax continue to work unchanged. In v5 the 50–950 scales are derived in CSS via OKLCh relative color syntax and the base colors are resolved through `light-dark()`, but this is invisible at the utility level — your Tailwind classes don't change.
|
|
52
|
+
:::
|
|
53
|
+
|
|
50
54
|
### Neutral & surface colors
|
|
51
55
|
|
|
52
56
|
These don't have a foreground variant — they're typically used for backgrounds, text, borders or overlays directly. Each one still ships an 11-step scale.
|
package/docs/src/guide/vue.md
CHANGED
|
@@ -81,7 +81,7 @@ app.use(MazUi, {
|
|
|
81
81
|
/**
|
|
82
82
|
* Theme configuration (optional if you are using the default theme)
|
|
83
83
|
* More information in dedicated documentation
|
|
84
|
-
* @see https://maz-ui.com/
|
|
84
|
+
* @see https://maz-ui.com/ecosystem/themes
|
|
85
85
|
*/
|
|
86
86
|
theme: {
|
|
87
87
|
preset: mazUi, // 'ocean' | 'pristine' | 'obsidian' | 'nova'
|
|
@@ -103,7 +103,7 @@ app.use(MazUi, {
|
|
|
103
103
|
/**
|
|
104
104
|
* Translations configuration (optional if you are using english)
|
|
105
105
|
* More information in dedicated documentation
|
|
106
|
-
* @see https://maz-ui.com/
|
|
106
|
+
* @see https://maz-ui.com/ecosystem/translations
|
|
107
107
|
*/
|
|
108
108
|
translations: {
|
|
109
109
|
locale: 'fr',
|
|
@@ -143,11 +143,11 @@ function handleClick() {
|
|
|
143
143
|
|
|
144
144
|
## Theming
|
|
145
145
|
|
|
146
|
-
More information in the [theme documentation](/
|
|
146
|
+
More information in the [theme documentation](/ecosystem/themes).
|
|
147
147
|
|
|
148
148
|
## Translations
|
|
149
149
|
|
|
150
|
-
More information in the [translations documentation](/
|
|
150
|
+
More information in the [translations documentation](/ecosystem/translations).
|
|
151
151
|
|
|
152
152
|
## Plugins
|
|
153
153
|
|
package/docs/src/index.md
CHANGED
|
@@ -219,7 +219,7 @@ description: Build amazing interfaces with Maz-UI - standalone components & tool
|
|
|
219
219
|
This library is written in Typescript, so all types and declarations are directly available.
|
|
220
220
|
</p>
|
|
221
221
|
</MazCardSpotlight>
|
|
222
|
-
<a href="/
|
|
222
|
+
<a href="/ecosystem/themes" class="maz:flex">
|
|
223
223
|
<MazCardSpotlight class="maz:w-full" content-class="maz:flex maz:flex-col maz:gap-2 maz:items-start">
|
|
224
224
|
<span class="maz:py-1 maz:px-2 maz:bg-surface-600 maz:dark:bg-surface-400 maz:rounded-md maz:text-2xl">
|
|
225
225
|
💄
|
|
@@ -229,7 +229,7 @@ description: Build amazing interfaces with Maz-UI - standalone components & tool
|
|
|
229
229
|
Created with TailwindCSS | Optimized CSS file sizes | Complies with all CSS best practices | Use your theme easily.
|
|
230
230
|
</p>
|
|
231
231
|
<div class="maz:flex-1"></div>
|
|
232
|
-
<MazBtn color="surface" outlined size="sm" block href="/
|
|
232
|
+
<MazBtn color="surface" outlined size="sm" block href="/ecosystem/themes">Discover</MazBtn>
|
|
233
233
|
</MazCardSpotlight>
|
|
234
234
|
</a>
|
|
235
235
|
<a href="/guide/dark-mode" class="maz:flex">
|
|
@@ -265,7 +265,7 @@ description: Build amazing interfaces with Maz-UI - standalone components & tool
|
|
|
265
265
|
<h2 class="maz:text-2xl maz:font-bold maz:mb-8">Ecosystem</h2>
|
|
266
266
|
|
|
267
267
|
<div class="maz:grid maz:grid-cols-1 maz:tab-m:grid-cols-2 maz:gap-4">
|
|
268
|
-
<a href="/
|
|
268
|
+
<a href="/ecosystem/nuxt" class="maz:flex">
|
|
269
269
|
<MazCardSpotlight class="maz:w-full" color="accent" content-class="maz:flex maz:flex-col maz:gap-2 maz:items-start">
|
|
270
270
|
<div class="maz:flex maz:items-start maz:gap-2 maz:justify-between maz:w-full">
|
|
271
271
|
<span class="maz:py-1 maz:px-2 maz:bg-surface-600 maz:dark:bg-surface-400 maz:rounded-md maz:text-2xl">
|
|
@@ -278,10 +278,10 @@ description: Build amazing interfaces with Maz-UI - standalone components & tool
|
|
|
278
278
|
Official Nuxt module with auto-imports, optimized builds, and seamless SSR support. Zero configuration required.
|
|
279
279
|
</p>
|
|
280
280
|
<div class="maz:flex-1"></div>
|
|
281
|
-
<MazBtn color="surface" outlined size="sm" block href="/
|
|
281
|
+
<MazBtn color="surface" outlined size="sm" block href="/ecosystem/nuxt">Discover</MazBtn>
|
|
282
282
|
</MazCardSpotlight>
|
|
283
283
|
</a>
|
|
284
|
-
<a href="/
|
|
284
|
+
<a href="/ecosystem/icons/" class="maz:flex">
|
|
285
285
|
<MazCardSpotlight class="maz:w-full" color="accent" content-class="maz:flex maz:flex-col maz:gap-2 maz:items-start">
|
|
286
286
|
<div class="maz:flex maz:items-start maz:gap-2 maz:justify-between maz:w-full">
|
|
287
287
|
<span class="maz:py-1 maz:px-2 maz:bg-surface-600 maz:dark:bg-surface-400 maz:rounded-md maz:text-2xl">
|
|
@@ -294,10 +294,10 @@ description: Build amazing interfaces with Maz-UI - standalone components & tool
|
|
|
294
294
|
860+ beautiful SVG icons ready for Vue. Multiple usage patterns: components, direct SVG files, raw SVG strings or auto-import.
|
|
295
295
|
</p>
|
|
296
296
|
<div class="maz:flex-1"></div>
|
|
297
|
-
<MazBtn color="surface" outlined size="sm" block href="/
|
|
297
|
+
<MazBtn color="surface" outlined size="sm" block href="/ecosystem/icons/">Discover</MazBtn>
|
|
298
298
|
</MazCardSpotlight>
|
|
299
299
|
</a>
|
|
300
|
-
<a href="/
|
|
300
|
+
<a href="/ecosystem/translations" class="maz:flex">
|
|
301
301
|
<MazCardSpotlight class="maz:w-full" color="accent" content-class="maz:flex maz:flex-col maz:gap-2 maz:items-start">
|
|
302
302
|
<div class="maz:flex maz:items-start maz:gap-2 maz:justify-between maz:w-full">
|
|
303
303
|
<span class="maz:py-1 maz:px-2 maz:bg-surface-600 maz:dark:bg-surface-400 maz:rounded-md maz:text-2xl">
|
|
@@ -310,10 +310,10 @@ description: Build amazing interfaces with Maz-UI - standalone components & tool
|
|
|
310
310
|
Simple internationalization system for Maz-UI components. Translate your interface into any language with ease.
|
|
311
311
|
</p>
|
|
312
312
|
<div class="maz:flex-1"></div>
|
|
313
|
-
<MazBtn color="surface" outlined size="sm" block href="/
|
|
313
|
+
<MazBtn color="surface" outlined size="sm" block href="/ecosystem/translations">Discover</MazBtn>
|
|
314
314
|
</MazCardSpotlight>
|
|
315
315
|
</a>
|
|
316
|
-
<a href="/
|
|
316
|
+
<a href="/ecosystem/themes" class="maz:flex">
|
|
317
317
|
<MazCardSpotlight class="maz:w-full" color="accent" content-class="maz:flex maz:flex-col maz:gap-2 maz:items-start">
|
|
318
318
|
<div class="maz:flex maz:items-start maz:gap-2 maz:justify-between maz:w-full">
|
|
319
319
|
<span class="maz:py-1 maz:px-2 maz:bg-surface-600 maz:dark:bg-surface-400 maz:rounded-md maz:text-2xl">
|
|
@@ -326,10 +326,10 @@ description: Build amazing interfaces with Maz-UI - standalone components & tool
|
|
|
326
326
|
Pre-built theme collections and design tokens for rapid UI development. Ready-to-use color schemes and styles.
|
|
327
327
|
</p>
|
|
328
328
|
<div class="maz:flex-1"></div>
|
|
329
|
-
<MazBtn color="surface" outlined size="sm" block href="/
|
|
329
|
+
<MazBtn color="surface" outlined size="sm" block href="/ecosystem/themes">Discover</MazBtn>
|
|
330
330
|
</MazCardSpotlight>
|
|
331
331
|
</a>
|
|
332
|
-
<a href="/
|
|
332
|
+
<a href="/ecosystem/mcp" class="maz:flex">
|
|
333
333
|
<MazCardSpotlight class="maz:w-full" color="accent" content-class="maz:flex maz:flex-col maz:gap-2 maz:items-start">
|
|
334
334
|
<div class="maz:flex maz:items-start maz:gap-2 maz:justify-between maz:w-full">
|
|
335
335
|
<span class="maz:py-1 maz:px-2 maz:bg-surface-600 maz:dark:bg-surface-400 maz:rounded-md maz:text-2xl">
|
|
@@ -342,7 +342,7 @@ description: Build amazing interfaces with Maz-UI - standalone components & tool
|
|
|
342
342
|
Provides a Model Context Protocol (MCP) server that exposes Maz-UI documentation to AI agents. This server enables AI agents to generate code and assist developers in using Maz-UI.
|
|
343
343
|
</p>
|
|
344
344
|
<div class="maz:flex-1"></div>
|
|
345
|
-
<MazBtn color="surface" outlined size="sm" block href="/
|
|
345
|
+
<MazBtn color="surface" outlined size="sm" block href="/ecosystem/mcp">Discover</MazBtn>
|
|
346
346
|
</MazCardSpotlight>
|
|
347
347
|
</a>
|
|
348
348
|
</div>
|
package/docs/src/plugins/aos.md
CHANGED
|
@@ -231,7 +231,7 @@ You can choose one of these timing function to animate elements nicely:
|
|
|
231
231
|
## Nuxt
|
|
232
232
|
|
|
233
233
|
::: tip
|
|
234
|
-
For **NuxtJS v3** and higher, use the dedicated Nuxt module to take advantage of auto-imports of components, plugins, composables and css files: [Nuxt Module Documentation](./../
|
|
234
|
+
For **NuxtJS v3** and higher, use the dedicated Nuxt module to take advantage of auto-imports of components, plugins, composables and css files: [Nuxt Module Documentation](./../ecosystem/nuxt.md)
|
|
235
235
|
:::
|
|
236
236
|
|
|
237
237
|
Should be executed on client side
|
package/docs/src/plugins/wait.md
CHANGED
|
@@ -46,7 +46,7 @@ export default defineNuxtConfig({
|
|
|
46
46
|
|
|
47
47
|
<br />
|
|
48
48
|
|
|
49
|
-
<div v-if="submitted" style="padding: 20px; background-color: var(--maz-surface-300); border-radius: 10px; margin-top: 1rem;">
|
|
49
|
+
<div v-if="submitted" style="padding: 20px; background-color: var(--maz-color-surface-300); border-radius: 10px; margin-top: 1rem;">
|
|
50
50
|
Data Submitted
|
|
51
51
|
</div>
|
|
52
52
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@maz-ui/mcp",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "5.0.0-beta.
|
|
4
|
+
"version": "5.0.0-beta.24",
|
|
5
5
|
"description": "Maz-UI ModelContextProtocol Client",
|
|
6
6
|
"author": "Louis Mazel <me@loicmazuel.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -42,17 +42,18 @@
|
|
|
42
42
|
],
|
|
43
43
|
"dependencies": {
|
|
44
44
|
"@modelcontextprotocol/sdk": "^1.29.0",
|
|
45
|
-
"@maz-ui/node": "5.0.0-beta.
|
|
46
|
-
"@maz-ui/utils": "5.0.0-beta.
|
|
45
|
+
"@maz-ui/node": "5.0.0-beta.24",
|
|
46
|
+
"@maz-ui/utils": "5.0.0-beta.24"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@modelcontextprotocol/inspector": "^0.21.2",
|
|
50
50
|
"@swc/core": "1.15.33",
|
|
51
51
|
"prettier": "^3.8.3",
|
|
52
52
|
"ts-node-maintained": "^10.9.5",
|
|
53
|
-
"tsx": "^4.
|
|
53
|
+
"tsx": "^4.22.3",
|
|
54
54
|
"unbuild": "^3.6.1",
|
|
55
|
-
"@maz-ui/eslint-config": "5.0.0-beta.
|
|
55
|
+
"@maz-ui/eslint-config": "5.0.0-beta.24",
|
|
56
|
+
"maz-ui": "5.0.0-beta.24"
|
|
56
57
|
},
|
|
57
58
|
"lint-staged": {
|
|
58
59
|
"*.{js,ts,mjs,mts,cjs,md,yml,json}": "cross-env NODE_ENV=production eslint --fix"
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: checkAvailability
|
|
3
|
-
description: Utility method to execute a call back when the awaited data is available with timeout and check interval
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
# {{ $frontmatter.title }}
|
|
7
|
-
|
|
8
|
-
{{ $frontmatter.description }}
|
|
9
|
-
|
|
10
|
-
::: warning
|
|
11
|
-
|
|
12
|
-
TO DO
|
|
13
|
-
|
|
14
|
-
:::
|