npm - @milaboratories/uikit - Versions diffs - 2.4.2 → 2.4.4 - Mend

@milaboratories/uikit 2.4.2 → 2.4.4

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

Files changed (1328) hide show

package/dist/components/PlChartStackedBar/StackedRowCompact.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StackedRowCompact.vue2.js","sources":["../../../src/components/PlChartStackedBar/StackedRowCompact.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue';\nimport type { PlChartStackedBarSegment } from './types';\n\nconst props = defineProps<{\n value: PlChartStackedBarSegment[];\n height?: number;\n}>();\n\nconst style = computed(() => ({\n height: props.height ?? '100%',\n minHeight: '24px',\n}));\n\nconst parts = computed(() => {\n const parts = props.value \|\| [];\n const total = parts.reduce((res, it) => res + it.value, 0);\n return parts.map((p) => {\n const fraction = (p.value / total) * 100;\n const label = p.label;\n return {\n color: p.color.toString(),\n description: p.description,\n fraction,\n label,\n };\n });\n});\n</script>\n\n<template>\n <div\n :class=\"[$style.component]\" :style=\"style\"\n >\n <div :class=\"$style.container\">\n <div v-if=\"!parts.length\" :class=\"$style.notReady\">Not ready</div>\n <div\n v-for=\"(p, i) in parts\"\n :key=\"i\"\n :title.prop=\"p.description ?? p.label\"\n :style=\"{\n width: `${p.fraction}%`,\n backgroundColor: p.color\n }\"\n />\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" module>\n.component {\n display: flex;\n position: relative;\n overflow: hidden;\n padding: 0;\n border-radius: 2px;\n\n .notReady {\n color: var(--txt-01);\n font-family: var(--font-family-base);\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 20px;\n }\n\n .container {\n position: relative;\n }\n}\n\n.container {\n display: flex;\n flex-direction: row;\n width: 100%;\n flex: 1;\n align-items: center;\n overflow: hidden;\n > div {\n height: 100%;\n display: flex;\n align-items: center;\n }\n}\n\n.notReady {\n color: var(--txt-03) !important;\n}\n</style>\n"],"names":["props","__props","style","computed","parts","total","res","it","p","fraction","label"],"mappings":";;;;;;;;AAIA,UAAMA,IAAQC,GAKRC,IAAQC,EAAS,OAAO;AAAA,MAC5B,QAAQH,EAAM,UAAU;AAAA,MACxB,WAAW;AAAA,IAAA,EACX,GAEII,IAAQD,EAAS,MAAM;~~AACrBC~~,~~YAAAA~~,IAAQJ,EAAM,SAAS,~~CAAC~~,~~GACxBK~~,IAAQD,EAAM,OAAO,CAACE,GAAKC,MAAOD,IAAMC,EAAG,OAAO,CAAC;~~AAClDH~~,~~aAAAA~~,EAAM,IAAI,CAACI,MAAM;~~AAChB~~,~~cAAAC~~,IAAYD,EAAE,QAAQH,IAAS,KAC/BK,IAAQF,EAAE;~~AACT~~,~~eAAA~~;AAAA,UACL,OAAOA,EAAE,MAAM,~~SAAS~~;AAAA,~~UACxB~~,aAAaA,EAAE;AAAA,UACf,UAAAC;AAAA,UACA,OAAAC;AAAA,~~QACF~~;AAAA,~~MAAA~~,~~CACD~~;AAAA,~~IAAA~~,~~CACF~~;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"StackedRowCompact.vue2.js","sources":["../../../src/components/PlChartStackedBar/StackedRowCompact.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue';\nimport type { PlChartStackedBarSegment } from './types';\n\nconst props = defineProps<{\n value: PlChartStackedBarSegment[];\n height?: number;\n}>();\n\nconst style = computed(() => ({\n height: props.height ?? '100%',\n minHeight: '24px',\n}));\n\nconst parts = computed(() => {\n const parts = props.value \|\| [];\n const total = parts.reduce((res, it) => res + it.value, 0);\n return parts.map((p) => {\n const fraction = (p.value / total) * 100;\n const label = p.label;\n return {\n color: p.color.toString(),\n description: p.description,\n fraction,\n label,\n };\n });\n});\n</script>\n\n<template>\n <div\n :class=\"[$style.component]\" :style=\"style\"\n >\n <div :class=\"$style.container\">\n <div v-if=\"!parts.length\" :class=\"$style.notReady\">Not ready</div>\n <div\n v-for=\"(p, i) in parts\"\n :key=\"i\"\n :title.prop=\"p.description ?? p.label\"\n :style=\"{\n width: `${p.fraction}%`,\n backgroundColor: p.color\n }\"\n />\n </div>\n </div>\n</template>\n\n<style lang=\"scss\" module>\n.component {\n display: flex;\n position: relative;\n overflow: hidden;\n padding: 0;\n border-radius: 2px;\n\n .notReady {\n color: var(--txt-01);\n font-family: var(--font-family-base);\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 20px;\n }\n\n .container {\n position: relative;\n }\n}\n\n.container {\n display: flex;\n flex-direction: row;\n width: 100%;\n flex: 1;\n align-items: center;\n overflow: hidden;\n > div {\n height: 100%;\n display: flex;\n align-items: center;\n }\n}\n\n.notReady {\n color: var(--txt-03) !important;\n}\n</style>\n"],"names":["props","__props","style","computed","parts","total","res","it","p","fraction","label"],"mappings":";;;;;;;;AAIA,UAAMA,IAAQC,GAKRC,IAAQC,EAAS,OAAO;AAAA,MAC5B,QAAQH,EAAM,UAAU;AAAA,MACxB,WAAW;AAAA,IAAA,EACX,GAEII,IAAQD,EAAS,MAAM;AAC3B,YAAMC,IAAQJ,EAAM,SAAS,CAAA,GACvBK,IAAQD,EAAM,OAAO,CAACE,GAAKC,MAAOD,IAAMC,EAAG,OAAO,CAAC;AACzD,aAAOH,EAAM,IAAI,CAACI,MAAM;AACtB,cAAMC,IAAYD,EAAE,QAAQH,IAAS,KAC/BK,IAAQF,EAAE;AAChB,eAAO;AAAA,UACL,OAAOA,EAAE,MAAM,SAAA;AAAA,UACf,aAAaA,EAAE;AAAA,UACf,UAAAC;AAAA,UACA,OAAAC;AAAA,QAAA;AAAA,MAEJ,CAAC;AAAA,IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/PlChartStackedBar/index.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
 export { default as PlChartStackedBar } from './PlChartStackedBar.vue';
 export { default as PlChartStackedBarCompact } from './PlChartStackedBarCompact.vue';
 export * from './types';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/PlChartStackedBar/types.d.ts CHANGED Viewed

@@ -29,4 +29,3 @@ export type PlChartStackedBarSettings = PlChartStackedBarSettingsCompact & {
      */
     showLegends?: boolean;
 };
-//# sourceMappingURL=types.d.ts.map

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

@@ -38,4 +38,3 @@ type __VLS_WithTemplateSlots<T, S> = T & {
         $slots: S;
     };
 };
-//# sourceMappingURL=PlCheckbox.vue.d.ts.map

package/dist/components/PlCheckbox/PlCheckbox.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlCheckbox.vue.js","sources":["../../../src/components/PlCheckbox/PlCheckbox.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Component for boolean model manipulation /\nexport default {\n name: 'PlCheckbox',\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { useSlots } from 'vue';\nimport './pl-checkbox.scss';\nimport PlCheckboxBase from './PlCheckboxBase.vue';\n\ndefineEmits<{\n /\n Emitted when the model value is updated.\n /\n (e: 'update:modelValue', value: boolean): void;\n}>();\n\nconst props = defineProps<{\n /\n The current boolean value of the checkbox.\n /\n modelValue: boolean;\n /\n If `true`, the checkbox is disabled and cannot be interacted with.\n /\n disabled?: boolean;\n /\n If `true`, the checkbox is indeterminate (doesn't affect the model value).\n */\n indeterminate?: boolean;\n}>();\n\nconst slots = useSlots();\n</script>\n\n<template>\n <div v-if=\"slots['default']\" class=\"pl-checkbox\" :class=\"{ disabled }\">\n <PlCheckboxBase v-bind=\"props\" @update:model-value=\"$emit('update:modelValue', $event)\" />\n <label @click=\"$emit('update:modelValue', !$props.modelValue)\"><slot /></label>\n </div>\n <PlCheckboxBase v-else v-bind=\"props\" @update:model-value=\"$emit('update:modelValue', $event)\" />\n</template>\n"],"names":["__default__","props","__props","slots","useSlots"],"mappings":";;;AAEA,~~MAAeA~~,~~IAAA~~;AAAA,EACb,MAAM;AACR;;;;;;;;;AAeA,UAAMC,IAAQC,GAeRC,IAAQC,~~EAAS~~;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"PlCheckbox.vue.js","sources":["../../../src/components/PlCheckbox/PlCheckbox.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Component for boolean model manipulation /\nexport default {\n name: 'PlCheckbox',\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { useSlots } from 'vue';\nimport './pl-checkbox.scss';\nimport PlCheckboxBase from './PlCheckboxBase.vue';\n\ndefineEmits<{\n /\n Emitted when the model value is updated.\n /\n (e: 'update:modelValue', value: boolean): void;\n}>();\n\nconst props = defineProps<{\n /\n The current boolean value of the checkbox.\n /\n modelValue: boolean;\n /\n If `true`, the checkbox is disabled and cannot be interacted with.\n /\n disabled?: boolean;\n /\n If `true`, the checkbox is indeterminate (doesn't affect the model value).\n */\n indeterminate?: boolean;\n}>();\n\nconst slots = useSlots();\n</script>\n\n<template>\n <div v-if=\"slots['default']\" class=\"pl-checkbox\" :class=\"{ disabled }\">\n <PlCheckboxBase v-bind=\"props\" @update:model-value=\"$emit('update:modelValue', $event)\" />\n <label @click=\"$emit('update:modelValue', !$props.modelValue)\"><slot /></label>\n </div>\n <PlCheckboxBase v-else v-bind=\"props\" @update:model-value=\"$emit('update:modelValue', $event)\" />\n</template>\n"],"names":["__default__","props","__props","slots","useSlots"],"mappings":";;;AAEA,MAAAA,IAAe;AAAA,EACb,MAAM;AACR;;;;;;;;;AAeA,UAAMC,IAAQC,GAeRC,IAAQC,EAAA;;;;;;;;;;;;;;;;;;"}

package/dist/components/PlCheckbox/PlCheckboxBase.vue.d.ts CHANGED Viewed

@@ -9,4 +9,3 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;
-//# sourceMappingURL=PlCheckboxBase.vue.d.ts.map

package/dist/components/PlCheckbox/__tests__/PlCheckbox.spec.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export {};

package/dist/components/PlCheckbox/index.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export { default as PlCheckbox } from './PlCheckbox.vue';
2	- //# sourceMappingURL=index.d.ts.map

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

@@ -38,4 +38,3 @@ export default _default;
 type __VLS_PrettifyLocal<T> = {
     [K in keyof T]: T[K];
 } & {};
-//# sourceMappingURL=PlCheckboxGroup.vue.d.ts.map

package/dist/components/PlCheckboxGroup/PlCheckboxGroup.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlCheckboxGroup.vue.js","sources":["../../../src/components/PlCheckboxGroup/PlCheckboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n Component for selecting multiple values from a list of options\n /\nexport default {\n name: 'PlCheckboxGroup',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport './pl-checkbox-group.scss';\nimport type { SimpleOption } from '../../types';\nimport PlCheckboxBase from '../PlCheckbox/PlCheckboxBase.vue';\nimport { PlTooltip } from '../PlTooltip';\nimport { useSlots } from 'vue';\n\nconst slots = useSlots();\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', v: M[]): void;\n}>();\n\nconst props = defineProps<{\n /\n The current selected values.\n /\n modelValue: M[];\n /\n The label text for the component (optional)\n /\n label?: string;\n /\n List of available options for the component\n /\n options: Readonly<SimpleOption<M>[]>;\n /\n If `true`, the component is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n}>();\n\nconst hasValue = (value: M) => {\n return props.modelValue.includes(value);\n};\n\nconst updateModel = (value: M) => {\n const values = props.modelValue ?? [];\n emit('update:modelValue', hasValue(value) ? values.filter((v) => v !== value) : [...values, value]);\n};\n</script>\n\n<template>\n <div class=\"pl-checkbox-group\" :class=\"{ disabled }\">\n <label v-if=\"label\">\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-for=\"(opt, i) in options.map((it) => ({ label: 'label' in it ? it.label : it.text, value: it.value }))\" :key=\"i\">\n <PlCheckboxBase :disabled=\"disabled\" :label=\"opt.label\" :model-value=\"hasValue(opt.value)\" @update:model-value=\"() => updateModel(opt.value)\" />\n <label @click.stop=\"() => updateModel(opt.value)\">{{ opt.label }}</label>\n </div>\n </div>\n</template>\n"],"names":["__default__","slots","useSlots","emit","__emit","props","__props","hasValue","value","updateModel","values","v"],"mappings":";;;;~~uCAIeA~~,~~IAAA~~;AAAA,EACb,MAAM;AACR;;;;;;;;;;AAUA,UAAMC,IAAQC,~~EAAS~~,~~GAEjBC~~,IAAOC,GAIPC,IAAQC,GAmBRC,IAAW,CAACC,MACTH,EAAM,WAAW,SAASG,CAAK,GAGlCC,IAAc,CAACD,MAAa;~~AAC1B~~,~~YAAAE~~,IAASL,EAAM,cAAc,~~CAAC~~;~~AACpC~~,MAAAF,EAAK,qBAAqBI,EAASC,CAAK,IAAIE,EAAO,OAAO,CAACC,MAAMA,MAAMH,CAAK,IAAI,CAAC,GAAGE,GAAQF,CAAK,CAAC;AAAA,IACpG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"PlCheckboxGroup.vue.js","sources":["../../../src/components/PlCheckboxGroup/PlCheckboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n Component for selecting multiple values from a list of options\n /\nexport default {\n name: 'PlCheckboxGroup',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport './pl-checkbox-group.scss';\nimport type { SimpleOption } from '../../types';\nimport PlCheckboxBase from '../PlCheckbox/PlCheckboxBase.vue';\nimport { PlTooltip } from '../PlTooltip';\nimport { useSlots } from 'vue';\n\nconst slots = useSlots();\n\nconst emit = defineEmits<{\n (e: 'update:modelValue', v: M[]): void;\n}>();\n\nconst props = defineProps<{\n /\n The current selected values.\n /\n modelValue: M[];\n /\n The label text for the component (optional)\n /\n label?: string;\n /\n List of available options for the component\n /\n options: Readonly<SimpleOption<M>[]>;\n /\n If `true`, the component is disabled and cannot be interacted with.\n */\n disabled?: boolean;\n}>();\n\nconst hasValue = (value: M) => {\n return props.modelValue.includes(value);\n};\n\nconst updateModel = (value: M) => {\n const values = props.modelValue ?? [];\n emit('update:modelValue', hasValue(value) ? values.filter((v) => v !== value) : [...values, value]);\n};\n</script>\n\n<template>\n <div class=\"pl-checkbox-group\" :class=\"{ disabled }\">\n <label v-if=\"label\">\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-for=\"(opt, i) in options.map((it) => ({ label: 'label' in it ? it.label : it.text, value: it.value }))\" :key=\"i\">\n <PlCheckboxBase :disabled=\"disabled\" :label=\"opt.label\" :model-value=\"hasValue(opt.value)\" @update:model-value=\"() => updateModel(opt.value)\" />\n <label @click.stop=\"() => updateModel(opt.value)\">{{ opt.label }}</label>\n </div>\n </div>\n</template>\n"],"names":["__default__","slots","useSlots","emit","__emit","props","__props","hasValue","value","updateModel","values","v"],"mappings":";;;;uCAIAA,IAAe;AAAA,EACb,MAAM;AACR;;;;;;;;;;AAUA,UAAMC,IAAQC,EAAA,GAERC,IAAOC,GAIPC,IAAQC,GAmBRC,IAAW,CAACC,MACTH,EAAM,WAAW,SAASG,CAAK,GAGlCC,IAAc,CAACD,MAAa;AAChC,YAAME,IAASL,EAAM,cAAc,CAAA;AACnC,MAAAF,EAAK,qBAAqBI,EAASC,CAAK,IAAIE,EAAO,OAAO,CAACC,MAAMA,MAAMH,CAAK,IAAI,CAAC,GAAGE,GAAQF,CAAK,CAAC;AAAA,IACpG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/PlCheckboxGroup/index.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export { default as PlCheckboxGroup } from './PlCheckboxGroup.vue';
2	- //# sourceMappingURL=index.d.ts.map

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

@@ -28,4 +28,3 @@ type __VLS_WithTemplateSlots<T, S> = T & {
         $slots: S;
     };
 };
