@milaboratories/uikit 2.10.39 → 2.10.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +154 -93
- package/.turbo/turbo-formatter$colon$check.log +2 -2
- package/.turbo/turbo-linter$colon$check.log +2 -2
- package/.turbo/turbo-types$colon$check.log +1 -1
- package/CHANGELOG.md +12 -0
- package/dist/assets/ui.css +1 -1
- package/dist/base/BtnBase.vue2.js +1 -0
- package/dist/base/BtnBase.vue2.js.map +1 -1
- package/dist/colors/index.js +3 -0
- package/dist/components/DataTable/TableComponent.vue2.js +1 -0
- package/dist/components/DataTable/TableComponent.vue2.js.map +1 -1
- package/dist/components/DataTable/assets/data-table-style.css +1 -1
- package/dist/components/PlAccordion/PlAccordionSection.vue.css +1 -1
- package/dist/components/PlAccordion/PlAccordionSection.vue2.js +2 -0
- package/dist/components/PlAccordion/PlAccordionSection.vue2.js.map +1 -1
- package/dist/components/PlAccordion/index.js +2 -0
- package/dist/components/PlAlert/PlAlert.js.map +1 -1
- package/dist/components/PlAlert/PlAlert.vue.d.ts.map +1 -1
- package/dist/components/PlAlert/PlAlert.vue2.js +19 -20
- package/dist/components/PlAlert/PlAlert.vue2.js.map +1 -1
- package/dist/components/PlAlert/index.js +1 -0
- package/dist/components/PlAlert/pl-alert.css +1 -1
- package/dist/components/PlAutocomplete/PlAutocomplete.vue2.js +5 -0
- package/dist/components/PlAutocomplete/PlAutocomplete.vue2.js.map +1 -1
- package/dist/components/PlAutocomplete/index.js +1 -0
- package/dist/components/PlAutocomplete/pl-autocomplete.css +1 -1
- package/dist/components/PlAutocompleteMulti/PlAutocompleteMulti.vue2.js +4 -0
- package/dist/components/PlAutocompleteMulti/PlAutocompleteMulti.vue2.js.map +1 -1
- package/dist/components/PlAutocompleteMulti/index.js +1 -0
- package/dist/components/PlAutocompleteMulti/pl-autocomplete-multi.css +1 -1
- package/dist/components/PlBtnAccent/index.js +1 -0
- package/dist/components/PlBtnAccent/pl-btn-accent.css +1 -1
- package/dist/components/PlBtnDanger/index.js +1 -0
- package/dist/components/PlBtnDanger/pl-btn-danger.css +1 -1
- package/dist/components/PlBtnGhost/PlBtnGhost.vue2.js +1 -0
- package/dist/components/PlBtnGhost/PlBtnGhost.vue2.js.map +1 -1
- package/dist/components/PlBtnGhost/index.js +1 -0
- package/dist/components/PlBtnGhost/pl-btn-ghost.css +1 -1
- package/dist/components/PlBtnGroup/PlBtnGroup.vue2.js +1 -0
- package/dist/components/PlBtnGroup/PlBtnGroup.vue2.js.map +1 -1
- package/dist/components/PlBtnGroup/index.js +1 -0
- package/dist/components/PlBtnGroup/pl-btn-group.css +1 -1
- package/dist/components/PlBtnLink/index.js +1 -0
- package/dist/components/PlBtnPrimary/index.js +1 -0
- package/dist/components/PlBtnPrimary/pl-btn-primary.css +1 -1
- package/dist/components/PlBtnSecondary/index.js +1 -0
- package/dist/components/PlBtnSecondary/pl-btn-secondary.css +1 -1
- package/dist/components/PlBtnSplit/PlBtnSplit.vue2.js +1 -0
- package/dist/components/PlBtnSplit/PlBtnSplit.vue2.js.map +1 -1
- package/dist/components/PlBtnSplit/index.js +1 -0
- package/dist/components/PlChartHistogram/PlChartHistogram.vue.css +1 -1
- package/dist/components/PlChartHistogram/index.js +1 -0
- package/dist/components/PlChartStackedBar/index.js +2 -0
- package/dist/components/PlCheckbox/index.js +1 -0
- package/dist/components/PlCheckbox/pl-checkbox.css +1 -1
- package/dist/components/PlCheckboxGroup/PlCheckboxGroup.vue2.js +1 -0
- package/dist/components/PlCheckboxGroup/PlCheckboxGroup.vue2.js.map +1 -1
- package/dist/components/PlCheckboxGroup/index.js +1 -0
- package/dist/components/PlChip/PlChip.vue2.js +1 -0
- package/dist/components/PlChip/PlChip.vue2.js.map +1 -1
- package/dist/components/PlChip/index.js +1 -0
- package/dist/components/PlChip/pl-chip.css +1 -1
- package/dist/components/PlClipboard/PlClipboard.vue2.js +1 -0
- package/dist/components/PlClipboard/PlClipboard.vue2.js.map +1 -1
- package/dist/components/PlClipboard/index.js +1 -0
- package/dist/components/PlConfirmDialog.vue2.js +3 -0
- package/dist/components/PlConfirmDialog.vue2.js.map +1 -1
- package/dist/components/PlDialogModal/PlDialogModal.vue2.js +1 -1
- package/dist/components/PlDialogModal/index.js +1 -0
- package/dist/components/PlDropdown/OptionList.vue2.js +1 -0
- package/dist/components/PlDropdown/OptionList.vue2.js.map +1 -1
- package/dist/components/PlDropdown/PlDropdown.vue2.js +4 -0
- package/dist/components/PlDropdown/PlDropdown.vue2.js.map +1 -1
- package/dist/components/PlDropdown/index.js +1 -0
- package/dist/components/PlDropdown/pl-dropdown.css +1 -1
- package/dist/components/PlDropdownLegacy/PlDropdownLegacy.vue2.js +4 -0
- package/dist/components/PlDropdownLegacy/PlDropdownLegacy.vue2.js.map +1 -1
- package/dist/components/PlDropdownLegacy/index.js +1 -0
- package/dist/components/PlDropdownLine/index.js +1 -0
- package/dist/components/PlDropdownLine/pl-dropdown-line.css +1 -1
- package/dist/components/PlDropdownLine/resizable-input.css +1 -1
- package/dist/components/PlDropdownMulti/PlDropdownMulti.vue2.js +4 -0
- package/dist/components/PlDropdownMulti/PlDropdownMulti.vue2.js.map +1 -1
- package/dist/components/PlDropdownMulti/index.js +1 -0
- package/dist/components/PlDropdownMulti/pl-dropdown-multi.css +1 -1
- package/dist/components/PlDropdownMultiRef/index.js +1 -0
- package/dist/components/PlDropdownRef/PlDropdownRef.vue2.js +1 -0
- package/dist/components/PlDropdownRef/PlDropdownRef.vue2.js.map +1 -1
- package/dist/components/PlDropdownRef/index.js +1 -0
- package/dist/components/PlEditableTitle/index.js +1 -0
- package/dist/components/PlEditableTitle/pl-editable-title.css +1 -1
- package/dist/components/PlElementList/PlElementListItem.vue.css +1 -1
- package/dist/components/PlElementList/PlElementListItem.vue2.js +2 -0
- package/dist/components/PlElementList/PlElementListItem.vue2.js.map +1 -1
- package/dist/components/PlElementList/index.js +1 -0
- package/dist/components/PlErrorAlert/PlErrorAlert.vue.css +1 -1
- package/dist/components/PlErrorAlert/PlErrorAlert.vue2.js +2 -0
- package/dist/components/PlErrorAlert/PlErrorAlert.vue2.js.map +1 -1
- package/dist/components/PlErrorAlert/index.js +1 -0
- package/dist/components/PlErrorBoundary/PlErrorBoundary.vue2.js +1 -0
- package/dist/components/PlErrorBoundary/PlErrorBoundary.vue2.js.map +1 -1
- package/dist/components/PlErrorBoundary/index.js +1 -0
- package/dist/components/PlFileDialog/Local.vue2.js +1 -0
- package/dist/components/PlFileDialog/Local.vue2.js.map +1 -1
- package/dist/components/PlFileDialog/PlFileDialog.vue2.js +4 -0
- package/dist/components/PlFileDialog/PlFileDialog.vue2.js.map +1 -1
- package/dist/components/PlFileDialog/Remote.vue2.js +4 -0
- package/dist/components/PlFileDialog/Remote.vue2.js.map +1 -1
- package/dist/components/PlFileDialog/Shortcuts.vue2.js +1 -0
- package/dist/components/PlFileDialog/Shortcuts.vue2.js.map +1 -1
- package/dist/components/PlFileDialog/index.js +1 -0
- package/dist/components/PlFileDialog/pl-file-dialog.css +1 -1
- package/dist/components/PlFileInput/PlFileInput.vue2.js +4 -0
- package/dist/components/PlFileInput/PlFileInput.vue2.js.map +1 -1
- package/dist/components/PlFileInput/index.js +1 -0
- package/dist/components/PlIcon16/PlIcon16.vue2.js +1 -0
- package/dist/components/PlIcon16/PlIcon16.vue2.js.map +1 -1
- package/dist/components/PlIcon16/index.js +1 -0
- package/dist/components/PlIcon24/PlIcon24.vue2.js +1 -0
- package/dist/components/PlIcon24/PlIcon24.vue2.js.map +1 -1
- package/dist/components/PlIcon24/index.js +1 -0
- package/dist/components/PlLoaderCircular/index.js +1 -0
- package/dist/components/PlLoaderLogo.vue.css +1 -1
- package/dist/components/PlLogView/PlLogView.vue2.js +3 -0
- package/dist/components/PlLogView/PlLogView.vue2.js.map +1 -1
- package/dist/components/PlLogView/index.js +1 -0
- package/dist/components/PlMaskIcon16/index.js +1 -0
- package/dist/components/PlMaskIcon24/index.js +1 -0
- package/dist/components/PlNotificationAlert/PlNotificationAlert.vue2.js +1 -0
- package/dist/components/PlNotificationAlert/PlNotificationAlert.vue2.js.map +1 -1
- package/dist/components/PlNotificationAlert/index.js +1 -0
- package/dist/components/PlNumberField/PlNumberField.vue2.js +1 -0
- package/dist/components/PlNumberField/PlNumberField.vue2.js.map +1 -1
- package/dist/components/PlNumberField/index.js +1 -0
- package/dist/components/PlProgressBar/index.js +1 -0
- package/dist/components/PlProgressCell/PlProgressCell.vue2.js +1 -0
- package/dist/components/PlProgressCell/PlProgressCell.vue2.js.map +1 -1
- package/dist/components/PlProgressCell/index.js +1 -0
- package/dist/components/PlRadio/PlRadio.vue.css +1 -1
- package/dist/components/PlRadio/index.js +2 -0
- package/dist/components/PlSearchField/PlSearchField.vue2.js +2 -0
- package/dist/components/PlSearchField/PlSearchField.vue2.js.map +1 -1
- package/dist/components/PlSearchField/index.js +1 -0
- package/dist/components/PlSectionSeparator/PlSectionSeparator.vue.css +1 -1
- package/dist/components/PlSectionSeparator/index.js +1 -0
- package/dist/components/PlSidebar/PlSidebarGroup.vue.css +1 -1
- package/dist/components/PlSidebar/PlSidebarItem.vue.css +1 -1
- package/dist/components/PlSidebar/index.js +2 -0
- package/dist/components/PlSlideModal/PlPureSlideModal.js.map +1 -1
- package/dist/components/PlSlideModal/PlPureSlideModal.vue.d.ts.map +1 -1
- package/dist/components/PlSlideModal/PlPureSlideModal.vue2.js +13 -12
- package/dist/components/PlSlideModal/PlPureSlideModal.vue2.js.map +1 -1
- package/dist/components/PlSlideModal/index.js +2 -0
- package/dist/components/PlSlideModal/pl-slide-modal.css +1 -1
- package/dist/components/PlSplash/PlSplash.vue2.js +1 -0
- package/dist/components/PlSplash/PlSplash.vue2.js.map +1 -1
- package/dist/components/PlSplash/index.js +1 -0
- package/dist/components/PlSplash/pl-splash.css +1 -1
- package/dist/components/PlStatusTag/index.js +1 -0
- package/dist/components/PlSvg/index.js +1 -0
- package/dist/components/PlTabs/Tab.vue2.js +1 -0
- package/dist/components/PlTabs/Tab.vue2.js.map +1 -1
- package/dist/components/PlTabs/index.js +1 -0
- package/dist/components/PlTextArea/PlTextArea.vue2.js +2 -0
- package/dist/components/PlTextArea/PlTextArea.vue2.js.map +1 -1
- package/dist/components/PlTextArea/index.js +1 -0
- package/dist/components/PlTextField/PlTextField.vue2.js +4 -0
- package/dist/components/PlTextField/PlTextField.vue2.js.map +1 -1
- package/dist/components/PlTextField/index.js +1 -0
- package/dist/components/PlToggleSwitch/index.js +1 -0
- package/dist/components/PlTooltip/index.js +1 -0
- package/dist/components/Slider.vue2.js +1 -0
- package/dist/components/Slider.vue2.js.map +1 -1
- package/dist/components/SliderRange.vue2.js +1 -0
- package/dist/components/SliderRange.vue2.js.map +1 -1
- package/dist/components/SliderRangeTriple.vue2.js +1 -0
- package/dist/components/SliderRangeTriple.vue2.js.map +1 -1
- package/dist/components/contextMenu/Menu.style.css +1 -1
- package/dist/index.js +79 -20
- package/dist/index.js.map +1 -1
- package/dist/layout/PlBlockPage/PlBlockPage.vue.css +1 -1
- package/dist/layout/PlBlockPage/PlBlockPage.vue2.js +1 -0
- package/dist/layout/PlBlockPage/PlBlockPage.vue2.js.map +1 -1
- package/dist/layout/PlBlockPage/index.js +2 -0
- package/dist/layout/PlContainer/index.js +1 -0
- package/dist/layout/PlGrid/index.js +1 -0
- package/dist/layout/PlPlaceholder/PlPlaceholder.vue.css +1 -1
- package/dist/layout/PlRow/index.js +1 -0
- package/dist/layout/PlSpacer/index.js +1 -0
- package/dist/utils/DoubleContour.style.css +1 -1
- package/dist/utils/DropdownOverlay/index.js +1 -0
- package/dist/utils/PlCloseModalBtn.vue.css +1 -1
- package/package.json +3 -6
- package/src/components/PlAlert/PlAlert.vue +3 -3
- package/src/components/PlAlert/pl-alert.scss +0 -7
- package/src/components/PlSlideModal/PlPureSlideModal.vue +5 -2
- package/src/components/PlSlideModal/pl-slide-modal.scss +0 -8
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import e from "../PlBtnGhost/PlBtnGhost.js";
|
|
2
|
+
import "../PlBtnGhost/index.js";
|
|
2
3
|
import './pl-notification-alert.css';/* empty css */
|
|
3
4
|
import { createCommentVNode as t, createElementBlock as n, createElementVNode as r, createVNode as i, defineComponent as a, mergeModels as o, normalizeClass as s, normalizeStyle as c, openBlock as l, renderSlot as u, unref as d, useModel as f, withModifiers as p } from "vue";
|
|
4
5
|
var m = { class: "pl-notification-alert__wrapper d-flex text-s" }, h = { class: "pl-notification-alert__content flex-grow-1" }, g = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlNotificationAlert.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/PlNotificationAlert/PlNotificationAlert.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { PlBtnGhost } from \"../PlBtnGhost\";\nimport \"./pl-notification-alert.scss\";\n\nconst props = withDefaults(\n defineProps<{\n type?: \"success\" | \"error\" | \"warning\" | \"neutral\";\n width?: string;\n closable?: boolean;\n }>(),\n { type: \"neutral\", width: \"256px\" },\n);\n\nconst model = defineModel({ type: Boolean, default: true });\n\nfunction closeAlert() {\n if (props.closable) {\n model.value = false;\n }\n}\n</script>\n\n<template>\n <div\n v-if=\"model\"\n :class=\"type\"\n :style=\"{ width: `${width}` }\"\n class=\"pl-notification-alert d-flex flex-column gap-16\"\n >\n <div class=\"pl-notification-alert__wrapper d-flex text-s\">\n <div class=\"pl-notification-alert__content flex-grow-1\">\n <slot />\n </div>\n <div v-if=\"closable\" class=\"pl-notification-alert__close\">\n <PlBtnGhost icon=\"close\" @click.stop=\"closeAlert\" />\n </div>\n </div>\n\n <div v-if=\"!!$slots.actions\" class=\"pl-notification-alert__actions d-flex\">\n <slot name=\"actions\" />\n </div>\n </div>\n</template>\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PlNotificationAlert.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/PlNotificationAlert/PlNotificationAlert.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { PlBtnGhost } from \"../PlBtnGhost\";\nimport \"./pl-notification-alert.scss\";\n\nconst props = withDefaults(\n defineProps<{\n type?: \"success\" | \"error\" | \"warning\" | \"neutral\";\n width?: string;\n closable?: boolean;\n }>(),\n { type: \"neutral\", width: \"256px\" },\n);\n\nconst model = defineModel({ type: Boolean, default: true });\n\nfunction closeAlert() {\n if (props.closable) {\n model.value = false;\n }\n}\n</script>\n\n<template>\n <div\n v-if=\"model\"\n :class=\"type\"\n :style=\"{ width: `${width}` }\"\n class=\"pl-notification-alert d-flex flex-column gap-16\"\n >\n <div class=\"pl-notification-alert__wrapper d-flex text-s\">\n <div class=\"pl-notification-alert__content flex-grow-1\">\n <slot />\n </div>\n <div v-if=\"closable\" class=\"pl-notification-alert__close\">\n <PlBtnGhost icon=\"close\" @click.stop=\"closeAlert\" />\n </div>\n </div>\n\n <div v-if=\"!!$slots.actions\" class=\"pl-notification-alert__actions d-flex\">\n <slot name=\"actions\" />\n </div>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAIA,IAAM,IAAQ,GASR,IAAQ,EAAW,GAAA,aAAkC;EAE3D,SAAS,IAAa;AACpB,GAAI,EAAM,aACR,EAAM,QAAQ;;mBAOR,EAAA,SAAA,GAAA,EADR,EAkBM,OAAA;;GAhBH,OAAK,EAAA,CAAE,EAAA,MAEF,kDAAiD,CAAA;GADtD,OAAK,EAAA,EAAA,OAAA,GAAc,EAAA,SAAK,CAAA;MAGzB,EAOM,OAPN,GAOM,CANJ,EAEM,OAFN,GAEM,CADJ,EAAQ,EAAA,QAAA,UAAA,CAAA,CAAA,EAEC,EAAA,YAAA,GAAA,EAAX,EAEM,OAFN,GAEM,CADJ,EAAoD,EAAA,EAAA,EAAA;GAAxC,MAAK;GAAS,SAAK,EAAO,GAAU,CAAA,OAAA,CAAA;uBAIvCA,EAAAA,OAAO,WAAA,GAAA,EAApB,EAEM,OAFN,GAEM,CADJ,EAAuB,EAAA,QAAA,UAAA,CAAA,CAAA,IAAA,EAAA,IAAA,GAAA,CAAA,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlNotificationAlert.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlNumberField.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlNumberField/PlNumberField.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Number input field with increment/decrement buttons, validation, and min/max constraints.\n *\n * @example\n * <PlNumberField v-model=\"price\" :step=\"0.01\" :min-value=\"0\" label=\"Price\" />\n *\n * @example\n * <PlNumberField\n * v-model=\"evenNumber\"\n * :validate=\"(v) => v % 2 !== 0 ? 'Number must be even' : undefined\"\n * :update-on-enter-or-click-outside=\"true\"\n * label=\"Even Number\"\n * />\n */\nexport default {\n name: \"PlNumberField\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport \"./pl-number-field.scss\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport { computed, ref, useSlots, watch } from \"vue\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport { parseNumber } from \"./parseNumber\";\n\nconst props = withDefaults(\n defineProps<{\n /** Input is disabled if true */\n disabled?: boolean;\n /** Label on the top border of the field, empty by default */\n label?: string;\n /** Input placeholder, empty by default */\n placeholder?: string;\n /** Step for increment/decrement buttons, 1 by default */\n step?: number;\n /** If defined - show an error if value is lower */\n minValue?: number;\n /** If defined - show an error if value is higher */\n maxValue?: number;\n /** If false - remove buttons on the right */\n useIncrementButtons?: boolean;\n /** If true - changes do not apply immediately, they apply only by removing focus from the input (by click enter or by click outside) */\n updateOnEnterOrClickOutside?: boolean;\n /** Error message that shows always when it's provided, without other checks */\n errorMessage?: string;\n /** Additional validity check for input value that must return an error text if failed */\n validate?: (v: number) => string | undefined;\n /** Makes some of corners not rounded */\n groupPosition?:\n | \"top\"\n | \"bottom\"\n | \"left\"\n | \"right\"\n | \"top-left\"\n | \"top-right\"\n | \"bottom-left\"\n | \"bottom-right\"\n | \"middle\";\n }>(),\n {\n step: 1,\n label: undefined,\n placeholder: undefined,\n minValue: undefined,\n maxValue: undefined,\n useIncrementButtons: true,\n updateOnEnter: false,\n errorMessage: undefined,\n validate: undefined,\n groupPosition: undefined,\n },\n);\n\nconst modelValue = defineModel<number | undefined>({ required: true });\n\nconst slots = useSlots();\n\nconst rootRef = ref<HTMLElement>();\nconst inputRef = ref<HTMLInputElement>();\n\nuseLabelNotch(rootRef);\n\nfunction modelToString(v: number | undefined) {\n return v === undefined ? \"\" : String(+v); // (+v) to avoid staying in input non-number values if they are provided in model\n}\n\nconst parsedResult = computed(() => parseNumber(props, inputValue.value));\n\nconst cachedValue = ref<string | undefined>(undefined);\n\nconst resetCachedValue = () => (cachedValue.value = undefined);\n\nwatch(modelValue, (n) => {\n const r = parsedResult.value;\n if (r.error || n !== r.value) {\n resetCachedValue();\n }\n});\n\nconst inputValue = computed({\n get() {\n return cachedValue.value ?? modelToString(modelValue.value);\n },\n set(nextValue: string) {\n const r = parseNumber(props, nextValue);\n\n cachedValue.value = r.cleanInput;\n\n if (r.error || props.updateOnEnterOrClickOutside) {\n inputRef.value!.value = r.cleanInput;\n } else {\n modelValue.value = r.value;\n }\n },\n});\n\nconst focused = ref(false);\n\nfunction applyChanges() {\n if (parsedResult.value.error === undefined) {\n modelValue.value = parsedResult.value.value;\n }\n}\n\nconst errors = computed(() => {\n let ers: string[] = [];\n\n if (props.errorMessage) {\n ers.push(props.errorMessage);\n }\n\n const r = parsedResult.value;\n\n if (r.error) {\n ers.push(r.error.message);\n } else if (props.validate && r.value !== undefined) {\n const error = props.validate(r.value);\n if (error) {\n ers.push(error);\n }\n }\n\n ers = [...ers];\n\n return ers.join(\" \");\n});\n\nconst isIncrementDisabled = computed(() => {\n const r = parsedResult.value;\n\n if (props.maxValue !== undefined && r.value !== undefined) {\n return r.value >= props.maxValue;\n }\n\n return false;\n});\n\nconst isDecrementDisabled = computed(() => {\n const r = parsedResult.value;\n\n if (props.minValue !== undefined && r.value !== undefined) {\n return r.value <= props.minValue;\n }\n\n return false;\n});\n\nconst multiplier = computed(() => 10 ** (props.step.toString().split(\".\").at(1)?.length ?? 0));\n\nfunction increment() {\n const r = parsedResult.value;\n\n const parsedValue = r.value;\n\n if (!isIncrementDisabled.value) {\n let nV;\n if (parsedValue === undefined) {\n nV = props.minValue ? props.minValue : 0;\n } else {\n nV =\n ((parsedValue || 0) * multiplier.value + props.step * multiplier.value) / multiplier.value;\n }\n modelValue.value = props.maxValue !== undefined ? Math.min(props.maxValue, nV) : nV;\n }\n}\n\nfunction decrement() {\n const r = parsedResult.value;\n\n const parsedValue = r.value;\n\n if (!isDecrementDisabled.value) {\n let nV;\n if (parsedValue === undefined) {\n nV = 0;\n } else {\n nV =\n ((parsedValue || 0) * multiplier.value - props.step * multiplier.value) / multiplier.value;\n }\n modelValue.value = props.minValue !== undefined ? Math.max(props.minValue, nV) : nV;\n }\n}\n\nfunction handleKeyPress(e: { code: string; preventDefault(): void }) {\n if (props.updateOnEnterOrClickOutside) {\n if (e.code === \"Escape\") {\n inputValue.value = modelToString(modelValue.value);\n inputRef.value?.blur();\n }\n if (e.code === \"Enter\") {\n inputRef.value?.blur();\n }\n }\n\n if (e.code === \"Enter\") {\n inputValue.value = String(modelValue.value); // to make .1 => 0.1, 10.00 => 10, remove leading zeros etc\n }\n\n if ([\"ArrowDown\", \"ArrowUp\"].includes(e.code)) {\n e.preventDefault();\n }\n\n if (props.useIncrementButtons && e.code === \"ArrowUp\") {\n increment();\n }\n\n if (props.useIncrementButtons && e.code === \"ArrowDown\") {\n decrement();\n }\n}\n\n// https://stackoverflow.com/questions/880512/prevent-text-selection-after-double-click#:~:text=If%20you%20encounter%20a%20situation,none%3B%20to%20the%20summary%20element.\n// this prevents selecting of more than input content in some cases,\n// but also disable selecting input content by double-click (useful feature)\nconst onMousedown = (ev: MouseEvent) => {\n if (ev.detail > 1) {\n ev.preventDefault();\n }\n};\n</script>\n\n<template>\n <div\n ref=\"rootRef\"\n :class=\"{ error: !!errors.trim(), disabled: disabled }\"\n class=\"pl-number-field d-flex-column\"\n @keydown=\"handleKeyPress($event)\"\n >\n <div class=\"pl-number-field__main-wrapper d-flex\">\n <DoubleContour class=\"pl-number-field__contour\" :group-position=\"groupPosition\" />\n <div\n class=\"pl-number-field__wrapper flex-grow d-flex flex-align-center\"\n :class=\"{ withoutArrows: !useIncrementButtons }\"\n >\n <label v-if=\"label\" class=\"text-description\">\n {{ label }}\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <input\n ref=\"inputRef\"\n v-model=\"inputValue\"\n :disabled=\"disabled\"\n :placeholder=\"placeholder\"\n class=\"text-s flex-grow\"\n @focusin=\"focused = true\"\n @focusout=\"\n focused = false;\n applyChanges();\n \"\n />\n </div>\n <div\n v-if=\"useIncrementButtons\"\n class=\"pl-number-field__icons d-flex-column\"\n @mousedown=\"onMousedown\"\n >\n <div\n :class=\"{ disabled: isIncrementDisabled }\"\n class=\"pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center\"\n @click=\"increment\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M8 4.93933L13.5303 10.4697L12.4697 11.5303L8 7.06065L3.53033 11.5303L2.46967 10.4697L8 4.93933Z\"\n fill=\"#110529\"\n />\n </svg>\n </div>\n <div\n :class=\"{ disabled: isDecrementDisabled }\"\n class=\"pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center\"\n @click=\"decrement\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M2.46967 6.53033L3.53033 5.46967L8 9.93934L12.4697 5.46967L13.5303 6.53033L8 12.0607L2.46967 6.53033Z\"\n fill=\"#110529\"\n />\n </svg>\n </div>\n </div>\n </div>\n <div v-if=\"errors.trim()\" class=\"pl-number-field__error\">\n {{ errors }}\n </div>\n </div>\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PlNumberField.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlNumberField/PlNumberField.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Number input field with increment/decrement buttons, validation, and min/max constraints.\n *\n * @example\n * <PlNumberField v-model=\"price\" :step=\"0.01\" :min-value=\"0\" label=\"Price\" />\n *\n * @example\n * <PlNumberField\n * v-model=\"evenNumber\"\n * :validate=\"(v) => v % 2 !== 0 ? 'Number must be even' : undefined\"\n * :update-on-enter-or-click-outside=\"true\"\n * label=\"Even Number\"\n * />\n */\nexport default {\n name: \"PlNumberField\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport \"./pl-number-field.scss\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport { computed, ref, useSlots, watch } from \"vue\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport { parseNumber } from \"./parseNumber\";\n\nconst props = withDefaults(\n defineProps<{\n /** Input is disabled if true */\n disabled?: boolean;\n /** Label on the top border of the field, empty by default */\n label?: string;\n /** Input placeholder, empty by default */\n placeholder?: string;\n /** Step for increment/decrement buttons, 1 by default */\n step?: number;\n /** If defined - show an error if value is lower */\n minValue?: number;\n /** If defined - show an error if value is higher */\n maxValue?: number;\n /** If false - remove buttons on the right */\n useIncrementButtons?: boolean;\n /** If true - changes do not apply immediately, they apply only by removing focus from the input (by click enter or by click outside) */\n updateOnEnterOrClickOutside?: boolean;\n /** Error message that shows always when it's provided, without other checks */\n errorMessage?: string;\n /** Additional validity check for input value that must return an error text if failed */\n validate?: (v: number) => string | undefined;\n /** Makes some of corners not rounded */\n groupPosition?:\n | \"top\"\n | \"bottom\"\n | \"left\"\n | \"right\"\n | \"top-left\"\n | \"top-right\"\n | \"bottom-left\"\n | \"bottom-right\"\n | \"middle\";\n }>(),\n {\n step: 1,\n label: undefined,\n placeholder: undefined,\n minValue: undefined,\n maxValue: undefined,\n useIncrementButtons: true,\n updateOnEnter: false,\n errorMessage: undefined,\n validate: undefined,\n groupPosition: undefined,\n },\n);\n\nconst modelValue = defineModel<number | undefined>({ required: true });\n\nconst slots = useSlots();\n\nconst rootRef = ref<HTMLElement>();\nconst inputRef = ref<HTMLInputElement>();\n\nuseLabelNotch(rootRef);\n\nfunction modelToString(v: number | undefined) {\n return v === undefined ? \"\" : String(+v); // (+v) to avoid staying in input non-number values if they are provided in model\n}\n\nconst parsedResult = computed(() => parseNumber(props, inputValue.value));\n\nconst cachedValue = ref<string | undefined>(undefined);\n\nconst resetCachedValue = () => (cachedValue.value = undefined);\n\nwatch(modelValue, (n) => {\n const r = parsedResult.value;\n if (r.error || n !== r.value) {\n resetCachedValue();\n }\n});\n\nconst inputValue = computed({\n get() {\n return cachedValue.value ?? modelToString(modelValue.value);\n },\n set(nextValue: string) {\n const r = parseNumber(props, nextValue);\n\n cachedValue.value = r.cleanInput;\n\n if (r.error || props.updateOnEnterOrClickOutside) {\n inputRef.value!.value = r.cleanInput;\n } else {\n modelValue.value = r.value;\n }\n },\n});\n\nconst focused = ref(false);\n\nfunction applyChanges() {\n if (parsedResult.value.error === undefined) {\n modelValue.value = parsedResult.value.value;\n }\n}\n\nconst errors = computed(() => {\n let ers: string[] = [];\n\n if (props.errorMessage) {\n ers.push(props.errorMessage);\n }\n\n const r = parsedResult.value;\n\n if (r.error) {\n ers.push(r.error.message);\n } else if (props.validate && r.value !== undefined) {\n const error = props.validate(r.value);\n if (error) {\n ers.push(error);\n }\n }\n\n ers = [...ers];\n\n return ers.join(\" \");\n});\n\nconst isIncrementDisabled = computed(() => {\n const r = parsedResult.value;\n\n if (props.maxValue !== undefined && r.value !== undefined) {\n return r.value >= props.maxValue;\n }\n\n return false;\n});\n\nconst isDecrementDisabled = computed(() => {\n const r = parsedResult.value;\n\n if (props.minValue !== undefined && r.value !== undefined) {\n return r.value <= props.minValue;\n }\n\n return false;\n});\n\nconst multiplier = computed(() => 10 ** (props.step.toString().split(\".\").at(1)?.length ?? 0));\n\nfunction increment() {\n const r = parsedResult.value;\n\n const parsedValue = r.value;\n\n if (!isIncrementDisabled.value) {\n let nV;\n if (parsedValue === undefined) {\n nV = props.minValue ? props.minValue : 0;\n } else {\n nV =\n ((parsedValue || 0) * multiplier.value + props.step * multiplier.value) / multiplier.value;\n }\n modelValue.value = props.maxValue !== undefined ? Math.min(props.maxValue, nV) : nV;\n }\n}\n\nfunction decrement() {\n const r = parsedResult.value;\n\n const parsedValue = r.value;\n\n if (!isDecrementDisabled.value) {\n let nV;\n if (parsedValue === undefined) {\n nV = 0;\n } else {\n nV =\n ((parsedValue || 0) * multiplier.value - props.step * multiplier.value) / multiplier.value;\n }\n modelValue.value = props.minValue !== undefined ? Math.max(props.minValue, nV) : nV;\n }\n}\n\nfunction handleKeyPress(e: { code: string; preventDefault(): void }) {\n if (props.updateOnEnterOrClickOutside) {\n if (e.code === \"Escape\") {\n inputValue.value = modelToString(modelValue.value);\n inputRef.value?.blur();\n }\n if (e.code === \"Enter\") {\n inputRef.value?.blur();\n }\n }\n\n if (e.code === \"Enter\") {\n inputValue.value = String(modelValue.value); // to make .1 => 0.1, 10.00 => 10, remove leading zeros etc\n }\n\n if ([\"ArrowDown\", \"ArrowUp\"].includes(e.code)) {\n e.preventDefault();\n }\n\n if (props.useIncrementButtons && e.code === \"ArrowUp\") {\n increment();\n }\n\n if (props.useIncrementButtons && e.code === \"ArrowDown\") {\n decrement();\n }\n}\n\n// https://stackoverflow.com/questions/880512/prevent-text-selection-after-double-click#:~:text=If%20you%20encounter%20a%20situation,none%3B%20to%20the%20summary%20element.\n// this prevents selecting of more than input content in some cases,\n// but also disable selecting input content by double-click (useful feature)\nconst onMousedown = (ev: MouseEvent) => {\n if (ev.detail > 1) {\n ev.preventDefault();\n }\n};\n</script>\n\n<template>\n <div\n ref=\"rootRef\"\n :class=\"{ error: !!errors.trim(), disabled: disabled }\"\n class=\"pl-number-field d-flex-column\"\n @keydown=\"handleKeyPress($event)\"\n >\n <div class=\"pl-number-field__main-wrapper d-flex\">\n <DoubleContour class=\"pl-number-field__contour\" :group-position=\"groupPosition\" />\n <div\n class=\"pl-number-field__wrapper flex-grow d-flex flex-align-center\"\n :class=\"{ withoutArrows: !useIncrementButtons }\"\n >\n <label v-if=\"label\" class=\"text-description\">\n {{ label }}\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <input\n ref=\"inputRef\"\n v-model=\"inputValue\"\n :disabled=\"disabled\"\n :placeholder=\"placeholder\"\n class=\"text-s flex-grow\"\n @focusin=\"focused = true\"\n @focusout=\"\n focused = false;\n applyChanges();\n \"\n />\n </div>\n <div\n v-if=\"useIncrementButtons\"\n class=\"pl-number-field__icons d-flex-column\"\n @mousedown=\"onMousedown\"\n >\n <div\n :class=\"{ disabled: isIncrementDisabled }\"\n class=\"pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center\"\n @click=\"increment\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M8 4.93933L13.5303 10.4697L12.4697 11.5303L8 7.06065L3.53033 11.5303L2.46967 10.4697L8 4.93933Z\"\n fill=\"#110529\"\n />\n </svg>\n </div>\n <div\n :class=\"{ disabled: isDecrementDisabled }\"\n class=\"pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center\"\n @click=\"decrement\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M2.46967 6.53033L3.53033 5.46967L8 9.93934L12.4697 5.46967L13.5303 6.53033L8 12.0607L2.46967 6.53033Z\"\n fill=\"#110529\"\n />\n </svg>\n </div>\n </div>\n </div>\n <div v-if=\"errors.trim()\" class=\"pl-number-field__error\">\n {{ errors }}\n </div>\n </div>\n</template>\n"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlNumberField.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlProgressBar.js";
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { getErrorMessage as e } from "../../helpers/error.js";
|
|
2
2
|
import t from "../PlIcon24/PlIcon24.js";
|
|
3
|
+
import "../PlMaskIcon24/index.js";
|
|
3
4
|
import './pl-progress-cell.css';/* empty css */
|
|
4
5
|
import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, defineComponent as l, normalizeClass as u, normalizeStyle as d, openBlock as f, toDisplayString as p, unref as m } from "vue";
|
|
5
6
|
var h = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlProgressCell.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlProgressCell/PlProgressCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport \"./pl-progress-cell.scss\";\nimport { computed } from \"vue\";\nimport { PlMaskIcon24 } from \"../PlMaskIcon24\";\nimport type { PlProgressCellProps } from \"./types\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\n\nconst props = withDefaults(defineProps<PlProgressCellProps>(), {\n stage: \"not_started\",\n step: \"\", // main text (left)\n progressString: \"\", // appended text on the right side (right)\n progress: undefined,\n error: undefined,\n});\n\nconst canShowWhiteBg = computed(() => props.stage !== \"not_started\");\n\nconst currentProgress = computed(() =>\n props.stage === \"done\" ? 100 : Math.min(100, props.progress || 0),\n);\n\nconst canShowInfinityLoader = computed(\n () =>\n props.progress === undefined &&\n props.stage !== \"done\" &&\n props.stage !== \"not_started\" &&\n !props.error,\n);\n</script>\n\n<template>\n <div\n :class=\"{\n 'progress-cell': true,\n 'progress-cell__white-bg': canShowWhiteBg,\n error,\n 'not-started': props.stage === 'not_started',\n }\"\n >\n <div v-if=\"canShowInfinityLoader\" class=\"progress-cell__infinity-loader\">\n <div class=\"progress-cell__infinity-gradient\" />\n </div>\n <div\n v-if=\"!canShowInfinityLoader && !error\"\n class=\"progress-cell__indicator\"\n :style=\"{ width: currentProgress + '%' }\"\n />\n <div class=\"progress-cell__body\">\n <div class=\"progress-cell__stage text-s\">\n {{ error ? getErrorMessage(error) : step }}\n </div>\n <div class=\"progress-cell__percentage text-s d-flex align-center justify-end\">\n <PlMaskIcon24 v-if=\"error\" name=\"error\" />\n <template v-if=\"!error\">\n {{ progressString }}\n </template>\n </div>\n </div>\n </div>\n</template>\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PlProgressCell.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlProgressCell/PlProgressCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport \"./pl-progress-cell.scss\";\nimport { computed } from \"vue\";\nimport { PlMaskIcon24 } from \"../PlMaskIcon24\";\nimport type { PlProgressCellProps } from \"./types\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\n\nconst props = withDefaults(defineProps<PlProgressCellProps>(), {\n stage: \"not_started\",\n step: \"\", // main text (left)\n progressString: \"\", // appended text on the right side (right)\n progress: undefined,\n error: undefined,\n});\n\nconst canShowWhiteBg = computed(() => props.stage !== \"not_started\");\n\nconst currentProgress = computed(() =>\n props.stage === \"done\" ? 100 : Math.min(100, props.progress || 0),\n);\n\nconst canShowInfinityLoader = computed(\n () =>\n props.progress === undefined &&\n props.stage !== \"done\" &&\n props.stage !== \"not_started\" &&\n !props.error,\n);\n</script>\n\n<template>\n <div\n :class=\"{\n 'progress-cell': true,\n 'progress-cell__white-bg': canShowWhiteBg,\n error,\n 'not-started': props.stage === 'not_started',\n }\"\n >\n <div v-if=\"canShowInfinityLoader\" class=\"progress-cell__infinity-loader\">\n <div class=\"progress-cell__infinity-gradient\" />\n </div>\n <div\n v-if=\"!canShowInfinityLoader && !error\"\n class=\"progress-cell__indicator\"\n :style=\"{ width: currentProgress + '%' }\"\n />\n <div class=\"progress-cell__body\">\n <div class=\"progress-cell__stage text-s\">\n {{ error ? getErrorMessage(error) : step }}\n </div>\n <div class=\"progress-cell__percentage text-s d-flex align-center justify-end\">\n <PlMaskIcon24 v-if=\"error\" name=\"error\" />\n <template v-if=\"!error\">\n {{ progressString }}\n </template>\n </div>\n </div>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAOA,IAAM,IAAQ,GAQR,IAAiB,QAAe,EAAM,UAAU,cAAc,EAE9D,IAAkB,QACtB,EAAM,UAAU,SAAS,MAAM,KAAK,IAAI,KAAK,EAAM,YAAY,EAAE,CAClE,EAEK,IAAwB,QAE1B,EAAM,aAAa,KAAA,KACnB,EAAM,UAAU,UAChB,EAAM,UAAU,iBAChB,CAAC,EAAM,MACV;yBAIC,EA2BM,OAAA,EA1BH,OAAK,EAAA;;8BAAkE,EAAA;UAAsB,EAAA;kBAA4B,EAAM,UAAK;;GAO1H,EAAA,SAAA,GAAA,EAAX,EAEM,OAFN,GAEM,CAAA,GAAA,AAAA,EAAA,OAAA,CADJ,EAAgD,OAAA,EAA3C,OAAM,oCAAkC,EAAA,MAAA,GAAA,CAAA,CAAA,CAAA,IAAA,EAAA,IAAA,GAAA;IAGtC,EAAA,SAAqB,CAAK,EAAA,SAAA,GAAA,EADnC,EAIE,OAAA;;IAFA,OAAM;IACL,OAAK,EAAA,EAAA,OAAW,EAAA,QAAe,KAAA,CAAA;;GAElC,EAUM,OAVN,GAUM,CATJ,EAEM,OAFN,GAEM,EADD,EAAA,QAAQ,EAAA,EAAe,CAAC,EAAA,MAAK,GAAI,EAAA,KAAI,EAAA,EAAA,EAE1C,EAKM,OALN,GAKM,CAJgB,EAAA,SAAA,GAAA,EAApB,EAA0C,EAAA,EAAA,EAAA;;IAAf,MAAK;oBACf,EAAA,QACE,EAAA,IAAA,GAAA,IADF,GAAA,EAAjB,EAEW,GAAA,EAAA,KAAA,GAAA,EAAA,CAAA,EAAA,EADN,EAAA,eAAc,EAAA,EAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlProgressCell.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._container_u39pc_2{color:var(--txt-01)
|
|
1
|
+
._container_u39pc_2{color:var(--txt-01);user-select:none;border-radius:6px;align-items:center;gap:4px;padding:4px;transition:all .2s ease-in-out;display:flex;&:hover:not(:has(:disabled)){background:var(--btn-sec-hover-grey)}&:has(:disabled){color:var(--dis-01)}}._input_u39pc_19{appearance:none;aspect-ratio:1;block-size:24px;color:inherit;border-radius:50%;outline:2px solid #0000;margin:0;transition:inherit;position:relative;&:focus{outline-color:var(--border-color-focus)}&:before{content:"";border:2px solid;border-radius:50%;position:absolute;inset:2px}&:after{content:"";background-color:currentColor;border-radius:50%;transition:inherit;position:absolute;inset:7.5px;scale:0}&:checked:after{scale:1}}._label_u39pc_53{text-box:trim-both cap alphabetic;padding-inline:4px;font-weight:500;line-height:1.42857}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import e from "../PlTooltip/PlTooltip.js";
|
|
2
2
|
import t from "../PlIcon24/PlIcon24.js";
|
|
3
|
+
import "../PlIcon24/index.js";
|
|
3
4
|
import n from "../PlIcon16/PlIcon16.js";
|
|
5
|
+
import "../PlIcon16/index.js";
|
|
4
6
|
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";
|
|
5
7
|
var C = ["disabled", "placeholder"], w = /* @__PURE__ */ u({
|
|
6
8
|
__name: "PlSearchField",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlSearchField.vue_vue_type_script_setup_true_lang.js","names":["$style"],"sources":["../../../src/components/PlSearchField/PlSearchField.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlIcon24 } from \"../PlIcon24\";\nimport { computed } from \"vue\";\nimport PlTooltip from \"../PlTooltip/PlTooltip.vue\";\n\nconst model = defineModel<string>({ required: true });\n\nconst props = defineProps<{\n modelValue?: string;\n clearable?: boolean;\n placeholder?: string;\n disabled?: boolean;\n helper?: string;\n}>();\nconst slots = defineSlots<{\n helper: () => unknown;\n}>();\n\nconst nonEmpty = computed(() => model.value != null && model.value.length > 0);\nconst hasHelper = computed(() => props.helper != null || slots.helper != null);\n\nconst clear = () => (model.value = \"\");\n</script>\n\n<template>\n <div ref=\"root\" :class=\"$style.component\">\n <PlIcon24 name=\"search\" />\n <input\n ref=\"input\"\n v-model=\"model\"\n :disabled=\"props.disabled\"\n :placeholder=\"props.placeholder || 'Find...'\"\n type=\"text\"\n spellcheck=\"false\"\n />\n <PlIcon16\n v-if=\"props.clearable && nonEmpty\"\n :class=\"$style.clear\"\n name=\"delete-clear\"\n @click.stop=\"clear\"\n />\n\n <PlTooltip v-if=\"hasHelper\" class=\"info\" position=\"bottom\">\n <template #tooltip>\n <slot name=\"helper\">\n {{ props.helper }}\n </slot>\n </template>\n </PlTooltip>\n </div>\n</template>\n\n<style lang=\"scss\" module>\n.component {\n --pl-search-field-border-bottom-color: var(--txt-01);\n --pl-search-field-bg: transparent;\n --pl-search-field-caret-color: auto;\n --pl-search-field-clear-display: none;\n\n position: relative;\n display: flex;\n align-items: center;\n min-height: calc(var(--control-height) - 2px);\n line-height: calc(var(--control-height) - 2px);\n background-color: var(--pl-search-field-bg);\n padding: 0 0 0 0;\n border-bottom: 1px solid var(--pl-search-field-border-bottom-color);\n\n input {\n margin-left: 8px;\n width: 100%;\n height: 20px;\n border: none;\n outline: none;\n background-color: transparent;\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n caret-color: var(--pl-search-field-caret-color);\n }\n\n &:focus-within {\n --pl-search-field-border-bottom-color: var(--txt-focus);\n --pl-search-field-caret-color: var(--border-color-focus);\n --pl-search-field-clear-display: block;\n }\n\n &:hover {\n --pl-search-field-clear-display: block;\n }\n\n .clear {\n --icon-color: var(--ic-02);\n cursor: pointer;\n margin-left: auto;\n display: var(--pl-search-field-clear-display);\n }\n}\n</style>\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PlSearchField.vue_vue_type_script_setup_true_lang.js","names":["$style"],"sources":["../../../src/components/PlSearchField/PlSearchField.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlIcon24 } from \"../PlIcon24\";\nimport { computed } from \"vue\";\nimport PlTooltip from \"../PlTooltip/PlTooltip.vue\";\n\nconst model = defineModel<string>({ required: true });\n\nconst props = defineProps<{\n modelValue?: string;\n clearable?: boolean;\n placeholder?: string;\n disabled?: boolean;\n helper?: string;\n}>();\nconst slots = defineSlots<{\n helper: () => unknown;\n}>();\n\nconst nonEmpty = computed(() => model.value != null && model.value.length > 0);\nconst hasHelper = computed(() => props.helper != null || slots.helper != null);\n\nconst clear = () => (model.value = \"\");\n</script>\n\n<template>\n <div ref=\"root\" :class=\"$style.component\">\n <PlIcon24 name=\"search\" />\n <input\n ref=\"input\"\n v-model=\"model\"\n :disabled=\"props.disabled\"\n :placeholder=\"props.placeholder || 'Find...'\"\n type=\"text\"\n spellcheck=\"false\"\n />\n <PlIcon16\n v-if=\"props.clearable && nonEmpty\"\n :class=\"$style.clear\"\n name=\"delete-clear\"\n @click.stop=\"clear\"\n />\n\n <PlTooltip v-if=\"hasHelper\" class=\"info\" position=\"bottom\">\n <template #tooltip>\n <slot name=\"helper\">\n {{ props.helper }}\n </slot>\n </template>\n </PlTooltip>\n </div>\n</template>\n\n<style lang=\"scss\" module>\n.component {\n --pl-search-field-border-bottom-color: var(--txt-01);\n --pl-search-field-bg: transparent;\n --pl-search-field-caret-color: auto;\n --pl-search-field-clear-display: none;\n\n position: relative;\n display: flex;\n align-items: center;\n min-height: calc(var(--control-height) - 2px);\n line-height: calc(var(--control-height) - 2px);\n background-color: var(--pl-search-field-bg);\n padding: 0 0 0 0;\n border-bottom: 1px solid var(--pl-search-field-border-bottom-color);\n\n input {\n margin-left: 8px;\n width: 100%;\n height: 20px;\n border: none;\n outline: none;\n background-color: transparent;\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n caret-color: var(--pl-search-field-caret-color);\n }\n\n &:focus-within {\n --pl-search-field-border-bottom-color: var(--txt-focus);\n --pl-search-field-caret-color: var(--border-color-focus);\n --pl-search-field-clear-display: block;\n }\n\n &:hover {\n --pl-search-field-clear-display: block;\n }\n\n .clear {\n --icon-color: var(--ic-02);\n cursor: pointer;\n margin-left: auto;\n display: var(--pl-search-field-clear-display);\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EAMA,IAAM,IAAQ,EAAmB,GAAA,aAAoB,EAE/C,IAAQ,GAOR,IAAQ,GAEV,EAEE,IAAW,QAAe,EAAM,SAAS,QAAQ,EAAM,MAAM,SAAS,EAAE,EACxE,IAAY,QAAe,EAAM,UAAU,QAAQ,EAAM,UAAU,KAAK,EAExE,UAAe,EAAM,QAAQ;yBAIjC,EAwBM,OAAA;GAxBD,KAAI;GAAQ,OAAK,EAAEA,EAAAA,OAAO,UAAS;;GACtC,EAA0B,EAAA,EAAA,EAAA,EAAhB,MAAK,UAAQ,CAAA;KACvB,EAOE,SAAA;IANA,KAAI;6CACU,QAAA;IACb,UAAU,EAAM;IAChB,aAAa,EAAM,eAAW;IAC/B,MAAK;IACL,YAAW;wBAJF,EAAA,MAAK,CAAA,CAAA;GAOR,EAAM,aAAa,EAAA,SAAA,GAAA,EAD3B,EAKE,EAAA,EAAA,EAAA;;IAHC,OAAK,EAAEA,EAAAA,OAAO,MAAK;IACpB,MAAK;IACJ,SAAK,EAAO,GAAK,CAAA,OAAA,CAAA;;GAGH,EAAA,SAAA,GAAA,EAAjB,EAMY,GAAA;;IANgB,OAAM;IAAO,UAAS;;IACrC,SAAO,QAGT,CAFP,EAEO,EAAA,QAAA,UAAA,EAAA,QAAA,CAAA,EAAA,EADF,EAAM,OAAM,EAAA,EAAA,CAAA,CAAA,CAAA,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlSearchField.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.pl-section-separator{--pl-separator-padding:20px 0 4px 0;--pl-separator-txt-color:var(--txt-03);--pl-separador-divider-color:var(--border-color-div-grey);--mask-icon-bg-color:var(--ic-02);padding:var(--pl-separator-padding);flex-direction:column;display:flex}.pl-section-separator:first-child{--pl-separator-padding:4px 0 4px 0}._compact_o5ekj_16{--pl-separator-padding:0 0 4px 0}._content_o5ekj_20{color:var(--pl-separator-txt-color);letter-spacing:.52px;text-transform:uppercase
|
|
1
|
+
.pl-section-separator{--pl-separator-padding:20px 0 4px 0;--pl-separator-txt-color:var(--txt-03);--pl-separador-divider-color:var(--border-color-div-grey);--mask-icon-bg-color:var(--ic-02);padding:var(--pl-separator-padding);flex-direction:column;display:flex}.pl-section-separator:first-child{--pl-separator-padding:4px 0 4px 0}._compact_o5ekj_16{--pl-separator-padding:0 0 4px 0}._content_o5ekj_20{color:var(--pl-separator-txt-color);letter-spacing:.52px;text-transform:uppercase;user-select:none;flex:1;align-items:center;gap:4px;min-height:16px;font-size:13px;font-weight:600;line-height:14px;display:flex}._content_o5ekj_20:after{content:"";background-color:var(--pl-separador-divider-color);flex:1;height:1px;margin-left:4px}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlSectionSeparator.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--txt-00:#fff;--txt-01:
|
|
1
|
+
:root{--txt-00:#fff;--txt-01:light-dark(#110529,#fff);--txt-02:#231842;--txt-03:#9d9eae;--txt-mask:#cfd1db;--txt-focus:#07ad3e;--txt-error:#f1222f;--txt-link:#5f31cc;--ic-00:#fff;--ic-01:#110529;--ic-02:#cfd1db;--ic-accent:#07ad3e;--border-color-default:#110529;--border-color-hover:#231842;--border-color-focus:#49cc49;--border-color-error:#ff5c5c;--border-color-div-grey:#e1e3eb;--border-color-div-bw:#fff;--btn-accent-default:#845cff;--btn-accent-hover:#9470ff;--btn-accent-press:#6f4dd6;--btn-primary-default:#110529;--btn-primary-hover:#231842;--btn-primary-press:#080214;--btn-sec-hover-white:#ffffff80;--btn-sec-hover-grey:light-dark(#9babcc29,#8383a329);--btn-sec-press-grey:#9babcc3d;--btn-active-select:#63e0243d;--btn-switcher:linear-gradient(180deg, #a1e59c 0%, #d0f5b0 100%);--btn-accent-positive-500:#ecfbe5;--dis-00:#fff;--dis-01:light-dark(#cfd1db,#3d3d42);--bg-base-dark:#110529;--bg-base-light:#f7f8fa;--bg-elevated-01:#fff;--bg-elevated-02:#e1e3eb;--bg-error:#fff5f5;--filled-V-BG:#d0f0c0;--filled-D-BG:#ffcecc;--filled-N-BG:#faf5aa;--filled-J-BG:#dedbff;--notification-neutral:linear-gradient(90deg, #d6d9ff 0%, #fff 100%);--notification-success:linear-gradient(90deg, #c9f0b6 0%, #fff 100%);--notification-warning:linear-gradient(90deg, #fee0a3 0%, #fff 100%);--notification-error:linear-gradient(90deg, #ffb8b8 0%, #fff 100%);--gradient-blue-green:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-green-lime:linear-gradient(180deg, #a1e59c 0%, #d0f5b0 100%);--gradient-blue-violet:linear-gradient(180deg, #adb8ff 0%, #d6e9ff 100%);--gradient-blue-clear:linear-gradient(180deg, #85beff 0%, #cef 100%);--gradient-orange:linear-gradient(180deg, #ffb766 0%, #ffeaa3 100%);--gradient-mint:linear-gradient(180deg, #7dd1d1 0%, #c8fae9 100%);--gradient-lime:linear-gradient(180deg, #bfe062 0%, #e4ffad 100%);--gradient-rose:linear-gradient(0deg, #ffddd6 0%, #ff99c9 100%);--gradient-red:linear-gradient(0deg, #ffd5cc 0%, #ff9494 100%);--gradient-violet:linear-gradient(180deg, #bca3ff 0%, #e5e5ff 100%);--TT-gradient-violet:linear-gradient(180deg, #bca3ff 0%, #e5e5ff 100%);--gradient-light-lime:linear-gradient(180deg, #ebffeb 0%, transparent 100%);--shadow-l:0px 8px 16px -4px #0f244d29, 0px 12px 32px -4px #0f244d29;--main-spacing:24px;--gap-v:24px;--gap-h:12px;--border-radius:6px;--z-splash:50;--z-slide-shadow:80;--z-slide-dialog:81;--z-dialog:100;--z-dropdown-options:110;--z-tooltip:120;--z-context-menu:1001;--scrollbar-width:6px}[data-theme=dark]{--txt-00:#fff;--txt-01:#fff;--txt-02:#adaeb8;--txt-03:#60616b;--txt-mask:#3d3d42;--txt-focus:#87e087;--txt-error:#ff5c5c;--txt-link:#9470ff;--ic-00:#fff;--ic-01:#fff;--ic-02:#60616b;--ic-accent:#87e087;--border-color-default:#60616b;--border-color-hover:#adaeb8;--border-color-focus:#49cc49;--border-color-error:#ff5c5c;--border-color-div-grey:#232329;--border-color-div-bw:#000;--btn-accent-default:#5f31cc;--btn-accent-hover:#5f31cc;--btn-accent-press:#5f31cc;--btn-primary-default:#5f31cc;--btn-primary-hover:#6d3ddb;--btn-primary-press:#5328b8;--btn-sec-hover-white:#8383a329;--btn-sec-hover-grey:#8383a329;--btn-sec-press-grey:#8383a33d;--btn-active-select:#63e0243d;--btn-switcher:#5e5e70;--dis-00:#65656b;--dis-01:#3d3d42;--bg-base-dark:#0d0d0f;--bg-base-light:#0d0d0f;--bg-elevated-01:#1b1b1f;--bg-elevated-02:#2d2d33;--bg-error:#fff5f5;--filled-V-BG:#42b84266;--filled-D-BG:#e553e566;--filled-N-BG:#53526666;--filled-J-BG:#845cff66;--notification-neutral:linear-gradient(90deg, #4d4d8f 0%, #292933 100%);--notification-success:linear-gradient(90deg, #305c3e 0%, #292933 100%);--notification-warning:linear-gradient(90deg, #754f2d 0%, #292933 100%);--notification-error:linear-gradient(90deg, #8f3343 0%, #292933 100%);--gradient-blue-green:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-green-lime:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-blue-violet:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-blue-clear:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-orange:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-mint:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-lime:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-rose:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-red:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-violet:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%)}._root_sl0od_131{flex-direction:row;display:flex;position:relative}._item_sl0od_137{border-right:1px solid var(--border-color-div-grey);width:1000%;height:100%}._item_sl0od_137:last-child{border-right:none}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--txt-00:#fff;--txt-01:
|
|
1
|
+
:root{--txt-00:#fff;--txt-01:light-dark(#110529,#fff);--txt-02:#231842;--txt-03:#9d9eae;--txt-mask:#cfd1db;--txt-focus:#07ad3e;--txt-error:#f1222f;--txt-link:#5f31cc;--ic-00:#fff;--ic-01:#110529;--ic-02:#cfd1db;--ic-accent:#07ad3e;--border-color-default:#110529;--border-color-hover:#231842;--border-color-focus:#49cc49;--border-color-error:#ff5c5c;--border-color-div-grey:#e1e3eb;--border-color-div-bw:#fff;--btn-accent-default:#845cff;--btn-accent-hover:#9470ff;--btn-accent-press:#6f4dd6;--btn-primary-default:#110529;--btn-primary-hover:#231842;--btn-primary-press:#080214;--btn-sec-hover-white:#ffffff80;--btn-sec-hover-grey:light-dark(#9babcc29,#8383a329);--btn-sec-press-grey:#9babcc3d;--btn-active-select:#63e0243d;--btn-switcher:linear-gradient(180deg, #a1e59c 0%, #d0f5b0 100%);--btn-accent-positive-500:#ecfbe5;--dis-00:#fff;--dis-01:light-dark(#cfd1db,#3d3d42);--bg-base-dark:#110529;--bg-base-light:#f7f8fa;--bg-elevated-01:#fff;--bg-elevated-02:#e1e3eb;--bg-error:#fff5f5;--filled-V-BG:#d0f0c0;--filled-D-BG:#ffcecc;--filled-N-BG:#faf5aa;--filled-J-BG:#dedbff;--notification-neutral:linear-gradient(90deg, #d6d9ff 0%, #fff 100%);--notification-success:linear-gradient(90deg, #c9f0b6 0%, #fff 100%);--notification-warning:linear-gradient(90deg, #fee0a3 0%, #fff 100%);--notification-error:linear-gradient(90deg, #ffb8b8 0%, #fff 100%);--gradient-blue-green:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-green-lime:linear-gradient(180deg, #a1e59c 0%, #d0f5b0 100%);--gradient-blue-violet:linear-gradient(180deg, #adb8ff 0%, #d6e9ff 100%);--gradient-blue-clear:linear-gradient(180deg, #85beff 0%, #cef 100%);--gradient-orange:linear-gradient(180deg, #ffb766 0%, #ffeaa3 100%);--gradient-mint:linear-gradient(180deg, #7dd1d1 0%, #c8fae9 100%);--gradient-lime:linear-gradient(180deg, #bfe062 0%, #e4ffad 100%);--gradient-rose:linear-gradient(0deg, #ffddd6 0%, #ff99c9 100%);--gradient-red:linear-gradient(0deg, #ffd5cc 0%, #ff9494 100%);--gradient-violet:linear-gradient(180deg, #bca3ff 0%, #e5e5ff 100%);--TT-gradient-violet:linear-gradient(180deg, #bca3ff 0%, #e5e5ff 100%);--gradient-light-lime:linear-gradient(180deg, #ebffeb 0%, transparent 100%);--shadow-l:0px 8px 16px -4px #0f244d29, 0px 12px 32px -4px #0f244d29;--main-spacing:24px;--gap-v:24px;--gap-h:12px;--border-radius:6px;--z-splash:50;--z-slide-shadow:80;--z-slide-dialog:81;--z-dialog:100;--z-dropdown-options:110;--z-tooltip:120;--z-context-menu:1001;--scrollbar-width:6px}[data-theme=dark]{--txt-00:#fff;--txt-01:#fff;--txt-02:#adaeb8;--txt-03:#60616b;--txt-mask:#3d3d42;--txt-focus:#87e087;--txt-error:#ff5c5c;--txt-link:#9470ff;--ic-00:#fff;--ic-01:#fff;--ic-02:#60616b;--ic-accent:#87e087;--border-color-default:#60616b;--border-color-hover:#adaeb8;--border-color-focus:#49cc49;--border-color-error:#ff5c5c;--border-color-div-grey:#232329;--border-color-div-bw:#000;--btn-accent-default:#5f31cc;--btn-accent-hover:#5f31cc;--btn-accent-press:#5f31cc;--btn-primary-default:#5f31cc;--btn-primary-hover:#6d3ddb;--btn-primary-press:#5328b8;--btn-sec-hover-white:#8383a329;--btn-sec-hover-grey:#8383a329;--btn-sec-press-grey:#8383a33d;--btn-active-select:#63e0243d;--btn-switcher:#5e5e70;--dis-00:#65656b;--dis-01:#3d3d42;--bg-base-dark:#0d0d0f;--bg-base-light:#0d0d0f;--bg-elevated-01:#1b1b1f;--bg-elevated-02:#2d2d33;--bg-error:#fff5f5;--filled-V-BG:#42b84266;--filled-D-BG:#e553e566;--filled-N-BG:#53526666;--filled-J-BG:#845cff66;--notification-neutral:linear-gradient(90deg, #4d4d8f 0%, #292933 100%);--notification-success:linear-gradient(90deg, #305c3e 0%, #292933 100%);--notification-warning:linear-gradient(90deg, #754f2d 0%, #292933 100%);--notification-error:linear-gradient(90deg, #8f3343 0%, #292933 100%);--gradient-blue-green:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-green-lime:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-blue-violet:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-blue-clear:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-orange:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-mint:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-lime:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-rose:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-red:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%);--gradient-violet:linear-gradient(0deg, #478063 0%, #2e4652 45.93%, #24223d 91.63%)}._root_l9wjt_131{flex-direction:column;display:flex;position:relative}._close_l9wjt_137{cursor:pointer;padding:8px;position:absolute;top:8px;right:8px}._header_l9wjt_145{padding:24px}._body_l9wjt_149{flex-grow:1;padding:24px;overflow-y:auto}._footer_l9wjt_155{border-top:1px solid var(--border-color-div-grey);padding:24px}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlPureSlideModal.js","names":[],"sources":["../../../src/components/PlSlideModal/PlPureSlideModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n name: \"PlPureSlideModal\",\n inheritAttrs: false,\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-slide-modal.scss\";\nimport { ref, useAttrs } from \"vue\";\nimport
|
|
1
|
+
{"version":3,"file":"PlPureSlideModal.js","names":[],"sources":["../../../src/components/PlSlideModal/PlPureSlideModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n name: \"PlPureSlideModal\",\n inheritAttrs: false,\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-slide-modal.scss\";\n\nimport { ref, useAttrs } from \"vue\";\nimport { useClickOutside } from \"../../composition/useClickOutside\";\nimport { useEventListener } from \"../../composition/useEventListener\";\nimport PlCloseModalBtn from \"../../utils/PlCloseModalBtn.vue\";\nimport TransitionSlidePanel from \"../TransitionSlidePanel.vue\";\nimport type { Props } from \"./props\";\nimport { defaultProps } from \"./props\";\n\nconst emit = defineEmits<{\n (e: \"update:modelValue\", value: boolean): void;\n}>();\n\nconst modal = ref();\nconst attrs = useAttrs();\nconst props = withDefaults(defineProps<Props>(), defaultProps);\n\nuseClickOutside(modal, () => {\n if (props.modelValue && props.closeOnOutsideClick) {\n emit(\"update:modelValue\", false);\n }\n});\n\nuseEventListener(document, \"keydown\", (evt: KeyboardEvent) => {\n if (evt.key === \"Escape\") {\n emit(\"update:modelValue\", false);\n }\n});\n</script>\n\n<template>\n <Teleport to=\"body\">\n <TransitionSlidePanel>\n <div\n v-if=\"props.modelValue\"\n ref=\"modal\"\n class=\"pl-slide-modal\"\n :style=\"{ width: props.width }\"\n v-bind=\"attrs\"\n @keyup.esc=\"emit('update:modelValue', false)\"\n >\n <PlCloseModalBtn class=\"close-dialog-btn\" @click=\"emit('update:modelValue', false)\" />\n <slot />\n </div>\n </TransitionSlidePanel>\n <div\n v-if=\"props.modelValue && props.shadow\"\n class=\"pl-slide-modal__shadow\"\n @keyup.esc=\"emit('update:modelValue', false)\"\n />\n </Teleport>\n</template>\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlPureSlideModal.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlSlideModal/PlPureSlideModal.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PlPureSlideModal.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlSlideModal/PlPureSlideModal.vue"],"names":[],"mappings":"AA+DA,OAAO,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;qBAwGP,GAAG;;AApGjC,wBAqJK;AAcL,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { useEventListener as e } from "../../composition/useEventListener.js";
|
|
2
2
|
import { useClickOutside as t } from "../../composition/useClickOutside.js";
|
|
3
|
+
import n from "../../utils/PlCloseModalBtn.js";
|
|
3
4
|
import './pl-slide-modal.css';/* empty css */
|
|
4
|
-
import
|
|
5
|
-
import { defaultProps as
|
|
6
|
-
import { Teleport as
|
|
5
|
+
import r from "../TransitionSlidePanel.js";
|
|
6
|
+
import { defaultProps as i } from "./props.js";
|
|
7
|
+
import { Teleport as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createVNode as l, defineComponent as u, mergeDefaults as d, mergeProps as f, openBlock as p, ref as m, renderSlot as h, unref as g, useAttrs as _, withCtx as v, withKeys as y } from "vue";
|
|
7
8
|
var b = /* @__PURE__ */ u({
|
|
8
9
|
name: "PlPureSlideModal",
|
|
9
10
|
inheritAttrs: !1,
|
|
@@ -12,31 +13,31 @@ var b = /* @__PURE__ */ u({
|
|
|
12
13
|
width: {},
|
|
13
14
|
shadow: { type: Boolean },
|
|
14
15
|
closeOnOutsideClick: { type: Boolean }
|
|
15
|
-
},
|
|
16
|
+
}, i),
|
|
16
17
|
emits: ["update:modelValue"],
|
|
17
|
-
setup(
|
|
18
|
-
let d = u, b = m(), x = _(), S =
|
|
18
|
+
setup(i, { emit: u }) {
|
|
19
|
+
let d = u, b = m(), x = _(), S = i;
|
|
19
20
|
return t(b, () => {
|
|
20
21
|
S.modelValue && S.closeOnOutsideClick && d("update:modelValue", !1);
|
|
21
22
|
}), e(document, "keydown", (e) => {
|
|
22
23
|
e.key === "Escape" && d("update:modelValue", !1);
|
|
23
|
-
}), (e, t) => (p(), a
|
|
24
|
-
default: v(() => [S.modelValue ? (p(),
|
|
24
|
+
}), (e, t) => (p(), o(a, { to: "body" }, [l(r, null, {
|
|
25
|
+
default: v(() => [S.modelValue ? (p(), c("div", f({
|
|
25
26
|
key: 0,
|
|
26
27
|
ref_key: "modal",
|
|
27
28
|
ref: b,
|
|
28
29
|
class: "pl-slide-modal",
|
|
29
30
|
style: { width: S.width }
|
|
30
|
-
}, g(x), { onKeyup: t[1] ||= y((e) => d("update:modelValue", !1), ["esc"]) }), [
|
|
31
|
+
}, g(x), { onKeyup: t[1] ||= y((e) => d("update:modelValue", !1), ["esc"]) }), [l(n, {
|
|
31
32
|
class: "close-dialog-btn",
|
|
32
33
|
onClick: t[0] ||= (e) => d("update:modelValue", !1)
|
|
33
|
-
}), h(e.$slots, "default")], 16)) :
|
|
34
|
+
}), h(e.$slots, "default")], 16)) : s("", !0)]),
|
|
34
35
|
_: 3
|
|
35
|
-
}), S.modelValue && S.shadow ? (p(),
|
|
36
|
+
}), S.modelValue && S.shadow ? (p(), c("div", {
|
|
36
37
|
key: 0,
|
|
37
38
|
class: "pl-slide-modal__shadow",
|
|
38
39
|
onKeyup: t[2] ||= y((e) => d("update:modelValue", !1), ["esc"])
|
|
39
|
-
}, null, 32)) :
|
|
40
|
+
}, null, 32)) : s("", !0)]));
|
|
40
41
|
}
|
|
41
42
|
});
|
|
42
43
|
export { b as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlPureSlideModal.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlSlideModal/PlPureSlideModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n name: \"PlPureSlideModal\",\n inheritAttrs: false,\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-slide-modal.scss\";\nimport { ref, useAttrs } from \"vue\";\nimport
|
|
1
|
+
{"version":3,"file":"PlPureSlideModal.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlSlideModal/PlPureSlideModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n name: \"PlPureSlideModal\",\n inheritAttrs: false,\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-slide-modal.scss\";\n\nimport { ref, useAttrs } from \"vue\";\nimport { useClickOutside } from \"../../composition/useClickOutside\";\nimport { useEventListener } from \"../../composition/useEventListener\";\nimport PlCloseModalBtn from \"../../utils/PlCloseModalBtn.vue\";\nimport TransitionSlidePanel from \"../TransitionSlidePanel.vue\";\nimport type { Props } from \"./props\";\nimport { defaultProps } from \"./props\";\n\nconst emit = defineEmits<{\n (e: \"update:modelValue\", value: boolean): void;\n}>();\n\nconst modal = ref();\nconst attrs = useAttrs();\nconst props = withDefaults(defineProps<Props>(), defaultProps);\n\nuseClickOutside(modal, () => {\n if (props.modelValue && props.closeOnOutsideClick) {\n emit(\"update:modelValue\", false);\n }\n});\n\nuseEventListener(document, \"keydown\", (evt: KeyboardEvent) => {\n if (evt.key === \"Escape\") {\n emit(\"update:modelValue\", false);\n }\n});\n</script>\n\n<template>\n <Teleport to=\"body\">\n <TransitionSlidePanel>\n <div\n v-if=\"props.modelValue\"\n ref=\"modal\"\n class=\"pl-slide-modal\"\n :style=\"{ width: props.width }\"\n v-bind=\"attrs\"\n @keyup.esc=\"emit('update:modelValue', false)\"\n >\n <PlCloseModalBtn class=\"close-dialog-btn\" @click=\"emit('update:modelValue', false)\" />\n <slot />\n </div>\n </TransitionSlidePanel>\n <div\n v-if=\"props.modelValue && props.shadow\"\n class=\"pl-slide-modal__shadow\"\n @keyup.esc=\"emit('update:modelValue', false)\"\n />\n </Teleport>\n</template>\n"],"mappings":";;;;;;;;CAEE,MAAM;CACN,cAAc;;;;;;;;;EAehB,IAAM,IAAO,GAIP,IAAQ,GAAK,EACb,IAAQ,GAAU,EAClB,IAAQ;SAEd,EAAgB,SAAa;AAC3B,GAAI,EAAM,cAAc,EAAM,uBAC5B,EAAK,qBAAqB,GAAM;IAElC,EAEF,EAAiB,UAAU,YAAY,MAAuB;AAC5D,GAAI,EAAI,QAAQ,YACd,EAAK,qBAAqB,GAAM;IAElC,kBAIA,EAmBW,GAAA,EAnBD,IAAG,QAAM,EAAA,CACjB,EAYuB,GAAA,MAAA;oBADf,CATE,EAAM,cAAA,GAAA,EADd,EAUM,OAVN,EAUM;;aARA;IAAJ,KAAI;IACJ,OAAM;IACL,OAAK,EAAA,OAAW,EAAM,OAAK;MACpB,EAAA,EAAK,EAAA,EACZ,SAAK,AAAA,EAAA,OAAA,GAAA,MAAM,EAAI,qBAAA,GAAA,EAAA,CAAA,MAAA,CAAA,EAAA,CAAA,EAAA,CAEhB,EAAsF,GAAA;IAArE,OAAM;IAAoB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,qBAAA,GAAA;OACtD,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,GAAA,IAAA,EAAA,IAAA,GAAA,CAAA,CAAA;;MAIJ,EAAM,cAAc,EAAM,UAAA,GAAA,EADlC,EAIE,OAAA;;GAFA,OAAM;GACL,SAAK,AAAA,EAAA,OAAA,GAAA,MAAM,EAAI,qBAAA,GAAA,EAAA,CAAA,MAAA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.pl-slide-modal{--padding-top:0;--padding-bottom:0;top:var(--title-bar-height);z-index:var(--z-slide-dialog);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);will-change:transform;border-left:1px solid var(--div-grey);background-color:#fff;flex-direction:column;width:368px;min-width:368px;max-width:100%;display:flex;position:absolute;bottom:0;right:0;box-shadow:0 8px 16px -4px #0f244d29,0 12px 32px -4px #0f244d29}.pl-slide-modal .close-dialog-btn{
|
|
1
|
+
.pl-slide-modal{--padding-top:0;--padding-bottom:0;top:var(--title-bar-height);z-index:var(--z-slide-dialog);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);will-change:transform;border-left:1px solid var(--div-grey);background-color:#fff;flex-direction:column;width:368px;min-width:368px;max-width:100%;display:flex;position:absolute;bottom:0;right:0;box-shadow:0 8px 16px -4px #0f244d29,0 12px 32px -4px #0f244d29}.pl-slide-modal .close-dialog-btn{position:absolute;top:12px;right:12px}.pl-slide-modal.has-title{--padding-top:0}.pl-slide-modal.has-actions{--padding-bottom:0}.pl-slide-modal__title{font-family:var(--font-family-base);letter-spacing:-.56px;align-items:center;width:100%;padding:24px;font-size:28px;font-style:normal;font-weight:500;line-height:40px;display:flex;overflow:hidden}.pl-slide-modal__title-content{-webkit-line-clamp:2;text-overflow:ellipsis;word-break:break-word;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.pl-slide-modal__actions{align-items:center;gap:6px;min-height:88px;padding:0 24px;display:flex}.pl-slide-modal__actions button{min-width:160px}.pl-slide-modal__content{padding:16px calc(24px - var(--scrollbar-width)) 16px 24px;--thumb-color:var(--ic-02);scrollbar-gutter:stable;flex-direction:column;flex:1;gap:24px;margin:0;display:flex;overflow-y:auto}.pl-slide-modal__content::-webkit-scrollbar{width:var(--scrollbar-width,6px);background-color:#0000;height:5px;display:block}.pl-slide-modal__content::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-slide-modal__content::-webkit-scrollbar-thumb:hover{--thumb-color:var(--border-color-focus)}.pl-slide-modal__shadow{z-index:var(--z-slide-shadow);top:var(--title-bar-height);background-color:#000000a3;position:absolute;bottom:0;left:0;right:0}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import e from "./pl-splash.module.js";
|
|
2
2
|
import t from "../PlLoaderCircular/PlLoaderCircular.js";
|
|
3
|
+
import "../PlLoaderCircular/index.js";
|
|
3
4
|
import { createCommentVNode as n, createElementBlock as r, createElementVNode as i, createVNode as a, defineComponent as o, normalizeClass as s, openBlock as c, renderSlot as l, toDisplayString as u, unref as d } from "vue";
|
|
4
5
|
var f = /* @__PURE__ */ o({
|
|
5
6
|
__name: "PlSplash",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlSplash.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlSplash/PlSplash.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport style from \"./pl-splash.module.scss\";\nimport { PlLoaderCircular } from \"../PlLoaderCircular\";\n\nwithDefaults(\n defineProps<{\n /**\n * Optional string that sets text that will be shown below the PlLoaderCircular.\n */\n loadingText?: string;\n /**\n * If `true` the loading overlay is shown.\n */\n loading?: boolean;\n /**\n * @TODO\n */\n type?: \"table\" | \"transparent\";\n }>(),\n { loadingText: undefined, loading: false, type: undefined },\n);\n</script>\n\n<template>\n <div\n :class=\"[\n style.splash,\n { [style.table]: type === 'table', [style.transparent]: type === 'transparent' },\n ]\"\n >\n <div v-if=\"loading\" :class=\"[style.overlay]\">\n <div>\n <!-- @TODO refactor PlLoaderCircular size property -->\n <PlLoaderCircular size=\"48\" />\n <div v-if=\"loadingText\" :class=\"style.text\">{{ loadingText }}</div>\n </div>\n </div>\n <slot />\n </div>\n</template>\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PlSplash.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlSplash/PlSplash.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport style from \"./pl-splash.module.scss\";\nimport { PlLoaderCircular } from \"../PlLoaderCircular\";\n\nwithDefaults(\n defineProps<{\n /**\n * Optional string that sets text that will be shown below the PlLoaderCircular.\n */\n loadingText?: string;\n /**\n * If `true` the loading overlay is shown.\n */\n loading?: boolean;\n /**\n * @TODO\n */\n type?: \"table\" | \"transparent\";\n }>(),\n { loadingText: undefined, loading: false, type: undefined },\n);\n</script>\n\n<template>\n <div\n :class=\"[\n style.splash,\n { [style.table]: type === 'table', [style.transparent]: type === 'transparent' },\n ]\"\n >\n <div v-if=\"loading\" :class=\"[style.overlay]\">\n <div>\n <!-- @TODO refactor PlLoaderCircular size property -->\n <PlLoaderCircular size=\"48\" />\n <div v-if=\"loadingText\" :class=\"style.text\">{{ loadingText }}</div>\n </div>\n </div>\n <slot />\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;yBAwBE,EAcM,OAAA,EAbH,OAAK,EAAA,CAAU,EAAA,EAAK,CAAC,QAAA;IAAiB,EAAA,EAAK,CAAC,QAAQ,EAAA,SAAI;IAAe,EAAA,EAAK,CAAC,cAAc,EAAA,SAAI;GAAA,CAAA,CAAA,EAAA,EAAA,CAKrF,EAAA,WAAA,GAAA,EAAX,EAMM,OAAA;;GANe,OAAK,EAAA,CAAG,EAAA,EAAK,CAAC,QAAO,CAAA;MACxC,EAIM,OAAA,MAAA,CAFJ,EAA8B,EAAA,EAAA,EAAA,EAAZ,MAAK,MAAI,CAAA,EAChB,EAAA,eAAA,GAAA,EAAX,EAAmE,OAAA;;GAA1C,OAAK,EAAE,EAAA,EAAK,CAAC,KAAI;OAAK,EAAA,YAAW,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,CAAA,CAAA,CAAA,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,EAG9D,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,EAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlSplash.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._splash_itlwi_1{--pl-splash-overlay-background:#fffffff0;position:relative}._splash_itlwi_1._table_itlwi_5{--pl-splash-overlay-background:var(--bg-base-light)}._splash_itlwi_1._transparent_itlwi_8{--pl-splash-overlay-background:transparent}._splash_itlwi_1 ._overlay_itlwi_11{background:var(--pl-splash-overlay-background);z-index:var(--z-splash);flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}._splash_itlwi_1 ._overlay_itlwi_11>div{flex-direction:column;gap:24px;display:flex}._splash_itlwi_1 ._overlay_itlwi_11>div ._text_itlwi_29{
|
|
1
|
+
._splash_itlwi_1{--pl-splash-overlay-background:#fffffff0;position:relative}._splash_itlwi_1._table_itlwi_5{--pl-splash-overlay-background:var(--bg-base-light)}._splash_itlwi_1._transparent_itlwi_8{--pl-splash-overlay-background:transparent}._splash_itlwi_1 ._overlay_itlwi_11{background:var(--pl-splash-overlay-background);z-index:var(--z-splash);flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}._splash_itlwi_1 ._overlay_itlwi_11>div{flex-direction:column;gap:24px;display:flex}._splash_itlwi_1 ._overlay_itlwi_11>div ._text_itlwi_29{user-select:none;color:var(--txt-mask);font-family:var(--font-family-base);letter-spacing:-.56px;margin:0;font-size:28px;font-style:normal;font-weight:500;line-height:32px}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlStatusTag.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlSvg.js";
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import e from "../PlTooltip/PlTooltip.js";
|
|
2
|
+
import "../PlTooltip/index.js";
|
|
2
3
|
import { createBlock as t, createTextVNode as n, defineComponent as r, onMounted as i, openBlock as a, reactive as o, ref as s, renderSlot as c, toDisplayString as l, unref as u, withCtx as d } from "vue";
|
|
3
4
|
var f = /* @__PURE__ */ r({
|
|
4
5
|
__name: "Tab",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tab.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlTabs/Tab.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { onMounted, unref, ref, reactive } from \"vue\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport type { TabOption } from \"./types\";\n\nconst rootRef = ref<{ $el: HTMLElement }>();\n\ndefineProps<{\n option: TabOption;\n}>();\n\nconst data = reactive({\n isOverflown: false,\n});\n\nonMounted(() => {\n const root = unref(rootRef);\n\n if (!root) {\n return;\n }\n\n const el = root.$el.querySelector(\"span\") as HTMLElement | null;\n\n if (!el) {\n return;\n }\n\n requestAnimationFrame(() => {\n if (el.offsetWidth < el.scrollWidth) {\n data.isOverflown = true;\n }\n });\n});\n</script>\n\n<template>\n <PlTooltip\n ref=\"rootRef\"\n element=\"div\"\n position=\"top\"\n :hide=\"!data.isOverflown\"\n :close-delay=\"300\"\n :data-is-overflown=\"data.isOverflown ? 'true' : 'false'\"\n >\n <slot />\n <template #tooltip>\n {{ option.label }}\n </template>\n </PlTooltip>\n</template>\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Tab.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlTabs/Tab.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { onMounted, unref, ref, reactive } from \"vue\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport type { TabOption } from \"./types\";\n\nconst rootRef = ref<{ $el: HTMLElement }>();\n\ndefineProps<{\n option: TabOption;\n}>();\n\nconst data = reactive({\n isOverflown: false,\n});\n\nonMounted(() => {\n const root = unref(rootRef);\n\n if (!root) {\n return;\n }\n\n const el = root.$el.querySelector(\"span\") as HTMLElement | null;\n\n if (!el) {\n return;\n }\n\n requestAnimationFrame(() => {\n if (el.offsetWidth < el.scrollWidth) {\n data.isOverflown = true;\n }\n });\n});\n</script>\n\n<template>\n <PlTooltip\n ref=\"rootRef\"\n element=\"div\"\n position=\"top\"\n :hide=\"!data.isOverflown\"\n :close-delay=\"300\"\n :data-is-overflown=\"data.isOverflown ? 'true' : 'false'\"\n >\n <slot />\n <template #tooltip>\n {{ option.label }}\n </template>\n </PlTooltip>\n</template>\n"],"mappings":";;;;;;;EAKA,IAAM,IAAU,GAA2B,EAMrC,IAAO,EAAS,EACpB,aAAa,IACd,CAAC;SAEF,QAAgB;GACd,IAAM,IAAO,EAAM,EAAQ;AAE3B,OAAI,CAAC,EACH;GAGF,IAAM,IAAK,EAAK,IAAI,cAAc,OAAO;AAEpC,QAIL,4BAA4B;AAC1B,IAAI,EAAG,cAAc,EAAG,gBACtB,EAAK,cAAc;KAErB;IACF,kBAIA,EAYY,EAAA,EAAA,EAAA;YAXN;GAAJ,KAAI;GACJ,SAAQ;GACR,UAAS;GACR,MAAI,CAAG,EAAK;GACZ,eAAa;GACb,qBAAmB,EAAK,cAAW,SAAA;;GAGzB,SAAO,QACE,CAAA,EAAA,EAAf,EAAA,OAAO,MAAK,EAAA,EAAA,CAAA,CAAA;oBAFT,CAAR,EAAQ,EAAA,QAAA,UAAA,CAAA,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlTabs.js";
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import e from "../PlTooltip/PlTooltip.js";
|
|
2
|
+
import "../PlTooltip/index.js";
|
|
2
3
|
import { getErrorMessage as t } from "../../helpers/error.js";
|
|
3
4
|
import n from "../PlSvg/PlSvg.js";
|
|
5
|
+
import "../PlSvg/index.js";
|
|
4
6
|
import r from "../../utils/DoubleContour.js";
|
|
5
7
|
import { useLabelNotch as i } from "../../utils/useLabelNotch.js";
|
|
6
8
|
import a from "../../assets/images/required.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlTextArea.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlTextArea/PlTextArea.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Component for multi-line string data manipulation */\nexport default {\n name: \"PlTextArea\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-textarea.scss\";\nimport { computed, onMounted, ref, useSlots } from \"vue\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport { useValidation } from \"../../utils/useValidation\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport { PlSvg } from \"../PlSvg\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\n\nconst slots = useSlots();\n\nconst emit = defineEmits<{\n /**\n * Emitted when the model value is updated.\n */\n (e: \"update:modelValue\", value: string): void;\n}>();\n\nconst props = defineProps<{\n /**\n * The current value of the texarea.\n */\n modelValue?: string;\n /**\n * The label to display above the texarea.\n */\n label?: string;\n /**\n * If `true`, the textarea is marked as required.\n */\n required?: boolean;\n /**\n * An error message to display below the textarea.\n */\n error?: unknown;\n /**\n * A helper text to display below the textarea when there are no errors.\n */\n helper?: string;\n /**\n * A placeholder text to display inside the textarea when it is empty.\n */\n placeholder?: string;\n /**\n * If `true`, the textarea is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n /**\n * If `true`, the textarea is in a read-only state and cannot be edited, but it can still be focused and text can be selected.\n */\n readonly?: boolean;\n /**\n * If `true`, applies a dashed border style to the textarea, likely used for stylistic purposes or to indicate a certain state.\n */\n dashed?: boolean;\n /**\n * The number of visible text lines for the textarea, which controls the height of the textarea.\n */\n rows?: number;\n /**\n * If `true`, the textarea automatically adjusts its height to fit the content as the user types.\n */\n autogrow?: boolean;\n /**\n * An array of validation rules that are applied to the textarea input. Each rule is a function that receives the input value and returns `true` for valid input or an error message string for invalid input.\n */\n rules?: ((v: string) => boolean | string)[];\n}>();\n\nconst root = ref<HTMLInputElement>();\nconst input = ref<HTMLTextAreaElement>();\n\nconst value = computed({\n get() {\n return props.modelValue ?? \"\";\n },\n set(v) {\n emit(\"update:modelValue\", v);\n },\n});\n\nconst nonEmpty = computed(() => !!props.modelValue);\nconst validationData = useValidation(value, props.rules || []);\n\nuseLabelNotch(root);\n\nconst displayErrors = computed(() => {\n const errors: string[] = [];\n const propsError = getErrorMessage(props.error);\n\n if (propsError) {\n errors.push(propsError);\n }\n\n errors.push(...validationData.value.errors);\n\n return errors;\n});\n\nconst hasErrors = computed(() => displayErrors.value.length > 0);\n\nconst adjustHeight = () => {\n if (!props.autogrow) {\n return;\n }\n const el = input.value;\n if (el) {\n el.style.height = \"auto\"; // it works, do not delete it\n el.style.height = `${el.scrollHeight}px`; // Set height based on scrollHeight\n }\n};\n\nonMounted(() => {\n adjustHeight();\n});\n</script>\n\n<template>\n <div class=\"ui-text-area__envelope\">\n <div ref=\"root\" class=\"ui-text-area\" :class=\"{ error: hasErrors, disabled, dashed, nonEmpty }\">\n <label v-if=\"label\" ref=\"label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n <span>{{ label }}</span>\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <textarea\n ref=\"input\"\n v-model=\"value\"\n :readonly=\"readonly\"\n :rows=\"rows\"\n :disabled=\"disabled\"\n :placeholder=\"placeholder ?? '...'\"\n spellcheck=\"false\"\n @input=\"adjustHeight\"\n />\n <div class=\"ui-text-area__append\">\n <slot name=\"append\" />\n </div>\n <DoubleContour class=\"ui-text-area__contour\" />\n </div>\n <div v-if=\"hasErrors\" class=\"ui-text-area__error\">\n {{ displayErrors.join(\" \") }}\n </div>\n <div v-else-if=\"helper\" class=\"ui-text-area__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PlTextArea.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlTextArea/PlTextArea.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Component for multi-line string data manipulation */\nexport default {\n name: \"PlTextArea\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-textarea.scss\";\nimport { computed, onMounted, ref, useSlots } from \"vue\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport { useValidation } from \"../../utils/useValidation\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport { PlSvg } from \"../PlSvg\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\n\nconst slots = useSlots();\n\nconst emit = defineEmits<{\n /**\n * Emitted when the model value is updated.\n */\n (e: \"update:modelValue\", value: string): void;\n}>();\n\nconst props = defineProps<{\n /**\n * The current value of the texarea.\n */\n modelValue?: string;\n /**\n * The label to display above the texarea.\n */\n label?: string;\n /**\n * If `true`, the textarea is marked as required.\n */\n required?: boolean;\n /**\n * An error message to display below the textarea.\n */\n error?: unknown;\n /**\n * A helper text to display below the textarea when there are no errors.\n */\n helper?: string;\n /**\n * A placeholder text to display inside the textarea when it is empty.\n */\n placeholder?: string;\n /**\n * If `true`, the textarea is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n /**\n * If `true`, the textarea is in a read-only state and cannot be edited, but it can still be focused and text can be selected.\n */\n readonly?: boolean;\n /**\n * If `true`, applies a dashed border style to the textarea, likely used for stylistic purposes or to indicate a certain state.\n */\n dashed?: boolean;\n /**\n * The number of visible text lines for the textarea, which controls the height of the textarea.\n */\n rows?: number;\n /**\n * If `true`, the textarea automatically adjusts its height to fit the content as the user types.\n */\n autogrow?: boolean;\n /**\n * An array of validation rules that are applied to the textarea input. Each rule is a function that receives the input value and returns `true` for valid input or an error message string for invalid input.\n */\n rules?: ((v: string) => boolean | string)[];\n}>();\n\nconst root = ref<HTMLInputElement>();\nconst input = ref<HTMLTextAreaElement>();\n\nconst value = computed({\n get() {\n return props.modelValue ?? \"\";\n },\n set(v) {\n emit(\"update:modelValue\", v);\n },\n});\n\nconst nonEmpty = computed(() => !!props.modelValue);\nconst validationData = useValidation(value, props.rules || []);\n\nuseLabelNotch(root);\n\nconst displayErrors = computed(() => {\n const errors: string[] = [];\n const propsError = getErrorMessage(props.error);\n\n if (propsError) {\n errors.push(propsError);\n }\n\n errors.push(...validationData.value.errors);\n\n return errors;\n});\n\nconst hasErrors = computed(() => displayErrors.value.length > 0);\n\nconst adjustHeight = () => {\n if (!props.autogrow) {\n return;\n }\n const el = input.value;\n if (el) {\n el.style.height = \"auto\"; // it works, do not delete it\n el.style.height = `${el.scrollHeight}px`; // Set height based on scrollHeight\n }\n};\n\nonMounted(() => {\n adjustHeight();\n});\n</script>\n\n<template>\n <div class=\"ui-text-area__envelope\">\n <div ref=\"root\" class=\"ui-text-area\" :class=\"{ error: hasErrors, disabled, dashed, nonEmpty }\">\n <label v-if=\"label\" ref=\"label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n <span>{{ label }}</span>\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <textarea\n ref=\"input\"\n v-model=\"value\"\n :readonly=\"readonly\"\n :rows=\"rows\"\n :disabled=\"disabled\"\n :placeholder=\"placeholder ?? '...'\"\n spellcheck=\"false\"\n @input=\"adjustHeight\"\n />\n <div class=\"ui-text-area__append\">\n <slot name=\"append\" />\n </div>\n <DoubleContour class=\"ui-text-area__contour\" />\n </div>\n <div v-if=\"hasErrors\" class=\"ui-text-area__error\">\n {{ displayErrors.join(\" \") }}\n </div>\n <div v-else-if=\"helper\" class=\"ui-text-area__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;CAGE,MAAM;;;;;;;;;;;;;;;;;EAeR,IAAM,IAAQ,GAAU,EAElB,IAAO,GAOP,IAAQ,GAmDR,IAAO,GAAuB,EAC9B,IAAQ,GAA0B,EAElC,IAAQ,EAAS;GACrB,MAAM;AACJ,WAAO,EAAM,cAAc;;GAE7B,IAAI,GAAG;AACL,MAAK,qBAAqB,EAAE;;GAE/B,CAAC,EAEI,IAAW,QAAe,CAAC,CAAC,EAAM,WAAW,EAC7C,IAAiB,EAAc,GAAO,EAAM,SAAS,EAAE,CAAC;AAE9D,IAAc,EAAK;EAEnB,IAAM,IAAgB,QAAe;GACnC,IAAM,IAAmB,EAAE,EACrB,IAAa,EAAgB,EAAM,MAAM;AAQ/C,UANI,KACF,EAAO,KAAK,EAAW,EAGzB,EAAO,KAAK,GAAG,EAAe,MAAM,OAAO,EAEpC;IACP,EAEI,IAAY,QAAe,EAAc,MAAM,SAAS,EAAE,EAE1D,UAAqB;AACzB,OAAI,CAAC,EAAM,SACT;GAEF,IAAM,IAAK,EAAM;AACjB,GAAI,MACF,EAAG,MAAM,SAAS,QAClB,EAAG,MAAM,SAAS,GAAG,EAAG,aAAa;;SAIzC,QAAgB;AACd,MAAc;IACd,kBAIA,EA8BM,OA9BN,GA8BM,CA7BJ,EAwBM,OAAA;YAxBG;GAAJ,KAAI;GAAO,OAAK,EAAA,CAAC,gBAAc;IAAA,OAAkB,EAAA;IAAS,UAAE,EAAA;IAAQ,QAAE,EAAA;IAAM,UAAE,EAAA;IAAQ,CAAA,CAAA;;GAC5E,EAAA,SAAA,GAAA,EAAb,EAQQ,SARR,GAQQ;IAPO,EAAA,YAAA,GAAA,EAAb,EAA4C,EAAA,EAAA,EAAA;;KAApB,KAAK,EAAA,EAAW;;IACxC,EAAwB,QAAA,MAAA,EAAf,EAAA,MAAK,EAAA,EAAA;IACG,EAAA,EAAK,CAAC,WAAA,GAAA,EAAvB,EAIY,EAAA,EAAA,EAAA;;KAJoB,OAAM;KAAO,UAAS;;KACzC,SAAO,QACO,CAAvB,EAAuB,EAAA,QAAA,UAAA,CAAA,CAAA;;;;KAI7B,EASE,YAAA;aARI;IAAJ,KAAI;6CACU,QAAA;IACb,UAAU,EAAA;IACV,MAAM,EAAA;IACN,UAAU,EAAA;IACV,aAAa,EAAA,eAAW;IACzB,YAAW;IACV,SAAO;yBANC,EAAA,MAAK,CAAA,CAAA;GAQhB,EAEM,OAFN,GAEM,CADJ,EAAsB,EAAA,QAAA,SAAA,CAAA,CAAA;GAExB,EAA+C,GAAA,EAAhC,OAAM,yBAAuB,CAAA;SAEnC,EAAA,SAAA,GAAA,EAAX,EAEM,OAFN,GAEM,EADD,EAAA,MAAc,KAAI,IAAA,CAAA,EAAA,EAAA,IAEP,EAAA,UAAA,GAAA,EAAhB,EAAuE,OAAvE,GAAuE,EAAf,EAAA,OAAM,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,CAAA,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlTextArea.js";
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
import e from "../PlTooltip/PlTooltip.js";
|
|
2
|
+
import "../PlTooltip/index.js";
|
|
2
3
|
import { getErrorMessage as t } from "../../helpers/error.js";
|
|
3
4
|
import n from "../PlSvg/PlSvg.js";
|
|
5
|
+
import "../PlSvg/index.js";
|
|
4
6
|
import r from "../PlIcon24/PlIcon24.js";
|
|
7
|
+
import "../PlIcon24/index.js";
|
|
5
8
|
import i from "../PlIcon16/PlIcon16.js";
|
|
6
9
|
import a from "../../utils/DoubleContour.js";
|
|
7
10
|
import { useLabelNotch as o } from "../../utils/useLabelNotch.js";
|
|
11
|
+
import "../PlIcon16/index.js";
|
|
8
12
|
import s from "../../assets/images/required.js";
|
|
9
13
|
import { useValidation as c } from "../../utils/useValidation.js";
|
|
10
14
|
import './pl-text-field.css';/* empty css */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlTextField.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlTextField/PlTextField.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Component for one-line string data manipulation\n */\nexport default {\n name: \"PlTextField\",\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M, E = string, C = E\">\nimport type { Equal } from \"@milaboratories/helpers\";\nimport { computed, reactive, ref, useSlots } from \"vue\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport { useValidation } from \"../../utils/useValidation\";\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlIcon24 } from \"../PlIcon24\";\nimport { PlSvg } from \"../PlSvg\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport \"./pl-text-field.scss\";\n\nconst slots = useSlots();\n\ntype Model = Equal<M, E | C> extends true ? M : never; // basically in === out\n\n/**\n * The current value of the input field.\n */\nconst model = defineModel<Model>({\n required: true,\n});\n\nconst props = defineProps<{\n /**\n * The label to display above the input field.\n */\n label?: string;\n /**\n * If `true`, a clear icon will appear in the input field to clear the value (set it to empty string).\n * Or you can pass a callback that returns a custom \"empty\" value (null | undefined | string)\n */\n clearable?: boolean | (() => C);\n /**\n * An optional callback to parse and/or cast the value, the return type overrides the model type.\n * The callback must throw an exception if the value is invalid\n */\n parse?: (v: string) => E;\n /**\n * If `true`, the input field is marked as required.\n */\n required?: boolean;\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 * A placeholder text to display inside the input field when it is empty.\n */\n placeholder?: string;\n /**\n * If `true`, the input field is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n /**\n * If `true`, the input field has a dashed border.\n */\n dashed?: boolean;\n /**\n * A prefix text to display inside the input field before the value.\n */\n prefix?: string;\n /**\n * An array of validation rules to apply to the input field. Each rule is a function that takes the current value and returns `true` if valid or an error message if invalid.\n */\n rules?: ((v: string) => boolean | string)[];\n /**\n * The string specifies whether the field should be a password or not, value could be \"password\" or undefined.\n */\n type?: \"password\";\n /**\n * Makes some of corners not rounded\n * */\n groupPosition?:\n | \"top\"\n | \"bottom\"\n | \"left\"\n | \"right\"\n | \"top-left\"\n | \"top-right\"\n | \"bottom-left\"\n | \"bottom-right\"\n | \"middle\";\n}>();\n\nconst rootRef = ref<HTMLInputElement | undefined>(undefined);\n\nconst inputRef = ref<HTMLInputElement | undefined>();\n\nconst showPassword = ref(false);\n\nconst data = reactive({\n cached: undefined as { error: string; value: string } | undefined,\n});\n\nconst valueRef = computed<string>({\n get() {\n if (data.cached) {\n return data.cached.value;\n }\n return model.value === undefined || model.value === null ? \"\" : String(model.value);\n },\n set(value) {\n data.cached = undefined;\n\n if (props.parse) {\n try {\n model.value = props.parse(value) as Model;\n } catch (err) {\n data.cached = {\n error: err instanceof Error ? err.message : String(err),\n value,\n };\n }\n } else {\n model.value = value as Model;\n }\n },\n});\n\nconst fieldType = computed(() => {\n if (props.type && props.type === \"password\") {\n return showPassword.value ? \"text\" : props.type;\n } else {\n return \"text\";\n }\n});\n\nconst passwordIcon = computed(() => (showPassword.value ? \"view-show\" : \"view-hide\"));\n\nconst clear = () => {\n if (props.clearable) {\n data.cached = undefined;\n model.value = props.clearable === true ? (\"\" as Model) : (props.clearable() as Model);\n }\n};\n\nconst validationData = useValidation(valueRef, props.rules || []);\n\nconst isEmpty = computed(() => {\n if (props.clearable) {\n return props.clearable === true ? model.value === \"\" : model.value === props.clearable();\n }\n\n return model.value === \"\";\n});\n\nconst nonEmpty = computed(() => !isEmpty.value);\n\nconst displayErrors = computed(() => {\n const errors: string[] = [];\n const propsError = getErrorMessage(props.error);\n if (propsError) {\n errors.push(propsError);\n }\n if (data.cached) {\n errors.push(data.cached.error);\n }\n if (!validationData.value.isValid) {\n errors.push(...validationData.value.errors);\n }\n return errors;\n});\n\nconst hasErrors = computed(() => displayErrors.value.length > 0);\n\nconst canShowClearable = computed(\n () => props.clearable && nonEmpty.value && props.type !== \"password\" && !props.disabled,\n);\n\nconst togglePasswordVisibility = () => (showPassword.value = !showPassword.value);\n\nconst onFocusOut = () => {\n data.cached = undefined;\n};\n\nconst setFocusOnInput = () => inputRef.value?.focus();\n\nuseLabelNotch(rootRef);\n</script>\n\n<template>\n <div class=\"pl-text-field__envelope\">\n <div\n ref=\"rootRef\"\n class=\"pl-text-field\"\n :class=\"{\n error: hasErrors,\n disabled,\n dashed,\n nonEmpty,\n }\"\n >\n <label v-if=\"label\" ref=\"label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n <span>{{ label }}</span>\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <div v-if=\"prefix\" class=\"pl-text-field__prefix\">\n {{ prefix }}\n </div>\n <input\n ref=\"inputRef\"\n v-model=\"valueRef\"\n :disabled=\"disabled\"\n :placeholder=\"placeholder || '...'\"\n :type=\"fieldType\"\n spellcheck=\"false\"\n @focusout=\"onFocusOut\"\n />\n <div class=\"pl-text-field__append\" @click=\"setFocusOnInput\">\n <PlIcon16\n v-if=\"canShowClearable\"\n class=\"pl-text-field__clearable\"\n name=\"delete-clear\"\n @click.stop=\"clear\"\n />\n <PlIcon24\n v-if=\"type === 'password'\"\n :name=\"passwordIcon\"\n style=\"cursor: pointer\"\n @click.stop=\"togglePasswordVisibility\"\n />\n <slot name=\"append\" />\n </div>\n <DoubleContour class=\"pl-text-field__contour\" :group-position=\"groupPosition\" />\n </div>\n <div v-if=\"hasErrors\" class=\"pl-text-field__error\">\n {{ displayErrors.join(\" \") }}\n </div>\n <div v-else-if=\"helper\" class=\"pl-text-field__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PlTextField.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlTextField/PlTextField.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Component for one-line string data manipulation\n */\nexport default {\n name: \"PlTextField\",\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M, E = string, C = E\">\nimport type { Equal } from \"@milaboratories/helpers\";\nimport { computed, reactive, ref, useSlots } from \"vue\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport DoubleContour from \"../../utils/DoubleContour.vue\";\nimport { useLabelNotch } from \"../../utils/useLabelNotch\";\nimport { useValidation } from \"../../utils/useValidation\";\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlIcon24 } from \"../PlIcon24\";\nimport { PlSvg } from \"../PlSvg\";\nimport { PlTooltip } from \"../PlTooltip\";\nimport \"./pl-text-field.scss\";\n\nconst slots = useSlots();\n\ntype Model = Equal<M, E | C> extends true ? M : never; // basically in === out\n\n/**\n * The current value of the input field.\n */\nconst model = defineModel<Model>({\n required: true,\n});\n\nconst props = defineProps<{\n /**\n * The label to display above the input field.\n */\n label?: string;\n /**\n * If `true`, a clear icon will appear in the input field to clear the value (set it to empty string).\n * Or you can pass a callback that returns a custom \"empty\" value (null | undefined | string)\n */\n clearable?: boolean | (() => C);\n /**\n * An optional callback to parse and/or cast the value, the return type overrides the model type.\n * The callback must throw an exception if the value is invalid\n */\n parse?: (v: string) => E;\n /**\n * If `true`, the input field is marked as required.\n */\n required?: boolean;\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 * A placeholder text to display inside the input field when it is empty.\n */\n placeholder?: string;\n /**\n * If `true`, the input field is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n /**\n * If `true`, the input field has a dashed border.\n */\n dashed?: boolean;\n /**\n * A prefix text to display inside the input field before the value.\n */\n prefix?: string;\n /**\n * An array of validation rules to apply to the input field. Each rule is a function that takes the current value and returns `true` if valid or an error message if invalid.\n */\n rules?: ((v: string) => boolean | string)[];\n /**\n * The string specifies whether the field should be a password or not, value could be \"password\" or undefined.\n */\n type?: \"password\";\n /**\n * Makes some of corners not rounded\n * */\n groupPosition?:\n | \"top\"\n | \"bottom\"\n | \"left\"\n | \"right\"\n | \"top-left\"\n | \"top-right\"\n | \"bottom-left\"\n | \"bottom-right\"\n | \"middle\";\n}>();\n\nconst rootRef = ref<HTMLInputElement | undefined>(undefined);\n\nconst inputRef = ref<HTMLInputElement | undefined>();\n\nconst showPassword = ref(false);\n\nconst data = reactive({\n cached: undefined as { error: string; value: string } | undefined,\n});\n\nconst valueRef = computed<string>({\n get() {\n if (data.cached) {\n return data.cached.value;\n }\n return model.value === undefined || model.value === null ? \"\" : String(model.value);\n },\n set(value) {\n data.cached = undefined;\n\n if (props.parse) {\n try {\n model.value = props.parse(value) as Model;\n } catch (err) {\n data.cached = {\n error: err instanceof Error ? err.message : String(err),\n value,\n };\n }\n } else {\n model.value = value as Model;\n }\n },\n});\n\nconst fieldType = computed(() => {\n if (props.type && props.type === \"password\") {\n return showPassword.value ? \"text\" : props.type;\n } else {\n return \"text\";\n }\n});\n\nconst passwordIcon = computed(() => (showPassword.value ? \"view-show\" : \"view-hide\"));\n\nconst clear = () => {\n if (props.clearable) {\n data.cached = undefined;\n model.value = props.clearable === true ? (\"\" as Model) : (props.clearable() as Model);\n }\n};\n\nconst validationData = useValidation(valueRef, props.rules || []);\n\nconst isEmpty = computed(() => {\n if (props.clearable) {\n return props.clearable === true ? model.value === \"\" : model.value === props.clearable();\n }\n\n return model.value === \"\";\n});\n\nconst nonEmpty = computed(() => !isEmpty.value);\n\nconst displayErrors = computed(() => {\n const errors: string[] = [];\n const propsError = getErrorMessage(props.error);\n if (propsError) {\n errors.push(propsError);\n }\n if (data.cached) {\n errors.push(data.cached.error);\n }\n if (!validationData.value.isValid) {\n errors.push(...validationData.value.errors);\n }\n return errors;\n});\n\nconst hasErrors = computed(() => displayErrors.value.length > 0);\n\nconst canShowClearable = computed(\n () => props.clearable && nonEmpty.value && props.type !== \"password\" && !props.disabled,\n);\n\nconst togglePasswordVisibility = () => (showPassword.value = !showPassword.value);\n\nconst onFocusOut = () => {\n data.cached = undefined;\n};\n\nconst setFocusOnInput = () => inputRef.value?.focus();\n\nuseLabelNotch(rootRef);\n</script>\n\n<template>\n <div class=\"pl-text-field__envelope\">\n <div\n ref=\"rootRef\"\n class=\"pl-text-field\"\n :class=\"{\n error: hasErrors,\n disabled,\n dashed,\n nonEmpty,\n }\"\n >\n <label v-if=\"label\" ref=\"label\">\n <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n <span>{{ label }}</span>\n <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n </PlTooltip>\n </label>\n <div v-if=\"prefix\" class=\"pl-text-field__prefix\">\n {{ prefix }}\n </div>\n <input\n ref=\"inputRef\"\n v-model=\"valueRef\"\n :disabled=\"disabled\"\n :placeholder=\"placeholder || '...'\"\n :type=\"fieldType\"\n spellcheck=\"false\"\n @focusout=\"onFocusOut\"\n />\n <div class=\"pl-text-field__append\" @click=\"setFocusOnInput\">\n <PlIcon16\n v-if=\"canShowClearable\"\n class=\"pl-text-field__clearable\"\n name=\"delete-clear\"\n @click.stop=\"clear\"\n />\n <PlIcon24\n v-if=\"type === 'password'\"\n :name=\"passwordIcon\"\n style=\"cursor: pointer\"\n @click.stop=\"togglePasswordVisibility\"\n />\n <slot name=\"append\" />\n </div>\n <DoubleContour class=\"pl-text-field__contour\" :group-position=\"groupPosition\" />\n </div>\n <div v-if=\"hasErrors\" class=\"pl-text-field__error\">\n {{ displayErrors.join(\" \") }}\n </div>\n <div v-else-if=\"helper\" class=\"pl-text-field__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlTextField.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlToggleSwitch.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./PlTooltip.js";
|
|
@@ -2,6 +2,7 @@ import { useMouseCapture as e } from "../composition/useMouseCapture.js";
|
|
|
2
2
|
import { tapIf as t } from "../helpers/functions.js";
|
|
3
3
|
import { clamp as n } from "../helpers/math.js";
|
|
4
4
|
import r from "./PlTooltip/PlTooltip.js";
|
|
5
|
+
import "./PlTooltip/index.js";
|
|
5
6
|
import { useSliderBreakpoints as i } from "../composition/useSliderBreakpoints.js";
|
|
6
7
|
import { getErrorMessage as a } from "../helpers/error.js";
|
|
7
8
|
import { Fragment as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, defineComponent as f, normalizeClass as p, normalizeStyle as m, openBlock as h, reactive as g, ref as _, renderList as v, renderSlot as y, toDisplayString as b, unref as x, useSlots as S, watch as C, withCtx as w } from "vue";
|