npm - @milaboratories/uikit - Versions diffs - 2.15.42 → 2.16.0 - Mend

@milaboratories/uikit 2.15.42 → 2.16.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (63) hide show

package/dist/components/PlDropdownLegacy/PlDropdownLegacy.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlDropdownLegacy.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlDropdownLegacy/PlDropdownLegacy.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 \"./pl-dropdown-legacy.scss\";\nimport { computed, reactive, ref, unref, useSlots, watch, watchPostEffect } from \"vue\";\nimport { tap, tapIf } from \"../../helpers/functions\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport type { ListOption, ListOptionNormalized } from \"../../types\";\nimport { scrollIntoView } from \"../../helpers/dom\";\nimport { deepEqual } from \"../../helpers/objects\";\nimport DropdownListItem from \"../DropdownListItem.vue\";\nimport LongText from \"../LongText.vue\";\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlMaskIcon24 } from \"../PlMaskIcon24\";\nimport { normalizeListOptions } from \"../../helpers/utils\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport { PlSvg } from \"../PlSvg\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\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 Placeholder text shown when no value is selected.\n /\n placeholder?: string;\n /\n Enables a button to clear the selected value (default: false)\n /\n clearable?: boolean;\n /\n If `true`, the dropdown component is marked as required.\n /\n required?: boolean;\n /\n If `true`, the dropdown component is disabled and cannot be interacted with.\n /\n disabled?: boolean;\n /\n Custom icon (16px) class for the dropdown arrow (optional)\n /\n arrowIcon?: string;\n /\n Custom icon (24px) class for the dropdown arrow (optional)\n /\n arrowIconLarge?: string;\n /\n Option list item size\n */\n optionSize?: \"small\" \| \"medium\";\n }>(),\n {\n label: \"\",\n helper: undefined,\n loadingOptionsHelper: undefined,\n error: undefined,\n placeholder: \"...\",\n clearable: false,\n required: false,\n disabled: false,\n arrowIcon: undefined,\n arrowIconLarge: undefined,\n optionSize: \"small\",\n options: undefined,\n },\n);\n\nconst slots = useSlots();\n\nconst root = ref<HTMLElement \| undefined>();\nconst list = ref<HTMLElement \| undefined>();\nconst input = ref<HTMLInputElement \| undefined>();\n\nconst data = reactive({\n search: \"\",\n activeIndex: -1,\n open: false,\n});\n\nconst findActiveIndex = () =>\n tap(\n filteredRef.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\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 computedError = computed(() => {\n if (isLoadingOptions.value) {\n return undefined;\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (props.modelValue !== undefined && selectedIndex.value === -1) {\n return \"The selected value is not one of the options\";\n }\n\n return undefined;\n});\n\nconst optionsRef = computed(() =>\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 textValue = computed(() => {\n const options = unref(optionsRef);\n\n const item: ListOption \| undefined = options.find((o) => deepEqual(o.value, props.modelValue));\n\n return item?.label \|\| props.modelValue; // @todo show inner value?\n});\n\n// Native tooltip with the full selected value; the value layer itself has\n// `pointer-events: none`, so the title goes on the field wrapper.\nconst fieldTitle = computed(() => {\n if (data.open) return undefined;\n const v = textValue.value;\n return v !== undefined && v !== null && v !== \"\" ? String(v) : undefined;\n});\n\nconst computedPlaceholder = computed(() => {\n if (!data.open && props.modelValue) {\n return \"\";\n }\n\n return props.modelValue ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n return props.modelValue !== undefined && props.modelValue !== null;\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 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 root?.value?.focus();\n};\n\nconst clear = () => emit(\"update:modelValue\", undefined);\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => (data.open = !data.open);\n\nconst onInputFocus = () => (data.open = true);\n\nconst onFocusOut = (event: FocusEvent) => {\n if (!root?.value?.contains(event.relatedTarget as Node \| null)) {\n data.search = \"\";\n data.open = false;\n }\n};\n\nconst scrollIntoActive = () => {\n const $list = list.value;\n\n if (!$list) {\n return;\n }\n\n tapIf($list.querySelector(\".hovered-item\") as HTMLElement, (opt) => {\n scrollIntoView($list, opt);\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 root.value?.focus();\n }\n\n const filtered = unref(filteredRef);\n\n const { length } = filtered;\n\n if (!length) {\n return;\n }\n\n if (e.code === \"Enter\") {\n selectOption(filtered.find((it) => it.index === activeIndex)?.value);\n }\n\n const localIndex = filtered.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 = filteredRef.value[newIndex].index ?? -1;\n};\n\nuseLabelNotch(root);\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 scrollIntoActive();\n }\n});\n</script>\n\n<template>\n <div class=\"ui-dropdown__envelope\" data-testid=\"pl-dropdown-legacy\">\n <div\n ref=\"root\"\n :tabindex=\"tabindex\"\n class=\"ui-dropdown\"\n data-testid=\"pl-dropdown-legacy-control\"\n :class=\"{ open: data.open, error, disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"ui-dropdown__container\">\n <div class=\"ui-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-legacy-input\"\n @focus=\"onInputFocus\"\n />\n\n <div v-if=\"!data.open\" data-testid=\"pl-dropdown-legacy-value\" @click=\"setFocusOnInput\">\n <LongText class=\"input-value\"> {{ textValue }} </LongText>\n </div>\n\n <div class=\"ui-dropdown__controls\">\n <PlMaskIcon24\n v-if=\"isLoadingOptions\"\n name=\"loading\"\n data-testid=\"pl-dropdown-legacy-loading\"\n />\n <PlIcon16\n v-if=\"clearable && hasValue\"\n class=\"clear\"\n data-testid=\"pl-dropdown-legacy-clear\"\n name=\"delete-clear\"\n @click.stop=\"clear\"\n />\n <slot name=\"append\" />\n <div\n v-if=\"arrowIconLarge\"\n class=\"arrow-icon\"\n data-testid=\"pl-dropdown-legacy-arrow\"\n :class=\"[`icon-24 ${arrowIconLarge}`]\"\n @click.stop=\"toggleOpen\"\n />\n <div\n v-else-if=\"arrowIcon\"\n class=\"arrow-icon\"\n data-testid=\"pl-dropdown-legacy-arrow\"\n :class=\"[`icon-16 ${arrowIcon}`]\"\n @click.stop=\"toggleOpen\"\n />\n <div\n v-else\n class=\"arrow-icon arrow-icon-default\"\n data-testid=\"pl-dropdown-legacy-arrow\"\n @click.stop=\"toggleOpen\"\n />\n </div>\n </div>\n <label v-if=\"label\" data-testid=\"pl-dropdown-legacy-label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" data-testid=\"pl-dropdown-legacy-required\" />\n <span>{{ label }}</span>\n <PlTooltip\n v-if=\"slots.tooltip\"\n class=\"info\"\n position=\"top\"\n data-testid=\"pl-dropdown-legacy-tooltip\"\n >\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <div\n v-if=\"data.open\"\n ref=\"list\"\n class=\"ui-dropdown__options\"\n data-testid=\"pl-dropdown-legacy-options\"\n >\n <DropdownListItem\n v-for=\"(item, index) in filteredRef\"\n :key=\"index\"\n :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n data-testid=\"pl-dropdown-legacy-option\"\n @click.stop=\"selectOption(item.value)\"\n />\n <div\n v-if=\"!filteredRef.length\"\n class=\"nothing-found\"\n data-testid=\"pl-dropdown-legacy-options-empty\"\n >\n Nothing found\n </div>\n </div>\n <DoubleContour class=\"ui-dropdown__contour\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"ui-dropdown__error\" data-testid=\"pl-dropdown-legacy-error\">\n {{ computedError }}\n </div>\n <div\n v-else-if=\"isLoadingOptions && loadingOptionsHelper\"\n class=\"ui-dropdown__helper\"\n data-testid=\"pl-dropdown-legacy-helper\"\n >\n {{ loadingOptionsHelper }}\n </div>\n <div v-else-if=\"helper\" class=\"ui-dropdown__helper\" data-testid=\"pl-dropdown-legacy-helper\">\n {{ helper }}\n </div>\n </div>\n</template>\n"],"mappings":"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"}
1	+ {"version":3,"file":"PlDropdownLegacy.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlDropdownLegacy/PlDropdownLegacy.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 \"./pl-dropdown-legacy.scss\";\nimport { computed, reactive, ref, unref, useSlots, watch, watchPostEffect } from \"vue\";\nimport { tap, tapIf } from \"../../helpers/functions\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport type { ListOption, ListOptionNormalized } from \"../../types\";\nimport { scrollIntoView } from \"../../helpers/dom\";\nimport { deepEqual } from \"../../helpers/objects\";\nimport DropdownListItem from \"../DropdownListItem.vue\";\nimport LongText from \"../LongText.vue\";\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlMaskIcon24 } from \"../PlMaskIcon24\";\nimport { normalizeListOptions } from \"../../helpers/utils\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport { PlSvg } from \"../PlSvg\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\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 Placeholder text shown when no value is selected.\n /\n placeholder?: string;\n /\n Enables a button to clear the selected value (default: false)\n /\n clearable?: boolean;\n /\n If `true`, the dropdown component is marked as required.\n /\n required?: boolean;\n /\n If `true`, the dropdown component is disabled and cannot be interacted with.\n /\n disabled?: boolean;\n /\n Custom icon (16px) class for the dropdown arrow (optional)\n /\n arrowIcon?: string;\n /\n Custom icon (24px) class for the dropdown arrow (optional)\n /\n arrowIconLarge?: string;\n /\n Option list item size\n */\n optionSize?: \"small\" \| \"medium\";\n }>(),\n {\n label: \"\",\n helper: undefined,\n loadingOptionsHelper: undefined,\n error: undefined,\n placeholder: \"...\",\n clearable: false,\n required: false,\n disabled: false,\n arrowIcon: undefined,\n arrowIconLarge: undefined,\n optionSize: \"small\",\n options: undefined,\n },\n);\n\nconst slots = useSlots();\n\nconst root = ref<HTMLElement \| undefined>();\nconst list = ref<HTMLElement \| undefined>();\nconst input = ref<HTMLInputElement \| undefined>();\n\nconst data = reactive({\n search: \"\",\n activeIndex: -1,\n open: false,\n});\n\nconst findActiveIndex = () =>\n tap(\n filteredRef.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\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 computedError = computed(() => {\n if (isLoadingOptions.value) {\n return undefined;\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (props.modelValue !== undefined && selectedIndex.value === -1) {\n return \"The selected value is not one of the options\";\n }\n\n return undefined;\n});\n\nconst optionsRef = computed(() =>\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 textValue = computed(() => {\n const options = unref(optionsRef);\n\n const item: ListOption \| undefined = options.find((o) => deepEqual(o.value, props.modelValue));\n\n return item?.label \|\| props.modelValue; // @todo show inner value?\n});\n\n// Native tooltip with the full selected value; the value layer itself has\n// `pointer-events: none`, so the title goes on the field wrapper.\nconst fieldTitle = computed(() => {\n if (data.open) return undefined;\n const v = textValue.value;\n return v !== undefined && v !== null && v !== \"\" ? String(v) : undefined;\n});\n\nconst computedPlaceholder = computed(() => {\n if (!data.open && props.modelValue) {\n return \"\";\n }\n\n return props.modelValue ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n return props.modelValue !== undefined && props.modelValue !== null;\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 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 root?.value?.focus();\n};\n\nconst clear = () => emit(\"update:modelValue\", undefined);\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => (data.open = !data.open);\n\nconst onInputFocus = () => (data.open = true);\n\nconst onFocusOut = (event: FocusEvent) => {\n if (!root?.value?.contains(event.relatedTarget as Node \| null)) {\n data.search = \"\";\n data.open = false;\n }\n};\n\nconst scrollIntoActive = () => {\n const $list = list.value;\n\n if (!$list) {\n return;\n }\n\n tapIf($list.querySelector(\".hovered-item\") as HTMLElement, (opt) => {\n scrollIntoView($list, opt);\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 root.value?.focus();\n }\n\n const filtered = unref(filteredRef);\n\n const { length } = filtered;\n\n if (!length) {\n return;\n }\n\n if (e.code === \"Enter\") {\n selectOption(filtered.find((it) => it.index === activeIndex)?.value);\n }\n\n const localIndex = filtered.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 = filteredRef.value[newIndex].index ?? -1;\n};\n\nuseLabelNotch(root);\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 scrollIntoActive();\n }\n});\n</script>\n\n<template>\n <div class=\"ui-dropdown__envelope\" data-testid=\"pl-dropdown-legacy\">\n <div\n ref=\"root\"\n :tabindex=\"tabindex\"\n class=\"ui-dropdown\"\n data-testid=\"pl-dropdown-legacy-control\"\n :class=\"{ open: data.open, error, disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"ui-dropdown__container\">\n <div class=\"ui-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-legacy-input\"\n @focus=\"onInputFocus\"\n />\n\n <div v-if=\"!data.open\" data-testid=\"pl-dropdown-legacy-value\" @click=\"setFocusOnInput\">\n <LongText class=\"input-value\"> {{ textValue }} </LongText>\n </div>\n\n <div class=\"ui-dropdown__controls\">\n <PlMaskIcon24\n v-if=\"isLoadingOptions\"\n name=\"loading\"\n data-testid=\"pl-dropdown-legacy-loading\"\n />\n <PlIcon16\n v-if=\"clearable && hasValue\"\n class=\"clear\"\n data-testid=\"pl-dropdown-legacy-clear\"\n name=\"delete-clear\"\n @click.stop=\"clear\"\n />\n <slot name=\"append\" />\n <div\n v-if=\"arrowIconLarge\"\n class=\"arrow-icon\"\n data-testid=\"pl-dropdown-legacy-arrow\"\n :class=\"[`icon-24 ${arrowIconLarge}`]\"\n @click.stop=\"toggleOpen\"\n />\n <div\n v-else-if=\"arrowIcon\"\n class=\"arrow-icon\"\n data-testid=\"pl-dropdown-legacy-arrow\"\n :class=\"[`icon-16 ${arrowIcon}`]\"\n @click.stop=\"toggleOpen\"\n />\n <div\n v-else\n class=\"arrow-icon arrow-icon-default\"\n data-testid=\"pl-dropdown-legacy-arrow\"\n @click.stop=\"toggleOpen\"\n />\n </div>\n </div>\n <label v-if=\"label\" data-testid=\"pl-dropdown-legacy-label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" data-testid=\"pl-dropdown-legacy-required\" />\n <span>{{ label }}</span>\n <PlTooltip\n v-if=\"slots.tooltip\"\n class=\"info\"\n position=\"top\"\n data-testid=\"pl-dropdown-legacy-tooltip\"\n >\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <div\n v-if=\"data.open\"\n ref=\"list\"\n class=\"ui-dropdown__options\"\n data-testid=\"pl-dropdown-legacy-options\"\n >\n <DropdownListItem\n v-for=\"(item, index) in filteredRef\"\n :key=\"index\"\n :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n data-testid=\"pl-dropdown-legacy-option\"\n @click.stop=\"selectOption(item.value)\"\n />\n <div\n v-if=\"!filteredRef.length\"\n class=\"nothing-found\"\n data-testid=\"pl-dropdown-legacy-options-empty\"\n >\n Nothing found\n </div>\n </div>\n <DoubleContour class=\"ui-dropdown__contour\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"ui-dropdown__error\" data-testid=\"pl-dropdown-legacy-error\">\n {{ computedError }}\n </div>\n <div\n v-else-if=\"isLoadingOptions && loadingOptionsHelper\"\n class=\"ui-dropdown__helper\"\n data-testid=\"pl-dropdown-legacy-helper\"\n >\n {{ loadingOptionsHelper }}\n </div>\n <div v-else-if=\"helper\" class=\"ui-dropdown__helper\" data-testid=\"pl-dropdown-legacy-helper\">\n {{ helper }}\n </div>\n </div>\n</template>\n"],"mappings":"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"}

