@milaboratories/uikit 2.15.43 → 2.16.0

package/dist/index.js

@@ -8,168 +8,170 @@ import { DataTable_exports as r } from "./components/DataTable/index.js";
 import { useLocalStorage as i } from "./composition/useLocalStorage.js";
 import { useTheme as a } from "./composition/useTheme.js";
 import o from "./components/ThemeSwitcher.js";
-import s from "./components/DropdownListItem.js";
-import c from "./components/ContextProvider.js";
+import s from "./components/PlSvg/PlSvg.js";
+import "./components/PlSvg/index.js";
+import c from "./components/PlIcon16/PlIcon16.js";
+import "./components/PlIcon16/index.js";
 import { animate as l, animateInfinite as u, call as d, delay as f, listToOptions as p, makeEaseInOut as m, makeEaseOut as h, normalizeListOptions as g, randomInt as _, randomString as v, requestTick as y, throttle as b, timeout as x } from "./helpers/utils.js";
 import { useClickOutside as S } from "./composition/useClickOutside.js";
 import C from "./components/PlTooltip/PlTooltip.js";
 import "./components/PlTooltip/index.js";
-import w from "./components/Slider.js";
-import T from "./components/LongText.js";
-import { downloadContent as E } from "./helpers/downloadContent.js";
-import { detectOutside as D, eventListener as O, getElementScrollPosition as k, isElementVisible as A, scrollIntoView as j } from "./helpers/dom.js";
-import { useResizeObserver as M } from "./composition/useResizeObserver.js";
-import N from "./components/Scrollable.js";
-import P from "./components/SliderRange.js";
-import F from "./components/SliderRangeTriple.js";
-import { allCssVariables as I } from "./demo-site-data/all-css-variables.js";
-import L from "./components/PlSvg/PlSvg.js";
-import "./components/PlSvg/index.js";
-import R from "./components/PlIcon24/PlIcon24.js";
+import w from "./components/PlColumnLabel/PlColumnLabel.js";
+import "./components/PlColumnLabel/index.js";
+import T from "./components/DropdownListItem.js";
+import E from "./components/ContextProvider.js";
+import D from "./components/Slider.js";
+import O from "./components/LongText.js";
+import { downloadContent as k } from "./helpers/downloadContent.js";
+import { detectOutside as A, eventListener as j, getElementScrollPosition as M, isElementVisible as N, scrollIntoView as P } from "./helpers/dom.js";
+import { useResizeObserver as F } from "./composition/useResizeObserver.js";
+import I from "./components/Scrollable.js";
+import L from "./components/SliderRange.js";
+import R from "./components/SliderRangeTriple.js";
+import { allCssVariables as z } from "./demo-site-data/all-css-variables.js";
+import B from "./components/PlIcon24/PlIcon24.js";
 import "./components/PlIcon24/index.js";
-import z from "./components/PlLoaderLogo.js";
-import B from "./layout/PlPlaceholder/PlPlaceholder.js";
-import { PL_PLACEHOLDER_TEXTS as V } from "./layout/PlPlaceholder/index.js";
-import H from "./layout/PlBlockPage/PlBlockPage.js";
-import { usePlBlockPageTitleTeleportTarget as U } from "./layout/PlBlockPage/usePlBlockPageTitleTeleportTarget.js";
+import V from "./components/PlLoaderLogo.js";
+import H from "./layout/PlPlaceholder/PlPlaceholder.js";
+import { PL_PLACEHOLDER_TEXTS as U } from "./layout/PlPlaceholder/index.js";
+import W from "./layout/PlBlockPage/PlBlockPage.js";
+import { usePlBlockPageTitleTeleportTarget as G } from "./layout/PlBlockPage/usePlBlockPageTitleTeleportTarget.js";
 import "./layout/PlBlockPage/index.js";
-import W from "./components/PlLoaderCircular/PlLoaderCircular.js";
+import K from "./components/PlLoaderCircular/PlLoaderCircular.js";
 import "./components/PlLoaderCircular/index.js";
-import G from "./components/PlSplash/PlSplash.js";
-import K from "./layout/PlContainer/PlContainer.js";
+import q from "./components/PlSplash/PlSplash.js";
+import J from "./layout/PlContainer/PlContainer.js";
 import "./layout/PlContainer/index.js";
-import q from "./layout/PlGrid/PlGrid.js";
+import Y from "./layout/PlGrid/PlGrid.js";
 import "./layout/PlGrid/index.js";
-import J from "./layout/PlRow/PlRow.js";
+import X from "./layout/PlRow/PlRow.js";
 import "./layout/PlRow/index.js";
-import Y from "./layout/PlSpacer/PlSpacer.js";
+import Z from "./layout/PlSpacer/PlSpacer.js";
 import "./layout/PlSpacer/index.js";
-import X from "./components/PlIcon16/PlIcon16.js";
 import "./components/PlMaskIcon16/index.js";
-import Z from "./components/PlErrorBoundary/PlErrorBoundary.js";
+import Q from "./components/PlErrorBoundary/PlErrorBoundary.js";
 import "./components/PlErrorBoundary/index.js";
-import Q from "./components/PlAccordion/PlAccordion.js";
-import ne from "./components/PlSectionSeparator/PlSectionSeparator.js";
+import ne from "./components/PlAccordion/PlAccordion.js";
+import re from "./components/PlSectionSeparator/PlSectionSeparator.js";
 import "./components/PlSectionSeparator/index.js";
-import re from "./components/PlAccordion/PlAccordionSection.js";
+import ie from "./components/PlAccordion/PlAccordionSection.js";
 import "./components/PlAccordion/index.js";
-import ie from "./utils/PlCloseModalBtn.js";
-import ae from "./components/PlAlert/PlAlert.js";
+import ae from "./utils/PlCloseModalBtn.js";
+import oe from "./components/PlAlert/PlAlert.js";
 import "./components/PlAlert/index.js";