-//# sourceMappingURL=PlChip.vue.d.ts.map

package/dist/components/PlChip/PlChip.vue.js CHANGED Viewed

@@ -1,4 +1,4 @@
-(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(`.pl-chip-tooltip{display:inline-flex}.pl-chip{--chip-color: var(--txt-01);position:relative;display:inline-flex;align-items:center;gap:4px;padding:0 8px;height:32px;background:var(--chip-bg);border:var(--chip-border);border-radius:6px;max-width:256px;font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weigh-base);letter-spacing:-.2px;color:var(--chip-color)}.pl-chip.small{height:24px;padding:0 6px;border-radius:4px}.pl-chip.large{height:40px;padding:0 12px;border-radius:6px}[data-theme=dark] .pl-chip{color:#fff}.pl-chip__text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.pl-chip__close{cursor:pointer;--mask-color: var(--chip-close-ic-color)}.pl-chip__close:hover{--mask-color: var(--chip-close-ic-hover-color)}.pl-chip__close:focus-visible{--mask-color: var(--chip-close-ic-hover-color);box-shadow:0 0 0 2px var(--border-color-focus);border-radius:1px;outline:none}.pl-chip__close--icon{background:var(--mask-color);mask-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M4.00001%202.93933L8.00001%206.93933L12%202.93933L13.0607%203.99999L9.06067%207.99999L13.0607%2012L12%2013.0607L8.00001%209.06065L4.00001%2013.0607L2.93935%2012L6.93935%207.99999L2.93935%203.99999L4.00001%202.93933Z'%20fill='%23110529'/%3e%3c/svg%3e");-webkit-mask-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M4.00001%202.93933L8.00001%206.93933L12%202.93933L13.0607%203.99999L9.06067%207.99999L13.0607%2012L12%2013.0607L8.00001%209.06065L4.00001%2013.0607L2.93935%2012L6.93935%207.99999L2.93935%203.99999L4.00001%202.93933Z'%20fill='%23110529'/%3e%3c/svg%3e");mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center;mask-size:16px;-webkit-mask-size:16px;width:16px;height:16px}`)),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
+(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(`.pl-chip-tooltip{display:inline-flex}.pl-chip{--chip-color: var(--txt-01);position:relative;display:inline-flex;align-items:center;gap:4px;padding:0 8px;height:32px;background:var(--chip-bg);border:var(--chip-border);border-radius:6px;max-width:256px;font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weigh-base);line-height:calc(var(--line-height-base) + 2px);letter-spacing:-.2px;color:var(--chip-color)}.pl-chip.small{height:24px;padding:0 6px;border-radius:4px}.pl-chip.large{height:40px;padding:0 12px;border-radius:6px}[data-theme=dark] .pl-chip{color:#fff}.pl-chip__text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.pl-chip__close{cursor:pointer;--mask-color: var(--chip-close-ic-color)}.pl-chip__close:hover{--mask-color: var(--chip-close-ic-hover-color)}.pl-chip__close:focus-visible{--mask-color: var(--chip-close-ic-hover-color);box-shadow:0 0 0 2px var(--border-color-focus);border-radius:1px;outline:none}.pl-chip__close--icon{background:var(--mask-color);mask-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M4.00001%202.93933L8.00001%206.93933L12%202.93933L13.0607%203.99999L9.06067%207.99999L13.0607%2012L12%2013.0607L8.00001%209.06065L4.00001%2013.0607L2.93935%2012L6.93935%207.99999L2.93935%203.99999L4.00001%202.93933Z'%20fill='%23110529'/%3e%3c/svg%3e");-webkit-mask-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M4.00001%202.93933L8.00001%206.93933L12%202.93933L13.0607%203.99999L9.06067%207.99999L13.0607%2012L12%2013.0607L8.00001%209.06065L4.00001%2013.0607L2.93935%2012L6.93935%207.99999L2.93935%203.99999L4.00001%202.93933Z'%20fill='%23110529'/%3e%3c/svg%3e");mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center;mask-size:16px;-webkit-mask-size:16px;width:16px;height:16px}`)),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
 import { defineComponent as c, ref as i, onMounted as m, createBlock as d, openBlock as n, unref as f, createSlots as u, withCtx as p, createElementVNode as t, normalizeClass as v, createElementBlock as h, createCommentVNode as y, renderSlot as a, withModifiers as _, withKeys as k } from "vue";
 import $ from "../PlTooltip/PlTooltip.vue.js";

package/dist/components/PlChip/PlChip.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlChip.vue.js","sources":["../../../src/components/PlChip/PlChip.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport './pl-chip.scss';\nimport { onMounted, ref } from 'vue';\nimport { PlTooltip } from '../PlTooltip';\n\ndefineEmits(['close']);\n\ndefineProps<{\n closeable?: boolean;\n small?: boolean;\n}>();\n\nconst chip = ref<HTMLElement>();\nconst canShowTooltip = ref(false);\n\nonMounted(() => {\n if (chip.value) {\n canShowTooltip.value = chip.value?.clientWidth >= 256;\n }\n});\n</script>\n\n<template>\n <PlTooltip position=\"top\" class=\"pl-chip-tooltip\" :delay=\"500\">\n <template v-if=\"canShowTooltip\" #tooltip>\n <slot />\n </template>\n <div ref=\"chip\" class=\"pl-chip\" :class=\"{ small }\">\n <div class=\"pl-chip__text\">\n <slot />\n </div>\n <div v-if=\"closeable\" tabindex=\"0\" class=\"pl-chip__close\" @keydown.enter=\"$emit('close')\" @click.stop=\"$emit('close')\">\n <div class=\"pl-chip__close--icon\" />\n </div>\n </div>\n </PlTooltip>\n</template>\n"],"names":["chip","ref","canShowTooltip","onMounted","_a"],"mappings":";;;;;;;;;;;AAYA,UAAMA,IAAOC,~~EAAiB~~,~~GACxBC~~,IAAiBD,EAAI,EAAK;AAEhC,WAAAE,EAAU,MAAM;;AACd,MAAIH,EAAK,~~UACQE~~,~~EAAA~~,UAAQE,IAAAJ,EAAK,UAAL,gBAAAI,EAAY,gBAAe;AAAA,~~IACpD~~,~~CACD~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"PlChip.vue.js","sources":["../../../src/components/PlChip/PlChip.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport './pl-chip.scss';\nimport { onMounted, ref } from 'vue';\nimport { PlTooltip } from '../PlTooltip';\n\ndefineEmits(['close']);\n\ndefineProps<{\n closeable?: boolean;\n small?: boolean;\n}>();\n\nconst chip = ref<HTMLElement>();\nconst canShowTooltip = ref(false);\n\nonMounted(() => {\n if (chip.value) {\n canShowTooltip.value = chip.value?.clientWidth >= 256;\n }\n});\n</script>\n\n<template>\n <PlTooltip position=\"top\" class=\"pl-chip-tooltip\" :delay=\"500\">\n <template v-if=\"canShowTooltip\" #tooltip>\n <slot />\n </template>\n <div ref=\"chip\" class=\"pl-chip\" :class=\"{ small }\">\n <div class=\"pl-chip__text\">\n <slot />\n </div>\n <div v-if=\"closeable\" tabindex=\"0\" class=\"pl-chip__close\" @keydown.enter=\"$emit('close')\" @click.stop=\"$emit('close')\">\n <div class=\"pl-chip__close--icon\" />\n </div>\n </div>\n </PlTooltip>\n</template>\n"],"names":["chip","ref","canShowTooltip","onMounted","_a"],"mappings":";;;;;;;;;;;AAYA,UAAMA,IAAOC,EAAA,GACPC,IAAiBD,EAAI,EAAK;AAEhC,WAAAE,EAAU,MAAM;;AACd,MAAIH,EAAK,UACPE,EAAe,UAAQE,IAAAJ,EAAK,UAAL,gBAAAI,EAAY,gBAAe;AAAA,IAEtD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/PlChip/index.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export { default as PlChip } from './PlChip.vue';
2	- //# sourceMappingURL=index.d.ts.map

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

