@maz-ui/mcp 5.0.0-beta.35 → 5.0.0-beta.37
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.
|
|
10
|
+
const version = "5.0.0-beta.37";
|
|
11
11
|
|
|
12
12
|
class MetadataExtractor {
|
|
13
13
|
extract(name, type, content, manualTags = []) {
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
| ---------------------- | ----------- | ---------------- | -------- |
|
|
5
5
|
| **distance** | | `number` | No |
|
|
6
6
|
| **offset** | | `number` | No |
|
|
7
|
-
| **on-
|
|
7
|
+
| **on-refresh** | | `TSFunctionType` | No |
|
|
8
8
|
| **container-selector** | | `string` | No |
|
|
9
9
|
| **header-class** | | `string` | No |
|
|
10
10
|
| **spinner-color** | | `MazColor` | No |
|
|
@@ -1,42 +1,44 @@
|
|
|
1
1
|
## Props
|
|
2
2
|
|
|
3
|
-
| Name | Description
|
|
4
|
-
| ---------------------- |
|
|
5
|
-
| **table-class** | CSS class of the table element
|
|
6
|
-
| **table-style** | CSS style of the table element
|
|
7
|
-
| **model-value** | `v-model` <br/>List of selected rows
|
|
8
|
-
| **size** | Size of the table
|
|
9
|
-
| **input-size** | Size of the search inputs
|
|
10
|
-
| **title** | Title of the table
|
|
11
|
-
| **headers** | Headers of the table
|
|
12
|
-
| **sortable** | Enable sort feature on all columns
|
|
13
|
-
| **headers-align** | Align all headers
|
|
14
|
-
| **rows** | Rows of the table
|
|
15
|
-
| **hoverable** | Add hover effect on rows
|
|
16
|
-
| **search** | Enable search feature in table header
|
|
17
|
-
| **hide-search-in-row** | Disable search in rows - useful to filter data yourself or make search request to server
|
|
18
|
-
| **hide-search-by** | Disable search by column (remove select input "search by")
|
|
19
|
-
| **search-query** | `v-model:search-query` <br/>Search query in input
|
|
20
|
-
| **background-odd** | Add background color to odd rows
|
|
21
|
-
| **background-even** | Add background color to even rows
|
|
22
|
-
| **elevation** | Add shadow to the table
|
|
23
|
-
| **divider** | add divider between rows
|
|
24
|
-
| **caption** | Caption of the table
|
|
25
|
-
| **caption-side** | Caption side
|
|
26
|
-
| **pagination** | Add pagination in table footer
|
|
27
|
-
| **page** | `v-model:page` <br/>Current page of pagination
|
|
28
|
-
| **page-size** | `v-model:page-size` <br/>Number of items per page
|
|
29
|
-
| **total-pages** | Total number of pages
|
|
30
|
-
| **paginate-rows** | Don't paginate rows - useful to make pagination request with your server
|
|
31
|
-
| **total-items** | Total number of items
|
|
32
|
-
| **loading** | Loading state
|
|
33
|
-
| **selectable** | Enable selection of rows
|
|
34
|
-
| **selected-key** | Enable selection of rows - key of the selected row
|
|
35
|
-
| **table-layout** | Table layout
|
|
36
|
-
| **color** | Color of the component
|
|
37
|
-
| **translations** | Translations of the table
|
|
38
|
-
| **rounded-size** | Size radius of the component's border
|
|
39
|
-
| **scrollable** | Enable scrollable on table
|
|
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` | - |
|
|
40
42
|
|
|
41
43
|
## Events
|
|
42
44
|
|
|
@@ -30,7 +30,7 @@ async function pullToRefreshAction() {
|
|
|
30
30
|
<MazPullToRefresh
|
|
31
31
|
header-class="maz:bg-bg-dark maz:text-foreground-light"
|
|
32
32
|
class="maz:flex maz:min-h-screen maz:w-full maz:flex-col"
|
|
33
|
-
:
|
|
33
|
+
:on-refresh="pullToRefreshAction"
|
|
34
34
|
spinner-color="contrast"
|
|
35
35
|
standalone-mode
|
|
36
36
|
:disabled="false"
|
|
@@ -19,6 +19,7 @@ description: MazTable is designed to be a reusable data table with advanced feat
|
|
|
19
19
|
4. Row Selection (prop `select-value="key"`): There is a dedicated column for selection with a checkbox for each row. Users can individually or collectively select/deselect rows.
|
|
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
|
+
7. Animated rows (props `animated-rows` + `row-key`): rows slide to their new position when the order changes (FLIP animation). Respects `prefers-reduced-motion`.
|
|
22
23
|
|
|
23
24
|
## Available models
|
|
24
25
|
|
|
@@ -369,6 +370,67 @@ v-model:page-size="{{pageSize ?? 'undefined'}}"
|
|
|
369
370
|
|
|
370
371
|
</ComponentDemo>
|
|
371
372
|
|
|
373
|
+
## Animated rows
|
|
374
|
+
|
|
375
|
+
Enable `animated-rows` to make rows slide to their new position when the order changes (FLIP animation) - perfect for live leaderboards or sortable lists. Provide a stable `row-key` (a field uniquely identifying each row) so every row keeps its identity across reorders. The animation is automatically disabled when the user prefers reduced motion.
|
|
376
|
+
|
|
377
|
+
<ComponentDemo>
|
|
378
|
+
<MazBtn class="vp-raw" size="sm" @click="shuffleRows">Shuffle</MazBtn>
|
|
379
|
+
<br />
|
|
380
|
+
<br />
|
|
381
|
+
<MazTable
|
|
382
|
+
class="vp-raw"
|
|
383
|
+
size="sm"
|
|
384
|
+
animated-rows
|
|
385
|
+
row-key="id"
|
|
386
|
+
:headers="[
|
|
387
|
+
{ label: '#', key: 'id', align: 'center', width: '3rem' },
|
|
388
|
+
{ label: 'Name', key: 'name' },
|
|
389
|
+
{ label: 'Score', key: 'score', align: 'center' },
|
|
390
|
+
]"
|
|
391
|
+
:rows="players"
|
|
392
|
+
/>
|
|
393
|
+
|
|
394
|
+
<template #code>
|
|
395
|
+
|
|
396
|
+
```vue
|
|
397
|
+
<template>
|
|
398
|
+
<MazBtn @click="shuffleRows">
|
|
399
|
+
Shuffle
|
|
400
|
+
</MazBtn>
|
|
401
|
+
<MazTable
|
|
402
|
+
animated-rows
|
|
403
|
+
row-key="id"
|
|
404
|
+
:headers="[
|
|
405
|
+
{ label: '#', key: 'id', align: 'center', width: '3rem' },
|
|
406
|
+
{ label: 'Name', key: 'name' },
|
|
407
|
+
{ label: 'Score', key: 'score', align: 'center' },
|
|
408
|
+
]"
|
|
409
|
+
:rows="players"
|
|
410
|
+
/>
|
|
411
|
+
</template>
|
|
412
|
+
|
|
413
|
+
<script lang="ts" setup>
|
|
414
|
+
import { MazTable } from 'maz-ui/components'
|
|
415
|
+
import { ref } from 'vue'
|
|
416
|
+
|
|
417
|
+
const players = ref([
|
|
418
|
+
{ id: 1, name: 'John', score: 12 },
|
|
419
|
+
{ id: 2, name: 'Jane', score: 24 },
|
|
420
|
+
{ id: 3, name: 'Alice', score: 8 },
|
|
421
|
+
{ id: 4, name: 'Bob', score: 31 },
|
|
422
|
+
])
|
|
423
|
+
|
|
424
|
+
function shuffleRows() {
|
|
425
|
+
players.value = [...players.value].sort(() => Math.random() - 0.5)
|
|
426
|
+
}
|
|
427
|
+
</script>
|
|
428
|
+
```
|
|
429
|
+
|
|
430
|
+
</template>
|
|
431
|
+
|
|
432
|
+
</ComponentDemo>
|
|
433
|
+
|
|
372
434
|
## Loading
|
|
373
435
|
|
|
374
436
|
Enable the loading state with the prop `loading`
|
|
@@ -516,6 +578,17 @@ Available sizes: `'mini' | 'xs' | 'sm' | 'md' | 'lg' | 'xl'`
|
|
|
516
578
|
const searchQuery = ref<string>()
|
|
517
579
|
const pageSize = ref<number>(10)
|
|
518
580
|
const page = ref<number>(1)
|
|
581
|
+
|
|
582
|
+
const players = ref([
|
|
583
|
+
{ id: 1, name: 'John', score: 12 },
|
|
584
|
+
{ id: 2, name: 'Jane', score: 24 },
|
|
585
|
+
{ id: 3, name: 'Alice', score: 8 },
|
|
586
|
+
{ id: 4, name: 'Bob', score: 31 },
|
|
587
|
+
])
|
|
588
|
+
|
|
589
|
+
function shuffleRows() {
|
|
590
|
+
players.value = [...players.value].sort(() => Math.random() - 0.5)
|
|
591
|
+
}
|
|
519
592
|
</script>
|
|
520
593
|
|
|
521
594
|
## Types
|
|
@@ -545,6 +618,7 @@ export interface MazTableHeadersEnriched {
|
|
|
545
618
|
srOnly?: boolean
|
|
546
619
|
width?: string
|
|
547
620
|
maxWidth?: string
|
|
621
|
+
minWidth?: string
|
|
548
622
|
classes?: ThHTMLAttributes['class']
|
|
549
623
|
scope?: ThHTMLAttributes['scope']
|
|
550
624
|
align?: ThHTMLAttributes['align']
|
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.37",
|
|
5
5
|
"description": "Maz-UI ModelContextProtocol Client",
|
|
6
6
|
"author": "Louis Mazel <me@loicmazuel.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"dependencies": {
|
|
44
44
|
"@modelcontextprotocol/sdk": "^1.29.0",
|
|
45
45
|
"@maz-ui/utils": "5.0.0-beta.28",
|
|
46
|
-
"maz-ui": "5.0.0-beta.
|
|
46
|
+
"maz-ui": "5.0.0-beta.37"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@modelcontextprotocol/inspector": "^0.21.2",
|