-import { useLabelNotch as oe } from "./utils/useLabelNotch.js";
-import "./components/PlIcon16/index.js";
+import { useLabelNotch as se } from "./utils/useLabelNotch.js";
 import "./components/PlMaskIcon24/index.js";
-import { useElementPosition as se } from "./composition/usePosition.js";
-import ce from "./utils/DropdownOverlay/DropdownOverlay.js";
+import { useElementPosition as ce } from "./composition/usePosition.js";
+import le from "./utils/DropdownOverlay/DropdownOverlay.js";
 import "./utils/DropdownOverlay/index.js";
-import { useWatchFetch as le } from "./composition/useWatchFetch.js";
-import ue from "./components/PlAutocomplete/PlAutocomplete.js";
+import { useWatchFetch as ue } from "./composition/useWatchFetch.js";
+import de from "./components/PlAutocomplete/PlAutocomplete.js";
 import "./components/PlAutocomplete/index.js";
-import de from "./components/PlChip/PlChip.js";
+import fe from "./components/PlChip/PlChip.js";
 import "./components/PlChip/index.js";
-import fe from "./components/PlAutocompleteMulti/PlAutocompleteMulti.js";
+import pe from "./components/PlAutocompleteMulti/PlAutocompleteMulti.js";
 import "./components/PlAutocompleteMulti/index.js";
-import pe from "./components/PlBtnAccent/PlBtnAccent.js";
+import me from "./components/PlBtnAccent/PlBtnAccent.js";
 import "./components/PlBtnAccent/index.js";
-import me from "./components/PlBtnDanger/PlBtnDanger.js";
+import he from "./components/PlBtnDanger/PlBtnDanger.js";
 import "./components/PlBtnDanger/index.js";
-import he from "./components/PlBtnGhost/PlBtnGhost.js";
+import ge from "./components/PlBtnGhost/PlBtnGhost.js";
 import "./components/PlBtnGhost/index.js";
-import ge from "./components/PlBtnGroup/PlBtnGroup.js";
+import _e from "./components/PlBtnGroup/PlBtnGroup.js";
 import "./components/PlBtnGroup/index.js";
-import _e from "./components/PlBtnSecondary/PlBtnSecondary.js";
-import ve from "./components/PlBtnLink/PlBtnLink.js";
+import ve from "./components/PlBtnSecondary/PlBtnSecondary.js";
+import $ from "./components/PlBtnLink/PlBtnLink.js";
 import "./components/PlBtnLink/index.js";
-import $ from "./components/PlBtnPrimary/PlBtnPrimary.js";
+import ye from "./components/PlBtnPrimary/PlBtnPrimary.js";
 import "./components/PlBtnPrimary/index.js";
 import "./components/PlBtnSecondary/index.js";
-import ye from "./components/PlBtnSplit/PlBtnSplit.js";
+import be from "./components/PlBtnSplit/PlBtnSplit.js";
 import "./components/PlBtnSplit/index.js";
-import be from "./components/PlCheckbox/PlCheckbox.js";
+import xe from "./components/PlCheckbox/PlCheckbox.js";
 import "./components/PlCheckbox/index.js";
-import xe from "./components/PlCheckboxGroup/PlCheckboxGroup.js";
+import Se from "./components/PlCheckboxGroup/PlCheckboxGroup.js";
 import "./components/PlCheckboxGroup/index.js";
-import Se from "./components/PlDialogModal/PlDialogModal.js";
+import Ce from "./components/PlDialogModal/PlDialogModal.js";
 import "./components/PlDialogModal/index.js";
-import Ce from "./components/PlDropdown/PlDropdown.js";
+import we from "./components/PlDropdown/PlDropdown.js";
 import "./components/PlDropdown/index.js";
-import we from "./components/PlDropdownLegacy/PlDropdownLegacy.js";
+import Te from "./components/PlDropdownLegacy/PlDropdownLegacy.js";
 import "./components/PlDropdownLegacy/index.js";
-import Te from "./components/PlDropdownLine/PlDropdownLine.js";
+import Ee from "./components/PlDropdownLine/PlDropdownLine.js";
 import "./components/PlDropdownLine/index.js";
-import Ee from "./components/PlDropdownMulti/PlDropdownMulti.js";
+import De from "./components/PlDropdownMulti/PlDropdownMulti.js";
 import "./components/PlDropdownMulti/index.js";
-import De from "./components/PlDropdownMultiRef/PlDropdownMultiRef.js";
+import Oe from "./components/PlDropdownMultiRef/PlDropdownMultiRef.js";
 import "./components/PlDropdownMultiRef/index.js";
-import Oe from "./components/PlDropdownRef/PlDropdownRef.js";
+import ke from "./components/PlDropdownRef/PlDropdownRef.js";
 import "./components/PlDropdownRef/index.js";
-import ke from "./components/PlEditableTitle/PlEditableTitle.js";
+import Ae from "./components/PlEditableTitle/PlEditableTitle.js";
 import "./components/PlEditableTitle/index.js";
-import Ae from "./components/PlElementList/PlElementList.js";
+import je from "./components/PlElementList/PlElementList.js";
 import "./components/PlElementList/index.js";
-import je from "./components/PlLogView/PlLogView.js";
+import Me from "./components/PlLogView/PlLogView.js";
 import "./components/PlLogView/index.js";
-import Me from "./components/PlNumberField/PlNumberField.js";
+import Ne from "./components/PlNumberField/PlNumberField.js";
 import "./components/PlNumberField/index.js";
-import Ne from "./components/PlProgressBar/PlProgressBar.js";
+import Pe from "./components/PlProgressBar/PlProgressBar.js";
 import "./components/PlProgressBar/index.js";