@@ -9,4 +9,3 @@ declare const _default: import('vue').DefineComponent<{
     onCopy?: ((...args: any[]) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, SVGSVGElement>;
 export default _default;
-//# sourceMappingURL=PlClipboard.vue.d.ts.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PlClipboard.vue2.js","sources":["../../../src/components/PlClipboard/PlClipboard.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n name: 'PlClipboard',\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { PlMaskIcon16 } from '../PlMaskIcon16';\nimport type { Size } from '../../types.ts';\nimport { computed, onUnmounted, ref } from 'vue';\n\nconst props = defineProps<{\n size?: Size;\n}>();\n\nconst emit = defineEmits(['copy']);\n\nconst copyEffect = ref<boolean>(false);\n\nconst iconName = computed(() => copyEffect.value ? 'clipboard-copied' : 'clipboard');\n\nlet timeoutId: undefined \| number;\n\nfunction onCopy() {\n clearTimeout(timeoutId);\n copyEffect.value = true;\n emit('copy');\n timeoutId = window.setTimeout(() => {\n copyEffect.value = false;\n }, 1000);\n}\n\nonUnmounted(() => {\n clearTimeout(timeoutId);\n});\n</script>\n\n<template>\n <PlMaskIcon16 :name=\"iconName\" :size=\"props.size\" :class=\"$style.copy\" @click=\"onCopy\" />\n</template>\n\n<style module>\n.copy {\n cursor: pointer;\n display: block;\n}\n</style>\n"],"names":["__default__","props","__props","emit","__emit","copyEffect","ref","iconName","computed","timeoutId","onCopy","onUnmounted"],"mappings":";;AACA,~~MAAeA~~,~~IAAA~~;AAAA,EACb,MAAM;AACR;;;;;;;AAQA,UAAMC,IAAQC,GAIRC,IAAOC,GAEPC,IAAaC,EAAa,EAAK,GAE/BC,IAAWC,EAAS,MAAMH,EAAW,QAAQ,qBAAqB,WAAW;~~AAE/E~~,~~QAAAI~~;AAEJ,aAASC,IAAS;AAChB,mBAAaD,CAAS,GACtBJ,EAAW,QAAQ,IACnBF,EAAK,MAAM,~~GACCM~~,~~IAAA~~,OAAO,WAAW,MAAM;AAClC,QAAAJ,EAAW,QAAQ;AAAA,~~SAClB~~,GAAI;AAAA,~~IAAA~~;~~AAGT~~,WAAAM,EAAY,MAAM;AAChB,mBAAaF,CAAS;AAAA,~~IAAA~~,~~CACvB~~;;;;;;;;"}
1	+ {"version":3,"file":"PlClipboard.vue2.js","sources":["../../../src/components/PlClipboard/PlClipboard.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n name: 'PlClipboard',\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { PlMaskIcon16 } from '../PlMaskIcon16';\nimport type { Size } from '../../types.ts';\nimport { computed, onUnmounted, ref } from 'vue';\n\nconst props = defineProps<{\n size?: Size;\n}>();\n\nconst emit = defineEmits(['copy']);\n\nconst copyEffect = ref<boolean>(false);\n\nconst iconName = computed(() => copyEffect.value ? 'clipboard-copied' : 'clipboard');\n\nlet timeoutId: undefined \| number;\n\nfunction onCopy() {\n clearTimeout(timeoutId);\n copyEffect.value = true;\n emit('copy');\n timeoutId = window.setTimeout(() => {\n copyEffect.value = false;\n }, 1000);\n}\n\nonUnmounted(() => {\n clearTimeout(timeoutId);\n});\n</script>\n\n<template>\n <PlMaskIcon16 :name=\"iconName\" :size=\"props.size\" :class=\"$style.copy\" @click=\"onCopy\" />\n</template>\n\n<style module>\n.copy {\n cursor: pointer;\n display: block;\n}\n</style>\n"],"names":["__default__","props","__props","emit","__emit","copyEffect","ref","iconName","computed","timeoutId","onCopy","onUnmounted"],"mappings":";;AACA,MAAAA,IAAe;AAAA,EACb,MAAM;AACR;;;;;;;AAQA,UAAMC,IAAQC,GAIRC,IAAOC,GAEPC,IAAaC,EAAa,EAAK,GAE/BC,IAAWC,EAAS,MAAMH,EAAW,QAAQ,qBAAqB,WAAW;AAEnF,QAAII;AAEJ,aAASC,IAAS;AAChB,mBAAaD,CAAS,GACtBJ,EAAW,QAAQ,IACnBF,EAAK,MAAM,GACXM,IAAY,OAAO,WAAW,MAAM;AAClC,QAAAJ,EAAW,QAAQ;AAAA,MACrB,GAAG,GAAI;AAAA,IACT;AAEA,WAAAM,EAAY,MAAM;AAChB,mBAAaF,CAAS;AAAA,IACxB,CAAC;;;;;;;;"}

package/dist/components/PlClipboard/index.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export { default as PlClipboard } from './PlClipboard.vue';
2	- //# sourceMappingURL=index.d.ts.map

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

@@ -19,4 +19,3 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
     onConfirm: () => void;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;
-//# sourceMappingURL=PlConfirmDialog.vue.d.ts.map

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

@@ -119,4 +119,3 @@ type __VLS_WithTemplateSlots<T, S> = T & {
         $slots: S;
     };
 };
-//# sourceMappingURL=PlDialogModal.vue.d.ts.map

package/dist/components/PlDialogModal/PlDialogModal.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlDialogModal.vue.js","sources":["../../../src/components/PlDialogModal/PlDialogModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n inheritAttrs: false,\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { useEventListener } from '../../composition/useEventListener';\nimport './pl-dialog-modal.scss';\nimport { computed, ref } from 'vue';\nimport PlCloseModalBtn from '../../utils/PlCloseModalBtn.vue';\nimport type { Size } from '../../types';\n\nconst slots = defineSlots<{\n title?: () => unknown;\n default?: () => unknown;\n actions?: () => unknown;\n}>();\n\nconst emit = defineEmits(['update:modelValue']);\n\nconst props = withDefaults(\n defineProps<{\n /*\n Determines whether the modal is open\n /\n modelValue: boolean;\n /\n css width (default value is `448px`)\n /\n width?: string;\n /\n css height (default value is `auto`)\n /\n height?: string;\n /\n css min-height (default value is `auto`)\n /\n minHeight?: string;\n /\n css min-height (default value is `auto` but recommended is 440px)\n /\n maxHeight?: string;\n /\n Enables a button to close the modal (default: `true`)\n /\n closable?: boolean;\n /\n If `true` content gutters are removed\n /\n noContentGutters?: boolean;\n /\n If `true` top content gutter is removed\n /\n noTopContentGutter?: boolean;\n /\n Actions slot has a top border (default: `true`)\n /\n actionsHasTopBorder?: boolean;\n /\n If `true`, the modal window closes when clicking outside the modal area (default: `true`)\n /\n closeOnOutsideClick?: boolean;\n /\n Predefined size (standard small \| medium \| large). Takes precedence over (min\|max)(width\|height) properties. Not defined by default.\n */\n size?: Size \| undefined;\n }>(),\n {\n width: '448px',\n minHeight: 'auto',\n maxHeight: 'auto',\n height: 'auto',\n closable: true,\n noContentGutters: false,\n actionsHasTopBorder: true,\n size: undefined,\n },\n);\n\nconst modal = ref<HTMLElement>();\n\nconst style = computed(() => {\n const { width, height, minHeight, maxHeight, size } = props;\n\n if (size === 'small') {\n return {\n width: '448px',\n height: '440px',\n minHeight: 'auto',\n maxHeight: 'auto',\n };\n }\n\n if (size === 'medium') {\n return {\n width: '720px',\n height: '720px',\n minHeight: 'auto',\n maxHeight: 'auto',\n };\n }\n\n if (size === 'large') {\n return {\n width: '1080px',\n height: '880px',\n minHeight: 'auto',\n maxHeight: 'auto',\n };\n }\n\n return { width, height, minHeight, maxHeight };\n});\n\nfunction onClickShadow(ev: Event) {\n if (modal.value && props.closeOnOutsideClick && document.contains(ev.target as Node) && !modal.value.contains(ev.target as Node)) {\n emit('update:modelValue', false);\n }\n}\n\nuseEventListener(document.body, 'keyup', (ev) => {\n if (props.modelValue && ev.code === 'Escape') {\n emit('update:modelValue', false);\n }\n});\n</script>\n\n<template>\n <Teleport to=\"body\">\n <Transition name=\"dialog\">\n <div v-if=\"modelValue\" class=\"pl-dialog-modal__shadow\" @click=\"onClickShadow\">\n <div\n v-bind=\"$attrs\"\n ref=\"modal\"\n class=\"pl-dialog-modal\"\n :class=\"{ 'has-title': slots.title, 'has-content': slots.default }\"\n :style=\"style\"\n >\n <PlCloseModalBtn v-if=\"closable\" class=\"close-modal-btn\" @click.stop=\"emit('update:modelValue', false)\" />\n <div v-if=\"slots.title\" class=\"pl-dialog-modal__title\">\n <slot name=\"title\" />\n </div>\n <div class=\"pl-dialog-modal__content\" :class=\"{ 'no-content-gutters': noContentGutters, 'no-top-content-gutter': noTopContentGutter }\">\n <slot />\n </div>\n <div v-if=\"slots.actions\" class=\"pl-dialog-modal__actions\" :class=\"{ 'has-top-border': actionsHasTopBorder }\">\n <slot name=\"actions\" />\n </div>\n </div>\n </div>\n </Transition>\n </Teleport>\n</template>\n"],"names":["__default__","slots","_useSlots","emit","__emit","props","__props","modal","ref","style","computed","width","height","minHeight","maxHeight","size","onClickShadow","ev","useEventListener"],"mappings":";;;;;;;~~GACeA~~,~~IAAA~~;AAAA,EACb,cAAc;AAChB;;;;;;;;;;;;;;;;;;AAUA,UAAMC,IAAQC,~~EAIV~~,~~GAEEC~~,IAAOC,GAEPC,IAAQC,GA2DRC,IAAQC,~~EAAiB~~,~~GAEzBC~~,IAAQC,EAAS,MAAM;AAC3B,YAAM,EAAE,OAAAC,GAAO,QAAAC,GAAQ,WAAAC,GAAW,WAAAC,GAAW,MAAAC,MAASV;AAEtD,aAAIU,MAAS,UACJ;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,WAAW;AAAA,~~MACb~~,~~IAGEA~~,MAAS,WACJ;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,WAAW;AAAA,~~MACb~~,~~IAGEA~~,MAAS,UACJ;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,WAAW;AAAA,~~MACb~~,~~IAGK~~,EAAE,OAAAJ,GAAO,QAAAC,GAAQ,WAAAC,GAAW,WAAAC,~~EAAU~~;AAAA,~~IAAA~~,~~CAC9C~~;AAED,aAASE,EAAcC,GAAW;AAChC,MAAIV,EAAM,SAASF,EAAM,uBAAuB,SAAS,SAASY,EAAG,MAAc,KAAK,CAACV,EAAM,MAAM,SAASU,EAAG,MAAc,KAC7Hd,EAAK,qBAAqB,EAAK;AAAA,~~IACjC~~;~~AAGF~~,WAAAe,EAAiB,SAAS,MAAM,SAAS,CAACD,MAAO;AAC/C,MAAIZ,EAAM,cAAcY,EAAG,SAAS,YAClCd,EAAK,qBAAqB,EAAK;AAAA,~~IACjC~~,~~CACD~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"PlDialogModal.vue.js","sources":["../../../src/components/PlDialogModal/PlDialogModal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n inheritAttrs: false,\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { useEventListener } from '../../composition/useEventListener';\nimport './pl-dialog-modal.scss';\nimport { computed, ref } from 'vue';\nimport PlCloseModalBtn from '../../utils/PlCloseModalBtn.vue';\nimport type { Size } from '../../types';\n\nconst slots = defineSlots<{\n title?: () => unknown;\n default?: () => unknown;\n actions?: () => unknown;\n}>();\n\nconst emit = defineEmits(['update:modelValue']);\n\nconst props = withDefaults(\n defineProps<{\n /*\n Determines whether the modal is open\n /\n modelValue: boolean;\n /\n css width (default value is `448px`)\n /\n width?: string;\n /\n css height (default value is `auto`)\n /\n height?: string;\n /\n css min-height (default value is `auto`)\n /\n minHeight?: string;\n /\n css min-height (default value is `auto` but recommended is 440px)\n /\n maxHeight?: string;\n /\n Enables a button to close the modal (default: `true`)\n /\n closable?: boolean;\n /\n If `true` content gutters are removed\n /\n noContentGutters?: boolean;\n /\n If `true` top content gutter is removed\n /\n noTopContentGutter?: boolean;\n /\n Actions slot has a top border (default: `true`)\n /\n actionsHasTopBorder?: boolean;\n /\n If `true`, the modal window closes when clicking outside the modal area (default: `true`)\n /\n closeOnOutsideClick?: boolean;\n /\n Predefined size (standard small \| medium \| large). Takes precedence over (min\|max)(width\|height) properties. Not defined by default.\n */\n size?: Size \| undefined;\n }>(),\n {\n width: '448px',\n minHeight: 'auto',\n maxHeight: 'auto',\n height: 'auto',\n closable: true,\n noContentGutters: false,\n actionsHasTopBorder: true,\n size: undefined,\n },\n);\n\nconst modal = ref<HTMLElement>();\n\nconst style = computed(() => {\n const { width, height, minHeight, maxHeight, size } = props;\n\n if (size === 'small') {\n return {\n width: '448px',\n height: '440px',\n minHeight: 'auto',\n maxHeight: 'auto',\n };\n }\n\n if (size === 'medium') {\n return {\n width: '720px',\n height: '720px',\n minHeight: 'auto',\n maxHeight: 'auto',\n };\n }\n\n if (size === 'large') {\n return {\n width: '1080px',\n height: '880px',\n minHeight: 'auto',\n maxHeight: 'auto',\n };\n }\n\n return { width, height, minHeight, maxHeight };\n});\n\nfunction onClickShadow(ev: Event) {\n if (modal.value && props.closeOnOutsideClick && document.contains(ev.target as Node) && !modal.value.contains(ev.target as Node)) {\n emit('update:modelValue', false);\n }\n}\n\nuseEventListener(document.body, 'keyup', (ev) => {\n if (props.modelValue && ev.code === 'Escape') {\n emit('update:modelValue', false);\n }\n});\n</script>\n\n<template>\n <Teleport to=\"body\">\n <Transition name=\"dialog\">\n <div v-if=\"modelValue\" class=\"pl-dialog-modal__shadow\" @click=\"onClickShadow\">\n <div\n v-bind=\"$attrs\"\n ref=\"modal\"\n class=\"pl-dialog-modal\"\n :class=\"{ 'has-title': slots.title, 'has-content': slots.default }\"\n :style=\"style\"\n >\n <PlCloseModalBtn v-if=\"closable\" class=\"close-modal-btn\" @click.stop=\"emit('update:modelValue', false)\" />\n <div v-if=\"slots.title\" class=\"pl-dialog-modal__title\">\n <slot name=\"title\" />\n </div>\n <div class=\"pl-dialog-modal__content\" :class=\"{ 'no-content-gutters': noContentGutters, 'no-top-content-gutter': noTopContentGutter }\">\n <slot />\n </div>\n <div v-if=\"slots.actions\" class=\"pl-dialog-modal__actions\" :class=\"{ 'has-top-border': actionsHasTopBorder }\">\n <slot name=\"actions\" />\n </div>\n </div>\n </div>\n </Transition>\n </Teleport>\n</template>\n"],"names":["__default__","slots","_useSlots","emit","__emit","props","__props","modal","ref","style","computed","width","height","minHeight","maxHeight","size","onClickShadow","ev","useEventListener"],"mappings":";;;;;;;GACAA,IAAe;AAAA,EACb,cAAc;AAChB;;;;;;;;;;;;;;;;;;AAUA,UAAMC,IAAQC,EAAA,GAMRC,IAAOC,GAEPC,IAAQC,GA2DRC,IAAQC,EAAA,GAERC,IAAQC,EAAS,MAAM;AAC3B,YAAM,EAAE,OAAAC,GAAO,QAAAC,GAAQ,WAAAC,GAAW,WAAAC,GAAW,MAAAC,MAASV;AAEtD,aAAIU,MAAS,UACJ;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,WAAW;AAAA,MAAA,IAIXA,MAAS,WACJ;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,WAAW;AAAA,MAAA,IAIXA,MAAS,UACJ;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,WAAW;AAAA,MAAA,IAIR,EAAE,OAAAJ,GAAO,QAAAC,GAAQ,WAAAC,GAAW,WAAAC,EAAA;AAAA,IACrC,CAAC;AAED,aAASE,EAAcC,GAAW;AAChC,MAAIV,EAAM,SAASF,EAAM,uBAAuB,SAAS,SAASY,EAAG,MAAc,KAAK,CAACV,EAAM,MAAM,SAASU,EAAG,MAAc,KAC7Hd,EAAK,qBAAqB,EAAK;AAAA,IAEnC;AAEA,WAAAe,EAAiB,SAAS,MAAM,SAAS,CAACD,MAAO;AAC/C,MAAIZ,EAAM,cAAcY,EAAG,SAAS,YAClCd,EAAK,qBAAqB,EAAK;AAAA,IAEnC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/PlDialogModal/index.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export { default as PlDialogModal } from './PlDialogModal.vue';
2	- //# sourceMappingURL=index.d.ts.map

package/dist/components/PlDropdown/OptionList.vue.d.ts CHANGED Viewed

@@ -74,4 +74,3 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {
     }) | null;
 }, any>;
 export default _default;
-//# sourceMappingURL=OptionList.vue.d.ts.map

