@milaboratories/uikit 2.16.2 → 2.17.0

package/.turbo/turbo-build.log

@@ -7,7 +7,7 @@ Using custom config: ./build.browser-lib.config.js
 vite v8.3.5 building client environment for production...
 [warn] `inlineDynamicImports` option is deprecated, please use `codeSplitting: false` instead.
 transforming...
-✓ 741 modules transformed.
+✓ 747 modules transformed.
 [lightningcss minify] Unknown at rule: @use
 1  |  
 2  |  @use "../../assets/variables.scss" as *;
@@ -17,11 +17,13 @@ transforming...
 rendering chunks...
 
 [unplugin:dts] Start generate declaration files...
-[unplugin:dts] Declaration files built in 6799ms.
+[unplugin:dts] Declaration files built in 6722ms.
 
 computing gzip size...
 dist/components/PlClipboard/PlClipboard.vue_vue_type_style_index_0_lang.css                             0.04 kB │ gzip:   0.06 kB
+dist/components/PlDropdown/PlDropdown.vue_vue_type_style_index_0_lang.css                               0.04 kB │ gzip:   0.06 kB
 dist/components/PlSlideModal/PlSlideModal.vue_vue_type_style_index_0_lang.css                           0.05 kB │ gzip:   0.06 kB
+dist/components/PlValueLabel/PlValueLabel.vue_vue_type_style_index_0_lang.css                           0.06 kB │ gzip:   0.08 kB
 dist/components/PlChartStackedBar/PlChartStackedBarCompact.vue_vue_type_style_index_0_lang.css          0.06 kB │ gzip:   0.08 kB
 dist/layout/PlContainer/pl-container.css                                                                0.06 kB │ gzip:   0.08 kB
 dist/layout/PlGrid/pl-grid.css                                                                          0.06 kB │ gzip:   0.07 kB
@@ -81,7 +83,7 @@ dist/components/PlLogView/pl-log-view.css
 dist/components/PlNumberField/pl-number-field.css                                                       2.81 kB │ gzip:   0.88 kB
 dist/components/PlTextArea/pl-textarea.css                                                              2.96 kB │ gzip:   0.86 kB
 dist/components/PlTextField/pl-text-field.css                                                           3.27 kB │ gzip:   0.92 kB
-dist/components/PlTooltip/PlTooltip.vue_vue_type_style_index_0_lang.css                                 3.46 kB │ gzip:   0.82 kB
+dist/components/PlTooltip/PlTooltip.vue_vue_type_style_index_0_lang.css                                 3.50 kB │ gzip:   0.82 kB
 dist/components/PlDropdownLine/pl-dropdown-line.css                                                     4.55 kB │ gzip:   1.24 kB
 dist/components/PlFileInput/pl-file-input.css                                                           4.63 kB │ gzip:   1.23 kB
 dist/components/PlSidebar/PlSidebarGroup.vue_vue_type_style_index_0_lang.css                            4.78 kB │ gzip:   1.30 kB
@@ -123,6 +125,7 @@ dist/layout/PlContainer/index.js
 dist/components/PlBtnPrimary/index.js                                                                   0.06 kB │ gzip:   0.07 kB
 dist/components/PlErrorAlert/index.js                                                                   0.06 kB │ gzip:   0.07 kB
 dist/components/PlFileDialog/index.js                                                                   0.06 kB │ gzip:   0.07 kB
+dist/components/PlValueLabel/index.js                                                                   0.06 kB │ gzip:   0.07 kB
 dist/components/PlColumnLabel/index.js                                                                  0.06 kB │ gzip:   0.07 kB
 dist/components/PlDialogModal/index.js                                                                  0.06 kB │ gzip:   0.07 kB
 dist/components/PlDropdownRef/index.js                                                                  0.06 kB │ gzip:   0.07 kB
@@ -175,7 +178,7 @@ dist/components/DataTable/ThCell.js
 dist/components/DataTable/TrBody.js                                                                     0.17 kB │ gzip:   0.15 kB │ map:  0.87 kB
 dist/components/DataTable/TrHead.js                                                                     0.17 kB │ gzip:   0.15 kB │ map:  0.34 kB
 dist/components/PlFileDialog/Local.js                                                                   0.17 kB │ gzip:   0.15 kB │ map:  3.20 kB
-dist/components/PlAlert/PlAlert.js                                                                      0.17 kB │ gzip:   0.15 kB │ map:  2.95 kB
+dist/components/PlAlert/PlAlert.js                                                                      0.17 kB │ gzip:   0.15 kB │ map:  3.28 kB
 dist/layout/PlSpacer/PlSpacer.js                                                                        0.17 kB │ gzip:   0.15 kB │ map:  0.49 kB
 dist/components/InputRange.js                                                                           0.17 kB │ gzip:   0.15 kB │ map:  2.89 kB
 dist/components/Scrollable.js                                                                           0.17 kB │ gzip:   0.15 kB │ map:  2.37 kB
@@ -193,7 +196,6 @@ dist/components/PlBtnGroup/PlBtnGroup.js
 dist/components/PlBtnSplit/PlBtnSplit.js                                                                0.18 kB │ gzip:   0.15 kB │ map:  6.20 kB
 dist/components/PlCheckbox/PlCheckbox.js                                                                0.18 kB │ gzip:   0.15 kB │ map:  1.64 kB
 dist/components/PlDropdown/OptionList.js                                                                0.18 kB │ gzip:   0.16 kB │ map:  2.84 kB
-dist/components/PlDropdown/PlDropdown.js                                                                0.18 kB │ gzip:   0.15 kB │ map: 13.82 kB
 dist/components/PlTextArea/PlTextArea.js                                                                0.18 kB │ gzip:   0.15 kB │ map:  5.26 kB
 dist/layout/PlContainer/PlContainer.js                                                                  0.18 kB │ gzip:   0.15 kB │ map:  1.06 kB
 dist/components/PlSlideModal/props.js                                                                   0.18 kB │ gzip:   0.17 kB │ map:  0.77 kB
@@ -213,7 +215,7 @@ dist/components/SliderRangeTriple.js
 dist/components/DataTable/TableComponent.js                                                             0.19 kB │ gzip:   0.16 kB │ map:  3.87 kB
 dist/components/PlCheckbox/PlCheckboxBase.js                                                            0.20 kB │ gzip:   0.16 kB │ map:  0.87 kB
 dist/components/PlDialogModal/PlDialogModal.js                                                          0.20 kB │ gzip:   0.15 kB │ map:  5.08 kB
-dist/components/PlDropdownRef/PlDropdownRef.js                                                          0.20 kB │ gzip:   0.15 kB │ map:  3.40 kB
+dist/components/PlDropdownRef/PlDropdownRef.js                                                          0.20 kB │ gzip:   0.15 kB │ map:  3.79 kB
 dist/components/PlNumberField/PlNumberField.js                                                          0.20 kB │ gzip:   0.15 kB │ map: 10.81 kB
 dist/components/PlProgressBar/PlProgressBar.js                                                          0.20 kB │ gzip:   0.15 kB │ map:  1.24 kB
 dist/layout/PlBlockPage/index.js                                                                        0.20 kB │ gzip:   0.11 kB
@@ -228,7 +230,7 @@ dist/components/PlToggleSwitch/PlToggleSwitch.js
 dist/components/TransitionSlidePanel.js                                                                 0.20 kB │ gzip:   0.15 kB │ map:  0.62 kB
 dist/components/DataTable/BaseCellComponent.js                                                          0.20 kB │ gzip:   0.16 kB │ map:  1.77 kB
 dist/components/PlCheckboxGroup/PlCheckboxGroup.js                                                      0.20 kB │ gzip:   0.16 kB │ map:  2.70 kB
-dist/components/PlDropdownMulti/PlDropdownMulti.js                                                      0.20 kB │ gzip:   0.15 kB │ map: 12.70 kB
+dist/components/PlDropdownMulti/PlDropdownMulti.js                                                      0.20 kB │ gzip:   0.15 kB │ map: 14.79 kB
 dist/components/PlEditableTitle/PlEditableTitle.js                                                      0.20 kB │ gzip:   0.15 kB │ map:  3.31 kB
 dist/components/PlErrorBoundary/PlErrorBoundary.js                                                      0.20 kB │ gzip:   0.16 kB │ map:  1.90 kB
 dist/components/PlSlideModal/PlPureSlideModal.js                                                        0.20 kB │ gzip:   0.16 kB │ map:  2.18 kB
@@ -237,7 +239,7 @@ dist/components/PlDropdownLegacy/PlDropdownLegacy.js
 dist/components/PlLoaderCircular/PlLoaderCircular.js                                                    0.21 kB │ gzip:   0.15 kB │ map:  1.15 kB
 dist/layout/PlBlockPage/PlBlockPageTitleTeleportTarget.js                                               0.21 kB │ gzip:   0.15 kB │ map:  0.35 kB
 dist/helpers/index.js                                                                                   0.21 kB │ gzip:   0.18 kB │ map:  0.63 kB
-dist/components/PlDropdownMultiRef/PlDropdownMultiRef.js                                                0.22 kB │ gzip:   0.16 kB │ map:  2.56 kB
+dist/components/PlDropdownMultiRef/PlDropdownMultiRef.js                                                0.22 kB │ gzip:   0.16 kB │ map:  2.96 kB
 dist/components/PlAutocompleteMulti/PlAutocompleteMulti.js                                              0.22 kB │ gzip:   0.16 kB │ map: 14.66 kB
 dist/components/PlNotificationAlert/PlNotificationAlert.js                                              0.22 kB │ gzip:   0.16 kB │ map:  1.69 kB
 dist/helpers/iterators.js                                                                               0.23 kB │ gzip:   0.18 kB │ map:  0.76 kB
@@ -254,6 +256,7 @@ dist/components/PlIcon16/PlIcon16.vue_vue_type_style_index_0_lang.module.js
 dist/components/PlIcon24/PlIcon24.vue_vue_type_style_index_0_lang.module.js                             0.28 kB │ gzip:   0.20 kB │ map:  2.09 kB
 dist/components/PlChartHistogram/logspace.js                                                            0.29 kB │ gzip:   0.23 kB │ map:  0.81 kB
 dist/components/DataTable/composition/useMouseUp.js                                                     0.29 kB │ gzip:   0.20 kB │ map:  0.59 kB
+dist/components/PlDropdown/PlDropdown.vue_vue_type_style_index_0_lang.module.js                         0.29 kB │ gzip:   0.20 kB │ map: 15.64 kB
 dist/components/PlClipboard/PlClipboard.vue_vue_type_style_index_0_lang.module.js                       0.30 kB │ gzip:   0.20 kB │ map:  1.30 kB
 dist/composition/useEventListener.js                                                                    0.30 kB │ gzip:   0.20 kB │ map:  1.10 kB
 dist/assets/icons/icon-assets-min/24_color-fill.js                                                      0.30 kB │ gzip:   0.23 kB │ map:  0.10 kB
@@ -264,6 +267,7 @@ dist/assets/icons/icon-assets-min/24_radio-button.js
 dist/assets/icons/icon-assets-min/24_minus.js                                                           0.31 kB │ gzip:   0.24 kB │ map:  0.09 kB
 dist/utils/PlCloseModalBtn.vue_vue_type_style_index_0_lang.module.js                                    0.31 kB │ gzip:   0.20 kB │ map:  0.81 kB
 dist/components/PlSvg/PlSvg.js                                                                          0.31 kB │ gzip:   0.22 kB │ map:  3.14 kB
