@mixd-id/web-scaffold 0.1.240411051 → 0.1.240411053
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/package.json
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
|
|
4
4
|
<TreeViewItem v-for="(item, index) in modelValue"
|
|
5
5
|
:item="item"
|
|
6
|
+
:depth="0"
|
|
6
7
|
:parent="modelValue"
|
|
7
8
|
:selected-item="selectedItem"
|
|
8
9
|
@moveup="moveUp(item)"
|
|
@@ -11,9 +12,13 @@
|
|
|
11
12
|
@remove="modelValue.splice(index, 1);$emit('change')"
|
|
12
13
|
@add="(items) => $emit('add', items)"
|
|
13
14
|
@duplicate="(parent, item) => $emit('duplicate', parent, item)">
|
|
14
|
-
<template #default="{ item, parent }">
|
|
15
|
-
<slot :item="item" :parent="parent"></slot>
|
|
15
|
+
<template #default="{ item, parent, depth }">
|
|
16
|
+
<slot :item="item" :parent="parent" :depth="depth"></slot>
|
|
16
17
|
</template>
|
|
18
|
+
|
|
19
|
+
<template #item="{ item, parent, depth }">
|
|
20
|
+
<slot name="item" :item="item" :parent="parent" :depth="depth"></slot>
|
|
21
|
+
</template>
|
|
17
22
|
</TreeViewItem>
|
|
18
23
|
|
|
19
24
|
</div>
|
|
@@ -12,28 +12,30 @@
|
|
|
12
12
|
<svg v-else width="14" height="14" class="fill-text-300 pointer-events-none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512"><path d="M0 384.662V127.338c0-17.818 21.543-26.741 34.142-14.142l128.662 128.662c7.81 7.81 7.81 20.474 0 28.284L34.142 398.804C21.543 411.404 0 402.48 0 384.662z"/></svg>
|
|
13
13
|
</button>
|
|
14
14
|
|
|
15
|
-
|
|
16
|
-
<
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
<
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
<
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
15
|
+
<slot name="item" :item="item" :parent="parent" :depth="depth">
|
|
16
|
+
<div class="flex-1 flex px-3">
|
|
17
|
+
<slot :item="item" :parent="parent"></slot>
|
|
18
|
+
</div>
|
|
19
|
+
|
|
20
|
+
<div class="flex flex-row items-center">
|
|
21
|
+
<button v-if="item && Array.isArray(item.items)"
|
|
22
|
+
type="button"
|
|
23
|
+
class="p-1"
|
|
24
|
+
@click="add">
|
|
25
|
+
<svg width="16" height="16" class="fill-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M376 232H216V72c0-4.42-3.58-8-8-8h-32c-4.42 0-8 3.58-8 8v160H8c-4.42 0-8 3.58-8 8v32c0 4.42 3.58 8 8 8h160v160c0 4.42 3.58 8 8 8h32c4.42 0 8-3.58 8-8V280h160c4.42 0 8-3.58 8-8v-32c0-4.42-3.58-8-8-8z"/></svg>
|
|
26
|
+
</button>
|
|
27
|
+
|
|
28
|
+
<button type="button" class="p-1" @click="duplicate">
|
|
29
|
+
<svg class="fill-text-300 hover:fill-primary" width="13" height="13" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.0.0-alpha3 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M502.6 70.63l-61.25-61.25C435.4 3.371 427.2 0 418.7 0H255.1c-35.35 0-64 28.66-64 64l.0195 256C192 355.4 220.7 384 256 384h192c35.2 0 64-28.8 64-64V93.25C512 84.77 508.6 76.63 502.6 70.63zM464 320c0 8.836-7.164 16-16 16H255.1c-8.838 0-16-7.164-16-16L239.1 64.13c0-8.836 7.164-16 16-16h128L384 96c0 17.67 14.33 32 32 32h47.1V320zM272 448c0 8.836-7.164 16-16 16H63.1c-8.838 0-16-7.164-16-16L47.98 192.1c0-8.836 7.164-16 16-16H160V128H63.99c-35.35 0-64 28.65-64 64l.0098 256C.002 483.3 28.66 512 64 512h192c35.2 0 64-28.8 64-64v-32h-47.1L272 448z"/></svg>
|
|
30
|
+
</button>
|
|
31
|
+
|
|
32
|
+
<button type="button"
|
|
33
|
+
class="p-1"
|
|
34
|
+
@click="$emit('remove')">
|
|
35
|
+
<svg width="16" height="16" class="fill-text-300 hover:fill-red-500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path d="M193.94 256L296.5 153.44l21.15-21.15c3.12-3.12 3.12-8.19 0-11.31l-22.63-22.63c-3.12-3.12-8.19-3.12-11.31 0L160 222.06 36.29 98.34c-3.12-3.12-8.19-3.12-11.31 0L2.34 120.97c-3.12 3.12-3.12 8.19 0 11.31L126.06 256 2.34 379.71c-3.12 3.12-3.12 8.19 0 11.31l22.63 22.63c3.12 3.12 8.19 3.12 11.31 0L160 289.94 262.56 392.5l21.15 21.15c3.12 3.12 8.19 3.12 11.31 0l22.63-22.63c3.12-3.12 3.12-8.19 0-11.31L193.94 256z"/></svg>
|
|
36
|
+
</button>
|
|
37
|
+
</div>
|
|
38
|
+
</slot>
|
|
37
39
|
|
|
38
40
|
</div>
|
|
39
41
|
<div ref="container"
|
|
@@ -43,6 +45,7 @@
|
|
|
43
45
|
<TreeViewItem v-for="(subItem, index) in item.items"
|
|
44
46
|
:item="subItem"
|
|
45
47
|
:parent="item.items"
|
|
48
|
+
:depth="depth + 1"
|
|
46
49
|
:selected-item="selectedItem"
|
|
47
50
|
@moveup="moveUp(subItem)"
|
|
48
51
|
@movedown="moveDown(subItem)"
|
|
@@ -50,8 +53,12 @@
|
|
|
50
53
|
@add="(items) => $emit('add', items)"
|
|
51
54
|
@duplicate="(parent, item) => $emit('duplicate', parent, item)"
|
|
52
55
|
@change="$emit('change')">
|
|
53
|
-
<template #default="{ item }">
|
|
54
|
-
<slot :item="item"></slot>
|
|
56
|
+
<template #default="{ item, parent, depth }">
|
|
57
|
+
<slot :item="item" :parent="parent" :depth="depth"></slot>
|
|
58
|
+
</template>
|
|
59
|
+
|
|
60
|
+
<template #item="{ item, parent, depth }">
|
|
61
|
+
<slot name="item" :item="item" :parent="parent" :depth="depth"></slot>
|
|
55
62
|
</template>
|
|
56
63
|
</TreeViewItem>
|
|
57
64
|
</div>
|
|
@@ -82,6 +89,8 @@ export default{
|
|
|
82
89
|
type: [ Number, String ],
|
|
83
90
|
default: 1
|
|
84
91
|
},
|
|
92
|
+
|
|
93
|
+
depth: Number
|
|
85
94
|
},
|
|
86
95
|
|
|
87
96
|
methods: {
|
|
@@ -400,10 +400,14 @@ export default{
|
|
|
400
400
|
['Montserrat', 'Montserrat, sans-serif'],
|
|
401
401
|
['Noto Sans', '"Noto Sans", sans-serif'],
|
|
402
402
|
['Oswald', 'Oswald, sans-serif'],
|
|
403
|
+
['Oxygen', 'Oxygen, sans-serif'],
|
|
403
404
|
['Poppins', 'Poppins, sans-serif'],
|
|
405
|
+
['Quantico', 'Quantico, sans-serif'],
|
|
404
406
|
['Raleway', 'Raleway, sans-serif'],
|
|
407
|
+
['Reddit Sans', '"Reddit Sans", sans-serif'],
|
|
405
408
|
['Roboto', '"Roboto", sans-serif'],
|
|
406
409
|
['Roboto Slab', '"Roboto Slab", serif'],
|
|
410
|
+
['Volkhov', 'Volkhov, serif'],
|
|
407
411
|
['Work Sans', '"Work Sans", serif'],
|
|
408
412
|
],
|
|
409
413
|
|
|
@@ -754,10 +754,14 @@ export default{
|
|
|
754
754
|
'Montserrat, sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');`,
|
|
755
755
|
'"Noto Sans", sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;800&display=swap');`,
|
|
756
756
|
'Oswald, sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;700&display=swap');`,
|
|
757
|
+
'Oxygen, sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Oxygen:wght@400;700&display=swap');`,
|
|
757
758
|
'Poppins, sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');`,
|
|
759
|
+
'Quantico, sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Quantico:wght@400;700&display=swap"');`,
|
|
758
760
|
'Raleway, sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&display=swap');`,
|
|
761
|
+
'"Reddit Sans", sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Reddit+Sans:wght@400;700&display=swap');`,
|
|
759
762
|
'"Roboto", sans-serif': `@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');`,
|
|
760
763
|
'"Roboto Slab", serif': `@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400;800&display=swap');`,
|
|
764
|
+
'Volkhov, serif': `@import url('https://fonts.googleapis.com/css2?family=Volkhov:wght@400;700&display=swap');`,
|
|
761
765
|
'"Work Sans", serif': `@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;700&display=swap');`,
|
|
762
766
|
}
|
|
763
767
|
|