package/dist/components/PlDropdown/OptionList.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OptionList.vue.js","sources":["../../../src/components/PlDropdown/OptionList.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport DropdownListItem from '../DropdownListItem.vue';\nimport { DropdownOverlay } from '../../utils/DropdownOverlay';\nimport TextLabel from '../../utils/TextLabel.vue';\nimport { computed, useTemplateRef } from 'vue';\nimport type { LOption } from './types';\n\nconst props = defineProps<{\n rootRef: HTMLElement;\n groups: Map<string, LOption[]>;\n rest: LOption[];\n optionSize: 'small' \| 'medium';\n selectOption: (v: unknown) => void;\n}>();\n\nconst overlay = useTemplateRef('overlay');\n\nconst listRef = computed(() => overlay.value?.listRef);\n\nconst hasGroups = computed(() => props.groups.size > 0);\n\nconst optionsLength = computed(() => {\n let totalGroupItems = 0;\n for (const items of props.groups.values()) {\n totalGroupItems += items.length;\n }\n return totalGroupItems + props.rest.length;\n});\n\nconst scrollIntoActive = () => {\n overlay.value?.scrollIntoActive();\n};\n\ndefineExpose({\n scrollIntoActive,\n listRef,\n});\n</script>\n\n<template>\n <DropdownOverlay ref=\"overlay\" :root=\"rootRef\" class=\"pl-dropdown__options\" tabindex=\"-1\" :gap=\"3\">\n <div v-for=\"[group, items] in groups.entries()\" :key=\"group\" :class=\"{ 'group-container': hasGroups }\">\n <TextLabel>{{ group }}</TextLabel>\n <div>\n <DropdownListItem\n v-for=\"(item, index) in items\"\n :key=\"index\"\n :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n @click.stop=\"selectOption(item.value)\"\n />\n </div>\n </div>\n <div v-if=\"rest.length\" :class=\"{ 'group-container': hasGroups }\">\n <TextLabel />\n <div>\n <DropdownListItem\n v-for=\"(item, index) in rest\"\n :key=\"index\" :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n @click.stop=\"selectOption(item.value)\"\n />\n </div>\n </div>\n <div v-if=\"!optionsLength\" class=\"nothing-found\">Nothing found</div>\n </DropdownOverlay>\n</template>\n"],"names":["props","__props","overlay","useTemplateRef","listRef","computed","_a","hasGroups","optionsLength","totalGroupItems","items","__expose"],"mappings":";;;;;;;;;;;;;;;;;AAOA,UAAMA,IAAQC,GAQRC,IAAUC,EAAe,SAAS,GAElCC,IAAUC,EAAS,~~MAAM~~;;~~AAAA~~,cAAAC,IAAAJ,EAAQ,UAAR,gBAAAI,EAAe;AAAA,KAAO,GAE/CC,IAAYF,EAAS,MAAML,EAAM,OAAO,OAAO,CAAC,GAEhDQ,IAAgBH,EAAS,MAAM;AACnC,UAAII,IAAkB;AACtB,iBAAWC,KAASV,EAAM,OAAO,OAAA;AAC/B,QAAAS,KAAmBC,EAAM;~~AAEpB~~,~~aAAAD~~,IAAkBT,EAAM,KAAK;AAAA,~~IAAA~~,~~CACrC~~;~~AAMY~~,WAAAW,~~EAAA~~;AAAA,MACX,kBALuB,MAAM;;AAC7B,SAAAL,IAAAJ,EAAQ,UAAR,QAAAI,EAAe;AAAA,MACjB;AAAA,MAIE,SAAAF;AAAA,IAAA,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"OptionList.vue.js","sources":["../../../src/components/PlDropdown/OptionList.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport DropdownListItem from '../DropdownListItem.vue';\nimport { DropdownOverlay } from '../../utils/DropdownOverlay';\nimport TextLabel from '../../utils/TextLabel.vue';\nimport { computed, useTemplateRef } from 'vue';\nimport type { LOption } from './types';\n\nconst props = defineProps<{\n rootRef: HTMLElement;\n groups: Map<string, LOption[]>;\n rest: LOption[];\n optionSize: 'small' \| 'medium';\n selectOption: (v: unknown) => void;\n}>();\n\nconst overlay = useTemplateRef('overlay');\n\nconst listRef = computed(() => overlay.value?.listRef);\n\nconst hasGroups = computed(() => props.groups.size > 0);\n\nconst optionsLength = computed(() => {\n let totalGroupItems = 0;\n for (const items of props.groups.values()) {\n totalGroupItems += items.length;\n }\n return totalGroupItems + props.rest.length;\n});\n\nconst scrollIntoActive = () => {\n overlay.value?.scrollIntoActive();\n};\n\ndefineExpose({\n scrollIntoActive,\n listRef,\n});\n</script>\n\n<template>\n <DropdownOverlay ref=\"overlay\" :root=\"rootRef\" class=\"pl-dropdown__options\" tabindex=\"-1\" :gap=\"3\">\n <div v-for=\"[group, items] in groups.entries()\" :key=\"group\" :class=\"{ 'group-container': hasGroups }\">\n <TextLabel>{{ group }}</TextLabel>\n <div>\n <DropdownListItem\n v-for=\"(item, index) in items\"\n :key=\"index\"\n :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n @click.stop=\"selectOption(item.value)\"\n />\n </div>\n </div>\n <div v-if=\"rest.length\" :class=\"{ 'group-container': hasGroups }\">\n <TextLabel />\n <div>\n <DropdownListItem\n v-for=\"(item, index) in rest\"\n :key=\"index\" :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n @click.stop=\"selectOption(item.value)\"\n />\n </div>\n </div>\n <div v-if=\"!optionsLength\" class=\"nothing-found\">Nothing found</div>\n </DropdownOverlay>\n</template>\n"],"names":["props","__props","overlay","useTemplateRef","listRef","computed","_a","hasGroups","optionsLength","totalGroupItems","items","__expose"],"mappings":";;;;;;;;;;;;;;;;;AAOA,UAAMA,IAAQC,GAQRC,IAAUC,EAAe,SAAS,GAElCC,IAAUC,EAAS,MAAA;;AAAM,cAAAC,IAAAJ,EAAQ,UAAR,gBAAAI,EAAe;AAAA,KAAO,GAE/CC,IAAYF,EAAS,MAAML,EAAM,OAAO,OAAO,CAAC,GAEhDQ,IAAgBH,EAAS,MAAM;AACnC,UAAII,IAAkB;AACtB,iBAAWC,KAASV,EAAM,OAAO,OAAA;AAC/B,QAAAS,KAAmBC,EAAM;AAE3B,aAAOD,IAAkBT,EAAM,KAAK;AAAA,IACtC,CAAC;AAMD,WAAAW,EAAa;AAAA,MACX,kBALuB,MAAM;;AAC7B,SAAAL,IAAAJ,EAAQ,UAAR,QAAAI,EAAe;AAAA,MACjB;AAAA,MAIE,SAAAF;AAAA,IAAA,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -75,4 +75,3 @@ export default _default;
 type __VLS_PrettifyLocal<T> = {
     [K in keyof T]: T[K];
 } & {};
-//# sourceMappingURL=PlDropdown.vue.d.ts.map

package/dist/components/PlDropdown/PlDropdown.vue.js CHANGED Viewed