+dist/components/PlValueLabel/PlValueLabel.vue_vue_type_style_index_0_lang.module.js                     0.31 kB │ gzip:   0.20 kB │ map:  3.02 kB
 dist/assets/icons/icon-assets-min/16_minus.js                                                           0.31 kB │ gzip:   0.24 kB │ map:  0.09 kB
 dist/components/PlChartStackedBar/Legends.js                                                            0.32 kB │ gzip:   0.22 kB │ map:  2.30 kB
 dist/components/PlRadio/PlRadio.js                                                                      0.32 kB │ gzip:   0.22 kB │ map:  2.74 kB
@@ -271,9 +275,10 @@ dist/components/PlIcon16/PlIcon16.js
 dist/components/PlIcon24/PlIcon24.js                                                                    0.32 kB │ gzip:   0.23 kB │ map:  2.19 kB
 dist/assets/icons/icon-assets-min/24_arrow-up.js                                                        0.32 kB │ gzip:   0.25 kB │ map:  0.09 kB
 dist/components/PlFileDialog/Shortcuts.js                                                               0.32 kB │ gzip:   0.23 kB │ map:  2.54 kB
-dist/components/PlTooltip/PlTooltip.js                                                                  0.32 kB │ gzip:   0.23 kB │ map:  9.41 kB
+dist/components/PlTooltip/PlTooltip.js                                                                  0.32 kB │ gzip:   0.23 kB │ map:  9.45 kB
 dist/assets/icons/icon-assets-min/24_linetype-solid.js                                                  0.32 kB │ gzip:   0.25 kB │ map:  0.10 kB
 dist/components/PlChartStackedBar/StackedRow.js                                                         0.32 kB │ gzip:   0.23 kB │ map:  3.27 kB
+dist/components/PlDropdown/PlDropdown.js                                                                0.32 kB │ gzip:   0.23 kB │ map: 15.74 kB
 dist/assets/icons/icon-assets-min/16_add.js                                                             0.33 kB │ gzip:   0.25 kB │ map:  0.08 kB
 dist/assets/icons/icon-assets-min/24_arrow-left.js                                                      0.33 kB │ gzip:   0.26 kB │ map:  0.10 kB
 dist/components/PlClipboard/PlClipboard.js                                                              0.33 kB │ gzip:   0.23 kB │ map:  1.41 kB
@@ -286,6 +291,7 @@ dist/components/PlAccordion/ExpandTransition.js
 dist/components/PlErrorAlert/PlErrorAlert.js                                                            0.33 kB │ gzip:   0.23 kB │ map:  2.74 kB
 dist/components/PlRadio/PlRadioGroup.js                                                                 0.33 kB │ gzip:   0.23 kB │ map:  2.43 kB
 dist/components/PlSlideModal/PlSlideModal.js                                                            0.33 kB │ gzip:   0.23 kB │ map:  1.68 kB
+dist/components/PlValueLabel/PlValueLabel.js                                                            0.33 kB │ gzip:   0.23 kB │ map:  3.12 kB
 dist/components/PlElementList/utils.js                                                                  0.33 kB │ gzip:   0.26 kB │ map:  0.85 kB
 dist/helpers/functions.js                                                                               0.33 kB │ gzip:   0.22 kB │ map:  1.17 kB
 dist/components/PlColumnLabel/PlColumnLabel.js                                                          0.33 kB │ gzip:   0.23 kB │ map:  1.71 kB
@@ -474,6 +480,7 @@ dist/assets/icons/icon-assets-min/24_success.js
 dist/composition/useFormState.js                                                                        0.52 kB │ gzip:   0.33 kB │ map:  1.57 kB
 dist/assets/icons/icon-assets-min/24_table-add.js                                                       0.53 kB │ gzip:   0.36 kB │ map:  0.09 kB
 dist/assets/icons/icon-assets-min/16_time.js                                                            0.53 kB │ gzip:   0.35 kB │ map:  0.08 kB
+dist/helpers/columnValue.js                                                                             0.53 kB │ gzip:   0.32 kB │ map:  2.51 kB
 dist/assets/icons/icon-assets-min/24_frame-type-left-bottom.js                                          0.53 kB │ gzip:   0.32 kB │ map:  0.12 kB
 dist/assets/icons/icon-assets-min/16_lock.js                                                            0.54 kB │ gzip:   0.36 kB │ map:  0.08 kB
 dist/assets/icons/icon-assets-min/24_table-import.js                                                    0.54 kB │ gzip:   0.36 kB │ map:  0.10 kB
@@ -617,7 +624,7 @@ dist/assets/icons/icon-assets-min/24_container.js
 dist/assets/icons/icon-assets-min/24_cloud-download.js                                                  0.87 kB │ gzip:   0.52 kB │ map:  0.10 kB
 dist/assets/icons/icon-assets-min/24_color.js                                                           0.88 kB │ gzip:   0.47 kB │ map:  0.09 kB
 dist/assets/icons/icon-assets-min/24_cookie.js                                                          0.88 kB │ gzip:   0.51 kB │ map:  0.09 kB
-dist/components/PlTooltip/PlTooltip.vue_vue_type_style_index_0_lang.module.js                           0.88 kB │ gzip:   0.42 kB │ map:  9.44 kB
+dist/components/PlTooltip/PlTooltip.vue_vue_type_style_index_0_lang.module.js                           0.88 kB │ gzip:   0.42 kB │ map:  9.48 kB
 dist/assets/icons/icon-assets-min/24_cloud-offline.js                                                   0.88 kB │ gzip:   0.55 kB │ map:  0.10 kB
 dist/assets/icons/icon-assets-min/24_rotation-45.js                                                     0.89 kB │ gzip:   0.52 kB │ map:  0.10 kB
 dist/assets/icons/icon-assets-min/24_view-hide.js                                                       0.89 kB │ gzip:   0.54 kB │ map:  0.09 kB
@@ -685,7 +692,6 @@ dist/components/DataTable/TScroll.vue_vue_type_script_setup_true_lang.js
 dist/components/PlRadio/PlRadio.vue_vue_type_script_setup_true_lang.js                                  1.31 kB │ gzip:   0.72 kB │ map:  3.76 kB
 dist/components/PlSplash/PlSplash.vue_vue_type_script_setup_true_lang.js                                1.31 kB │ gzip:   0.63 kB │ map:  2.36 kB
 dist/assets/icons/icon-assets-min/24_annotate.js                                                        1.31 kB │ gzip:   0.72 kB │ map:  0.09 kB
-dist/components/PlDropdownMultiRef/PlDropdownMultiRef.vue_vue_type_script_setup_true_lang.js            1.34 kB │ gzip:   0.68 kB │ map:  3.26 kB
 dist/composition/useScroll.js                                                                           1.35 kB │ gzip:   0.57 kB │ map:  3.65 kB
 dist/assets/icons/icon-assets-min/24_dna.js                                                             1.36 kB │ gzip:   0.76 kB │ map:  0.08 kB
 dist/components/DataTable/BaseCellComponent.vue_vue_type_script_setup_true_lang.js                      1.39 kB │ gzip:   0.80 kB │ map:  2.88 kB
@@ -695,19 +701,21 @@ dist/components/PlChartStackedBar/Legends.vue_vue_type_script_setup_true_lang.js
 dist/components/DataTable/ThCell.vue_vue_type_script_setup_true_lang.js                                 1.42 kB │ gzip:   0.78 kB │ map:  2.54 kB
 dist/assets/icons/icon-assets-min/24_sina.js                                                            1.43 kB │ gzip:   0.42 kB │ map:  0.08 kB
 dist/assets/icons/icon-assets-min/24_color-none.js                                                      1.43 kB │ gzip:   0.67 kB │ map:  0.10 kB
+dist/components/PlDropdownMultiRef/PlDropdownMultiRef.vue_vue_type_script_setup_true_lang.js            1.44 kB │ gzip:   0.70 kB │ map:  3.66 kB
 dist/components/HScroll.vue_vue_type_script_setup_true_lang.js                                          1.46 kB │ gzip:   0.77 kB │ map:  2.92 kB
 dist/components/VScroll.vue_vue_type_script_setup_true_lang.js                                          1.46 kB │ gzip:   0.77 kB │ map:  2.93 kB
 dist/components/DataTable/composition/useResize.js                                                      1.48 kB │ gzip:   0.73 kB │ map:  3.93 kB
 dist/components/PlErrorBoundary/PlErrorBoundary.vue_vue_type_script_setup_true_lang.js                  1.49 kB │ gzip:   0.79 kB │ map:  3.08 kB
 dist/components/PlRadio/PlRadioGroup.vue_vue_type_script_setup_true_lang.js                             1.51 kB │ gzip:   0.79 kB │ map:  3.50 kB
 dist/assets/icons/icon-assets-min/24_social-youtube.js                                                  1.56 kB │ gzip:   0.80 kB │ map:  0.10 kB
-dist/components/PlDropdownRef/PlDropdownRef.vue_vue_type_script_setup_true_lang.js                      1.58 kB │ gzip:   0.76 kB │ map:  4.19 kB
 dist/components/PlNumberField/parseNumber.js                                                            1.58 kB │ gzip:   0.72 kB │ map:  9.08 kB
 dist/assets/icons/icon-assets-min/24_social-github.js                                                   1.62 kB │ gzip:   0.91 kB │ map:  0.10 kB
 dist/components/PlLogView/useLogHandle.js                                                               1.62 kB │ gzip:   0.87 kB │ map:  5.25 kB
 dist/components/PlChartStackedBar/StackedRowCompact.vue_vue_type_script_setup_true_lang.js              1.63 kB │ gzip:   0.80 kB │ map:  3.60 kB
 dist/components/PlErrorAlert/PlErrorAlert.vue_vue_type_script_setup_true_lang.js                        1.63 kB │ gzip:   0.70 kB │ map:  3.81 kB
 dist/components/PlSlideModal/PlSlideModal.vue_vue_type_script_setup_true_lang.js                        1.64 kB │ gzip:   0.77 kB │ map:  2.62 kB
+dist/components/PlValueLabel/PlValueLabel.vue_vue_type_script_setup_true_lang.js                        1.66 kB │ gzip:   0.75 kB │ map:  4.37 kB
+dist/components/PlDropdownRef/PlDropdownRef.vue_vue_type_script_setup_true_lang.js                      1.67 kB │ gzip:   0.77 kB │ map:  4.60 kB
 dist/components/PlTabs/PlTabs.vue_vue_type_script_setup_true_lang.js                                    1.69 kB │ gzip:   0.87 kB │ map:  3.52 kB
 dist/components/PlFileDialog/Shortcuts.vue_vue_type_script_setup_true_lang.js                           1.69 kB │ gzip:   0.71 kB │ map:  3.54 kB
 dist/components/PlChip/PlChip.vue_vue_type_script_setup_true_lang.js                                    1.70 kB │ gzip:   0.86 kB │ map:  2.61 kB