-import Pe from "./components/PlProgressCell/PlProgressCell.js";
+import Fe from "./components/PlProgressCell/PlProgressCell.js";
 import "./components/PlProgressCell/index.js";
-import Fe from "./components/PlSearchField/PlSearchField.js";
+import Ie from "./components/PlSearchField/PlSearchField.js";
 import "./components/PlSearchField/index.js";
-import Ie from "./components/PlSlideModal/PlPureSlideModal.js";
-import Le from "./components/PlSlideModal/PlSlideModal.js";
+import Le from "./components/PlSlideModal/PlPureSlideModal.js";
+import Re from "./components/PlSlideModal/PlSlideModal.js";
 import "./components/PlSlideModal/index.js";
 import "./components/PlSplash/index.js";
-import Re from "./components/PlStatusTag/PlStatusTag.js";
+import ze from "./components/PlStatusTag/PlStatusTag.js";
 import "./components/PlStatusTag/index.js";
-import ze from "./components/PlTabs/PlTabs.js";
+import Be from "./components/PlTabs/PlTabs.js";
 import "./components/PlTabs/index.js";
-import Be from "./components/PlTextArea/PlTextArea.js";
+import Ve from "./components/PlTextArea/PlTextArea.js";
 import "./components/PlTextArea/index.js";
-import Ve from "./components/PlTextField/PlTextField.js";
+import He from "./components/PlTextField/PlTextField.js";
 import "./components/PlTextField/index.js";
-import He from "./components/PlToggleSwitch/PlToggleSwitch.js";
+import Ue from "./components/PlToggleSwitch/PlToggleSwitch.js";
 import "./components/PlToggleSwitch/index.js";
-import Ue from "./components/PlFileDialog/PlFileDialog.js";
+import We from "./components/PlFileDialog/PlFileDialog.js";
 import "./components/PlFileDialog/index.js";
-import We from "./components/PlFileInput/PlFileInput.js";
+import Ge from "./components/PlFileInput/PlFileInput.js";
 import "./components/PlFileInput/index.js";
-import Ge from "./components/PlNotificationAlert/PlNotificationAlert.js";
+import Ke from "./components/PlNotificationAlert/PlNotificationAlert.js";
 import "./components/PlNotificationAlert/index.js";
-import Ke from "./components/PlSidebar/PlSidebarGroup.js";
-import qe from "./components/PlSidebar/PlSidebarItem.js";
+import qe from "./components/PlSidebar/PlSidebarGroup.js";
+import Je from "./components/PlSidebar/PlSidebarItem.js";
 import "./components/PlSidebar/index.js";
-import Je from "./components/PlChartHistogram/PlChartHistogram.js";
+import Ye from "./components/PlChartHistogram/PlChartHistogram.js";
 import "./components/PlChartHistogram/index.js";
-import Ye from "./components/PlChartStackedBar/PlChartStackedBar.js";
-import Xe from "./components/PlChartStackedBar/PlChartStackedBarCompact.js";
+import Xe from "./components/PlChartStackedBar/PlChartStackedBar.js";
+import Ze from "./components/PlChartStackedBar/PlChartStackedBarCompact.js";
 import "./components/PlChartStackedBar/index.js";
-import Ze from "./components/PlRadio/PlRadio.js";
-import Qe from "./components/PlRadio/PlRadioGroup.js";
+import Qe from "./components/PlRadio/PlRadio.js";
+import $e from "./components/PlRadio/PlRadioGroup.js";
 import "./components/PlRadio/index.js";
-import { categoricalColors as $e, magma as et, palettes as tt, viridis as nt } from "./colors/palette.js";
-import { Color as rt } from "./colors/color.js";
-import { Gradient as it, interpolateColor as at, normalizeGradient as ot } from "./colors/gradient.js";
+import { categoricalColors as et, magma as tt, palettes as nt, viridis as rt } from "./colors/palette.js";
+import { Color as it } from "./colors/color.js";
+import { Gradient as at, interpolateColor as ot, normalizeGradient as st } from "./colors/gradient.js";
 import "./colors/index.js";
-import { useComponentProp as st } from "./composition/useComponentProp.js";
-import { useConfirm as ct } from "./composition/useConfirm.js";
-import { useDraggable as lt } from "./composition/useDraggable.js";
-import { useFormState as ut } from "./composition/useFormState.js";
-import { useInterval as dt } from "./composition/useInterval.js";
-import { usePollingQuery as ft } from "./composition/usePollingQuery.js";
-import { useQuery as pt } from "./composition/useQuery.js";
-import { useScroll as mt } from "./composition/useScroll.js";
-import { useSortable as ht } from "./composition/useSortable.js";
-import { useSortable2 as gt } from "./composition/useSortable2.js";
-import { computedCached as _t } from "./composition/computedCached.js";
-import { filterUiMetadata as vt, getFilterUiMetadata as yt, getFilterUiTypeOptions as bt } from "./composition/filters/metadata.js";
-import { watchCached as xt } from "./composition/watchCached.js";
-import { icons16 as St } from "./generated/icons-16.js";
-import { icons24 as Ct } from "./generated/icons-24.js";
+import { useComponentProp as ct } from "./composition/useComponentProp.js";
+import { useConfirm as lt } from "./composition/useConfirm.js";
+import { useDraggable as ut } from "./composition/useDraggable.js";
+import { useFormState as dt } from "./composition/useFormState.js";
+import { useInterval as ft } from "./composition/useInterval.js";
+import { usePollingQuery as pt } from "./composition/usePollingQuery.js";
+import { useQuery as mt } from "./composition/useQuery.js";
+import { useScroll as ht } from "./composition/useScroll.js";
+import { useSortable as gt } from "./composition/useSortable.js";
+import { useSortable2 as _t } from "./composition/useSortable2.js";
+import { computedCached as vt } from "./composition/computedCached.js";
+import { filterUiMetadata as yt, getFilterUiMetadata as bt, getFilterUiTypeOptions as xt } from "./composition/filters/metadata.js";
+import { watchCached as St } from "./composition/watchCached.js";
+import { icons16 as Ct } from "./generated/icons-16.js";
+import { icons24 as wt } from "./generated/icons-24.js";
 //#region src/index.ts