package/dist/components/PlDropdownLine/PlDropdownLine.vue2.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import e from "../DropdownListItem.js";
+import { normalizeListOptions as e } from "../../helpers/utils.js";
 import { tap as t, tapIf as n } from "../../helpers/functions.js";
-import { normalizeListOptions as r } from "../../helpers/utils.js";
-import { useClickOutside as i } from "../../composition/useClickOutside.js";
+import { useClickOutside as r } from "../../composition/useClickOutside.js";
+import i from "../DropdownListItem.js";
 import { scrollIntoView as a } from "../../helpers/dom.js";
 import { deepEqual as o } from "../../helpers/objects.js";
 import { useElementPosition as ee } from "../../composition/usePosition.js";
@@ -51,8 +51,8 @@ var N = {
 			return R.isOpen && e.push("open"), L.disabled && e.push("disabled"), e.join(" ");
 		}), H = C(""), U = te(D(L, "options"), H), W = d(() => !!(L.clearable && R.isOpen && L.modelValue && G.value)), G = d(() => {
 			if (L.modelValue !== void 0) {
-				let e = J();
-				if (e !== -1) return r(L.options)[e].label;
+				let t = J();
+				if (t !== -1) return e(L.options)[t].label;
 			}
 			return "";
 		}), K = C(G.value);