@@ -1,4 +1,4 @@
-(function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode(`.pl-dropdown__options{--option-hover-bg: var(--btn-sec-hover-grey);z-index:var(--z-dropdown-options);border:1px solid var(--border-color-div-grey);position:absolute;background-color:var(--pl-dropdown-options-bg);border-radius:6px;max-height:244px;box-shadow:0 4px 12px -2px #0f244d14,0 6px 24px -2px #0f244d14;--thumb-color: var(--ic-02);overflow-y:auto}.pl-dropdown__options::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.pl-dropdown__options::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-dropdown__options::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}.pl-dropdown__options .nothing-found{padding:0 10px;height:var(--control-height);line-height:var(--control-height);background-color:#fff;opacity:.5;font-style:italic}.pl-dropdown__options .group-container{padding:4px 0}.pl-dropdown__options .option{position:relative;padding:0 30px 0 10px;height:var(--control-height);line-height:var(--control-height);cursor:pointer;-webkit-user-select:none;user-select:none}.pl-dropdown__options .option .checkmark{position:absolute;display:none;right:10px;top:50%;transform:translateY(-50%)}.pl-dropdown__options .option>span{display:block;overflow:hidden;white-space:nowrap;max-width:100%;text-overflow:ellipsis}.pl-dropdown__options .option.selected{background-color:var(--color-active-select)}.pl-dropdown__options .option.selected .checkmark{display:block}.pl-dropdown__options .option.active:not(.selected){background-color:var(--option-hover-bg)}.pl-dropdown__options .option:hover{background-color:var(--option-hover-bg)}.pl-dropdown{--contour-color: var(--txt-01);--contour-border-width: 1px;--label-offset-left-x: 8px;--label-offset-right-x: 8px;--label-color: var(--txt-01);position:relative;outline:none;min-height:var(--control-height);border-radius:6px;font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weigh-base)}.pl-dropdown__envelope{font-family:var(--control-font-family);min-width:160px}.pl-dropdown label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.pl-dropdown label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.pl-dropdown__container{position:absolute;top:0;left:0;right:0;border-radius:6px;min-height:var(--control-height);color:var(--txt-01)}.pl-dropdown__contour{border-radius:var(--border-radius-control);border:var(--contour-border-width) solid var(--contour-color);box-shadow:var(--contour-box-shadow);z-index:0;pointer-events:none}.pl-dropdown__field{position:relative;border-radius:6px;overflow:hidden;background:transparent;padding-left:11px;min-height:var(--control-height);line-height:var(--control-height);display:flex;flex-direction:row;align-items:center;cursor:pointer}.pl-dropdown__field .input-value{position:absolute;top:0;left:0;bottom:0;right:0;display:flex;flex-direction:row;align-items:center;padding:0 60px 0 11px;pointer-events:none;line-height:20px;color:var(--txt-01);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit}.pl-dropdown__field input{min-height:calc(var(--control-height) - 2px);line-height:20px;font-family:inherit;font-size:inherit;background-color:transparent;border:none;padding:0;width:calc(100% - 40px);color:var(--txt-01);caret-color:var(--border-color-focus)}.pl-dropdown__field input:focus{outline:none}.pl-dropdown__field input:placeholder-shown{text-overflow:ellipsis}.pl-dropdown__field input::placeholder{color:var(--color-placeholder)}.pl-dropdown__helper{font-size:12px;color:var(--txt-03);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-dropdown__error{font-size:12px;color:var(--txt-error);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-dropdown__controls{display:flex;flex-direction:row;align-items:center;gap:6px;margin-left:auto}.pl-dropdown__controls .mask-16,.pl-dropdown__controls .mask-24{cursor:pointer}.pl-dropdown__controls .clear{--icon-color: var(--ic-02)}.pl-dropdown__controls .mask-loading{--icon-color: var(--ic-accent);animation:spin 2.5s linear infinite}.pl-dropdown__arrow-wrapper{display:flex;align-items:center;min-height:var(--control-height);padding-right:11px}.pl-dropdown .arrow-icon{cursor:pointer}.pl-dropdown .arrow-icon.arrow-icon-default{transition:transform .2s}.pl-dropdown.open,.pl-dropdown:focus-within{z-index:1;--label-color: var(--txt-focus)}.pl-dropdown.open .pl-dropdown__container{z-index:1000}.pl-dropdown.open .pl-dropdown__field{border-radius:6px 6px 0 0}.pl-dropdown.open .arrow-icon.arrow-icon-default{transform:rotate(-180deg)}.pl-dropdown:hover{--contour-color: var(--control-hover-color)}.pl-dropdown:focus-within:not(.error){--label-color: var(--txt-focus);--contour-color: var(--border-color-focus);--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--border-color-focus-shadow)}.pl-dropdown:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.pl-dropdown.error{--contour-color: var(--txt-error);--label-color: var(--txt-error)}.pl-dropdown.disabled{--contour-color: var(--color-dis-01);--icon-color: var(--color-dis-01);--label-color: var(--color-dis-01);cursor:not-allowed;pointer-events:none;-webkit-user-select:none;user-select:none}.pl-dropdown.disabled .input-value{color:var(--dis-01)}
+(function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode(`.pl-dropdown__options{--option-hover-bg: var(--btn-sec-hover-grey);z-index:var(--z-dropdown-options);border:1px solid var(--border-color-div-grey);position:absolute;background-color:var(--pl-dropdown-options-bg);border-radius:6px;max-height:244px;box-shadow:0 4px 12px -2px #0f244d14,0 6px 24px -2px #0f244d14;--thumb-color: var(--ic-02);overflow-y:auto}.pl-dropdown__options::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.pl-dropdown__options::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-dropdown__options::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}.pl-dropdown__options .nothing-found{padding:0 10px;height:var(--control-height);line-height:var(--control-height);background-color:#fff;opacity:.5;font-style:italic}.pl-dropdown__options .group-container{padding:4px 0}.pl-dropdown{--contour-color: var(--txt-01);--contour-border-width: 1px;--label-offset-left-x: 8px;--label-offset-right-x: 8px;--label-color: var(--txt-01);position:relative;outline:none;min-height:var(--control-height);border-radius:6px;font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weigh-base)}.pl-dropdown__envelope{font-family:var(--control-font-family);min-width:160px}.pl-dropdown label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.pl-dropdown label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.pl-dropdown__container{position:absolute;top:0;left:0;right:0;border-radius:6px;min-height:var(--control-height);color:var(--txt-01)}.pl-dropdown__contour{border-radius:var(--border-radius-control);border:var(--contour-border-width) solid var(--contour-color);box-shadow:var(--contour-box-shadow);z-index:0;pointer-events:none}.pl-dropdown__field{position:relative;border-radius:6px;overflow:hidden;background:transparent;padding-left:11px;min-height:var(--control-height);line-height:var(--control-height);display:flex;flex-direction:row;align-items:center;cursor:pointer}.pl-dropdown__field .input-value{position:absolute;top:0;left:0;bottom:0;right:0;display:flex;flex-direction:row;align-items:center;padding:0 60px 0 11px;pointer-events:none;line-height:20px;color:var(--txt-01);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit}.pl-dropdown__field input{min-height:calc(var(--control-height) - 2px);line-height:20px;font-family:inherit;font-size:inherit;background-color:transparent;border:none;padding:0;width:calc(100% - 40px);color:var(--txt-01);caret-color:var(--border-color-focus)}.pl-dropdown__field input:focus{outline:none}.pl-dropdown__field input:placeholder-shown{text-overflow:ellipsis}.pl-dropdown__field input::placeholder{color:var(--color-placeholder)}.pl-dropdown__helper{font-size:12px;color:var(--txt-03);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-dropdown__error{font-size:12px;color:var(--txt-error);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-dropdown__controls{display:flex;flex-direction:row;align-items:center;gap:6px;margin-left:auto}.pl-dropdown__controls .mask-16,.pl-dropdown__controls .mask-24{cursor:pointer}.pl-dropdown__controls .clear{--icon-color: var(--ic-02)}.pl-dropdown__controls .mask-loading{--icon-color: var(--ic-accent);animation:spin 2.5s linear infinite}.pl-dropdown__arrow-wrapper{display:flex;align-items:center;min-height:var(--control-height);padding-right:11px}.pl-dropdown .arrow-icon{cursor:pointer}.pl-dropdown .arrow-icon.arrow-icon-default{transition:transform .2s}.pl-dropdown.open,.pl-dropdown:focus-within{z-index:1;--label-color: var(--txt-focus)}.pl-dropdown.open .pl-dropdown__container{z-index:1000}.pl-dropdown.open .pl-dropdown__field{border-radius:6px 6px 0 0}.pl-dropdown.open .arrow-icon.arrow-icon-default{transform:rotate(-180deg)}.pl-dropdown:hover{--contour-color: var(--control-hover-color)}.pl-dropdown:focus-within:not(.error){--label-color: var(--txt-focus);--contour-color: var(--border-color-focus);--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--border-color-focus-shadow)}.pl-dropdown:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.pl-dropdown.error{--contour-color: var(--txt-error);--label-color: var(--txt-error)}.pl-dropdown.disabled{--contour-color: var(--color-dis-01);--icon-color: var(--color-dis-01);--label-color: var(--color-dis-01);cursor:not-allowed;pointer-events:none;-webkit-user-select:none;user-select:none}.pl-dropdown.disabled .input-value{color:var(--dis-01)}
 .ui-lt-container{min-width:0;white-space:nowrap;overflow:hidden;position:relative;border-radius:5px}.ui-lt-container span{display:inline-block;overflow:hidden;text-overflow:ellipsis;width:100%;vertical-align:bottom;pointer-events:all!important}.ui-lt-container .ui-lt-animate{position:relative;animation:left-to-right var(--5deba9de) infinite alternate linear;overflow:unset!important;text-overflow:unset!important;width:fit-content!important}@keyframes left-to-right{0%{transform:translate(0);left:0%}to{transform:translate(-101%);left:101%}}`)),document.head.appendChild(o)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
 import { defineComponent as le, ref as D, useTemplateRef as ae, reactive as se, computed as a, unref as s, watch as B, watchPostEffect as ie, createElementBlock as m, openBlock as n, createElementVNode as p, createCommentVNode as d, normalizeClass as de, createBlock as u, createVNode as S, withDirectives as ue, vModelText as ce, withCtx as z, createTextVNode as pe, toDisplayString as v, renderSlot as M, withModifiers as T } from "vue";
@@ -12,7 +12,7 @@ import we from "../LongText.vue.js";
 import { normalizeListOptions as _e } from "../../helpers/utils.js";
 import I from "../PlIcon16/PlIcon16.vue.js";
 import $ from "../PlIcon24/PlIcon24.vue.js";
-import ke from "../../generated/components/svg/images/SvgRequired.vue2.js";
+import ke from "../../generated/components/svg/images/SvgRequired.vue.js";
 import { getErrorMessage as ye } from "../../helpers/error.js";
 import ge from "./OptionList.vue.js";
 import { useGroupBy as Ie } from "./useGroupBy.js";

package/dist/components/PlDropdown/PlDropdown.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlDropdown.vue.js","sources":["../../../src/components/PlDropdown/PlDropdown.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n A component for selecting one value from a list of options\n /\nexport default {\n name: 'PlDropdown',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport './pl-dropdown.scss';\nimport { computed, reactive, ref, unref, useTemplateRef, watch, watchPostEffect } from 'vue';\nimport { tap } from '../../helpers/functions';\nimport { PlTooltip } from '../PlTooltip';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport type { ListOption, ListOptionNormalized, MaskIconName16, MaskIconName24 } from '../../types';\nimport { deepEqual } from '../../helpers/objects';\nimport LongText from '../LongText.vue';\nimport { normalizeListOptions } from '../../helpers/utils';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlIcon24 } from '../PlIcon24';\nimport SvgRequired from '../../generated/components/svg/images/SvgRequired.vue';\nimport { getErrorMessage } from '../../helpers/error.ts';\nimport OptionList from './OptionList.vue';\nimport { useGroupBy } from './useGroupBy';\nimport type { LOption } from './types';\n\nconst emit = defineEmits<{\n /\n Emitted when the model value is updated.\n /\n (e: 'update:modelValue', value: M \| undefined): void;\n}>();\n\nconst props = withDefaults(\n defineProps<{\n /\n The current selected value of the dropdown.\n /\n modelValue: M;\n /\n The label text for the dropdown field (optional)\n /\n label?: string;\n /\n List of available options for the dropdown\n /\n options?: Readonly<ListOption<M>[]>;\n /\n A helper text displayed below the dropdown when there are no errors (optional).\n /\n helper?: string;\n /\n A helper text displayed below the dropdown when there are no options yet or options is undefined (optional).\n /\n loadingOptionsHelper?: string;\n /\n Error message displayed below the dropdown (optional)\n /\n error?: unknown;\n /\n Placeholder text shown when no value is selected.\n /\n placeholder?: string;\n /\n Enables a button to clear the selected value (default: false)\n /\n clearable?: boolean;\n /\n If `true`, the dropdown component is marked as required.\n /\n required?: boolean;\n /\n If `true`, the dropdown component is disabled and cannot be interacted with.\n /\n disabled?: boolean;\n /\n Custom icon (16px) class for the dropdown arrow (optional)\n /\n arrowIcon?: MaskIconName16;\n /\n Custom icon (24px) class for the dropdown arrow (optional)\n /\n arrowIconLarge?: MaskIconName24;\n /\n Option list item size\n */\n optionSize?: 'small' \| 'medium';\n }>(),\n {\n label: '',\n helper: undefined,\n loadingOptionsHelper: undefined,\n error: undefined,\n placeholder: '...',\n clearable: false,\n required: false,\n disabled: false,\n arrowIcon: undefined,\n arrowIconLarge: undefined,\n optionSize: 'small',\n options: undefined,\n },\n);\n\nconst rootRef = ref<HTMLElement \| undefined>();\nconst input = ref<HTMLInputElement \| undefined>();\n\nconst optionListRef = useTemplateRef<InstanceType<typeof OptionList>>('optionListRef');\n\nconst data = reactive({\n search: '',\n activeIndex: -1,\n open: false,\n optionsHeight: 0,\n});\n\nconst findActiveIndex = () =>\n tap(\n orderedRef.value.findIndex((o) => deepEqual(o.value, props.modelValue)),\n (v) => (v < 0 ? 0 : v),\n );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst isLoadingOptions = computed(() => {\n return props.options === undefined;\n});\n\nconst isDisabled = computed(() => {\n if (isLoadingOptions.value) {\n return true;\n }\n\n return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n return (props.options ?? []).findIndex((o) => deepEqual(o.value, props.modelValue));\n});\n\nconst computedError = computed(() => {\n if (isLoadingOptions.value) {\n return undefined;\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (props.modelValue !== undefined && selectedIndex.value === -1) {\n return 'The selected value is not one of the options';\n }\n\n return undefined;\n});\n\nconst optionsRef = computed<LOption<M>[]>(() =>\n normalizeListOptions(props.options ?? []).map((opt, index) => ({\n ...opt,\n index,\n isSelected: index === selectedIndex.value,\n isActive: index === data.activeIndex,\n })),\n);\n\nconst textValue = computed(() => {\n const options = unref(optionsRef);\n\n const item: ListOption \| undefined = options.find((o) => deepEqual(o.value, props.modelValue));\n\n return item?.label \|\| props.modelValue; // @todo show inner value?\n});\n\nconst computedPlaceholder = computed(() => {\n if (!data.open && props.modelValue !== undefined) {\n return '';\n }\n\n return props.modelValue ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n return props.modelValue !== undefined && props.modelValue !== null;\n});\n\nconst filteredRef = computed(() => {\n const options = optionsRef.value;\n\n if (data.search) {\n return options.filter((o: ListOptionNormalized) => {\n const search = data.search.toLowerCase();\n\n if (o.label.toLowerCase().includes(search)) {\n return true;\n }\n\n if (o.description && o.description.toLowerCase().includes(search)) {\n return true;\n }\n\n if (typeof o.value === 'string') {\n return o.value.toLowerCase().includes(search);\n }\n\n return o.value === data.search;\n });\n }\n\n return options;\n});\n\nconst { orderedRef, groupsRef, restRef } = useGroupBy(filteredRef, 'group');\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : '0'));\n\nconst selectOption = (v: M \| undefined) => {\n emit('update:modelValue', v);\n data.search = '';\n data.open = false;\n rootRef?.value?.focus();\n};\n\nconst selectOptionWrapper = (v: unknown) => {\n selectOption(v as M \| undefined);\n};\n\nconst clear = () => emit('update:modelValue', undefined);\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => {\n data.open = !data.open;\n if (!data.open) {\n data.search = '';\n }\n};\n\nconst onInputFocus = () => (data.open = true);\n\nconst onFocusOut = (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as Node \| null;\n\n if (!rootRef.value?.contains(relatedTarget) && !optionListRef.value?.listRef?.contains(relatedTarget)) {\n data.search = '';\n data.open = false;\n }\n};\n\nconst handleKeydown = (e: { code: string; preventDefault(): void }) => {\n if (!['ArrowDown', 'ArrowUp', 'Enter', 'Escape'].includes(e.code)) {\n return;\n } else {\n e.preventDefault();\n }\n\n const { open, activeIndex } = data;\n\n if (!open) {\n if (e.code === 'Enter') {\n data.open = true;\n }\n return;\n }\n\n if (e.code === 'Escape') {\n data.open = false;\n rootRef.value?.focus();\n }\n\n const ordered = orderedRef.value;\n\n const { length } = ordered;\n\n if (!length) {\n return;\n }\n\n if (e.code === 'Enter') {\n selectOption(ordered.find((it) => it.index === activeIndex)?.value);\n }\n\n const localIndex = ordered.findIndex((it) => it.index === activeIndex) ?? -1;\n\n const delta = e.code === 'ArrowDown' ? 1 : e.code === 'ArrowUp' ? -1 : 0;\n\n const newIndex = Math.abs(localIndex + delta + length) % length;\n\n data.activeIndex = ordered[newIndex].index ?? -1;\n};\n\nuseLabelNotch(rootRef);\n\nwatch(() => props.modelValue, updateActive, { immediate: true });\n\nwatch(\n () => data.open,\n (open) => (open ? input.value?.focus() : ''),\n);\n\nwatchPostEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n data.search; // to watch\n\n if (data.activeIndex >= 0 && data.open) {\n optionListRef.value?.scrollIntoActive();\n }\n});\n</script>\n\n<template>\n <div class=\"pl-dropdown__envelope\" @click=\"setFocusOnInput\">\n <div\n ref=\"rootRef\"\n :tabindex=\"tabindex\"\n class=\"pl-dropdown\"\n :class=\"{ open: data.open, error, disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"pl-dropdown__container\">\n <div class=\"pl-dropdown__field\">\n <input\n ref=\"input\"\n v-model=\"data.search\"\n type=\"text\"\n tabindex=\"-1\"\n :disabled=\"isDisabled\"\n :placeholder=\"computedPlaceholder\"\n spellcheck=\"false\"\n autocomplete=\"chrome-off\"\n @focus=\"onInputFocus\"\n />\n\n <div v-if=\"!data.open\" class=\"input-value\">\n <LongText> {{ textValue }} </LongText>\n </div>\n\n <div class=\"pl-dropdown__controls\">\n <PlIcon24 v-if=\"isLoadingOptions\" name=\"loading\" />\n <PlIcon16 v-if=\"clearable && hasValue\" class=\"clear\" name=\"delete-clear\" @click.stop=\"clear\" />\n <slot name=\"append\" />\n <div class=\"pl-dropdown__arrow-wrapper\" @click.stop=\"toggleOpen\">\n <PlIcon24 v-if=\"arrowIconLarge\" :name=\"arrowIconLarge\" class=\"arrow-icon\" />\n <PlIcon16 v-else-if=\"arrowIcon\" :name=\"arrowIcon\" class=\"arrow-icon\" />\n <PlIcon16 v-else name=\"chevron-down\" class=\"arrow-icon arrow-icon-default\" />\n </div>\n </div>\n </div>\n <label v-if=\"label\">\n <SvgRequired v-if=\"required\" />\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 <OptionList\n v-if=\"data.open\"\n ref=\"optionListRef\"\n :root-ref=\"rootRef!\"\n :groups=\"groupsRef\"\n :rest=\"restRef\"\n :option-size=\"optionSize\"\n :select-option=\"selectOptionWrapper\"\n />\n <DoubleContour class=\"pl-dropdown__contour\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"pl-dropdown__error\">{{ computedError }}</div>\n <div v-else-if=\"isLoadingOptions && loadingOptionsHelper\" class=\"pl-dropdown__helper\">{{ loadingOptionsHelper }}</div>\n <div v-else-if=\"helper\" class=\"pl-dropdown__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"names":["__default__","emit","__emit","props","__props","rootRef","ref","input","optionListRef","useTemplateRef","data","reactive","findActiveIndex","tap","orderedRef","o","deepEqual","v","updateActive","isLoadingOptions","computed","isDisabled","selectedIndex","computedError","getErrorMessage","optionsRef","normalizeListOptions","opt","index","textValue","item","unref","computedPlaceholder","hasValue","filteredRef","options","search","groupsRef","restRef","useGroupBy","tabindex","selectOption","_a","selectOptionWrapper","clear","setFocusOnInput","toggleOpen","onInputFocus","onFocusOut","event","relatedTarget","_c","_b","handleKeydown","open","activeIndex","ordered","length","it","localIndex","delta","newIndex","useLabelNotch","watch","watchPostEffect"],"mappings":"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"}
1	+ {"version":3,"file":"PlDropdown.vue.js","sources":["../../../src/components/PlDropdown/PlDropdown.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n A component for selecting one value from a list of options\n /\nexport default {\n name: 'PlDropdown',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport './pl-dropdown.scss';\nimport { computed, reactive, ref, unref, useTemplateRef, watch, watchPostEffect } from 'vue';\nimport { tap } from '../../helpers/functions';\nimport { PlTooltip } from '../PlTooltip';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport type { ListOption, ListOptionNormalized, MaskIconName16, MaskIconName24 } from '../../types';\nimport { deepEqual } from '../../helpers/objects';\nimport LongText from '../LongText.vue';\nimport { normalizeListOptions } from '../../helpers/utils';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlIcon24 } from '../PlIcon24';\nimport SvgRequired from '../../generated/components/svg/images/SvgRequired.vue';\nimport { getErrorMessage } from '../../helpers/error.ts';\nimport OptionList from './OptionList.vue';\nimport { useGroupBy } from './useGroupBy';\nimport type { LOption } from './types';\n\nconst emit = defineEmits<{\n /\n Emitted when the model value is updated.\n /\n (e: 'update:modelValue', value: M \| undefined): void;\n}>();\n\nconst props = withDefaults(\n defineProps<{\n /\n The current selected value of the dropdown.\n /\n modelValue: M;\n /\n The label text for the dropdown field (optional)\n /\n label?: string;\n /\n List of available options for the dropdown\n /\n options?: Readonly<ListOption<M>[]>;\n /\n A helper text displayed below the dropdown when there are no errors (optional).\n /\n helper?: string;\n /\n A helper text displayed below the dropdown when there are no options yet or options is undefined (optional).\n /\n loadingOptionsHelper?: string;\n /\n Error message displayed below the dropdown (optional)\n /\n error?: unknown;\n /\n Placeholder text shown when no value is selected.\n /\n placeholder?: string;\n /\n Enables a button to clear the selected value (default: false)\n /\n clearable?: boolean;\n /\n If `true`, the dropdown component is marked as required.\n /\n required?: boolean;\n /\n If `true`, the dropdown component is disabled and cannot be interacted with.\n /\n disabled?: boolean;\n /\n Custom icon (16px) class for the dropdown arrow (optional)\n /\n arrowIcon?: MaskIconName16;\n /\n Custom icon (24px) class for the dropdown arrow (optional)\n /\n arrowIconLarge?: MaskIconName24;\n /\n Option list item size\n */\n optionSize?: 'small' \| 'medium';\n }>(),\n {\n label: '',\n helper: undefined,\n loadingOptionsHelper: undefined,\n error: undefined,\n placeholder: '...',\n clearable: false,\n required: false,\n disabled: false,\n arrowIcon: undefined,\n arrowIconLarge: undefined,\n optionSize: 'small',\n options: undefined,\n },\n);\n\nconst rootRef = ref<HTMLElement \| undefined>();\nconst input = ref<HTMLInputElement \| undefined>();\n\nconst optionListRef = useTemplateRef<InstanceType<typeof OptionList>>('optionListRef');\n\nconst data = reactive({\n search: '',\n activeIndex: -1,\n open: false,\n optionsHeight: 0,\n});\n\nconst findActiveIndex = () =>\n tap(\n orderedRef.value.findIndex((o) => deepEqual(o.value, props.modelValue)),\n (v) => (v < 0 ? 0 : v),\n );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst isLoadingOptions = computed(() => {\n return props.options === undefined;\n});\n\nconst isDisabled = computed(() => {\n if (isLoadingOptions.value) {\n return true;\n }\n\n return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n return (props.options ?? []).findIndex((o) => deepEqual(o.value, props.modelValue));\n});\n\nconst computedError = computed(() => {\n if (isLoadingOptions.value) {\n return undefined;\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (props.modelValue !== undefined && selectedIndex.value === -1) {\n return 'The selected value is not one of the options';\n }\n\n return undefined;\n});\n\nconst optionsRef = computed<LOption<M>[]>(() =>\n normalizeListOptions(props.options ?? []).map((opt, index) => ({\n ...opt,\n index,\n isSelected: index === selectedIndex.value,\n isActive: index === data.activeIndex,\n })),\n);\n\nconst textValue = computed(() => {\n const options = unref(optionsRef);\n\n const item: ListOption \| undefined = options.find((o) => deepEqual(o.value, props.modelValue));\n\n return item?.label \|\| props.modelValue; // @todo show inner value?\n});\n\nconst computedPlaceholder = computed(() => {\n if (!data.open && props.modelValue !== undefined) {\n return '';\n }\n\n return props.modelValue ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n return props.modelValue !== undefined && props.modelValue !== null;\n});\n\nconst filteredRef = computed(() => {\n const options = optionsRef.value;\n\n if (data.search) {\n return options.filter((o: ListOptionNormalized) => {\n const search = data.search.toLowerCase();\n\n if (o.label.toLowerCase().includes(search)) {\n return true;\n }\n\n if (o.description && o.description.toLowerCase().includes(search)) {\n return true;\n }\n\n if (typeof o.value === 'string') {\n return o.value.toLowerCase().includes(search);\n }\n\n return o.value === data.search;\n });\n }\n\n return options;\n});\n\nconst { orderedRef, groupsRef, restRef } = useGroupBy(filteredRef, 'group');\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : '0'));\n\nconst selectOption = (v: M \| undefined) => {\n emit('update:modelValue', v);\n data.search = '';\n data.open = false;\n rootRef?.value?.focus();\n};\n\nconst selectOptionWrapper = (v: unknown) => {\n selectOption(v as M \| undefined);\n};\n\nconst clear = () => emit('update:modelValue', undefined);\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => {\n data.open = !data.open;\n if (!data.open) {\n data.search = '';\n }\n};\n\nconst onInputFocus = () => (data.open = true);\n\nconst onFocusOut = (event: FocusEvent) => {\n const relatedTarget = event.relatedTarget as Node \| null;\n\n if (!rootRef.value?.contains(relatedTarget) && !optionListRef.value?.listRef?.contains(relatedTarget)) {\n data.search = '';\n data.open = false;\n }\n};\n\nconst handleKeydown = (e: { code: string; preventDefault(): void }) => {\n if (!['ArrowDown', 'ArrowUp', 'Enter', 'Escape'].includes(e.code)) {\n return;\n } else {\n e.preventDefault();\n }\n\n const { open, activeIndex } = data;\n\n if (!open) {\n if (e.code === 'Enter') {\n data.open = true;\n }\n return;\n }\n\n if (e.code === 'Escape') {\n data.open = false;\n rootRef.value?.focus();\n }\n\n const ordered = orderedRef.value;\n\n const { length } = ordered;\n\n if (!length) {\n return;\n }\n\n if (e.code === 'Enter') {\n selectOption(ordered.find((it) => it.index === activeIndex)?.value);\n }\n\n const localIndex = ordered.findIndex((it) => it.index === activeIndex) ?? -1;\n\n const delta = e.code === 'ArrowDown' ? 1 : e.code === 'ArrowUp' ? -1 : 0;\n\n const newIndex = Math.abs(localIndex + delta + length) % length;\n\n data.activeIndex = ordered[newIndex].index ?? -1;\n};\n\nuseLabelNotch(rootRef);\n\nwatch(() => props.modelValue, updateActive, { immediate: true });\n\nwatch(\n () => data.open,\n (open) => (open ? input.value?.focus() : ''),\n);\n\nwatchPostEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n data.search; // to watch\n\n if (data.activeIndex >= 0 && data.open) {\n optionListRef.value?.scrollIntoActive();\n }\n});\n</script>\n\n<template>\n <div class=\"pl-dropdown__envelope\" @click=\"setFocusOnInput\">\n <div\n ref=\"rootRef\"\n :tabindex=\"tabindex\"\n class=\"pl-dropdown\"\n :class=\"{ open: data.open, error, disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"pl-dropdown__container\">\n <div class=\"pl-dropdown__field\">\n <input\n ref=\"input\"\n v-model=\"data.search\"\n type=\"text\"\n tabindex=\"-1\"\n :disabled=\"isDisabled\"\n :placeholder=\"computedPlaceholder\"\n spellcheck=\"false\"\n autocomplete=\"chrome-off\"\n @focus=\"onInputFocus\"\n />\n\n <div v-if=\"!data.open\" class=\"input-value\">\n <LongText> {{ textValue }} </LongText>\n </div>\n\n <div class=\"pl-dropdown__controls\">\n <PlIcon24 v-if=\"isLoadingOptions\" name=\"loading\" />\n <PlIcon16 v-if=\"clearable && hasValue\" class=\"clear\" name=\"delete-clear\" @click.stop=\"clear\" />\n <slot name=\"append\" />\n <div class=\"pl-dropdown__arrow-wrapper\" @click.stop=\"toggleOpen\">\n <PlIcon24 v-if=\"arrowIconLarge\" :name=\"arrowIconLarge\" class=\"arrow-icon\" />\n <PlIcon16 v-else-if=\"arrowIcon\" :name=\"arrowIcon\" class=\"arrow-icon\" />\n <PlIcon16 v-else name=\"chevron-down\" class=\"arrow-icon arrow-icon-default\" />\n </div>\n </div>\n </div>\n <label v-if=\"label\">\n <SvgRequired v-if=\"required\" />\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 <OptionList\n v-if=\"data.open\"\n ref=\"optionListRef\"\n :root-ref=\"rootRef!\"\n :groups=\"groupsRef\"\n :rest=\"restRef\"\n :option-size=\"optionSize\"\n :select-option=\"selectOptionWrapper\"\n />\n <DoubleContour class=\"pl-dropdown__contour\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"pl-dropdown__error\">{{ computedError }}</div>\n <div v-else-if=\"isLoadingOptions && loadingOptionsHelper\" class=\"pl-dropdown__helper\">{{ loadingOptionsHelper }}</div>\n <div v-else-if=\"helper\" class=\"pl-dropdown__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"names":["__default__","emit","__emit","props","__props","rootRef","ref","input","optionListRef","useTemplateRef","data","reactive","findActiveIndex","tap","orderedRef","o","deepEqual","v","updateActive","isLoadingOptions","computed","isDisabled","selectedIndex","computedError","getErrorMessage","optionsRef","normalizeListOptions","opt","index","textValue","item","unref","computedPlaceholder","hasValue","filteredRef","options","search","groupsRef","restRef","useGroupBy","tabindex","selectOption","_a","selectOptionWrapper","clear","setFocusOnInput","toggleOpen","onInputFocus","onFocusOut","event","relatedTarget","_c","_b","handleKeydown","open","activeIndex","ordered","length","it","localIndex","delta","newIndex","useLabelNotch","watch","watchPostEffect"],"mappings":"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"}

package/dist/components/PlDropdown/__tests__/PlDropdown.spec.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export {};

package/dist/components/PlDropdown/index.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export { default as PlDropdown } from './PlDropdown.vue';
2	- //# sourceMappingURL=index.d.ts.map

package/dist/components/PlDropdown/types.d.ts CHANGED Viewed

@@ -4,4 +4,3 @@ export type LOption<M = unknown> = ListOptionNormalized<M> & {
     isActive: boolean;
     index: number;
 };
-//# sourceMappingURL=types.d.ts.map

package/dist/components/PlDropdown/useGroupBy.d.ts CHANGED Viewed

@@ -4,4 +4,3 @@ export declare function useGroupBy<T, K extends keyof T>(list: Ref<T[]>, byKey:
     groupsRef: import('vue').ComputedRef<Map<NonNullable<T[K]>, T[]>>;
     restRef: import('vue').ComputedRef<T[]>;
 };
-//# sourceMappingURL=useGroupBy.d.ts.map

package/dist/components/PlDropdown/useGroupBy.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useGroupBy.js","sources":["../../../src/components/PlDropdown/useGroupBy.ts"],"sourcesContent":["import type { Ref } from 'vue';\nimport { computed } from 'vue';\n\nfunction groupBy<T, K extends keyof T>(\n list: T[],\n groupBy: K,\n): {\n grouped: Map<NonNullable<T[K]>, T[]>;\n rest: T[];\n ordered: T[];\n } {\n const grouped: Map<NonNullable<T[K]>, T[]> = new Map();\n\n if (!list) {\n return {\n grouped,\n rest: [],\n ordered: [],\n };\n }\n\n // Group items by the specified key\n for (const item of list) {\n const key = item[groupBy];\n if (key === undefined) continue;\n if (key === null) continue;\n if (!grouped.has(key)) grouped.set(key, []);\n grouped.get(key)?.push(item);\n }\n\n // Items without a group key\n const rest = list.filter((item: T) => {\n const key = item[groupBy];\n return key === undefined \|\| key === null;\n });\n\n const ordered = [...Array.from(grouped.values()).flat(), ...rest];\n\n return {\n grouped,\n rest,\n ordered,\n };\n}\n\nexport function useGroupBy<T, K extends keyof T>(\n list: Ref<T[]>,\n byKey: K,\n) {\n const result = computed(() => groupBy(list.value, byKey));\n\n const orderedRef = computed(() => result.value.ordered);\n\n const groupsRef = computed(() => result.value.grouped);\n\n const restRef = computed(() => result.value.rest);\n\n return {\n orderedRef,\n groupsRef,\n restRef,\n };\n}\n"],"names":["groupBy","list","grouped","item","key","_a","rest","ordered","useGroupBy","byKey","result","computed","orderedRef","groupsRef","restRef"],"mappings":";AAGA,SAASA,EACPC,GACAD,GAKE;;~~AACI~~,~~QAAAE~~,wBAA2C,~~IAAI~~;~~AAErD~~,MAAI,CAACD;~~AACI~~,~~WAAA~~;AAAA,MACL,SAAAC;AAAA,MACA,MAAM,~~CAAC~~;AAAA,~~MACP~~,SAAS,CAAA;AAAA,~~IACX~~;~~AAIF~~,aAAWC,KAAQF,GAAM;~~AACjB~~,~~UAAAG~~,IAAMD,EAAKH,CAAO;AACxB,IAAII,MAAQ,UACRA,MAAQ,SACPF,EAAQ,IAAIE,CAAG,~~KAAWF~~,~~EAAA~~,IAAIE,GAAK,EAAE,IAC1CC,IAAAH,EAAQ,IAAIE,CAAG,MAAf,QAAAC,EAAkB,KAAKF;AAAA,~~EAAI~~;~~AAI7B~~,QAAMG,IAAOL,EAAK,OAAO,CAACE,MAAY;~~AAC9B~~,~~UAAAC~~,IAAMD,EAAKH,CAAO;~~AACjB~~,~~WAAqBI~~,KAAQ;AAAA,~~EAAA~~,~~CACrC~~,GAEKG,IAAU,CAAC,GAAG,MAAM,KAAKL,EAAQ,~~OAAO~~,~~CAAC~~,EAAE,QAAQ,GAAGI,CAAI;~~AAEzD~~,~~SAAA~~;AAAA,IACL,SAAAJ;AAAA,IACA,MAAAI;AAAA,IACA,SAAAC;AAAA,~~EACF~~;~~AACF~~;~~AAEgB~~,~~SAAAC~~,EACdP,GACAQ,GACA;AACA,QAAMC,IAASC,EAAS,MAAMX,EAAQC,EAAK,OAAOQ,CAAK,CAAC,GAElDG,IAAaD,EAAS,MAAMD,EAAO,MAAM,OAAO,GAEhDG,IAAYF,EAAS,MAAMD,EAAO,MAAM,OAAO,GAE/CI,IAAUH,EAAS,MAAMD,EAAO,MAAM,IAAI;~~AAEzC~~,~~SAAA~~;AAAA,IACL,YAAAE;AAAA,IACA,WAAAC;AAAA,IACA,SAAAC;AAAA,~~EACF~~;~~AACF~~;"}
1	+ {"version":3,"file":"useGroupBy.js","sources":["../../../src/components/PlDropdown/useGroupBy.ts"],"sourcesContent":["import type { Ref } from 'vue';\nimport { computed } from 'vue';\n\nfunction groupBy<T, K extends keyof T>(\n list: T[],\n groupBy: K,\n): {\n grouped: Map<NonNullable<T[K]>, T[]>;\n rest: T[];\n ordered: T[];\n } {\n const grouped: Map<NonNullable<T[K]>, T[]> = new Map();\n\n if (!list) {\n return {\n grouped,\n rest: [],\n ordered: [],\n };\n }\n\n // Group items by the specified key\n for (const item of list) {\n const key = item[groupBy];\n if (key === undefined) continue;\n if (key === null) continue;\n if (!grouped.has(key)) grouped.set(key, []);\n grouped.get(key)?.push(item);\n }\n\n // Items without a group key\n const rest = list.filter((item: T) => {\n const key = item[groupBy];\n return key === undefined \|\| key === null;\n });\n\n const ordered = [...Array.from(grouped.values()).flat(), ...rest];\n\n return {\n grouped,\n rest,\n ordered,\n };\n}\n\nexport function useGroupBy<T, K extends keyof T>(\n list: Ref<T[]>,\n byKey: K,\n) {\n const result = computed(() => groupBy(list.value, byKey));\n\n const orderedRef = computed(() => result.value.ordered);\n\n const groupsRef = computed(() => result.value.grouped);\n\n const restRef = computed(() => result.value.rest);\n\n return {\n orderedRef,\n groupsRef,\n restRef,\n };\n}\n"],"names":["groupBy","list","grouped","item","key","_a","rest","ordered","useGroupBy","byKey","result","computed","orderedRef","groupsRef","restRef"],"mappings":";AAGA,SAASA,EACPC,GACAD,GAKE;;AACF,QAAME,wBAA2C,IAAA;AAEjD,MAAI,CAACD;AACH,WAAO;AAAA,MACL,SAAAC;AAAA,MACA,MAAM,CAAA;AAAA,MACN,SAAS,CAAA;AAAA,IAAC;AAKd,aAAWC,KAAQF,GAAM;AACvB,UAAMG,IAAMD,EAAKH,CAAO;AACxB,IAAII,MAAQ,UACRA,MAAQ,SACPF,EAAQ,IAAIE,CAAG,KAAGF,EAAQ,IAAIE,GAAK,EAAE,IAC1CC,IAAAH,EAAQ,IAAIE,CAAG,MAAf,QAAAC,EAAkB,KAAKF;AAAA,EACzB;AAGA,QAAMG,IAAOL,EAAK,OAAO,CAACE,MAAY;AACpC,UAAMC,IAAMD,EAAKH,CAAO;AACxB,WAA4BI,KAAQ;AAAA,EACtC,CAAC,GAEKG,IAAU,CAAC,GAAG,MAAM,KAAKL,EAAQ,OAAA,CAAQ,EAAE,QAAQ,GAAGI,CAAI;AAEhE,SAAO;AAAA,IACL,SAAAJ;AAAA,IACA,MAAAI;AAAA,IACA,SAAAC;AAAA,EAAA;AAEJ;AAEO,SAASC,EACdP,GACAQ,GACA;AACA,QAAMC,IAASC,EAAS,MAAMX,EAAQC,EAAK,OAAOQ,CAAK,CAAC,GAElDG,IAAaD,EAAS,MAAMD,EAAO,MAAM,OAAO,GAEhDG,IAAYF,EAAS,MAAMD,EAAO,MAAM,OAAO,GAE/CI,IAAUH,EAAS,MAAMD,EAAO,MAAM,IAAI;AAEhD,SAAO;AAAA,IACL,YAAAE;AAAA,IACA,WAAAC;AAAA,IACA,SAAAC;AAAA,EAAA;AAEJ;"}

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

@@ -75,4 +75,3 @@ export default _default;
 type __VLS_PrettifyLocal<T> = {
     [K in keyof T]: T[K];
 } & {};
-//# sourceMappingURL=PlDropdownLegacy.vue.d.ts.map

package/dist/components/PlDropdownLegacy/PlDropdownLegacy.vue.js CHANGED Viewed

@@ -14,7 +14,7 @@ import we from "../LongText.vue.js";
 import ke from "../PlIcon16/PlIcon16.vue.js";
 import ye from "../PlIcon24/PlIcon24.vue.js";
 import { normalizeListOptions as Ie } from "../../helpers/utils.js";
-import ge from "../../generated/components/svg/images/SvgRequired.vue2.js";
+import ge from "../../generated/components/svg/images/SvgRequired.vue.js";
 import { getErrorMessage as Ve } from "../../helpers/error.js";
 const be = { class: "ui-dropdown__envelope" }, Ce = ["tabindex"], Ee = { class: "ui-dropdown__container" }, Le = { class: "ui-dropdown__field" }, Se = ["disabled", "placeholder"], xe = { class: "ui-dropdown__controls" }, Ae = { key: 0 }, Oe = {
   key: 0,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PlDropdownLegacy.vue.js","sources":["../../../src/components/PlDropdownLegacy/PlDropdownLegacy.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n A component for selecting one value from a list of options\n /\nexport default {\n name: 'PlDropdown',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport './pl-dropdown-legacy.scss';\nimport { computed, reactive, ref, unref, useSlots, watch, watchPostEffect } from 'vue';\nimport { tap, tapIf } from '../../helpers/functions';\nimport { PlTooltip } from '../PlTooltip';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport type { ListOption, ListOptionNormalized } from '../../types';\nimport { scrollIntoView } from '../../helpers/dom';\nimport { deepEqual } from '../../helpers/objects';\nimport DropdownListItem from '../DropdownListItem.vue';\nimport LongText from '../LongText.vue';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport { normalizeListOptions } from '../../helpers/utils';\nimport SvgRequired from '../../generated/components/svg/images/SvgRequired.vue';\nimport { getErrorMessage } from '../../helpers/error.ts';\n\nconst emit = defineEmits<{\n /\n Emitted when the model value is updated.\n /\n (e: 'update:modelValue', value: M \| undefined): void;\n}>();\n\nconst props = withDefaults(\n defineProps<{\n /\n The current selected value of the dropdown.\n /\n modelValue: M;\n /\n The label text for the dropdown field (optional)\n /\n label?: string;\n /\n List of available options for the dropdown\n /\n options?: Readonly<ListOption<M>[]>;\n /\n A helper text displayed below the dropdown when there are no errors (optional).\n /\n helper?: string;\n /\n A helper text displayed below the dropdown when there are no options yet or options is undefined (optional).\n /\n loadingOptionsHelper?: string;\n /\n Error message displayed below the dropdown (optional)\n /\n error?: unknown;\n /\n Placeholder text shown when no value is selected.\n /\n placeholder?: string;\n /\n Enables a button to clear the selected value (default: false)\n /\n clearable?: boolean;\n /\n If `true`, the dropdown component is marked as required.\n /\n required?: boolean;\n /\n If `true`, the dropdown component is disabled and cannot be interacted with.\n /\n disabled?: boolean;\n /\n Custom icon (16px) class for the dropdown arrow (optional)\n /\n arrowIcon?: string;\n /\n Custom icon (24px) class for the dropdown arrow (optional)\n /\n arrowIconLarge?: string;\n /\n Option list item size\n */\n optionSize?: 'small' \| 'medium';\n }>(),\n {\n label: '',\n helper: undefined,\n loadingOptionsHelper: undefined,\n error: undefined,\n placeholder: '...',\n clearable: false,\n required: false,\n disabled: false,\n arrowIcon: undefined,\n arrowIconLarge: undefined,\n optionSize: 'small',\n options: undefined,\n },\n);\n\nconst slots = useSlots();\n\nconst root = ref<HTMLElement \| undefined>();\nconst list = ref<HTMLElement \| undefined>();\nconst input = ref<HTMLInputElement \| undefined>();\n\nconst data = reactive({\n search: '',\n activeIndex: -1,\n open: false,\n});\n\nconst findActiveIndex = () =>\n tap(\n filteredRef.value.findIndex((o) => deepEqual(o.value, props.modelValue)),\n (v) => (v < 0 ? 0 : v),\n );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst isLoadingOptions = computed(() => {\n return props.options === undefined;\n});\n\nconst isDisabled = computed(() => {\n if (isLoadingOptions.value) {\n return true;\n }\n\n return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n return (props.options ?? []).findIndex((o) => deepEqual(o.value, props.modelValue));\n});\n\nconst computedError = computed(() => {\n if (isLoadingOptions.value) {\n return undefined;\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (props.modelValue !== undefined && selectedIndex.value === -1) {\n return 'The selected value is not one of the options';\n }\n\n return undefined;\n});\n\nconst optionsRef = computed(() =>\n normalizeListOptions(props.options ?? []).map((opt, index) => ({\n ...opt,\n index,\n isSelected: index === selectedIndex.value,\n isActive: index === data.activeIndex,\n })),\n);\n\nconst textValue = computed(() => {\n const options = unref(optionsRef);\n\n const item: ListOption \| undefined = options.find((o) => deepEqual(o.value, props.modelValue));\n\n return item?.label \|\| props.modelValue; // @todo show inner value?\n});\n\nconst computedPlaceholder = computed(() => {\n if (!data.open && props.modelValue) {\n return '';\n }\n\n return props.modelValue ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n return props.modelValue !== undefined && props.modelValue !== null;\n});\n\nconst filteredRef = computed(() => {\n const options = optionsRef.value;\n\n if (data.search) {\n return options.filter((o: ListOptionNormalized) => {\n const search = data.search.toLowerCase();\n\n if (o.label.toLowerCase().includes(search)) {\n return true;\n }\n\n if (o.description && o.description.toLowerCase().includes(search)) {\n return true;\n }\n\n if (typeof o.value === 'string') {\n return o.value.toLowerCase().includes(search);\n }\n\n return o.value === data.search;\n });\n }\n\n return options;\n});\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : '0'));\n\nconst selectOption = (v: M \| undefined) => {\n emit('update:modelValue', v);\n data.search = '';\n data.open = false;\n root?.value?.focus();\n};\n\nconst clear = () => emit('update:modelValue', undefined);\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => (data.open = !data.open);\n\nconst onInputFocus = () => (data.open = true);\n\nconst onFocusOut = (event: FocusEvent) => {\n if (!root?.value?.contains(event.relatedTarget as Node \| null)) {\n data.search = '';\n data.open = false;\n }\n};\n\nconst scrollIntoActive = () => {\n const $list = list.value;\n\n if (!$list) {\n return;\n }\n\n tapIf($list.querySelector('.hovered-item') as HTMLElement, (opt) => {\n scrollIntoView($list, opt);\n });\n};\n\nconst handleKeydown = (e: { code: string; preventDefault(): void }) => {\n if (!['ArrowDown', 'ArrowUp', 'Enter', 'Escape'].includes(e.code)) {\n return;\n } else {\n e.preventDefault();\n }\n\n const { open, activeIndex } = data;\n\n if (!open) {\n if (e.code === 'Enter') {\n data.open = true;\n }\n return;\n }\n\n if (e.code === 'Escape') {\n data.open = false;\n root.value?.focus();\n }\n\n const filtered = unref(filteredRef);\n\n const { length } = filtered;\n\n if (!length) {\n return;\n }\n\n if (e.code === 'Enter') {\n selectOption(filtered.find((it) => it.index === activeIndex)?.value);\n }\n\n const localIndex = filtered.findIndex((it) => it.index === activeIndex) ?? -1;\n\n const delta = e.code === 'ArrowDown' ? 1 : e.code === 'ArrowUp' ? -1 : 0;\n\n const newIndex = Math.abs(localIndex + delta + length) % length;\n\n data.activeIndex = filteredRef.value[newIndex].index ?? -1;\n};\n\nuseLabelNotch(root);\n\nwatch(() => props.modelValue, updateActive, { immediate: true });\n\nwatch(\n () => data.open,\n (open) => (open ? input.value?.focus() : ''),\n);\n\nwatchPostEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n data.search; // to watch\n\n if (data.activeIndex >= 0 && data.open) {\n scrollIntoActive();\n }\n});\n</script>\n\n<template>\n <div class=\"ui-dropdown__envelope\">\n <div\n ref=\"root\"\n :tabindex=\"tabindex\"\n class=\"ui-dropdown\"\n :class=\"{ open: data.open, error, disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"ui-dropdown__container\">\n <div class=\"ui-dropdown__field\">\n <input\n ref=\"input\"\n v-model=\"data.search\"\n type=\"text\"\n tabindex=\"-1\"\n :disabled=\"isDisabled\"\n :placeholder=\"computedPlaceholder\"\n spellcheck=\"false\"\n autocomplete=\"chrome-off\"\n @focus=\"onInputFocus\"\n />\n\n <div v-if=\"!data.open\" @click=\"setFocusOnInput\">\n <LongText class=\"input-value\"> {{ textValue }} </LongText>\n </div>\n\n <div class=\"ui-dropdown__controls\">\n <PlMaskIcon24 v-if=\"isLoadingOptions\" name=\"loading\" />\n <PlIcon16 v-if=\"clearable && hasValue\" class=\"clear\" name=\"delete-clear\" @click.stop=\"clear\" />\n <slot name=\"append\" />\n <div v-if=\"arrowIconLarge\" class=\"arrow-icon\" :class=\"[`icon-24 ${arrowIconLarge}`]\" @click.stop=\"toggleOpen\" />\n <div v-else-if=\"arrowIcon\" class=\"arrow-icon\" :class=\"[`icon-16 ${arrowIcon}`]\" @click.stop=\"toggleOpen\" />\n <div v-else class=\"arrow-icon arrow-icon-default\" @click.stop=\"toggleOpen\" />\n </div>\n </div>\n <label v-if=\"label\">\n <SvgRequired v-if=\"required\" />\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=\"data.open\" ref=\"list\" class=\"ui-dropdown__options\">\n <DropdownListItem\n v-for=\"(item, index) in filteredRef\"\n :key=\"index\"\n :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n @click.stop=\"selectOption(item.value)\"\n />\n <div v-if=\"!filteredRef.length\" class=\"nothing-found\">Nothing found</div>\n </div>\n <DoubleContour class=\"ui-dropdown__contour\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"ui-dropdown__error\">{{ computedError }}</div>\n <div v-else-if=\"isLoadingOptions && loadingOptionsHelper\" class=\"ui-dropdown__helper\">{{ loadingOptionsHelper }}</div>\n <div v-else-if=\"helper\" class=\"ui-dropdown__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"names":["__default__","emit","__emit","props","__props","slots","useSlots","root","ref","list","input","data","reactive","findActiveIndex","tap","filteredRef","o","deepEqual","v","updateActive","isLoadingOptions","computed","isDisabled","selectedIndex","computedError","getErrorMessage","optionsRef","normalizeListOptions","opt","index","textValue","item","unref","computedPlaceholder","hasValue","options","search","tabindex","selectOption","_a","clear","setFocusOnInput","toggleOpen","onInputFocus","onFocusOut","event","scrollIntoActive","$list","tapIf","scrollIntoView","handleKeydown","open","activeIndex","filtered","length","_b","it","localIndex","delta","newIndex","useLabelNotch","watch","watchPostEffect"],"mappings":"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"}
1	+ {"version":3,"file":"PlDropdownLegacy.vue.js","sources":["../../../src/components/PlDropdownLegacy/PlDropdownLegacy.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n A component for selecting one value from a list of options\n /\nexport default {\n name: 'PlDropdown',\n};\n</script>\n\n<script lang=\"ts\" setup generic=\"M = unknown\">\nimport './pl-dropdown-legacy.scss';\nimport { computed, reactive, ref, unref, useSlots, watch, watchPostEffect } from 'vue';\nimport { tap, tapIf } from '../../helpers/functions';\nimport { PlTooltip } from '../PlTooltip';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport type { ListOption, ListOptionNormalized } from '../../types';\nimport { scrollIntoView } from '../../helpers/dom';\nimport { deepEqual } from '../../helpers/objects';\nimport DropdownListItem from '../DropdownListItem.vue';\nimport LongText from '../LongText.vue';\nimport { PlIcon16 } from '../PlIcon16';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport { normalizeListOptions } from '../../helpers/utils';\nimport SvgRequired from '../../generated/components/svg/images/SvgRequired.vue';\nimport { getErrorMessage } from '../../helpers/error.ts';\n\nconst emit = defineEmits<{\n /\n Emitted when the model value is updated.\n /\n (e: 'update:modelValue', value: M \| undefined): void;\n}>();\n\nconst props = withDefaults(\n defineProps<{\n /\n The current selected value of the dropdown.\n /\n modelValue: M;\n /\n The label text for the dropdown field (optional)\n /\n label?: string;\n /\n List of available options for the dropdown\n /\n options?: Readonly<ListOption<M>[]>;\n /\n A helper text displayed below the dropdown when there are no errors (optional).\n /\n helper?: string;\n /\n A helper text displayed below the dropdown when there are no options yet or options is undefined (optional).\n /\n loadingOptionsHelper?: string;\n /\n Error message displayed below the dropdown (optional)\n /\n error?: unknown;\n /\n Placeholder text shown when no value is selected.\n /\n placeholder?: string;\n /\n Enables a button to clear the selected value (default: false)\n /\n clearable?: boolean;\n /\n If `true`, the dropdown component is marked as required.\n /\n required?: boolean;\n /\n If `true`, the dropdown component is disabled and cannot be interacted with.\n /\n disabled?: boolean;\n /\n Custom icon (16px) class for the dropdown arrow (optional)\n /\n arrowIcon?: string;\n /\n Custom icon (24px) class for the dropdown arrow (optional)\n /\n arrowIconLarge?: string;\n /\n Option list item size\n */\n optionSize?: 'small' \| 'medium';\n }>(),\n {\n label: '',\n helper: undefined,\n loadingOptionsHelper: undefined,\n error: undefined,\n placeholder: '...',\n clearable: false,\n required: false,\n disabled: false,\n arrowIcon: undefined,\n arrowIconLarge: undefined,\n optionSize: 'small',\n options: undefined,\n },\n);\n\nconst slots = useSlots();\n\nconst root = ref<HTMLElement \| undefined>();\nconst list = ref<HTMLElement \| undefined>();\nconst input = ref<HTMLInputElement \| undefined>();\n\nconst data = reactive({\n search: '',\n activeIndex: -1,\n open: false,\n});\n\nconst findActiveIndex = () =>\n tap(\n filteredRef.value.findIndex((o) => deepEqual(o.value, props.modelValue)),\n (v) => (v < 0 ? 0 : v),\n );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst isLoadingOptions = computed(() => {\n return props.options === undefined;\n});\n\nconst isDisabled = computed(() => {\n if (isLoadingOptions.value) {\n return true;\n }\n\n return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n return (props.options ?? []).findIndex((o) => deepEqual(o.value, props.modelValue));\n});\n\nconst computedError = computed(() => {\n if (isLoadingOptions.value) {\n return undefined;\n }\n\n if (props.error) {\n return getErrorMessage(props.error);\n }\n\n if (props.modelValue !== undefined && selectedIndex.value === -1) {\n return 'The selected value is not one of the options';\n }\n\n return undefined;\n});\n\nconst optionsRef = computed(() =>\n normalizeListOptions(props.options ?? []).map((opt, index) => ({\n ...opt,\n index,\n isSelected: index === selectedIndex.value,\n isActive: index === data.activeIndex,\n })),\n);\n\nconst textValue = computed(() => {\n const options = unref(optionsRef);\n\n const item: ListOption \| undefined = options.find((o) => deepEqual(o.value, props.modelValue));\n\n return item?.label \|\| props.modelValue; // @todo show inner value?\n});\n\nconst computedPlaceholder = computed(() => {\n if (!data.open && props.modelValue) {\n return '';\n }\n\n return props.modelValue ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n return props.modelValue !== undefined && props.modelValue !== null;\n});\n\nconst filteredRef = computed(() => {\n const options = optionsRef.value;\n\n if (data.search) {\n return options.filter((o: ListOptionNormalized) => {\n const search = data.search.toLowerCase();\n\n if (o.label.toLowerCase().includes(search)) {\n return true;\n }\n\n if (o.description && o.description.toLowerCase().includes(search)) {\n return true;\n }\n\n if (typeof o.value === 'string') {\n return o.value.toLowerCase().includes(search);\n }\n\n return o.value === data.search;\n });\n }\n\n return options;\n});\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : '0'));\n\nconst selectOption = (v: M \| undefined) => {\n emit('update:modelValue', v);\n data.search = '';\n data.open = false;\n root?.value?.focus();\n};\n\nconst clear = () => emit('update:modelValue', undefined);\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => (data.open = !data.open);\n\nconst onInputFocus = () => (data.open = true);\n\nconst onFocusOut = (event: FocusEvent) => {\n if (!root?.value?.contains(event.relatedTarget as Node \| null)) {\n data.search = '';\n data.open = false;\n }\n};\n\nconst scrollIntoActive = () => {\n const $list = list.value;\n\n if (!$list) {\n return;\n }\n\n tapIf($list.querySelector('.hovered-item') as HTMLElement, (opt) => {\n scrollIntoView($list, opt);\n });\n};\n\nconst handleKeydown = (e: { code: string; preventDefault(): void }) => {\n if (!['ArrowDown', 'ArrowUp', 'Enter', 'Escape'].includes(e.code)) {\n return;\n } else {\n e.preventDefault();\n }\n\n const { open, activeIndex } = data;\n\n if (!open) {\n if (e.code === 'Enter') {\n data.open = true;\n }\n return;\n }\n\n if (e.code === 'Escape') {\n data.open = false;\n root.value?.focus();\n }\n\n const filtered = unref(filteredRef);\n\n const { length } = filtered;\n\n if (!length) {\n return;\n }\n\n if (e.code === 'Enter') {\n selectOption(filtered.find((it) => it.index === activeIndex)?.value);\n }\n\n const localIndex = filtered.findIndex((it) => it.index === activeIndex) ?? -1;\n\n const delta = e.code === 'ArrowDown' ? 1 : e.code === 'ArrowUp' ? -1 : 0;\n\n const newIndex = Math.abs(localIndex + delta + length) % length;\n\n data.activeIndex = filteredRef.value[newIndex].index ?? -1;\n};\n\nuseLabelNotch(root);\n\nwatch(() => props.modelValue, updateActive, { immediate: true });\n\nwatch(\n () => data.open,\n (open) => (open ? input.value?.focus() : ''),\n);\n\nwatchPostEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n data.search; // to watch\n\n if (data.activeIndex >= 0 && data.open) {\n scrollIntoActive();\n }\n});\n</script>\n\n<template>\n <div class=\"ui-dropdown__envelope\">\n <div\n ref=\"root\"\n :tabindex=\"tabindex\"\n class=\"ui-dropdown\"\n :class=\"{ open: data.open, error, disabled: isDisabled }\"\n @keydown=\"handleKeydown\"\n @focusout=\"onFocusOut\"\n >\n <div class=\"ui-dropdown__container\">\n <div class=\"ui-dropdown__field\">\n <input\n ref=\"input\"\n v-model=\"data.search\"\n type=\"text\"\n tabindex=\"-1\"\n :disabled=\"isDisabled\"\n :placeholder=\"computedPlaceholder\"\n spellcheck=\"false\"\n autocomplete=\"chrome-off\"\n @focus=\"onInputFocus\"\n />\n\n <div v-if=\"!data.open\" @click=\"setFocusOnInput\">\n <LongText class=\"input-value\"> {{ textValue }} </LongText>\n </div>\n\n <div class=\"ui-dropdown__controls\">\n <PlMaskIcon24 v-if=\"isLoadingOptions\" name=\"loading\" />\n <PlIcon16 v-if=\"clearable && hasValue\" class=\"clear\" name=\"delete-clear\" @click.stop=\"clear\" />\n <slot name=\"append\" />\n <div v-if=\"arrowIconLarge\" class=\"arrow-icon\" :class=\"[`icon-24 ${arrowIconLarge}`]\" @click.stop=\"toggleOpen\" />\n <div v-else-if=\"arrowIcon\" class=\"arrow-icon\" :class=\"[`icon-16 ${arrowIcon}`]\" @click.stop=\"toggleOpen\" />\n <div v-else class=\"arrow-icon arrow-icon-default\" @click.stop=\"toggleOpen\" />\n </div>\n </div>\n <label v-if=\"label\">\n <SvgRequired v-if=\"required\" />\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=\"data.open\" ref=\"list\" class=\"ui-dropdown__options\">\n <DropdownListItem\n v-for=\"(item, index) in filteredRef\"\n :key=\"index\"\n :option=\"item\"\n :is-selected=\"item.isSelected\"\n :is-hovered=\"item.isActive\"\n :size=\"optionSize\"\n @click.stop=\"selectOption(item.value)\"\n />\n <div v-if=\"!filteredRef.length\" class=\"nothing-found\">Nothing found</div>\n </div>\n <DoubleContour class=\"ui-dropdown__contour\" />\n </div>\n </div>\n <div v-if=\"computedError\" class=\"ui-dropdown__error\">{{ computedError }}</div>\n <div v-else-if=\"isLoadingOptions && loadingOptionsHelper\" class=\"ui-dropdown__helper\">{{ loadingOptionsHelper }}</div>\n <div v-else-if=\"helper\" class=\"ui-dropdown__helper\">{{ helper }}</div>\n </div>\n</template>\n"],"names":["__default__","emit","__emit","props","__props","slots","useSlots","root","ref","list","input","data","reactive","findActiveIndex","tap","filteredRef","o","deepEqual","v","updateActive","isLoadingOptions","computed","isDisabled","selectedIndex","computedError","getErrorMessage","optionsRef","normalizeListOptions","opt","index","textValue","item","unref","computedPlaceholder","hasValue","options","search","tabindex","selectOption","_a","clear","setFocusOnInput","toggleOpen","onInputFocus","onFocusOut","event","scrollIntoActive","$list","tapIf","scrollIntoView","handleKeydown","open","activeIndex","filtered","length","_b","it","localIndex","delta","newIndex","useLabelNotch","watch","watchPostEffect"],"mappings":"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"}

package/dist/components/PlDropdownLegacy/__tests__/PlDropdownLegacy.spec.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export {};

package/dist/components/PlDropdownLegacy/index.d.ts CHANGED Viewed

	@@ -1,2 +1 @@
1 1	export { default as PlDropdownLegacy } from './PlDropdownLegacy.vue';
2	- //# sourceMappingURL=index.d.ts.map

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

@@ -14,14 +14,14 @@ declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
         item?(_: {
-            item: import('../..').ListOptionNormalized<unknown>;
+            item: import('@milaboratories/pl-model-common').ListOptionBase<unknown>;
             textItem: string;
             isSelected: boolean;
             isHovered: boolean;
             onClick: ($event: any) => void;
         }): any;
         item?(_: {
-            item: import('../..').ListOptionNormalized<unknown>;
+            item: import('@milaboratories/pl-model-common').ListOptionBase<unknown>;
             isSelected: boolean;
             isHovered: boolean;
             onClick: ($event: any) => void;
@@ -55,4 +55,3 @@ type __VLS_WithTemplateSlots<T, S> = T & {
         $slots: S;
     };
 };
-//# sourceMappingURL=PlDropdownLine.vue.d.ts.map