@maz-ui/mcp 5.0.0-beta.44 → 5.0.0-beta.47

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 CHANGED
@@ -7,7 +7,7 @@ import { existsSync, readFileSync, readdirSync, statSync } 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.42";
10
+ const version = "5.0.0-beta.46";
11
11
 
12
12
  class MetadataExtractor {
13
13
  extract(name, type, content, manualTags = []) {
@@ -0,0 +1,20 @@
1
+ ## Props
2
+
3
+ | Name | Description | Type | Required |
4
+ | ------------------ | ------------------------------------------------------------- | --------------------- | -------- |
5
+ | **count** | Total number of rows to virtualize. | `number` | Yes |
6
+ | **scroll-element** | Scrollable viewport element the virtualizer observes. | `HTMLElement \| null` | No |
7
+ | **estimate-size** | Fixed per-row height used to place rows and size the spacers. | `number` | No |
8
+ | **overscan** | Rows rendered outside the viewport on each side. | `number` | No |
9
+
10
+ ## Events
11
+
12
+ | Event name | Properties | Description |
13
+ | ---------- | ---------- | ----------- |
14
+ | change | |
15
+
16
+ ## Slots
17
+
18
+ | Name | Description | Bindings |
19
+ | ------- | ----------- | -------- |
20
+ | default | | |
@@ -1,44 +1,48 @@
1
1
  ## Props
2
2
 
3
- | Name | Description | Type | Required | Default | Possible values |
4
- | ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------- | -------- | ---------------------------------------- | ---------------------------- |
5
- | **table-class** | CSS class of the table element | `HTMLAttributes['class']` | No | `undefined` | - |
6
- | **table-style** | CSS style of the table element | `HTMLAttributes['style']` | No | `undefined` | - |
7
- | **model-value** | `v-model` <br/>List of selected rows | `(string \| boolean \| number)[]` | No | `undefined` | - |
8
- | **size** | Size of the table | `MazSize` | No | `md` | `xl, lg, md, sm, xs, mini` |
9
- | **input-size** | Size of the search inputs | `MazSize` | No | `undefined` | `xl, lg, md, sm, xs, mini` |
10
- | **title** | Title of the table | `string` | No | `undefined` | - |
11
- | **headers** | Headers of the table | `MazTableHeader[]` | No | `undefined` | - |
12
- | **sortable** | Enable sort feature on all columns | `boolean` | No | `false` | - |
13
- | **headers-align** | Align all headers | `string` | No | `left` | - |
14
- | **rows** | Rows of the table | `T[]` | No | `undefined` | - |
15
- | **hoverable** | Add hover effect on rows | `boolean` | No | `false` | - |
16
- | **search** | Enable search feature in table header | `boolean` | No | `false` | - |
17
- | **hide-search-in-row** | Disable search in rows - useful to filter data yourself or make search request to server | `boolean` | No | `false` | - |
18
- | **hide-search-by** | Disable search by column (remove select input "search by") | `boolean` | No | `false` | - |
19
- | **search-query** | `v-model:search-query` <br/>Search query in input | `string` | No | `undefined` | - |
20
- | **background-odd** | Add background color to odd rows | `boolean` | No | `false` | - |
21
- | **background-even** | Add background color to even rows | `boolean` | No | `false` | - |
22
- | **elevation** | Add shadow to the table | `boolean` | No | `false` | - |
23
- | **divider** | add divider between rows | `boolean` | No | `false` | - |
24
- | **caption** | Caption of the table | `string` | No | `undefined` | - |
25
- | **caption-side** | Caption side | `string` | No | `bottom` | `top, bottom` |
26
- | **pagination** | Add pagination in table footer | `boolean` | No | `false` | - |
27
- | **page** | `v-model:page` <br/>Current page of pagination | `number` | No | `1` | - |
28
- | **page-size** | `v-model:page-size` <br/>Number of items per page | `number` | No | `20` | - |
29
- | **total-pages** | Total number of pages | `number` | No | `undefined` | - |
30
- | **paginate-rows** | Don't paginate rows - useful to make pagination request with your server | `boolean` | No | `true` | - |
31
- | **total-items** | Total number of items | `number` | No | `undefined` | - |
32
- | **loading** | Loading state | `boolean` | No | `false` | - |
33
- | **selectable** | Enable selection of rows | `boolean` | No | `false` | - |
34
- | **selected-key** | Enable selection of rows - key of the selected row | `string` | No | `undefined` | - |
35
- | **table-layout** | Table layout | `string` | No | `undefined` | `auto, fixed` |
36
- | **color** | Color of the component | `MazColor` | No | `primary` | - |
37
- | **translations** | Translations of the table | `DeepPartial<MazUiTranslationsNestedSchema['table']>` | No | `Translations from @maz-ui/translations` | - |
38
- | **rounded-size** | Size radius of the component's border | `MazRoundedSize` | No | `md` | `none, sm, md, lg, xl, full` |
39
- | **scrollable** | Enable scrollable on table | `boolean` | No | `false` | - |
40
- | **row-key** | Field name used as a stable key for each row (e.g. an id). Gives every row a stable identity so reordering is tracked correctly - required for `animatedRows` to look right. Falls back to the row index when not provided. | `string` | No | `undefined` | - |
41
- | **animated-rows** | Animate row reordering with a FLIP transition (rows slide to their new position). Provide a stable `rowKey` for meaningful results. Respects `prefers-reduced-motion`. | `boolean` | No | `false` | - |
3
+ | Name | Description | Type | Required | Default | Possible values |
4
+ | ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------- | -------- | ---------------------------------------- | ---------------------------- |
5
+ | **table-class** | CSS class of the table element | `HTMLAttributes['class']` | No | `undefined` | - |
6
+ | **table-style** | CSS style of the table element | `HTMLAttributes['style']` | No | `undefined` | - |
7
+ | **model-value** | `v-model` <br/>List of selected rows | `(string \| boolean \| number)[]` | No | `undefined` | - |
8
+ | **size** | Size of the table | `MazSize` | No | `md` | `xl, lg, md, sm, xs, mini` |
9
+ | **input-size** | Size of the search inputs | `MazSize` | No | `undefined` | `xl, lg, md, sm, xs, mini` |
10
+ | **title** | Title of the table | `string` | No | `undefined` | - |
11
+ | **headers** | Headers of the table | `MazTableHeader[]` | No | `undefined` | - |
12
+ | **sortable** | Enable sort feature on all columns | `boolean` | No | `false` | - |
13
+ | **headers-align** | Align all headers | `string` | No | `left` | - |
14
+ | **rows** | Rows of the table | `T[]` | No | `undefined` | - |
15
+ | **hoverable** | Add hover effect on rows | `boolean` | No | `false` | - |
16
+ | **search** | Enable search feature in table header | `boolean` | No | `false` | - |
17
+ | **hide-search-in-row** | Disable search in rows - useful to filter data yourself or make search request to server | `boolean` | No | `false` | - |
18
+ | **hide-search-by** | Disable search by column (remove select input "search by") | `boolean` | No | `false` | - |
19
+ | **search-query** | `v-model:search-query` <br/>Search query in input | `string` | No | `undefined` | - |
20
+ | **background-odd** | Add background color to odd rows | `boolean` | No | `false` | - |
21
+ | **background-even** | Add background color to even rows | `boolean` | No | `false` | - |
22
+ | **elevation** | Add shadow to the table | `boolean` | No | `false` | - |
23
+ | **divider** | add divider between rows | `boolean` | No | `false` | - |
24
+ | **caption** | Caption of the table | `string` | No | `undefined` | - |
25
+ | **caption-side** | Caption side | `string` | No | `bottom` | `top, bottom` |
26
+ | **pagination** | Add pagination in table footer | `boolean` | No | `false` | - |
27
+ | **page** | `v-model:page` <br/>Current page of pagination | `number` | No | `1` | - |
28
+ | **page-size** | `v-model:page-size` <br/>Number of items per page | `number` | No | `20` | - |
29
+ | **total-pages** | Total number of pages | `number` | No | `undefined` | - |
30
+ | **paginate-rows** | Don't paginate rows - useful to make pagination request with your server | `boolean` | No | `true` | - |
31
+ | **total-items** | Total number of items | `number` | No | `undefined` | - |
32
+ | **loading** | Loading state | `boolean` | No | `false` | - |
33
+ | **selectable** | Enable selection of rows | `boolean` | No | `false` | - |
34
+ | **selected-key** | Enable selection of rows - key of the selected row | `string` | No | `undefined` | - |
35
+ | **table-layout** | Table layout | `string` | No | `undefined` | `auto, fixed` |
36
+ | **color** | Color of the component | `MazColor` | No | `primary` | - |
37
+ | **translations** | Translations of the table | `DeepPartial<MazUiTranslationsNestedSchema['table']>` | No | `Translations from @maz-ui/translations` | - |
38
+ | **rounded-size** | Size radius of the component's border | `MazRoundedSize` | No | `md` | `none, sm, md, lg, xl, full` |
39
+ | **scrollable** | Enable scrollable on table | `boolean` | No | `false` | - |
40
+ | **row-key** | Field name used as a stable key for each row (e.g. an id). Gives every row a stable identity so reordering is tracked correctly - required for `animatedRows` to look right. Falls back to the row index when not provided. | `string` | No | `undefined` | - |
41
+ | **animated-rows** | Animate row reordering with a FLIP transition (rows slide to their new position). Provide a stable `rowKey` for meaningful results. Respects `prefers-reduced-motion`. | `boolean` | No | `false` | - |
42
+ | **virtualized** | Only render the rows visible in the viewport (plus an overscan) using `@tanstack/vue-virtual`. Keeps the table fast on thousands of rows. Requires `maxHeight` to bound the scroll viewport. Ignored when `animatedRows` is on or when a custom default slot is provided. Rows render client-side only. | `boolean` | No | `false` | - |
43
+ | **max-height** | Max height of the scroll viewport (any CSS length, e.g. `'400px'`, `'70vh'`). Enables scrolling and, when `virtualized`, bounds the virtualized viewport. | `string` | No | `undefined` | - |
44
+ | **estimated-row-height** | Fixed row height in pixels used by the virtualizer to place rows and size the spacers. Set it to your real row height (virtualized rows should be uniform). | `number` | No | `44` | - |
45
+ | **overscan** | Number of rows rendered outside the viewport on each side when `virtualized`. | `number` | No | `10` | - |
42
46
 
43
47
  ## Events
44
48
 
@@ -16,6 +16,7 @@ description: A powerful and flexible date picker component with support for sing
16
16
  - [Basic Usage](#basic-usage)
17
17
  - [Date Formats](#date-formats)
18
18
  - [Date Selection](#date-selection)
19
+ - [Custom Trigger](#custom-trigger)
19
20
  - [Time Selection](#time-selection)
20
21
  - [Range Selection](#range-selection)
21
22
  - [Internationalization](#internationalization)
@@ -273,6 +274,58 @@ const date = ref()
273
274
  </template>
274
275
  </ComponentDemo>
275
276
 
277
+ ## Custom Trigger
278
+
279
+ By default MazDatePicker renders a readonly `MazInput` as the field that opens the calendar. Use the `#trigger` slot to replace it with your own element - a button, a custom input, an icon... Clicking the slotted element opens the calendar automatically (no `@click` needed), and the slot exposes the current open state plus functions for programmatic control.
280
+
281
+ ### Slot bindings
282
+
283
+ | Binding | Type | Description |
284
+ | --- | --- | --- |
285
+ | `is-open` | `boolean` | Whether the calendar is currently open |
286
+ | `open` | `() => void` | Open the calendar programmatically |
287
+ | `close` | `() => void` | Close the calendar programmatically |
288
+ | `toggle` | `() => void` | Toggle the calendar programmatically |
289
+
290
+ <ComponentDemo>
291
+ <MazDatePicker v-model="triggerDate" auto-close hide-header>
292
+ <template #trigger="{ isOpen }">
293
+ <MazBtn color="secondary" :class="{ 'maz:ring-2 maz:ring-offset-2 maz:ring-secondary': isOpen }">
294
+ {{ triggerDate || 'Pick a date' }}
295
+ </MazBtn>
296
+ </template>
297
+ </MazDatePicker>
298
+
299
+ <template #code>
300
+
301
+ ```vue
302
+ <template>
303
+ <MazDatePicker v-model="date" auto-close>
304
+ <!-- Clicking the button opens the picker automatically. -->
305
+ <template #trigger="{ isOpen }">
306
+ <MazBtn color="secondary" :class="{ 'maz:ring-2 maz:ring-secondary': isOpen }">
307
+ {{ date || 'Pick a date' }}
308
+ </MazBtn>
309
+ </template>
310
+ </MazDatePicker>
311
+ </template>
312
+
313
+ <script setup>
314
+ import { ref } from 'vue'
315
+
316
+ const date = ref()
317
+ </script>
318
+ ```
319
+
320
+ </template>
321
+ </ComponentDemo>
322
+
323
+ ::: tip
324
+ The model value is not passed through the slot - use your own `v-model` ref (here `date`) to display the selected value in your custom trigger. The exposed `open` / `close` / `toggle` functions are only needed when you want to drive the picker from your own logic.
325
+ :::
326
+
327
+ > In `inline` mode the calendar is always visible, so the `trigger` slot is not rendered. To open the picker from an element rendered outside the component, use the `custom-element-selector` prop instead.
328
+
276
329
  ## Time Selection
277
330
 
278
331
  ### Date + Time (24h format)
@@ -1021,6 +1074,7 @@ const formatExample2 = ref('03/15/2024')
1021
1074
  const formatExample3 = ref('15-03-2024')
1022
1075
  const transformedDate = ref()
1023
1076
  const newDateValue = ref()
1077
+ const triggerDate = ref()
1024
1078
  // Date selection
1025
1079
  const dateSelection = ref()
1026
1080
  const inlineDate = ref()
@@ -20,6 +20,7 @@ description: MazTable is designed to be a reusable data table with advanced feat
20
20
  5. Customizable Page Size: Users can choose the number of items to display per page using a dropdown list.
21
21
  6. Loading Indicator (prop `loading`): A loading indicator (MazLoadingBar) is displayed when data is being loaded.
22
22
  7. Animated rows (props `animated-rows` + `row-key`): rows slide to their new position when the order changes (FLIP animation). Respects `prefers-reduced-motion`.
23
+ 8. Virtualization (prop `virtualized`): render only the rows visible in the viewport (plus an overscan) so the table stays fast with thousands of rows.
23
24
 
24
25
  ## Available models
25
26
 
@@ -156,7 +157,7 @@ v-model:page-size="{{pageSize ?? 'undefined'}}"
156
157
  </template>
157
158
  <template #cell-name="{ row, value }">
158
159
  <div class="maz:flex maz:items-center maz:gap-2">
159
- <MazAvatar :src="row.logoUrl" size="0.5rem"></MazAvatar>
160
+ <MazAvatar :src="row.logoUrl" size="mini"></MazAvatar>
160
161
  <span>{{value}}</span>
161
162
  </div>
162
163
  </template>
@@ -431,6 +432,79 @@ Enable `animated-rows` to make rows slide to their new position when the order c
431
432
 
432
433
  </ComponentDemo>
433
434
 
435
+ ## Virtualization
436
+
437
+ Enable `virtualized` to render only the rows inside the viewport (plus an overscan) instead of every row. This keeps the table fast and the DOM light even with tens of thousands of rows. It works in `rows` mode (data-driven), and `@tanstack/vue-virtual` is loaded on demand - pages that never virtualize a table never ship it.
438
+
439
+ The example below renders **10 000 rows** but only keeps ~20 `<tr>` in the DOM at any time.
440
+
441
+ <ComponentDemo>
442
+ <MazTable
443
+ class="vp-raw"
444
+ size="sm"
445
+ virtualized
446
+ max-height="300px"
447
+ :estimated-row-height="38"
448
+ :headers="[
449
+ { label: '#', key: 'id', width: '5rem' },
450
+ { label: 'Name', key: 'name', width: '12rem' },
451
+ { label: 'Email', key: 'email' },
452
+ { label: 'Score', key: 'score', align: 'center', width: '6rem' },
453
+ ]"
454
+ :rows="virtualizedRows"
455
+ />
456
+
457
+ <template #code>
458
+
459
+ ```vue
460
+ <template>
461
+ <MazTable
462
+ virtualized
463
+ max-height="400px"
464
+ :estimated-row-height="38"
465
+ :headers="[
466
+ { label: '#', key: 'id', width: '5rem' },
467
+ { label: 'Name', key: 'name', width: '12rem' },
468
+ { label: 'Email', key: 'email' },
469
+ { label: 'Score', key: 'score', align: 'center', width: '6rem' },
470
+ ]"
471
+ :rows="rows"
472
+ />
473
+ </template>
474
+
475
+ <script lang="ts" setup>
476
+ import { MazTable } from 'maz-ui/components'
477
+
478
+ // 10 000 rows - only the visible window is rendered to the DOM
479
+ const rows = Array.from({ length: 10_000 }, (_, i) => ({
480
+ id: i + 1,
481
+ name: `User ${i + 1}`,
482
+ email: `user${i + 1}@maz-ui.com`,
483
+ score: Math.round(Math.random() * 100),
484
+ }))
485
+ </script>
486
+ ```
487
+
488
+ </template>
489
+
490
+ </ComponentDemo>
491
+
492
+ ### Options
493
+
494
+ | Prop | Default | Description |
495
+ | --- | --- | --- |
496
+ | `virtualized` | `false` | Turns virtualization on. |
497
+ | `max-height` | - | **Required.** Bounds the scroll viewport (any CSS length, e.g. `'400px'`, `'70vh'`). Scrolling is enabled automatically and the header stays sticky. |
498
+ | `estimated-row-height` | `44` | Fixed row height (in px) used to place rows and size the spacers. Set it to your real row height; virtualized rows should be uniform (single line). |
499
+ | `overscan` | `10` | Rows rendered outside the viewport on each side. |
500
+
501
+ ### Good to know
502
+
503
+ * **Set a `width` (or `minWidth`) on your headers.** Virtualization forces `table-layout: fixed` so columns stay aligned across the rendered window; without widths the browser distributes them equally.
504
+ * **Accessibility:** the table exposes `aria-rowcount` and each rendered row an `aria-rowindex`, so screen readers still announce "row X of N".
505
+ * **Ignored** (with a dev warning) when `animated-rows` is enabled or when you provide a custom default slot - those paths render every row.
506
+ * **Rendered client-side:** the virtualized body is empty during SSR and fills in on hydration.
507
+
434
508
  ## Loading
435
509
 
436
510
  Enable the loading state with the prop `loading`
@@ -589,6 +663,13 @@ Available sizes: `'mini' | 'xs' | 'sm' | 'md' | 'lg' | 'xl'`
589
663
  function shuffleRows() {
590
664
  players.value = [...players.value].sort(() => Math.random() - 0.5)
591
665
  }
666
+
667
+ const virtualizedRows = Array.from({ length: 10_000 }, (_, i) => ({
668
+ id: i + 1,
669
+ name: `User ${i + 1}`,
670
+ email: `user${i + 1}@maz-ui.com`,
671
+ score: Math.round(Math.random() * 100),
672
+ }))
592
673
  </script>
593
674
 
594
675
  ## Types
@@ -85,7 +85,8 @@ The MCP server is read-only — it ships docs, not code edits — so the assista
85
85
  8. **`MazChart`** drops `vue-chartjs` (lighter bundle, no eager registration of unused chart types). The `update-mode` prop now defaults to `'none'` — pass `update-mode="default"` if you want animated data updates.
86
86
  9. **`MazAvatar` size scale fixed.** A CSS-unit `size` now renders at its real value (`size="2rem"` is a 32px avatar, it was ~96px before). Multiply your unit values by 3 to keep the same render, or switch to a `MazSize` keyword (`'mini' | 'xs' | 'sm' | 'md' | 'lg' | 'xl'`). The upgrade tool does the ×3 rewrite for you on static values.
87
87
  10. Rename **`MazPullToRefresh`**'s `on-click` prop to `on-refresh` (handled by the upgrade tool).
88
- 11. That's it for most apps. Everything else is opt-in.
88
+ 11. Replace bare **`from 'maz-ui'`** utility imports with **`from '@maz-ui/utils'`** (the root re-export of utils was removed; handled by the upgrade tool). Components/composables/directives/plugins stay on their subpaths; types remain importable from `maz-ui`.
89
+ 12. That's it for most apps. Everything else is opt-in.
89
90
 
90
91
  ## Prerequisites
91
92
 
@@ -617,6 +618,30 @@ The upgrade tool rewrites this automatically on `<MazPullToRefresh>` tags (both
617
618
  rg "<MazPullToRefresh[^>]*\bon-?[Cc]lick" src/
618
619
  ```
619
620
 
621
+ ### 18. Root `maz-ui` import removed for utilities
622
+
623
+ In v4, the bare `maz-ui` entry re-exported `@maz-ui/utils`, so you could write `import { sleep } from 'maz-ui'`. In v5 that root re-export is gone — import helpers from their package directly:
624
+
625
+ ```ts
626
+ // v4
627
+ import { sleep, formatDate } from 'maz-ui'
628
+
629
+ // v5
630
+ import { sleep, formatDate } from '@maz-ui/utils'
631
+ ```
632
+
633
+ Components, composables, directives and plugins were **already** subpath-only in v4 (`maz-ui/components/MazBtn`, `maz-ui/composables/useToast`, …) and are unchanged. The upgrade tool rewrites the utility imports for you.
634
+
635
+ The `maz-ui` root now exposes **types only** (zero runtime cost), so shared types stay importable from the short path:
636
+
637
+ ```ts
638
+ import type { MazColor, MazSize } from 'maz-ui'
639
+ ```
640
+
641
+ ### 19. ESM-only
642
+
643
+ `maz-ui` and its `@maz-ui/*` packages ship **ESM only** (no CommonJS build). This was already the case in v4, but if you consume the library from a CommonJS context (old Jest without ESM, `require()`), use a bundler/test runner with ESM support (Vitest, Jest ≥ 29 with ESM, or native `import`).
644
+
620
645
  ## Informational changes (probably no action needed)
621
646
 
622
647
  ### Theme colors are now emitted as OKLCh
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.44",
4
+ "version": "5.0.0-beta.47",
5
5
  "description": "Maz-UI ModelContextProtocol Client",
6
6
  "author": "Louis Mazel <me@loicmazuel.com>",
7
7
  "license": "MIT",
@@ -41,15 +41,15 @@
41
41
  "docs"
42
42
  ],
43
43
  "dependencies": {
44
- "@maz-ui/utils": "5.0.0-beta.44",
45
- "@modelcontextprotocol/sdk": "^1.30.1",
46
- "maz-ui": "5.0.0-beta.44"
44
+ "@maz-ui/utils": "5.0.0-beta.46",
45
+ "@modelcontextprotocol/sdk": "^1.32.0",
46
+ "maz-ui": "5.0.0-beta.47"
47
47
  },
48
48
  "devDependencies": {
49
- "@maz-ui/eslint-config": "5.0.0-beta.44",
49
+ "@maz-ui/eslint-config": "5.0.0-beta.47",
50
50
  "@maz-ui/node": "5.0.0-beta.44",
51
- "@modelcontextprotocol/inspector": "^2.8.0",
52
- "@swc/core": "1.16.2",
51
+ "@modelcontextprotocol/inspector": "^2.9.0",
52
+ "@swc/core": "1.16.13",
53
53
  "prettier": "^3.9.9",
54
54
  "ts-node-maintained": "^10.9.5",
55
55
  "tsx": "^4.23.15",