@@ -60,7 +60,7 @@ var N = {
 			K.value = e;
 		});
 		let q = d(() => R.isOpen && H.value && H.value.length >= G.value.length - 1 ? H.value : G.value || "...");
-		i(z, () => {
+		r(z, () => {
 			L.mode === "list" && (R.isOpen = !1);
 		}), A(() => K.value, (e) => {
 			G.value === e ? H.value = "" : H.value = e;
@@ -132,7 +132,7 @@ var N = {
 		}), ee(z, (e) => {
 			let t = e.top + e.height + 2;
 			t + R.optionsHeight > e.clientHeight ? $.top = e.top - R.optionsHeight - 2 + "px" : $.top = t + "px", $.left = e.left + "px";
-		}), (t, n) => (x(), m("div", {
+		}), (e, t) => (x(), m("div", {
 			ref_key: "container",
 			ref: z,
 			tabindex: "0",
@@ -145,7 +145,7 @@ var N = {
 			h("div", N, E(L?.prefix), 1),
 			g(s, {
 				modelValue: K.value,
-				"onUpdate:modelValue": n[0] ||= (e) => K.value = e,
+				"onUpdate:modelValue": t[0] ||= (e) => K.value = e,
 				placeholder: q.value,
 				disabled: L.disabled,
 				class: "pl-line-dropdown__input"
@@ -171,28 +171,28 @@ var N = {
 				class: "pl-line-dropdown__items",
 				"data-testid": "pl-dropdown-line-options",
 				onFocusout: Z,
-				onClick: n[1] ||= M(() => {}, ["stop"])
-			}, [(x(!0), m(l, null, w(O(U), (n, r) => T(t.$slots, "item", {
-				key: r,
-				item: n,
+				onClick: t[1] ||= M(() => {}, ["stop"])
+			}, [(x(!0), m(l, null, w(O(U), (t, n) => T(e.$slots, "item", {
+				key: n,
+				item: t,
 				textItem: "text",
-				isSelected: X(n),
-				isHovered: R.activeOption == r,
-				onClick: M((e) => Y(n), ["stop"])
-			}, () => [g(e, {
-				option: n,
+				isSelected: X(t),
+				isHovered: R.activeOption == n,
+				onClick: M((e) => Y(t), ["stop"])
+			}, () => [g(i, {
+				option: t,
 				"text-item": "text",
-				"is-selected": X(n),
-				"is-hovered": R.activeOption == r,
+				"is-selected": X(t),
+				"is-hovered": R.activeOption == n,
 				size: "medium",
 				"data-testid": "pl-dropdown-line-option",
-				onClick: M((e) => Y(n), ["stop"])
+				onClick: M((e) => Y(t), ["stop"])
 			}, null, 8, [
 				"option",
 				"is-selected",
 				"is-hovered",
 				"onClick"
-			])])), 128)), O(U).length === 0 ? (x(), m("div", ie, [...n[3] ||= [h("div", { class: "pl-line-dropdown__no-item-title text-s" }, " Didn't find anything that matched ", -1)]])) : p("", !0)], 36)) : L.mode === "tabs" ? (x(), m("div", {
+			])])), 128)), O(U).length === 0 ? (x(), m("div", ie, [...t[3] ||= [h("div", { class: "pl-line-dropdown__no-item-title text-s" }, " Didn't find anything that matched ", -1)]])) : p("", !0)], 36)) : L.mode === "tabs" ? (x(), m("div", {
 				key: 1,
 				ref_key: "list",
 				ref: B,
@@ -201,25 +201,25 @@ var N = {
 				class: "pl-line-dropdown__items-tabs",
 				"data-testid": "pl-dropdown-line-options",
 				onFocusout: Z,
-				onClick: n[2] ||= M(() => {}, ["stop"])
-			}, [(x(!0), m(l, null, w(O(U), (e, n) => T(t.$slots, "item", {
+				onClick: t[2] ||= M(() => {}, ["stop"])
+			}, [(x(!0), m(l, null, w(O(U), (t, n) => T(e.$slots, "item", {
 				key: n,
-				item: e,
-				isSelected: X(e),
+				item: t,
+				isSelected: X(t),
 				isHovered: R.activeOption == n,
-				onClick: M((t) => Y(e), ["stop"])
+				onClick: M((e) => Y(t), ["stop"])
 			}, () => [g(c, {
-				option: e,
-				"is-selected": X(e),
+				option: t,
+				"is-selected": X(t),
 				"is-hovered": R.activeOption == n,
 				"data-testid": "pl-dropdown-line-option",
-				onClick: M((t) => Y(e), ["stop"])
+				onClick: M((e) => Y(t), ["stop"])
 			}, null, 8, [
 				"option",
 				"is-selected",
 				"is-hovered",
 				"onClick"
-			])])), 128)), O(U).length === 0 ? (x(), m("div", P, [...n[4] ||= [h("div", { class: "pl-line-dropdown__no-item-title text-s" }, " Didn't find anything that matched ", -1)]])) : p("", !0)], 36)) : p("", !0)])) : p("", !0)
+			])])), 128)), O(U).length === 0 ? (x(), m("div", P, [...t[4] ||= [h("div", { class: "pl-line-dropdown__no-item-title text-s" }, " Didn't find anything that matched ", -1)]])) : p("", !0)], 36)) : p("", !0)])) : p("", !0)
 		], 34));
 	}
 });

package/dist/components/PlDropdownMulti/PlDropdownMulti.vue2.js CHANGED Viewed

@@ -1,10 +1,10 @@
-import e from "../DropdownListItem.js";
+import e from "../PlSvg/PlSvg.js";
+import "../PlSvg/index.js";
 import { normalizeListOptions as t } from "../../helpers/utils.js";
 import n from "../PlTooltip/PlTooltip.js";
 import "../PlTooltip/index.js";
-import { getErrorMessage as r } from "../../helpers/error.js";
-import i from "../PlSvg/PlSvg.js";
-import "../PlSvg/index.js";
+import r from "../DropdownListItem.js";
+import { getErrorMessage as i } from "../../helpers/error.js";
 import a from "../PlIcon24/PlIcon24.js";
 import "../PlIcon24/index.js";
 import o from "../../utils/DoubleContour.js";
