@antify/ui 2.2.1 → 2.2.3
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/components/AntAccordion.vue +25 -12
- package/dist/components/AntAccordionItem.vue +28 -13
- package/dist/components/AntAlert.vue +25 -15
- package/dist/components/AntCard.vue +26 -14
- package/dist/components/AntContent.vue +4 -4
- package/dist/components/AntDropdown.vue +41 -23
- package/dist/components/AntIcon.vue +18 -6
- package/dist/components/AntKeycap.vue +31 -16
- package/dist/components/AntListGroup.vue +13 -11
- package/dist/components/AntListGroupItem.vue +19 -9
- package/dist/components/AntModal.vue +26 -15
- package/dist/components/AntPagination.vue +28 -15
- package/dist/components/AntPopover.vue +74 -51
- package/dist/components/AntSkeleton.vue +8 -4
- package/dist/components/AntSpinner.vue +14 -6
- package/dist/components/AntTag.vue +25 -13
- package/dist/components/AntToast.vue +19 -11
- package/dist/components/AntToaster.vue +13 -5
- package/dist/components/AntTooltip.vue +78 -54
- package/dist/components/__stories/AntAccordion.stories.js +4 -4
- package/dist/components/__stories/AntAccordion.stories.mjs +50 -17
- package/dist/components/__stories/AntAlert.stories.mjs +18 -5
- package/dist/components/__stories/AntCard.stories.mjs +36 -10
- package/dist/components/__stories/AntContent.stories.mjs +14 -4
- package/dist/components/__stories/AntDropdown.stories.mjs +20 -4
- package/dist/components/__stories/AntIcon.stories.mjs +38 -12
- package/dist/components/__stories/AntKeycap.stories.mjs +35 -10
- package/dist/components/__stories/AntListGroup.stories.d.ts +1 -1
- package/dist/components/__stories/AntListGroup.stories.mjs +22 -4
- package/dist/components/__stories/AntListGroupItem.stories.mjs +27 -8
- package/dist/components/__stories/AntModal.stories.mjs +17 -4
- package/dist/components/__stories/AntPagination.stories.mjs +21 -6
- package/dist/components/__stories/AntPopover.stories.mjs +20 -4
- package/dist/components/__stories/AntSkeleton.stories.mjs +17 -5
- package/dist/components/__stories/AntSpinner.stories.mjs +33 -9
- package/dist/components/__stories/AntTag.stories.mjs +28 -8
- package/dist/components/__stories/AntToast.stories.mjs +19 -5
- package/dist/components/__stories/AntToaster.stories.d.ts +1 -1
- package/dist/components/__stories/AntToaster.stories.mjs +35 -9
- package/dist/components/__stories/AntTooltip.stories.js +1 -1
- package/dist/components/__stories/AntTooltip.stories.mjs +44 -13
- package/dist/components/buttons/AntActionButton.vue +38 -29
- package/dist/components/buttons/AntButton.vue +34 -13
- package/dist/components/buttons/AntCreateButton.vue +11 -4
- package/dist/components/buttons/AntDeleteButton.vue +11 -4
- package/dist/components/buttons/AntDuplicateButton.vue +11 -4
- package/dist/components/buttons/AntEditButton.vue +11 -4
- package/dist/components/buttons/AntSaveAndNewButton.vue +11 -4
- package/dist/components/buttons/AntSaveButton.vue +11 -4
- package/dist/components/buttons/__stories/AntActionButton.stories.mjs +35 -10
- package/dist/components/buttons/__stories/AntButton.stories.mjs +77 -23
- package/dist/components/buttons/__stories/AntCreateButton.stories.mjs +25 -7
- package/dist/components/buttons/__stories/AntDeleteButton.stories.mjs +25 -7
- package/dist/components/buttons/__stories/AntDuplicateButton.stories.mjs +25 -7
- package/dist/components/buttons/__stories/AntEditButton.stories.mjs +25 -7
- package/dist/components/buttons/__stories/AntSaveAndNewButton.stories.mjs +25 -7
- package/dist/components/buttons/__stories/AntSaveButton.stories.mjs +25 -7
- package/dist/components/crud/AntCrud.vue +6 -6
- package/dist/components/crud/AntCrudDetail.vue +8 -5
- package/dist/components/crud/AntCrudDetailActions.vue +14 -8
- package/dist/components/crud/AntCrudDetailNav.vue +21 -13
- package/dist/components/crud/AntCrudTableFilter.vue +29 -17
- package/dist/components/crud/AntCrudTableNav.vue +36 -22
- package/dist/components/crud/__stories/AntCrud.stories.mjs +17 -5
- package/dist/components/crud/__stories/AntCrudDetail.stories.mjs +11 -3
- package/dist/components/crud/__stories/AntCrudDetailActions.stories.mjs +10 -2
- package/dist/components/crud/__stories/AntCrudDetailNav.stories.mjs +11 -3
- package/dist/components/crud/__stories/AntCrudTableFilter.stories.mjs +17 -5
- package/dist/components/crud/__stories/AntCrudTableNav.stories.mjs +23 -7
- package/dist/components/dialogs/AntDeleteDialog.vue +13 -5
- package/dist/components/dialogs/AntDialog.vue +23 -13
- package/dist/components/dialogs/__stories/AndDeleteDialog.stories.mjs +12 -3
- package/dist/components/dialogs/__stories/AntDialog.stories.mjs +28 -7
- package/dist/components/forms/AntField.vue +18 -7
- package/dist/components/forms/AntFormGroup.vue +9 -5
- package/dist/components/forms/AntFormGroupLabel.vue +1 -1
- package/dist/components/forms/__stories/AntField.stories.mjs +37 -9
- package/dist/components/forms/__stories/AntFormGroup.stories.mjs +20 -5
- package/dist/components/forms/__stories/AntFormGroupLabel.stories.mjs +11 -3
- package/dist/components/index.d.ts +1 -1
- package/dist/components/inputs/AntCheckbox.vue +60 -36
- package/dist/components/inputs/AntCheckboxGroup.vue +39 -15
- package/dist/components/inputs/AntDateInput.vue +35 -12
- package/dist/components/inputs/AntNumberInput.vue +33 -12
- package/dist/components/inputs/AntPasswordInput.vue +32 -11
- package/dist/components/inputs/AntRadio.vue +57 -34
- package/dist/components/inputs/AntRadioGroup.vue +60 -35
- package/dist/components/inputs/AntRangeSlider.vue +31 -12
- package/dist/components/inputs/AntSearch.vue +19 -7
- package/dist/components/inputs/AntSelect.vue +107 -83
- package/dist/components/inputs/AntSwitch.vue +35 -18
- package/dist/components/inputs/AntSwitcher.vue +30 -15
- package/dist/components/inputs/AntTagInput.vue +91 -61
- package/dist/components/inputs/AntTextInput.vue +31 -11
- package/dist/components/inputs/AntTextarea.vue +53 -25
- package/dist/components/inputs/AntUnitInput.vue +33 -12
- package/dist/components/inputs/Elements/AntBaseInput.vue +47 -18
- package/dist/components/inputs/Elements/AntInputDescription.vue +16 -8
- package/dist/components/inputs/Elements/AntInputLabel.vue +13 -5
- package/dist/components/inputs/Elements/AntInputLimiter.vue +13 -5
- package/dist/components/inputs/Elements/AntSelectMenu.vue +65 -41
- package/dist/components/inputs/Elements/__stories/AntBaseInput.stories.mjs +104 -27
- package/dist/components/inputs/Elements/__stories/AntInputDescription.stories.mjs +33 -9
- package/dist/components/inputs/Elements/__stories/AntInputLabel.stories.mjs +34 -9
- package/dist/components/inputs/Elements/__stories/AntInputLimiter.stories.mjs +33 -9
- package/dist/components/inputs/Elements/index.d.ts +1 -1
- package/dist/components/inputs/__stories/AntCheckbox.stories.mjs +34 -9
- package/dist/components/inputs/__stories/AntCheckboxGroup.stories.mjs +45 -21
- package/dist/components/inputs/__stories/AntDateInput.stories.mjs +52 -14
- package/dist/components/inputs/__stories/AntNumberInput.stories.mjs +66 -17
- package/dist/components/inputs/__stories/AntPasswordInput.stories.mjs +51 -13
- package/dist/components/inputs/__stories/AntRadioGroup.stories.mjs +45 -12
- package/dist/components/inputs/__stories/AntRangeSlider.stories.mjs +16 -5
- package/dist/components/inputs/__stories/AntSearch.stories.mjs +41 -10
- package/dist/components/inputs/__stories/AntSelect.stories.mjs +59 -15
- package/dist/components/inputs/__stories/AntSwitch.stories.js +126 -102
- package/dist/components/inputs/__stories/AntSwitch.stories.mjs +162 -112
- package/dist/components/inputs/__stories/AntSwitcher.stories.mjs +38 -10
- package/dist/components/inputs/__stories/AntTagInput.stories.mjs +46 -12
- package/dist/components/inputs/__stories/AntTextInput.stories.mjs +59 -16
- package/dist/components/inputs/__stories/AntTextarea.stories.mjs +47 -13
- package/dist/components/inputs/__stories/AntUnitInput.stories.mjs +46 -12
- package/dist/components/layouts/AntNavLeftLayout.vue +12 -6
- package/dist/components/layouts/__stories/AntNavLeftLayout.stories.mjs +10 -2
- package/dist/components/navbar/AntNavbar.vue +7 -3
- package/dist/components/navbar/AntNavbarItem.vue +12 -6
- package/dist/components/navbar/__stories/AntNavbar.stories.mjs +59 -37
- package/dist/components/table/AntCollapsibleTableRowContent.vue +7 -5
- package/dist/components/table/AntTable.vue +210 -165
- package/dist/components/table/AntTableSkeleton.vue +126 -0
- package/dist/components/table/AntTableSortButton.vue +22 -13
- package/dist/components/table/AntTd.vue +21 -17
- package/dist/components/table/AntTh.vue +19 -12
- package/dist/components/table/__stories/AntTable.stories.js +1 -1
- package/dist/components/table/__stories/AntTable.stories.mjs +190 -62
- package/dist/components/tabs/AntTabItem.vue +20 -8
- package/dist/components/tabs/AntTabs.vue +35 -21
- package/dist/components/tabs/__stories/AntTabItem.stories.mjs +23 -7
- package/dist/components/tabs/__stories/AntTabs.stories.mjs +45 -13
- package/dist/components/transitions/AntTransitionCollapseHeight.vue +1 -1
- package/dist/composables/useToaster.mjs +25 -7
- package/dist/index.css +1 -0
- package/dist/utils.mjs +3 -1
- package/package.json +23 -16
- package/dist/tailwind.config.d.ts +0 -3
- package/dist/tailwind.config.js +0 -198
- package/dist/tailwind.config.mjs +0 -189
|
@@ -1,37 +1,65 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import {
|
|
2
|
+
Size
|
|
3
|
+
} from "../../../enums/Size.enum.mjs";
|
|
4
|
+
import {
|
|
5
|
+
InputState
|
|
6
|
+
} from "../../../enums/index.mjs";
|
|
3
7
|
import AntPasswordInput from "../AntPasswordInput.vue";
|
|
4
8
|
import AntFormGroup from "../../forms/AntFormGroup.vue";
|
|
5
9
|
import AntFormGroupLabel from "../../forms/AntFormGroupLabel.vue";
|
|
6
10
|
const meta = {
|
|
7
11
|
title: "Inputs/Password Input",
|
|
8
12
|
component: AntPasswordInput,
|
|
9
|
-
parameters: {
|
|
13
|
+
parameters: {
|
|
14
|
+
controls: {
|
|
15
|
+
sort: "requiredFirst"
|
|
16
|
+
}
|
|
17
|
+
},
|
|
10
18
|
argTypes: {
|
|
11
19
|
modelValue: {
|
|
12
20
|
control: "text",
|
|
13
|
-
table: {
|
|
21
|
+
table: {
|
|
22
|
+
type: {
|
|
23
|
+
summary: "string|null"
|
|
24
|
+
}
|
|
25
|
+
}
|
|
14
26
|
},
|
|
15
27
|
state: {
|
|
16
|
-
control: {
|
|
28
|
+
control: {
|
|
29
|
+
type: "select"
|
|
30
|
+
},
|
|
17
31
|
options: Object.values(InputState)
|
|
18
32
|
},
|
|
19
33
|
size: {
|
|
20
|
-
control: {
|
|
34
|
+
control: {
|
|
35
|
+
type: "select"
|
|
36
|
+
},
|
|
21
37
|
options: Object.values(Size),
|
|
22
|
-
table: {
|
|
38
|
+
table: {
|
|
39
|
+
defaultValue: {
|
|
40
|
+
summary: Size.md
|
|
41
|
+
}
|
|
42
|
+
}
|
|
23
43
|
},
|
|
24
44
|
placeholder: {
|
|
25
|
-
table: {
|
|
45
|
+
table: {
|
|
46
|
+
defaultValue: {
|
|
47
|
+
summary: "this.label"
|
|
48
|
+
}
|
|
49
|
+
}
|
|
26
50
|
}
|
|
27
51
|
}
|
|
28
52
|
};
|
|
29
53
|
export default meta;
|
|
30
54
|
export const Docs = {
|
|
31
55
|
render: (args) => ({
|
|
32
|
-
components: {
|
|
56
|
+
components: {
|
|
57
|
+
AntPasswordInput
|
|
58
|
+
},
|
|
33
59
|
setup() {
|
|
34
|
-
return {
|
|
60
|
+
return {
|
|
61
|
+
args
|
|
62
|
+
};
|
|
35
63
|
},
|
|
36
64
|
template: `
|
|
37
65
|
<AntPasswordInput
|
|
@@ -47,12 +75,22 @@ export const Docs = {
|
|
|
47
75
|
};
|
|
48
76
|
export const Summary = {
|
|
49
77
|
parameters: {
|
|
50
|
-
chromatic: {
|
|
78
|
+
chromatic: {
|
|
79
|
+
disableSnapshot: false
|
|
80
|
+
}
|
|
51
81
|
},
|
|
52
82
|
render: (args) => ({
|
|
53
|
-
components: {
|
|
83
|
+
components: {
|
|
84
|
+
AntPasswordInput,
|
|
85
|
+
AntFormGroup,
|
|
86
|
+
AntFormGroupLabel
|
|
87
|
+
},
|
|
54
88
|
setup() {
|
|
55
|
-
return {
|
|
89
|
+
return {
|
|
90
|
+
args,
|
|
91
|
+
InputState,
|
|
92
|
+
Size
|
|
93
|
+
};
|
|
56
94
|
},
|
|
57
95
|
template: `
|
|
58
96
|
<AntFormGroup>
|
|
@@ -1,13 +1,24 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
ref
|
|
3
|
+
} from "vue";
|
|
2
4
|
import AntRadioGroup from "../AntRadioGroup.vue";
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
+
import {
|
|
6
|
+
InputState,
|
|
7
|
+
Size
|
|
8
|
+
} from "../../../enums/index.mjs";
|
|
9
|
+
import {
|
|
10
|
+
Direction
|
|
11
|
+
} from "../../../enums/Direction.enum.mjs";
|
|
5
12
|
import AntFormGroupLabel from "../../forms/AntFormGroupLabel.vue";
|
|
6
13
|
import AntFormGroup from "../../forms/AntFormGroup.vue";
|
|
7
14
|
const meta = {
|
|
8
15
|
title: "Inputs/Radio Group",
|
|
9
16
|
component: AntRadioGroup,
|
|
10
|
-
parameters: {
|
|
17
|
+
parameters: {
|
|
18
|
+
controls: {
|
|
19
|
+
sort: "requiredFirst"
|
|
20
|
+
}
|
|
21
|
+
},
|
|
11
22
|
argTypes: {
|
|
12
23
|
label: {
|
|
13
24
|
description: "The label for the radio widget"
|
|
@@ -40,15 +51,21 @@ const meta = {
|
|
|
40
51
|
}
|
|
41
52
|
},
|
|
42
53
|
direction: {
|
|
43
|
-
control: {
|
|
54
|
+
control: {
|
|
55
|
+
type: "select"
|
|
56
|
+
},
|
|
44
57
|
options: Object.values(Direction)
|
|
45
58
|
},
|
|
46
59
|
state: {
|
|
47
|
-
control: {
|
|
60
|
+
control: {
|
|
61
|
+
type: "select"
|
|
62
|
+
},
|
|
48
63
|
options: Object.values(InputState)
|
|
49
64
|
},
|
|
50
65
|
size: {
|
|
51
|
-
control: {
|
|
66
|
+
control: {
|
|
67
|
+
type: "select"
|
|
68
|
+
},
|
|
52
69
|
options: Object.values(Size)
|
|
53
70
|
}
|
|
54
71
|
}
|
|
@@ -78,10 +95,15 @@ const simpleButtons = [
|
|
|
78
95
|
];
|
|
79
96
|
export const Docs = {
|
|
80
97
|
render: (args) => ({
|
|
81
|
-
components: {
|
|
98
|
+
components: {
|
|
99
|
+
AntRadioGroup
|
|
100
|
+
},
|
|
82
101
|
setup() {
|
|
83
102
|
const value = ref("");
|
|
84
|
-
return {
|
|
103
|
+
return {
|
|
104
|
+
args,
|
|
105
|
+
value
|
|
106
|
+
};
|
|
85
107
|
},
|
|
86
108
|
template: `
|
|
87
109
|
<AntRadioGroup v-bind="args" v-model="value"/>
|
|
@@ -94,13 +116,24 @@ export const Docs = {
|
|
|
94
116
|
};
|
|
95
117
|
export const summary = {
|
|
96
118
|
parameters: {
|
|
97
|
-
chromatic: {
|
|
119
|
+
chromatic: {
|
|
120
|
+
disableSnapshot: false
|
|
121
|
+
}
|
|
98
122
|
},
|
|
99
123
|
render: (args) => ({
|
|
100
|
-
components: {
|
|
124
|
+
components: {
|
|
125
|
+
AntRadioGroup,
|
|
126
|
+
AntFormGroupLabel,
|
|
127
|
+
AntFormGroup
|
|
128
|
+
},
|
|
101
129
|
setup() {
|
|
102
130
|
const value = ref("radio-3");
|
|
103
|
-
return {
|
|
131
|
+
return {
|
|
132
|
+
args,
|
|
133
|
+
value,
|
|
134
|
+
InputState,
|
|
135
|
+
Size
|
|
136
|
+
};
|
|
104
137
|
},
|
|
105
138
|
template: `
|
|
106
139
|
<AntFormGroup>
|
|
@@ -1,6 +1,10 @@
|
|
|
1
1
|
import AntRangeSlider from "../AntRangeSlider.vue";
|
|
2
|
-
import {
|
|
3
|
-
|
|
2
|
+
import {
|
|
3
|
+
ref
|
|
4
|
+
} from "vue";
|
|
5
|
+
import {
|
|
6
|
+
InputState
|
|
7
|
+
} from "../../../enums/index.mjs";
|
|
4
8
|
const meta = {
|
|
5
9
|
title: "Inputs/Range Slider",
|
|
6
10
|
component: AntRangeSlider,
|
|
@@ -20,7 +24,9 @@ const meta = {
|
|
|
20
24
|
description: "Reactive value"
|
|
21
25
|
},
|
|
22
26
|
state: {
|
|
23
|
-
control: {
|
|
27
|
+
control: {
|
|
28
|
+
type: "select"
|
|
29
|
+
},
|
|
24
30
|
options: Object.values(InputState)
|
|
25
31
|
}
|
|
26
32
|
}
|
|
@@ -28,10 +34,15 @@ const meta = {
|
|
|
28
34
|
export default meta;
|
|
29
35
|
export const Docs = {
|
|
30
36
|
render: (args) => ({
|
|
31
|
-
components: {
|
|
37
|
+
components: {
|
|
38
|
+
AntRangeSlider
|
|
39
|
+
},
|
|
32
40
|
setup() {
|
|
33
41
|
const value = ref(1);
|
|
34
|
-
return {
|
|
42
|
+
return {
|
|
43
|
+
args,
|
|
44
|
+
value
|
|
45
|
+
};
|
|
35
46
|
},
|
|
36
47
|
template: `
|
|
37
48
|
<AntRangeSlider v-bind="args" v-model="value"/>
|
|
@@ -1,19 +1,33 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
Size
|
|
3
|
+
} from "../../../enums/Size.enum.mjs";
|
|
2
4
|
import AntSearch from "../AntSearch.vue";
|
|
3
5
|
import AntFormGroup from "../../forms/AntFormGroup.vue";
|
|
4
6
|
import AntFormGroupLabel from "../../forms/AntFormGroupLabel.vue";
|
|
5
|
-
import {
|
|
7
|
+
import {
|
|
8
|
+
ref
|
|
9
|
+
} from "vue";
|
|
6
10
|
const meta = {
|
|
7
11
|
title: "Inputs/Search",
|
|
8
12
|
component: AntSearch,
|
|
9
|
-
parameters: {
|
|
13
|
+
parameters: {
|
|
14
|
+
controls: {
|
|
15
|
+
sort: "requiredFirst"
|
|
16
|
+
}
|
|
17
|
+
},
|
|
10
18
|
argTypes: {
|
|
11
19
|
modelValue: {
|
|
12
20
|
control: "text",
|
|
13
|
-
table: {
|
|
21
|
+
table: {
|
|
22
|
+
type: {
|
|
23
|
+
summary: "string|null"
|
|
24
|
+
}
|
|
25
|
+
}
|
|
14
26
|
},
|
|
15
27
|
size: {
|
|
16
|
-
control: {
|
|
28
|
+
control: {
|
|
29
|
+
type: "select"
|
|
30
|
+
},
|
|
17
31
|
options: Object.values(Size)
|
|
18
32
|
},
|
|
19
33
|
inputTimeout: {
|
|
@@ -23,16 +37,24 @@ const meta = {
|
|
|
23
37
|
description: "Read and write the value into url as urldecoded string. Using the given string as query name."
|
|
24
38
|
},
|
|
25
39
|
placeholder: {
|
|
26
|
-
table: {
|
|
40
|
+
table: {
|
|
41
|
+
defaultValue: {
|
|
42
|
+
summary: "Search"
|
|
43
|
+
}
|
|
44
|
+
}
|
|
27
45
|
}
|
|
28
46
|
}
|
|
29
47
|
};
|
|
30
48
|
export default meta;
|
|
31
49
|
export const Docs = {
|
|
32
50
|
render: (args) => ({
|
|
33
|
-
components: {
|
|
51
|
+
components: {
|
|
52
|
+
AntSearch
|
|
53
|
+
},
|
|
34
54
|
setup() {
|
|
35
|
-
return {
|
|
55
|
+
return {
|
|
56
|
+
args
|
|
57
|
+
};
|
|
36
58
|
},
|
|
37
59
|
template: `
|
|
38
60
|
<AntSearch v-bind="args" v-model="args.modelValue"/>
|
|
@@ -46,11 +68,20 @@ export const Docs = {
|
|
|
46
68
|
};
|
|
47
69
|
export const summary = {
|
|
48
70
|
render: (args) => ({
|
|
49
|
-
components: {
|
|
71
|
+
components: {
|
|
72
|
+
AntSearch,
|
|
73
|
+
AntFormGroup,
|
|
74
|
+
AntFormGroupLabel
|
|
75
|
+
},
|
|
50
76
|
setup() {
|
|
51
77
|
const value = ref("Keyword");
|
|
52
78
|
const noValue = ref("");
|
|
53
|
-
return {
|
|
79
|
+
return {
|
|
80
|
+
args,
|
|
81
|
+
Size,
|
|
82
|
+
value,
|
|
83
|
+
noValue
|
|
84
|
+
};
|
|
54
85
|
},
|
|
55
86
|
template: `
|
|
56
87
|
<AntFormGroup>
|
|
@@ -1,15 +1,31 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
Size
|
|
3
|
+
} from "../../../enums/Size.enum.mjs";
|
|
2
4
|
import AntSelect from "../AntSelect.vue";
|
|
3
5
|
import AntDropdown from "../Elements/AntSelectMenu.vue";
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
+
import {
|
|
7
|
+
computed,
|
|
8
|
+
onMounted,
|
|
9
|
+
ref
|
|
10
|
+
} from "vue";
|
|
11
|
+
import {
|
|
12
|
+
InputState
|
|
13
|
+
} from "../../../enums/index.mjs";
|
|
6
14
|
const meta = {
|
|
7
15
|
title: "Inputs/Select",
|
|
8
16
|
component: AntSelect,
|
|
9
|
-
parameters: {
|
|
17
|
+
parameters: {
|
|
18
|
+
controls: {
|
|
19
|
+
sort: "requiredFirst"
|
|
20
|
+
}
|
|
21
|
+
},
|
|
10
22
|
argTypes: {
|
|
11
23
|
modelValue: {
|
|
12
|
-
table: {
|
|
24
|
+
table: {
|
|
25
|
+
type: {
|
|
26
|
+
summary: "string|null"
|
|
27
|
+
}
|
|
28
|
+
}
|
|
13
29
|
},
|
|
14
30
|
options: {
|
|
15
31
|
description: "List of SelectOptions",
|
|
@@ -21,16 +37,28 @@ const meta = {
|
|
|
21
37
|
}
|
|
22
38
|
},
|
|
23
39
|
state: {
|
|
24
|
-
control: {
|
|
40
|
+
control: {
|
|
41
|
+
type: "select"
|
|
42
|
+
},
|
|
25
43
|
options: Object.values(InputState)
|
|
26
44
|
},
|
|
27
45
|
size: {
|
|
28
|
-
control: {
|
|
46
|
+
control: {
|
|
47
|
+
type: "select"
|
|
48
|
+
},
|
|
29
49
|
options: Object.values(Size),
|
|
30
|
-
table: {
|
|
50
|
+
table: {
|
|
51
|
+
defaultValue: {
|
|
52
|
+
summary: Size.md
|
|
53
|
+
}
|
|
54
|
+
}
|
|
31
55
|
},
|
|
32
56
|
placeholder: {
|
|
33
|
-
table: {
|
|
57
|
+
table: {
|
|
58
|
+
defaultValue: {
|
|
59
|
+
summary: "this.label"
|
|
60
|
+
}
|
|
61
|
+
}
|
|
34
62
|
}
|
|
35
63
|
}
|
|
36
64
|
};
|
|
@@ -53,13 +81,18 @@ const options = [
|
|
|
53
81
|
value: "4"
|
|
54
82
|
}
|
|
55
83
|
];
|
|
56
|
-
const manySelectOptions = [
|
|
84
|
+
const manySelectOptions = [
|
|
85
|
+
...Array(24).keys()
|
|
86
|
+
].map((key) => ({
|
|
57
87
|
label: `Option ${Number(key) + 1}`,
|
|
58
88
|
value: Number(key) + 1
|
|
59
89
|
}));
|
|
60
90
|
export const Docs = {
|
|
61
91
|
render: (args) => ({
|
|
62
|
-
components: {
|
|
92
|
+
components: {
|
|
93
|
+
AntSelect,
|
|
94
|
+
AntDropdown
|
|
95
|
+
},
|
|
63
96
|
setup() {
|
|
64
97
|
const modelValue = computed({
|
|
65
98
|
// @ts-ignore
|
|
@@ -73,7 +106,11 @@ export const Docs = {
|
|
|
73
106
|
scrollContainer.value.scrollTop = (scrollContainer.value.scrollHeight - scrollContainer.value.clientHeight) / 2;
|
|
74
107
|
}
|
|
75
108
|
});
|
|
76
|
-
return {
|
|
109
|
+
return {
|
|
110
|
+
args,
|
|
111
|
+
modelValue,
|
|
112
|
+
scrollContainer
|
|
113
|
+
};
|
|
77
114
|
},
|
|
78
115
|
template: `
|
|
79
116
|
<div ref="scrollContainer" class="overflow-y-auto h-[100vh] p-2.5 dashed">
|
|
@@ -171,12 +208,19 @@ export const ellipsisText = {
|
|
|
171
208
|
};
|
|
172
209
|
export const summary = {
|
|
173
210
|
parameters: {
|
|
174
|
-
chromatic: {
|
|
211
|
+
chromatic: {
|
|
212
|
+
disableSnapshot: false
|
|
213
|
+
}
|
|
175
214
|
},
|
|
176
215
|
render: (args) => ({
|
|
177
|
-
components: {
|
|
216
|
+
components: {
|
|
217
|
+
AntSelect
|
|
218
|
+
},
|
|
178
219
|
setup() {
|
|
179
|
-
return {
|
|
220
|
+
return {
|
|
221
|
+
args,
|
|
222
|
+
manySelectOptions
|
|
223
|
+
};
|
|
180
224
|
},
|
|
181
225
|
template: `
|
|
182
226
|
<div class="p-4 flex flex-col gap-2.5">
|