@maz-ui/mcp 4.1.7-beta.6 → 4.1.7-beta.8
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-dropzone.doc.md +22 -21
- package/docs/generated-docs/maz-icon.doc.md +9 -8
- package/docs/src/components/maz-btn.md +53 -6
- package/docs/src/components/maz-dropzone.md +84 -5
- package/docs/src/components/maz-icon.md +148 -43
- package/docs/src/guide/icon-set.md +5 -2
- package/package.json +11 -12
package/dist/mcp.mjs
CHANGED
|
@@ -7,7 +7,7 @@ import { existsSync, readFileSync, readdirSync } from 'node:fs';
|
|
|
7
7
|
import { resolve, dirname, join } from 'node:path';
|
|
8
8
|
import { fileURLToPath } from 'node:url';
|
|
9
9
|
|
|
10
|
-
const version = "4.1.7-beta.
|
|
10
|
+
const version = "4.1.7-beta.7";
|
|
11
11
|
|
|
12
12
|
const _dirname = dirname(fileURLToPath(import.meta.url));
|
|
13
13
|
class DocumentationService {
|
|
@@ -1,26 +1,27 @@
|
|
|
1
1
|
## Props
|
|
2
2
|
|
|
3
|
-
| Name | Description | Type
|
|
4
|
-
| --------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
5
|
-
| **id** | The id of the dropzone | `string`
|
|
6
|
-
| **multiple** | Allow multiple files to be uploaded. | `boolean`
|
|
7
|
-
| **data-types** | Allowed data types/MIME types for files (e.g. ['application/json']) | `string[]`
|
|
8
|
-
| **prevent-default-for-unhandled** | Prevent default behavior for unhandled drag & drop events. | `boolean`
|
|
9
|
-
| **max-file-size** | Maximum file size in MB. | `number`
|
|
10
|
-
| **max-files** | Maximum number of files allowed. | `number`
|
|
11
|
-
| **disabled** | Disable the dropzone | `boolean`
|
|
12
|
-
| **preview** | Show file preview | `boolean`
|
|
13
|
-
| **min-file-size** | Minimum file size in MB | `number`
|
|
14
|
-
| **allow-duplicates** | Allow duplicates | `boolean`
|
|
15
|
-
| **translations** | **Translations** <br/> <br/>Custom translations for the component<br/> | `
|
|
16
|
-
| **color** | Main color of the component | `MazColor`
|
|
17
|
-
| **select-file-btn-props** | MazBtn props [MazBtn props](/components/maz-btn#props) | `MazBtnProps`
|
|
18
|
-
| **remove-file-btn-props** | MazBtn props [MazBtn props](/components/maz-btn#props) | `MazBtnProps`
|
|
19
|
-
| **spinner-props** | MazSpinner props [MazSpinner props](/components/maz-spinner#props) | `MazSpinnerProps`
|
|
20
|
-
| **auto-upload** | **Auto upload files** <br/> <br/>If set to `multiple`, all files will be uploaded at once in a single request. If set to `single`, files will be uploaded one by one in separate requests. If set to `false`, no upload will be done automatically.<br/> | `"multiple" \| "single" \| false`
|
|
21
|
-
| **url** | **Upload URL** <br/> <br/>If set, files will be uploaded to the given URL.<br/> | `string`
|
|
22
|
-
| **request-options** | **Request options** <br/> <br/>Request options to be used for the upload (using fetch) [Request options](https://developer.mozilla.org/en-US/docs/Web/API/fetch#options)<br/><br/>**Example:** `{ mode: 'no-cors', headers: { 'Content-Type': 'multipart/form-data', 'Authorization': 'Bearer 1234567890' } }` | `RequestInit`
|
|
23
|
-
| **transform-body** | Transform the body of the request | `TSFunctionType`
|
|
3
|
+
| Name | Description | Type | Required | Default |
|
|
4
|
+
| --------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------- | -------- | ----------- |
|
|
5
|
+
| **id** | The id of the dropzone | `string` | No | `undefined` |
|
|
6
|
+
| **multiple** | Allow multiple files to be uploaded. | `boolean` | No | `false` |
|
|
7
|
+
| **data-types** | Allowed data types/MIME types for files (e.g. ['application/json']) | `string[]` | No | `['*\/*']` |
|
|
8
|
+
| **prevent-default-for-unhandled** | Prevent default behavior for unhandled drag & drop events. | `boolean` | No | `true` |
|
|
9
|
+
| **max-file-size** | Maximum file size in MB. | `number` | No | `undefined` |
|
|
10
|
+
| **max-files** | Maximum number of files allowed. | `number` | No | `undefined` |
|
|
11
|
+
| **disabled** | Disable the dropzone | `boolean` | No | `undefined` |
|
|
12
|
+
| **preview** | Show file preview | `boolean` | No | `undefined` |
|
|
13
|
+
| **min-file-size** | Minimum file size in MB | `number` | No | `undefined` |
|
|
14
|
+
| **allow-duplicates** | Allow duplicates | `boolean` | No | `false` |
|
|
15
|
+
| **translations** | **Translations** <br/> <br/>Custom translations for the component<br/> | `Partial<MazUiTranslationsNestedSchema['dropzone']>` | No | `undefined` |
|
|
16
|
+
| **color** | Main color of the component | `MazColor` | No | `primary` |
|
|
17
|
+
| **select-file-btn-props** | MazBtn props [MazBtn props](/components/maz-btn#props) | `MazBtnProps` | No | `{}` |
|
|
18
|
+
| **remove-file-btn-props** | MazBtn props [MazBtn props](/components/maz-btn#props) | `MazBtnProps` | No | `{}` |
|
|
19
|
+
| **spinner-props** | MazSpinner props [MazSpinner props](/components/maz-spinner#props) | `MazSpinnerProps` | No | `{}` |
|
|
20
|
+
| **auto-upload** | **Auto upload files** <br/> <br/>If set to `multiple`, all files will be uploaded at once in a single request. If set to `single`, files will be uploaded one by one in separate requests. If set to `false`, no upload will be done automatically.<br/> | `"multiple" \| "single" \| false` | No | `false` |
|
|
21
|
+
| **url** | **Upload URL** <br/> <br/>If set, files will be uploaded to the given URL.<br/> | `string` | No | `undefined` |
|
|
22
|
+
| **request-options** | **Request options** <br/> <br/>Request options to be used for the upload (using fetch) [Request options](https://developer.mozilla.org/en-US/docs/Web/API/fetch#options)<br/><br/>**Example:** `{ mode: 'no-cors', headers: { 'Content-Type': 'multipart/form-data', 'Authorization': 'Bearer 1234567890' } }` | `RequestInit` | No | `undefined` |
|
|
23
|
+
| **transform-body** | Transform the body of the request | `TSFunctionType` | No | `undefined` |
|
|
24
|
+
| **max-concurrent-uploads** | **Maximum number of concurrent uploads** <br/> <br/>Limit the number of files uploaded simultaneously to avoid overwhelming the server<br/> | `number` | No | `5` |
|
|
24
25
|
|
|
25
26
|
## Events
|
|
26
27
|
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
## Props
|
|
2
2
|
|
|
3
|
-
| Name | Description
|
|
4
|
-
| -------------------- |
|
|
5
|
-
| **
|
|
6
|
-
| **
|
|
7
|
-
| **
|
|
8
|
-
| **
|
|
9
|
-
| **
|
|
10
|
-
| **
|
|
3
|
+
| Name | Description | Type | Required |
|
|
4
|
+
| -------------------- | --------------------------------------------------------------------------------------------------------- | ---------------- | -------- |
|
|
5
|
+
| **icon** | The icon component to render - e.g: `import { MazStar } from '@maz-ui/icons'` | `IconComponent` | No |
|
|
6
|
+
| **src** | The source path of the SVG file - e.g: `/icons/home.svg` | `string` | No |
|
|
7
|
+
| **path** | The path of the folder where the SVG files are stored - e.g: `/icons` | `string` | No |
|
|
8
|
+
| **name** | The name of the SVG file - e.g: `home` | `string` | No |
|
|
9
|
+
| **size** | The size of the SVG file - e.g: `1em` or can be a predefined size: `'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl'` | `MazIconSize` | No |
|
|
10
|
+
| **title** | The title of the SVG file - e.g: `Home` | `string` | No |
|
|
11
|
+
| **transform-source** | The function to transform the source of the SVG file - e.g: `(svg) => svg` | `TSFunctionType` | No |
|
|
11
12
|
|
|
12
13
|
## Events
|
|
13
14
|
|
|
@@ -310,15 +310,50 @@ By default, the justify is `center`
|
|
|
310
310
|
## Icons
|
|
311
311
|
|
|
312
312
|
<ComponentDemo>
|
|
313
|
+
<h4 class="maz-mb-2 maz-font-semibold maz-text-lg">
|
|
314
|
+
Left Icon and Right Icon
|
|
315
|
+
</h4>
|
|
316
|
+
|
|
313
317
|
<div class="maz-flex maz-gap-2 maz-rounded maz-flex-wrap maz-items-center">
|
|
318
|
+
<MazBtn :left-icon="MazCheck" size="mini">
|
|
319
|
+
left-icon
|
|
320
|
+
</MazBtn>
|
|
321
|
+
<MazBtn :left-icon="MazCheck" size="xs">
|
|
322
|
+
left-icon
|
|
323
|
+
</MazBtn>
|
|
314
324
|
<MazBtn :left-icon="MazCheck" size="sm">
|
|
315
325
|
left-icon
|
|
316
326
|
</MazBtn>
|
|
317
|
-
<MazBtn :right-icon="
|
|
318
|
-
|
|
327
|
+
<MazBtn :right-icon="MazCheck" size="md">
|
|
328
|
+
left-icon
|
|
329
|
+
</MazBtn>
|
|
330
|
+
<MazBtn :right-icon="MazCheck" size="lg">
|
|
331
|
+
left-icon
|
|
332
|
+
</MazBtn>
|
|
333
|
+
<MazBtn :right-icon="MazCheck" size="xl">
|
|
334
|
+
left-icon
|
|
319
335
|
</MazBtn>
|
|
336
|
+
</div>
|
|
337
|
+
|
|
338
|
+
<h4 class="maz-my-2 maz-font-semibold maz-text-lg">
|
|
339
|
+
Fab
|
|
340
|
+
</h4>
|
|
341
|
+
|
|
342
|
+
<div class="maz-flex maz-gap-2 maz-rounded maz-flex-wrap maz-items-center">
|
|
343
|
+
<MazBtn fab :icon="MazCommandLine" size="mini" />
|
|
344
|
+
<MazBtn fab :icon="MazCommandLine" size="xs" />
|
|
345
|
+
<MazBtn fab :icon="MazCommandLine" size="sm" />
|
|
346
|
+
<MazBtn fab :icon="MazCommandLine" size="md" />
|
|
320
347
|
<MazBtn fab :icon="MazCommandLine" size="lg" />
|
|
321
|
-
<MazBtn :
|
|
348
|
+
<MazBtn fab :icon="MazCommandLine" size="xl" />
|
|
349
|
+
</div>
|
|
350
|
+
|
|
351
|
+
<h4 class="maz-my-2 maz-font-semibold maz-text-lg">
|
|
352
|
+
Icon component
|
|
353
|
+
</h4>
|
|
354
|
+
|
|
355
|
+
<div class="maz-flex maz-gap-2 maz-rounded maz-flex-wrap maz-items-center">
|
|
356
|
+
<MazBtn :left-icon="MazSpinner" size="md" color="warning">
|
|
322
357
|
icon component
|
|
323
358
|
</MazBtn>
|
|
324
359
|
</div>
|
|
@@ -326,14 +361,26 @@ By default, the justify is `center`
|
|
|
326
361
|
<template #code>
|
|
327
362
|
|
|
328
363
|
```html
|
|
364
|
+
<MazBtn :left-icon="MazCheck" size="mini">
|
|
365
|
+
left-icon
|
|
366
|
+
</MazBtn>
|
|
367
|
+
<MazBtn :left-icon="MazCheck" size="xs">
|
|
368
|
+
left-icon
|
|
369
|
+
</MazBtn>
|
|
329
370
|
<MazBtn :left-icon="MazCheck" size="sm">
|
|
330
371
|
left-icon
|
|
331
372
|
</MazBtn>
|
|
332
|
-
<MazBtn :
|
|
333
|
-
|
|
373
|
+
<MazBtn :left-icon="MazCheck" size="md">
|
|
374
|
+
left-icon
|
|
375
|
+
</MazBtn>
|
|
376
|
+
<MazBtn :left-icon="MazCheck" size="lg">
|
|
377
|
+
left-icon
|
|
378
|
+
</MazBtn>
|
|
379
|
+
<MazBtn :left-icon="MazCheck" size="xl">
|
|
380
|
+
left-icon
|
|
334
381
|
</MazBtn>
|
|
335
382
|
<MazBtn fab :icon="MazCommandLine" size="lg" />
|
|
336
|
-
<MazBtn :icon="MazSpinner" size="sm" color="warning">
|
|
383
|
+
<MazBtn :left-icon="MazSpinner" size="sm" color="warning">
|
|
337
384
|
icon component
|
|
338
385
|
</MazBtn>
|
|
339
386
|
```
|
|
@@ -80,7 +80,8 @@ function handleError({ code, files }) {
|
|
|
80
80
|
ref="dropzone"
|
|
81
81
|
v-model="files"
|
|
82
82
|
:max-file-size="3"
|
|
83
|
-
|
|
83
|
+
multiple
|
|
84
|
+
:max-concurrent-uploads="3"
|
|
84
85
|
@upload-success="onUploadSuccess"
|
|
85
86
|
@upload-error="onUploadError"
|
|
86
87
|
@error="onError"
|
|
@@ -128,9 +129,10 @@ function onError({ files, event, code }) {
|
|
|
128
129
|
<template>
|
|
129
130
|
<MazDropzone
|
|
130
131
|
v-model="files"
|
|
131
|
-
:data-types="['image/*']"
|
|
132
|
+
:data-types="['image/*', '.zip', '.strings', '.json', '.stringsdict']"
|
|
132
133
|
:max-file-size="3"
|
|
133
134
|
:max-files="5"
|
|
135
|
+
:max-concurrent-uploads="5"
|
|
134
136
|
url="https://httpbin.org/post"
|
|
135
137
|
:request-options="{
|
|
136
138
|
headers: { 'My-Awesome-Header': 'header value' },
|
|
@@ -156,15 +158,52 @@ You can restrict allowed file types using the `data-types` prop:
|
|
|
156
158
|
<ComponentDemo>
|
|
157
159
|
<MazDropzone
|
|
158
160
|
v-model="files"
|
|
159
|
-
:data-types="
|
|
161
|
+
:data-types="acceptedFormats"
|
|
160
162
|
:max-file-size="5"
|
|
161
163
|
@error="onError"
|
|
162
164
|
/>
|
|
163
165
|
|
|
164
166
|
<template #code>
|
|
165
167
|
|
|
166
|
-
```
|
|
167
|
-
<
|
|
168
|
+
```vue
|
|
169
|
+
<script lang="ts" setup>
|
|
170
|
+
const acceptedFormats = [
|
|
171
|
+
'.strings',
|
|
172
|
+
'.stringsdict',
|
|
173
|
+
'.plist',
|
|
174
|
+
'.xliff',
|
|
175
|
+
'.xlf',
|
|
176
|
+
'.xml',
|
|
177
|
+
'.json',
|
|
178
|
+
'.yaml',
|
|
179
|
+
'.yml',
|
|
180
|
+
'.po',
|
|
181
|
+
'.pot',
|
|
182
|
+
'.mo',
|
|
183
|
+
'.properties',
|
|
184
|
+
'.arb',
|
|
185
|
+
'.csv',
|
|
186
|
+
'.tsv',
|
|
187
|
+
'.txt',
|
|
188
|
+
'text/*',
|
|
189
|
+
'application/json',
|
|
190
|
+
'text/xml',
|
|
191
|
+
'application/xml',
|
|
192
|
+
'text/yaml',
|
|
193
|
+
'text/html',
|
|
194
|
+
'image/svg+xml',
|
|
195
|
+
'video/mp4',
|
|
196
|
+
'video/quicktime',
|
|
197
|
+
'video/mpeg',
|
|
198
|
+
'video/ogg',
|
|
199
|
+
'video/webm',
|
|
200
|
+
'audio/*',
|
|
201
|
+
]
|
|
202
|
+
</script>
|
|
203
|
+
|
|
204
|
+
<template>
|
|
205
|
+
<MazDropzone v-model="files" :data-types="acceptedFormats" :max-file-size="5" @error="onError" />
|
|
206
|
+
</template>
|
|
168
207
|
```
|
|
169
208
|
|
|
170
209
|
</template>
|
|
@@ -439,4 +478,44 @@ const onError = ({ files, event, code }) => {
|
|
|
439
478
|
console.error('Error:', files, event, code)
|
|
440
479
|
toast.error(`${files?.length} files upload failed: ${code} - ${files?.map(file => file.name).join(', ')}`)
|
|
441
480
|
}
|
|
481
|
+
|
|
482
|
+
const acceptedFormats = [
|
|
483
|
+
// iOS
|
|
484
|
+
'.strings',
|
|
485
|
+
'.stringsdict',
|
|
486
|
+
'.plist',
|
|
487
|
+
'.xliff',
|
|
488
|
+
'.xlf',
|
|
489
|
+
// Android
|
|
490
|
+
'.xml',
|
|
491
|
+
// Web
|
|
492
|
+
'.json',
|
|
493
|
+
'.yaml',
|
|
494
|
+
'.yml',
|
|
495
|
+
'.po',
|
|
496
|
+
'.pot',
|
|
497
|
+
'.mo',
|
|
498
|
+
// Java
|
|
499
|
+
'.properties',
|
|
500
|
+
// Flutter
|
|
501
|
+
'.arb',
|
|
502
|
+
// Général
|
|
503
|
+
'.csv',
|
|
504
|
+
'.tsv',
|
|
505
|
+
'.txt',
|
|
506
|
+
// MIME types fallback
|
|
507
|
+
'text/*',
|
|
508
|
+
'application/json',
|
|
509
|
+
'text/xml',
|
|
510
|
+
'application/xml',
|
|
511
|
+
'text/yaml',
|
|
512
|
+
'text/html',
|
|
513
|
+
'image/svg+xml',
|
|
514
|
+
'video/mp4',
|
|
515
|
+
'video/quicktime',
|
|
516
|
+
'video/mpeg',
|
|
517
|
+
'video/ogg',
|
|
518
|
+
'video/webm',
|
|
519
|
+
'audio/*',
|
|
520
|
+
]
|
|
442
521
|
</script>
|
|
@@ -7,70 +7,143 @@ description: MazIcon is a standalone component to load your svg files
|
|
|
7
7
|
|
|
8
8
|
{{ $frontmatter.description }}
|
|
9
9
|
|
|
10
|
+
::: tip
|
|
11
|
+
Download icons pack [here](#get-icons-pack)
|
|
12
|
+
:::
|
|
13
|
+
|
|
14
|
+
## How to use?
|
|
15
|
+
|
|
16
|
+
**2 ways to use this component:**
|
|
17
|
+
|
|
18
|
+
- Use a component (like `MazStar` exported from `@maz-ui/icons`) with `icon` prop
|
|
19
|
+
- Use a name (like `academic-cap`) with `name` prop or `src` prop (e.g: `src="/path/icon.svg"`)
|
|
20
|
+
|
|
21
|
+
## Example
|
|
22
|
+
|
|
10
23
|
- Basically, this component will render your SVG from your project.
|
|
11
24
|
- The component will fetch the SVG from the `public` folder and parse it to render it.
|
|
12
25
|
- Place your SVG files in a public folder (default `/icons`, use `path` prop to change it)
|
|
13
26
|
|
|
14
|
-
##
|
|
27
|
+
## Icon Component
|
|
15
28
|
|
|
16
|
-
|
|
29
|
+
`icon` is the icon component to render - e.g: `import { MazStar } from '@maz-ui/icons'`
|
|
17
30
|
|
|
18
|
-
|
|
19
|
-
Download pack
|
|
20
|
-
</MazBtn>
|
|
31
|
+
Can be custom component from your stack - e.g: `import ComponentIcon from './path_to_your/ComponentIcon.vue'`
|
|
21
32
|
|
|
22
|
-
|
|
33
|
+
<ComponentDemo>
|
|
23
34
|
|
|
24
|
-
|
|
35
|
+
<MazIcon :icon="icons.MazStar" />
|
|
36
|
+
|
|
37
|
+
<template #code>
|
|
25
38
|
|
|
26
39
|
```vue
|
|
27
|
-
<script
|
|
28
|
-
import
|
|
29
|
-
|
|
30
|
-
const iconNames = [
|
|
31
|
-
'academic-cap',
|
|
32
|
-
'adjustments-horizontal',
|
|
33
|
-
'adjustments-vertical',
|
|
34
|
-
'archive-box-arrow-down',
|
|
35
|
-
'archive-box-x-mark',
|
|
36
|
-
'archive-box',
|
|
37
|
-
...
|
|
38
|
-
'window',
|
|
39
|
-
'wrench-screwdriver',
|
|
40
|
-
'wrench',
|
|
41
|
-
'x-circle',
|
|
42
|
-
'x-mark'
|
|
43
|
-
]
|
|
40
|
+
<script lang="ts" setup>
|
|
41
|
+
import { MazStar } from '@maz-ui/icons'
|
|
44
42
|
</script>
|
|
45
43
|
|
|
46
44
|
<template>
|
|
47
|
-
<
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
45
|
+
<MazIcon :icon="MazStar" />
|
|
46
|
+
</template>
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
</template>
|
|
50
|
+
</ComponentDemo>
|
|
51
|
+
|
|
52
|
+
## Path + Name
|
|
53
|
+
|
|
54
|
+
- `name` is the SVG file name without extension
|
|
55
|
+
- `path` should be the folder where your svg files are stored in your public assets. Can be gloablly provided by using `mazIconPath` - [follow this documentation](#options)
|
|
56
|
+
|
|
57
|
+
<ComponentDemo>
|
|
58
|
+
|
|
59
|
+
<MazIcon name="academic-cap" path="/icons" />
|
|
60
|
+
|
|
61
|
+
<template #code>
|
|
62
|
+
|
|
63
|
+
```html
|
|
64
|
+
<MazIcon name="academic-cap" path="/icons" />
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
</template>
|
|
68
|
+
</ComponentDemo>
|
|
69
|
+
|
|
70
|
+
## Src
|
|
71
|
+
|
|
72
|
+
Provide the full src path to the icon
|
|
73
|
+
|
|
74
|
+
<ComponentDemo>
|
|
75
|
+
|
|
76
|
+
<MazIcon src="/icons/academic-cap.svg" />
|
|
77
|
+
|
|
78
|
+
<template #code>
|
|
79
|
+
|
|
80
|
+
```html
|
|
81
|
+
<MazIcon src="/icons/academic-cap.svg" />
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
</template>
|
|
85
|
+
</ComponentDemo>
|
|
86
|
+
|
|
87
|
+
## Sizing
|
|
88
|
+
|
|
89
|
+
### Predefined sizes
|
|
90
|
+
|
|
91
|
+
Can be `xs`, `sm`, `md`, `lg`, `xl`
|
|
92
|
+
|
|
93
|
+
<ComponentDemo>
|
|
94
|
+
<div class="maz-flex maz-gap-2 maz-flex-wrap maz-items-center">
|
|
95
|
+
<MazIcon v-for="size in ['xs', 'sm', 'md', 'lg', 'xl']" :key="size" :size="size" :icon="icons.MazStar" />
|
|
55
96
|
</div>
|
|
97
|
+
|
|
98
|
+
<template #code>
|
|
99
|
+
|
|
100
|
+
```vue
|
|
101
|
+
<script lang="ts" setup>
|
|
102
|
+
import { MazStar } from '@maz-ui/icons'
|
|
103
|
+
</script>
|
|
104
|
+
|
|
105
|
+
<template>
|
|
106
|
+
<MazIcon v-for="size in ['xs', 'sm', 'md', 'lg', 'xl']" :key="size" :size="size" :icon="MazStar" />
|
|
56
107
|
</template>
|
|
57
108
|
```
|
|
58
109
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
110
|
+
</template>
|
|
111
|
+
</ComponentDemo>
|
|
112
|
+
|
|
113
|
+
### Custom size
|
|
114
|
+
|
|
115
|
+
Can be any valid CSS size - e.g: `1em`, `1rem`, `10px`, `100%`, `10vw`, `10vh`
|
|
116
|
+
|
|
117
|
+
Allowed units: `px`, `em`, `rem`, `%`, `vw`, `vh`, `cm`, `mm`, `in`, `pt`, `pc`, `ex`
|
|
118
|
+
|
|
119
|
+
<ComponentDemo>
|
|
120
|
+
<div class="maz-flex maz-gap-2 maz-flex-wrap maz-items-center">
|
|
121
|
+
<MazIcon size="0.5em" :icon="icons.MazStar" />
|
|
122
|
+
<MazIcon size="1em" :icon="icons.MazStar" />
|
|
123
|
+
<MazIcon size="24px" :icon="icons.MazStar" />
|
|
124
|
+
<MazIcon size="4rem" :icon="icons.MazStar" />
|
|
125
|
+
<MazIcon size="8rem" :icon="icons.MazStar" />
|
|
65
126
|
</div>
|
|
66
|
-
</div>
|
|
67
127
|
|
|
68
|
-
<
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
128
|
+
<template #code>
|
|
129
|
+
|
|
130
|
+
```vue
|
|
131
|
+
<script lang="ts" setup>
|
|
132
|
+
import { MazStar } from '@maz-ui/icons'
|
|
72
133
|
</script>
|
|
73
134
|
|
|
135
|
+
<template>
|
|
136
|
+
<MazIcon size="0.5em" :icon="icons.MazStar" />
|
|
137
|
+
<MazIcon size="1em" :icon="icons.MazStar" />
|
|
138
|
+
<MazIcon size="24px" :icon="icons.MazStar" />
|
|
139
|
+
<MazIcon size="4rem" :icon="icons.MazStar" />
|
|
140
|
+
<MazIcon size="8rem" :icon="icons.MazStar" />
|
|
141
|
+
</template>
|
|
142
|
+
```
|
|
143
|
+
|
|
144
|
+
</template>
|
|
145
|
+
</ComponentDemo>
|
|
146
|
+
|
|
74
147
|
## Options
|
|
75
148
|
|
|
76
149
|
### Set MazIcon path globally
|
|
@@ -82,4 +155,36 @@ const app = createApp(App)
|
|
|
82
155
|
app.provide('mazIconPath', '/your/custom/path')
|
|
83
156
|
```
|
|
84
157
|
|
|
158
|
+
## All icons
|
|
159
|
+
|
|
160
|
+
### Get Icons Pack
|
|
161
|
+
|
|
162
|
+
This pack is the Heroicons icons set with some others from maz-ui
|
|
163
|
+
|
|
164
|
+
<MazBtn download href="/icons/_icons.zip" right-icon="arrow-down-tray">
|
|
165
|
+
Download pack
|
|
166
|
+
</MazBtn>
|
|
167
|
+
|
|
168
|
+
Source: [Hericons](https://heroicons.com/)
|
|
169
|
+
|
|
170
|
+
You can also find icons in the [icon set page](./../guide/icon-set.md)
|
|
171
|
+
|
|
172
|
+
<div class="flex items-start flex-wrap gap-05">
|
|
173
|
+
<div v-for="({ component, name }, i) in iconsList" :key="i" class="flex flex-col flex-center maz-p-2 maz-rounded maz-border">
|
|
174
|
+
<MazIcon :icon="component" size="lg" />
|
|
175
|
+
<span style="font-size: 11px;">
|
|
176
|
+
{{ name }}
|
|
177
|
+
</span>
|
|
178
|
+
</div>
|
|
179
|
+
</div>
|
|
180
|
+
|
|
181
|
+
<script setup lang="ts">
|
|
182
|
+
import * as icons from '@maz-ui/icons'
|
|
183
|
+
|
|
184
|
+
const iconsList = Object.entries(icons).map(([key, value]) => ({
|
|
185
|
+
name: key,
|
|
186
|
+
component: value,
|
|
187
|
+
}))
|
|
188
|
+
</script>
|
|
189
|
+
|
|
85
190
|
<!--@include: ./../../.vitepress/generated-docs/maz-icon.doc.md-->
|
|
@@ -45,11 +45,12 @@ const icons = Object.entries(MazIcons).sort(([nameA, _], [nameB, __]) => nameA.l
|
|
|
45
45
|
component,
|
|
46
46
|
}))
|
|
47
47
|
|
|
48
|
-
const { commonIcons, flags, flagsSquare, all } = icons.reduce((acc, iconComponent) => {
|
|
48
|
+
const { commonIcons, flags, flagsSquare, logos, all } = icons.reduce((acc, iconComponent) => {
|
|
49
49
|
if (iconComponent.name.startsWith('MazFlagSquare')) {
|
|
50
50
|
acc.flagsSquare.push(iconComponent)
|
|
51
51
|
}
|
|
52
52
|
else if (iconComponent.name.startsWith('MazFlag') && iconComponent.name.length >= 8) acc.flags.push(iconComponent)
|
|
53
|
+
else if (iconComponent.name.startsWith('MazLogo') && iconComponent.name.length >= 8) acc.logos.push(iconComponent)
|
|
53
54
|
else if (iconComponent.name.startsWith('Maz')) acc.commonIcons.push(iconComponent)
|
|
54
55
|
|
|
55
56
|
acc.all.push(iconComponent)
|
|
@@ -59,6 +60,7 @@ const { commonIcons, flags, flagsSquare, all } = icons.reduce((acc, iconComponen
|
|
|
59
60
|
commonIcons: [],
|
|
60
61
|
flags: [],
|
|
61
62
|
flagsSquare: [],
|
|
63
|
+
logos: [],
|
|
62
64
|
all: [],
|
|
63
65
|
})
|
|
64
66
|
|
|
@@ -67,6 +69,7 @@ const currentTab = ref(1)
|
|
|
67
69
|
const tabs = [
|
|
68
70
|
{ label: 'All', badge: { color: 'secondary', content: all.length, roundedSize: 'full' } },
|
|
69
71
|
{ label: 'Icons', badge: { color: 'secondary', content: commonIcons.length, roundedSize: 'full' } },
|
|
72
|
+
{ label: 'Logos', badge: { color: 'secondary', content: logos.length, roundedSize: 'full' } },
|
|
70
73
|
{ label: 'Flags', badge: { color: 'secondary', content: flags.length, roundedSize: 'full' } },
|
|
71
74
|
{ label: 'Flags Square', badge: { color: 'secondary', content: flagsSquare.length, roundedSize: 'full' } },
|
|
72
75
|
]
|
|
@@ -78,7 +81,7 @@ const search = ref()
|
|
|
78
81
|
const filteredIcons = computed(() => {
|
|
79
82
|
const _currentTab = currentTab.value
|
|
80
83
|
|
|
81
|
-
const baseIcons = _currentTab === 1 ? all : _currentTab === 2 ? commonIcons : _currentTab === 3 ?
|
|
84
|
+
const baseIcons = _currentTab === 1 ? all : _currentTab === 2 ? commonIcons : _currentTab === 3 ? logos : _currentTab === 4 ? flags : _currentTab === 5 ? flagsSquare : all
|
|
82
85
|
|
|
83
86
|
const _search = search.value?.toLowerCase().replace(/\s/g, '')
|
|
84
87
|
if (!_search) return baseIcons
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@maz-ui/mcp",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "4.1.7-beta.
|
|
4
|
+
"version": "4.1.7-beta.8",
|
|
5
5
|
"description": "Maz-UI ModelContextProtocol Client",
|
|
6
6
|
"author": "Louis Mazel <me@loicmazuel.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -52,32 +52,31 @@
|
|
|
52
52
|
"lint": "cross-env NODE_ENV=production eslint .",
|
|
53
53
|
"lint:fix": "pnpm lint --fix",
|
|
54
54
|
"typecheck": "tsc --noEmit",
|
|
55
|
-
"pre-commit": "lint-staged",
|
|
56
55
|
"test:unit": "pnpm generate:docs && vitest run",
|
|
57
56
|
"test:unit:watch": "pnpm generate:docs && vitest watch",
|
|
58
57
|
"test:unit:coverage": "pnpm generate:docs && vitest run --coverage"
|
|
59
58
|
},
|
|
60
59
|
"dependencies": {
|
|
61
|
-
"@maz-ui/node": "4.1.7-beta.
|
|
62
|
-
"@maz-ui/utils": "4.1.7-beta.
|
|
63
|
-
"@modelcontextprotocol/sdk": "^1.
|
|
60
|
+
"@maz-ui/node": "4.1.7-beta.7",
|
|
61
|
+
"@maz-ui/utils": "4.1.7-beta.7",
|
|
62
|
+
"@modelcontextprotocol/sdk": "^1.19.1"
|
|
64
63
|
},
|
|
65
64
|
"devDependencies": {
|
|
66
|
-
"@maz-ui/eslint-config": "4.1.7-beta.
|
|
67
|
-
"@modelcontextprotocol/inspector": "^0.
|
|
65
|
+
"@maz-ui/eslint-config": "4.1.7-beta.7",
|
|
66
|
+
"@modelcontextprotocol/inspector": "^0.17.0",
|
|
68
67
|
"@swc/core": "1.13.5",
|
|
69
|
-
"@types/node": "^24.
|
|
68
|
+
"@types/node": "^24.7.0",
|
|
70
69
|
"@vitest/coverage-v8": "^3.2.4",
|
|
71
|
-
"eslint": "^9.
|
|
72
|
-
"lint-staged": "^16.
|
|
70
|
+
"eslint": "^9.37.0",
|
|
71
|
+
"lint-staged": "^16.2.3",
|
|
73
72
|
"prettier": "^3.5.3",
|
|
74
73
|
"ts-node-maintained": "^10.9.5",
|
|
75
|
-
"tsx": "^4.20.
|
|
74
|
+
"tsx": "^4.20.6",
|
|
76
75
|
"unbuild": "^3.6.1",
|
|
77
76
|
"vitest": "^3.2.4"
|
|
78
77
|
},
|
|
79
78
|
"lint-staged": {
|
|
80
79
|
"*.{js,ts,mjs,mts,cjs,md,yml,json}": "cross-env NODE_ENV=production eslint --fix"
|
|
81
80
|
},
|
|
82
|
-
"gitHead": "
|
|
81
|
+
"gitHead": "c16a1daf251b65909792e97fd1c53580c7f47fea"
|
|
83
82
|
}
|