@@ -727,11 +735,11 @@ dist/assets/icons/icon-assets-min/24_pen-tool.js
 dist/components/PlChartStackedBar/StackedRow.vue_vue_type_script_setup_true_lang.js                     2.02 kB │ gzip:   0.92 kB │ map:  4.76 kB
 dist/components/PlSlideModal/PlPureSlideModal.vue_vue_type_script_setup_true_lang.js                    2.02 kB │ gzip:   0.92 kB │ map:  3.58 kB
 dist/assets/icons/icon-assets-min/16_sorter.js                                                          2.03 kB │ gzip:   0.54 kB │ map:  0.09 kB
-dist/components/PlAlert/PlAlert.vue_vue_type_script_setup_true_lang.js                                  2.03 kB │ gzip:   0.91 kB │ map:  4.13 kB
 dist/components/PlLoaderLogo.vue_vue_type_script_setup_true_lang.js                                     2.14 kB │ gzip:   1.21 kB │ map:  3.27 kB
 dist/components/PlAccordion/PlAccordionSection.vue_vue_type_script_setup_true_lang.js                   2.14 kB │ gzip:   1.00 kB │ map:  4.28 kB
 dist/assets/icons/icon-assets-min/24_violin-jitter.js                                                   2.15 kB │ gzip:   1.02 kB │ map:  0.10 kB
 dist/assets/icons/icon-assets-min/24_bindot.js                                                          2.16 kB │ gzip:   0.40 kB │ map:  0.09 kB
+dist/components/PlAlert/PlAlert.vue_vue_type_script_setup_true_lang.js                                  2.16 kB │ gzip:   0.94 kB │ map:  4.61 kB
 dist/helpers/utils.js                                                                                   2.17 kB │ gzip:   0.88 kB │ map:  6.59 kB
 dist/assets/icons/icon-assets-min/24_violin-binned.js                                                   2.18 kB │ gzip:   1.06 kB │ map:  0.10 kB
 dist/components/Scrollable.vue_vue_type_script_setup_true_lang.js                                       2.19 kB │ gzip:   0.91 kB │ map:  4.08 kB
@@ -756,7 +764,7 @@ dist/components/DataTable/state.js
 dist/layout/PlBlockPage/PlBlockPage.vue_vue_type_script_setup_true_lang.js                              3.33 kB │ gzip:   1.38 kB │ map:  7.17 kB
 dist/composition/useSortable.js                                                                         3.34 kB │ gzip:   1.24 kB │ map: 10.44 kB
 dist/components/PlFileDialog/PlFileDialog.vue_vue_type_script_setup_true_lang.js                        3.35 kB │ gzip:   1.41 kB │ map:  6.66 kB
-dist/components/PlTooltip/PlTooltip.vue_vue_type_script_setup_true_lang.js                              3.43 kB │ gzip:   1.47 kB │ map: 12.12 kB
+dist/components/PlTooltip/PlTooltip.vue_vue_type_script_setup_true_lang.js                              3.43 kB │ gzip:   1.47 kB │ map: 12.16 kB
 dist/layout/PlPlaceholder/paint-worklet.js                                                              3.45 kB │ gzip:   0.70 kB │ map:  0.10 kB
 dist/components/PlDialogModal/PlDialogModal.vue_vue_type_script_setup_true_lang.js                      3.50 kB │ gzip:   1.33 kB │ map:  7.20 kB
 dist/components/DataTable/TableComponent.vue_vue_type_script_setup_true_lang.js                         3.59 kB │ gzip:   1.53 kB │ map:  7.10 kB
@@ -775,26 +783,26 @@ dist/components/PlNumberField/PlNumberField.vue_vue_type_script_setup_true_lang.
 dist/components/PlDropdownLine/PlDropdownLine.vue_vue_type_script_setup_true_lang.js                    7.61 kB │ gzip:   2.55 kB │ map: 16.79 kB
 dist/components/SliderRangeTriple.vue_vue_type_script_setup_true_lang.js                                7.84 kB │ gzip:   2.49 kB │ map: 18.15 kB
 dist/components/PlFileDialog/Remote.vue_vue_type_script_setup_true_lang.js                              7.84 kB │ gzip:   2.84 kB │ map: 18.24 kB
-dist/components/PlDropdownMulti/PlDropdownMulti.vue_vue_type_script_setup_true_lang.js                  8.72 kB │ gzip:   2.96 kB │ map: 19.70 kB
 dist/components/PlDropdownLegacy/PlDropdownLegacy.vue_vue_type_script_setup_true_lang.js                8.78 kB │ gzip:   2.93 kB │ map: 19.81 kB
-dist/components/PlDropdown/PlDropdown.vue_vue_type_script_setup_true_lang.js                            8.98 kB │ gzip:   3.01 kB │ map: 21.00 kB
 dist/components/PlElementList/PlElementList.vue_vue_type_script_setup_true_lang.js                      9.12 kB │ gzip:   2.40 kB │ map: 22.69 kB
 dist/components/PlAutocompleteMulti/PlAutocompleteMulti.vue_vue_type_script_setup_true_lang.js          9.18 kB │ gzip:   3.13 kB │ map: 22.15 kB
 dist/components/PlAutocomplete/PlAutocomplete.vue_vue_type_script_setup_true_lang.js                    9.58 kB │ gzip:   3.22 kB │ map: 22.61 kB
 dist/demo-site-data/all-css-variables.js                                                                9.66 kB │ gzip:   1.74 kB │ map: 17.56 kB
+dist/components/PlDropdown/PlDropdown.vue_vue_type_script_setup_true_lang.js                            9.89 kB │ gzip:   3.19 kB │ map: 23.56 kB
+dist/components/PlDropdownMulti/PlDropdownMulti.vue_vue_type_script_setup_true_lang.js                  9.95 kB │ gzip:   3.20 kB │ map: 22.85 kB
 dist/composition/filters/metadata.js                                                                   11.35 kB │ gzip:   1.19 kB │ map: 22.29 kB
-dist/index.js                                                                                          12.64 kB │ gzip:   2.98 kB │ map:  8.92 kB
+dist/index.js                                                                                          12.77 kB │ gzip:   3.01 kB │ map:  9.08 kB
 dist/components/PlSvg/PlSvg.vue_vue_type_script_setup_true_lang.js                                     39.39 kB │ gzip:   3.39 kB │ map:  9.23 kB
 
-✓ built in 8.51s
-[PLUGIN_TIMINGS] JavaScript callbacks ran for 8.3s of this 8.5s build (98%).
+✓ built in 8.83s
+[PLUGIN_TIMINGS] JavaScript callbacks ran for 8.6s of this 8.8s build (98%).
 The slowest callbacks, timed inside each callback (the wait before a callback starts is excluded, the time it awaits is included):
-  - plugin unplugin-dts buildStart (75%, 6.4s, 1 call)
+  - plugin unplugin-dts buildStart (71%, 6.2s, 1 call)
 Additional callback time came from the callbacks below and from callbacks under 1s.
 3 callbacks are listed without a time. Their calls overlapped, so the time inside one call includes work from other calls. To find their cost, profile the build with `node --cpu-prof`:
   - plugin vite:asset load (298 calls)
-  - plugin sourcemaps load (302 calls)
-  - plugin vite:css transform (75 calls)
+  - plugin sourcemaps load (305 calls)
+  - plugin vite:css transform (77 calls)
 See https://rolldown.rs/reference/InputOptions.checks#bundlertimings for more details.
 
 Build completed successfully

package/.turbo/turbo-formatter$colon$check.log

@@ -6,5 +6,5 @@ Checking formatting...
 Checking formatting...
 
 All matched files use the correct format.
-Finished in 1394ms on 386 files using 16 threads.
+Finished in 793ms on 390 files using 16 threads.
 Format check completed successfully

package/.turbo/turbo-linter$colon$check.log

@@ -4,5 +4,5 @@ $ ts-builder linter --check
 Linting project...
 ↳ oxlint --config /home/runner/_work/platforma/platforma/lib/ui/uikit/.oxlintrc.json --deny-warnings
 Found 0 warnings and 0 errors.
-Finished in 25ms on 313 files with 108 rules using 16 threads.
+Finished in 30ms on 317 files with 108 rules using 16 threads.
 Linting completed successfully

package/CHANGELOG.md

@@ -1,5 +1,38 @@
 # @milaboratories/uikit
 