@@ -176,7 +176,7 @@ var ce = ["tabindex"], le = { class: "pl-dropdown-multi__container" }, ue = { cl
 				])
 			]),
 			y.label ? (x(), g("label", A, [
-				y.required ? (x(), m(D(i), {
+				y.required ? (x(), m(D(e), {
 					key: 0,
 					uri: D(ee),
 					"data-testid": "pl-dropdown-multi-required"
@@ -215,16 +215,16 @@ var ce = ["tabindex"], le = { class: "pl-dropdown-multi__container" }, ue = { cl
 						default: O(() => [v(E(e.label), 1)]),
 						_: 2
 					}, 1032, ["class", "onClose"]))), 128))]),
-					(x(!0), g(f, null, w(q.value, (t, n) => (x(), m(e, {
-						key: n,
-						option: t,
+					(x(!0), g(f, null, w(q.value, (e, t) => (x(), m(r, {
+						key: t,
+						option: e,
 						"text-item": "text",
-						"is-selected": t.selected,
-						"is-hovered": U.activeOption == n,
+						"is-selected": e.selected,
+						"is-hovered": U.activeOption == t,
 						size: "medium",
 						"use-checkbox": "",
 						"data-testid": "pl-dropdown-multi-option",
-						onClick: k((e) => X(t.value), ["stop"])
+						onClick: k((t) => X(e.value), ["stop"])
 					}, null, 8, [
 						"option",
 						"is-selected",
@@ -239,7 +239,7 @@ var ce = ["tabindex"], le = { class: "pl-dropdown-multi__container" }, ue = { cl
 				class: "pl-dropdown-multi__contour",
 				"group-position": y.groupPosition
 			}, null, 8, ["group-position"])
-		])], 42, ce), y.error ? (x(), g("div", N, E(D(r)(y.error)), 1)) : y.helper ? (x(), g("div", P, E(y.helper), 1)) : h("", !0)]));
+		])], 42, ce), y.error ? (x(), g("div", N, E(D(i)(y.error)), 1)) : y.helper ? (x(), g("div", P, E(y.helper), 1)) : h("", !0)]));
 	}
 });
 //#endregion

package/dist/components/PlDropdownMultiRef/PlDropdownMultiRef.vue.d.ts CHANGED Viewed

@@ -61,8 +61,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
     label: string;
     error: undefined;
     modelValue: ModelRef[] | undefined;
-    required: boolean;
     disabled: boolean;
+    required: boolean;
     helper: string;
     placeholder: string;
     missingValueLabel: string;

package/dist/components/PlDropdownMultiRef/PlDropdownMultiRef.vue.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlDropdownMultiRef.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlDropdownMultiRef/PlDropdownMultiRef.vue"],"names":[],"mappings":"AA2FA,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAevD,KAAK,WAAW,GAAG;IACf;;OAEG;IACH,UAAU,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAC;IACnC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,QAAQ,CAAC,SAAS,EAAE,CAAC,CAAC;IAChC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AA6FJ,QAAA,IAAI,QAAQ,IAAY,CAAE;AAC1B,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAKhD,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;aA9HF,QAAQ,CAAC,SAAS,EAAE,CAAC;WAJvB,MAAM;;gBAJF,QAAQ,EAAE,GAAG,SAAS;~~cA6BvB~~,OAAO;~~cAIP~~,OAAO;~~YArBT~~,MAAM;iBAQD,MAAM;uBAKA,MAAM;6EAiH5B,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
1	+ {"version":3,"file":"PlDropdownMultiRef.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlDropdownMultiRef/PlDropdownMultiRef.vue"],"names":[],"mappings":"AA2FA,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAevD,KAAK,WAAW,GAAG;IACf;;OAEG;IACH,UAAU,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAC;IACnC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,QAAQ,CAAC,SAAS,EAAE,CAAC,CAAC;IAChC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AA6FJ,QAAA,IAAI,QAAQ,IAAY,CAAE;AAC1B,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAKhD,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;aA9HF,QAAQ,CAAC,SAAS,EAAE,CAAC;WAJvB,MAAM;;gBAJF,QAAQ,EAAE,GAAG,SAAS;cAiCvB,OAAO;cAJP,OAAO;YAjBT,MAAM;iBAQD,MAAM;uBAKA,MAAM;6EAiH5B,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/components/PlElementList/PlElementListItem.vue2.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import e from "../PlIcon24/PlIcon24.js";
-import "../PlIcon24/index.js";
-import t from "../PlIcon16/PlIcon16.js";
+import e from "../PlIcon16/PlIcon16.js";
 import "../PlIcon16/index.js";
+import t from "../PlIcon24/PlIcon24.js";
+import "../PlIcon24/index.js";
 import { computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, normalizeClass as l, openBlock as u, renderSlot as d, unref as f, useSlots as p, withModifiers as m } from "vue";
 //#region src/components/PlElementList/PlElementListItem.vue?vue&type=script&setup=true&lang.ts
 var h = ["data-draggable"], g = /* @__PURE__ */ c({
@@ -79,7 +79,7 @@ var h = ["data-draggable"], g = /* @__PURE__ */ c({
 						{ [n.$style.disable]: !_.isDraggable }
 					]),
 					"data-draggable": _.isDraggable
-				}, [s(f(t), { name: "drag-dots" })], 10, h)) : i("", !0), c.isExpandable ? (u(), r(f(t), {
+				}, [s(f(e), { name: "drag-dots" })], 10, h)) : i("", !0), c.isExpandable ? (u(), r(f(e), {
 					key: 1,
 					"data-testid": "pl-element-list-item-expand",
 					class: l([n.$style.contentChevron, { [n.$style.opened]: _.isExpanded }]),
@@ -105,7 +105,7 @@ var h = ["data-draggable"], g = /* @__PURE__ */ c({
 							{ [n.$style.disable]: !_.isToggable }
 						]),
 						onClick: p[0] ||= m((e) => S("toggle", _.item, _.index), ["stop"])
-					}, [s(f(e), {
+					}, [s(f(t), {
 						name: _.isToggled === !0 ? "view-hide" : "view-show",
 						size: "16"
 					}, null, 8, ["name"])], 2)) : i("", !0),
@@ -121,7 +121,7 @@ var h = ["data-draggable"], g = /* @__PURE__ */ c({
 							}
 						]),
 						onClick: p[1] ||= m((e) => S("pin", _.item, _.index), ["stop"])
-					}, [s(f(e), {
+					}, [s(f(t), {
 						name: "pin",
 						size: "16"
 					})], 2)) : i("", !0),
