cic-kit 0.0.11 → 0.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -3
- package/docs/Btn.md +26 -0
- package/docs/LS.md +27 -0
- package/docs/Modal.md +43 -0
- package/docs/_.md +0 -0
- package/docs/toast.md +29 -0
- package/package.json +2 -1
package/README.md
CHANGED
|
@@ -52,9 +52,11 @@ Tra i componenti ci sono file di utility .ts e componenti .vue che possono utili
|
|
|
52
52
|
|
|
53
53
|
### docs
|
|
54
54
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
- [
|
|
55
|
+
### docs
|
|
56
|
+
|
|
57
|
+
- [Btn](https://unpkg.com/cic-kit/docs/Btn.md)
|
|
58
|
+
- [LocalStorage(LS)](https://unpkg.com/cic-kit/docs/LS.md)
|
|
59
|
+
- [Modal](https://unpkg.com/cic-kit/docs/Modal.md)
|
|
58
60
|
|
|
59
61
|
## Changelog
|
|
60
62
|
|
package/docs/Btn.md
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
#### Btn
|
|
2
|
+
|
|
3
|
+
Button Bootstrap con varianti, icona, loading e navigazione router.
|
|
4
|
+
|
|
5
|
+
| prop | default | type | utilizzo |
|
|
6
|
+
| ---------- | -------- | ----------------------------------------------------------------------------------------------- | --------------------------- |
|
|
7
|
+
| `variant` | `solid` | `"solid" \| "outline" \| "ghost" \| "link"` | stile del bottone |
|
|
8
|
+
| `color` | `dark` | `"primary" \| "secondary" \| "success" \| "danger" \| "warning" \| "info" \| "light" \| "dark"` | cambia colore Bootstrap |
|
|
9
|
+
| `size` | — | `"sm" \| "lg"` | dimensione Bootstrap |
|
|
10
|
+
| `block` | `false` | `boolean` | full width (`w-100`) |
|
|
11
|
+
| `disabled` | `false` | `boolean` | disabilita click |
|
|
12
|
+
| `type` | `button` | `"button" \| "submit" \| "reset"` | tipo HTML button |
|
|
13
|
+
| `to` | — | `RouteLocationRaw` | naviga con `router.push` |
|
|
14
|
+
| `loading` | `false` | `boolean` | mostra spinner e disabilita |
|
|
15
|
+
| `icon` | — | `string` | icona Material Symbols |
|
|
16
|
+
| `share` | — | `ShareLink` | condivide link al click |
|
|
17
|
+
|
|
18
|
+
```vue
|
|
19
|
+
<script setup lang="ts">
|
|
20
|
+
import { Btn } from "cic-kit";
|
|
21
|
+
</script>
|
|
22
|
+
|
|
23
|
+
<template>
|
|
24
|
+
<Btn color="primary">Salva</Btn>
|
|
25
|
+
</template>
|
|
26
|
+
```
|
package/docs/LS.md
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
#### LS
|
|
2
|
+
|
|
3
|
+
Wrapper tipizzato e robusto per localStorage con gestione errori e toast.
|
|
4
|
+
|
|
5
|
+
| prop | default | type | utilizzo |
|
|
6
|
+
| ----------- | ------- | ---------------------------------------------------- | ------------------ |
|
|
7
|
+
| `getStr` | — | `(key: LocalStorageKeyType) => string \| undefined` | legge valore raw |
|
|
8
|
+
| `getParsed` | — | `(key: LocalStorageKeyType) => any` | parse JSON sicuro |
|
|
9
|
+
| `set` | — | `(key: LocalStorageKeyType, value: any) => any` | salva serializzato |
|
|
10
|
+
| `update` | — | `(key: LocalStorageKeyType, data: any) => any` | merge o push |
|
|
11
|
+
| `push` | — | `(key: LocalStorageKeyType, ...items: any[]) => any` | aggiunge ad array |
|
|
12
|
+
| `remove` | — | `(key: LocalStorageKeyType) => void` | rimuove chiave |
|
|
13
|
+
| `delete` | — | `(key: LocalStorageKeyType) => void` | alias remove |
|
|
14
|
+
| `has` | — | `(key: LocalStorageKeyType) => boolean` | verifica esistenza |
|
|
15
|
+
| `keys` | — | `() => LocalStorageKeyType[]` | chiavi enum |
|
|
16
|
+
| `clearAll` | — | `() => void` | pulizia storage |
|
|
17
|
+
| `migrate` | — | `(oldKey, newKey) => void` | migrazione valore |
|
|
18
|
+
|
|
19
|
+
```vue
|
|
20
|
+
<script setup lang="ts">
|
|
21
|
+
import { LS } from "@/shared/utils/LS";
|
|
22
|
+
import { LocalStorageKey } from "@shared/enums/LocalStorageKey";
|
|
23
|
+
|
|
24
|
+
LS.set(LocalStorageKey.User, { name: "Mario" });
|
|
25
|
+
const user = LS.getParsed(LocalStorageKey.User);
|
|
26
|
+
</script>
|
|
27
|
+
```
|
package/docs/Modal.md
ADDED
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
#### Modal
|
|
2
|
+
|
|
3
|
+
Modal Bootstrap 5 controllata via `v-model`, con header/footer opzionali e bottoni default.
|
|
4
|
+
|
|
5
|
+
| prop | default | type | utilizzo |
|
|
6
|
+
| ----------------- | --------- | ----------------------------------------------- | ------------------------------ |
|
|
7
|
+
| `modelValue` | — | `boolean \| string \| number` | v-model apertura/chiusura |
|
|
8
|
+
| `title` | — | `string` | titolo header di default |
|
|
9
|
+
| `size` | — | `"sm" \| "lg" \| "xl"` | dimensione dialog |
|
|
10
|
+
| `fullscreen` | — | `true \| "sm" \| "md" \| "lg" \| "xl" \| "xxl"` | fullscreen responsive |
|
|
11
|
+
| `centered` | — | `boolean` | centra verticalmente |
|
|
12
|
+
| `scrollable` | — | `boolean` | body scrollabile |
|
|
13
|
+
| `backdrop` | `true` | `boolean \| "static"` | backdrop e comportamento |
|
|
14
|
+
| `keyboard` | `true` | `boolean` | chiusura con ESC |
|
|
15
|
+
| `teleportTo` | `"body"` | `string` | destinazione teleport |
|
|
16
|
+
| `okText` | — | `string` | se undefined, OK nascosto |
|
|
17
|
+
| `cancelText` | — | `string` | se undefined, Annulla nascosto |
|
|
18
|
+
| `okClass` | — | `string` | classi extra bottone OK |
|
|
19
|
+
| `cancelClass` | — | `string` | classi extra bottone Annulla |
|
|
20
|
+
| `okColor` | — | `BtnColor` | colore Btn OK |
|
|
21
|
+
| `cancelColor` | — | `BtnColor` | colore Btn Annulla |
|
|
22
|
+
| `okVariant` | — | `BtnVariant` | variante Btn OK |
|
|
23
|
+
| `cancelVariant` | `"ghost"` | `BtnVariant` | variante Btn Annulla |
|
|
24
|
+
| `closeOnOk` | `true` | `boolean` | chiude dopo OK |
|
|
25
|
+
| `hideHeaderClose` | — | `boolean` | nasconde la X |
|
|
26
|
+
| `id` | — | `string` | id del root modal |
|
|
27
|
+
| `onOk` | — | `() => void \| Promise<void>` | azione su OK |
|
|
28
|
+
|
|
29
|
+
```vue
|
|
30
|
+
<script setup lang="ts">
|
|
31
|
+
import { ref } from "vue";
|
|
32
|
+
|
|
33
|
+
const open = ref(false);
|
|
34
|
+
</script>
|
|
35
|
+
|
|
36
|
+
<template>
|
|
37
|
+
<button class="btn btn-primary" @click="open = true">Apri</button>
|
|
38
|
+
|
|
39
|
+
<ModalCmp v-model="open" title="Titolo" cancelText="Annulla" okText="OK">
|
|
40
|
+
Contenuto della modal
|
|
41
|
+
</ModalCmp>
|
|
42
|
+
</template>
|
|
43
|
+
```
|
package/docs/_.md
ADDED
|
File without changes
|
package/docs/toast.md
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
#### ToastStore
|
|
2
|
+
|
|
3
|
+
Store reattivo per creare, gestire e rimuovere toast (queue + timer).
|
|
4
|
+
|
|
5
|
+
| prop | default | type | utilizzo |
|
|
6
|
+
| ----------------- | ------- | ------------------------------ | -------------------------- |
|
|
7
|
+
| `queue` | `[]` | `Toast[]` | lista toast attivi |
|
|
8
|
+
| `info` | — | `(content, duration?) => void` | toast informativo |
|
|
9
|
+
| `success` | — | `(content, duration?) => void` | toast successo |
|
|
10
|
+
| `warning` | — | `(content, duration?) => void` | toast warning |
|
|
11
|
+
| `error` | — | `(content, duration?) => void` | toast errore (+log in DEV) |
|
|
12
|
+
| `danger` | — | `(content, duration?) => void` | alias di `error` |
|
|
13
|
+
| `primary` | — | `(content, duration?) => void` | variante primary |
|
|
14
|
+
| `secondary` | — | `(content, duration?) => void` | variante secondary |
|
|
15
|
+
| `log` | — | `(content, duration?) => void` | solo DEV, default 5000ms |
|
|
16
|
+
| `logError` | — | `(content, duration?) => void` | solo DEV, default 5000ms |
|
|
17
|
+
| `start` | — | `(toast: Toast) => void` | avvia timer rimozione |
|
|
18
|
+
| `stop` | — | `(toast: Toast) => void` | pausa timer e ricalcolo |
|
|
19
|
+
| `removeToastById` | — | `(id: string) => void` | rimuove per id |
|
|
20
|
+
|
|
21
|
+
```vue
|
|
22
|
+
<script setup lang="ts">
|
|
23
|
+
import { toast } from "@/stores/toast";
|
|
24
|
+
</script>
|
|
25
|
+
|
|
26
|
+
<template>
|
|
27
|
+
<button type="button" @click="toast.success("Operazione completata")">Mostra toast</button>
|
|
28
|
+
</template>
|
|
29
|
+
```
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "cic-kit",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.12",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/index.cjs",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
@@ -21,6 +21,7 @@
|
|
|
21
21
|
"src/styles",
|
|
22
22
|
"src/vue-shim.d.ts",
|
|
23
23
|
"README.md",
|
|
24
|
+
"docs",
|
|
24
25
|
"package.json"
|
|
25
26
|
],
|
|
26
27
|
"sideEffects": [
|