@maz-ui/mcp 5.0.0-beta.1 → 5.0.0-beta.11
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/dist/mcp.mjs +1 -1
- 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-drawer.doc.md +1 -1
- 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-phone-number.doc.md +42 -38
- 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 +26 -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 +11 -0
- package/docs/generated-docs/maz-sidebar.doc.md +33 -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-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/v5.md +1 -3
- package/docs/src/components/maz-code-highlight.md +233 -0
- package/docs/src/components/maz-container.md +2 -2
- package/docs/src/components/maz-input-phone-number.md +106 -103
- package/docs/src/components/maz-sidebar.md +621 -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 +7 -14
- package/docs/src/directives/lazy-img.md +4 -4
- package/docs/src/ecosystem/eslint-config.md +95 -1
- package/docs/src/guide/getting-started.md +13 -11
- package/docs/src/guide/maz-ui-provider.md +6 -3
- package/docs/src/guide/migration-v4.md +7 -3
- package/docs/src/guide/migration-v5.md +67 -12
- package/docs/src/guide/nuxt.md +53 -46
- package/docs/src/guide/tailwind.md +4 -0
- package/docs/src/guide/themes.md +127 -69
- package/docs/src/helpers/capitalize.md +2 -3
- package/docs/src/helpers/currency.md +2 -2
- package/docs/src/helpers/date.md +2 -2
- package/docs/src/helpers/number.md +2 -2
- package/docs/src/plugins/wait.md +1 -1
- package/package.json +4 -4
package/dist/mcp.mjs
CHANGED
|
@@ -7,7 +7,7 @@ import { existsSync, readFileSync, readdirSync } from 'node:fs';
|
|
|
7
7
|
import { resolve, join, dirname } from 'node:path';
|
|
8
8
|
import { fileURLToPath } from 'node:url';
|
|
9
9
|
|
|
10
|
-
const version = "5.0.0-beta.
|
|
10
|
+
const version = "5.0.0-beta.9";
|
|
11
11
|
|
|
12
12
|
class MetadataExtractor {
|
|
13
13
|
extract(name, type, content, manualTags = []) {
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
| Name | Description | Type | Required | Default | Possible values |
|
|
4
4
|
| ---------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------- | -------- | -------------------------------------------- | ------------------------------------ |
|
|
5
5
|
| **percentage** | The percentage value of the progress bar | `number` | Yes | `undefined` | - |
|
|
6
|
-
| **size** | The size of the progress bar | `
|
|
6
|
+
| **size** | The size of the progress bar | `MazSizeUnit` | No | `10em' (equal 80px for a font-size of 16px)` | - |
|
|
7
7
|
| **duration** | Duration of the animation in milliseconds | `number` | No | `1000` | - |
|
|
8
8
|
| **delay** | Delay before the animation starts in milliseconds | `number` | No | `100` | - |
|
|
9
9
|
| **color** | The color of the progress bar | `MazColor` | No | `undefined` | - |
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
## Props
|
|
2
|
+
|
|
3
|
+
| Name | Description | Type | Required | Default |
|
|
4
|
+
| ---------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------- | -------- | ----------- |
|
|
5
|
+
| **code** | Source code to highlight | `string` | No | `undefined` |
|
|
6
|
+
| **language** | Language identifier for syntax highlighting (e.g. 'vue', 'ts', 'bash') | `string` | No | `undefined` |
|
|
7
|
+
| **theme** | Override the shiki theme name. Defaults to github-light/github-dark based on current color mode | `string` | No | `undefined` |
|
|
8
|
+
| **rounded** | Apply rounded corners on the highlighted code block. | `boolean` | No | `true` |
|
|
9
|
+
| **copyable** | Show the copy-to-clipboard button on hover. | `boolean` | No | `true` |
|
|
10
|
+
| **copy-value** | Value copied to the clipboard. Falls back to the resolved code when omitted. Useful when the displayed code differs from what should be copied (e.g. terminal prompt prefix). | `string` | No | `undefined` |
|
|
11
|
+
| **translations** | Custom translations for the component. Override either key independently. | `Partial<MazUiTranslationsNestedSchema['codeHighlight']>` | No | `undefined` |
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
| --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------- | -------- | ----------- | ------------------------------- |
|
|
5
5
|
| **title** | The title of the drawer | `string` | No | `undefined` | - |
|
|
6
6
|
| **variant** | The edge from which the drawer slides in. `start` (= left in LTR, right in RTL) and `end` (= right in LTR, left in RTL) follow the document direction; `top` and `bottom` are physical. | `"start" \| "end" \| "top" \| "bottom"` | No | `'end'` | `start', 'end', 'top', 'bottom` |
|
|
7
|
-
| **size** | The size of the drawer | `
|
|
7
|
+
| **size** | The size of the drawer | `MazSizeUnit` | No | `'30rem'` | - |
|
|
8
8
|
| **backdrop-class** | The class of the backdrop | `string` | No | `undefined` | - |
|
|
9
9
|
| **hide-close-button** | Disable the close button | `boolean` | No | `undefined` | - |
|
|
10
10
|
| **no-close** | | `any` | No | `false` | - |
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
## Props
|
|
2
2
|
|
|
3
|
-
| Name | Description | Type
|
|
4
|
-
| --------------------- | ----------------------------------- |
|
|
5
|
-
| **color** | The color of the spinner | `MazColor`
|
|
6
|
-
| **size** | The size of the spinner | `
|
|
7
|
-
| **teleport-selector** | The selector to teleport the loader | `string`
|
|
3
|
+
| Name | Description | Type | Required |
|
|
4
|
+
| --------------------- | ----------------------------------- | ------------- | -------- |
|
|
5
|
+
| **color** | The color of the spinner | `MazColor` | No |
|
|
6
|
+
| **size** | The size of the spinner | `MazSizeUnit` | No |
|
|
7
|
+
| **teleport-selector** | The selector to teleport the loader | `string` | No |
|
|
8
8
|
|
|
9
9
|
## Slots
|
|
10
10
|
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
## Props
|
|
2
2
|
|
|
3
|
-
| Name | Description | Type | Required | Default
|
|
4
|
-
| -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------- | -------- |
|
|
5
|
-
| **images** | Array of string or object: `['https://via.placeholder.com/500', 'https://via.placeholder.com/600']` or `[{ slug: 'https://via.placeholder.com/500', alt: 'image descripton' }, { slug: 'https://via.placeholder.com/600', alt: 'image descripton' }]` | `MazGalleryImage[]` | No | `undefined`
|
|
6
|
-
| **displayed-count** | Images count shown (max: 5) | `number` | No | `5`
|
|
7
|
-
| **remaining** | Remove transparent layer with the remain count (ex: +2) | `boolean` | No | `true`
|
|
8
|
-
| **height** | Height of gallery - set to `false` to remove default height | `number \| string \| false` | No | `150`
|
|
9
|
-
| **width** | Width of gallery - set to `false` to remove default width | `number \| string \| false` | No | `100%`
|
|
10
|
-
| **radius** | Disable the border radius of the gallery | `boolean` | No | `false`
|
|
11
|
-
| **zoom** | Disable full size display when clicking on image | `boolean` | No | `false`
|
|
12
|
-
| **has-empty-layer** | Layer with photography icon when no images is provided | `boolean` | No | `true`
|
|
13
|
-
| **lazy** | Lazy load image - if false, images are directly loaded | `boolean` | No | `true`
|
|
14
|
-
| **blur** | Disable blur effect on image hover | `boolean` | No | `true`
|
|
15
|
-
| **scale** | Disable scale animation effect on image hover | `boolean` | No | `true`
|
|
16
|
-
| **separator-color** | Choose color of borders between images - Should be a CSS color or CSS variable - Ex: `#000`
|
|
17
|
-
| **background-color** | Choose background color of the gallery - Should be a CSS color or CSS variable - Ex: `#000`
|
|
3
|
+
| Name | Description | Type | Required | Default |
|
|
4
|
+
| -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------- | -------- | ------------- |
|
|
5
|
+
| **images** | Array of string or object: `['https://via.placeholder.com/500', 'https://via.placeholder.com/600']` or `[{ slug: 'https://via.placeholder.com/500', alt: 'image descripton' }, { slug: 'https://via.placeholder.com/600', alt: 'image descripton' }]` | `MazGalleryImage[]` | No | `undefined` |
|
|
6
|
+
| **displayed-count** | Images count shown (max: 5) | `number` | No | `5` |
|
|
7
|
+
| **remaining** | Remove transparent layer with the remain count (ex: +2) | `boolean` | No | `true` |
|
|
8
|
+
| **height** | Height of gallery - set to `false` to remove default height | `number \| string \| false` | No | `150` |
|
|
9
|
+
| **width** | Width of gallery - set to `false` to remove default width | `number \| string \| false` | No | `100%` |
|
|
10
|
+
| **radius** | Disable the border radius of the gallery | `boolean` | No | `false` |
|
|
11
|
+
| **zoom** | Disable full size display when clicking on image | `boolean` | No | `false` |
|
|
12
|
+
| **has-empty-layer** | Layer with photography icon when no images is provided | `boolean` | No | `true` |
|
|
13
|
+
| **lazy** | Lazy load image - if false, images are directly loaded | `boolean` | No | `true` |
|
|
14
|
+
| **blur** | Disable blur effect on image hover | `boolean` | No | `true` |
|
|
15
|
+
| **scale** | Disable scale animation effect on image hover | `boolean` | No | `true` |
|
|
16
|
+
| **separator-color** | Choose color of borders between images - Should be a CSS color or CSS variable - Ex: `#000` | `string` | No | `transparent` |
|
|
17
|
+
| **background-color** | Choose background color of the gallery - Should be a CSS color or CSS variable - Ex: `#000` | `string` | No | `undefined` |
|
|
@@ -1,43 +1,47 @@
|
|
|
1
1
|
## Props
|
|
2
2
|
|
|
3
|
-
| Name | Description
|
|
4
|
-
| ----------------------------- |
|
|
5
|
-
| **style** | Style attribut of the component root element
|
|
6
|
-
| **class** | Class attribut of the component root element
|
|
7
|
-
| **model-value** | `v-model` <br/>The current value of the input field in international format (e.g. +33612345678)<br/>**Example:** `"+33612345678"`
|
|
8
|
-
| **country-code** | `v-model:country-code` <br/>The selected country code (e.g. "FR")<br/>**Example:** `"FR"`
|
|
9
|
-
| **id** | Unique identifier for the component<br/>**Example:** `"phone-input-1"`
|
|
10
|
-
| **placeholder** | Text displayed when the input is empty<br/>**Example:** `"Enter your phone number"`
|
|
11
|
-
| **label**
|
|
12
|
-
| **
|
|
13
|
-
| **
|
|
14
|
-
| **
|
|
15
|
-
| **
|
|
16
|
-
| **
|
|
17
|
-
| **
|
|
18
|
-
| **
|
|
19
|
-
| **
|
|
20
|
-
| **
|
|
21
|
-
| **
|
|
22
|
-
| **
|
|
23
|
-
| **
|
|
24
|
-
| **search
|
|
25
|
-
| **
|
|
26
|
-
| **
|
|
27
|
-
| **
|
|
28
|
-
| **
|
|
29
|
-
| **
|
|
30
|
-
| **
|
|
31
|
-
| **
|
|
32
|
-
| **
|
|
33
|
-
| **validation-
|
|
34
|
-
| **success**
|
|
35
|
-
| **
|
|
36
|
-
| **
|
|
37
|
-
| **
|
|
38
|
-
| **
|
|
39
|
-
| **
|
|
40
|
-
| **
|
|
3
|
+
| Name | Description | Type | Required | Default | Possible values |
|
|
4
|
+
| ----------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------ | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------- |
|
|
5
|
+
| **style** | Style attribut of the component root element | `HTMLAttributes['style']` | No | `undefined` | - |
|
|
6
|
+
| **class** | Class attribut of the component root element | `HTMLAttributes['class']` | No | `undefined` | - |
|
|
7
|
+
| **model-value** | `v-model` <br/>The current value of the input field in international format (e.g. +33612345678)<br/>**Example:** `"+33612345678"` | `string \| undefined \| null` | No | `undefined` | - |
|
|
8
|
+
| **country-code** | `v-model:country-code` <br/>The selected country code (e.g. "FR")<br/>**Example:** `"FR"` | `CountryCode \| undefined \| null` | No | `undefined` | - |
|
|
9
|
+
| **id** | Unique identifier for the component<br/>**Example:** `"phone-input-1"` | `string` | No | `undefined` | - |
|
|
10
|
+
| **placeholder** | Text displayed when the input is empty<br/>**Example:** `"Enter your phone number"` | `string` | No | `undefined` | - |
|
|
11
|
+
| **top-label** | Static label displayed above the input field. Unlike the floating label, this remains fixed<br/>**Example:** `"User Information"` | `string` | No | `undefined` | - |
|
|
12
|
+
| **label** | Label displayed above the input<br/>**Example:** `"Phone Number"` | `string` | No | `undefined` | - |
|
|
13
|
+
| **preferred-countries** | List of country codes to place first in the select list<br/>**Example:** `["FR", "BE", "GE"]` | `CountryCode[]` | No | `undefined` | - |
|
|
14
|
+
| **ignored-countries** | List of country codes to be removed from the select list<br/>**Example:** `["FR", "BE", "GE"]` | `CountryCode[]` | No | `undefined` | - |
|
|
15
|
+
| **only-countries** | List of country codes to only have the countries selected in the select list<br/>**Example:** `["FR", "BE", "GE"]` | `CountryCode[]` | No | `undefined` | - |
|
|
16
|
+
| **translations** | Locale strings of the component The default values are the translations of the MazUiTranslations plugin | `Partial<MazUiTranslationsNestedSchema['inputPhoneNumber']>` | No | `{ countrySelect: { error: 'Choose country', placeholder: 'Country code', searchPlaceholder: 'Search the country', }, phoneInput: { placeholder: 'Phone number', example: 'Example: {example}', }, }` | - |
|
|
17
|
+
| **list-position** | Position where the list of countries will be opened | `MazPopoverProps['position']` | No | `bottom left` | `top left, top right, bottom left, bottom right` |
|
|
18
|
+
| **color** | Component color applied | `MazColor` | No | `primary` | `primary, secondary, accent, info, success, warning, destructive, contrast` |
|
|
19
|
+
| **size** | Component size applied | `MazSize` | No | `md` | `xs, sm, md, lg, xl, mini` |
|
|
20
|
+
| **hide-flags** | Remove flags in country list | `boolean` | No | `false` | - |
|
|
21
|
+
| **disabled** | Make the input disabled | `boolean` | No | `false` | - |
|
|
22
|
+
| **required** | Make the input required | `boolean` | No | `false` | - |
|
|
23
|
+
| **example** | Show the phone number example | `boolean` | No | `true` | - |
|
|
24
|
+
| **search** | Disable search input in country list | `boolean` | No | `true` | - |
|
|
25
|
+
| **search-threshold** | Threshold of the search input in country list where 1 is a perfect match and 0 is a match with any character | `number` | No | `0.75` | - |
|
|
26
|
+
| **use-browser-locale** | If true, the browser locale will be used | `boolean` | No | `true` | - |
|
|
27
|
+
| **fetch-country** | The component will make a request (https://ipwho.is) to get the location of the user and use it to set the default country code | `boolean` | No | `false` | - |
|
|
28
|
+
| **hide-country-select** | Hide the country selector | `boolean` | No | `false` | - |
|
|
29
|
+
| **show-code-in-list** | Show country calling code in the country list | `boolean` | No | `false` | - |
|
|
30
|
+
| **custom-countries-list** | Replace country names | `Record<CountryCode, string>` | No | `undefined` | - |
|
|
31
|
+
| **auto-format** | Disabled auto-format when phone is valid | `"blur" \| "typing" \| "disabled" \| false` | No | `blur` | - |
|
|
32
|
+
| **country-locale** | Locale of country list<br/>**Example:** `"fr-FR"` | `string` | No | `undefined` | - |
|
|
33
|
+
| **validation-error** | Disable validation error UI | `boolean` | No | `true` | - |
|
|
34
|
+
| **validation-success** | Disable validation success UI | `boolean` | No | `true` | - |
|
|
35
|
+
| **success** | Add success UI | `boolean` | No | `false` | - |
|
|
36
|
+
| **error** | Add error UI | `boolean` | No | `false` | - |
|
|
37
|
+
| **warning** | Add warning UI | `boolean` | No | `false` | - |
|
|
38
|
+
| **display-country-name** | Will replace the calling code by the country name in the country selector | `boolean` | No | `false` | - |
|
|
39
|
+
| **block** | The input will be displayed in full width | `boolean` | No | `false` | - |
|
|
40
|
+
| **orientation** | Orientation of the inputs in the component | `'row' \| 'col' \| 'responsive'` | No | `responsive` | `row, col, responsive` |
|
|
41
|
+
| **country-select-attributes** | Meta attributes of the country input | `Record<string, unknown>` | No | `{ autocomplete: 'off', name: 'country' }` | - |
|
|
42
|
+
| **phone-input-attributes** | Meta attributes of the phone number input | `Record<string, unknown>` | No | `{ autocomplete: 'tel', name: 'phone', inputmode: 'tel' }` | - |
|
|
43
|
+
| **assistive-text** | Helper text displayed below the input to provide additional context or validation feedback<br/>**Example:** `"Must contain at least 8 characters"` | `string` | No | `undefined` | - |
|
|
44
|
+
| **hint** | Alternative text that replaces the label when provided. Useful for contextual hints<br/>**Example:** `"This phone number is not valid"` | `string` | No | `undefined` | - |
|
|
41
45
|
|
|
42
46
|
## Events
|
|
43
47
|
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
## Props
|
|
2
|
+
|
|
3
|
+
| Name | Description | Type | Required |
|
|
4
|
+
| --------- | ---------------------------- | -------- | -------- |
|
|
5
|
+
| **label** | Optional label for the group | `string` | No |
|
|
6
|
+
|
|
7
|
+
## Slots
|
|
8
|
+
|
|
9
|
+
| Name | Description | Bindings |
|
|
10
|
+
| ------- | ----------- | -------- |
|
|
11
|
+
| default | | |
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
## Props
|
|
2
|
+
|
|
3
|
+
| Name | Description | Type | Required |
|
|
4
|
+
| ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------- | -------- |
|
|
5
|
+
| **to** | Route for router-link navigation | `string \| Record` | No |
|
|
6
|
+
| **href** | URL for anchor navigation | `string` | No |
|
|
7
|
+
| **icon** | Icon to display before the label. Accepts a bare icon value (Vue component, raw SVG string, URL) or a full `MazIconProps` object for fine-grained control (size, title, fallback, …). | `MazIconLike` | No |
|
|
8
|
+
| **label** | Label text | `string` | No |
|
|
9
|
+
| **badge** | Badge content. Pass a `string`/`number` for a simple primary badge, or a full `MazBadgeProps` object (with optional `text`) to customise color, size, outlined, … | `MazSidebarMenuButtonBadge` | No |
|
|
10
|
+
| **tooltip** | Tooltip text. When provided, shows a tooltip on hover via the `v-tooltip` directive. | `string` | No |
|
|
11
|
+
| **active** | Whether the item is active (highlights with `aria-current="page"`) | `boolean` | No |
|
|
12
|
+
| **disabled** | Whether the item is disabled | `boolean` | No |
|
|
13
|
+
| **size** | Size of the button | `"sm" \| "md" \| "lg"` | No |
|
|
14
|
+
|
|
15
|
+
## Events
|
|
16
|
+
|
|
17
|
+
| Event name | Properties | Description |
|
|
18
|
+
| ---------- | ---------- | ----------- |
|
|
19
|
+
| click | |
|
|
20
|
+
|
|
21
|
+
## Slots
|
|
22
|
+
|
|
23
|
+
| Name | Description | Bindings |
|
|
24
|
+
| ------- | ----------- | -------- |
|
|
25
|
+
| icon | | |
|
|
26
|
+
| default | | |
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
## Props
|
|
2
|
+
|
|
3
|
+
| Name | Description | Type | Required | Default |
|
|
4
|
+
| ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------- | -------- | ----------- |
|
|
5
|
+
| **label** | Label for the sub-menu trigger button | `string` | No | `undefined` |
|
|
6
|
+
| **icon** | Icon to display before the label. Accepts a bare icon value (Vue component, raw SVG string, URL) or a full `MazIconProps` object for fine-grained control. | `MazIconLike` | No | `undefined` |
|
|
7
|
+
| **default-open** | Whether the sub-menu is open by default | `boolean` | No | `false` |
|
|
8
|
+
|
|
9
|
+
## Slots
|
|
10
|
+
|
|
11
|
+
| Name | Description | Bindings |
|
|
12
|
+
| ------- | ----------- | -------- |
|
|
13
|
+
| icon | | |
|
|
14
|
+
| label | | |
|
|
15
|
+
| chevron | | |
|
|
16
|
+
| default | | |
|
|
File without changes
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
## Props
|
|
2
|
+
|
|
3
|
+
| Name | Description | Type | Required |
|
|
4
|
+
| --------- | -------------------- | -------- | -------- |
|
|
5
|
+
| **class** | Additional CSS class | `string` | No |
|
|
6
|
+
|
|
7
|
+
## Slots
|
|
8
|
+
|
|
9
|
+
| Name | Description | Bindings |
|
|
10
|
+
| ------- | ----------- | -------- |
|
|
11
|
+
| default | | |
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
## Props
|
|
2
|
+
|
|
3
|
+
| Name | Description | Type | Required | Default |
|
|
4
|
+
| --------------- | ------------------------------------------------------------------------------------------------------------------------- | --------------------------------- | -------- | ------------- |
|
|
5
|
+
| **id** | Unique identifier for the sidebar (auto-generated if not provided) | `string` | No | `undefined` |
|
|
6
|
+
| **open** | Whether the sidebar is open | `boolean` | No | `true` |
|
|
7
|
+
| **side** | Side of the sidebar | `"start" \| "end"` | No | `'start'` |
|
|
8
|
+
| **collapsible** | How the sidebar collapses - offcanvas: completely hidden - icon: only icons visible - none: always fully visible | `"offcanvas" \| "icon" \| "none"` | No | `'offcanvas'` |
|
|
9
|
+
| **mode** | How the sidebar affects layout - push: sidebar is in document flow - overlay: sidebar floats over content with a backdrop | `"push" \| "overlay"` | No | `'push'` |
|
|
10
|
+
| **width** | Width of the expanded sidebar | `string` | No | `'16rem'` |
|
|
11
|
+
| **icon-width** | Width of the collapsed sidebar in icon mode | `string` | No | `'3rem'` |
|
|
12
|
+
|
|
13
|
+
## Events
|
|
14
|
+
|
|
15
|
+
| Event name | Properties | Description |
|
|
16
|
+
| ----------- | ---------- | ------------------------------- |
|
|
17
|
+
| update:open | | Emitted when open state changes |
|
|
18
|
+
|
|
19
|
+
## Slots
|
|
20
|
+
|
|
21
|
+
| Name | Description | Bindings |
|
|
22
|
+
| ------- | ----------- | -------- |
|
|
23
|
+
| default | | |
|
|
24
|
+
|
|
25
|
+
## Expose
|
|
26
|
+
|
|
27
|
+
### toggle
|
|
28
|
+
|
|
29
|
+
>
|
|
30
|
+
|
|
31
|
+
### setOpen
|
|
32
|
+
|
|
33
|
+
>
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
| **min** | min value of sliders | `number` | No |
|
|
8
8
|
| **max** | max value of sliders | `number` | No |
|
|
9
9
|
| **step** | step value for slider increments | `number` | No |
|
|
10
|
-
| **size** | height size of slider bar | `
|
|
10
|
+
| **size** | height size of slider bar | `MazSizeUnit` | No |
|
|
11
11
|
| **divider** | remove div in different colors | `boolean` | No |
|
|
12
12
|
| **log** | become a logarithmic slider (exponential) | `boolean` | No |
|
|
13
13
|
| **color** | main slider color | `MazColor` | No |
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
## Props
|
|
2
2
|
|
|
3
|
-
| Name | Description | Type
|
|
4
|
-
| --------- | ------------------------ |
|
|
5
|
-
| **size** | The size of the spinner | `
|
|
6
|
-
| **color** | The color of the spinner | `MazColor`
|
|
3
|
+
| Name | Description | Type | Required | Default |
|
|
4
|
+
| --------- | ------------------------ | ------------- | -------- | ------- |
|
|
5
|
+
| **size** | The size of the spinner | `MazSizeUnit` | No | `2em` |
|
|
6
|
+
| **color** | The color of the spinner | `MazColor` | No | `theme` |
|
|
@@ -1,29 +1,30 @@
|
|
|
1
1
|
## Props
|
|
2
2
|
|
|
3
|
-
| Name | Description
|
|
4
|
-
| ------------------ |
|
|
5
|
-
| **style** | Style attribut of the component root element
|
|
6
|
-
| **class** | Class attribut of the component root element
|
|
7
|
-
| **model-value** | `v-model` <br/>
|
|
8
|
-
| **id** | The id of the textarea
|
|
9
|
-
| **name** | The name of the textarea
|
|
10
|
-
| **label** | The label of the textarea
|
|
11
|
-
| **placeholder** | The placeholder of the textarea
|
|
12
|
-
| **required** | If the textarea is required
|
|
13
|
-
| **disabled** | If the textarea is disabled
|
|
14
|
-
| **readonly** | If the textarea is readonly
|
|
15
|
-
| **error** | If the textarea has an error
|
|
16
|
-
| **success** | If the textarea has a success
|
|
17
|
-
| **warning** | If the textarea has a warning
|
|
18
|
-
| **hint** | The hint of the textarea
|
|
19
|
-
| **color** | The color of the textarea
|
|
20
|
-
| **rounded-size** | Size radius of the component's border
|
|
21
|
-
| **padding** | If the textarea has a padding
|
|
22
|
-
| **transparent** | If the textarea has a transparent background
|
|
23
|
-
| **border** | If the textarea has no border
|
|
24
|
-
| **autogrow** | If the textarea should autogrow based on its content
|
|
25
|
-
| **append-justify** | The alignment of the append slot
|
|
26
|
-
| **top-label** | Static label displayed above the textarea. Unlike the floating label, this remains fixed
|
|
3
|
+
| Name | Description | Type | Required | Default | Possible values |
|
|
4
|
+
| ------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------- | -------- | --------------- | ------------------------------------------------------------------------------------- |
|
|
5
|
+
| **style** | Style attribut of the component root element | `Native type` | No | `undefined` | - |
|
|
6
|
+
| **class** | Class attribut of the component root element | `Native type` | No | `undefined` | - |
|
|
7
|
+
| **model-value** | `v-model` <br/> | `T` | No | `undefined` | - |
|
|
8
|
+
| **id** | The id of the textarea | `string` | No | `undefined` | - |
|
|
9
|
+
| **name** | The name of the textarea | `string` | No | `'MazTextarea'` | - |
|
|
10
|
+
| **label** | The label of the textarea | `string` | No | `undefined` | - |
|
|
11
|
+
| **placeholder** | The placeholder of the textarea | `string` | No | `undefined` | - |
|
|
12
|
+
| **required** | If the textarea is required | `boolean` | No | `false` | - |
|
|
13
|
+
| **disabled** | If the textarea is disabled | `boolean` | No | `false` | - |
|
|
14
|
+
| **readonly** | If the textarea is readonly | `boolean` | No | `false` | - |
|
|
15
|
+
| **error** | If the textarea has an error | `boolean` | No | `false` | - |
|
|
16
|
+
| **success** | If the textarea has a success | `boolean` | No | `false` | - |
|
|
17
|
+
| **warning** | If the textarea has a warning | `boolean` | No | `false` | - |
|
|
18
|
+
| **hint** | The hint of the textarea | `string` | No | `undefined` | - |
|
|
19
|
+
| **color** | The color of the textarea | `MazColor` | No | `'primary'` | - |
|
|
20
|
+
| **rounded-size** | Size radius of the component's border | `"none" \| "sm" \| "md" \| "lg" \| "xl" \| "full"` | No | `'md'` | `'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'` |
|
|
21
|
+
| **padding** | If the textarea has a padding | `boolean` | No | `true` | - |
|
|
22
|
+
| **transparent** | If the textarea has a transparent background | `boolean` | No | `false` | - |
|
|
23
|
+
| **border** | If the textarea has no border | `boolean` | No | `true` | - |
|
|
24
|
+
| **autogrow** | If the textarea should autogrow based on its content | `boolean` | No | `true` | - |
|
|
25
|
+
| **append-justify** | The alignment of the append slot | `"start" \| "end" \| "center" \| "space-between" \| "space-around" \| "space-evenly"` | No | `'end'` | `'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'` |
|
|
26
|
+
| **top-label** | Static label displayed above the textarea. Unlike the floating label, this remains fixed | `string` | No | `undefined` | - |
|
|
27
|
+
| **assistive-text** | Helper text displayed below the input to provide additional context or validation feedback<br/>**Example:** `"Must contain at least 8 characters"` | `string` | No | `undefined` | - |
|
|
27
28
|
|
|
28
29
|
## Events
|
|
29
30
|
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
| **pause-on-focus** | Pause animation when a child element receives focus | `boolean` | No | `false` | - |
|
|
12
12
|
| **paused** | Programmatic pause control - takes precedence over pauseOnHover and pauseOnFocus | `boolean` | No | `false` | - |
|
|
13
13
|
| **overlay** | Show gradient overlays on edges to fade content in/out | `boolean` | No | `true` | - |
|
|
14
|
-
| **overlay-size** | Size of the gradient overlay zones (CSS value) | `
|
|
14
|
+
| **overlay-size** | Size of the gradient overlay zones (CSS value) | `MazSizeUnit` | No | `33%` | - |
|
|
15
15
|
| **animation-timing-function** | CSS animation timing function | `string` | No | `linear` | - |
|
|
16
16
|
|
|
17
17
|
## Slots
|