+## 2.17.0
+
+### Minor Changes
+
+- 8d28bcd: Column value references: `ColumnValueId` names one value of a column a block picked, and template relocation repoints the producer block inside it. The value is always a string: a value of a number column is its decimal string (`String(cell)`), so the same value picked from a number cell and from a text cell is the same id, and ids compare with `===`. `createColumnValueId` refuses a value that is not a string, and an id whose value is not a string is not a `ColumnValueId`.
+  A value picker is made like a data table, in two halves. The model gives `createColumnValueOptions({ valueColumn, labelColumn? }, { ctx? })` as an output — each column an id, a column or a recipe — a frame holding the value column and the label column, `resolving` while either is, `absent` once the value column is gone (a gone label column leaves the values to label themselves), each with the value column it was made for. The UI reads it through the frame, so a column of any storage format can be picked from: `readColumnValueOptions(model)` gives the distinct non-missing values as `{ value: ColumnValueId, label }` options in natural order of labels, each labelled by the label column in its row or by itself (`deriveColumnValueOptions`, `deriveLabelledColumnValueOptions`). In Vue, as with a table, the output reaches the dropdown through settings: `usePlColumnValueSettings({ source, valueColumn })` makes them out of the output and the column picked now — `none`, `pending` until the output is computed for that pick, `absent`, or `present` — and `<PlColumnValueDropdown>` and `<PlColumnValueDropdownMulti>` take them as `settings`: `PlDropdown` and `PlDropdownMulti` over the values, loading until they are read and telling why a column offers none; `exclude` leaves out values, and other attributes and the slots go to the dropdown.
+  `columnValueLabel(picked)` names a picked value to the user: the value a column value id picks, or the string as is when it is not such an id.
+  In workflows, `workflow.column-value` reads such ids back into plain values, always strings: `valueOf` for one id, `valuesOf` for an array of them.
+  The middle layer computes the column links of each block: `dependencies` — outputs of other blocks the block's args reference: its current args, else those of its last run — and `dependents` — blocks whose args reference the block's outputs. They reach the app and the block UI as `columnLinks` of the block state (`BlockStateInternalV3`, `BlockStateV3`): `BlockColumnLinks` with `blockId`, the block they are of, the two sides as lists of `ColumnLink` — the referenced block output (`producer`), the block holding the reference (`holderBlockId`), the column id, the picked values, the check and the column label — and `labels` of the other blocks they name; `undefined` while they are not computed, and in app versions that do not compute them. They are computed only for blocks whose model declares the `supportsColumnLinks` feature flag, which `BlockModelV3` sets, so blocks built with an earlier SDK add no work. Each block's links are computed on their own: its dependencies read its args and the last runs of the blocks they reference; its dependents read the args of every block below it — those of its last run for a block without current args — and its own last run. So a run of a block recomputes its dependents and the dependencies of the blocks that reference it — and, while it has no current args, the dependents of every block above it; an edit of a block's args recomputes its own dependencies and the dependents of every block above it, whether it references them or not. Each reference carries the picked values and a `LinkCheck`, read the same on both sides, checked against what the producer's last run exports: whether the column is exported and whether it holds the picked values. A reference to a block that has no last run is `notRun`: the block has to be run first. A reference to a block whose last run is still rendering its results is `pending`; one whose last run failed to render them is `unavailable`. A reference to an output its producer does not export is `unavailable`: among `dependents`, the dependent block cannot run against it. A reference to a block that is not above the block holding it is `unavailable` too. A column counts as exported once its spec is in the producer's last run; picked values are checked against those its `pl7.app/discreteValues` annotation lists, else against its data. A reference whose column values cannot be read is `unreadable`; one whose column lacks picked values is `missingValues`, with the values it lacks. Each reference carries the column's label: the exported column's, or, when the producer's last run does not export it, that of the column the producer prepares before it is run; the status is still judged by the last run alone. The middle layer labels the blocks by their titles, the names the project shows.
+  `PlBlockDependencies` turns column links into the alerts shown above a block, one per side, for the links that need attention: an error when an output this block uses is unavailable or lacks picked values; a warning, noting that the links are checked against this block's last run, with advice to add the missing data and run the block or reconfigure those blocks, when blocks using this block's outputs use an output it does not export or pick values it lacks; a block that has not been run yet provides no output, so links to it raise these alerts as to an output that is not provided. Columns are named by their label; output names are shown only as hints. Outputs of one block that are not exported and have no known label share one alert line ("uses 2 outputs this block does not export"). Value pickers tell, from the same links, which block was to provide a missing column or column value and what went wrong, or, when its column is provided while other inputs of the block are not, that it waits for them: the options of one input may be made from another. `computeDependencies` and `computeDependents` are in `@milaboratories/pl-model-common`; turning links into alerts and picker tooltips stays inside `@platforma-sdk/ui-vue`.
+  `PlBlockDependencies` (`<PlBlockDependencies />`) shows those alerts in a block UI that places it, from the column links the app provides, and nothing when it provides none; each other block is named by `PlBlockName`. The reader can fold the warning about blocks using this block's outputs to its title by clicking the title, which then counts the blocks ("2 blocks"); the fold is the reader's own, kept in the browser storage under the block id, and a folded warning is marked "Updated" once it says something else than when it was folded. The error about this block's own inputs does not fold. `PlAlert` takes a `label` slot in place of the `label` text, and leaves out the text area when given no text.
+  `PlBlockName` (`<PlBlockName :block-id="id" :name="label" />`) shows the name of another block of the project: a link opening that block when the app can open blocks, and plain text otherwise.
+  Block UIs can ask the app to open another block of the same project: `PlatformaV3` has an optional `openBlock(blockId)`, absent in app versions that cannot do it; in Vue, `useOpenBlock()` returns a function opening a block by id, or `undefined` when the app cannot.
+  `PlDropdown` and `PlDropdownMulti` show a selected column value id by the value it picks: as is while the options load, and as "<value> — not available" when the options lack it, unless `missingValueLabel` is given.
+  `PlValueLabel` (`<PlValueLabel :value="item" :options="options" />`) shows a selected value as text the way a dropdown does: by its option's label, a column value id by the value it picks, and a value the options lack as not available, in error color.
+  `PlDropdown`, `PlDropdownMulti`, `PlDropdownRef`, `PlDropdownMultiRef` and `PlValueLabel` take `missingValueTooltip`, a tooltip explaining a selected value missing from the options, and `missingValueLabel`, the text shown in its place: each one text for every such value, or a function giving it — the tooltip content — per value, `undefined` when there is nothing to tell. The ones `@platforma-sdk/ui-vue` exports pass both themselves when the app provides column links, for a missing column — selected by id or by ref — and a missing column value: the tooltip names the block that was to provide the column, as a link to it, and what went wrong — it does not provide the column (a block that has not been run yet provides none), the column lacks the value, or the block is still computing it; when the column is provided while other inputs of the block are not, the tooltip says it waits for them. The value is shown by the picked value, or by the label of a column selected as a whole: alone while it waits, as "<name> — not available" otherwise.
+  `PlDatasetSelector` explains a selected dataset or filter the options lack the same way, by the column it selects: the dataset first, then its filter.
+  `PlDropdownRef` and `PlDropdownMultiRef` show a missing value as "Value not available", like the other dropdowns, instead of "Upstream value removed".
+  Inside a `PlTooltip`, `--txt-link` is the tooltip link color, so links drawn with it — `PlBlockName` among them — read on the dark tooltip background like the tooltip's own links.
+
+### Patch Changes
+
+- Updated dependencies [9901322]
+- Updated dependencies [8d28bcd]
+  - @platforma-sdk/model@1.88.0
+
+## 2.16.3
+
+### Patch Changes
+
+- Updated dependencies [e813654]
+  - @platforma-sdk/model@1.87.0
+
 ## 2.16.2
 
 ### Patch Changes

package/dist/components/PlAlert/PlAlert.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAlert.js","names":["_sfc_main","PlAlert_vue_vue_type_script_setup_true_lang_default","PlAlert_default"],"sources":["../../../src/components/PlAlert/PlAlert.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n  name: \"PlAlert\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-alert.scss\";\n\nimport PlCloseModalBtn from \"../../utils/PlCloseModalBtn.vue\";\n\ndefineEmits<{\n  /**\n   * Emitted when the model value is updated, typically when the close button is clicked.\n   *\n   * @param value - The new value of the model, generally `false` when the alert is closed.\n   */\n  (e: \"update:modelValue\", value: boolean): void;\n}>();\n\nwithDefaults(\n  defineProps<{\n    /**\n     * Controls the visibility of the alert component. If `true`, the alert is visible.\n     *\n     * @default true\n     */\n    modelValue?: boolean;\n    /**\n     * The type of alert, which determines the alert's style and icon.\n     * Can be one of `'success' | 'info' | 'warn' | 'error'`.\n     */\n    type?: \"success\" | \"info\" | \"warn\" | \"error\";\n    /**\n     * An optional label that appears at the top of the alert.\n     */\n    label?: string;\n    /**\n     * If `true`, an icon corresponding to the alert type is displayed.\n     */\n    icon?: boolean;\n    /**\n     * If `true`, a close button is displayed in the alert, allowing the user to close it.\n     */\n    closeable?: boolean;\n    /**\n     * If `true`, the alert text is displayed in a monospace font.\n     */\n    monospace?: boolean;\n    /**\n     * If `true`, the alert content will preserve whitespace and line breaks.\n     */\n    whiteSpacePre?: boolean;\n\n    /**\n     * Max height (css value like '120px or 30%')\n     */\n    maxHeight?: string;\n  }>(),\n  {\n    modelValue: true,\n    type: undefined,\n    label: undefined,\n    icon: undefined,\n    closeable: undefined,\n    monospace: undefined,\n    whiteSpacePre: undefined,\n    maxHeight: undefined,\n  },\n);\n\nconst iconMap = {\n  success: \"success\",\n  warn: \"warning\",\n  info: \"edit\",\n  error: \"error\",\n};\n</script>\n\n<template>\n  <div\n    v-if=\"modelValue\"\n    data-testid=\"pl-alert\"\n    class=\"pl-alert\"\n    :style=\"{ maxHeight }\"\n    :class=\"[{ monospace, whiteSpacePre }, type ? `pl-alert__${type}` : '']\"\n  >\n    <div v-if=\"icon && type\" data-testid=\"pl-alert-icon\" class=\"pl-alert__icon\">\n      <div :class=\"`icon-24 icon-${iconMap[type]}`\" />\n    </div>\n    <div class=\"pl-alert__main\">\n      <label v-if=\"label\" data-testid=\"pl-alert-label\">{{ label }}</label>\n      <div data-testid=\"pl-alert-message\" class=\"pl-alert__main__text\"><slot /></div>\n    </div>\n    <PlCloseModalBtn\n      v-if=\"closeable\"\n      data-testid=\"pl-alert-close\"\n      class=\"pl-alert__close-btn\"\n      @click=\"$emit('update:modelValue', false)\"\n    />\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"PlAlert.js","names":["_sfc_main","PlAlert_vue_vue_type_script_setup_true_lang_default","PlAlert_default"],"sources":["../../../src/components/PlAlert/PlAlert.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n  name: \"PlAlert\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-alert.scss\";\n\nimport PlCloseModalBtn from \"../../utils/PlCloseModalBtn.vue\";\n\ndefineEmits<{\n  /**\n   * Emitted when the model value is updated, typically when the close button is clicked.\n   *\n   * @param value - The new value of the model, generally `false` when the alert is closed.\n   */\n  (e: \"update:modelValue\", value: boolean): void;\n}>();\n\ndefineSlots<{\n  /** The alert text; the alert is the label alone without it. */\n  default?: () => unknown;\n  /** Content in place of the `label` text, such as a control that folds the alert. */\n  label?: () => unknown;\n}>();\n\nwithDefaults(\n  defineProps<{\n    /**\n     * Controls the visibility of the alert component. If `true`, the alert is visible.\n     *\n     * @default true\n     */\n    modelValue?: boolean;\n    /**\n     * The type of alert, which determines the alert's style and icon.\n     * Can be one of `'success' | 'info' | 'warn' | 'error'`.\n     */\n    type?: \"success\" | \"info\" | \"warn\" | \"error\";\n    /**\n     * An optional label that appears at the top of the alert.\n     */\n    label?: string;\n    /**\n     * If `true`, an icon corresponding to the alert type is displayed.\n     */\n    icon?: boolean;\n    /**\n     * If `true`, a close button is displayed in the alert, allowing the user to close it.\n     */\n    closeable?: boolean;\n    /**\n     * If `true`, the alert text is displayed in a monospace font.\n     */\n    monospace?: boolean;\n    /**\n     * If `true`, the alert content will preserve whitespace and line breaks.\n     */\n    whiteSpacePre?: boolean;\n\n    /**\n     * Max height (css value like '120px or 30%')\n     */\n    maxHeight?: string;\n  }>(),\n  {\n    modelValue: true,\n    type: undefined,\n    label: undefined,\n    icon: undefined,\n    closeable: undefined,\n    monospace: undefined,\n    whiteSpacePre: undefined,\n    maxHeight: undefined,\n  },\n);\n\nconst iconMap = {\n  success: \"success\",\n  warn: \"warning\",\n  info: \"edit\",\n  error: \"error\",\n};\n</script>\n\n<template>\n  <div\n    v-if=\"modelValue\"\n    data-testid=\"pl-alert\"\n    class=\"pl-alert\"\n    :style=\"{ maxHeight }\"\n    :class=\"[{ monospace, whiteSpacePre }, type ? `pl-alert__${type}` : '']\"\n  >\n    <div v-if=\"icon && type\" data-testid=\"pl-alert-icon\" class=\"pl-alert__icon\">\n      <div :class=\"`icon-24 icon-${iconMap[type]}`\" />\n    </div>\n    <div class=\"pl-alert__main\">\n      <label v-if=\"label || $slots.label\" data-testid=\"pl-alert-label\">\n        <slot name=\"label\">{{ label }}</slot>\n      </label>\n      <div v-if=\"$slots.default\" data-testid=\"pl-alert-message\" class=\"pl-alert__main__text\">\n        <slot />\n      </div>\n    </div>\n    <PlCloseModalBtn\n      v-if=\"closeable\"\n      data-testid=\"pl-alert-close\"\n      class=\"pl-alert__close-btn\"\n      @click=\"$emit('update:modelValue', false)\"\n    />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/PlAlert/PlAlert.vue.d.ts

