@milaboratories/uikit 2.6.3 → 2.6.5
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/.turbo/turbo-build.log +38 -38
- package/.turbo/turbo-type-check.log +1 -1
- package/CHANGELOG.md +15 -0
- package/dist/components/PlAccordion/ExpandTransition.vue3.js +1 -1
- package/dist/components/PlAccordion/PlAccordionSection.vue2.js +1 -1
- package/dist/components/PlAutocomplete/PlAutocomplete.vue.d.ts +2 -2
- package/dist/components/PlAutocomplete/PlAutocomplete.vue.js +1 -1
- package/dist/components/PlAutocomplete/PlAutocomplete.vue.js.map +1 -1
- package/dist/components/PlAutocompleteMulti/PlAutocompleteMulti.vue.d.ts +1 -1
- package/dist/components/PlAutocompleteMulti/PlAutocompleteMulti.vue.js.map +1 -1
- package/dist/components/PlElementList/PlElementListItem.vue.d.ts +3 -1
- package/dist/components/PlElementList/PlElementListItem.vue2.js +36 -34
- package/dist/components/PlElementList/PlElementListItem.vue2.js.map +1 -1
- package/package.json +2 -2
- package/src/components/PlAutocomplete/PlAutocomplete.vue +3 -3
- package/src/components/PlAutocomplete/__tests__/PlAutocomplete.spec.ts +1 -1
- package/src/components/PlAutocompleteMulti/PlAutocompleteMulti.vue +1 -1
- package/src/components/PlElementList/PlElementListItem.vue +2 -1
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
WARN Issue while reading "/home/runner/_work/platforma/platforma/.npmrc". Failed to replace env in config: ${NPMJS_TOKEN}
|
|
2
2
|
|
|
3
|
-
> @milaboratories/uikit@2.6.
|
|
3
|
+
> @milaboratories/uikit@2.6.5 build /home/runner/_work/platforma/platforma/lib/ui/uikit
|
|
4
4
|
> ts-builder build --target browser-lib --build-config ./build.browser-lib.config.js
|
|
5
5
|
|
|
6
6
|
Building browser-lib project...
|
|
@@ -13,86 +13,86 @@ rendering chunks...
|
|
|
13
13
|
|
|
14
14
|
[vite:dts] Start generate declaration files...
|
|
15
15
|
computing gzip size...
|
|
16
|
-
[vite:dts] Declaration files built in
|
|
16
|
+
[vite:dts] Declaration files built in 15382ms.
|
|
17
17
|
|
|
18
18
|
[2mdist/[22m[36mcomponents/PlTabs/Tab.vue2.js [39m[1m[2m 0.09 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.09 kB[22m
|
|
19
19
|
[2mdist/[22m[36mcomponents/PlTooltip/global.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.22 kB[22m
|
|
20
20
|
[2mdist/[22m[36mlayout/PlRow/PlRow.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
21
21
|
[2mdist/[22m[36mcomponents/PlFileDialog/Local.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
22
22
|
[2mdist/[22m[36mcomponents/Slider.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
23
|
-
[2mdist/[22m[36mlayout/PlGrid/PlGrid.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
24
23
|
[2mdist/[22m[36mcomponents/PlChip/PlChip.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
25
24
|
[2mdist/[22m[36mcomponents/PlTabs/PlTabs.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
25
|
+
[2mdist/[22m[36mlayout/PlGrid/PlGrid.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
26
26
|
[2mdist/[22m[36mcomponents/PlFileDialog/Remote.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
27
27
|
[2mdist/[22m[36mcomponents/DataTable/TdCell.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
28
28
|
[2mdist/[22m[36mcomponents/DataTable/TrHead.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
29
29
|
[2mdist/[22m[36mcomponents/DataTable/ThCell.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
30
30
|
[2mdist/[22m[36mcomponents/DataTable/TrBody.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
31
31
|
[2mdist/[22m[36mcomponents/PlAlert/PlAlert.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
32
|
+
[2mdist/[22m[36mbase/BtnBase.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
33
|
+
[2mdist/[22m[36mcomponents/TabItem.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
32
34
|
[2mdist/[22m[36mcomponents/VScroll.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
33
35
|
[2mdist/[22m[36mcomponents/HScroll.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
34
|
-
[2mdist/[22m[36mcomponents/TabItem.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
35
|
-
[2mdist/[22m[36mbase/BtnBase.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
36
36
|
[2mdist/[22m[36mcomponents/DataTable/TScroll.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
37
37
|
[2mdist/[22m[36mlayout/PlSpacer/PlSpacer.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
38
38
|
[2mdist/[22m[36mcomponents/PlSplash/PlSplash.vue2.js [39m[1m[2m 0.10 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
39
|
-
[2mdist/[22m[36mcomponents/PlTooltip/PlTooltip.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
40
|
-
[2mdist/[22m[36mcomponents/PlBtnLink/PlBtnLink.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
41
39
|
[2mdist/[22m[36mcomponents/PlLogView/PlLogView.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
40
|
+
[2mdist/[22m[36mcomponents/PlBtnLink/PlBtnLink.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
41
|
+
[2mdist/[22m[36mcomponents/PlTooltip/PlTooltip.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
42
42
|
[2mdist/[22m[36mcomponents/Scrollable.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
43
43
|
[2mdist/[22m[36mcomponents/PlDropdown/PlDropdown.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
44
|
+
[2mdist/[22m[36mcomponents/PlBtnGhost/PlBtnGhost.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
44
45
|
[2mdist/[22m[36mcomponents/PlCheckbox/PlCheckbox.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
45
|
-
[2mdist/[22m[36mcomponents/PlTextArea/PlTextArea.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
46
|
-
[2mdist/[22m[36mcomponents/PlBtnSplit/PlBtnSplit.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
47
46
|
[2mdist/[22m[36mcomponents/PlBtnGroup/PlBtnGroup.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
48
|
-
[2mdist/[22m[36mcomponents/
|
|
49
|
-
[2mdist/[22m[36mcomponents/
|
|
47
|
+
[2mdist/[22m[36mcomponents/PlBtnSplit/PlBtnSplit.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
48
|
+
[2mdist/[22m[36mcomponents/PlTextArea/PlTextArea.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
50
49
|
[2mdist/[22m[36mcomponents/InputRange.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
50
|
+
[2mdist/[22m[36mcomponents/PlDropdown/OptionList.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
51
51
|
[2mdist/[22m[36mcomponents/SliderRange.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
52
|
-
[2mdist/[22m[36mcomponents/
|
|
52
|
+
[2mdist/[22m[36mcomponents/PlTextField/PlTextField.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
53
53
|
[2mdist/[22m[36mcomponents/PlBtnAccent/PlBtnAccent.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
54
|
+
[2mdist/[22m[36mcomponents/PlAccordion/PlAccordion.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
54
55
|
[2mdist/[22m[36mlayout/PlContainer/PlContainer.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
56
|
+
[2mdist/[22m[36mcomponents/PlFileInput/PlFileInput.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
57
|
+
[2mdist/[22m[36mcomponents/PlBtnDanger/PlBtnDanger.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
55
58
|
[2mdist/[22m[36mlayout/PlBlockPage/PlBlockPage.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
56
|
-
[2mdist/[22m[36mcomponents/PlAccordion/PlAccordion.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
57
59
|
[2mdist/[22m[36mcomponents/PlStatusTag/PlStatusTag.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
58
|
-
[2mdist/[22m[36mcomponents/PlFileInput/PlFileInput.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
59
|
-
[2mdist/[22m[36mcomponents/PlTextField/PlTextField.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
60
60
|
[2mdist/[22m[36mcomponents/DataTable/ColumnCaret.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.11 kB[22m[2m │ map: 0.10 kB[22m
|
|
61
61
|
[2mdist/[22m[36mcomponents/PlBtnPrimary/PlBtnPrimary.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
62
62
|
[2mdist/[22m[36mcomponents/PlFileDialog/PlFileDialog.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
63
63
|
[2mdist/[22m[36mutils/InnerBorder.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.34 kB[22m
|
|
64
64
|
[2mdist/[22m[36mcomponents/ThemeSwitcher.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
65
|
-
[2mdist/[22m[36mcomponents/PlDropdownRef/PlDropdownRef.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
66
|
-
[2mdist/[22m[36mcomponents/PlNumberField/PlNumberField.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
67
65
|
[2mdist/[22m[36mcomponents/PlProgressBar/PlProgressBar.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
68
66
|
[2mdist/[22m[36mcomponents/PlDialogModal/PlDialogModal.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
67
|
+
[2mdist/[22m[36mcomponents/PlDropdownRef/PlDropdownRef.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
68
|
+
[2mdist/[22m[36mcomponents/PlNumberField/PlNumberField.vue2.js [39m[1m[2m 0.11 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
69
|
+
[2mdist/[22m[36mcomponents/PlDropdownLine/PlDropdownLine.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
69
70
|
[2mdist/[22m[36mcomponents/PlAutocomplete/PlAutocomplete.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
71
|
+
[2mdist/[22m[36mcomponents/DataTable/TableComponent.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
70
72
|
[2mdist/[22m[36mcomponents/PlToggleSwitch/PlToggleSwitch.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
71
|
-
[2mdist/[22m[36mcomponents/PlProgressCell/PlProgressCell.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
72
73
|
[2mdist/[22m[36mcomponents/PlBtnSecondary/PlBtnSecondary.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
73
|
-
[2mdist/[22m[36mcomponents/
|
|
74
|
-
[2mdist/[22m[36mcomponents/PlDropdownLine/PlDropdownLine.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
75
|
-
[2mdist/[22m[36mcomponents/PlCheckbox/PlCheckboxBase.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
74
|
+
[2mdist/[22m[36mcomponents/PlProgressCell/PlProgressCell.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
76
75
|
[2mdist/[22m[36mcomponents/PlDropdownLine/ResizableInput.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
76
|
+
[2mdist/[22m[36mcomponents/PlCheckbox/PlCheckboxBase.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.10 kB[22m
|
|
77
77
|
[2mdist/[22m[36mcomponents/ContextProvider.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
78
|
-
[2mdist/[22m[36mcomponents/PlConfirmDialog.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
79
78
|
[2mdist/[22m[36mutils/DropdownOverlay/DropdownOverlay.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
80
|
-
[2mdist/[22m[36mcomponents/PlErrorBoundary/PlErrorBoundary.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
81
79
|
[2mdist/[22m[36mcomponents/PlCheckboxGroup/PlCheckboxGroup.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
82
80
|
[2mdist/[22m[36mcomponents/PlDropdownMulti/PlDropdownMulti.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
83
81
|
[2mdist/[22m[36mcomponents/PlEditableTitle/PlEditableTitle.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
82
|
+
[2mdist/[22m[36mcomponents/PlConfirmDialog.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
83
|
+
[2mdist/[22m[36mcomponents/PlErrorBoundary/PlErrorBoundary.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
84
84
|
[2mdist/[22m[36mhelpers/math.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.13 kB[22m[2m │ map: 0.33 kB[22m
|
|
85
85
|
[2mdist/[22m[36mcomponents/DataTable/RowsCommandMenu.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
86
86
|
[2mdist/[22m[36mcomponents/DropdownListItem.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
87
|
-
[2mdist/[22m[36mcomponents/PlSlideModal/PlPureSlideModal.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
88
87
|
[2mdist/[22m[36mcomponents/PlLoaderCircular/PlLoaderCircular.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
89
88
|
[2mdist/[22m[36mcomponents/PlDropdownLegacy/PlDropdownLegacy.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
89
|
+
[2mdist/[22m[36mcomponents/PlSlideModal/PlPureSlideModal.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
90
90
|
[2mdist/[22m[36mcomponents/SliderRangeTriple.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
91
91
|
[2mdist/[22m[36mcomponents/DataTable/BaseCellComponent.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
92
92
|
[2mdist/[22m[36mcomponents/PlDropdownMultiRef/PlDropdownMultiRef.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
93
93
|
[2mdist/[22m[36mcomponents/DataTable/ColumnsCommandMenu.vue2.js [39m[1m[2m 0.12 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
94
|
-
[2mdist/[22m[36mcomponents/PlAutocompleteMulti/PlAutocompleteMulti.vue2.js [39m[1m[2m 0.13 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
95
94
|
[2mdist/[22m[36mcomponents/PlNotificationAlert/PlNotificationAlert.vue2.js [39m[1m[2m 0.13 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
95
|
+
[2mdist/[22m[36mcomponents/PlAutocompleteMulti/PlAutocompleteMulti.vue2.js [39m[1m[2m 0.13 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
96
96
|
[2mdist/[22m[36mcomponents/TransitionSlidePanel.vue2.js [39m[1m[2m 0.13 kB[22m[1m[22m[2m │ gzip: 0.12 kB[22m[2m │ map: 0.11 kB[22m
|
|
97
97
|
[2mdist/[22m[36mcomponents/PlRadio/keys.js [39m[1m[2m 0.13 kB[22m[1m[22m[2m │ gzip: 0.13 kB[22m[2m │ map: 0.43 kB[22m
|
|
98
98
|
[2mdist/[22m[36mcomposition/utils.js [39m[1m[2m 0.15 kB[22m[1m[22m[2m │ gzip: 0.14 kB[22m[2m │ map: 0.38 kB[22m
|
|
@@ -127,8 +127,8 @@ computing gzip size...
|
|
|
127
127
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_arrow-down.svg.js [39m[1m[2m 0.27 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.44 kB[22m
|
|
128
128
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_add.svg.js [39m[1m[2m 0.27 kB[22m[1m[22m[2m │ gzip: 0.23 kB[22m[2m │ map: 0.44 kB[22m
|
|
129
129
|
[2mdist/[22m[36mcomponents/PlRadio/PlRadio.vue.js [39m[1m[2m 0.27 kB[22m[1m[22m[2m │ gzip: 0.21 kB[22m[2m │ map: 0.10 kB[22m
|
|
130
|
-
[2mdist/[22m[36mcomponents/PlChartStackedBar/Legends.vue.js [39m[1m[2m 0.27 kB[22m[1m[22m[2m │ gzip: 0.21 kB[22m[2m │ map: 0.10 kB[22m
|
|
131
130
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_linetype-longdash.svg.js [39m[1m[2m 0.27 kB[22m[1m[22m[2m │ gzip: 0.23 kB[22m[2m │ map: 0.47 kB[22m
|
|
131
|
+
[2mdist/[22m[36mcomponents/PlChartStackedBar/Legends.vue.js [39m[1m[2m 0.27 kB[22m[1m[22m[2m │ gzip: 0.21 kB[22m[2m │ map: 0.10 kB[22m
|
|
132
132
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_chevron-first.svg.js [39m[1m[2m 0.28 kB[22m[1m[22m[2m │ gzip: 0.23 kB[22m[2m │ map: 0.45 kB[22m
|
|
133
133
|
[2mdist/[22m[36mcomponents/PlIcon16/PlIcon16.vue.js [39m[1m[2m 0.28 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.10 kB[22m
|
|
134
134
|
[2mdist/[22m[36mcomponents/PlIcon24/PlIcon24.vue.js [39m[1m[2m 0.28 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.10 kB[22m
|
|
@@ -147,10 +147,10 @@ computing gzip size...
|
|
|
147
147
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_maximize.svg.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.47 kB[22m
|
|
148
148
|
[2mdist/[22m[36mcomponents/PlSlideModal/PlSlideModal.vue.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
149
149
|
[2mdist/[22m[36mcomponents/PlRadio/PlRadioGroup.vue.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
150
|
+
[2mdist/[22m[36mcomponents/PlErrorAlert/PlErrorAlert.vue.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
150
151
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_caret-left.svg.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.46 kB[22m
|
|
151
152
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_download.svg.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.46 kB[22m
|
|
152
153
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_linetype-dashed.svg.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.23 kB[22m[2m │ map: 0.48 kB[22m
|
|
153
|
-
[2mdist/[22m[36mcomponents/PlErrorAlert/PlErrorAlert.vue.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
154
154
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_drag-dots.svg.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.23 kB[22m[2m │ map: 0.46 kB[22m
|
|
155
155
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_chevron-up.svg.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.47 kB[22m
|
|
156
156
|
[2mdist/[22m[36mcomponents/PlElementList/PlElementList.vue.js [39m[1m[2m 0.29 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
@@ -165,12 +165,12 @@ computing gzip size...
|
|
|
165
165
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_jump-link.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.46 kB[22m
|
|
166
166
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_checkbox-intermediate.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.53 kB[22m
|
|
167
167
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_chevron-up.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.48 kB[22m
|
|
168
|
+
[2mdist/[22m[36mcomponents/PlElementList/utils.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.23 kB[22m[2m │ map: 0.79 kB[22m
|
|
168
169
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_close.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.47 kB[22m
|
|
169
170
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_chevron-down.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.48 kB[22m
|
|
170
171
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_linetype-dotdash.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.49 kB[22m
|
|
171
172
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_menu.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.24 kB[22m[2m │ map: 0.46 kB[22m
|
|
172
173
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_text-align-left.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.49 kB[22m
|
|
173
|
-
[2mdist/[22m[36mcomponents/PlElementList/utils.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.23 kB[22m[2m │ map: 0.79 kB[22m
|
|
174
174
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_arrow-link.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.48 kB[22m
|
|
175
175
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_chevron-right.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.49 kB[22m
|
|
176
176
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_arrow-link.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.48 kB[22m
|
|
@@ -182,9 +182,9 @@ computing gzip size...
|
|
|
182
182
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_text-align-right.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.50 kB[22m
|
|
183
183
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_checkmark.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.48 kB[22m
|
|
184
184
|
[2mdist/[22m[36mcomponents/PlChartStackedBar/PlChartStackedBar.vue.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
185
|
+
[2mdist/[22m[36mcomponents/PlElementList/PlElementListItem.vue.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
185
186
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_arrow-up.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.48 kB[22m
|
|
186
187
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_linetype-twodash.svg.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.50 kB[22m
|
|
187
|
-
[2mdist/[22m[36mcomponents/PlElementList/PlElementListItem.vue.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
188
188
|
[2mdist/[22m[36mcomponents/PlChartStackedBar/StackedRowCompact.vue.js [39m[1m[2m 0.30 kB[22m[1m[22m[2m │ gzip: 0.22 kB[22m[2m │ map: 0.11 kB[22m
|
|
189
189
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_checkmark.svg.js [39m[1m[2m 0.31 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.49 kB[22m
|
|
190
190
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_arrow-down.svg.js [39m[1m[2m 0.31 kB[22m[1m[22m[2m │ gzip: 0.25 kB[22m[2m │ map: 0.49 kB[22m
|
|
@@ -282,8 +282,8 @@ computing gzip size...
|
|
|
282
282
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_renew.svg.js [39m[1m[2m 0.44 kB[22m[1m[22m[2m │ gzip: 0.32 kB[22m[2m │ map: 0.62 kB[22m
|
|
283
283
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_error.svg.js [39m[1m[2m 0.44 kB[22m[1m[22m[2m │ gzip: 0.32 kB[22m[2m │ map: 0.64 kB[22m
|
|
284
284
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_monetization.svg.js [39m[1m[2m 0.45 kB[22m[1m[22m[2m │ gzip: 0.30 kB[22m[2m │ map: 0.63 kB[22m
|
|
285
|
-
[2mdist/[22m[36massets/images/24_checkbox-light-enabled-unchecked.svg.js [39m[1m[2m 0.45 kB[22m[1m[22m[2m │ gzip: 0.32 kB[22m[2m │ map: 0.67 kB[22m
|
|
286
285
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_y-axis.svg.js [39m[1m[2m 0.45 kB[22m[1m[22m[2m │ gzip: 0.30 kB[22m[2m │ map: 0.65 kB[22m
|
|
286
|
+
[2mdist/[22m[36massets/images/24_checkbox-light-enabled-unchecked.svg.js [39m[1m[2m 0.45 kB[22m[1m[22m[2m │ gzip: 0.32 kB[22m[2m │ map: 0.67 kB[22m
|
|
287
287
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_y-axis.svg.js [39m[1m[2m 0.45 kB[22m[1m[22m[2m │ gzip: 0.30 kB[22m[2m │ map: 0.65 kB[22m
|
|
288
288
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_delete-circle.svg.js [39m[1m[2m 0.45 kB[22m[1m[22m[2m │ gzip: 0.31 kB[22m[2m │ map: 0.65 kB[22m
|
|
289
289
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_zoom-in.svg.js [39m[1m[2m 0.45 kB[22m[1m[22m[2m │ gzip: 0.30 kB[22m[2m │ map: 0.65 kB[22m
|
|
@@ -387,8 +387,8 @@ computing gzip size...
|
|
|
387
387
|
[2mdist/[22m[36massets/icons/icon-assets-min/16_duplicate.svg.js [39m[1m[2m 0.62 kB[22m[1m[22m[2m │ gzip: 0.39 kB[22m[2m │ map: 0.83 kB[22m
|
|
388
388
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_bar-stacked.svg.js [39m[1m[2m 0.62 kB[22m[1m[22m[2m │ gzip: 0.34 kB[22m[2m │ map: 0.83 kB[22m
|
|
389
389
|
[2mdist/[22m[36mcomponents/PlElementList/PlElementList.vue3.js [39m[1m[2m 0.63 kB[22m[1m[22m[2m │ gzip: 0.41 kB[22m[2m │ map: 0.11 kB[22m
|
|
390
|
-
[2mdist/[22m[36mcomposition/useRipple.js [39m[1m[2m 0.63 kB[22m[1m[22m[2m │ gzip: 0.40 kB[22m[2m │ map: 1.69 kB[22m
|
|
391
390
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_file-doc-download.svg.js [39m[1m[2m 0.63 kB[22m[1m[22m[2m │ gzip: 0.38 kB[22m[2m │ map: 0.85 kB[22m
|
|
391
|
+
[2mdist/[22m[36mcomposition/useRipple.js [39m[1m[2m 0.63 kB[22m[1m[22m[2m │ gzip: 0.40 kB[22m[2m │ map: 1.69 kB[22m
|
|
392
392
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_axes.svg.js [39m[1m[2m 0.63 kB[22m[1m[22m[2m │ gzip: 0.37 kB[22m[2m │ map: 0.81 kB[22m
|
|
393
393
|
[2mdist/[22m[36mutils/DoubleContour.vue.js [39m[1m[2m 0.63 kB[22m[1m[22m[2m │ gzip: 0.41 kB[22m[2m │ map: 2.12 kB[22m
|
|
394
394
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_clipboard.svg.js [39m[1m[2m 0.63 kB[22m[1m[22m[2m │ gzip: 0.37 kB[22m[2m │ map: 0.84 kB[22m
|
|
@@ -429,7 +429,7 @@ computing gzip size...
|
|
|
429
429
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_cell-type-txt.svg.js [39m[1m[2m 0.77 kB[22m[1m[22m[2m │ gzip: 0.50 kB[22m[2m │ map: 0.94 kB[22m
|
|
430
430
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_bubble.svg.js [39m[1m[2m 0.77 kB[22m[1m[22m[2m │ gzip: 0.40 kB[22m[2m │ map: 0.97 kB[22m
|
|
431
431
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_container.svg.js [39m[1m[2m 0.78 kB[22m[1m[22m[2m │ gzip: 0.43 kB[22m[2m │ map: 1.05 kB[22m
|
|
432
|
-
[2mdist/[22m[36mcomponents/PlAccordion/ExpandTransition.
|
|
432
|
+
[2mdist/[22m[36mcomponents/PlAccordion/ExpandTransition.vue.js [39m[1m[2m 0.78 kB[22m[1m[22m[2m │ gzip: 0.43 kB[22m[2m │ map: 1.52 kB[22m
|
|
433
433
|
[2mdist/[22m[36mcomponents/DataTable/adapters/AsyncData.js [39m[1m[2m 0.79 kB[22m[1m[22m[2m │ gzip: 0.43 kB[22m[2m │ map: 2.12 kB[22m
|
|
434
434
|
[2mdist/[22m[36mcomponents/PlDropdown/useGroupBy.js [39m[1m[2m 0.80 kB[22m[1m[22m[2m │ gzip: 0.42 kB[22m[2m │ map: 2.49 kB[22m
|
|
435
435
|
[2mdist/[22m[36mcomposition/watchCached.js [39m[1m[2m 0.80 kB[22m[1m[22m[2m │ gzip: 0.45 kB[22m[2m │ map: 2.44 kB[22m
|
|
@@ -463,8 +463,8 @@ computing gzip size...
|
|
|
463
463
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_view-show.svg.js [39m[1m[2m 0.93 kB[22m[1m[22m[2m │ gzip: 0.55 kB[22m[2m │ map: 1.11 kB[22m
|
|
464
464
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_theme-dark.svg.js [39m[1m[2m 0.94 kB[22m[1m[22m[2m │ gzip: 0.48 kB[22m[2m │ map: 1.12 kB[22m
|
|
465
465
|
[2mdist/[22m[36mlayout/PlRow/PlRow.vue.js [39m[1m[2m 0.94 kB[22m[1m[22m[2m │ gzip: 0.56 kB[22m[2m │ map: 0.81 kB[22m
|
|
466
|
-
[2mdist/[22m[36mcomponents/PlIcon24/PlIcon24.vue2.js [39m[1m[2m 0.95 kB[22m[1m[22m[2m │ gzip: 0.51 kB[22m[2m │ map: 2.57 kB[22m
|
|
467
466
|
[2mdist/[22m[36mcomponents/PlIcon16/PlIcon16.vue2.js [39m[1m[2m 0.95 kB[22m[1m[22m[2m │ gzip: 0.51 kB[22m[2m │ map: 1.86 kB[22m
|
|
467
|
+
[2mdist/[22m[36mcomponents/PlIcon24/PlIcon24.vue2.js [39m[1m[2m 0.95 kB[22m[1m[22m[2m │ gzip: 0.51 kB[22m[2m │ map: 2.57 kB[22m
|
|
468
468
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_dendrogram-X-line.svg.js [39m[1m[2m 0.95 kB[22m[1m[22m[2m │ gzip: 0.39 kB[22m[2m │ map: 1.24 kB[22m
|
|
469
469
|
[2mdist/[22m[36mcomponents/PlAccordion/PlAccordionSection.vue3.js [39m[1m[2m 0.95 kB[22m[1m[22m[2m │ gzip: 0.53 kB[22m[2m │ map: 0.11 kB[22m
|
|
470
470
|
[2mdist/[22m[36mcomponents/DataTable/composition/useTableColumns.js [39m[1m[2m 0.97 kB[22m[1m[22m[2m │ gzip: 0.53 kB[22m[2m │ map: 2.87 kB[22m
|
|
@@ -575,7 +575,7 @@ computing gzip size...
|
|
|
575
575
|
[2mdist/[22m[36massets/icons/icon-assets-min/24_file-logs-accent.svg.js [39m[1m[2m 2.42 kB[22m[1m[22m[2m │ gzip: 1.19 kB[22m[2m │ map: 2.66 kB[22m
|
|
576
576
|
[2mdist/[22m[36mcolors/gradient.js [39m[1m[2m 2.44 kB[22m[1m[22m[2m │ gzip: 0.98 kB[22m[2m │ map: 6.44 kB[22m
|
|
577
577
|
[2mdist/[22m[36mcomponents/PlTabs/pl-tabs.module.scss.js [39m[1m[2m 2.45 kB[22m[1m[22m[2m │ gzip: 0.88 kB[22m[2m │ map: 0.11 kB[22m
|
|
578
|
-
[2mdist/[22m[36mcomponents/PlAccordion/PlAccordionSection.vue2.js [39m[1m[2m 2.51 kB[22m[1m[22m[2m │ gzip: 1.
|
|
578
|
+
[2mdist/[22m[36mcomponents/PlAccordion/PlAccordionSection.vue2.js [39m[1m[2m 2.51 kB[22m[1m[22m[2m │ gzip: 1.15 kB[22m[2m │ map: 3.69 kB[22m
|
|
579
579
|
[2mdist/[22m[36mcomponents/DataTable/TdCell.vue.js [39m[1m[2m 2.60 kB[22m[1m[22m[2m │ gzip: 1.04 kB[22m[2m │ map: 5.35 kB[22m
|
|
580
580
|
[2mdist/[22m[36mcomponents/PlNotificationAlert/PlNotificationAlert.vue.js [39m[1m[2m 2.64 kB[22m[1m[22m[2m │ gzip: 1.12 kB[22m[2m │ map: 2.10 kB[22m
|
|
581
581
|
[2mdist/[22m[36mcomponents/PlFileDialog/Local.vue.js [39m[1m[2m 2.67 kB[22m[1m[22m[2m │ gzip: 1.17 kB[22m[2m │ map: 4.98 kB[22m
|
|
@@ -602,7 +602,7 @@ computing gzip size...
|
|
|
602
602
|
[2mdist/[22m[36mcomposition/useSortable2.js [39m[1m[2m 4.41 kB[22m[1m[22m[2m │ gzip: 1.50 kB[22m[2m │ map: 13.08 kB[22m
|
|
603
603
|
[2mdist/[22m[36mcomponents/PlAlert/PlAlert.vue.js [39m[1m[2m 4.44 kB[22m[1m[22m[2m │ gzip: 1.70 kB[22m[2m │ map: 3.53 kB[22m
|
|
604
604
|
[2mdist/[22m[36mcomponents/PlSlideModal/PlSlideModal.vue2.js [39m[1m[2m 4.45 kB[22m[1m[22m[2m │ gzip: 1.75 kB[22m[2m │ map: 2.18 kB[22m
|
|
605
|
-
[2mdist/[22m[36mcomponents/PlElementList/PlElementListItem.vue2.js [39m[1m[2m 4.
|
|
605
|
+
[2mdist/[22m[36mcomponents/PlElementList/PlElementListItem.vue2.js [39m[1m[2m 4.69 kB[22m[1m[22m[2m │ gzip: 1.31 kB[22m[2m │ map: 10.64 kB[22m
|
|
606
606
|
[2mdist/[22m[36mcomponents/PlBtnGroup/PlBtnGroup.vue.js [39m[1m[2m 5.14 kB[22m[1m[22m[2m │ gzip: 1.94 kB[22m[2m │ map: 4.42 kB[22m
|
|
607
607
|
[2mdist/[22m[36mcomponents/PlTooltip/PlTooltip.vue.js [39m[1m[2m 5.19 kB[22m[1m[22m[2m │ gzip: 1.93 kB[22m[2m │ map: 6.61 kB[22m
|
|
608
608
|
[2mdist/[22m[36mcomponents/Slider.vue.js [39m[1m[2m 5.52 kB[22m[1m[22m[2m │ gzip: 1.92 kB[22m[2m │ map: 9.88 kB[22m
|
|
@@ -626,12 +626,12 @@ computing gzip size...
|
|
|
626
626
|
[2mdist/[22m[36mcomponents/PlDropdown/PlDropdown.vue.js [39m[1m[2m 15.71 kB[22m[1m[22m[2m │ gzip: 4.52 kB[22m[2m │ map: 18.09 kB[22m
|
|
627
627
|
[2mdist/[22m[36mcomponents/PlDropdownMulti/PlDropdownMulti.vue.js [39m[1m[2m 18.23 kB[22m[1m[22m[2m │ gzip: 4.95 kB[22m[2m │ map: 16.65 kB[22m
|
|
628
628
|
[2mdist/[22m[36mcomponents/PlDropdownLegacy/PlDropdownLegacy.vue.js [39m[1m[2m 18.26 kB[22m[1m[22m[2m │ gzip: 4.95 kB[22m[2m │ map: 17.77 kB[22m
|
|
629
|
-
[2mdist/[22m[36mcomponents/PlAutocomplete/PlAutocomplete.vue.js [39m[1m[2m 18.
|
|
630
|
-
[2mdist/[22m[36mcomponents/PlAutocompleteMulti/PlAutocompleteMulti.vue.js [39m[1m[2m 19.31 kB[22m[1m[22m[2m │ gzip: 5.23 kB[22m[2m │ map: 20.
|
|
629
|
+
[2mdist/[22m[36mcomponents/PlAutocomplete/PlAutocomplete.vue.js [39m[1m[2m 18.69 kB[22m[1m[22m[2m │ gzip: 5.24 kB[22m[2m │ map: 20.99 kB[22m
|
|
630
|
+
[2mdist/[22m[36mcomponents/PlAutocompleteMulti/PlAutocompleteMulti.vue.js [39m[1m[2m 19.31 kB[22m[1m[22m[2m │ gzip: 5.23 kB[22m[2m │ map: 20.80 kB[22m
|
|
631
631
|
[2mdist/[22m[36mcomponents/PlSvg/PlSvg.vue2.js [39m[1m[2m 39.54 kB[22m[1m[22m[2m │ gzip: 3.38 kB[22m[2m │ map: 12.31 kB[22m
|
|
632
632
|
[2mdist/[22m[36mcomponents/PlFileDialog/pl-file-dialog.module.scss.js [39m[1m[2m 47.68 kB[22m[1m[22m[2m │ gzip: 16.33 kB[22m[2m │ map: 0.13 kB[22m
|
|
633
633
|
[2mdist/[22m[36mindex.js [39m[1m[33m502.41 kB[39m[22m[2m │ gzip: 192.50 kB[22m[2m │ map: 5.86 kB[22m
|
|
634
634
|
[2mdist/[22m[36mcomponents/PlSlideModal/PlPureSlideModal.vue.js [39m[1m[33m605.54 kB[39m[22m[2m │ gzip: 205.13 kB[22m[2m │ map: 2.93 kB[22m
|
|
635
635
|
[2mdist/[22m[36mcomponents/DataTable/TableComponent.vue.js [39m[1m[33m607.38 kB[39m[22m[2m │ gzip: 206.02 kB[22m[2m │ map: 6.85 kB[22m
|
|
636
|
-
[32m✓ built in
|
|
636
|
+
[32m✓ built in 21.59s[39m
|
|
637
637
|
Build completed successfully
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
WARN Issue while reading "/home/runner/_work/platforma/platforma/.npmrc". Failed to replace env in config: ${NPMJS_TOKEN}
|
|
2
2
|
|
|
3
|
-
> @milaboratories/uikit@2.6.
|
|
3
|
+
> @milaboratories/uikit@2.6.5 type-check /home/runner/_work/platforma/platforma/lib/ui/uikit
|
|
4
4
|
> ts-builder types --target browser-lib
|
|
5
5
|
|
|
6
6
|
↳ vue-tsc.js --noEmit --project ./tsconfig.json
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# @milaboratories/uikit
|
|
2
2
|
|
|
3
|
+
## 2.6.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- bf6fe49: Update advanced filters and types
|
|
8
|
+
- Updated dependencies [bf6fe49]
|
|
9
|
+
- @platforma-sdk/model@1.45.45
|
|
10
|
+
|
|
11
|
+
## 2.6.4
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- Updated dependencies [2c07d5a]
|
|
16
|
+
- @platforma-sdk/model@1.45.42
|
|
17
|
+
|
|
3
18
|
## 2.6.3
|
|
4
19
|
|
|
5
20
|
### Patch Changes
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".expand-collapse-fix{overflow:hidden}.expand-collapse-enter-active,.expand-collapse-leave-active{transition:height .2s ease-in-out,opacity .2s ease-in-out;height:var(--component-height)}.expand-collapse-enter-from,.expand-collapse-leave-to{opacity:.5;height:0}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
|
-
import o from "./ExpandTransition.
|
|
2
|
+
import o from "./ExpandTransition.vue.js";
|
|
3
3
|
|
|
4
4
|
export {
|
|
5
5
|
o as default
|
|
@@ -3,7 +3,7 @@ import { defineComponent as V, mergeModels as k, inject as m, toRef as d, useMod
|
|
|
3
3
|
import { uniqueId as B } from "@milaboratories/helpers";
|
|
4
4
|
import N from "../PlIcon16/PlIcon16.vue.js";
|
|
5
5
|
import P from "../PlSectionSeparator/PlSectionSeparator.vue.js";
|
|
6
|
-
import b from "./ExpandTransition.
|
|
6
|
+
import b from "./ExpandTransition.vue.js";
|
|
7
7
|
|
|
8
8
|
const w = { class: "pl-accordion-section" }, R = /* @__PURE__ */ V({
|
|
9
9
|
__name: "PlAccordionSection",
|
|
@@ -2,7 +2,7 @@ import { ListOption } from '../../types';
|
|
|
2
2
|
/**
|
|
3
3
|
* A component for selecting one value from a big list of options using string search request
|
|
4
4
|
*/
|
|
5
|
-
declare const _default: <M =
|
|
5
|
+
declare const _default: <M extends null | undefined | string | number = string | null | undefined>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
6
6
|
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
|
|
7
7
|
readonly "onUpdate:modelValue"?: ((value: M) => any) | undefined;
|
|
8
8
|
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue"> & ({
|
|
@@ -15,7 +15,7 @@ declare const _default: <M = unknown>(__VLS_props: NonNullable<Awaited<typeof __
|
|
|
15
15
|
/**
|
|
16
16
|
* Lambda for requesting of corresponding option for current model value. If empty, optionsSearch is used for this.
|
|
17
17
|
*/
|
|
18
|
-
modelSearch?: (v: M) => Promise<ListOption<M
|
|
18
|
+
modelSearch?: (v: NonNullable<M>) => Promise<ListOption<NonNullable<M>>>;
|
|
19
19
|
/**
|
|
20
20
|
* The label text for the dropdown field (optional)
|
|
21
21
|
*/
|
|
@@ -140,7 +140,7 @@ const De = ["tabindex"], Fe = { class: "pl-autocomplete__container" }, Me = { cl
|
|
|
140
140
|
return c.optionsSearch(e);
|
|
141
141
|
}), P = H(() => r.value, async (e) => {
|
|
142
142
|
var o, l;
|
|
143
|
-
return e && !I((o = y.value) == null ? void 0 : o.value, e) ? c.modelSearch ? c.modelSearch(e) : (l = await c.optionsSearch(String(e))) == null ? void 0 : l[0] : y.value;
|
|
143
|
+
return e != null && !I((o = y.value) == null ? void 0 : o.value, e) ? c.modelSearch ? c.modelSearch(e) : (l = await c.optionsSearch(String(e))) == null ? void 0 : l[0] : y.value;
|
|
144
144
|
});
|
|
145
145
|
return g(() => C.value, (e) => {
|
|
146
146
|
e && (E.value = e, s.value !== null && (V.value = !1));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlAutocomplete.vue.js","sources":["../../../src/components/PlAutocomplete/PlAutocomplete.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * A component for selecting one value from a big list of options using string search request\n */\nexport default {\n name: 'PlAutocomplete',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport './pl-autocomplete.scss';\nimport { computed, reactive, ref, unref, useTemplateRef, watch, watchPostEffect } from 'vue';\nimport { tap } from '../../helpers/functions';\nimport { PlTooltip } from '../PlTooltip';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport type { ListOption, ListOptionNormalized } from '../../types';\nimport { deepEqual } from '../../helpers/objects';\nimport DropdownListItem from '../DropdownListItem.vue';\nimport LongText from '../LongText.vue';\nimport { normalizeListOptions } from '../../helpers/utils';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport { DropdownOverlay } from '../../utils/DropdownOverlay';\nimport { refDebounced } from '@vueuse/core';\nimport { useWatchFetch } from '../../composition/useWatchFetch.ts';\nimport { getErrorMessage } from '../../helpers/error.ts';\nimport type { ListOptionBase } from '@platforma-sdk/model';\nimport { PlSvg } from '../PlSvg';\nimport SvgRequired from '../../assets/images/required.svg?raw';\n\n/**\n * The current selected value.\n */\nconst model = defineModel<M>({ required: true });\n\nconst props = withDefaults(\n defineProps<{\n /**\n * Lambda for requesting of available options for the dropdown by search string.\n */\n optionsSearch: (s: string) => Promise<ListOption<M>[]>;\n /**\n * Lambda for requesting of corresponding option for current model value. If empty, optionsSearch is used for this.\n */\n modelSearch?: (v: M) => Promise<ListOption<M>>;\n /**\n * The label text for the dropdown field (optional)\n */\n label?: string;\n /**\n * A helper text displayed below the dropdown when there are no errors (optional).\n */\n helper?: string;\n /**\n * A helper text displayed below the dropdown when there are no options yet or options is undefined (optional).\n */\n loadingOptionsHelper?: string;\n /**\n * Error message displayed below the dropdown (optional)\n */\n error?: unknown;\n /**\n * Placeholder text shown when no value is selected.\n */\n placeholder?: string;\n /**\n * Enables a button to clear the selected value (default: false)\n */\n clearable?: boolean;\n /**\n * If `true`, the dropdown component is marked as required.\n */\n required?: boolean;\n /**\n * If `true`, the dropdown component is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n /**\n * Custom icon (16px) class for the dropdown arrow (optional)\n */\n arrowIcon?: string;\n /**\n * Custom icon (24px) class for the dropdown arrow (optional)\n */\n arrowIconLarge?: string;\n /**\n * Option list item size\n */\n optionSize?: 'small' | 'medium';\n /**\n * Formatter for the selected value if its label is absent\n */\n formatValue?: (value: M) => string;\n /**\n * Makes some of corners not rounded\n * */\n groupPosition?: 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'middle';\n }>(),\n {\n modelSearch: undefined,\n label: '',\n helper: undefined,\n loadingOptionsHelper: undefined,\n error: undefined,\n placeholder: '...',\n clearable: false,\n required: false,\n disabled: false,\n arrowIcon: undefined,\n arrowIconLarge: undefined,\n optionSize: 'small',\n formatValue: (v: M) => String(v),\n groupPosition: undefined,\n },\n);\n\nconst slots = defineSlots<{\n [key: string]: unknown;\n}>();\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst input = ref<HTMLInputElement | undefined>();\n\nconst overlayRef = useTemplateRef('overlay');\n\nconst search = ref<string | null>(null);\nconst data = reactive({\n activeIndex: -1,\n open: false,\n});\n\nconst findActiveIndex = () =>\n tap(\n renderedOptionsRef.value.findIndex((o) => deepEqual(o.value, model.value)),\n (v) => (v < 0 ? 0 : v),\n );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst loadedOptionsRef = ref<ListOption<M>[]>([]);\nconst modelOptionRef = ref<ListOptionNormalized<M> | undefined>(); // list of 1 option that is selected or empty, to keep selected label\n\nconst renderedOptionsRef = computed(() => {\n return normalizeListOptions(loadedOptionsRef.value).map((opt, index) => ({\n ...opt,\n index,\n isSelected: index === selectedIndex.value,\n isActive: index === data.activeIndex,\n })) as (ListOptionBase<M> & { index: number; isSelected: boolean; isActive: boolean })[];\n});\nconst isLoadingOptions = ref<boolean>(true);\nconst isLoadingError = ref<boolean>(false);\n\nconst isDisabled = computed(() => {\n return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n return loadedOptionsRef.value.findIndex((o) => deepEqual(o.value, model.value));\n});\n\nconst computedError = computed(() => {\n if (isLoadingOptions.value) {\n return undefined;\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (isLoadingError.value) {\n return 'Data loading error';\n }\n\n return undefined;\n});\n\nconst textValue = computed(() => {\n const modelOption = unref(modelOptionRef);\n const options = unref(renderedOptionsRef);\n\n const item: ListOptionNormalized | undefined = modelOption ?? options.find((o) => deepEqual(o.value, model.value)) ?? options.find((o) => deepEqual(o.value, model.value));\n\n return item?.label || (model.value ? props.formatValue(model.value) : '');\n});\n\nconst computedPlaceholder = computed(() => {\n if (!data.open && model.value) {\n return '';\n }\n\n return model.value ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n return model.value !== undefined && model.value !== null;\n});\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : '0'));\n\nconst selectOption = (v: ListOptionBase<M> & { index: number } | undefined) => {\n model.value = v?.value as M;\n modelOptionRef.value = v;\n search.value = null;\n data.open = false;\n rootRef?.value?.focus();\n};\n\nconst clear = () => {\n model.value = undefined as M;\n modelOptionRef.value = undefined;\n};\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => {\n data.open = !data.open;\n};\n\nwatch(() => data.open, (v) => {\n search.value = v ? '' : null;\n});\n\nconst onInputFocus = () => {\n data.open = true;\n};\n\nconst onFocusOut = (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as Node | null;\n\n if (!rootRef.value?.contains(relatedTarget) && !overlayRef.value?.listRef?.contains(relatedTarget)) {\n search.value = null;\n data.open = false;\n }\n};\n\nconst handleKeydown = (e: { code: string; preventDefault(): void }) => {\n if (!['ArrowDown', 'ArrowUp', 'Enter', 'Escape'].includes(e.code)) {\n return;\n } else {\n e.preventDefault();\n }\n\n const { open, activeIndex } = data;\n\n if (!open) {\n if (e.code === 'Enter') {\n data.open = true;\n search.value = '';\n }\n return;\n }\n\n if (e.code === 'Escape') {\n data.open = false;\n search.value = null;\n rootRef.value?.focus();\n }\n\n const options = unref(renderedOptionsRef);\n\n const { length } = options;\n\n if (!length) {\n return;\n }\n\n if (e.code === 'Enter') {\n selectOption(options.find((it) => it.index === activeIndex));\n }\n\n const localIndex = options.findIndex((it) => it.index === activeIndex) ?? -1;\n\n const delta = e.code === 'ArrowDown' ? 1 : e.code === 'ArrowUp' ? -1 : 0;\n\n const newIndex = Math.abs(localIndex + delta + length) % length;\n\n data.activeIndex = renderedOptionsRef.value[newIndex].index ?? -1;\n};\n\nuseLabelNotch(rootRef);\n\nwatch(() => model.value, updateActive, { immediate: true });\n\nwatch(\n () => data.open,\n (open) => (open ? input.value?.focus() : ''),\n);\n\nwatchPostEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n search.value; // to watch\n\n if (data.activeIndex >= 0 && data.open) {\n overlayRef.value?.scrollIntoActive();\n }\n});\n\nconst searchDebounced = refDebounced(search, 300, { maxWait: 1000 });\n\nconst optionsRequest = useWatchFetch(() => searchDebounced.value, async (v) => {\n if (v !== null) { // search is null when dropdown is closed;\n return props.optionsSearch(v);\n }\n return undefined;\n});\n\nconst modelOptionRequest = useWatchFetch(() => model.value, async (v) => {\n if (v && !deepEqual(modelOptionRef.value?.value, v)) { // load label for selected value if it was updated from outside the component\n if (props.modelSearch) {\n return props.modelSearch(v);\n }\n return (await props.optionsSearch(String(v)))?.[0];\n }\n return modelOptionRef.value;\n});\n\nwatch(() => optionsRequest.value, (result) => {\n if (result) {\n loadedOptionsRef.value = result;\n if (search.value !== null) {\n isLoadingError.value = false;\n }\n }\n});\n\nwatch(() => modelOptionRequest.value, (result) => {\n if (result) {\n modelOptionRef.value = normalizeListOptions([result])[0];\n }\n});\n\nwatch(() => optionsRequest.error, (err) => {\n if (err) {\n isLoadingError.value = Boolean(err);\n }\n});\n\nwatch(() => optionsRequest.loading || modelOptionRequest.loading, (loading) => {\n isLoadingOptions.value = loading;\n});\n</script>\n\n<template>\n <div class=\"pl-autocomplete__envelope\" @click.stop=\"setFocusOnInput\">\n <div\n ref=\"rootRef\"\n :tabindex=\"tabindex\"\n class=\"pl-autocomplete\"\n :class=\"{ open: data.open, error: Boolean(computedError), disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"pl-autocomplete__container\">\n <div class=\"pl-autocomplete__field\">\n <input\n ref=\"input\"\n v-model=\"search\"\n type=\"text\"\n tabindex=\"-1\"\n :disabled=\"isDisabled\"\n :placeholder=\"computedPlaceholder\"\n spellcheck=\"false\"\n autocomplete=\"chrome-off\"\n @focus=\"onInputFocus\"\n />\n\n <div v-if=\"!data.open\" class=\"input-value\">\n <LongText> {{ textValue }} </LongText>\n </div>\n\n <div class=\"pl-autocomplete__controls\">\n <PlMaskIcon24 v-if=\"isLoadingOptions\" name=\"loading\" />\n <PlIcon16 v-if=\"clearable && hasValue\" class=\"clear\" name=\"delete-clear\" @click.stop=\"clear\" />\n <slot name=\"append\" />\n <div class=\"pl-autocomplete__arrow-wrapper\" @click.stop=\"toggleOpen\">\n <div v-if=\"arrowIconLarge\" class=\"arrow-icon\" :class=\"[`icon-24 ${arrowIconLarge}`]\" />\n <div v-else-if=\"arrowIcon\" class=\"arrow-icon\" :class=\"[`icon-16 ${arrowIcon}`]\" />\n <div v-else class=\"arrow-icon arrow-icon-default\" />\n </div>\n </div>\n </div>\n <label v-if=\"label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n <span>{{ label }}</span>\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <DropdownOverlay v-if=\"data.open\" ref=\"overlay\" :root=\"rootRef\" class=\"pl-autocomplete__options\" tabindex=\"-1\" :gap=\"3\">\n <DropdownListItem\n v-for=\"(item, index) in renderedOptionsRef\"\n :key=\"index\"\n :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n @click.stop=\"selectOption(item)\"\n />\n <div v-if=\"!renderedOptionsRef.length\" class=\"nothing-found\">Nothing found</div>\n </DropdownOverlay>\n <DoubleContour class=\"pl-autocomplete__contour\" :group-position=\"groupPosition\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"pl-autocomplete__error\">{{ computedError }}</div>\n <div v-else-if=\"isLoadingOptions && loadingOptionsHelper\" class=\"pl-autocomplete__helper\">{{ loadingOptionsHelper }}</div>\n <div v-else-if=\"helper\" class=\"pl-autocomplete__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"names":["__default__","model","_useModel","props","__props","slots","_useSlots","rootRef","ref","input","overlayRef","useTemplateRef","search","data","reactive","findActiveIndex","tap","renderedOptionsRef","o","deepEqual","v","updateActive","loadedOptionsRef","modelOptionRef","computed","normalizeListOptions","opt","index","selectedIndex","isLoadingOptions","isLoadingError","isDisabled","computedError","getErrorMessage","textValue","modelOption","unref","options","item","computedPlaceholder","hasValue","tabindex","selectOption","_a","clear","setFocusOnInput","toggleOpen","watch","onInputFocus","onFocusOut","event","relatedTarget","_c","_b","handleKeydown","open","activeIndex","length","it","localIndex","delta","newIndex","useLabelNotch","watchPostEffect","searchDebounced","refDebounced","optionsRequest","useWatchFetch","modelOptionRequest","result","err","loading","_createElementBlock","_createElementVNode","_normalizeClass","_hoisted_2","_hoisted_3","$event","_openBlock","_hoisted_5","_createVNode","LongText","_hoisted_6","_createBlock","_unref","PlMaskIcon24","PlIcon16","_renderSlot","_ctx","_hoisted_7","_hoisted_8","PlSvg","SvgRequired","PlTooltip","DropdownOverlay","_Fragment","_renderList","DropdownListItem","_withModifiers","_hoisted_9","DoubleContour","_hoisted_10","_toDisplayString","_hoisted_11","_hoisted_12"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PlAutocomplete.vue.js","sources":["../../../src/components/PlAutocomplete/PlAutocomplete.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * A component for selecting one value from a big list of options using string search request\n */\nexport default {\n name: 'PlAutocomplete',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M extends null | undefined | string | number = null | undefined | string\">\nimport './pl-autocomplete.scss';\nimport { computed, reactive, ref, unref, useTemplateRef, watch, watchPostEffect } from 'vue';\nimport { tap } from '../../helpers/functions';\nimport { PlTooltip } from '../PlTooltip';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport type { ListOption, ListOptionNormalized } from '../../types';\nimport { deepEqual } from '../../helpers/objects';\nimport DropdownListItem from '../DropdownListItem.vue';\nimport LongText from '../LongText.vue';\nimport { normalizeListOptions } from '../../helpers/utils';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport { DropdownOverlay } from '../../utils/DropdownOverlay';\nimport { refDebounced } from '@vueuse/core';\nimport { useWatchFetch } from '../../composition/useWatchFetch.ts';\nimport { getErrorMessage } from '../../helpers/error.ts';\nimport type { ListOptionBase } from '@platforma-sdk/model';\nimport { PlSvg } from '../PlSvg';\nimport SvgRequired from '../../assets/images/required.svg?raw';\n\n/**\n * The current selected value.\n */\nconst model = defineModel<M>({ required: true });\n\nconst props = withDefaults(\n defineProps<{\n /**\n * Lambda for requesting of available options for the dropdown by search string.\n */\n optionsSearch: (s: string) => Promise<ListOption<M>[]>;\n /**\n * Lambda for requesting of corresponding option for current model value. If empty, optionsSearch is used for this.\n */\n modelSearch?: (v: NonNullable<M>) => Promise<ListOption<NonNullable<M>>>;\n /**\n * The label text for the dropdown field (optional)\n */\n label?: string;\n /**\n * A helper text displayed below the dropdown when there are no errors (optional).\n */\n helper?: string;\n /**\n * A helper text displayed below the dropdown when there are no options yet or options is undefined (optional).\n */\n loadingOptionsHelper?: string;\n /**\n * Error message displayed below the dropdown (optional)\n */\n error?: unknown;\n /**\n * Placeholder text shown when no value is selected.\n */\n placeholder?: string;\n /**\n * Enables a button to clear the selected value (default: false)\n */\n clearable?: boolean;\n /**\n * If `true`, the dropdown component is marked as required.\n */\n required?: boolean;\n /**\n * If `true`, the dropdown component is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n /**\n * Custom icon (16px) class for the dropdown arrow (optional)\n */\n arrowIcon?: string;\n /**\n * Custom icon (24px) class for the dropdown arrow (optional)\n */\n arrowIconLarge?: string;\n /**\n * Option list item size\n */\n optionSize?: 'small' | 'medium';\n /**\n * Formatter for the selected value if its label is absent\n */\n formatValue?: (value: M) => string;\n /**\n * Makes some of corners not rounded\n * */\n groupPosition?: 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'middle';\n }>(),\n {\n modelSearch: undefined,\n label: '',\n helper: undefined,\n loadingOptionsHelper: undefined,\n error: undefined,\n placeholder: '...',\n clearable: false,\n required: false,\n disabled: false,\n arrowIcon: undefined,\n arrowIconLarge: undefined,\n optionSize: 'small',\n formatValue: (v: M) => String(v),\n groupPosition: undefined,\n },\n);\n\nconst slots = defineSlots<{\n [key: string]: unknown;\n}>();\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst input = ref<HTMLInputElement | undefined>();\n\nconst overlayRef = useTemplateRef('overlay');\n\nconst search = ref<string | null>(null);\nconst data = reactive({\n activeIndex: -1,\n open: false,\n});\n\nconst findActiveIndex = () =>\n tap(\n renderedOptionsRef.value.findIndex((o) => deepEqual(o.value, model.value)),\n (v) => (v < 0 ? 0 : v),\n );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst loadedOptionsRef = ref<ListOption<M>[]>([]);\nconst modelOptionRef = ref<ListOptionNormalized<M> | undefined>(); // list of 1 option that is selected or empty, to keep selected label\n\nconst renderedOptionsRef = computed(() => {\n return normalizeListOptions(loadedOptionsRef.value).map((opt, index) => ({\n ...opt,\n index,\n isSelected: index === selectedIndex.value,\n isActive: index === data.activeIndex,\n })) as (ListOptionBase<M> & { index: number; isSelected: boolean; isActive: boolean })[];\n});\nconst isLoadingOptions = ref<boolean>(true);\nconst isLoadingError = ref<boolean>(false);\n\nconst isDisabled = computed(() => {\n return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n return loadedOptionsRef.value.findIndex((o) => deepEqual(o.value, model.value));\n});\n\nconst computedError = computed(() => {\n if (isLoadingOptions.value) {\n return undefined;\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (isLoadingError.value) {\n return 'Data loading error';\n }\n\n return undefined;\n});\n\nconst textValue = computed(() => {\n const modelOption = unref(modelOptionRef);\n const options = unref(renderedOptionsRef);\n\n const item: ListOptionNormalized | undefined = modelOption ?? options.find((o) => deepEqual(o.value, model.value)) ?? options.find((o) => deepEqual(o.value, model.value));\n\n return item?.label || (model.value ? props.formatValue(model.value) : '');\n});\n\nconst computedPlaceholder = computed(() => {\n if (!data.open && model.value) {\n return '';\n }\n\n return model.value ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n return model.value !== undefined && model.value !== null;\n});\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : '0'));\n\nconst selectOption = (v: ListOptionBase<M> & { index: number } | undefined) => {\n model.value = v?.value as M;\n modelOptionRef.value = v;\n search.value = null;\n data.open = false;\n rootRef?.value?.focus();\n};\n\nconst clear = () => {\n model.value = undefined as M;\n modelOptionRef.value = undefined;\n};\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => {\n data.open = !data.open;\n};\n\nwatch(() => data.open, (v) => {\n search.value = v ? '' : null;\n});\n\nconst onInputFocus = () => {\n data.open = true;\n};\n\nconst onFocusOut = (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as Node | null;\n\n if (!rootRef.value?.contains(relatedTarget) && !overlayRef.value?.listRef?.contains(relatedTarget)) {\n search.value = null;\n data.open = false;\n }\n};\n\nconst handleKeydown = (e: { code: string; preventDefault(): void }) => {\n if (!['ArrowDown', 'ArrowUp', 'Enter', 'Escape'].includes(e.code)) {\n return;\n } else {\n e.preventDefault();\n }\n\n const { open, activeIndex } = data;\n\n if (!open) {\n if (e.code === 'Enter') {\n data.open = true;\n search.value = '';\n }\n return;\n }\n\n if (e.code === 'Escape') {\n data.open = false;\n search.value = null;\n rootRef.value?.focus();\n }\n\n const options = unref(renderedOptionsRef);\n\n const { length } = options;\n\n if (!length) {\n return;\n }\n\n if (e.code === 'Enter') {\n selectOption(options.find((it) => it.index === activeIndex));\n }\n\n const localIndex = options.findIndex((it) => it.index === activeIndex) ?? -1;\n\n const delta = e.code === 'ArrowDown' ? 1 : e.code === 'ArrowUp' ? -1 : 0;\n\n const newIndex = Math.abs(localIndex + delta + length) % length;\n\n data.activeIndex = renderedOptionsRef.value[newIndex].index ?? -1;\n};\n\nuseLabelNotch(rootRef);\n\nwatch(() => model.value, updateActive, { immediate: true });\n\nwatch(\n () => data.open,\n (open) => (open ? input.value?.focus() : ''),\n);\n\nwatchPostEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n search.value; // to watch\n\n if (data.activeIndex >= 0 && data.open) {\n overlayRef.value?.scrollIntoActive();\n }\n});\n\nconst searchDebounced = refDebounced(search, 300, { maxWait: 1000 });\n\nconst optionsRequest = useWatchFetch(() => searchDebounced.value, async (v) => {\n if (v !== null) { // search is null when dropdown is closed;\n return props.optionsSearch(v);\n }\n return undefined;\n});\n\nconst modelOptionRequest = useWatchFetch(() => model.value, async (v) => {\n if (v != null && !deepEqual(modelOptionRef.value?.value, v)) { // load label for selected value if it was updated from outside the component\n if (props.modelSearch) {\n return props.modelSearch(v);\n }\n return (await props.optionsSearch(String(v)))?.[0];\n }\n return modelOptionRef.value;\n});\n\nwatch(() => optionsRequest.value, (result) => {\n if (result) {\n loadedOptionsRef.value = result;\n if (search.value !== null) {\n isLoadingError.value = false;\n }\n }\n});\n\nwatch(() => modelOptionRequest.value, (result) => {\n if (result) {\n modelOptionRef.value = normalizeListOptions([result])[0];\n }\n});\n\nwatch(() => optionsRequest.error, (err) => {\n if (err) {\n isLoadingError.value = Boolean(err);\n }\n});\n\nwatch(() => optionsRequest.loading || modelOptionRequest.loading, (loading) => {\n isLoadingOptions.value = loading;\n});\n</script>\n\n<template>\n <div class=\"pl-autocomplete__envelope\" @click.stop=\"setFocusOnInput\">\n <div\n ref=\"rootRef\"\n :tabindex=\"tabindex\"\n class=\"pl-autocomplete\"\n :class=\"{ open: data.open, error: Boolean(computedError), disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"pl-autocomplete__container\">\n <div class=\"pl-autocomplete__field\">\n <input\n ref=\"input\"\n v-model=\"search\"\n type=\"text\"\n tabindex=\"-1\"\n :disabled=\"isDisabled\"\n :placeholder=\"computedPlaceholder\"\n spellcheck=\"false\"\n autocomplete=\"chrome-off\"\n @focus=\"onInputFocus\"\n />\n\n <div v-if=\"!data.open\" class=\"input-value\">\n <LongText> {{ textValue }} </LongText>\n </div>\n\n <div class=\"pl-autocomplete__controls\">\n <PlMaskIcon24 v-if=\"isLoadingOptions\" name=\"loading\" />\n <PlIcon16 v-if=\"clearable && hasValue\" class=\"clear\" name=\"delete-clear\" @click.stop=\"clear\" />\n <slot name=\"append\" />\n <div class=\"pl-autocomplete__arrow-wrapper\" @click.stop=\"toggleOpen\">\n <div v-if=\"arrowIconLarge\" class=\"arrow-icon\" :class=\"[`icon-24 ${arrowIconLarge}`]\" />\n <div v-else-if=\"arrowIcon\" class=\"arrow-icon\" :class=\"[`icon-16 ${arrowIcon}`]\" />\n <div v-else class=\"arrow-icon arrow-icon-default\" />\n </div>\n </div>\n </div>\n <label v-if=\"label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n <span>{{ label }}</span>\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <DropdownOverlay v-if=\"data.open\" ref=\"overlay\" :root=\"rootRef\" class=\"pl-autocomplete__options\" tabindex=\"-1\" :gap=\"3\">\n <DropdownListItem\n v-for=\"(item, index) in renderedOptionsRef\"\n :key=\"index\"\n :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n @click.stop=\"selectOption(item)\"\n />\n <div v-if=\"!renderedOptionsRef.length\" class=\"nothing-found\">Nothing found</div>\n </DropdownOverlay>\n <DoubleContour class=\"pl-autocomplete__contour\" :group-position=\"groupPosition\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"pl-autocomplete__error\">{{ computedError }}</div>\n <div v-else-if=\"isLoadingOptions && loadingOptionsHelper\" class=\"pl-autocomplete__helper\">{{ loadingOptionsHelper }}</div>\n <div v-else-if=\"helper\" class=\"pl-autocomplete__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"names":["__default__","model","_useModel","props","__props","slots","_useSlots","rootRef","ref","input","overlayRef","useTemplateRef","search","data","reactive","findActiveIndex","tap","renderedOptionsRef","o","deepEqual","v","updateActive","loadedOptionsRef","modelOptionRef","computed","normalizeListOptions","opt","index","selectedIndex","isLoadingOptions","isLoadingError","isDisabled","computedError","getErrorMessage","textValue","modelOption","unref","options","item","computedPlaceholder","hasValue","tabindex","selectOption","_a","clear","setFocusOnInput","toggleOpen","watch","onInputFocus","onFocusOut","event","relatedTarget","_c","_b","handleKeydown","open","activeIndex","length","it","localIndex","delta","newIndex","useLabelNotch","watchPostEffect","searchDebounced","refDebounced","optionsRequest","useWatchFetch","modelOptionRequest","result","err","loading","_createElementBlock","_createElementVNode","_normalizeClass","_hoisted_2","_hoisted_3","$event","_openBlock","_hoisted_5","_createVNode","LongText","_hoisted_6","_createBlock","_unref","PlMaskIcon24","PlIcon16","_renderSlot","_ctx","_hoisted_7","_hoisted_8","PlSvg","SvgRequired","PlTooltip","DropdownOverlay","_Fragment","_renderList","DropdownListItem","_withModifiers","_hoisted_9","DoubleContour","_hoisted_10","_toDisplayString","_hoisted_11","_hoisted_12"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIAA,KAAe;AAAA,EACb,MAAM;AACR;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,UAAMC,IAAQC,kBAAiC,GAEzCC,IAAQC,GAiFRC,IAAQC,GAAA,GAIRC,IAAUC,EAAA,GACVC,IAAQD,EAAA,GAERE,IAAaC,GAAe,SAAS,GAErCC,IAASJ,EAAmB,IAAI,GAChCK,IAAOC,GAAS;AAAA,MACpB,aAAa;AAAA,MACb,MAAM;AAAA,IAAA,CACP,GAEKC,IAAkB,MACtBC;AAAA,MACEC,EAAmB,MAAM,UAAU,CAACC,MAAMC,EAAUD,EAAE,OAAOjB,EAAM,KAAK,CAAC;AAAA,MACzE,CAACmB,MAAOA,IAAI,IAAI,IAAIA;AAAA,IAAA,GAGlBC,IAAe,MAAOR,EAAK,cAAcE,EAAA,GAEzCO,IAAmBd,EAAqB,EAAE,GAC1Ce,IAAiBf,EAAA,GAEjBS,IAAqBO,EAAS,MAC3BC,EAAqBH,EAAiB,KAAK,EAAE,IAAI,CAACI,GAAKC,OAAW;AAAA,MACvE,GAAGD;AAAA,MACH,OAAAC;AAAA,MACA,YAAYA,MAAUC,EAAc;AAAA,MACpC,UAAUD,MAAUd,EAAK;AAAA,IAAA,EACzB,CACH,GACKgB,IAAmBrB,EAAa,EAAI,GACpCsB,IAAiBtB,EAAa,EAAK,GAEnCuB,IAAaP,EAAS,MACnBrB,EAAM,QACd,GAEKyB,IAAgBJ,EAAS,MACtBF,EAAiB,MAAM,UAAU,CAACJ,MAAMC,EAAUD,EAAE,OAAOjB,EAAM,KAAK,CAAC,CAC/E,GAEK+B,IAAgBR,EAAS,MAAM;AACnC,UAAI,CAAAK,EAAiB,OAIrB;AAAA,YAAI1B,EAAM;AACR,iBAAO8B,GAAgB9B,EAAM,KAAK;AAGpC,YAAI2B,EAAe;AACjB,iBAAO;AAAA;AAAA,IAIX,CAAC,GAEKI,IAAYV,EAAS,MAAM;AAC/B,YAAMW,IAAcC,EAAMb,CAAc,GAClCc,IAAUD,EAAMnB,CAAkB,GAElCqB,IAAyCH,KAAeE,EAAQ,KAAK,CAACnB,MAAMC,EAAUD,EAAE,OAAOjB,EAAM,KAAK,CAAC,KAAKoC,EAAQ,KAAK,CAACnB,MAAMC,EAAUD,EAAE,OAAOjB,EAAM,KAAK,CAAC;AAEzK,cAAOqC,KAAA,gBAAAA,EAAM,WAAUrC,EAAM,QAAQE,EAAM,YAAYF,EAAM,KAAK,IAAI;AAAA,IACxE,CAAC,GAEKsC,IAAsBf,EAAS,MAC/B,CAACX,EAAK,QAAQZ,EAAM,QACf,KAGFA,EAAM,QAAQ,OAAOiC,EAAU,KAAK,IAAI/B,EAAM,WACtD,GAEKqC,IAAWhB,EAAS,MACjBvB,EAAM,UAAU,UAAaA,EAAM,UAAU,IACrD,GAEKwC,IAAWjB,EAAS,MAAOO,EAAW,QAAQ,SAAY,GAAI,GAE9DW,IAAe,CAACtB,MAAyD;;AAC7E,MAAAnB,EAAM,QAAQmB,KAAA,gBAAAA,EAAG,OACjBG,EAAe,QAAQH,GACvBR,EAAO,QAAQ,MACfC,EAAK,OAAO,KACZ8B,IAAApC,KAAA,gBAAAA,EAAS,UAAT,QAAAoC,EAAgB;AAAA,IAClB,GAEMC,IAAQ,MAAM;AAClB,MAAA3C,EAAM,QAAQ,QACdsB,EAAe,QAAQ;AAAA,IACzB,GAEMsB,IAAkB,MAAA;;AAAM,cAAAF,IAAAlC,EAAM,UAAN,gBAAAkC,EAAa;AAAA,OAErCG,IAAa,MAAM;AACvB,MAAAjC,EAAK,OAAO,CAACA,EAAK;AAAA,IACpB;AAEA,IAAAkC,EAAM,MAAMlC,EAAK,MAAM,CAACO,MAAM;AAC5B,MAAAR,EAAO,QAAQQ,IAAI,KAAK;AAAA,IAC1B,CAAC;AAED,UAAM4B,KAAe,MAAM;AACzB,MAAAnC,EAAK,OAAO;AAAA,IACd,GAEMoC,KAAa,CAACC,MAAsB;;AACxC,YAAMC,IAAgBD,EAAM;AAE5B,MAAI,GAACP,IAAApC,EAAQ,UAAR,QAAAoC,EAAe,SAASQ,OAAkB,GAACC,KAAAC,IAAA3C,EAAW,UAAX,gBAAA2C,EAAkB,YAAlB,QAAAD,EAA2B,SAASD,QAClFvC,EAAO,QAAQ,MACfC,EAAK,OAAO;AAAA,IAEhB,GAEMyC,KAAgB,CAAC,MAAgD;;AACrE,UAAK,CAAC,aAAa,WAAW,SAAS,QAAQ,EAAE,SAAS,EAAE,IAAI;AAG9D,UAAE,eAAA;AAAA;AAFF;AAKF,YAAM,EAAE,MAAAC,GAAM,aAAAC,EAAA,IAAgB3C;AAE9B,UAAI,CAAC0C,GAAM;AACT,QAAI,EAAE,SAAS,YACb1C,EAAK,OAAO,IACZD,EAAO,QAAQ;AAEjB;AAAA,MACF;AAEA,MAAI,EAAE,SAAS,aACbC,EAAK,OAAO,IACZD,EAAO,QAAQ,OACf+B,IAAApC,EAAQ,UAAR,QAAAoC,EAAe;AAGjB,YAAMN,IAAUD,EAAMnB,CAAkB,GAElC,EAAE,QAAAwC,MAAWpB;AAEnB,UAAI,CAACoB;AACH;AAGF,MAAI,EAAE,SAAS,WACbf,EAAaL,EAAQ,KAAK,CAACqB,MAAOA,EAAG,UAAUF,CAAW,CAAC;AAG7D,YAAMG,KAAatB,EAAQ,UAAU,CAACqB,MAAOA,EAAG,UAAUF,CAAW,KAAK,IAEpEI,KAAQ,EAAE,SAAS,cAAc,IAAI,EAAE,SAAS,YAAY,KAAK,GAEjEC,KAAW,KAAK,IAAIF,KAAaC,KAAQH,CAAM,IAAIA;AAEzD,MAAA5C,EAAK,cAAcI,EAAmB,MAAM4C,EAAQ,EAAE,SAAS;AAAA,IACjE;AAEA,IAAAC,GAAcvD,CAAO,GAErBwC,EAAM,MAAM9C,EAAM,OAAOoB,GAAc,EAAE,WAAW,IAAM,GAE1D0B;AAAA,MACE,MAAMlC,EAAK;AAAA,MACX,CAAC0C,MAAA;;AAAU,eAAAA,KAAOZ,IAAAlC,EAAM,UAAN,gBAAAkC,EAAa,UAAU;AAAA;AAAA,IAAA,GAG3CoB,GAAgB,MAAM;;AAEpB,MAAAnD,EAAO,OAEHC,EAAK,eAAe,KAAKA,EAAK,UAChC8B,IAAAjC,EAAW,UAAX,QAAAiC,EAAkB;AAAA,IAEtB,CAAC;AAED,UAAMqB,KAAkBC,GAAarD,GAAQ,KAAK,EAAE,SAAS,KAAM,GAE7DsD,IAAiBC,EAAc,MAAMH,GAAgB,OAAO,OAAO5C,MAAM;AAC7E,UAAIA,MAAM;AACR,eAAOjB,EAAM,cAAciB,CAAC;AAAA,IAGhC,CAAC,GAEKgD,IAAqBD,EAAc,MAAMlE,EAAM,OAAO,OAAOmB,MAAM;;AACvE,aAAIA,KAAK,QAAQ,CAACD,GAAUwB,IAAApB,EAAe,UAAf,gBAAAoB,EAAsB,OAAOvB,CAAC,IACpDjB,EAAM,cACDA,EAAM,YAAYiB,CAAC,KAEpBiC,IAAA,MAAMlD,EAAM,cAAc,OAAOiB,CAAC,CAAC,MAAnC,gBAAAiC,EAAwC,KAE3C9B,EAAe;AAAA,IACxB,CAAC;AAED,WAAAwB,EAAM,MAAMmB,EAAe,OAAO,CAACG,MAAW;AAC5C,MAAIA,MACF/C,EAAiB,QAAQ+C,GACrBzD,EAAO,UAAU,SACnBkB,EAAe,QAAQ;AAAA,IAG7B,CAAC,GAEDiB,EAAM,MAAMqB,EAAmB,OAAO,CAACC,MAAW;AAChD,MAAIA,MACF9C,EAAe,QAAQE,EAAqB,CAAC4C,CAAM,CAAC,EAAE,CAAC;AAAA,IAE3D,CAAC,GAEDtB,EAAM,MAAMmB,EAAe,OAAO,CAACI,MAAQ;AACzC,MAAIA,MACFxC,EAAe,QAAQ,EAAQwC;AAAA,IAEnC,CAAC,GAEDvB,EAAM,MAAMmB,EAAe,WAAWE,EAAmB,SAAS,CAACG,MAAY;AAC7E,MAAA1C,EAAiB,QAAQ0C;AAAA,IAC3B,CAAC,mBAICC,EAiEM,OAAA;AAAA,MAjED,OAAM;AAAA,MAA6B,WAAY3B,GAAe,CAAA,MAAA,CAAA;AAAA,IAAA;MACjE4B,EA4DM,OAAA;AAAA,iBA3DA;AAAA,QAAJ,KAAIlE;AAAA,QACH,UAAUkC,EAAA;AAAA,QACX,OAAKiC,EAAA,CAAC,mBAAiB,EAAA,MACP7D,EAAK,MAAI,OAAS,EAAQmB,EAAA,OAAa,UAAaD,EAAA,MAAA,CAAU,CAAA;AAAA,QAC7E,WAASuB;AAAA,QACT,YAAUL;AAAA,MAAA;QAEXwB,EAmDM,OAnDNE,IAmDM;AAAA,UAlDJF,EA2BM,OA3BNG,IA2BM;AAAA,eA1BJH,EAUE,SAAA;AAAA,uBATI;AAAA,cAAJ,KAAIhE;AAAA,4DACKG,EAAM,QAAAiE;AAAA,cACf,MAAK;AAAA,cACL,UAAS;AAAA,cACR,UAAU9C,EAAA;AAAA,cACV,aAAaQ,EAAA;AAAA,cACd,YAAW;AAAA,cACX,cAAa;AAAA,cACZ,SAAOS;AAAA,YAAA;mBAPCpC,EAAA,KAAM;AAAA,YAAA;YAULC,EAAK,oBAAjBiE,KAAAN,EAEM,OAFNO,IAEM;AAAA,cADJC,EAAsCC,IAAA,MAAA;AAAA,2BAA3B,MAAe;AAAA,uBAAZ/C,EAAA,KAAS,GAAA,CAAA;AAAA,gBAAA;;;;YAGzBuC,EASM,OATNS,IASM;AAAA,cARgBrD,EAAA,cAApBsD,EAAuDC,EAAAC,EAAA,GAAA;AAAA;gBAAjB,MAAK;AAAA,cAAA;cAC3BjF,EAAA,aAAaoC,EAAA,cAA7B2C,EAA+FC,EAAAE,EAAA,GAAA;AAAA;gBAAxD,OAAM;AAAA,gBAAQ,MAAK;AAAA,gBAAgB,WAAY1C,GAAK,CAAA,MAAA,CAAA;AAAA,cAAA;cAC3F2C,EAAsBC,EAAA,QAAA,QAAA;AAAA,cACtBf,EAIM,OAAA;AAAA,gBAJD,OAAM;AAAA,gBAAkC,WAAY3B,GAAU,CAAA,MAAA,CAAA;AAAA,cAAA;gBACtD1C,EAAA,uBAAXoE,EAAuF,OAAA;AAAA;kBAA5D,OAAKE,EAAA,CAAC,cAAY,CAAA,WAAqBtE,EAAA,cAAc,EAAA,CAAA,CAAA;AAAA,gBAAA,eAChEA,EAAA,kBAAhBoE,EAAkF,OAAA;AAAA;kBAAvD,OAAKE,EAAA,CAAC,cAAY,CAAA,WAAqBtE,EAAA,SAAS,EAAA,CAAA,CAAA;AAAA,gBAAA,gBAC3E0E,KAAAN,EAAoD,OAApDiB,EAAoD;AAAA,cAAA;;;UAI7CrF,EAAA,cAAboE,EAQQ,SAAAkB,IAAA;AAAA,YAPOtF,EAAA,iBAAb+E,EAA4CC,EAAAO,EAAA,GAAA;AAAA;cAApB,KAAKP,EAAAQ,EAAA;AAAA,YAAA;YAC7BnB,EAAwB,gBAAfrE,EAAA,KAAK,GAAA,CAAA;AAAA,YACGC,EAAM,gBAAvB8E,EAIYC,EAAAS,EAAA,GAAA;AAAA;cAJoB,OAAM;AAAA,cAAO,UAAS;AAAA,YAAA;cACzC,WACT,MAAuB;AAAA,gBAAvBN,EAAuBC,EAAA,QAAA,SAAA;AAAA,cAAA;;;;UAIN3E,EAAK,aAA5BsE,EAWkBC,EAAAU,EAAA,GAAA;AAAA;YAXgB,KAAI;AAAA,YAAW,MAAMvF,EAAA;AAAA,YAAS,OAAM;AAAA,YAA2B,UAAS;AAAA,YAAM,KAAK;AAAA,UAAA;uBAEjH,MAA2C;AAAA,eAD7CuE,EAAA,EAAA,GAAAN,EAQEuB,IAAA,MAAAC,GAPwB/E,EAAA,OAAkB,CAAlCqB,GAAMX,YADhBwD,EAQEc,IAAA;AAAA,gBANC,KAAKtE;AAAA,gBACL,QAAQW;AAAA,gBACR,eAAaA,EAAK;AAAA,gBAClB,cAAYA,EAAK;AAAA,gBACjB,MAAMlC,EAAA;AAAA,gBACN,SAAK8F,EAAA,CAAArB,MAAOnC,EAAaJ,CAAI,GAAA,CAAA,MAAA,CAAA;AAAA,cAAA;cAEpBrB,EAAA,MAAmB,2BAA/BuD,EAAgF,OAAhF2B,IAA6D,eAAa;AAAA;;;UAE5EnB,EAAkFoB,IAAA;AAAA,YAAnE,OAAM;AAAA,YAA4B,kBAAgBhG,EAAA;AAAA,UAAA;;;MAG1D4B,EAAA,cAAXwC,EAAkF,OAAlF6B,IAAkFC,EAAtBtE,EAAA,KAAa,GAAA,CAAA,KACzDH,EAAA,SAAoBzB,EAAA,6BAApCoE,EAA0H,OAA1H+B,IAA0HD,EAA7BlG,EAAA,oBAAoB,GAAA,CAAA,KACjGA,EAAA,eAAhBoE,EAA0E,OAA1EgC,IAA0EF,EAAflG,EAAA,MAAM,GAAA,CAAA;;;;"}
|
|
@@ -32,7 +32,7 @@ import { ListOptionBase } from '@platforma-sdk/model';
|
|
|
32
32
|
* return users.map(user => ({ value: user.id, label: user.name }))
|
|
33
33
|
* }
|
|
34
34
|
*/
|
|
35
|
-
declare const _default: <M =
|
|
35
|
+
declare const _default: <M extends string | number = string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
36
36
|
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
|
|
37
37
|
readonly "onUpdate:modelValue"?: ((v: M[]) => any) | undefined;
|
|
38
38
|
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue"> & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlAutocompleteMulti.vue.js","sources":["../../../src/components/PlAutocompleteMulti/PlAutocompleteMulti.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * A multi-select autocomplete component that allows users to search and select multiple values from a list of options.\n * Supports async data fetching, keyboard navigation, and displays selected items as removable chips.\n *\n * @example\n * Basic usage:\n * <PlAutocompleteMulti\n * v-model=\"selectedUsers\"\n * :options-search=\"searchUsers\"\n * :model-search=\"getUsersByIds\"\n * label=\"Select Users\"\n * placeholder=\"Search for users...\"\n * required\n * :debounce=\"300\"\n * helper=\"Choose one or more users from the list\"\n * />\n *\n * With async functions:\n * const selectedUsers = ref([])\n *\n * const searchUsers = async (searchTerm) => {\n * const response = await fetch('/api/users/search?q=' + searchTerm)\n * const users = await response.json()\n * return users.map(user => ({ value: user.id, label: user.name }))\n * }\n *\n * const getUsersByIds = async (userIds) => {\n * if (!userIds.length) return []\n * const response = await fetch('/api/users?ids=' + userIds.join(','))\n * const users = await response.json()\n * return users.map(user => ({ value: user.id, label: user.name }))\n * }\n */\nexport default {\n name: 'PlAutocompleteMulti',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport './pl-autocomplete-multi.scss';\n\nimport type { ListOptionBase } from '@platforma-sdk/model';\nimport canonicalize from 'canonicalize';\nimport { computed, reactive, ref, toRef, unref, useSlots, useTemplateRef, watch } from 'vue';\nimport { useWatchFetch } from '../../composition/useWatchFetch.ts';\nimport { getErrorMessage } from '../../helpers/error.ts';\nimport { deepEqual, deepIncludes } from '../../helpers/objects';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport DropdownOverlay from '../../utils/DropdownOverlay/DropdownOverlay.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport DropdownListItem from '../DropdownListItem.vue';\nimport { PlChip } from '../PlChip';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport { PlTooltip } from '../PlTooltip';\n\nimport SvgRequired from '../../assets/images/required.svg?raw';\nimport { PlSvg } from '../PlSvg';\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', v: M[]): void;\n}>();\n\nconst emitModel = (v: M[]) => emit('update:modelValue', v);\n\nconst slots = useSlots();\n\nconst props = withDefaults(\n defineProps<{\n /**\n * The current selected values.\n */\n modelValue: M[];\n /**\n * Lambda for requesting of available options for the dropdown by search string.\n */\n optionsSearch: (s: string) => Promise<Readonly<ListOptionBase<M>[]>>;\n /**\n * Lambda for requesting options that correspond to the current model values.\n */\n modelSearch: (values: M[]) => Promise<Readonly<ListOptionBase<M>[]>>;\n /**\n * Unique identifier for the source of the options, changing it will invalidate the options cache.\n */\n sourceId?: string;\n /**\n * The label text for the dropdown field (optional)\n */\n label?: string;\n /**\n * A helper text displayed below the dropdown when there are no errors (optional).\n */\n helper?: string;\n /**\n * Error message displayed below the dropdown (optional)\n */\n error?: unknown;\n /**\n * Placeholder text shown when no value is selected.\n */\n placeholder?: string;\n /**\n * If `true`, the dropdown component is marked as required.\n */\n required?: boolean;\n /**\n * If `true`, the dropdown component is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n /**\n * Debounce time in ms for the options search.\n */\n debounce?: number;\n /**\n * If `true`, the search input is reset and focus is set on it when the new option is selected.\n */\n resetSearchOnSelect?: boolean;\n /**\n * The text to display when no options are found.\n */\n emptyOptionsText?: string;\n /**\n * Makes some of corners not rounded\n * */\n groupPosition?: 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'middle';\n }>(),\n {\n modelValue: () => [],\n label: undefined,\n helper: undefined,\n error: undefined,\n placeholder: '...',\n required: false,\n disabled: false,\n debounce: 300,\n emptyOptionsText: 'Nothing found',\n sourceId: undefined,\n groupPosition: undefined,\n },\n);\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst inputRef = ref<HTMLInputElement | undefined>();\n\nconst overlay = useTemplateRef('overlay');\n\nconst data = reactive({\n search: '',\n activeOption: -1,\n open: false,\n optionsHeight: 0,\n});\n\nwatch(() => data.open, (v) => {\n if (!v) {\n data.search = '';\n }\n}, { flush: 'sync' });\n\nconst selectedValuesRef = computed(() => (Array.isArray(props.modelValue) ? props.modelValue : []));\n\nconst placeholderRef = computed(() => {\n if (data.open && props.modelValue.length > 0) {\n return props.placeholder;\n }\n\n return props.modelValue.length > 0 ? '' : props.placeholder;\n});\n\nconst debounce = toRef(props, 'debounce');\n\nconst searchOptionsRef = useWatchFetch(() => [data.search, data.open, props.sourceId] as const, async ([search, _open]) => {\n return props.optionsSearch(search);\n}, {\n filterWatchResult: ([_search, open]) => open,\n debounce,\n});\n\nconst modelOptionsRef = useWatchFetch(() => [props.modelValue, props.sourceId] as const, async ([v]) => {\n return props.modelSearch(v);\n}, {\n debounce,\n});\n\nconst allOptionsRef = computed(() => {\n const modelOptions = modelOptionsRef.value ?? [];\n const searchOptions = searchOptionsRef.value ?? [];\n\n const seenValues = new Set<string | undefined>();\n const result = [] as ListOptionBase<M>[];\n\n const addOptions = (options: Readonly<ListOptionBase<M>[]>) => {\n for (const option of options) {\n const canonicalValue = canonicalize(option.value);\n if (!seenValues.has(canonicalValue)) {\n seenValues.add(canonicalValue);\n result.push(option);\n }\n }\n };\n\n addOptions(modelOptions);\n addOptions(searchOptions);\n\n return result;\n});\n\nconst selectedOptionsRef = computed(() => {\n return selectedValuesRef.value.map((v) =>\n allOptionsRef.value.find((opt) => deepEqual(opt.value, v))).filter((v) => v !== undefined,\n );\n});\n\nconst filteredOptionsRef = computed(() => {\n const selectedValues = unref(selectedValuesRef);\n\n const options = searchOptionsRef.value ?? [];\n\n return [...options].map((opt) => ({\n ...opt,\n selected: deepIncludes(selectedValues, opt.value),\n }));\n});\n\nconst isOptionsLoading = computed(() => searchOptionsRef.loading || modelOptionsRef.loading);\n\nconst isDisabled = computed(() => {\n if (modelOptionsRef.value === undefined) {\n return true;\n }\n\n return props.disabled;\n});\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : '0'));\n\nconst updateActiveOption = () => {\n data.activeOption = 0;\n};\n\nconst selectOption = (v: M) => {\n const values = unref(selectedValuesRef);\n emitModel(deepIncludes(values, v) ? values.filter((it) => !deepEqual(it, v)) : [...values, v]);\n if (props.resetSearchOnSelect) {\n data.search = '';\n }\n inputRef.value?.focus();\n};\n\nconst unselectOption = (d: M) => emitModel(unref(selectedValuesRef).filter((v) => !deepEqual(v, d)));\n\nconst setFocusOnInput = () => inputRef.value?.focus();\n\nconst toggleOpen = () => data.open = !data.open;\n\nconst onFocusOut = (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as Node | null;\n\n if (!rootRef.value?.contains(relatedTarget) && !overlay.value?.listRef?.contains(relatedTarget)) {\n data.open = false;\n }\n};\n\nconst handleKeydown = (e: { code: string; preventDefault(): void }) => {\n const { open, activeOption } = data;\n\n if (!open) {\n if (e.code === 'Enter') {\n data.open = true;\n }\n return;\n }\n\n if (e.code === 'Escape') {\n data.open = false;\n inputRef.value?.focus();\n }\n\n const filteredOptions = unref(filteredOptionsRef);\n\n const { length } = filteredOptions;\n\n if (!length) {\n return;\n }\n\n if (['ArrowDown', 'ArrowUp', 'Enter'].includes(e.code)) {\n e.preventDefault();\n }\n\n if (e.code === 'Enter') {\n selectOption(filteredOptions[activeOption].value);\n }\n\n const d = e.code === 'ArrowDown' ? 1 : e.code === 'ArrowUp' ? -1 : 0;\n\n data.activeOption = Math.abs(activeOption + d + length) % length;\n\n requestAnimationFrame(() => overlay.value?.scrollIntoActive());\n};\n\nuseLabelNotch(rootRef);\n\nwatch(\n () => props.modelValue,\n () => updateActiveOption(),\n { immediate: true },\n);\n\nconst computedError = computed(() => {\n if (isOptionsLoading.value) {\n return undefined;\n }\n\n if (searchOptionsRef.error) {\n return getErrorMessage(searchOptionsRef.error);\n }\n\n if (modelOptionsRef.error) {\n return getErrorMessage(modelOptionsRef.error);\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (props.modelValue.length && selectedOptionsRef.value.length !== props.modelValue.length) {\n return 'The selected values are not one of the options';\n }\n\n return undefined;\n});\n</script>\n\n<template>\n <div class=\"pl-autocomplete-multi__envelope\" @click=\"setFocusOnInput\">\n <div\n ref=\"rootRef\"\n :tabindex=\"tabindex\"\n class=\"pl-autocomplete-multi\"\n :class=\"{ open: data.open, error: Boolean(computedError), disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"pl-autocomplete-multi__container\">\n <div class=\"pl-autocomplete-multi__field\">\n <input\n ref=\"inputRef\"\n v-model=\"data.search\"\n type=\"text\"\n tabindex=\"-1\"\n :disabled=\"isDisabled\"\n :placeholder=\"placeholderRef\"\n spellcheck=\"false\"\n autocomplete=\"chrome-off\"\n @focus=\"data.open = true\"\n />\n <div v-if=\"!data.open\" class=\"chips-container\">\n <PlChip v-for=\"(opt, i) in selectedOptionsRef\" :key=\"i\" closeable small @click.stop=\"data.open = true\" @close=\"unselectOption(opt.value)\">\n {{ opt.label || opt.value }}\n </PlChip>\n </div>\n\n <div class=\"pl-autocomplete-multi__controls\">\n <PlMaskIcon24 v-if=\"isOptionsLoading\" name=\"loading\" />\n <slot name=\"append\" />\n <div class=\"pl-autocomplete-multi__arrow-wrapper\" @click.stop=\"toggleOpen\">\n <div class=\"arrow-icon arrow-icon-default\" />\n </div>\n </div>\n </div>\n <label v-if=\"label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n <span>{{ label }}</span>\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <DropdownOverlay\n v-if=\"data.open\"\n ref=\"overlay\"\n :root=\"rootRef\"\n class=\"pl-autocomplete-multi__options\"\n :gap=\"5\"\n tabindex=\"-1\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"pl-autocomplete-multi__open-chips-container\">\n <PlChip\n v-for=\"(opt, i) in selectedOptionsRef\"\n :key=\"i\"\n closeable\n small\n @close=\"unselectOption(opt.value)\"\n >\n {{ opt.label || opt.value }}\n </PlChip>\n </div>\n <DropdownListItem\n v-for=\"(item, index) in filteredOptionsRef\"\n :key=\"index\"\n :option=\"item\"\n :text-item=\"'text'\"\n :is-selected=\"item.selected\"\n :is-hovered=\"data.activeOption == index\"\n size=\"medium\"\n use-checkbox\n @click.stop=\"selectOption(item.value)\"\n />\n <div v-if=\"!filteredOptionsRef.length && !isOptionsLoading\" class=\"nothing-found\">{{ emptyOptionsText }}</div>\n </DropdownOverlay>\n <DoubleContour class=\"pl-autocomplete-multi__contour\" :group-position=\"groupPosition\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"pl-autocomplete-multi__error\">{{ computedError }}</div>\n <div v-else-if=\"helper\" class=\"pl-autocomplete-multi__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"names":["__default__","emit","__emit","emitModel","v","slots","useSlots","props","__props","rootRef","ref","inputRef","overlay","useTemplateRef","data","reactive","watch","selectedValuesRef","computed","placeholderRef","debounce","toRef","searchOptionsRef","useWatchFetch","search","_open","_search","open","modelOptionsRef","allOptionsRef","modelOptions","searchOptions","seenValues","result","addOptions","options","option","canonicalValue","canonicalize","selectedOptionsRef","opt","deepEqual","filteredOptionsRef","selectedValues","unref","deepIncludes","isOptionsLoading","isDisabled","tabindex","updateActiveOption","selectOption","values","it","_a","unselectOption","d","setFocusOnInput","toggleOpen","onFocusOut","event","relatedTarget","_c","_b","handleKeydown","activeOption","filteredOptions","length","useLabelNotch","computedError","getErrorMessage","_createElementBlock","_createElementVNode","_normalizeClass","_hoisted_2","_hoisted_3","_cache","$event","_vModelText","_openBlock","_hoisted_5","_Fragment","_renderList","i","_createBlock","_unref","PlChip","_withModifiers","_createTextVNode","_toDisplayString","_hoisted_6","PlMaskIcon24","_renderSlot","_ctx","_hoisted_7","PlSvg","SvgRequired","PlTooltip","DropdownOverlay","_hoisted_8","item","index","DropdownListItem","_hoisted_9","_createVNode","DoubleContour","_hoisted_10","_hoisted_11"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PlAutocompleteMulti.vue.js","sources":["../../../src/components/PlAutocompleteMulti/PlAutocompleteMulti.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * A multi-select autocomplete component that allows users to search and select multiple values from a list of options.\n * Supports async data fetching, keyboard navigation, and displays selected items as removable chips.\n *\n * @example\n * Basic usage:\n * <PlAutocompleteMulti\n * v-model=\"selectedUsers\"\n * :options-search=\"searchUsers\"\n * :model-search=\"getUsersByIds\"\n * label=\"Select Users\"\n * placeholder=\"Search for users...\"\n * required\n * :debounce=\"300\"\n * helper=\"Choose one or more users from the list\"\n * />\n *\n * With async functions:\n * const selectedUsers = ref([])\n *\n * const searchUsers = async (searchTerm) => {\n * const response = await fetch('/api/users/search?q=' + searchTerm)\n * const users = await response.json()\n * return users.map(user => ({ value: user.id, label: user.name }))\n * }\n *\n * const getUsersByIds = async (userIds) => {\n * if (!userIds.length) return []\n * const response = await fetch('/api/users?ids=' + userIds.join(','))\n * const users = await response.json()\n * return users.map(user => ({ value: user.id, label: user.name }))\n * }\n */\nexport default {\n name: 'PlAutocompleteMulti',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M extends string | number = string\">\nimport './pl-autocomplete-multi.scss';\n\nimport type { ListOptionBase } from '@platforma-sdk/model';\nimport canonicalize from 'canonicalize';\nimport { computed, reactive, ref, toRef, unref, useSlots, useTemplateRef, watch } from 'vue';\nimport { useWatchFetch } from '../../composition/useWatchFetch.ts';\nimport { getErrorMessage } from '../../helpers/error.ts';\nimport { deepEqual, deepIncludes } from '../../helpers/objects';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport DropdownOverlay from '../../utils/DropdownOverlay/DropdownOverlay.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport DropdownListItem from '../DropdownListItem.vue';\nimport { PlChip } from '../PlChip';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport { PlTooltip } from '../PlTooltip';\n\nimport SvgRequired from '../../assets/images/required.svg?raw';\nimport { PlSvg } from '../PlSvg';\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', v: M[]): void;\n}>();\n\nconst emitModel = (v: M[]) => emit('update:modelValue', v);\n\nconst slots = useSlots();\n\nconst props = withDefaults(\n defineProps<{\n /**\n * The current selected values.\n */\n modelValue: M[];\n /**\n * Lambda for requesting of available options for the dropdown by search string.\n */\n optionsSearch: (s: string) => Promise<Readonly<ListOptionBase<M>[]>>;\n /**\n * Lambda for requesting options that correspond to the current model values.\n */\n modelSearch: (values: M[]) => Promise<Readonly<ListOptionBase<M>[]>>;\n /**\n * Unique identifier for the source of the options, changing it will invalidate the options cache.\n */\n sourceId?: string;\n /**\n * The label text for the dropdown field (optional)\n */\n label?: string;\n /**\n * A helper text displayed below the dropdown when there are no errors (optional).\n */\n helper?: string;\n /**\n * Error message displayed below the dropdown (optional)\n */\n error?: unknown;\n /**\n * Placeholder text shown when no value is selected.\n */\n placeholder?: string;\n /**\n * If `true`, the dropdown component is marked as required.\n */\n required?: boolean;\n /**\n * If `true`, the dropdown component is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n /**\n * Debounce time in ms for the options search.\n */\n debounce?: number;\n /**\n * If `true`, the search input is reset and focus is set on it when the new option is selected.\n */\n resetSearchOnSelect?: boolean;\n /**\n * The text to display when no options are found.\n */\n emptyOptionsText?: string;\n /**\n * Makes some of corners not rounded\n * */\n groupPosition?: 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'middle';\n }>(),\n {\n modelValue: () => [],\n label: undefined,\n helper: undefined,\n error: undefined,\n placeholder: '...',\n required: false,\n disabled: false,\n debounce: 300,\n emptyOptionsText: 'Nothing found',\n sourceId: undefined,\n groupPosition: undefined,\n },\n);\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst inputRef = ref<HTMLInputElement | undefined>();\n\nconst overlay = useTemplateRef('overlay');\n\nconst data = reactive({\n search: '',\n activeOption: -1,\n open: false,\n optionsHeight: 0,\n});\n\nwatch(() => data.open, (v) => {\n if (!v) {\n data.search = '';\n }\n}, { flush: 'sync' });\n\nconst selectedValuesRef = computed(() => (Array.isArray(props.modelValue) ? props.modelValue : []));\n\nconst placeholderRef = computed(() => {\n if (data.open && props.modelValue.length > 0) {\n return props.placeholder;\n }\n\n return props.modelValue.length > 0 ? '' : props.placeholder;\n});\n\nconst debounce = toRef(props, 'debounce');\n\nconst searchOptionsRef = useWatchFetch(() => [data.search, data.open, props.sourceId] as const, async ([search, _open]) => {\n return props.optionsSearch(search);\n}, {\n filterWatchResult: ([_search, open]) => open,\n debounce,\n});\n\nconst modelOptionsRef = useWatchFetch(() => [props.modelValue, props.sourceId] as const, async ([v]) => {\n return props.modelSearch(v);\n}, {\n debounce,\n});\n\nconst allOptionsRef = computed(() => {\n const modelOptions = modelOptionsRef.value ?? [];\n const searchOptions = searchOptionsRef.value ?? [];\n\n const seenValues = new Set<string | undefined>();\n const result = [] as ListOptionBase<M>[];\n\n const addOptions = (options: Readonly<ListOptionBase<M>[]>) => {\n for (const option of options) {\n const canonicalValue = canonicalize(option.value);\n if (!seenValues.has(canonicalValue)) {\n seenValues.add(canonicalValue);\n result.push(option);\n }\n }\n };\n\n addOptions(modelOptions);\n addOptions(searchOptions);\n\n return result;\n});\n\nconst selectedOptionsRef = computed(() => {\n return selectedValuesRef.value.map((v) =>\n allOptionsRef.value.find((opt) => deepEqual(opt.value, v))).filter((v) => v !== undefined,\n );\n});\n\nconst filteredOptionsRef = computed(() => {\n const selectedValues = unref(selectedValuesRef);\n\n const options = searchOptionsRef.value ?? [];\n\n return [...options].map((opt) => ({\n ...opt,\n selected: deepIncludes(selectedValues, opt.value),\n }));\n});\n\nconst isOptionsLoading = computed(() => searchOptionsRef.loading || modelOptionsRef.loading);\n\nconst isDisabled = computed(() => {\n if (modelOptionsRef.value === undefined) {\n return true;\n }\n\n return props.disabled;\n});\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : '0'));\n\nconst updateActiveOption = () => {\n data.activeOption = 0;\n};\n\nconst selectOption = (v: M) => {\n const values = unref(selectedValuesRef);\n emitModel(deepIncludes(values, v) ? values.filter((it) => !deepEqual(it, v)) : [...values, v]);\n if (props.resetSearchOnSelect) {\n data.search = '';\n }\n inputRef.value?.focus();\n};\n\nconst unselectOption = (d: M) => emitModel(unref(selectedValuesRef).filter((v) => !deepEqual(v, d)));\n\nconst setFocusOnInput = () => inputRef.value?.focus();\n\nconst toggleOpen = () => data.open = !data.open;\n\nconst onFocusOut = (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as Node | null;\n\n if (!rootRef.value?.contains(relatedTarget) && !overlay.value?.listRef?.contains(relatedTarget)) {\n data.open = false;\n }\n};\n\nconst handleKeydown = (e: { code: string; preventDefault(): void }) => {\n const { open, activeOption } = data;\n\n if (!open) {\n if (e.code === 'Enter') {\n data.open = true;\n }\n return;\n }\n\n if (e.code === 'Escape') {\n data.open = false;\n inputRef.value?.focus();\n }\n\n const filteredOptions = unref(filteredOptionsRef);\n\n const { length } = filteredOptions;\n\n if (!length) {\n return;\n }\n\n if (['ArrowDown', 'ArrowUp', 'Enter'].includes(e.code)) {\n e.preventDefault();\n }\n\n if (e.code === 'Enter') {\n selectOption(filteredOptions[activeOption].value);\n }\n\n const d = e.code === 'ArrowDown' ? 1 : e.code === 'ArrowUp' ? -1 : 0;\n\n data.activeOption = Math.abs(activeOption + d + length) % length;\n\n requestAnimationFrame(() => overlay.value?.scrollIntoActive());\n};\n\nuseLabelNotch(rootRef);\n\nwatch(\n () => props.modelValue,\n () => updateActiveOption(),\n { immediate: true },\n);\n\nconst computedError = computed(() => {\n if (isOptionsLoading.value) {\n return undefined;\n }\n\n if (searchOptionsRef.error) {\n return getErrorMessage(searchOptionsRef.error);\n }\n\n if (modelOptionsRef.error) {\n return getErrorMessage(modelOptionsRef.error);\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (props.modelValue.length && selectedOptionsRef.value.length !== props.modelValue.length) {\n return 'The selected values are not one of the options';\n }\n\n return undefined;\n});\n</script>\n\n<template>\n <div class=\"pl-autocomplete-multi__envelope\" @click=\"setFocusOnInput\">\n <div\n ref=\"rootRef\"\n :tabindex=\"tabindex\"\n class=\"pl-autocomplete-multi\"\n :class=\"{ open: data.open, error: Boolean(computedError), disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"pl-autocomplete-multi__container\">\n <div class=\"pl-autocomplete-multi__field\">\n <input\n ref=\"inputRef\"\n v-model=\"data.search\"\n type=\"text\"\n tabindex=\"-1\"\n :disabled=\"isDisabled\"\n :placeholder=\"placeholderRef\"\n spellcheck=\"false\"\n autocomplete=\"chrome-off\"\n @focus=\"data.open = true\"\n />\n <div v-if=\"!data.open\" class=\"chips-container\">\n <PlChip v-for=\"(opt, i) in selectedOptionsRef\" :key=\"i\" closeable small @click.stop=\"data.open = true\" @close=\"unselectOption(opt.value)\">\n {{ opt.label || opt.value }}\n </PlChip>\n </div>\n\n <div class=\"pl-autocomplete-multi__controls\">\n <PlMaskIcon24 v-if=\"isOptionsLoading\" name=\"loading\" />\n <slot name=\"append\" />\n <div class=\"pl-autocomplete-multi__arrow-wrapper\" @click.stop=\"toggleOpen\">\n <div class=\"arrow-icon arrow-icon-default\" />\n </div>\n </div>\n </div>\n <label v-if=\"label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n <span>{{ label }}</span>\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <DropdownOverlay\n v-if=\"data.open\"\n ref=\"overlay\"\n :root=\"rootRef\"\n class=\"pl-autocomplete-multi__options\"\n :gap=\"5\"\n tabindex=\"-1\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"pl-autocomplete-multi__open-chips-container\">\n <PlChip\n v-for=\"(opt, i) in selectedOptionsRef\"\n :key=\"i\"\n closeable\n small\n @close=\"unselectOption(opt.value)\"\n >\n {{ opt.label || opt.value }}\n </PlChip>\n </div>\n <DropdownListItem\n v-for=\"(item, index) in filteredOptionsRef\"\n :key=\"index\"\n :option=\"item\"\n :text-item=\"'text'\"\n :is-selected=\"item.selected\"\n :is-hovered=\"data.activeOption == index\"\n size=\"medium\"\n use-checkbox\n @click.stop=\"selectOption(item.value)\"\n />\n <div v-if=\"!filteredOptionsRef.length && !isOptionsLoading\" class=\"nothing-found\">{{ emptyOptionsText }}</div>\n </DropdownOverlay>\n <DoubleContour class=\"pl-autocomplete-multi__contour\" :group-position=\"groupPosition\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"pl-autocomplete-multi__error\">{{ computedError }}</div>\n <div v-else-if=\"helper\" class=\"pl-autocomplete-multi__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"names":["__default__","emit","__emit","emitModel","v","slots","useSlots","props","__props","rootRef","ref","inputRef","overlay","useTemplateRef","data","reactive","watch","selectedValuesRef","computed","placeholderRef","debounce","toRef","searchOptionsRef","useWatchFetch","search","_open","_search","open","modelOptionsRef","allOptionsRef","modelOptions","searchOptions","seenValues","result","addOptions","options","option","canonicalValue","canonicalize","selectedOptionsRef","opt","deepEqual","filteredOptionsRef","selectedValues","unref","deepIncludes","isOptionsLoading","isDisabled","tabindex","updateActiveOption","selectOption","values","it","_a","unselectOption","d","setFocusOnInput","toggleOpen","onFocusOut","event","relatedTarget","_c","_b","handleKeydown","activeOption","filteredOptions","length","useLabelNotch","computedError","getErrorMessage","_createElementBlock","_createElementVNode","_normalizeClass","_hoisted_2","_hoisted_3","_cache","$event","_vModelText","_openBlock","_hoisted_5","_Fragment","_renderList","i","_createBlock","_unref","PlChip","_withModifiers","_createTextVNode","_toDisplayString","_hoisted_6","PlMaskIcon24","_renderSlot","_ctx","_hoisted_7","PlSvg","SvgRequired","PlTooltip","DropdownOverlay","_hoisted_8","item","index","DropdownListItem","_hoisted_9","_createVNode","DoubleContour","_hoisted_10","_hoisted_11"],"mappings":"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"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
declare const _default: <T extends unknown = unknown>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
2
2
|
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
|
|
3
|
+
readonly onClick?: ((item: MouseEvent) => any) | undefined;
|
|
3
4
|
readonly onToggle?: ((item: T, index: number) => any) | undefined;
|
|
4
5
|
readonly onPin?: ((item: T, index: number) => any) | undefined;
|
|
5
6
|
readonly onExpand?: ((item: T, index: number) => any) | undefined;
|
|
6
7
|
readonly onRemove?: ((item: T, index: number) => any) | undefined;
|
|
7
|
-
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onToggle" | "onPin" | "onExpand" | "onRemove"> & {
|
|
8
|
+
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onClick" | "onToggle" | "onPin" | "onExpand" | "onRemove"> & {
|
|
8
9
|
item: T;
|
|
9
10
|
index: number;
|
|
10
11
|
showDragHandle: boolean;
|
|
@@ -60,6 +61,7 @@ declare const _default: <T extends unknown = unknown>(__VLS_props: NonNullable<A
|
|
|
60
61
|
}) => unknown;
|
|
61
62
|
};
|
|
62
63
|
emit: {
|
|
64
|
+
(e: "click", item: MouseEvent): void;
|
|
63
65
|
(e: "expand", item: T, index: number): void;
|
|
64
66
|
(e: "toggle", item: T, index: number): void;
|
|
65
67
|
(e: "pin", item: T, index: number): void;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { defineComponent as E, useSlots as P, computed as b, createElementBlock as n, openBlock as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
const
|
|
1
|
+
import { defineComponent as E, useSlots as P, computed as b, createElementBlock as n, openBlock as t, createCommentVNode as a, createElementVNode as m, normalizeClass as l, renderSlot as v, createBlock as w, createVNode as $, unref as y, withModifiers as p } from "vue";
|
|
2
|
+
import k from "../PlIcon16/PlIcon16.vue.js";
|
|
3
|
+
import c from "../PlIcon24/PlIcon24.vue.js";
|
|
4
|
+
const T = ["data-draggable"], A = /* @__PURE__ */ E({
|
|
5
5
|
inheritAttrs: !1,
|
|
6
6
|
__name: "PlElementListItem",
|
|
7
7
|
props: {
|
|
@@ -22,20 +22,22 @@ const h = ["data-draggable"], A = /* @__PURE__ */ E({
|
|
|
22
22
|
afterClass: {},
|
|
23
23
|
beforeClass: {}
|
|
24
24
|
},
|
|
25
|
-
emits: ["expand", "toggle", "pin", "remove"],
|
|
26
|
-
setup(o, { emit:
|
|
27
|
-
const e = o,
|
|
28
|
-
return (s,
|
|
29
|
-
|
|
25
|
+
emits: ["click", "expand", "toggle", "pin", "remove"],
|
|
26
|
+
setup(o, { emit: f }) {
|
|
27
|
+
const e = o, g = P(), u = b(() => g.content !== void 0), C = b(() => g.after !== void 0), B = b(() => g.before !== void 0), d = f;
|
|
28
|
+
return (s, i) => (t(), n("div", {
|
|
29
|
+
onClick: i[4] || (i[4] = (r) => d("click", r))
|
|
30
|
+
}, [
|
|
31
|
+
B.value ? (t(), n("div", {
|
|
30
32
|
key: 0,
|
|
31
33
|
class: l(o.beforeClass)
|
|
32
34
|
}, [
|
|
33
|
-
|
|
35
|
+
v(s.$slots, "before", {
|
|
34
36
|
item: e.item,
|
|
35
37
|
index: e.index
|
|
36
38
|
})
|
|
37
39
|
], 2)) : a("", !0),
|
|
38
|
-
|
|
40
|
+
m("div", {
|
|
39
41
|
class: l([s.$style.root, s.$attrs.class, {
|
|
40
42
|
[s.$style.active]: e.isActive,
|
|
41
43
|
[s.$style.pinned]: e.isPinned,
|
|
@@ -43,82 +45,82 @@ const h = ["data-draggable"], A = /* @__PURE__ */ E({
|
|
|
43
45
|
[s.$style.disabled]: e.isToggled
|
|
44
46
|
}])
|
|
45
47
|
}, [
|
|
46
|
-
|
|
48
|
+
m("div", {
|
|
47
49
|
class: l([s.$style.head, o.titleClass, {
|
|
48
|
-
[s.$style.clickable]:
|
|
50
|
+
[s.$style.clickable]: u.value
|
|
49
51
|
}]),
|
|
50
|
-
onClick:
|
|
52
|
+
onClick: i[3] || (i[3] = (r) => o.isExpandable && d("expand", e.item, e.index))
|
|
51
53
|
}, [
|
|
52
|
-
e.showDragHandle ? (
|
|
54
|
+
e.showDragHandle ? (t(), n("div", {
|
|
53
55
|
key: 0,
|
|
54
56
|
class: l([s.$style.action, s.$style.draggable, { [s.$style.disable]: !e.isDraggable }]),
|
|
55
57
|
"data-draggable": e.isDraggable
|
|
56
58
|
}, [
|
|
57
|
-
|
|
58
|
-
], 10,
|
|
59
|
-
o.isExpandable ? (
|
|
59
|
+
$(y(k), { name: "drag-dots" })
|
|
60
|
+
], 10, T)) : a("", !0),
|
|
61
|
+
o.isExpandable ? (t(), w(y(k), {
|
|
60
62
|
key: 1,
|
|
61
63
|
class: l([s.$style.contentChevron, { [s.$style.opened]: e.isExpanded }]),
|
|
62
64
|
name: "chevron-down"
|
|
63
65
|
}, null, 8, ["class"])) : a("", !0),
|
|
64
|
-
|
|
66
|
+
m("div", {
|
|
65
67
|
class: l(s.$style.title)
|
|
66
68
|
}, [
|
|
67
|
-
|
|
69
|
+
v(s.$slots, "title", {
|
|
68
70
|
item: e.item,
|
|
69
71
|
index: e.index
|
|
70
72
|
})
|
|
71
73
|
], 2),
|
|
72
|
-
|
|
74
|
+
m("div", {
|
|
73
75
|
class: l([s.$style.actions, s.$style.showOnHover])
|
|
74
76
|
}, [
|
|
75
|
-
e.isToggable ? (
|
|
77
|
+
e.isToggable ? (t(), n("div", {
|
|
76
78
|
key: 0,
|
|
77
79
|
class: l([s.$style.action, s.$style.clickable, { [s.$style.disable]: !e.isToggable }]),
|
|
78
|
-
onClick:
|
|
80
|
+
onClick: i[0] || (i[0] = p((r) => d("toggle", e.item, e.index), ["stop"]))
|
|
79
81
|
}, [
|
|
80
|
-
|
|
82
|
+
$(y(c), {
|
|
81
83
|
name: e.isToggled === !0 ? "view-hide" : "view-show",
|
|
82
84
|
size: "16"
|
|
83
85
|
}, null, 8, ["name"])
|
|
84
86
|
], 2)) : a("", !0),
|
|
85
|
-
e.isPinnable ? (
|
|
87
|
+
e.isPinnable ? (t(), n("div", {
|
|
86
88
|
key: 1,
|
|
87
89
|
class: l([s.$style.action, s.$style.clickable, {
|
|
88
90
|
[s.$style.disable]: !e.isPinnable,
|
|
89
91
|
[s.$style.activated]: e.isPinned
|
|
90
92
|
}]),
|
|
91
|
-
onClick:
|
|
93
|
+
onClick: i[1] || (i[1] = p((r) => d("pin", e.item, e.index), ["stop"]))
|
|
92
94
|
}, [
|
|
93
|
-
|
|
95
|
+
$(y(c), {
|
|
94
96
|
name: "pin",
|
|
95
97
|
size: "16"
|
|
96
98
|
})
|
|
97
99
|
], 2)) : a("", !0),
|
|
98
|
-
e.isRemovable ? (
|
|
100
|
+
e.isRemovable ? (t(), n("div", {
|
|
99
101
|
key: 2,
|
|
100
102
|
class: l([s.$style.action, s.$style.clickable]),
|
|
101
|
-
onClick:
|
|
103
|
+
onClick: i[2] || (i[2] = p((r) => d("remove", e.item, e.index), ["stop"]))
|
|
102
104
|
}, [
|
|
103
|
-
|
|
105
|
+
$(y(k), { name: "close" })
|
|
104
106
|
], 2)) : a("", !0)
|
|
105
107
|
], 2)
|
|
106
108
|
], 2),
|
|
107
|
-
|
|
109
|
+
u.value && e.isExpanded ? (t(), n("div", {
|
|
108
110
|
key: 0,
|
|
109
111
|
class: l([s.$style.body, o.contentClass, { [s.$style.disabled]: e.isToggled }])
|
|
110
112
|
}, [
|
|
111
|
-
|
|
113
|
+
v(s.$slots, "content", {
|
|
112
114
|
item: e.item,
|
|
113
115
|
index: e.index
|
|
114
116
|
})
|
|
115
117
|
], 2)) : a("", !0)
|
|
116
118
|
], 2),
|
|
117
|
-
C.value ? (
|
|
119
|
+
C.value ? (t(), n("div", {
|
|
118
120
|
key: 1,
|
|
119
121
|
class: l(o.afterClass)
|
|
120
122
|
}, [
|
|
121
|
-
|
|
123
|
+
v(s.$slots, "after", {
|
|
122
124
|
item: e.item,
|
|
123
125
|
index: e.index
|
|
124
126
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlElementListItem.vue2.js","sources":["../../../src/components/PlElementList/PlElementListItem.vue"],"sourcesContent":["<script generic=\"T extends unknown = unknown\" lang=\"ts\" setup>\nimport { computed } from 'vue';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlIcon24 } from '../PlIcon24';\n\nconst props = defineProps<{\n item: T;\n index: number;\n showDragHandle: boolean;\n isActive: boolean;\n isDraggable: boolean;\n isRemovable: boolean;\n isExpandable: boolean;\n isExpanded: boolean;\n isToggable: boolean;\n isToggled: boolean;\n isPinnable: boolean;\n isPinned: boolean;\n titleClass: string | string[] | null;\n contentClass: string | string[] | null;\n afterClass: string | string[] | null;\n beforeClass: string | string[] | null;\n}>();\ndefineOptions({ inheritAttrs: false });\n\nconst slots = defineSlots<{\n title: (props: { item: T; index: number }) => unknown;\n content?: (props: { item: T; index: number }) => unknown;\n after?: (props: { item: T; index: number }) => unknown;\n before?: (props: { item: T; index: number }) => unknown;\n}>();\nconst hasContentSlot = computed(() => slots['content'] !== undefined);\nconst hasAfterSlot = computed(() => slots['after'] !== undefined);\nconst hasBeforeSlot = computed(() => slots['before'] !== undefined);\n\nconst emit = defineEmits<{\n (e: 'expand', item: T, index: number): void;\n (e: 'toggle', item: T, index: number): void;\n (e: 'pin', item: T, index: number): void;\n (e: 'remove', item: T, index: number): void;\n}>();\n</script>\n\n<template>\n <div>\n <div v-if=\"hasBeforeSlot\" :class=\"beforeClass\">\n <slot name=\"before\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n <div\n :class=\"[$style.root, $attrs.class, {\n [$style.active]: props.isActive,\n [$style.pinned]: props.isPinned,\n [$style.opened]: props.isExpanded,\n [$style.disabled]: props.isToggled,\n }]\"\n >\n <div\n :class=\"[$style.head, titleClass, {\n [$style.clickable]: hasContentSlot,\n }]\"\n @click=\"isExpandable && emit('expand', props.item, props.index)\"\n >\n <div\n v-if=\"props.showDragHandle\"\n :class=\"[$style.action, $style.draggable, { [$style.disable]: !props.isDraggable } ]\"\n :data-draggable=\"props.isDraggable\"\n >\n <PlIcon16 name=\"drag-dots\" />\n </div>\n <PlIcon16 v-if=\"isExpandable\" :class=\"[$style.contentChevron, { [$style.opened]: props.isExpanded }]\" name=\"chevron-down\" />\n\n <div :class=\"$style.title\">\n <slot name=\"title\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n\n <div :class=\"[$style.actions, $style.showOnHover]\">\n <div\n v-if=\"props.isToggable\"\n :class=\"[$style.action, $style.clickable, { [$style.disable]: !props.isToggable }]\"\n @click.stop=\"emit('toggle', props.item, props.index)\"\n >\n <PlIcon24 :name=\"props.isToggled === true ? 'view-hide' : 'view-show'\" size=\"16\" />\n </div>\n <div\n v-if=\"props.isPinnable\"\n :class=\"[$style.action, $style.clickable, {\n [$style.disable]: !props.isPinnable,\n [$style.activated]: props.isPinned,\n }]\"\n @click.stop=\"emit('pin', props.item, props.index)\"\n >\n <PlIcon24 name=\"pin\" size=\"16\" />\n </div>\n <div\n v-if=\"props.isRemovable\"\n :class=\"[$style.action, $style.clickable]\"\n @click.stop=\"emit('remove', props.item, props.index)\"\n >\n <PlIcon16 name=\"close\" />\n </div>\n </div>\n </div>\n <div\n v-if=\"hasContentSlot && props.isExpanded\"\n :class=\"[$style.body, contentClass, { [$style.disabled]: props.isToggled }]\"\n >\n <slot name=\"content\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n </div>\n <div v-if=\"hasAfterSlot\" :class=\"afterClass\">\n <slot name=\"after\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n </div>\n</template>\n\n<style module>\n@use '../../assets/variables.scss' as *;\n\n.root {\n --background: rgba(255, 255, 255, 0.8);\n --border-color: var(--color-div-grey);\n --head-background: unset;\n --box-shadow: none;\n --box-shadow-active: 0 0 0 4px color-mix(in srgb, var(--border-color-focus) 50%, transparent);\n\n &:global(.sortable-drag),\n &:global(.sortable-chosen) {\n --head-background: var(--gradient-light-lime);\n --border-color: var(--border-color-focus);\n --box-shadow: var(--box-shadow-active)\n }\n}\n.root {\n display: flex;\n flex-direction: column;\n justify-content: center;\n border-radius: var(--border-radius);\n border: 1px solid var(--border-color);\n background-color: var(--background);\n transition: box-shadow 0.15s;\n box-shadow: var(--box-shadow);;\n overflow: hidden;\n\n &:hover {\n --border-color: var(--border-color-focus);\n --head-background: var(--gradient-light-lime);\n }\n\n &.opened {\n --head-background: var(--gradient-light-lime);\n }\n\n &.disabled {\n --icon-color: var(--ic-02);\n --border-color: var(--border-color-div-grey);\n color: var(--txt-03);\n filter: grayscale(1);\n }\n\n &.pinned {\n --background: var(--bg-base-light);\n }\n\n &.active {\n --border-color: var(--border-color-focus);\n --head-background: var(--btn-accent-positive-500);\n }\n}\n\n.head {\n position: relative;\n display: flex;\n align-items: center;\n padding: 8px;\n min-height: 40px;\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n background: var(--head-background);\n}\n\n.contentChevron {\n display: block;\n width: 16px;\n height: 16px;\n margin-right: 4px;\n transform: rotate(-90deg);\n transition: transform 0.15s;\n\n &.opened {\n transform: rotate(0deg);\n }\n}\n\n.title {\n display: flex;\n flex-direction: row;\n flex: 1 1 0;\n gap: 8px;\n text-overflow: ellipsis;\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: 12px;\n padding: 24px;\n border-radius: 0 0 var(--border-radius) var(--border-radius);\n\n &.disabled {\n pointer-events: none;\n }\n}\n\n.actions {\n position: absolute;\n top: 8px;\n right: 8px;\n display: flex;\n align-items: center;\n background-color: var(--background);\n border-radius: var(--border-radius);\n}\n\n.action {\n width: 24px;\n height: 24px;\n padding: 4px; /* use padding instead of gap on parent, for better accessibility */\n opacity: 0.6;\n border-radius: var(--border-radius);\n transition: all 0.15s;\n\n svg {\n width: 16px;\n height: 16px;\n }\n\n &:hover {\n opacity: 1;\n background-color: var(--bg-elevated-02);\n }\n\n &.activated {\n opacity: 0.8;\n }\n\n &.disable {\n cursor: not-allowed;\n opacity: 0.4;\n }\n}\n\n.clickable {\n cursor: pointer;\n}\n\n.draggable {\n cursor: grab;\n}\n\n.showOnHover {\n opacity: 0;\n transition: opacity 0.15s;\n}\n\n.root:hover .showOnHover {\n opacity: 1;\n}\n</style>\n"],"names":["props","__props","slots","_useSlots","hasContentSlot","computed","hasAfterSlot","hasBeforeSlot","emit","__emit","_createElementBlock","_renderSlot","_ctx","_createElementVNode","$style","$attrs","_normalizeClass","_cache","$event","_createVNode","_unref","PlIcon16","_createBlock","_withModifiers","PlIcon24"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PlElementListItem.vue2.js","sources":["../../../src/components/PlElementList/PlElementListItem.vue"],"sourcesContent":["<script generic=\"T extends unknown = unknown\" lang=\"ts\" setup>\nimport { computed } from 'vue';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlIcon24 } from '../PlIcon24';\n\nconst props = defineProps<{\n item: T;\n index: number;\n showDragHandle: boolean;\n isActive: boolean;\n isDraggable: boolean;\n isRemovable: boolean;\n isExpandable: boolean;\n isExpanded: boolean;\n isToggable: boolean;\n isToggled: boolean;\n isPinnable: boolean;\n isPinned: boolean;\n titleClass: string | string[] | null;\n contentClass: string | string[] | null;\n afterClass: string | string[] | null;\n beforeClass: string | string[] | null;\n}>();\ndefineOptions({ inheritAttrs: false });\n\nconst slots = defineSlots<{\n title: (props: { item: T; index: number }) => unknown;\n content?: (props: { item: T; index: number }) => unknown;\n after?: (props: { item: T; index: number }) => unknown;\n before?: (props: { item: T; index: number }) => unknown;\n}>();\nconst hasContentSlot = computed(() => slots['content'] !== undefined);\nconst hasAfterSlot = computed(() => slots['after'] !== undefined);\nconst hasBeforeSlot = computed(() => slots['before'] !== undefined);\n\nconst emit = defineEmits<{\n (e: 'click', item: MouseEvent): void;\n (e: 'expand', item: T, index: number): void;\n (e: 'toggle', item: T, index: number): void;\n (e: 'pin', item: T, index: number): void;\n (e: 'remove', item: T, index: number): void;\n}>();\n</script>\n\n<template>\n <div @click=\"(event) => emit('click', event)\">\n <div v-if=\"hasBeforeSlot\" :class=\"beforeClass\">\n <slot name=\"before\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n <div\n :class=\"[$style.root, $attrs.class, {\n [$style.active]: props.isActive,\n [$style.pinned]: props.isPinned,\n [$style.opened]: props.isExpanded,\n [$style.disabled]: props.isToggled,\n }]\"\n >\n <div\n :class=\"[$style.head, titleClass, {\n [$style.clickable]: hasContentSlot,\n }]\"\n @click=\"isExpandable && emit('expand', props.item, props.index)\"\n >\n <div\n v-if=\"props.showDragHandle\"\n :class=\"[$style.action, $style.draggable, { [$style.disable]: !props.isDraggable } ]\"\n :data-draggable=\"props.isDraggable\"\n >\n <PlIcon16 name=\"drag-dots\" />\n </div>\n <PlIcon16 v-if=\"isExpandable\" :class=\"[$style.contentChevron, { [$style.opened]: props.isExpanded }]\" name=\"chevron-down\" />\n\n <div :class=\"$style.title\">\n <slot name=\"title\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n\n <div :class=\"[$style.actions, $style.showOnHover]\">\n <div\n v-if=\"props.isToggable\"\n :class=\"[$style.action, $style.clickable, { [$style.disable]: !props.isToggable }]\"\n @click.stop=\"emit('toggle', props.item, props.index)\"\n >\n <PlIcon24 :name=\"props.isToggled === true ? 'view-hide' : 'view-show'\" size=\"16\" />\n </div>\n <div\n v-if=\"props.isPinnable\"\n :class=\"[$style.action, $style.clickable, {\n [$style.disable]: !props.isPinnable,\n [$style.activated]: props.isPinned,\n }]\"\n @click.stop=\"emit('pin', props.item, props.index)\"\n >\n <PlIcon24 name=\"pin\" size=\"16\" />\n </div>\n <div\n v-if=\"props.isRemovable\"\n :class=\"[$style.action, $style.clickable]\"\n @click.stop=\"emit('remove', props.item, props.index)\"\n >\n <PlIcon16 name=\"close\" />\n </div>\n </div>\n </div>\n <div\n v-if=\"hasContentSlot && props.isExpanded\"\n :class=\"[$style.body, contentClass, { [$style.disabled]: props.isToggled }]\"\n >\n <slot name=\"content\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n </div>\n <div v-if=\"hasAfterSlot\" :class=\"afterClass\">\n <slot name=\"after\" :item=\"props.item\" :index=\"props.index\" />\n </div>\n </div>\n</template>\n\n<style module>\n@use '../../assets/variables.scss' as *;\n\n.root {\n --background: rgba(255, 255, 255, 0.8);\n --border-color: var(--color-div-grey);\n --head-background: unset;\n --box-shadow: none;\n --box-shadow-active: 0 0 0 4px color-mix(in srgb, var(--border-color-focus) 50%, transparent);\n\n &:global(.sortable-drag),\n &:global(.sortable-chosen) {\n --head-background: var(--gradient-light-lime);\n --border-color: var(--border-color-focus);\n --box-shadow: var(--box-shadow-active)\n }\n}\n.root {\n display: flex;\n flex-direction: column;\n justify-content: center;\n border-radius: var(--border-radius);\n border: 1px solid var(--border-color);\n background-color: var(--background);\n transition: box-shadow 0.15s;\n box-shadow: var(--box-shadow);;\n overflow: hidden;\n\n &:hover {\n --border-color: var(--border-color-focus);\n --head-background: var(--gradient-light-lime);\n }\n\n &.opened {\n --head-background: var(--gradient-light-lime);\n }\n\n &.disabled {\n --icon-color: var(--ic-02);\n --border-color: var(--border-color-div-grey);\n color: var(--txt-03);\n filter: grayscale(1);\n }\n\n &.pinned {\n --background: var(--bg-base-light);\n }\n\n &.active {\n --border-color: var(--border-color-focus);\n --head-background: var(--btn-accent-positive-500);\n }\n}\n\n.head {\n position: relative;\n display: flex;\n align-items: center;\n padding: 8px;\n min-height: 40px;\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n background: var(--head-background);\n}\n\n.contentChevron {\n display: block;\n width: 16px;\n height: 16px;\n margin-right: 4px;\n transform: rotate(-90deg);\n transition: transform 0.15s;\n\n &.opened {\n transform: rotate(0deg);\n }\n}\n\n.title {\n display: flex;\n flex-direction: row;\n flex: 1 1 0;\n gap: 8px;\n text-overflow: ellipsis;\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: 12px;\n padding: 24px;\n border-radius: 0 0 var(--border-radius) var(--border-radius);\n\n &.disabled {\n pointer-events: none;\n }\n}\n\n.actions {\n position: absolute;\n top: 8px;\n right: 8px;\n display: flex;\n align-items: center;\n background-color: var(--background);\n border-radius: var(--border-radius);\n}\n\n.action {\n width: 24px;\n height: 24px;\n padding: 4px; /* use padding instead of gap on parent, for better accessibility */\n opacity: 0.6;\n border-radius: var(--border-radius);\n transition: all 0.15s;\n\n svg {\n width: 16px;\n height: 16px;\n }\n\n &:hover {\n opacity: 1;\n background-color: var(--bg-elevated-02);\n }\n\n &.activated {\n opacity: 0.8;\n }\n\n &.disable {\n cursor: not-allowed;\n opacity: 0.4;\n }\n}\n\n.clickable {\n cursor: pointer;\n}\n\n.draggable {\n cursor: grab;\n}\n\n.showOnHover {\n opacity: 0;\n transition: opacity 0.15s;\n}\n\n.root:hover .showOnHover {\n opacity: 1;\n}\n</style>\n"],"names":["props","__props","slots","_useSlots","hasContentSlot","computed","hasAfterSlot","hasBeforeSlot","emit","__emit","_createElementBlock","_cache","event","_renderSlot","_ctx","_createElementVNode","$style","$attrs","_normalizeClass","$event","_createVNode","_unref","PlIcon16","_createBlock","_withModifiers","PlIcon24"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@milaboratories/uikit",
|
|
3
|
-
"version": "2.6.
|
|
3
|
+
"version": "2.6.5",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"exports": {
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"resize-observer-polyfill": "^1.5.1",
|
|
33
33
|
"canonicalize": "~2.1.0",
|
|
34
34
|
"@milaboratories/helpers": "1.12.0",
|
|
35
|
-
"@platforma-sdk/model": "1.45.
|
|
35
|
+
"@platforma-sdk/model": "1.45.45"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
38
|
"jsdom": "^25.0.1",
|
|
@@ -7,7 +7,7 @@ export default {
|
|
|
7
7
|
};
|
|
8
8
|
</script>
|
|
9
9
|
|
|
10
|
-
<script lang="ts" setup generic="M =
|
|
10
|
+
<script lang="ts" setup generic="M extends null | undefined | string | number = null | undefined | string">
|
|
11
11
|
import './pl-autocomplete.scss';
|
|
12
12
|
import { computed, reactive, ref, unref, useTemplateRef, watch, watchPostEffect } from 'vue';
|
|
13
13
|
import { tap } from '../../helpers/functions';
|
|
@@ -43,7 +43,7 @@ const props = withDefaults(
|
|
|
43
43
|
/**
|
|
44
44
|
* Lambda for requesting of corresponding option for current model value. If empty, optionsSearch is used for this.
|
|
45
45
|
*/
|
|
46
|
-
modelSearch?: (v: M) => Promise<ListOption<M
|
|
46
|
+
modelSearch?: (v: NonNullable<M>) => Promise<ListOption<NonNullable<M>>>;
|
|
47
47
|
/**
|
|
48
48
|
* The label text for the dropdown field (optional)
|
|
49
49
|
*/
|
|
@@ -307,7 +307,7 @@ const optionsRequest = useWatchFetch(() => searchDebounced.value, async (v) => {
|
|
|
307
307
|
});
|
|
308
308
|
|
|
309
309
|
const modelOptionRequest = useWatchFetch(() => model.value, async (v) => {
|
|
310
|
-
if (v && !deepEqual(modelOptionRef.value?.value, v)) { // load label for selected value if it was updated from outside the component
|
|
310
|
+
if (v != null && !deepEqual(modelOptionRef.value?.value, v)) { // load label for selected value if it was updated from outside the component
|
|
311
311
|
if (props.modelSearch) {
|
|
312
312
|
return props.modelSearch(v);
|
|
313
313
|
}
|
|
@@ -13,7 +13,7 @@ describe('PlAutocomplete', () => {
|
|
|
13
13
|
const wrapper = mount(PlAutocomplete, {
|
|
14
14
|
props: {
|
|
15
15
|
'modelValue': 1,
|
|
16
|
-
'onUpdate:modelValue': (e
|
|
16
|
+
'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e }),
|
|
17
17
|
'optionsSearch': (_str: string) => {
|
|
18
18
|
return Promise.resolve(options);
|
|
19
19
|
},
|
|
@@ -37,7 +37,7 @@ export default {
|
|
|
37
37
|
};
|
|
38
38
|
</script>
|
|
39
39
|
|
|
40
|
-
<script lang="ts" setup generic="M =
|
|
40
|
+
<script lang="ts" setup generic="M extends string | number = string">
|
|
41
41
|
import './pl-autocomplete-multi.scss';
|
|
42
42
|
|
|
43
43
|
import type { ListOptionBase } from '@platforma-sdk/model';
|
|
@@ -34,6 +34,7 @@ const hasAfterSlot = computed(() => slots['after'] !== undefined);
|
|
|
34
34
|
const hasBeforeSlot = computed(() => slots['before'] !== undefined);
|
|
35
35
|
|
|
36
36
|
const emit = defineEmits<{
|
|
37
|
+
(e: 'click', item: MouseEvent): void;
|
|
37
38
|
(e: 'expand', item: T, index: number): void;
|
|
38
39
|
(e: 'toggle', item: T, index: number): void;
|
|
39
40
|
(e: 'pin', item: T, index: number): void;
|
|
@@ -42,7 +43,7 @@ const emit = defineEmits<{
|
|
|
42
43
|
</script>
|
|
43
44
|
|
|
44
45
|
<template>
|
|
45
|
-
<div>
|
|
46
|
+
<div @click="(event) => emit('click', event)">
|
|
46
47
|
<div v-if="hasBeforeSlot" :class="beforeClass">
|
|
47
48
|
<slot name="before" :item="props.item" :index="props.index" />
|
|
48
49
|
</div>
|