@@ -130,7 +130,7 @@ var h = ["data-draggable"], g = /* @__PURE__ */ c({
 						"data-testid": "pl-element-list-item-remove",
 						class: l([n.$style.action, n.$style.clickable]),
 						onClick: p[2] ||= m((e) => S("remove", _.item, _.index), ["stop"])
-					}, [s(f(t), { name: "close" })], 2)) : i("", !0)
+					}, [s(f(e), { name: "close" })], 2)) : i("", !0)
 				], 2)
 			], 2), y.value && _.isExpanded ? (u(), a("div", {
 				key: 0,

package/dist/components/PlFileDialog/Remote.vue2.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { useEventListener as e } from "../../composition/useEventListener.js";
 import t from "../PlIcon16/PlIcon16.js";
-import "../PlMaskIcon16/index.js";
 import "../PlIcon16/index.js";
+import "../PlMaskIcon16/index.js";
 import n from "../PlDropdown/PlDropdown.js";
 import "../PlDropdown/index.js";
 import r from "../PlSearchField/PlSearchField.js";

package/dist/components/PlFileInput/PlFileInput.vue2.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import e from "../PlTooltip/PlTooltip.js";
-import "../PlTooltip/index.js";
-import { getErrorMessage as t } from "../../helpers/error.js";
-import n from "../PlSvg/PlSvg.js";
+import e from "../PlSvg/PlSvg.js";
 import "../PlSvg/index.js";
+import t from "../PlTooltip/PlTooltip.js";
+import "../PlTooltip/index.js";
+import { getErrorMessage as n } from "../../helpers/error.js";
 import r from "../PlIcon24/PlIcon24.js";
 import i from "../../utils/DoubleContour.js";
 import { useLabelNotch as a } from "../../utils/useLabelNotch.js";
@@ -13,7 +13,7 @@ import "../PlFileDialog/index.js";
 import './pl-file-input.css';/* empty css              */
 import { Fragment as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createTextVNode as m, createVNode as h, defineComponent as g, normalizeClass as _, normalizeStyle as v, openBlock as y, reactive as b, ref as x, renderSlot as S, toDisplayString as C, unref as w, useSlots as T, watch as E, withCtx as D, withKeys as O, withModifiers as k } from "vue";
 import { prettyBytes as A } from "@milaboratories/helpers";
-import { getFileNameFromHandle as ee, getFilePathFromHandle as j } from "@platforma-sdk/model";
+import { getFileNameFromHandle as j, getFilePathFromHandle as ee } from "@platforma-sdk/model";
 //#region src/components/PlFileInput/PlFileInput.vue?vue&type=script&setup=true&lang.ts
 var M = {
 	key: 0,
@@ -64,7 +64,7 @@ var M = {
 			} catch (t) {
 				return R.error = t instanceof Error ? t.message : String(t), e;
 			}
-		}, U = l(() => H(V.modelValue, ee)), W = l(() => H(V.modelValue, j)), G = l(() => V.progress && !V.progress.done), K = l(() => V.progress && V.progress.done), q = l(() => t(R.error, V.error)), J = l(() => typeof q.value == "string"), Y = l(() => {
+		}, U = l(() => H(V.modelValue, j)), W = l(() => H(V.modelValue, ee)), G = l(() => V.progress && !V.progress.done), K = l(() => V.progress && V.progress.done), q = l(() => n(R.error, V.error)), J = l(() => typeof q.value == "string"), Y = l(() => {
 			let { status: e, done: t } = V.progress ?? {};
 			return !e || !e.bytesTotal ? "" : e.bytesProcessed && !t ? A(e.bytesProcessed, {}) + " / " + A(e.bytesTotal, {}) : A(e.bytesTotal, {});
 		}), X = l(() => {
@@ -77,7 +77,7 @@ var M = {
 		}, te = () => B("update:modelValue", void 0);
 		E(() => V.modelValue, () => R.error = void 0, { immediate: !0 });
 		let $ = x();
-		return V.cellStyle || a($), (t, a) => (y(), f("div", {
+		return V.cellStyle || a($), (n, a) => (y(), f("div", {
 			class: _([{
 				"pl-file-input__cell-style": !!g.cellStyle,
 				"has-file": !!U.value
@@ -102,19 +102,19 @@ var M = {
 					"data-testid": "pl-file-input-progress"
 				}, null, 4),
 				!g.cellStyle && g.label ? (y(), f("label", M, [
-					g.required ? (y(), u(w(n), {
+					g.required ? (y(), u(w(e), {
 						key: 0,
 						uri: w(o),
 						"data-testid": "pl-file-input-required"
 					}, null, 8, ["uri"])) : d("", !0),
 					p("span", null, C(g.label), 1),
-					w(z).tooltip || W.value ? (y(), u(w(e), {
+					w(z).tooltip || W.value ? (y(), u(w(t), {
 						key: 1,
 						class: "info",
 						position: "top",
 						"data-testid": "pl-file-input-tooltip"
 					}, {
-						tooltip: D(() => [w(z).tooltip ? S(t.$slots, "tooltip", { key: 0 }) : (y(), f(c, { key: 1 }, [m(C(W.value), 1)], 64))]),
+						tooltip: D(() => [w(z).tooltip ? S(n.$slots, "tooltip", { key: 0 }) : (y(), f(c, { key: 1 }, [m(C(W.value), 1)], 64))]),
 						_: 3
 					})) : d("", !0)
 				], 512)) : d("", !0),

package/dist/components/PlFileInput/PlFileInput.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlFileInput.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlFileInput/PlFileInput.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport \"./pl-file-input.scss\";\n\nimport { prettyBytes } from \"@milaboratories/helpers\";\nimport type { ImportFileHandle, ImportProgress } from \"@platforma-sdk/model\";\nimport { getFileNameFromHandle, getFilePathFromHandle } from \"@platforma-sdk/model\";\nimport { computed, reactive, ref, useSlots, watch } from \"vue\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport type { ImportedFiles } from \"../../types\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport { PlFileDialog } from \"../PlFileDialog\";\nimport { PlMaskIcon24 } from \"../PlMaskIcon24\";\nimport { PlTooltip } from \"../PlTooltip\";\n\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\nimport { PlSvg } from \"../PlSvg\";\n\nconst data = reactive({\n fileDialogOpen: false,\n error: undefined as undefined \| string,\n});\n\nconst slots = useSlots();\n\nconst emit = defineEmits<{\n (e: \"update:modelValue\", value: ImportFileHandle \| undefined): void;\n}>();\n\nconst props = withDefaults(\n defineProps<{\n /*\n The current import file handle.\n /\n modelValue: ImportFileHandle \| undefined;\n /\n The label to display above the input field.\n /\n label?: string;\n /\n If `true`, the input field is marked as required.\n /\n required?: boolean;\n /\n If `true`, the component border is dashed.\n /\n dashed?: boolean;\n /\n Allowed file extensions (should start with `.`)\n /\n extensions?: string[];\n /\n Placeholder text\n /\n placeholder?: string;\n /\n Import/Upload progress\n /\n progress?: ImportProgress;\n /\n An error message to display below the input field.\n /\n error?: unknown;\n /\n A helper text to display below the input field when there are no errors.\n /\n helper?: string;\n /\n Remove rounded border and change styles\n /\n cellStyle?: boolean;\n /\n File dialog title\n /\n fileDialogTitle?: string;\n /\n If `true`, the file dialog window closes when clicking outside the modal area (default: `true`)\n /\n fileDialogCloseOnOutsideClick?: boolean;\n }>(),\n {\n label: undefined,\n extensions: undefined,\n fileDialogTitle: undefined,\n placeholder: undefined,\n progress: undefined,\n error: undefined,\n helper: undefined,\n cellStyle: false,\n fileDialogCloseOnOutsideClick: true,\n },\n);\n\nconst tryValue = <T extends ImportFileHandle>(\n v: T \| undefined,\n cb: (v: T) => string \| undefined,\n) => {\n if (!v) {\n return undefined;\n }\n\n try {\n return cb(v);\n } catch (err) {\n data.error = err instanceof Error ? err.message : String(err);\n return v;\n }\n};\n\nconst fileName = computed(() => tryValue(props.modelValue, getFileNameFromHandle));\n\nconst filePath = computed(() => tryValue(props.modelValue, getFilePathFromHandle));\n\nconst isUploading = computed(() => props.progress && !props.progress.done);\n\nconst isUploaded = computed(() => props.progress && props.progress.done);\n\nconst computedErrorMessage = computed(() => getErrorMessage(data.error, props.error));\n\nconst hasErrors = computed(() => typeof computedErrorMessage.value === \"string\");\n\nconst uploadStats = computed(() => {\n const { status, done } = props.progress ?? {};\n\n if (!status \|\| !status.bytesTotal) {\n return \"\";\n }\n\n if (status.bytesProcessed && !done) {\n return prettyBytes(status.bytesProcessed, {}) + \" / \" + prettyBytes(status.bytesTotal, {});\n }\n\n return prettyBytes(status.bytesTotal, {});\n});\n\nconst progressStyle = computed(() => {\n const { progress } = props;\n\n if (!progress) {\n return {};\n }\n\n return {\n width: progress.done ? \"100%\" : Math.round((progress.status?.progress ?? 0) 100) + \"%\",\n };\n});\n\nconst openFileDialog = () => {\n data.fileDialogOpen = true;\n};\n\nconst onImport = (v: ImportedFiles) => {\n if (v.files.length) {\n emit(\"update:modelValue\", v.files[0]);\n }\n};\n\nconst clear = () => emit(\"update:modelValue\", undefined);\n\nwatch(\n () => props.modelValue,\n () => (data.error = undefined),\n { immediate: true },\n);\n\nconst rootRef = ref();\n\nif (!props.cellStyle) {\n useLabelNotch(rootRef);\n}\n</script>\n\n<template>\n <div\n :class=\"{ 'pl-file-input__cell-style': !!cellStyle, 'has-file': !!fileName }\"\n class=\"pl-file-input__envelope\"\n data-testid=\"pl-file-input\"\n >\n <div\n ref=\"rootRef\"\n :class=\"{ dashed, error: hasErrors }\"\n class=\"pl-file-input\"\n data-testid=\"pl-file-input-control\"\n tabindex=\"0\"\n @keyup.enter=\"openFileDialog\"\n @click.stop=\"openFileDialog\"\n >\n <div\n :style=\"progressStyle\"\n class=\"pl-file-input__progress\"\n data-testid=\"pl-file-input-progress\"\n />\n <label v-if=\"!cellStyle && label\" ref=\"label\" data-testid=\"pl-file-input-label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" data-testid=\"pl-file-input-required\" />\n <span>{{ label }}</span>\n <PlTooltip\n v-if=\"slots.tooltip \|\| filePath\"\n class=\"info\"\n position=\"top\"\n data-testid=\"pl-file-input-tooltip\"\n >\n <template #tooltip>\n <slot v-if=\"slots.tooltip\" name=\"tooltip\" />\n <template v-else>{{ filePath }}</template>\n </template>\n </PlTooltip>\n </label>\n <PlMaskIcon24 v-if=\"hasErrors\" name=\"restart\" data-testid=\"pl-file-input-status-icon\" />\n <PlMaskIcon24\n v-else-if=\"isUploading\"\n name=\"cloud-upload\"\n data-testid=\"pl-file-input-status-icon\"\n />\n <PlMaskIcon24 v-else-if=\"isUploaded\" name=\"success\" data-testid=\"pl-file-input-status-icon\" />\n <PlMaskIcon24 v-else name=\"paper-clip\" data-testid=\"pl-file-input-status-icon\" />\n <div\n :data-placeholder=\"placeholder ?? 'Choose file'\"\n class=\"pl-file-input__filename\"\n data-testid=\"pl-file-input-filename\"\n >\n {{ fileName }}\n </div>\n <div v-if=\"uploadStats\" class=\"pl-file-input__stats\" data-testid=\"pl-file-input-stats\">\n {{ uploadStats }}\n </div>\n <PlMaskIcon24\n v-if=\"modelValue\"\n class=\"pl-file-input__clear\"\n data-testid=\"pl-file-input-clear\"\n name=\"close\"\n @click.stop=\"clear\"\n />\n <DoubleContour class=\"pl-file-input__contour\" />\n </div>\n <div v-if=\"hasErrors\" class=\"pl-file-input__error\" data-testid=\"pl-file-input-error\">\n {{ computedErrorMessage }}\n </div>\n <div v-else-if=\"helper\" class=\"pl-file-input__helper\" data-testid=\"pl-file-input-helper\">\n {{ helper }}\n </div>\n <!-- Teleported to <body> by PlDialogModal; kept inside so the component has a single root. -->\n <PlFileDialog\n v-model=\"data.fileDialogOpen\"\n :close-on-outside-click=\"fileDialogCloseOnOutsideClick\"\n :extensions=\"extensions\"\n :title=\"fileDialogTitle\"\n @import:files=\"onImport\"\n />\n </div>\n</template>\n"],"mappings":"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"}
1	+ {"version":3,"file":"PlFileInput.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlFileInput/PlFileInput.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport \"./pl-file-input.scss\";\n\nimport { prettyBytes } from \"@milaboratories/helpers\";\nimport type { ImportFileHandle, ImportProgress } from \"@platforma-sdk/model\";\nimport { getFileNameFromHandle, getFilePathFromHandle } from \"@platforma-sdk/model\";\nimport { computed, reactive, ref, useSlots, watch } from \"vue\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport type { ImportedFiles } from \"../../types\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport { PlFileDialog } from \"../PlFileDialog\";\nimport { PlMaskIcon24 } from \"../PlMaskIcon24\";\nimport { PlTooltip } from \"../PlTooltip\";\n\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\nimport { PlSvg } from \"../PlSvg\";\n\nconst data = reactive({\n fileDialogOpen: false,\n error: undefined as undefined \| string,\n});\n\nconst slots = useSlots();\n\nconst emit = defineEmits<{\n (e: \"update:modelValue\", value: ImportFileHandle \| undefined): void;\n}>();\n\nconst props = withDefaults(\n defineProps<{\n /*\n The current import file handle.\n /\n modelValue: ImportFileHandle \| undefined;\n /\n The label to display above the input field.\n /\n label?: string;\n /\n If `true`, the input field is marked as required.\n /\n required?: boolean;\n /\n If `true`, the component border is dashed.\n /\n dashed?: boolean;\n /\n Allowed file extensions (should start with `.`)\n /\n extensions?: string[];\n /\n Placeholder text\n /\n placeholder?: string;\n /\n Import/Upload progress\n /\n progress?: ImportProgress;\n /\n An error message to display below the input field.\n /\n error?: unknown;\n /\n A helper text to display below the input field when there are no errors.\n /\n helper?: string;\n /\n Remove rounded border and change styles\n /\n cellStyle?: boolean;\n /\n File dialog title\n /\n fileDialogTitle?: string;\n /\n If `true`, the file dialog window closes when clicking outside the modal area (default: `true`)\n /\n fileDialogCloseOnOutsideClick?: boolean;\n }>(),\n {\n label: undefined,\n extensions: undefined,\n fileDialogTitle: undefined,\n placeholder: undefined,\n progress: undefined,\n error: undefined,\n helper: undefined,\n cellStyle: false,\n fileDialogCloseOnOutsideClick: true,\n },\n);\n\nconst tryValue = <T extends ImportFileHandle>(\n v: T \| undefined,\n cb: (v: T) => string \| undefined,\n) => {\n if (!v) {\n return undefined;\n }\n\n try {\n return cb(v);\n } catch (err) {\n data.error = err instanceof Error ? err.message : String(err);\n return v;\n }\n};\n\nconst fileName = computed(() => tryValue(props.modelValue, getFileNameFromHandle));\n\nconst filePath = computed(() => tryValue(props.modelValue, getFilePathFromHandle));\n\nconst isUploading = computed(() => props.progress && !props.progress.done);\n\nconst isUploaded = computed(() => props.progress && props.progress.done);\n\nconst computedErrorMessage = computed(() => getErrorMessage(data.error, props.error));\n\nconst hasErrors = computed(() => typeof computedErrorMessage.value === \"string\");\n\nconst uploadStats = computed(() => {\n const { status, done } = props.progress ?? {};\n\n if (!status \|\| !status.bytesTotal) {\n return \"\";\n }\n\n if (status.bytesProcessed && !done) {\n return prettyBytes(status.bytesProcessed, {}) + \" / \" + prettyBytes(status.bytesTotal, {});\n }\n\n return prettyBytes(status.bytesTotal, {});\n});\n\nconst progressStyle = computed(() => {\n const { progress } = props;\n\n if (!progress) {\n return {};\n }\n\n return {\n width: progress.done ? \"100%\" : Math.round((progress.status?.progress ?? 0) 100) + \"%\",\n };\n});\n\nconst openFileDialog = () => {\n data.fileDialogOpen = true;\n};\n\nconst onImport = (v: ImportedFiles) => {\n if (v.files.length) {\n emit(\"update:modelValue\", v.files[0]);\n }\n};\n\nconst clear = () => emit(\"update:modelValue\", undefined);\n\nwatch(\n () => props.modelValue,\n () => (data.error = undefined),\n { immediate: true },\n);\n\nconst rootRef = ref();\n\nif (!props.cellStyle) {\n useLabelNotch(rootRef);\n}\n</script>\n\n<template>\n <div\n :class=\"{ 'pl-file-input__cell-style': !!cellStyle, 'has-file': !!fileName }\"\n class=\"pl-file-input__envelope\"\n data-testid=\"pl-file-input\"\n >\n <div\n ref=\"rootRef\"\n :class=\"{ dashed, error: hasErrors }\"\n class=\"pl-file-input\"\n data-testid=\"pl-file-input-control\"\n tabindex=\"0\"\n @keyup.enter=\"openFileDialog\"\n @click.stop=\"openFileDialog\"\n >\n <div\n :style=\"progressStyle\"\n class=\"pl-file-input__progress\"\n data-testid=\"pl-file-input-progress\"\n />\n <label v-if=\"!cellStyle && label\" ref=\"label\" data-testid=\"pl-file-input-label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" data-testid=\"pl-file-input-required\" />\n <span>{{ label }}</span>\n <PlTooltip\n v-if=\"slots.tooltip \|\| filePath\"\n class=\"info\"\n position=\"top\"\n data-testid=\"pl-file-input-tooltip\"\n >\n <template #tooltip>\n <slot v-if=\"slots.tooltip\" name=\"tooltip\" />\n <template v-else>{{ filePath }}</template>\n </template>\n </PlTooltip>\n </label>\n <PlMaskIcon24 v-if=\"hasErrors\" name=\"restart\" data-testid=\"pl-file-input-status-icon\" />\n <PlMaskIcon24\n v-else-if=\"isUploading\"\n name=\"cloud-upload\"\n data-testid=\"pl-file-input-status-icon\"\n />\n <PlMaskIcon24 v-else-if=\"isUploaded\" name=\"success\" data-testid=\"pl-file-input-status-icon\" />\n <PlMaskIcon24 v-else name=\"paper-clip\" data-testid=\"pl-file-input-status-icon\" />\n <div\n :data-placeholder=\"placeholder ?? 'Choose file'\"\n class=\"pl-file-input__filename\"\n data-testid=\"pl-file-input-filename\"\n >\n {{ fileName }}\n </div>\n <div v-if=\"uploadStats\" class=\"pl-file-input__stats\" data-testid=\"pl-file-input-stats\">\n {{ uploadStats }}\n </div>\n <PlMaskIcon24\n v-if=\"modelValue\"\n class=\"pl-file-input__clear\"\n data-testid=\"pl-file-input-clear\"\n name=\"close\"\n @click.stop=\"clear\"\n />\n <DoubleContour class=\"pl-file-input__contour\" />\n </div>\n <div v-if=\"hasErrors\" class=\"pl-file-input__error\" data-testid=\"pl-file-input-error\">\n {{ computedErrorMessage }}\n </div>\n <div v-else-if=\"helper\" class=\"pl-file-input__helper\" data-testid=\"pl-file-input-helper\">\n {{ helper }}\n </div>\n <!-- Teleported to <body> by PlDialogModal; kept inside so the component has a single root. -->\n <PlFileDialog\n v-model=\"data.fileDialogOpen\"\n :close-on-outside-click=\"fileDialogCloseOnOutsideClick\"\n :extensions=\"extensions\"\n :title=\"fileDialogTitle\"\n @import:files=\"onImport\"\n />\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkBA,IAAM,IAAO,EAAS;GACpB,gBAAgB;GAChB,OAAO,KAAA;GACR,CAAC,EAEI,IAAQ,GAAU,EAElB,IAAO,GAIP,IAAQ,GAgER,KACJ,GACA,MACG;AACE,SAIL,KAAI;AACF,WAAO,EAAG,EAAE;YACL,GAAK;AAEZ,WADA,EAAK,QAAQ,aAAe,QAAQ,EAAI,UAAU,OAAO,EAAI,EACtD;;KAIL,IAAW,QAAe,EAAS,EAAM,YAAY,EAAsB,CAAC,EAE5E,IAAW,QAAe,EAAS,EAAM,YAAY,GAAsB,CAAC,EAE5E,IAAc,QAAe,EAAM,YAAY,CAAC,EAAM,SAAS,KAAK,EAEpE,IAAa,QAAe,EAAM,YAAY,EAAM,SAAS,KAAK,EAElE,IAAuB,QAAe,EAAgB,EAAK,OAAO,EAAM,MAAM,CAAC,EAE/E,IAAY,QAAe,OAAO,EAAqB,SAAU,SAAS,EAE1E,IAAc,QAAe;GACjC,IAAM,EAAE,WAAQ,YAAS,EAAM,YAAY,EAAE;AAU7C,UARI,CAAC,KAAU,CAAC,EAAO,aACd,KAGL,EAAO,kBAAkB,CAAC,IACrB,EAAY,EAAO,gBAAgB,EAAE,CAAC,GAAG,QAAQ,EAAY,EAAO,YAAY,EAAE,CAAC,GAGrF,EAAY,EAAO,YAAY,EAAE,CAAC;IACzC,EAEI,IAAgB,QAAe;GACnC,IAAM,EAAE,gBAAa;AAMrB,UAJK,IAIE,EACL,OAAO,EAAS,OAAO,SAAS,KAAK,OAAO,EAAS,QAAQ,YAAY,KAAK,IAAI,GAAG,KACtF,GALQ,EAAE;IAMX,EAEI,UAAuB;AAC3B,KAAK,iBAAiB;KAGlB,KAAY,MAAqB;AACrC,GAAI,EAAE,MAAM,UACV,EAAK,qBAAqB,EAAE,MAAM,GAAG;KAInC,WAAc,EAAK,qBAAqB,KAAA,EAAU;AAExD,UACQ,EAAM,kBACL,EAAK,QAAQ,KAAA,GACpB,EAAE,WAAW,IAAM,CACpB;EAED,IAAM,IAAU,GAAK;SAEhB,EAAM,aACT,EAAc,EAAQ,kBAKtB,EA2EM,OAAA;GA1EH,OAAK,EAAA,CAAA;IAAA,6BAAA,CAAA,CAAmC,EAAA;IAAS,YAAA,CAAA,CAAgB,EAAA;IAAQ,EACpE,0BAAyB,CAAA;GAC/B,eAAY;;GAEZ,EAuDM,OAAA;aAtDA;IAAJ,KAAI;IACH,OAAK,EAAA,CAAA;KAAA,QAAI,EAAA;KAAM,OAAS,EAAA;KAAS,EAC5B,gBAAe,CAAA;IACrB,eAAY;IACZ,UAAS;IACR,SAAK,EAAQ,GAAc,CAAA,QAAA,CAAA;IAC3B,SAAK,EAAO,GAAc,CAAA,OAAA,CAAA;;IAE3B,EAIE,OAAA;KAHC,OAAK,EAAE,EAAA,MAAa;KACrB,OAAM;KACN,eAAY;;KAEA,EAAA,aAAa,EAAA,SAAA,GAAA,EAA3B,EAcQ,SAdR,GAcQ;KAbO,EAAA,YAAA,GAAA,EAAb,EAAiF,EAAA,EAAA,EAAA;;MAAzD,KAAK,EAAA,EAAW;MAAE,eAAY;;KACtD,EAAwB,QAAA,MAAA,EAAf,EAAA,MAAK,EAAA,EAAA;KAEN,EAAA,EAAK,CAAC,WAAW,EAAA,SAAA,GAAA,EADzB,EAUY,EAAA,EAAA,EAAA;;MARV,OAAM;MACN,UAAS;MACT,eAAY;;MAED,SAAO,QAC4B,CAAhC,EAAA,EAAK,CAAC,UAAlB,EAA4C,EAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,IAAA,GAAA,EAC5C,EAA0C,GAAA,EAAA,KAAA,GAAA,EAAA,CAAA,EAAA,EAAtB,EAAA,MAAQ,EAAA,EAAA,CAAA,EAAA,GAAA,EAAA,CAAA;;;;IAId,EAAA,SAAA,GAAA,EAApB,EAAwF,EAAA,EAAA,EAAA;;KAAzD,MAAK;KAAU,eAAY;UAE7C,EAAA,SAAA,GAAA,EADb,EAIE,EAAA,EAAA,EAAA;;KAFA,MAAK;KACL,eAAY;UAEW,EAAA,SAAA,GAAA,EAAzB,EAA8F,EAAA,EAAA,EAAA;;KAAzD,MAAK;KAAU,eAAY;gBAChE,EAAiF,EAAA,EAAA,EAAA;;KAA5D,MAAK;KAAa,eAAY;;IACnD,EAMM,OAAA;KALH,oBAAkB,EAAA,eAAW;KAC9B,OAAM;KACN,eAAY;SAET,EAAA,MAAQ,EAAA,GAAA,EAAA;IAEF,EAAA,SAAA,GAAA,EAAX,EAEM,OAFN,GAEM,EADD,EAAA,MAAW,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA;IAGR,EAAA,cAAA,GAAA,EADR,EAME,EAAA,EAAA,EAAA;;KAJA,OAAM;KACN,eAAY;KACZ,MAAK;KACJ,SAAK,EAAO,IAAK,CAAA,OAAA,CAAA;;IAEpB,EAAgD,GAAA,EAAjC,OAAM,0BAAwB,CAAA;;GAEpC,EAAA,SAAA,GAAA,EAAX,EAEM,OAFN,GAEM,EADD,EAAA,MAAoB,EAAA,EAAA,IAET,EAAA,UAAA,GAAA,EAAhB,EAEM,OAFN,GAEM,EADD,EAAA,OAAM,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA;GAGX,EAME,EAAA,EAAA,EAAA;gBALS,EAAK;6CAAA,iBAAc;IAC3B,0BAAwB,EAAA;IACxB,YAAY,EAAA;IACZ,OAAO,EAAA;IACP,kBAAc"}

package/dist/components/PlNumberField/PlNumberField.vue2.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import e from "../PlTooltip/PlTooltip.js";
+import e from "../PlIcon16/PlIcon16.js";
+import "../PlIcon16/index.js";
+import t from "../PlTooltip/PlTooltip.js";
 import "../PlTooltip/index.js";
-import t from "../PlIcon16/PlIcon16.js";
 import n from "../../utils/DoubleContour.js";
 import { useLabelNotch as r } from "../../utils/useLabelNotch.js";
-import "../PlIcon16/index.js";
 import './pl-number-field.css';/* empty css                */
 import { numberToDecimalString as i, tryParseNumber as a, validateNumber as o } from "./parseNumber.js";
 import { computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, createVNode as p, defineComponent as m, mergeModels as h, normalizeClass as g, openBlock as _, ref as v, renderSlot as y, toDisplayString as b, unref as x, useModel as S, useSlots as C, watch as w, withCtx as T, withModifiers as E } from "vue";
@@ -113,7 +113,7 @@ var D = { class: "pl-number-field__main-wrapper d-flex" }, O = { class: "pl-numb
 				"group-position": m.groupPosition
 			}, null, 8, ["group-position"]),
 			d("div", O, [
-				m.label ? (_(), u("label", k, [f(b(m.label) + " ", 1), x(F).tooltip ? (_(), c(x(e), {
+				m.label ? (_(), u("label", k, [f(b(m.label) + " ", 1), x(F).tooltip ? (_(), c(x(t), {
 					key: 0,
 					class: "info",
 					position: "top",
@@ -135,7 +135,7 @@ var D = { class: "pl-number-field__main-wrapper d-flex" }, O = { class: "pl-numb
 					onFocusout: J,
 					onFocusin: Y
 				}, null, 40, A),
-				V.value ? (_(), c(x(t), {
+				V.value ? (_(), c(x(e), {
 					key: 1,
 					class: "pl-number-field__clearable",
 					"data-testid": "pl-number-field-clear",

package/dist/components/PlSearchField/PlSearchField.vue2.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import e from "../PlTooltip/PlTooltip.js";
-import t from "../PlIcon24/PlIcon24.js";
-import "../PlIcon24/index.js";
-import n from "../PlIcon16/PlIcon16.js";
+import e from "../PlIcon16/PlIcon16.js";
 import "../PlIcon16/index.js";
+import t from "../PlTooltip/PlTooltip.js";
+import n from "../PlIcon24/PlIcon24.js";
+import "../PlIcon24/index.js";
 import { computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, mergeModels as d, normalizeClass as f, openBlock as p, renderSlot as m, toDisplayString as h, unref as g, useModel as _, useSlots as v, vModelText as y, withCtx as b, withDirectives as x, withModifiers as S } from "vue";
 //#region src/components/PlSearchField/PlSearchField.vue?vue&type=script&setup=true&lang.ts
 var C = ["disabled", "placeholder"], w = /* @__PURE__ */ u({
@@ -27,7 +27,7 @@ var C = ["disabled", "placeholder"], w = /* @__PURE__ */ u({
 			class: f(r.$style.component),
 			"data-testid": "pl-search-field"
 		}, [
-			l(g(t), {
+			l(g(n), {
 				name: "search",
 				"data-testid": "pl-search-field-icon"
 			}),
@@ -40,14 +40,14 @@ var C = ["disabled", "placeholder"], w = /* @__PURE__ */ u({
 				spellcheck: "false",
 				"data-testid": "pl-search-field-input"
 			}, null, 8, C), [[y, d.value]]),
-			w.clearable && E.value ? (p(), i(g(n), {
+			w.clearable && E.value ? (p(), i(g(e), {
 				key: 0,
 				class: f(r.$style.clear),
 				name: "delete-clear",
 				"data-testid": "pl-search-field-clear",
 				onClick: S(O, ["stop"])
 			}, null, 8, ["class"])) : a("", !0),
-			D.value ? (p(), i(e, {
+			D.value ? (p(), i(t, {
 				key: 1,
 				class: "info",
 				position: "bottom",

package/dist/components/PlTextArea/PlTextArea.vue2.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import e from "../PlTooltip/PlTooltip.js";
-import "../PlTooltip/index.js";
-import { getErrorMessage as t } from "../../helpers/error.js";
-import n from "../PlSvg/PlSvg.js";
+import e from "../PlSvg/PlSvg.js";
 import "../PlSvg/index.js";
+import t from "../PlTooltip/PlTooltip.js";
+import "../PlTooltip/index.js";
+import { getErrorMessage as n } from "../../helpers/error.js";
 import r from "../../utils/DoubleContour.js";
 import { useLabelNotch as i } from "../../utils/useLabelNotch.js";
 import a from "../../assets/images/required.js";
@@ -61,8 +61,8 @@ var T = {
 		}), R = s(() => !!P.modelValue), z = o(L, P.rules || []);
 		i(F);
 		let B = s(() => {
-			let e = [], n = t(P.error);
-			return n && e.push(n), e.push(...z.value.errors), e;
+			let e = [], t = n(P.error);
+			return t && e.push(t), e.push(...z.value.errors), e;
 		}), V = s(() => B.value.length > 0), H = () => {
 			if (!P.autogrow) return;
 			let e = I.value;
@@ -70,7 +70,7 @@ var T = {
 		};
 		return h(() => {
 			H();
-		}), (t, i) => (g(), u("div", T, [d("div", {
+		}), (n, i) => (g(), u("div", T, [d("div", {
 			ref_key: "root",
 			ref: F,
 			class: m(["ui-text-area", {
@@ -82,19 +82,19 @@ var T = {
 			"data-testid": "pl-text-area-control"
 		}, [
 			p.label ? (g(), u("label", E, [
-				p.required ? (g(), c(b(n), {
+				p.required ? (g(), c(b(e), {
 					key: 0,
 					uri: b(a),
 					"data-testid": "pl-text-area-required"
 				}, null, 8, ["uri"])) : l("", !0),
 				d("span", null, y(p.label), 1),
-				b(M).tooltip ? (g(), c(b(e), {
+				b(M).tooltip ? (g(), c(b(t), {
 					key: 1,
 					class: "info",
 					position: "top",
 					"data-testid": "pl-text-area-tooltip"
 				}, {
-					tooltip: C(() => [v(t.$slots, "tooltip")]),
+					tooltip: C(() => [v(n.$slots, "tooltip")]),
 					_: 3
 				})) : l("", !0)
 			], 512)) : l("", !0),
@@ -110,7 +110,7 @@ var T = {
 				"data-testid": "pl-text-area-input",
 				onInput: H
 			}, null, 40, D), [[S, L.value]]),
-			d("div", O, [v(t.$slots, "append")]),
+			d("div", O, [v(n.$slots, "append")]),
 			f(r, { class: "ui-text-area__contour" })
 		], 2), V.value ? (g(), u("div", k, y(B.value.join(" ")), 1)) : p.helper ? (g(), u("div", A, y(p.helper), 1)) : l("", !0)]));
 	}