@@ -86,7 +86,10 @@ declare const __VLS_export: __VLS_WithSlots<import('vue').DefineComponent<{
     monospace: boolean;
     whiteSpacePre: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, {
-    default?: (props: {}) => any;
+    /** The alert text; the alert is the label alone without it. */
+    default?: () => unknown;
+    /** Content in place of the `label` text, such as a control that folds the alert. */
+    label?: () => unknown;
 }>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/components/PlAlert/PlAlert.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PlAlert.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlAlert/PlAlert.vue"],"names":[],"mappings":"AAyGA,OAAO,iBAAiB,CAAC;wBAKJ,OAAO,YAAY;AAAxC,wBAAyC;AAKzC,QAAA,MAAM,YAAY;IAYd;;;;OAIG;iBACU,OAAO;IACpB;;;OAGG;WACI,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO;IAC5C;;OAEG;YACK,MAAM;IACd;;OAEG;WACI,OAAO;IACd;;OAEG;gBACS,OAAO;IACnB;;OAEG;gBACS,OAAO;IACnB;;OAEG;oBACa,OAAO;IAEvB;;OAEG;gBACS,MAAM;;;;IAnClB;;;;OAIG;iBACU,OAAO;IACpB;;;OAGG;WACI,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO;IAC5C;;OAEG;YACK,MAAM;IACd;;OAEG;WACI,OAAO;IACd;;OAEG;gBACS,OAAO;IACnB;;OAEG;gBACS,OAAO;IACnB;;OAEG;oBACa,OAAO;IAEvB;;OAEG;gBACS,MAAM;;;;WArBV,MAAM;gBATD,OAAO;UAab,OAAO;UARP,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO;eAyBhC,MAAM;eAbN,OAAO;eAIP,OAAO;mBAIH,OAAO;;cA8Hb,CAAC,KAAK,IAAgB,KAAK,GAAG;EAWxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"PlAlert.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlAlert/PlAlert.vue"],"names":[],"mappings":"AAoHA,OAAO,iBAAiB,CAAC;wBAKJ,OAAO,YAAY;AAAxC,wBAAyC;AAKzC,QAAA,MAAM,YAAY;IAoBd;;;;OAIG;iBACU,OAAO;IACpB;;;OAGG;WACI,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO;IAC5C;;OAEG;YACK,MAAM;IACd;;OAEG;WACI,OAAO;IACd;;OAEG;gBACS,OAAO;IACnB;;OAEG;gBACS,OAAO;IACnB;;OAEG;oBACa,OAAO;IAEvB;;OAEG;gBACS,MAAM;;;;IAnClB;;;;OAIG;iBACU,OAAO;IACpB;;;OAGG;WACI,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO;IAC5C;;OAEG;YACK,MAAM;IACd;;OAEG;WACI,OAAO;IACd;;OAEG;gBACS,OAAO;IACnB;;OAEG;gBACS,OAAO;IACnB;;OAEG;oBACa,OAAO;IAEvB;;OAEG;gBACS,MAAM;;;;WArBV,MAAM;gBATD,OAAO;UAab,OAAO;UARP,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO;eAyBhC,MAAM;eAbN,OAAO;eAIP,OAAO;mBAIH,OAAO;;IAtCzB,+DAA+D;cACrD,MAAM,OAAO;IACvB,oFAAoF;YAC5E,MAAM,OAAO;EA4KnB,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/components/PlAlert/PlAlert.vue2.js

@@ -1,18 +1,19 @@
 import './pl-alert.css';/* empty css         */
 import e from "../../utils/PlCloseModalBtn.js";
-import { createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeClass as o, normalizeStyle as s, openBlock as c, renderSlot as l, toDisplayString as u } from "vue";
+import { createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, normalizeClass as s, normalizeStyle as c, openBlock as l, renderSlot as u, toDisplayString as d } from "vue";
 // src/components/PlAlert/PlAlert.vue?vue&type=script&setup=true&lang.ts