-var wt = { allCssVariables: I() };
+var Tt = { allCssVariables: z() };
 //#endregion
-export { rt as Color, c as ContextProvider, r as DataTable, wt as DemoData, s as DropdownListItem, ce as DropdownOverlay, it as Gradient, T as LongText, V as PL_PLACEHOLDER_TEXTS, Q as PlAccordion, re as PlAccordionSection, ae as PlAlert, ue as PlAutocomplete, fe as PlAutocompleteMulti, H as PlBlockPage, pe as PlBtnAccent, me as PlBtnDanger, he as PlBtnGhost, ge as PlBtnGroup, ve as PlBtnLink, $ as PlBtnPrimary, _e as PlBtnSecondary, ye as PlBtnSplit, Je as PlChartHistogram, Ye as PlChartStackedBar, Xe as PlChartStackedBarCompact, be as PlCheckbox, xe as PlCheckboxGroup, de as PlChip, ie as PlCloseModalBtn, K as PlContainer, Se as PlDialogModal, Ce as PlDropdown, we as PlDropdownLegacy, Te as PlDropdownLine, Ee as PlDropdownMulti, De as PlDropdownMultiRef, Oe as PlDropdownRef, ke as PlEditableTitle, Ae as PlElementList, Z as PlErrorBoundary, Ue as PlFileDialog, We as PlFileInput, q as PlGrid, X as PlIcon16, R as PlIcon24, W as PlLoaderCircular, z as PlLoaderLogo, je as PlLogView, X as PlMaskIcon16, R as PlMaskIcon24, Ge as PlNotificationAlert, Me as PlNumberField, B as PlPlaceholder, Ne as PlProgressBar, Pe as PlProgressCell, Ie as PlPureSlideModal, Ze as PlRadio, Qe as PlRadioGroup, J as PlRow, Fe as PlSearchField, ne as PlSectionSeparator, Ke as PlSidebarGroup, qe as PlSidebarItem, Le as PlSlideModal, Y as PlSpacer, G as PlSplash, Re as PlStatusTag, L as PlSvg, ze as PlTabs, Be as PlTextArea, Ve as PlTextField, He as PlToggleSwitch, C as PlTooltip, N as Scrollable, w as Slider, P as SliderRange, F as SliderRangeTriple, o as ThemeSwitcher, l as animate, u as animateInfinite, d as call, $e as categoricalColors, _t as computedCached, f as delay, D as detectOutside, E as downloadContent, O as eventListener, vt as filterUiMetadata, k as getElementScrollPosition, yt as getFilterUiMetadata, bt as getFilterUiTypeOptions, St as icons16, Ct as icons24, at as interpolateColor, A as isElementVisible, p as listToOptions, et as magma, m as makeEaseInOut, h as makeEaseOut, ot as normalizeGradient, g as normalizeListOptions, tt as palettes, _ as randomInt, v as randomString, y as requestTick, j as scrollIntoView, ee as showContextMenu, b as throttle, x as timeout, S as useClickOutside, st as useComponentProp, ct as useConfirm, lt as useDraggable, te as useEventListener, ut as useFormState, t as useHover, dt as useInterval, oe as useLabelNotch, i as useLocalStorage, e as useMouse, n as useMouseCapture, U as usePlBlockPageTitleTeleportTarget, ft as usePollingQuery, se as usePosition, pt as useQuery, M as useResizeObserver, mt as useScroll, ht as useSortable, gt as useSortable2, a as useTheme, le as useWatchFetch, nt as viridis, xt as watchCached };
+export { it as Color, E as ContextProvider, r as DataTable, Tt as DemoData, T as DropdownListItem, le as DropdownOverlay, at as Gradient, O as LongText, U as PL_PLACEHOLDER_TEXTS, ne as PlAccordion, ie as PlAccordionSection, oe as PlAlert, de as PlAutocomplete, pe as PlAutocompleteMulti, W as PlBlockPage, me as PlBtnAccent, he as PlBtnDanger, ge as PlBtnGhost, _e as PlBtnGroup, $ as PlBtnLink, ye as PlBtnPrimary, ve as PlBtnSecondary, be as PlBtnSplit, Ye as PlChartHistogram, Xe as PlChartStackedBar, Ze as PlChartStackedBarCompact, xe as PlCheckbox, Se as PlCheckboxGroup, fe as PlChip, ae as PlCloseModalBtn, w as PlColumnLabel, J as PlContainer, Ce as PlDialogModal, we as PlDropdown, Te as PlDropdownLegacy, Ee as PlDropdownLine, De as PlDropdownMulti, Oe as PlDropdownMultiRef, ke as PlDropdownRef, Ae as PlEditableTitle, je as PlElementList, Q as PlErrorBoundary, We as PlFileDialog, Ge as PlFileInput, Y as PlGrid, c as PlIcon16, B as PlIcon24, K as PlLoaderCircular, V as PlLoaderLogo, Me as PlLogView, c as PlMaskIcon16, B as PlMaskIcon24, Ke as PlNotificationAlert, Ne as PlNumberField, H as PlPlaceholder, Pe as PlProgressBar, Fe as PlProgressCell, Le as PlPureSlideModal, Qe as PlRadio, $e as PlRadioGroup, X as PlRow, Ie as PlSearchField, re as PlSectionSeparator, qe as PlSidebarGroup, Je as PlSidebarItem, Re as PlSlideModal, Z as PlSpacer, q as PlSplash, ze as PlStatusTag, s as PlSvg, Be as PlTabs, Ve as PlTextArea, He as PlTextField, Ue as PlToggleSwitch, C as PlTooltip, I as Scrollable, D as Slider, L as SliderRange, R as SliderRangeTriple, o as ThemeSwitcher, l as animate, u as animateInfinite, d as call, et as categoricalColors, vt as computedCached, f as delay, A as detectOutside, k as downloadContent, j as eventListener, yt as filterUiMetadata, M as getElementScrollPosition, bt as getFilterUiMetadata, xt as getFilterUiTypeOptions, Ct as icons16, wt as icons24, ot as interpolateColor, N as isElementVisible, p as listToOptions, tt as magma, m as makeEaseInOut, h as makeEaseOut, st as normalizeGradient, g as normalizeListOptions, nt as palettes, _ as randomInt, v as randomString, y as requestTick, P as scrollIntoView, ee as showContextMenu, b as throttle, x as timeout, S as useClickOutside, ct as useComponentProp, lt as useConfirm, ut as useDraggable, te as useEventListener, dt as useFormState, t as useHover, ft as useInterval, se as useLabelNotch, i as useLocalStorage, e as useMouse, n as useMouseCapture, G as usePlBlockPageTitleTeleportTarget, pt as usePollingQuery, ce as usePosition, mt as useQuery, F as useResizeObserver, ht as useScroll, gt as useSortable, _t as useSortable2, a as useTheme, ue as useWatchFetch, rt as viridis, St as watchCached };
 
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../src/index.ts"],"sourcesContent":["import \"./assets/ui.scss\";\n\n// @TODO review\nimport * as DataTable from \"./components/DataTable\";\nimport ThemeSwitcher from \"./components/ThemeSwitcher.vue\";\n// @TODO review (may be private)\nimport DropdownListItem from \"./components/DropdownListItem.vue\";\n\n// @TODO review\nimport ContextProvider from \"./components/ContextProvider.vue\";\nimport Slider from \"./components/Slider.vue\";\nimport { showContextMenu } from \"./components/contextMenu\";\n// for new version\nimport LongText from \"./components/LongText.vue\";\nimport Scrollable from \"./components/Scrollable.vue\";\nimport SliderRange from \"./components/SliderRange.vue\";\nimport SliderRangeTriple from \"./components/SliderRangeTriple.vue\";\n\nimport { allCssVariables } from \"./demo-site-data/all-css-variables.ts\";\n\n/**\n * Layout components\n */\n\nexport * from \"./layout/PlBlockPage\";\nexport * from \"./layout/PlContainer\";\nexport * from \"./layout/PlGrid\";\nexport * from \"./layout/PlPlaceholder\";\nexport * from \"./layout/PlRow\";\nexport * from \"./layout/PlSpacer\";\n\n/**\n * Components\n */\nexport * from \"./components/PlErrorBoundary\";\n// export * from './components/PlErrorAlert'; // @TODO discuss if we should export it\nexport * from \"./components/PlAccordion\";\nexport * from \"./components/PlAlert\";\nexport * from \"./components/PlAutocomplete\";\nexport * from \"./components/PlAutocompleteMulti\";\nexport * from \"./components/PlBtnAccent\";\nexport * from \"./components/PlBtnDanger\";\nexport * from \"./components/PlBtnGhost\";\nexport * from \"./components/PlBtnGroup\";\nexport * from \"./components/PlBtnLink\";\nexport * from \"./components/PlBtnPrimary\";\nexport * from \"./components/PlBtnSecondary\";\nexport * from \"./components/PlBtnSplit\";\nexport * from \"./components/PlCheckbox\";\nexport * from \"./components/PlCheckboxGroup\";\nexport * from \"./components/PlChip\";\nexport * from \"./components/PlDialogModal\";\nexport * from \"./components/PlDropdown\";\nexport * from \"./components/PlDropdownLegacy\";\nexport * from \"./components/PlDropdownLine\";\nexport * from \"./components/PlDropdownMulti\";\nexport * from \"./components/PlDropdownMultiRef\";\nexport * from \"./components/PlDropdownRef\";\nexport * from \"./components/PlEditableTitle\";\nexport * from \"./components/PlElementList\";\nexport * from \"./components/PlLoaderCircular\";\nexport * from \"./components/PlLogView\";\nexport * from \"./components/PlNumberField\";\nexport * from \"./components/PlProgressBar\";\nexport * from \"./components/PlProgressCell\";\nexport * from \"./components/PlSearchField\";\nexport * from \"./components/PlSectionSeparator\";\nexport * from \"./components/PlSlideModal\";\nexport * from \"./components/PlSplash\";\nexport * from \"./components/PlStatusTag\";\nexport * from \"./components/PlTabs\";\nexport * from \"./components/PlTextArea\";\nexport * from \"./components/PlTextField\";\nexport * from \"./components/PlToggleSwitch\";\nexport * from \"./components/PlTooltip\";\n\nexport * from \"./components/PlFileDialog\";\nexport * from \"./components/PlFileInput\";\nexport * from \"./components/PlNotificationAlert\";\n\nexport * from \"./components/PlSidebar\";\n\nexport * from \"./components/PlIcon16\";\nexport * from \"./components/PlIcon24\";\nexport * from \"./components/PlMaskIcon16\";\nexport * from \"./components/PlMaskIcon24\";\nexport * from \"./components/PlSvg\";\n\nexport * from \"./components/PlChartHistogram\";\nexport * from \"./components/PlChartStackedBar\";\n\nexport * from \"./components/PlRadio\";\n\nexport { default as PlLoaderLogo } from \"./components/PlLoaderLogo.vue\";\n\nexport * from \"./colors\";\n\n/**\n * Usables\n */\nexport { useClickOutside } from \"./composition/useClickOutside\";\nexport { useComponentProp } from \"./composition/useComponentProp\";\nexport { useConfirm } from \"./composition/useConfirm\";\nexport { useDraggable } from \"./composition/useDraggable\";\nexport { useEventListener } from \"./composition/useEventListener\";\nexport { useFormState } from \"./composition/useFormState\";\nexport { useHover } from \"./composition/useHover\";\nexport { useInterval } from \"./composition/useInterval\";\nexport { usePollingQuery } from \"./composition/usePollingQuery\";\nexport { useLocalStorage } from \"./composition/useLocalStorage\";\nexport { useMouse } from \"./composition/useMouse\";\nexport { useMouseCapture } from \"./composition/useMouseCapture\";\nexport { useElementPosition as usePosition } from \"./composition/usePosition\";\nexport { useQuery } from \"./composition/useQuery.ts\";\nexport { useResizeObserver } from \"./composition/useResizeObserver\";\nexport { useScroll } from \"./composition/useScroll\";\nexport { useSortable } from \"./composition/useSortable\";\nexport { useSortable2 } from \"./composition/useSortable2\";\nexport { useTheme } from \"./composition/useTheme\";\n\nexport * from \"./composition/computedCached\";\nexport * from \"./composition/filters\";\nexport * from \"./composition/useWatchFetch\";\nexport * from \"./composition/watchCached\";\n\n/**\n * Utils/Partials\n */\n\nexport * from \"./utils/DropdownOverlay\";\nexport { default as PlCloseModalBtn } from \"./utils/PlCloseModalBtn.vue\";\n\n/**\n * Technical\n * @TODO move it from here maybe\n */\nexport { useLabelNotch } from \"./utils/useLabelNotch.ts\";\n\nexport type * from \"./types\";\n\nexport { icons16, icons24 } from \"./types\";\n\nexport * from \"./helpers/dom\";\n\nexport * from \"./helpers/utils\";\n\n/**\n * @TODO review\n */\nexport { ContextProvider, DataTable, DropdownListItem, Slider, ThemeSwitcher };\n\n// Helpers\nexport { showContextMenu };\n\n// move to new version pl-uikit\nexport { LongText, Scrollable, SliderRange, SliderRangeTriple };\n\n// @todo\nconst DemoData = { allCssVariables: allCssVariables() };\nexport { DemoData };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8JA,IAAM,KAAW,EAAE,iBAAiB,GAAiB,EAAE"}
+{"version":3,"file":"index.js","names":[],"sources":["../src/index.ts"],"sourcesContent":["import \"./assets/ui.scss\";\n\n// @TODO review\nimport * as DataTable from \"./components/DataTable\";\nimport ThemeSwitcher from \"./components/ThemeSwitcher.vue\";\n// @TODO review (may be private)\nimport DropdownListItem from \"./components/DropdownListItem.vue\";\n\n// @TODO review\nimport ContextProvider from \"./components/ContextProvider.vue\";\nimport Slider from \"./components/Slider.vue\";\nimport { showContextMenu } from \"./components/contextMenu\";\n// for new version\nimport LongText from \"./components/LongText.vue\";\nimport Scrollable from \"./components/Scrollable.vue\";\nimport SliderRange from \"./components/SliderRange.vue\";\nimport SliderRangeTriple from \"./components/SliderRangeTriple.vue\";\n\nimport { allCssVariables } from \"./demo-site-data/all-css-variables.ts\";\n\n/**\n * Layout components\n */\n\nexport * from \"./layout/PlBlockPage\";\nexport * from \"./layout/PlContainer\";\nexport * from \"./layout/PlGrid\";\nexport * from \"./layout/PlPlaceholder\";\nexport * from \"./layout/PlRow\";\nexport * from \"./layout/PlSpacer\";\n\n/**\n * Components\n */\nexport * from \"./components/PlErrorBoundary\";\n// export * from './components/PlErrorAlert'; // @TODO discuss if we should export it\nexport * from \"./components/PlAccordion\";\nexport * from \"./components/PlAlert\";\nexport * from \"./components/PlAutocomplete\";\nexport * from \"./components/PlAutocompleteMulti\";\nexport * from \"./components/PlBtnAccent\";\nexport * from \"./components/PlBtnDanger\";\nexport * from \"./components/PlBtnGhost\";\nexport * from \"./components/PlBtnGroup\";\nexport * from \"./components/PlBtnLink\";\nexport * from \"./components/PlBtnPrimary\";\nexport * from \"./components/PlBtnSecondary\";\nexport * from \"./components/PlBtnSplit\";\nexport * from \"./components/PlCheckbox\";\nexport * from \"./components/PlCheckboxGroup\";\nexport * from \"./components/PlChip\";\nexport * from \"./components/PlDialogModal\";\nexport * from \"./components/PlDropdown\";\nexport * from \"./components/PlDropdownLegacy\";\nexport * from \"./components/PlDropdownLine\";\nexport * from \"./components/PlDropdownMulti\";\nexport * from \"./components/PlDropdownMultiRef\";\nexport * from \"./components/PlDropdownRef\";\nexport * from \"./components/PlEditableTitle\";\nexport * from \"./components/PlElementList\";\nexport * from \"./components/PlLoaderCircular\";\nexport * from \"./components/PlLogView\";\nexport * from \"./components/PlNumberField\";\nexport * from \"./components/PlProgressBar\";\nexport * from \"./components/PlProgressCell\";\nexport * from \"./components/PlSearchField\";\nexport * from \"./components/PlSectionSeparator\";\nexport * from \"./components/PlSlideModal\";\nexport * from \"./components/PlSplash\";\nexport * from \"./components/PlStatusTag\";\nexport * from \"./components/PlTabs\";\nexport * from \"./components/PlTextArea\";\nexport * from \"./components/PlTextField\";\nexport * from \"./components/PlToggleSwitch\";\nexport * from \"./components/PlTooltip\";\nexport * from \"./components/PlColumnLabel\";\n\nexport * from \"./components/PlFileDialog\";\nexport * from \"./components/PlFileInput\";\nexport * from \"./components/PlNotificationAlert\";\n\nexport * from \"./components/PlSidebar\";\n\nexport * from \"./components/PlIcon16\";\nexport * from \"./components/PlIcon24\";\nexport * from \"./components/PlMaskIcon16\";\nexport * from \"./components/PlMaskIcon24\";\nexport * from \"./components/PlSvg\";\n\nexport * from \"./components/PlChartHistogram\";\nexport * from \"./components/PlChartStackedBar\";\n\nexport * from \"./components/PlRadio\";\n\nexport { default as PlLoaderLogo } from \"./components/PlLoaderLogo.vue\";\n\nexport * from \"./colors\";\n\n/**\n * Usables\n */\nexport { useClickOutside } from \"./composition/useClickOutside\";\nexport { useComponentProp } from \"./composition/useComponentProp\";\nexport { useConfirm } from \"./composition/useConfirm\";\nexport { useDraggable } from \"./composition/useDraggable\";\nexport { useEventListener } from \"./composition/useEventListener\";\nexport { useFormState } from \"./composition/useFormState\";\nexport { useHover } from \"./composition/useHover\";\nexport { useInterval } from \"./composition/useInterval\";\nexport { usePollingQuery } from \"./composition/usePollingQuery\";\nexport { useLocalStorage } from \"./composition/useLocalStorage\";\nexport { useMouse } from \"./composition/useMouse\";\nexport { useMouseCapture } from \"./composition/useMouseCapture\";\nexport { useElementPosition as usePosition } from \"./composition/usePosition\";\nexport { useQuery } from \"./composition/useQuery.ts\";\nexport { useResizeObserver } from \"./composition/useResizeObserver\";\nexport { useScroll } from \"./composition/useScroll\";\nexport { useSortable } from \"./composition/useSortable\";\nexport { useSortable2 } from \"./composition/useSortable2\";\nexport { useTheme } from \"./composition/useTheme\";\n\nexport * from \"./composition/computedCached\";\nexport * from \"./composition/filters\";\nexport * from \"./composition/useWatchFetch\";\nexport * from \"./composition/watchCached\";\n\n/**\n * Utils/Partials\n */\n\nexport * from \"./utils/DropdownOverlay\";\nexport { default as PlCloseModalBtn } from \"./utils/PlCloseModalBtn.vue\";\n\n/**\n * Technical\n * @TODO move it from here maybe\n */\nexport { useLabelNotch } from \"./utils/useLabelNotch.ts\";\n\nexport type * from \"./types\";\n\nexport { icons16, icons24 } from \"./types\";\n\nexport * from \"./helpers/dom\";\n\nexport * from \"./helpers/utils\";\n\n/**\n * @TODO review\n */\nexport { ContextProvider, DataTable, DropdownListItem, Slider, ThemeSwitcher };\n\n// Helpers\nexport { showContextMenu };\n\n// move to new version pl-uikit\nexport { LongText, Scrollable, SliderRange, SliderRangeTriple };\n\n// @todo\nconst DemoData = { allCssVariables: allCssVariables() };\nexport { DemoData };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+JA,IAAM,KAAW,EAAE,iBAAiB,GAAiB,EAAE"}

package/dist/utils/useLabelNotch.js

@@ -1,5 +1,5 @@
-import { tap as e, tapIf as t } from "../helpers/functions.js";
-import { call as n } from "../helpers/utils.js";
+import { call as e } from "../helpers/utils.js";
+import { tap as t, tapIf as n } from "../helpers/functions.js";
 import { onChanged as r } from "../composition/utils.js";
 import { startResizeObserving as i, stopResizeObserving as a } from "../global/resizeObserver.js";
 import { onBeforeUnmount as o } from "vue";
@@ -8,11 +8,11 @@ var s = 8, c = 4;
 function l(l, u = "label") {
 	let d = /* @__PURE__ */ new Set();
 	r(() => {
-		t(l?.value, (t) => {
-			let r = t.querySelector(u);
+		n(l?.value, (n) => {
+			let r = n.querySelector(u);
 			r && (d.add(r), i(r, () => {
-				let i = n(() => r.getBoundingClientRect().width + e(s, (e) => Number.isNaN(e) ? c : e + c));
-				t.style.getPropertyValue("--label-offset-right-x") !== `${i}px` && t.style.setProperty("--label-offset-right-x", `${i}px`);
+				let i = e(() => r.getBoundingClientRect().width + t(s, (e) => Number.isNaN(e) ? c : e + c));
+				n.style.getPropertyValue("--label-offset-right-x") !== `${i}px` && n.style.setProperty("--label-offset-right-x", `${i}px`);
 			}));
 		});
 	}), o(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@milaboratories/uikit",
-  "version": "2.15.43",
+  "version": "2.16.0",
   "type": "module",
   "main": "dist/index.js",
   "exports": {
@@ -32,7 +32,7 @@
     "sortablejs": "^1.15.6",
     "vue": "3.5.24",
     "@milaboratories/helpers": "1.14.5",
-    "@platforma-sdk/model": "1.85.2"
+    "@platforma-sdk/model": "1.86.0"
   },
   "devDependencies": {
     "@vitest/coverage-istanbul": "^4.1.3",
@@ -40,10 +40,15 @@
     "svgo": "^3.3.2",
     "typescript": "7.0.2",
     "vitest": "^4.1.3",
-    "@milaboratories/ts-builder": "1.7.2",
     "@milaboratories/build-configs": "2.0.2",
+    "@milaboratories/ts-builder": "1.7.2",
     "@milaboratories/ts-configs": "1.4.0"
   },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/milaboratory/platforma.git",
+    "directory": "lib/ui/uikit"
+  },
   "scripts": {
     "dev": "ts-builder serve --target browser-lib --build-config ./build.browser-lib.config.js",
     "build": "ts-builder build --target browser-lib --build-config ./build.browser-lib.config.js",

package/src/components/DropdownListItem.vue

@@ -3,6 +3,7 @@ import { computed } from "vue";
 import CheckboxUncheckedSvg from "../assets/images/24_checkbox-light-enabled-unchecked.svg?raw";
 import CheckboxCheckedSvg from "../assets/images/24_checkbox-light-enabled-checked.svg?raw";
 import type { ListOptionNormalized } from "../types";
+import { PlColumnLabel } from "./PlColumnLabel";
 
 const props = withDefaults(
   defineProps<{
@@ -58,7 +59,7 @@ const checkboxSvg = computed(() => (props.isSelected ? CheckboxCheckedSvg : Chec
     <!--eslint-enable-->
     <div class="dropdown-list-item__title-container">
       <div class="dropdown-list-item__title text-s" data-testid="pl-dropdown-list-item-title">
-        {{ option.label }}
+        <PlColumnLabel :option="option" />
       </div>
       <div
         v-if="option.description"

package/src/components/PlColumnLabel/PlColumnLabel.vue

@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import type { ListOptionBase } from "@platforma-sdk/model";
+import { PlIcon16 } from "../PlIcon16";
+import { PlTooltip } from "../PlTooltip";
+
+/**
+ * A column's name as every table and dropdown shows it. A column reached through a link to
+ * another dataset gets a link icon in front, with `linkHint` on hover. Takes the whole option, so
+ * a new option field only needs handling here.
+ */
+defineProps<{
+  option?: Pick<ListOptionBase, "label" | "linkHint">;
+}>();
+</script>
+
+<template>
+  <span :class="$style.root" data-testid="pl-column-label">
+    <PlTooltip v-if="option?.linkHint" :class="$style.link" data-testid="pl-column-label-link">
+      <template #tooltip>{{ option.linkHint }}</template>
+      <PlIcon16 name="link" />
+    </PlTooltip>
+    <!-- For a label the caller renders itself, e.g. with search matches highlighted. -->
+    <slot>{{ option?.label }}</slot>
+  </span>
+</template>
+
+<style module>
+.root {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  min-width: 0;
+  max-width: 100%;
+}
+
+/* Lets a long label shrink, so it can truncate. */
+.root > * {
+  min-width: 0;
+}
+
+/* PlTooltip's inline-block wrapper would lift the icon above the text's centre. */
+.root > .link {
+  display: flex;
+  flex-shrink: 0;
+}
+</style>

package/src/components/PlColumnLabel/index.ts

@@ -0,0 +1 @@
+export { default as PlColumnLabel } from "./PlColumnLabel.vue";

package/src/components/PlDropdown/PlDropdown.vue

@@ -18,6 +18,7 @@ import type { ListOption, ListOptionNormalized, MaskIconName16, MaskIconName24 }
 import DoubleContour from "../../utils/DoubleContour.vue";
 import { useLabelNotch } from "../../utils/useLabelNotch";
 import LongText from "../LongText.vue";
+import { PlColumnLabel } from "../PlColumnLabel";
 import { PlIcon16 } from "../PlIcon16";
 import { PlIcon24 } from "../PlIcon24";
 import { PlSvg } from "../PlSvg";
@@ -205,19 +206,21 @@ const optionsRef = computed<LOption<M>[]>(() =>
   })),
 );
 
-const textValue = computed(() => {
-  const options = unref(optionsRef);
-  const item: ListOption | undefined = options.find((o) => deepEqual(o.value, props.modelValue));
-  return item?.label;
-});
+const selectedOption = computed(() =>
+  unref(optionsRef).find((o) => deepEqual(o.value, props.modelValue)),
+);
 
-// Native tooltip with the full selected value. The `.input-value` layer has
+const textValue = computed(() => selectedOption.value?.label);
+
+// Native tooltip with the full selected value and its link hint. The `.input-value` layer has
 // `pointer-events: none`, so the title must sit on the field wrapper, which is
 // what actually receives the hover.
 const fieldTitle = computed(() => {
   if (data.open) return undefined;
   if (isMissing.value) return props.missingValueLabel;
-  return textValue.value !== undefined ? String(textValue.value) : undefined;
+  if (textValue.value === undefined) return undefined;
+  const hint = selectedOption.value?.linkHint;
+  return hint ? `${textValue.value}\n${hint}` : String(textValue.value);
 });
 
 const computedPlaceholder = computed(() => {
@@ -389,9 +392,9 @@ watchPostEffect(() => {
             >
               {{ missingValueLabel }}
             </LongText>
-            <LongText v-else-if="textValue !== undefined">
-              {{ textValue }}
-            </LongText>
+            <PlColumnLabel v-else-if="textValue !== undefined" :option="selectedOption">
+              <LongText>{{ textValue }}</LongText>
+            </PlColumnLabel>
           </div>
 
           <div class="pl-dropdown__controls">

package/src/helpers/utils.ts

@@ -147,5 +147,6 @@ export function normalizeListOptions<V = unknown>(
     value: it.value,
     description: it.description,
     group: it.group,
+    linkHint: it.linkHint,
   }));
 }

package/src/index.ts

@@ -73,6 +73,7 @@ export * from "./components/PlTextArea";
 export * from "./components/PlTextField";
 export * from "./components/PlToggleSwitch";
 export * from "./components/PlTooltip";
+export * from "./components/PlColumnLabel";
 
 export * from "./components/PlFileDialog";
 export * from "./components/PlFileInput";