-var d = {
+var f = {
 	key: 0,
 	"data-testid": "pl-alert-icon",
 	class: "pl-alert__icon"
-}, f = { class: "pl-alert__main" }, p = {
+}, p = { class: "pl-alert__main" }, m = {
 	key: 0,
 	"data-testid": "pl-alert-label"
-}, m = {
+}, h = {
+	key: 1,
 	"data-testid": "pl-alert-message",
 	class: "pl-alert__main__text"
-}, h = /*@__PURE__*/ a({
+}, g = /*@__PURE__*/ o({
 	name: "PlAlert",
 	props: {
 		modelValue: {
@@ -40,33 +41,33 @@ var d = {
 		maxHeight: { default: void 0 }
 	},
 	emits: ["update:modelValue"],
-	setup(a) {
-		let h = {
+	setup(o) {
+		let g = {
 			success: "success",
 			warn: "warning",
 			info: "edit",
 			error: "error"
 		};
-		return (g, _) => a.modelValue ? (c(), r("div", {
+		return (_, v) => o.modelValue ? (l(), r("div", {
 			key: 0,
 			"data-testid": "pl-alert",
-			class: o(["pl-alert", [{
-				monospace: a.monospace,
-				whiteSpacePre: a.whiteSpacePre
-			}, a.type ? `pl-alert__${a.type}` : ""]]),
-			style: s({ maxHeight: a.maxHeight })
+			class: s(["pl-alert", [{
+				monospace: o.monospace,
+				whiteSpacePre: o.whiteSpacePre
+			}, o.type ? `pl-alert__${o.type}` : ""]]),
+			style: c({ maxHeight: o.maxHeight })
 		}, [
-			a.icon && a.type ? (c(), r("div", d, [i("div", { class: o(`icon-24 icon-${h[a.type]}`) }, null, 2)])) : n("", !0),
-			i("div", f, [a.label ? (c(), r("label", p, u(a.label), 1)) : n("", !0), i("div", m, [l(g.$slots, "default")])]),
-			a.closeable ? (c(), t(e, {
+			o.icon && o.type ? (l(), r("div", f, [i("div", { class: s(`icon-24 icon-${g[o.type]}`) }, null, 2)])) : n("", !0),
+			i("div", p, [o.label || _.$slots.label ? (l(), r("label", m, [u(_.$slots, "label", {}, () => [a(d(o.label), 1)])])) : n("", !0), _.$slots.default ? (l(), r("div", h, [u(_.$slots, "default")])) : n("", !0)]),
+			o.closeable ? (l(), t(e, {
 				key: 1,
 				"data-testid": "pl-alert-close",
 				class: "pl-alert__close-btn",
-				onClick: _[0] ||= (e) => g.$emit("update:modelValue", !1)
+				onClick: v[0] ||= (e) => _.$emit("update:modelValue", !1)
 			})) : n("", !0)
 		], 6)) : n("", !0);
 	}
 });
-export { h as default };
+export { g as default };
 
 //# sourceMappingURL=PlAlert.vue2.js.map

package/dist/components/PlAlert/PlAlert.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAlert.vue_vue_type_script_setup_true_lang.js","names":["$emit","_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_createElementVNode","_createCommentVNode","_toDisplayString","_renderSlot","_createBlock","PlCloseModalBtn","PlCloseModalBtn_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","PlAlert_vue_vue_type_script_setup_true_lang_default","iconMap","__props","openBlock","createElementBlock","normalizeClass","normalizeStyle","createElementVNode","createCommentVNode","toDisplayString","renderSlot","_ctx","createBlock","_cache"],"sources":["../../../src/components/PlAlert/PlAlert.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n  name: \"PlAlert\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-alert.scss\";\n\nimport PlCloseModalBtn from \"../../utils/PlCloseModalBtn.vue\";\n\ndefineEmits<{\n  /**\n   * Emitted when the model value is updated, typically when the close button is clicked.\n   *\n   * @param value - The new value of the model, generally `false` when the alert is closed.\n   */\n  (e: \"update:modelValue\", value: boolean): void;\n}>();\n\nwithDefaults(\n  defineProps<{\n    /**\n     * Controls the visibility of the alert component. If `true`, the alert is visible.\n     *\n     * @default true\n     */\n    modelValue?: boolean;\n    /**\n     * The type of alert, which determines the alert's style and icon.\n     * Can be one of `'success' | 'info' | 'warn' | 'error'`.\n     */\n    type?: \"success\" | \"info\" | \"warn\" | \"error\";\n    /**\n     * An optional label that appears at the top of the alert.\n     */\n    label?: string;\n    /**\n     * If `true`, an icon corresponding to the alert type is displayed.\n     */\n    icon?: boolean;\n    /**\n     * If `true`, a close button is displayed in the alert, allowing the user to close it.\n     */\n    closeable?: boolean;\n    /**\n     * If `true`, the alert text is displayed in a monospace font.\n     */\n    monospace?: boolean;\n    /**\n     * If `true`, the alert content will preserve whitespace and line breaks.\n     */\n    whiteSpacePre?: boolean;\n\n    /**\n     * Max height (css value like '120px or 30%')\n     */\n    maxHeight?: string;\n  }>(),\n  {\n    modelValue: true,\n    type: undefined,\n    label: undefined,\n    icon: undefined,\n    closeable: undefined,\n    monospace: undefined,\n    whiteSpacePre: undefined,\n    maxHeight: undefined,\n  },\n);\n\nconst iconMap = {\n  success: \"success\",\n  warn: \"warning\",\n  info: \"edit\",\n  error: \"error\",\n};\n</script>\n\n<template>\n  <div\n    v-if=\"modelValue\"\n    data-testid=\"pl-alert\"\n    class=\"pl-alert\"\n    :style=\"{ maxHeight }\"\n    :class=\"[{ monospace, whiteSpacePre }, type ? `pl-alert__${type}` : '']\"\n  >\n    <div v-if=\"icon && type\" data-testid=\"pl-alert-icon\" class=\"pl-alert__icon\">\n      <div :class=\"`icon-24 icon-${iconMap[type]}`\" />\n    </div>\n    <div class=\"pl-alert__main\">\n      <label v-if=\"label\" data-testid=\"pl-alert-label\">{{ label }}</label>\n      <div data-testid=\"pl-alert-message\" class=\"pl-alert__main__text\"><slot /></div>\n    </div>\n    <PlCloseModalBtn\n      v-if=\"closeable\"\n      data-testid=\"pl-alert-close\"\n      class=\"pl-alert__close-btn\"\n      @click=\"$emit('update:modelValue', false)\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;CAEE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqER,IAAMiB,IAAU;GACd,SAAS;GACT,MAAM;GACN,MAAM;GACN,OAAO;EACT;E,iBAKUC,EAAA,cADRjB,EAAA,GAAAC,EAoBM,OAAA;;GAlBJ,eAAY;GACZ,OAAKC,EAAA,CAAC,YAAU,CAAA;IAAA,WAELe,EAAA;IAAS,eAAEA,EAAA;GAAa,GAAIA,EAAA,OAAI,aAAgBA,EAAA,SAAI,EAAA,CAAA,CAAA;GAD9D,OAAKd,EAAA,EAAA,WAAIc,EAAA,UAAS,CAAA;;GAGRA,EAAA,QAAQA,EAAA,QAAnBjB,EAAA,GAAAC,EAEM,OAFNU,GAEM,CADJP,EAAgD,OAAA,EAA1C,OAAKF,EAAA,gBAAkBc,EAAQC,EAAA,OAAI,E;GAE3Cb,EAGM,OAHNQ,GAGM,CAFSK,EAAA,SAAbjB,EAAA,GAAAC,EAAoE,SAApEY,GAAoEP,EAAhBW,EAAA,KAAK,GAAA,CAAA,K,WACzDb,EAA+E,OAA/EU,GAA+E,CAAdP,EAAQmB,EAAA,QAAA,SAAA,C;GAGnET,EAAA,aADRjB,EAAA,GAAAQ,EAKEC,GAAA;;IAHA,eAAY;IACZ,OAAM;IACL,SAAK,AAAAmB,EAAA,QAAA,MAAE7B,EAAAA,MAAK,qBAAA,EAAA"}
+{"version":3,"file":"PlAlert.vue_vue_type_script_setup_true_lang.js","names":["$slots","$emit","_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_createElementVNode","_createCommentVNode","_renderSlot","_createTextVNode","_toDisplayString","_createBlock","PlCloseModalBtn","PlCloseModalBtn_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","PlAlert_vue_vue_type_script_setup_true_lang_default","iconMap","__props","openBlock","createElementBlock","normalizeClass","normalizeStyle","createElementVNode","createCommentVNode","_ctx","renderSlot","createTextVNode","toDisplayString","createBlock","_cache"],"sources":["../../../src/components/PlAlert/PlAlert.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n  name: \"PlAlert\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-alert.scss\";\n\nimport PlCloseModalBtn from \"../../utils/PlCloseModalBtn.vue\";\n\ndefineEmits<{\n  /**\n   * Emitted when the model value is updated, typically when the close button is clicked.\n   *\n   * @param value - The new value of the model, generally `false` when the alert is closed.\n   */\n  (e: \"update:modelValue\", value: boolean): void;\n}>();\n\ndefineSlots<{\n  /** The alert text; the alert is the label alone without it. */\n  default?: () => unknown;\n  /** Content in place of the `label` text, such as a control that folds the alert. */\n  label?: () => unknown;\n}>();\n\nwithDefaults(\n  defineProps<{\n    /**\n     * Controls the visibility of the alert component. If `true`, the alert is visible.\n     *\n     * @default true\n     */\n    modelValue?: boolean;\n    /**\n     * The type of alert, which determines the alert's style and icon.\n     * Can be one of `'success' | 'info' | 'warn' | 'error'`.\n     */\n    type?: \"success\" | \"info\" | \"warn\" | \"error\";\n    /**\n     * An optional label that appears at the top of the alert.\n     */\n    label?: string;\n    /**\n     * If `true`, an icon corresponding to the alert type is displayed.\n     */\n    icon?: boolean;\n    /**\n     * If `true`, a close button is displayed in the alert, allowing the user to close it.\n     */\n    closeable?: boolean;\n    /**\n     * If `true`, the alert text is displayed in a monospace font.\n     */\n    monospace?: boolean;\n    /**\n     * If `true`, the alert content will preserve whitespace and line breaks.\n     */\n    whiteSpacePre?: boolean;\n\n    /**\n     * Max height (css value like '120px or 30%')\n     */\n    maxHeight?: string;\n  }>(),\n  {\n    modelValue: true,\n    type: undefined,\n    label: undefined,\n    icon: undefined,\n    closeable: undefined,\n    monospace: undefined,\n    whiteSpacePre: undefined,\n    maxHeight: undefined,\n  },\n);\n\nconst iconMap = {\n  success: \"success\",\n  warn: \"warning\",\n  info: \"edit\",\n  error: \"error\",\n};\n</script>\n\n<template>\n  <div\n    v-if=\"modelValue\"\n    data-testid=\"pl-alert\"\n    class=\"pl-alert\"\n    :style=\"{ maxHeight }\"\n    :class=\"[{ monospace, whiteSpacePre }, type ? `pl-alert__${type}` : '']\"\n  >\n    <div v-if=\"icon && type\" data-testid=\"pl-alert-icon\" class=\"pl-alert__icon\">\n      <div :class=\"`icon-24 icon-${iconMap[type]}`\" />\n    </div>\n    <div class=\"pl-alert__main\">\n      <label v-if=\"label || $slots.label\" data-testid=\"pl-alert-label\">\n        <slot name=\"label\">{{ label }}</slot>\n      </label>\n      <div v-if=\"$slots.default\" data-testid=\"pl-alert-message\" class=\"pl-alert__main__text\">\n        <slot />\n      </div>\n    </div>\n    <PlCloseModalBtn\n      v-if=\"closeable\"\n      data-testid=\"pl-alert-close\"\n      class=\"pl-alert__close-btn\"\n      @click=\"$emit('update:modelValue', false)\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;CAEE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4ER,IAAMmB,IAAU;GACd,SAAS;GACT,MAAM;GACN,MAAM;GACN,OAAO;EACT;E,iBAKUC,EAAA,cADRlB,EAAA,GAAAC,EAwBM,OAAA;;GAtBJ,eAAY;GACZ,OAAKC,EAAA,CAAC,YAAU,CAAA;IAAA,WAELgB,EAAA;IAAS,eAAEA,EAAA;GAAa,GAAIA,EAAA,OAAI,aAAgBA,EAAA,SAAI,EAAA,CAAA,CAAA;GAD9D,OAAKf,EAAA,EAAA,WAAIe,EAAA,UAAS,CAAA;;GAGRA,EAAA,QAAQA,EAAA,QAAnBlB,EAAA,GAAAC,EAEM,OAFNW,GAEM,CADJR,EAAgD,OAAA,EAA1C,OAAKF,EAAA,gBAAkBe,EAAQC,EAAA,OAAI,E;GAE3Cd,EAOM,OAPNS,GAOM,CANSK,EAAA,SAASpB,EAAAA,OAAO,SAA7BE,EAAA,GAAAC,EAEQ,SAFRa,GAEQ,CADNR,EAAqCmB,EAAA,QAAA,SAAA,CAAA,SAAA,CAAflB,EAAAC,EAAAU,EAAA,KAAK,GAAA,CAAA,C,mBAElBpB,EAAAA,OAAO,WAAlBE,EAAA,GAAAC,EAEM,OAFNc,GAEM,CADJT,EAAQmB,EAAA,QAAA,SAAA,C;GAIJP,EAAA,aADRlB,EAAA,GAAAS,EAKEC,GAAA;;IAHA,eAAY;IACZ,OAAM;IACL,SAAK,AAAAoB,EAAA,QAAA,MAAE/B,EAAAA,MAAK,qBAAA,EAAA"}

package/dist/components/PlDropdown/PlDropdown.js

@@ -1,6 +1,7 @@
-import e from "./PlDropdown.vue2.js";
-// src/components/PlDropdown/PlDropdown.vue
-var t = e;
-export { t as default };
+import e from "../../_virtual/_plugin-vue_export-helper.js";
+import t from "./PlDropdown.vue2.js";
+import n from "./PlDropdown.style.js";
+var r = /*#__PURE__*/ e(t, [["__cssModules", { $style: n }]]);
+export { r as default };
 
 //# sourceMappingURL=PlDropdown.js.map

package/dist/components/PlDropdown/PlDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlDropdown.js","names":["_sfc_main","PlDropdown_vue_vue_type_script_setup_true_lang_default","PlDropdown_default"],"sources":["../../../src/components/PlDropdown/PlDropdown.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * A component for selecting one value from a list of options\n */\nexport default {\n  name: \"PlDropdown\",\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport { computed, reactive, ref, unref, useTemplateRef, watch, watchPostEffect } from \"vue\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport { tap } from \"../../helpers/functions\";\nimport { deepEqual } from \"../../helpers/objects\";\nimport { normalizeListOptions } from \"../../helpers/utils\";\nimport type { ListOption, ListOptionNormalized, MaskIconName16, MaskIconName24 } from \"../../types\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport LongText from \"../LongText.vue\";\nimport { PlColumnLabel } from \"../PlColumnLabel\";\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlIcon24 } from \"../PlIcon24\";\nimport { PlSvg } from \"../PlSvg\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport OptionList from \"./OptionList.vue\";\nimport \"./pl-dropdown.scss\";\nimport type { LOption } from \"./types\";\nimport { useGroupBy } from \"./useGroupBy\";\n\nconst emit = defineEmits<{\n  /**\n   * Emitted when the model value is updated.\n   */\n  (e: \"update:modelValue\", value: M | undefined): void;\n}>();\n\nconst props = withDefaults(\n  defineProps<{\n    /**\n     * The current selected value of the dropdown.\n     */\n    modelValue: M;\n    /**\n     * The label text for the dropdown field (optional)\n     */\n    label?: string;\n    /**\n     * List of available options for the dropdown\n     */\n    options?: Readonly<ListOption<M>[]>;\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     * Shows red border even without an error message\n     */\n    errorStatus?: boolean;\n    /**\n     * Placeholder text shown when no value is selected.\n     */\n    placeholder?: string;\n    /**\n     * Text shown in the field when `modelValue` has no matching option — e.g. its\n     * upstream block was deleted. Rendered italic in error color.\n     */\n    missingValueLabel?: 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?: MaskIconName16;\n    /**\n     * Custom icon (24px) class for the dropdown arrow (optional)\n     */\n    arrowIconLarge?: MaskIconName24;\n    /**\n     * Option list item size\n     */\n    optionSize?: \"small\" | \"medium\";\n    /**\n     * Makes some of corners not rounded\n     * */\n    groupPosition?:\n      | \"top\"\n      | \"bottom\"\n      | \"left\"\n      | \"right\"\n      | \"top-left\"\n      | \"top-right\"\n      | \"bottom-left\"\n      | \"bottom-right\"\n      | \"middle\";\n  }>(),\n  {\n    label: \"\",\n    helper: undefined,\n    loadingOptionsHelper: undefined,\n    error: undefined,\n    showErrorMessage: true,\n    placeholder: \"...\",\n    missingValueLabel: \"Value not available\",\n    clearable: false,\n    required: false,\n    disabled: false,\n    arrowIcon: undefined,\n    arrowIconLarge: undefined,\n    optionSize: \"small\",\n    options: undefined,\n    groupPosition: undefined,\n  },\n);\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst input = ref<HTMLInputElement | undefined>();\n\nconst optionListRef = useTemplateRef<InstanceType<typeof OptionList>>(\"optionListRef\");\n\nconst data = reactive({\n  search: \"\",\n  activeIndex: -1,\n  open: false,\n  optionsHeight: 0,\n});\n\nconst findActiveIndex = () =>\n  tap(\n    orderedRef.value.findIndex((o) => deepEqual(o.value, props.modelValue)),\n    (v) => (v < 0 ? 0 : v),\n  );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst isLoadingOptions = computed(() => {\n  return props.options === undefined;\n});\n\n/**\n * Loading spinner should not be shown when the dropdown is explicitly disabled,\n * even if options are undefined. The disabled state takes precedence.\n */\nconst showLoadingSpinner = computed(() => {\n  return !props.disabled && isLoadingOptions.value;\n});\n\nconst isDisabled = computed(() => {\n  if (isLoadingOptions.value) {\n    return true;\n  }\n\n  return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n  return (props.options ?? []).findIndex((o) => deepEqual(o.value, props.modelValue));\n});\n\nconst hasValue = computed(() => {\n  return props.modelValue !== undefined && props.modelValue !== null;\n});\n\nconst isMissing = computed(() => {\n  return hasValue.value && selectedIndex.value === -1 && !isLoadingOptions.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  // The field renders the missing state via `missingValueLabel`; no need to\n  // duplicate it as a helper error.\n  return undefined;\n});\n\nconst optionsRef = computed<LOption<M>[]>(() =>\n  normalizeListOptions(props.options ?? []).map((opt, index) => ({\n    ...opt,\n    index,\n    isSelected: index === selectedIndex.value,\n    isActive: index === data.activeIndex,\n  })),\n);\n\nconst selectedOption = computed(() =>\n  unref(optionsRef).find((o) => deepEqual(o.value, props.modelValue)),\n);\n\nconst textValue = computed(() => selectedOption.value?.label);\n\n// Native tooltip with the full selected value and its link hint. The `.input-value` layer has\n// `pointer-events: none`, so the title must sit on the field wrapper, which is\n// what actually receives the hover.\nconst fieldTitle = computed(() => {\n  if (data.open) return undefined;\n  if (isMissing.value) return props.missingValueLabel;\n  if (textValue.value === undefined) return undefined;\n  const hint = selectedOption.value?.linkHint;\n  return hint ? `${textValue.value}\\n${hint}` : String(textValue.value);\n});\n\nconst computedPlaceholder = computed(() => {\n  if (!data.open && hasValue.value) {\n    return \"\";\n  }\n\n  return textValue.value ? String(textValue.value) : props.placeholder;\n});\n\nconst filteredRef = computed(() => {\n  const options = optionsRef.value;\n\n  if (data.search) {\n    return options.filter((o: ListOptionNormalized) => {\n      const search = data.search.toLowerCase();\n\n      if (o.label.toLowerCase().includes(search)) {\n        return true;\n      }\n\n      if (o.description && o.description.toLowerCase().includes(search)) {\n        return true;\n      }\n\n      if (typeof o.value === \"string\") {\n        return o.value.toLowerCase().includes(search);\n      }\n\n      return o.value === data.search;\n    });\n  }\n\n  return options;\n});\n\nconst { orderedRef, groupsRef, restRef } = useGroupBy(filteredRef, \"group\");\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : \"0\"));\n\nconst selectOption = (v: M | undefined) => {\n  emit(\"update:modelValue\", v);\n  data.search = \"\";\n  data.open = false;\n  rootRef?.value?.focus();\n};\n\nconst selectOptionWrapper = (v: unknown) => {\n  selectOption(v as M | undefined);\n};\n\nconst clear = () => emit(\"update:modelValue\", undefined);\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => {\n  data.open = !data.open;\n  if (!data.open) {\n    data.search = \"\";\n  }\n};\n\nconst onInputFocus = () => (data.open = true);\n\nconst onFocusOut = (event: FocusEvent) => {\n  const relatedTarget = event.relatedTarget as Node | null;\n\n  if (\n    !rootRef.value?.contains(relatedTarget) &&\n    !optionListRef.value?.listRef?.contains(relatedTarget)\n  ) {\n    data.search = \"\";\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    }\n    return;\n  }\n\n  if (e.code === \"Escape\") {\n    data.open = false;\n    rootRef.value?.focus();\n  }\n\n  const ordered = orderedRef.value;\n\n  const { length } = ordered;\n\n  if (!length) {\n    return;\n  }\n\n  if (e.code === \"Enter\") {\n    selectOption(ordered.find((it) => it.index === activeIndex)?.value);\n  }\n\n  const localIndex = ordered.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 = ordered[newIndex].index ?? -1;\n};\n\nuseLabelNotch(rootRef);\n\nwatch(() => props.modelValue, 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  data.search; // to watch\n\n  if (data.activeIndex >= 0 && data.open) {\n    optionListRef.value?.scrollIntoActive();\n  }\n});\n</script>\n\n<template>\n  <div class=\"pl-dropdown__envelope\" @click=\"setFocusOnInput\" data-testid=\"pl-dropdown\">\n    <div\n      ref=\"rootRef\"\n      :tabindex=\"tabindex\"\n      class=\"pl-dropdown\"\n      data-testid=\"pl-dropdown-control\"\n      :class=\"{ open: data.open, error: error || errorStatus, disabled: isDisabled }\"\n      @keydown=\"handleKeydown\"\n      @focusout=\"onFocusOut\"\n    >\n      <div class=\"pl-dropdown__container\">\n        <div class=\"pl-dropdown__field\" :title=\"fieldTitle\">\n          <input\n            ref=\"input\"\n            v-model=\"data.search\"\n            type=\"text\"\n            tabindex=\"-1\"\n            :disabled=\"isDisabled\"\n            :placeholder=\"computedPlaceholder\"\n            spellcheck=\"false\"\n            autocomplete=\"chrome-off\"\n            data-testid=\"pl-dropdown-input\"\n            @focus=\"onInputFocus\"\n          />\n\n          <div v-if=\"!data.open\" class=\"input-value\" data-testid=\"pl-dropdown-value\">\n            <LongText\n              v-if=\"isMissing\"\n              class=\"input-value--missing\"\n              data-testid=\"pl-dropdown-value-missing\"\n            >\n              {{ missingValueLabel }}\n            </LongText>\n            <PlColumnLabel v-else-if=\"textValue !== undefined\" :option=\"selectedOption\">\n              <LongText>{{ textValue }}</LongText>\n            </PlColumnLabel>\n          </div>\n\n          <div class=\"pl-dropdown__controls\">\n            <PlIcon24 v-if=\"showLoadingSpinner\" name=\"loading\" data-testid=\"pl-dropdown-loading\" />\n            <PlIcon16\n              v-if=\"clearable && hasValue\"\n              class=\"clear\"\n              data-testid=\"pl-dropdown-clear\"\n              name=\"delete-clear\"\n              @click.stop=\"clear\"\n            />\n            <slot name=\"append\" />\n            <div\n              class=\"pl-dropdown__arrow-wrapper\"\n              data-testid=\"pl-dropdown-arrow\"\n              @click.stop=\"toggleOpen\"\n            >\n              <PlIcon24 v-if=\"arrowIconLarge\" :name=\"arrowIconLarge\" class=\"arrow-icon\" />\n              <PlIcon16 v-else-if=\"arrowIcon\" :name=\"arrowIcon\" class=\"arrow-icon\" />\n              <PlIcon16 v-else name=\"chevron-down\" class=\"arrow-icon arrow-icon-default\" />\n            </div>\n          </div>\n        </div>\n        <label v-if=\"label\" data-testid=\"pl-dropdown-label\">\n          <PlSvg v-if=\"required\" :uri=\"SvgRequired\" data-testid=\"pl-dropdown-required\" />\n          <span>{{ label }}</span>\n          <PlTooltip\n            v-if=\"$slots.tooltip\"\n            class=\"info\"\n            position=\"top\"\n            data-testid=\"pl-dropdown-tooltip\"\n          >\n            <template #tooltip>\n              <slot name=\"tooltip\" />\n            </template>\n          </PlTooltip>\n        </label>\n        <OptionList\n          v-if=\"data.open\"\n          ref=\"optionListRef\"\n          :root-ref=\"rootRef!\"\n          :groups=\"groupsRef\"\n          :rest=\"restRef\"\n          :option-size=\"optionSize\"\n          :select-option=\"selectOptionWrapper\"\n        />\n        <DoubleContour class=\"pl-dropdown__contour\" :group-position=\"groupPosition\" />\n      </div>\n    </div>\n    <div v-if=\"computedError\" class=\"pl-dropdown__error\" data-testid=\"pl-dropdown-error\">\n      {{ computedError }}\n    </div>\n    <div\n      v-else-if=\"showLoadingSpinner && loadingOptionsHelper\"\n      class=\"pl-dropdown__helper\"\n      data-testid=\"pl-dropdown-helper\"\n    >\n      {{ loadingOptionsHelper }}\n    </div>\n    <div v-else-if=\"helper\" class=\"pl-dropdown__helper\" data-testid=\"pl-dropdown-helper\">\n      {{ helper }}\n    </div>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"PlDropdown.js","names":["style0","_sfc_main","_plugin_vue_export_helper_default","PlDropdown_vue_vue_type_script_setup_true_lang_default","PlDropdown_vue_vue_type_style_index_0_lang_module_default","PlDropdown_default","\"$style\""],"sources":["../../../src/components/PlDropdown/PlDropdown.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * A component for selecting one value from a list of options\n */\nexport default {\n  name: \"PlDropdown\",\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport { computed, reactive, ref, unref, useTemplateRef, watch, watchPostEffect } from \"vue\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\nimport { missingValueText, missingValueTooltip, pickedValueText } from \"../../helpers/columnValue\";\nimport type { MissingValueLabel, MissingValueTooltip } from \"../../helpers/columnValue\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport { tap } from \"../../helpers/functions\";\nimport { deepEqual } from \"../../helpers/objects\";\nimport { normalizeListOptions } from \"../../helpers/utils\";\nimport type { ListOption, ListOptionNormalized, MaskIconName16, MaskIconName24 } from \"../../types\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport LongText from \"../LongText.vue\";\nimport { PlColumnLabel } from \"../PlColumnLabel\";\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlIcon24 } from \"../PlIcon24\";\nimport { PlSvg } from \"../PlSvg\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport OptionList from \"./OptionList.vue\";\nimport \"./pl-dropdown.scss\";\nimport type { LOption } from \"./types\";\nimport { useGroupBy } from \"./useGroupBy\";\n\nconst emit = defineEmits<{\n  /**\n   * Emitted when the model value is updated.\n   */\n  (e: \"update:modelValue\", value: M | undefined): void;\n}>();\n\nconst props = withDefaults(\n  defineProps<{\n    /**\n     * The current selected value of the dropdown.\n     */\n    modelValue: M;\n    /**\n     * The label text for the dropdown field (optional)\n     */\n    label?: string;\n    /**\n     * List of available options for the dropdown\n     */\n    options?: Readonly<ListOption<M>[]>;\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     * Shows red border even without an error message\n     */\n    errorStatus?: boolean;\n    /**\n     * Placeholder text shown when no value is selected.\n     */\n    placeholder?: string;\n    /**\n     * Text shown in the field when `modelValue` has no matching option — e.g. its\n     * upstream block was deleted. Rendered italic in error color. One text for every such value,\n     * or a function giving it per value. By default, the value a column value id picks, marked\n     * as not available, or \"Value not available\".\n     */\n    missingValueLabel?: MissingValueLabel;\n    /**\n     * Explains a selected value missing from the options in a tooltip over it: one text for every\n     * such value, or a function giving the content per value.\n     */\n    missingValueTooltip?: MissingValueTooltip;\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?: MaskIconName16;\n    /**\n     * Custom icon (24px) class for the dropdown arrow (optional)\n     */\n    arrowIconLarge?: MaskIconName24;\n    /**\n     * Option list item size\n     */\n    optionSize?: \"small\" | \"medium\";\n    /**\n     * Makes some of corners not rounded\n     * */\n    groupPosition?:\n      | \"top\"\n      | \"bottom\"\n      | \"left\"\n      | \"right\"\n      | \"top-left\"\n      | \"top-right\"\n      | \"bottom-left\"\n      | \"bottom-right\"\n      | \"middle\";\n  }>(),\n  {\n    label: \"\",\n    helper: undefined,\n    loadingOptionsHelper: undefined,\n    error: undefined,\n    showErrorMessage: true,\n    placeholder: \"...\",\n    missingValueLabel: undefined,\n    missingValueTooltip: undefined,\n    clearable: false,\n    required: false,\n    disabled: false,\n    arrowIcon: undefined,\n    arrowIconLarge: undefined,\n    optionSize: \"small\",\n    options: undefined,\n    groupPosition: undefined,\n  },\n);\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst input = ref<HTMLInputElement | undefined>();\n\nconst optionListRef = useTemplateRef<InstanceType<typeof OptionList>>(\"optionListRef\");\n\nconst data = reactive({\n  search: \"\",\n  activeIndex: -1,\n  open: false,\n  optionsHeight: 0,\n});\n\nconst findActiveIndex = () =>\n  tap(\n    orderedRef.value.findIndex((o) => deepEqual(o.value, props.modelValue)),\n    (v) => (v < 0 ? 0 : v),\n  );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst isLoadingOptions = computed(() => {\n  return props.options === undefined;\n});\n\n/**\n * Loading spinner should not be shown when the dropdown is explicitly disabled,\n * even if options are undefined. The disabled state takes precedence.\n */\nconst showLoadingSpinner = computed(() => {\n  return !props.disabled && isLoadingOptions.value;\n});\n\nconst isDisabled = computed(() => {\n  if (isLoadingOptions.value) {\n    return true;\n  }\n\n  return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n  return (props.options ?? []).findIndex((o) => deepEqual(o.value, props.modelValue));\n});\n\nconst hasValue = computed(() => {\n  return props.modelValue !== undefined && props.modelValue !== null;\n});\n\nconst isMissing = computed(() => {\n  return hasValue.value && selectedIndex.value === -1 && !isLoadingOptions.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  // The field renders the missing state via `missingValueLabel`; no need to\n  // duplicate it as a helper error.\n  return undefined;\n});\n\nconst optionsRef = computed<LOption<M>[]>(() =>\n  normalizeListOptions(props.options ?? []).map((opt, index) => ({\n    ...opt,\n    index,\n    isSelected: index === selectedIndex.value,\n    isActive: index === data.activeIndex,\n  })),\n);\n\nconst selectedOption = computed(() =>\n  unref(optionsRef).find((o) => deepEqual(o.value, props.modelValue)),\n);\n\nconst textValue = computed(() => {\n  const option = selectedOption.value;\n  if (option !== undefined) return option.label;\n  // A picked column value is shown by its own label while the options load.\n  return isLoadingOptions.value ? pickedValueText(props.modelValue) : undefined;\n});\n\nconst missingText = computed(() => missingValueText(props.modelValue, props.missingValueLabel));\n\nconst missingHint = computed(() =>\n  isMissing.value ? missingValueTooltip(props.modelValue, props.missingValueTooltip) : undefined,\n);\n\n// Native tooltip with the full selected value and its link hint. The `.input-value` layer has\n// `pointer-events: none`, so the title must sit on the field wrapper, which is\n// what actually receives the hover. A missing value with a hint has its own tooltip.\nconst fieldTitle = computed(() => {\n  if (data.open) return undefined;\n  if (isMissing.value) return missingHint.value === undefined ? missingText.value : undefined;\n  if (textValue.value === undefined) return undefined;\n  const hint = selectedOption.value?.linkHint;\n  return hint ? `${textValue.value}\\n${hint}` : String(textValue.value);\n});\n\nconst computedPlaceholder = computed(() => {\n  if (!data.open && hasValue.value) {\n    return \"\";\n  }\n\n  return textValue.value ? String(textValue.value) : props.placeholder;\n});\n\nconst filteredRef = computed(() => {\n  const options = optionsRef.value;\n\n  if (data.search) {\n    return options.filter((o: ListOptionNormalized) => {\n      const search = data.search.toLowerCase();\n\n      if (o.label.toLowerCase().includes(search)) {\n        return true;\n      }\n\n      if (o.description && o.description.toLowerCase().includes(search)) {\n        return true;\n      }\n\n      if (typeof o.value === \"string\") {\n        return o.value.toLowerCase().includes(search);\n      }\n\n      return o.value === data.search;\n    });\n  }\n\n  return options;\n});\n\nconst { orderedRef, groupsRef, restRef } = useGroupBy(filteredRef, \"group\");\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : \"0\"));\n\nconst selectOption = (v: M | undefined) => {\n  emit(\"update:modelValue\", v);\n  data.search = \"\";\n  data.open = false;\n  rootRef?.value?.focus();\n};\n\nconst selectOptionWrapper = (v: unknown) => {\n  selectOption(v as M | undefined);\n};\n\nconst clear = () => emit(\"update:modelValue\", undefined);\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => {\n  data.open = !data.open;\n  if (!data.open) {\n    data.search = \"\";\n  }\n};\n\nconst onInputFocus = () => (data.open = true);\n\nconst onFocusOut = (event: FocusEvent) => {\n  const relatedTarget = event.relatedTarget as Node | null;\n\n  if (\n    !rootRef.value?.contains(relatedTarget) &&\n    !optionListRef.value?.listRef?.contains(relatedTarget)\n  ) {\n    data.search = \"\";\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    }\n    return;\n  }\n\n  if (e.code === \"Escape\") {\n    data.open = false;\n    rootRef.value?.focus();\n  }\n\n  const ordered = orderedRef.value;\n\n  const { length } = ordered;\n\n  if (!length) {\n    return;\n  }\n\n  if (e.code === \"Enter\") {\n    selectOption(ordered.find((it) => it.index === activeIndex)?.value);\n  }\n\n  const localIndex = ordered.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 = ordered[newIndex].index ?? -1;\n};\n\nuseLabelNotch(rootRef);\n\nwatch(() => props.modelValue, 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  data.search; // to watch\n\n  if (data.activeIndex >= 0 && data.open) {\n    optionListRef.value?.scrollIntoActive();\n  }\n});\n</script>\n\n<template>\n  <div class=\"pl-dropdown__envelope\" @click=\"setFocusOnInput\" data-testid=\"pl-dropdown\">\n    <div\n      ref=\"rootRef\"\n      :tabindex=\"tabindex\"\n      class=\"pl-dropdown\"\n      data-testid=\"pl-dropdown-control\"\n      :class=\"{ open: data.open, error: error || errorStatus, disabled: isDisabled }\"\n      @keydown=\"handleKeydown\"\n      @focusout=\"onFocusOut\"\n    >\n      <div class=\"pl-dropdown__container\">\n        <div class=\"pl-dropdown__field\" :title=\"fieldTitle\">\n          <input\n            ref=\"input\"\n            v-model=\"data.search\"\n            type=\"text\"\n            tabindex=\"-1\"\n            :disabled=\"isDisabled\"\n            :placeholder=\"computedPlaceholder\"\n            spellcheck=\"false\"\n            autocomplete=\"chrome-off\"\n            data-testid=\"pl-dropdown-input\"\n            @focus=\"onInputFocus\"\n          />\n\n          <div v-if=\"!data.open\" class=\"input-value\" data-testid=\"pl-dropdown-value\">\n            <PlTooltip\n              v-if=\"isMissing && missingHint !== undefined\"\n              :class=\"$style.hint\"\n              position=\"top\"\n              data-testid=\"pl-dropdown-value-hint\"\n            >\n              <LongText class=\"input-value--missing\" data-testid=\"pl-dropdown-value-missing\">\n                {{ missingText }}\n              </LongText>\n              <template #tooltip>\n                <component :is=\"missingHint\" />\n              </template>\n            </PlTooltip>\n            <LongText\n              v-else-if=\"isMissing\"\n              class=\"input-value--missing\"\n              data-testid=\"pl-dropdown-value-missing\"\n            >\n              {{ missingText }}\n            </LongText>\n            <PlColumnLabel v-else-if=\"textValue !== undefined\" :option=\"selectedOption\">\n              <LongText>{{ textValue }}</LongText>\n            </PlColumnLabel>\n          </div>\n\n          <div class=\"pl-dropdown__controls\">\n            <PlIcon24 v-if=\"showLoadingSpinner\" name=\"loading\" data-testid=\"pl-dropdown-loading\" />\n            <PlIcon16\n              v-if=\"clearable && hasValue\"\n              class=\"clear\"\n              data-testid=\"pl-dropdown-clear\"\n              name=\"delete-clear\"\n              @click.stop=\"clear\"\n            />\n            <slot name=\"append\" />\n            <div\n              class=\"pl-dropdown__arrow-wrapper\"\n              data-testid=\"pl-dropdown-arrow\"\n              @click.stop=\"toggleOpen\"\n            >\n              <PlIcon24 v-if=\"arrowIconLarge\" :name=\"arrowIconLarge\" class=\"arrow-icon\" />\n              <PlIcon16 v-else-if=\"arrowIcon\" :name=\"arrowIcon\" class=\"arrow-icon\" />\n              <PlIcon16 v-else name=\"chevron-down\" class=\"arrow-icon arrow-icon-default\" />\n            </div>\n          </div>\n        </div>\n        <label v-if=\"label\" data-testid=\"pl-dropdown-label\">\n          <PlSvg v-if=\"required\" :uri=\"SvgRequired\" data-testid=\"pl-dropdown-required\" />\n          <span>{{ label }}</span>\n          <PlTooltip\n            v-if=\"$slots.tooltip\"\n            class=\"info\"\n            position=\"top\"\n            data-testid=\"pl-dropdown-tooltip\"\n          >\n            <template #tooltip>\n              <slot name=\"tooltip\" />\n            </template>\n          </PlTooltip>\n        </label>\n        <OptionList\n          v-if=\"data.open\"\n          ref=\"optionListRef\"\n          :root-ref=\"rootRef!\"\n          :groups=\"groupsRef\"\n          :rest=\"restRef\"\n          :option-size=\"optionSize\"\n          :select-option=\"selectOptionWrapper\"\n        />\n        <DoubleContour class=\"pl-dropdown__contour\" :group-position=\"groupPosition\" />\n      </div>\n    </div>\n    <div v-if=\"computedError\" class=\"pl-dropdown__error\" data-testid=\"pl-dropdown-error\">\n      {{ computedError }}\n    </div>\n    <div\n      v-else-if=\"showLoadingSpinner && loadingOptionsHelper\"\n      class=\"pl-dropdown__helper\"\n      data-testid=\"pl-dropdown-helper\"\n    >\n      {{ loadingOptionsHelper }}\n    </div>\n    <div v-else-if=\"helper\" class=\"pl-dropdown__helper\" data-testid=\"pl-dropdown-helper\">\n      {{ helper }}\n    </div>\n  </div>\n</template>\n\n<style module>\n.hint {\n  min-width: 0;\n  pointer-events: auto;\n}\n</style>\n"],"mappings":""}

package/dist/components/PlDropdown/PlDropdown.style.css

@@ -0,0 +1 @@
+._hint_2mjeo_2{pointer-events:auto;min-width:0}

package/dist/components/PlDropdown/PlDropdown.style.js

@@ -0,0 +1,5 @@
+import './PlDropdown.style.css';// src/components/PlDropdown/PlDropdown.vue?vue&type=style&index=0&lang.module.css
+var e = "_hint_2mjeo_2", t = { hint: e };
+export { t as default, e as hint };
+
+//# sourceMappingURL=PlDropdown.style.js.map