@milaboratories/uikit 2.16.0 → 2.16.1

package/dist/components/InputRange.vue2.js

@@ -1,9 +1,9 @@
 import { computed as e, createElementBlock as t, createElementVNode as n, defineComponent as r, mergeProps as i, openBlock as a, reactive as o, ref as s, toDisplayString as c, vModelText as l, watch as u, withDirectives as d } from "vue";
-//#region src/components/InputRange.vue?vue&type=script&setup=true&lang.ts
+// src/components/InputRange.vue?vue&type=script&setup=true&lang.ts
 var f = {
 	"data-testid": "pl-input-range-separator",
 	class: "ui-input-range__separator"
-}, p = /* @__PURE__ */ r({
+}, p = /*@__PURE__*/ r({
 	__name: "InputRange",
 	props: {
 		modelValue: {},
@@ -59,7 +59,6 @@ var f = {
 		], 16));
 	}
 });
-//#endregion
 export { p as default };
 
 //# sourceMappingURL=InputRange.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"InputRange.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../src/components/InputRange.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, reactive, ref, watch } from \"vue\";\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: [number, number];\n    separator?: string;\n  }>(),\n  {\n    separator: \"-\",\n  },\n);\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", val: [number, number]): void;\n  (e: \"change\", val: [number, number]): void;\n}>();\n\nconst data = reactive({\n  left: props.modelValue[0],\n  right: props.modelValue[1],\n});\n\nconst isFocused = ref(false);\n\nconst classes = computed(() =>\n  isFocused.value ? \"ui-input-range-focused\" : \"ui-input-range-focused\",\n);\n\nconst valuesModel = computed({\n  get() {\n    return {\n      left: Math.min(...props.modelValue), // dangerous....\n      right: Math.max(...props.modelValue),\n    };\n  },\n  set() {},\n});\n\nwatch(\n  () => valuesModel.value,\n  (value) => (data.left = value.left) && (data.right = value.right),\n);\n\n// watch(\n//   () => props.modelValue,\n//   (value: [number, number]) => {\n//     console.log('model value updated');\n//     (data.left = value[0]), (data.right = value[1]);\n//   },\n// );\n\nfunction updateModel() {\n  emit(\"update:modelValue\", [+data.left, +data.right]);\n  emit(\"change\", [+data.left, +data.right]);\n}\n\nfunction validateInput(isLeft: boolean, event: Event) {\n  const value: string = (event.target as HTMLInputElement).value;\n  const result = /^[0-9]{0,2}$/.test(value);\n  // if there is more than 3 digits we cut last one\n  if (!result) {\n    if (isLeft) {\n      data.left = +value.slice(0, value.length - 1);\n    } else {\n      data.right = +value.slice(0, value.length - 1);\n    }\n  } else {\n    if (isLeft) {\n      data.left = +value;\n    } else {\n      data.right = +value;\n    }\n  }\n}\n</script>\n\n<template>\n  <!-- {{ data }} -->\n  <div :class=\"classes\" class=\"ui-input-range\" data-testid=\"pl-input-range\" v-bind=\"$attrs\">\n    <input\n      v-model=\"valuesModel.left\"\n      data-testid=\"pl-input-range-left\"\n      class=\"text-s\"\n      type=\"text\"\n      @change=\"updateModel\"\n      @focus=\"isFocused = true\"\n      @focusout=\"isFocused = false\"\n      @input=\"validateInput(true, $event)\"\n    />\n    <div data-testid=\"pl-input-range-separator\" class=\"ui-input-range__separator\">\n      {{ props.separator }}\n    </div>\n    <input\n      v-model=\"valuesModel.right\"\n      data-testid=\"pl-input-range-right\"\n      class=\"text-s\"\n      type=\"text\"\n      @change=\"updateModel\"\n      @focus=\"isFocused = true\"\n      @focusout=\"isFocused = false\"\n      @input=\"validateInput(false, $event)\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAGA,IAAM,IAAQ,GAUR,IAAO,GAKP,IAAO,EAAS;GACpB,MAAM,EAAM,WAAW;GACvB,OAAO,EAAM,WAAW;GACzB,CAAC,EAEI,IAAY,EAAI,GAAM,EAEtB,IAAU,SACd,EAAU,OAAQ,0BACnB,EAEK,IAAc,EAAS;GAC3B,MAAM;AACJ,WAAO;KACL,MAAM,KAAK,IAAI,GAAG,EAAM,WAAW;KACnC,OAAO,KAAK,IAAI,GAAG,EAAM,WAAW;KACrC;;GAEH,MAAM;GACP,CAAC;AAEF,UACQ,EAAY,QACjB,OAAW,EAAK,OAAO,EAAM,UAAU,EAAK,QAAQ,EAAM,OAC5D;EAUD,SAAS,IAAc;AAErB,GADA,EAAK,qBAAqB,CAAC,CAAC,EAAK,MAAM,CAAC,EAAK,MAAM,CAAC,EACpD,EAAK,UAAU,CAAC,CAAC,EAAK,MAAM,CAAC,EAAK,MAAM,CAAC;;EAG3C,SAAS,EAAc,GAAiB,GAAc;GACpD,IAAM,IAAiB,EAAM,OAA4B;AAGzD,GAFe,eAAe,KAAK,EAAM,GASnC,IACF,EAAK,OAAO,CAAC,IAEb,EAAK,QAAQ,CAAC,IATZ,IACF,EAAK,OAAO,CAAC,EAAM,MAAM,GAAG,EAAM,SAAS,EAAE,GAE7C,EAAK,QAAQ,CAAC,EAAM,MAAM,GAAG,EAAM,SAAS,EAAE;;yBAclD,EAwBM,OAxBN,EAwBM;GAxBA,OAAK,CAAE,EAAA,OAAe,iBAAgB;GAAC,eAAY;KAAyBA,EAAAA,OAAM,EAAA;KACtF,EASE,SAAA;6CARS,MAAY,OAAI;IACzB,eAAY;IACZ,OAAM;IACN,MAAK;IACJ,UAAQ;IACR,SAAK,AAAA,EAAA,QAAA,MAAE,EAAA,QAAS;IAChB,YAAQ,AAAA,EAAA,QAAA,MAAE,EAAA,QAAS;IACnB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAa,IAAO,EAAM;uBAPzB,EAAA,MAAY,KAAI,CAAA,CAAA;GAS3B,EAEM,OAFN,GAEM,EADD,EAAM,UAAS,EAAA,EAAA;KAEpB,EASE,SAAA;6CARS,MAAY,QAAK;IAC1B,eAAY;IACZ,OAAM;IACN,MAAK;IACJ,UAAQ;IACR,SAAK,AAAA,EAAA,QAAA,MAAE,EAAA,QAAS;IAChB,YAAQ,AAAA,EAAA,QAAA,MAAE,EAAA,QAAS;IACnB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAa,IAAQ,EAAM;uBAP1B,EAAA,MAAY,MAAK,CAAA,CAAA"}
+{"version":3,"file":"InputRange.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_openBlock","_createElementBlock","_mergeProps","_withDirectives","_createElementVNode","_vModelText","_toDisplayString","_hoisted_1","InputRange_vue_vue_type_script_setup_true_lang_default","__emit","props","__props","emit","data","reactive","isFocused","ref","classes","computed","valuesModel","value","updateModel","validateInput","event","isLeft","openBlock","createElementBlock","mergeProps","_ctx","withDirectives","createElementVNode","_cache","$event","vModelText","toDisplayString"],"sources":["../../src/components/InputRange.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, reactive, ref, watch } from \"vue\";\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: [number, number];\n    separator?: string;\n  }>(),\n  {\n    separator: \"-\",\n  },\n);\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", val: [number, number]): void;\n  (e: \"change\", val: [number, number]): void;\n}>();\n\nconst data = reactive({\n  left: props.modelValue[0],\n  right: props.modelValue[1],\n});\n\nconst isFocused = ref(false);\n\nconst classes = computed(() =>\n  isFocused.value ? \"ui-input-range-focused\" : \"ui-input-range-focused\",\n);\n\nconst valuesModel = computed({\n  get() {\n    return {\n      left: Math.min(...props.modelValue), // dangerous....\n      right: Math.max(...props.modelValue),\n    };\n  },\n  set() {},\n});\n\nwatch(\n  () => valuesModel.value,\n  (value) => (data.left = value.left) && (data.right = value.right),\n);\n\n// watch(\n//   () => props.modelValue,\n//   (value: [number, number]) => {\n//     console.log('model value updated');\n//     (data.left = value[0]), (data.right = value[1]);\n//   },\n// );\n\nfunction updateModel() {\n  emit(\"update:modelValue\", [+data.left, +data.right]);\n  emit(\"change\", [+data.left, +data.right]);\n}\n\nfunction validateInput(isLeft: boolean, event: Event) {\n  const value: string = (event.target as HTMLInputElement).value;\n  const result = /^[0-9]{0,2}$/.test(value);\n  // if there is more than 3 digits we cut last one\n  if (!result) {\n    if (isLeft) {\n      data.left = +value.slice(0, value.length - 1);\n    } else {\n      data.right = +value.slice(0, value.length - 1);\n    }\n  } else {\n    if (isLeft) {\n      data.left = +value;\n    } else {\n      data.right = +value;\n    }\n  }\n}\n</script>\n\n<template>\n  <!-- {{ data }} -->\n  <div :class=\"classes\" class=\"ui-input-range\" data-testid=\"pl-input-range\" v-bind=\"$attrs\">\n    <input\n      v-model=\"valuesModel.left\"\n      data-testid=\"pl-input-range-left\"\n      class=\"text-s\"\n      type=\"text\"\n      @change=\"updateModel\"\n      @focus=\"isFocused = true\"\n      @focusout=\"isFocused = false\"\n      @input=\"validateInput(true, $event)\"\n    />\n    <div data-testid=\"pl-input-range-separator\" class=\"ui-input-range__separator\">\n      {{ props.separator }}\n    </div>\n    <input\n      v-model=\"valuesModel.right\"\n      data-testid=\"pl-input-range-right\"\n      class=\"text-s\"\n      type=\"text\"\n      @change=\"updateModel\"\n      @focus=\"isFocused = true\"\n      @focusout=\"isFocused = false\"\n      @input=\"validateInput(false, $event)\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAGA,IAAMW,IAAQC,GAURC,IAAOH,GAKPI,IAAOC,EAAS;GACpB,MAAMJ,EAAM,WAAW;GACvB,OAAOA,EAAM,WAAW;EAC1B,CAAC,GAEKK,IAAYC,EAAI,EAAK,GAErBC,IAAUC,SACdH,EAAU,OAAQ,yBACpB,GAEMI,IAAcD,EAAS;GAC3B,MAAM;IACJ,OAAO;KACL,MAAM,KAAK,IAAI,GAAGR,EAAM,UAAU;KAClC,OAAO,KAAK,IAAI,GAAGA,EAAM,UAAU;IACrC;GACF;GACA,MAAM,CAAC;EACT,CAAC;EAED,QACQS,EAAY,QACjB,OAAW,EAAK,OAAOC,EAAM,UAAU,EAAK,QAAQA,EAAM,MAC7D;EAUA,SAASC,IAAc;GAErB,AADAT,EAAK,qBAAqB,CAAC,CAACC,EAAK,MAAM,CAACA,EAAK,KAAK,CAAC,GACnDD,EAAK,UAAU,CAAC,CAACC,EAAK,MAAM,CAACA,EAAK,KAAK,CAAC;EAC1C;EAEA,SAASS,EAAc,GAAiB,GAAc;GACpD,IAAMF,IAAiBG,EAAM,OAA4B;GAGzD,AAFe,eAAe,KAAKH,CAE9B,IAOCI,IACF,EAAK,OAAO,CAACJ,IAEb,EAAK,QAAQ,CAACA,IATZI,IACF,EAAK,OAAO,CAACJ,EAAM,MAAM,GAAGA,EAAM,SAAS,CAAC,IAE5C,EAAK,QAAQ,CAACA,EAAM,MAAM,GAAGA,EAAM,SAAS,CAAC;EASnD;E,kBAKEpB,EAAA,GAAAC,EAwBM,OAxBNC,EAwBM;GAxBA,OAAK,CAAEe,EAAA,OAAe,gBAAgB;GAAC,eAAY;EAAyBlB,GAAAA,EAAAA,MAAM,GAAA;GACtFI,EAAAC,EASE,SAAA;IARS,uBAAA,AAAA2B,EAAA,QAAA,MAAA,EAAA,MAAY,OAAIC;IACzB,eAAY;IACZ,OAAM;IACN,MAAK;IACJ,UAAQX;IACR,SAAK,AAAAU,EAAA,QAAA,MAAE,EAAA,QAAS;IAChB,YAAQ,AAAAA,EAAA,QAAA,MAAE,EAAA,QAAS;IACnB,SAAK,AAAAA,EAAA,QAAA,MAAET,EAAa,IAAOU,CAAM;G,gBAPzB,CAAA3B,GAAAc,EAAA,MAAY,IAAI,C;GAS3Bf,EAEM,OAFNG,GAEMD,EADDI,EAAM,SAAS,GAAA,CAAA;GAEpBP,EAAAC,EASE,SAAA;IARS,uBAAA,AAAA2B,EAAA,QAAA,MAAA,EAAA,MAAY,QAAKC;IAC1B,eAAY;IACZ,OAAM;IACN,MAAK;IACJ,UAAQX;IACR,SAAK,AAAAU,EAAA,QAAA,MAAE,EAAA,QAAS;IAChB,YAAQ,AAAAA,EAAA,QAAA,MAAE,EAAA,QAAS;IACnB,SAAK,AAAAA,EAAA,QAAA,MAAET,EAAa,IAAQU,CAAM;G,gBAP1B,CAAA3B,GAAAc,EAAA,MAAY,KAAK,C"}

package/dist/components/LongText.js

@@ -1,8 +1,7 @@
 import e from "./LongText.vue2.js";
 import './LongText.style.css';/* empty css                                         */
-//#region src/components/LongText.vue
+// src/components/LongText.vue
 var t = e;
-//#endregion
 export { t as default };
 
 //# sourceMappingURL=LongText.js.map

package/dist/components/LongText.js.map

@@ -1 +1 @@
-{"version":3,"file":"LongText.js","names":[],"sources":["../../src/components/LongText.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\nimport { debounce, notEmpty } from \"@milaboratories/helpers\";\n\nconst hasElementEllipsis = ref(false);\n\nconst span = ref<HTMLElement>();\n\nconst isHovered = ref(false);\n\nconst classes = computed(() =>\n  isHovered.value && hasElementEllipsis.value ? \"ui-lt-animate\" : \"\",\n);\n\nconst updateStatus = debounce((val: boolean) => (isHovered.value = val), 500);\n\nconst animationTime = computed(() => {\n  return span.value ? `${span.value?.innerHTML.length * 0.4}s` : \"5s\";\n});\n\nfunction isEllipsisEnabled() {\n  const el = notEmpty(span.value, \"span cannot be empty\");\n  hasElementEllipsis.value = el.clientWidth < el.scrollWidth;\n}\n\nfunction mouseoverHandler() {\n  isEllipsisEnabled();\n  updateStatus(true);\n}\n\nfunction mouseoutHandler() {\n  updateStatus(false);\n}\n</script>\n\n<template>\n  <div v-bind=\"$attrs\" class=\"ui-lt-container\">\n    <span @mouseover=\"mouseoverHandler\" @mouseleave=\"mouseoutHandler\">\n      <span ref=\"span\" :class=\"classes\"><slot /></span>\n    </span>\n  </div>\n</template>\n\n<style lang=\"scss\">\n.ui-lt-container {\n  position: relative;\n  min-width: 0;\n  overflow: hidden;\n  white-space: nowrap;\n  border-radius: 5px;\n\n  span {\n    display: inline-block;\n    width: 100%;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    vertical-align: bottom;\n  }\n\n  .ui-lt-animate {\n    position: relative;\n    width: fit-content;\n    overflow: unset;\n    text-overflow: unset;\n    animation: left-to-right v-bind(animationTime) infinite alternate linear;\n  }\n}\n\n@keyframes left-to-right {\n  0% {\n    transform: translateX(0%);\n    left: 0%;\n  }\n\n  100% {\n    transform: translateX(-101%);\n    left: 101%;\n  }\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"LongText.js","names":["_sfc_main","LongText_vue_vue_type_script_setup_true_lang_default","LongText_default"],"sources":["../../src/components/LongText.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\nimport { debounce, notEmpty } from \"@milaboratories/helpers\";\n\nconst hasElementEllipsis = ref(false);\n\nconst span = ref<HTMLElement>();\n\nconst isHovered = ref(false);\n\nconst classes = computed(() =>\n  isHovered.value && hasElementEllipsis.value ? \"ui-lt-animate\" : \"\",\n);\n\nconst updateStatus = debounce((val: boolean) => (isHovered.value = val), 500);\n\nconst animationTime = computed(() => {\n  return span.value ? `${span.value?.innerHTML.length * 0.4}s` : \"5s\";\n});\n\nfunction isEllipsisEnabled() {\n  const el = notEmpty(span.value, \"span cannot be empty\");\n  hasElementEllipsis.value = el.clientWidth < el.scrollWidth;\n}\n\nfunction mouseoverHandler() {\n  isEllipsisEnabled();\n  updateStatus(true);\n}\n\nfunction mouseoutHandler() {\n  updateStatus(false);\n}\n</script>\n\n<template>\n  <div v-bind=\"$attrs\" class=\"ui-lt-container\">\n    <span @mouseover=\"mouseoverHandler\" @mouseleave=\"mouseoutHandler\">\n      <span ref=\"span\" :class=\"classes\"><slot /></span>\n    </span>\n  </div>\n</template>\n\n<style lang=\"scss\">\n.ui-lt-container {\n  position: relative;\n  min-width: 0;\n  overflow: hidden;\n  white-space: nowrap;\n  border-radius: 5px;\n\n  span {\n    display: inline-block;\n    width: 100%;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    vertical-align: bottom;\n  }\n\n  .ui-lt-animate {\n    position: relative;\n    width: fit-content;\n    overflow: unset;\n    text-overflow: unset;\n    animation: left-to-right v-bind(animationTime) infinite alternate linear;\n  }\n}\n\n@keyframes left-to-right {\n  0% {\n    transform: translateX(0%);\n    left: 0%;\n  }\n\n  100% {\n    transform: translateX(-101%);\n    left: 101%;\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/LongText.vue2.js

@@ -1,7 +1,7 @@
 import { computed as e, createElementBlock as t, createElementVNode as n, defineComponent as r, mergeProps as i, normalizeClass as a, openBlock as o, ref as s, renderSlot as c, useCssVars as l } from "vue";
 import { debounce as u, notEmpty as d } from "@milaboratories/helpers";
-//#region src/components/LongText.vue?vue&type=script&setup=true&lang.ts
-var f = /* @__PURE__ */ r({
+// src/components/LongText.vue?vue&type=script&setup=true&lang.ts
+var f = /*@__PURE__*/ r({
 	__name: "LongText",
 	setup(r) {
 		l((e) => ({ v0036837f: _.value }));
@@ -26,7 +26,6 @@ var f = /* @__PURE__ */ r({
 		}, [c(e.$slots, "default")], 2)], 32)], 16));
 	}
 });
-//#endregion
 export { f as default };
 
 //# sourceMappingURL=LongText.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"LongText.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../src/components/LongText.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\nimport { debounce, notEmpty } from \"@milaboratories/helpers\";\n\nconst hasElementEllipsis = ref(false);\n\nconst span = ref<HTMLElement>();\n\nconst isHovered = ref(false);\n\nconst classes = computed(() =>\n  isHovered.value && hasElementEllipsis.value ? \"ui-lt-animate\" : \"\",\n);\n\nconst updateStatus = debounce((val: boolean) => (isHovered.value = val), 500);\n\nconst animationTime = computed(() => {\n  return span.value ? `${span.value?.innerHTML.length * 0.4}s` : \"5s\";\n});\n\nfunction isEllipsisEnabled() {\n  const el = notEmpty(span.value, \"span cannot be empty\");\n  hasElementEllipsis.value = el.clientWidth < el.scrollWidth;\n}\n\nfunction mouseoverHandler() {\n  isEllipsisEnabled();\n  updateStatus(true);\n}\n\nfunction mouseoutHandler() {\n  updateStatus(false);\n}\n</script>\n\n<template>\n  <div v-bind=\"$attrs\" class=\"ui-lt-container\">\n    <span @mouseover=\"mouseoverHandler\" @mouseleave=\"mouseoutHandler\">\n      <span ref=\"span\" :class=\"classes\"><slot /></span>\n    </span>\n  </div>\n</template>\n\n<style lang=\"scss\">\n.ui-lt-container {\n  position: relative;\n  min-width: 0;\n  overflow: hidden;\n  white-space: nowrap;\n  border-radius: 5px;\n\n  span {\n    display: inline-block;\n    width: 100%;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    vertical-align: bottom;\n  }\n\n  .ui-lt-animate {\n    position: relative;\n    width: fit-content;\n    overflow: unset;\n    text-overflow: unset;\n    animation: left-to-right v-bind(animationTime) infinite alternate linear;\n  }\n}\n\n@keyframes left-to-right {\n  0% {\n    transform: translateX(0%);\n    left: 0%;\n  }\n\n  100% {\n    transform: translateX(-101%);\n    left: 101%;\n  }\n}\n</style>\n"],"mappings":";;;;;;;EAIA,IAAM,IAAqB,EAAI,GAAM,EAE/B,IAAO,GAAkB,EAEzB,IAAY,EAAI,GAAM,EAEtB,IAAU,QACd,EAAU,SAAS,EAAmB,QAAQ,kBAAkB,GACjE,EAEK,IAAe,GAAU,MAAkB,EAAU,QAAQ,GAAM,IAAI,EAEvE,IAAgB,QACb,EAAK,QAAQ,GAAG,EAAK,OAAO,UAAU,SAAS,GAAI,KAAK,KAC/D;EAEF,SAAS,IAAoB;GAC3B,IAAM,IAAK,EAAS,EAAK,OAAO,uBAAuB;AACvD,KAAmB,QAAQ,EAAG,cAAc,EAAG;;EAGjD,SAAS,IAAmB;AAE1B,GADA,GAAmB,EACnB,EAAa,GAAK;;EAGpB,SAAS,IAAkB;AACzB,KAAa,GAAM;;yBAKnB,EAIM,OAJN,EAAaA,EAIP,QAJa,EAAE,OAAM,mBAAiB,CAAA,EAAA,CAC1C,EAEO,QAAA;GAFA,aAAW;GAAmB,cAAY;MAC/C,EAAiD,QAAA;YAAvC;GAAJ,KAAI;GAAQ,OAAK,EAAE,EAAA,MAAO;MAAE,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA"}
+{"version":3,"file":"LongText.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_openBlock","_createElementBlock","_mergeProps","_createElementVNode","_normalizeClass","_renderSlot","LongText_vue_vue_type_script_setup_true_lang_default","\"v0036837f\"","animationTime","hasElementEllipsis","ref","span","isHovered","classes","computed","updateStatus","debounce","val","isEllipsisEnabled","el","notEmpty","mouseoverHandler","mouseoutHandler","openBlock","createElementBlock","mergeProps","_ctx","createElementVNode","normalizeClass","renderSlot"],"sources":["../../src/components/LongText.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\nimport { debounce, notEmpty } from \"@milaboratories/helpers\";\n\nconst hasElementEllipsis = ref(false);\n\nconst span = ref<HTMLElement>();\n\nconst isHovered = ref(false);\n\nconst classes = computed(() =>\n  isHovered.value && hasElementEllipsis.value ? \"ui-lt-animate\" : \"\",\n);\n\nconst updateStatus = debounce((val: boolean) => (isHovered.value = val), 500);\n\nconst animationTime = computed(() => {\n  return span.value ? `${span.value?.innerHTML.length * 0.4}s` : \"5s\";\n});\n\nfunction isEllipsisEnabled() {\n  const el = notEmpty(span.value, \"span cannot be empty\");\n  hasElementEllipsis.value = el.clientWidth < el.scrollWidth;\n}\n\nfunction mouseoverHandler() {\n  isEllipsisEnabled();\n  updateStatus(true);\n}\n\nfunction mouseoutHandler() {\n  updateStatus(false);\n}\n</script>\n\n<template>\n  <div v-bind=\"$attrs\" class=\"ui-lt-container\">\n    <span @mouseover=\"mouseoverHandler\" @mouseleave=\"mouseoutHandler\">\n      <span ref=\"span\" :class=\"classes\"><slot /></span>\n    </span>\n  </div>\n</template>\n\n<style lang=\"scss\">\n.ui-lt-container {\n  position: relative;\n  min-width: 0;\n  overflow: hidden;\n  white-space: nowrap;\n  border-radius: 5px;\n\n  span {\n    display: inline-block;\n    width: 100%;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    vertical-align: bottom;\n  }\n\n  .ui-lt-animate {\n    position: relative;\n    width: fit-content;\n    overflow: unset;\n    text-overflow: unset;\n    animation: left-to-right v-bind(animationTime) infinite alternate linear;\n  }\n}\n\n@keyframes left-to-right {\n  0% {\n    transform: translateX(0%);\n    left: 0%;\n  }\n\n  100% {\n    transform: translateX(-101%);\n    left: 101%;\n  }\n}\n</style>\n"],"mappings":";;;;;;;EAIA,IAAMU,IAAqBC,EAAI,EAAK,GAE9BC,IAAOD,EAAiB,GAExBE,IAAYF,EAAI,EAAK,GAErBG,IAAUC,QACdF,EAAU,SAASH,EAAmB,QAAQ,kBAAkB,EAClE,GAEMM,IAAeC,GAAU,MAAkB,EAAU,QAAQC,GAAM,GAAG,GAEtET,IAAgBM,QACbH,EAAK,QAAQ,GAAGA,EAAK,OAAO,UAAU,SAAS,GAAI,KAAK,IAChE;EAED,SAASO,IAAoB;GAC3B,IAAMC,IAAKC,EAAST,EAAK,OAAO,sBAAsB;GACtD,EAAmB,QAAQQ,EAAG,cAAcA,EAAG;EACjD;EAEA,SAASE,IAAmB;GAE1B,AADAH,EAAkB,GAClBH,EAAa,EAAI;EACnB;EAEA,SAASO,IAAkB;GACzB,EAAa,EAAK;EACpB;E,kBAIEtB,EAAA,GAAAC,EAIM,OAJNC,EAAaH,EAIP,QAJa,EAAE,OAAM,kBAAiB,CAAA,GAAA,CAC1CI,EAEO,QAAA;GAFA,aAAWkB;GAAmB,cAAYC;E,IAC/CnB,EAAiD,QAAA;GAAvC,SAAA;GAAJ,KAAIQ;GAAQ,OAAKP,EAAES,EAAA,KAAO;E,IAAER,EAAQqB,EAAA,QAAA,SAAA,C"}

package/dist/components/PlAccordion/ExpandTransition.js

@@ -1,8 +1,7 @@
 import e from "./ExpandTransition.vue2.js";
 import './ExpandTransition.style.css';/* empty css                                                 */
-//#region src/components/PlAccordion/ExpandTransition.vue
+// src/components/PlAccordion/ExpandTransition.vue
 var t = e;
-//#endregion
 export { t as default };
 
 //# sourceMappingURL=ExpandTransition.js.map

package/dist/components/PlAccordion/ExpandTransition.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandTransition.js","names":[],"sources":["../../../src/components/PlAccordion/ExpandTransition.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nconst onStart = (el: Element) => {\n  el.classList.add(\"expand-collapse-fix\");\n  (el as HTMLElement).style.setProperty(\"--component-height\", el.scrollHeight + \"px\");\n};\n\nconst onAfter = (el: Element) => {\n  (el as HTMLElement).style.removeProperty(\"--component-height\");\n  el.classList.remove(\"expand-collapse-fix\");\n};\n</script>\n\n<template>\n  <Transition\n    name=\"expand-collapse\"\n    @enter=\"onStart\"\n    @leave=\"onStart\"\n    @after-enter=\"onAfter\"\n    @after-leave=\"onAfter\"\n  >\n    <slot />\n  </Transition>\n</template>\n\n<style>\n.expand-collapse-fix {\n  overflow: hidden;\n}\n\n.expand-collapse-enter-active,\n.expand-collapse-leave-active {\n  transition:\n    height 0.2s ease-in-out,\n    opacity 0.2s ease-in-out;\n  height: var(--component-height);\n}\n\n.expand-collapse-enter-from,\n.expand-collapse-leave-to {\n  opacity: 0.5;\n  height: 0;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"ExpandTransition.js","names":["_sfc_main","ExpandTransition_vue_vue_type_script_setup_true_lang_default","ExpandTransition_default"],"sources":["../../../src/components/PlAccordion/ExpandTransition.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nconst onStart = (el: Element) => {\n  el.classList.add(\"expand-collapse-fix\");\n  (el as HTMLElement).style.setProperty(\"--component-height\", el.scrollHeight + \"px\");\n};\n\nconst onAfter = (el: Element) => {\n  (el as HTMLElement).style.removeProperty(\"--component-height\");\n  el.classList.remove(\"expand-collapse-fix\");\n};\n</script>\n\n<template>\n  <Transition\n    name=\"expand-collapse\"\n    @enter=\"onStart\"\n    @leave=\"onStart\"\n    @after-enter=\"onAfter\"\n    @after-leave=\"onAfter\"\n  >\n    <slot />\n  </Transition>\n</template>\n\n<style>\n.expand-collapse-fix {\n  overflow: hidden;\n}\n\n.expand-collapse-enter-active,\n.expand-collapse-leave-active {\n  transition:\n    height 0.2s ease-in-out,\n    opacity 0.2s ease-in-out;\n  height: var(--component-height);\n}\n\n.expand-collapse-enter-from,\n.expand-collapse-leave-to {\n  opacity: 0.5;\n  height: 0;\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAccordion/ExpandTransition.vue2.js

@@ -1,6 +1,6 @@
 import { Transition as e, createBlock as t, defineComponent as n, openBlock as r, renderSlot as i, withCtx as a } from "vue";
-//#region src/components/PlAccordion/ExpandTransition.vue?vue&type=script&setup=true&lang.ts
-var o = /* @__PURE__ */ n({
+// src/components/PlAccordion/ExpandTransition.vue?vue&type=script&setup=true&lang.ts
+var o = /*@__PURE__*/ n({
 	__name: "ExpandTransition",
 	setup(n) {
 		let o = (e) => {
@@ -20,7 +20,6 @@ var o = /* @__PURE__ */ n({
 		}));
 	}
 });
-//#endregion
 export { o as default };
 
 //# sourceMappingURL=ExpandTransition.vue2.js.map

package/dist/components/PlAccordion/ExpandTransition.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandTransition.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlAccordion/ExpandTransition.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nconst onStart = (el: Element) => {\n  el.classList.add(\"expand-collapse-fix\");\n  (el as HTMLElement).style.setProperty(\"--component-height\", el.scrollHeight + \"px\");\n};\n\nconst onAfter = (el: Element) => {\n  (el as HTMLElement).style.removeProperty(\"--component-height\");\n  el.classList.remove(\"expand-collapse-fix\");\n};\n</script>\n\n<template>\n  <Transition\n    name=\"expand-collapse\"\n    @enter=\"onStart\"\n    @leave=\"onStart\"\n    @after-enter=\"onAfter\"\n    @after-leave=\"onAfter\"\n  >\n    <slot />\n  </Transition>\n</template>\n\n<style>\n.expand-collapse-fix {\n  overflow: hidden;\n}\n\n.expand-collapse-enter-active,\n.expand-collapse-leave-active {\n  transition:\n    height 0.2s ease-in-out,\n    opacity 0.2s ease-in-out;\n  height: var(--component-height);\n}\n\n.expand-collapse-enter-from,\n.expand-collapse-leave-to {\n  opacity: 0.5;\n  height: 0;\n}\n</style>\n"],"mappings":";;;;;EACA,IAAM,KAAW,MAAgB;AAE9B,GADD,EAAG,UAAU,IAAI,sBAAsB,EACtC,EAAmB,MAAM,YAAY,sBAAsB,EAAG,eAAe,KAAK;KAG/E,KAAW,MAAgB;AAE/B,GADC,EAAmB,MAAM,eAAe,qBAAqB,EAC9D,EAAG,UAAU,OAAO,sBAAsB;;yBAK1C,EAQa,GAAA;GAPX,MAAK;GACJ,SAAO;GACP,SAAO;GACP,cAAa;GACb,cAAa;;oBAEN,CAAR,EAAQ,EAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ExpandTransition.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_Transition","_withCtx","_renderSlot","ExpandTransition_vue_vue_type_script_setup_true_lang_default","onStart","el","onAfter","openBlock","createBlock","Transition","withCtx","renderSlot","_ctx"],"sources":["../../../src/components/PlAccordion/ExpandTransition.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nconst onStart = (el: Element) => {\n  el.classList.add(\"expand-collapse-fix\");\n  (el as HTMLElement).style.setProperty(\"--component-height\", el.scrollHeight + \"px\");\n};\n\nconst onAfter = (el: Element) => {\n  (el as HTMLElement).style.removeProperty(\"--component-height\");\n  el.classList.remove(\"expand-collapse-fix\");\n};\n</script>\n\n<template>\n  <Transition\n    name=\"expand-collapse\"\n    @enter=\"onStart\"\n    @leave=\"onStart\"\n    @after-enter=\"onAfter\"\n    @after-leave=\"onAfter\"\n  >\n    <slot />\n  </Transition>\n</template>\n\n<style>\n.expand-collapse-fix {\n  overflow: hidden;\n}\n\n.expand-collapse-enter-active,\n.expand-collapse-leave-active {\n  transition:\n    height 0.2s ease-in-out,\n    opacity 0.2s ease-in-out;\n  height: var(--component-height);\n}\n\n.expand-collapse-enter-from,\n.expand-collapse-leave-to {\n  opacity: 0.5;\n  height: 0;\n}\n</style>\n"],"mappings":";;;;;EACA,IAAMM,KAAW,MAAgB;GAE/B,AADAC,EAAG,UAAU,IAAI,qBAAqB,GACtCA,EAAoB,MAAM,YAAY,sBAAsBA,EAAG,eAAe,IAAI;EACpF,GAEMC,KAAW,MAAgB;GAE/B,AADAD,EAAoB,MAAM,eAAe,oBAAoB,GAC7DA,EAAG,UAAU,OAAO,qBAAqB;EAC3C;E,kBAIEP,EAAA,GAAAC,EAQaC,GAAA;GAPX,MAAK;GACJ,SAAOI;GACP,SAAOA;GACP,cAAaE;GACb,cAAaA;;GAEd,SAAAL,QAAQ,CAARC,EAAQU,EAAA,QAAA,SAAA,C"}

package/dist/components/PlAccordion/PlAccordion.js

@@ -1,7 +1,6 @@
 import e from "./PlAccordion.vue2.js";
-//#region src/components/PlAccordion/PlAccordion.vue
+// src/components/PlAccordion/PlAccordion.vue
 var t = e;
-//#endregion
 export { t as default };
 
 //# sourceMappingURL=PlAccordion.js.map

package/dist/components/PlAccordion/PlAccordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAccordion.js","names":[],"sources":["../../../src/components/PlAccordion/PlAccordion.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { provide, toRef } from \"vue\";\n\nconst model = defineModel<string>();\n\nconst props = defineProps<{\n  /**\n   * Allow multiple accordion sections to be opened at the same time\n   */\n  multiple?: boolean;\n}>();\n\nprovide(\"pl-accordion-model\", model);\nprovide(\"pl-accordion-props\", toRef(props));\n</script>\n\n<template>\n  <slot name=\"header\" />\n  <slot />\n</template>\n"],"mappings":""}
+{"version":3,"file":"PlAccordion.js","names":["_sfc_main","PlAccordion_vue_vue_type_script_setup_true_lang_default","PlAccordion_default"],"sources":["../../../src/components/PlAccordion/PlAccordion.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { provide, toRef } from \"vue\";\n\nconst model = defineModel<string>();\n\nconst props = defineProps<{\n  /**\n   * Allow multiple accordion sections to be opened at the same time\n   */\n  multiple?: boolean;\n}>();\n\nprovide(\"pl-accordion-model\", model);\nprovide(\"pl-accordion-props\", toRef(props));\n</script>\n\n<template>\n  <slot name=\"header\" />\n  <slot />\n</template>\n"],"mappings":""}

package/dist/components/PlAccordion/PlAccordion.vue2.js

@@ -1,8 +1,8 @@
 import { Fragment as e, createElementBlock as t, defineComponent as n, mergeModels as r, openBlock as i, provide as a, renderSlot as o, toRef as s, useModel as c } from "vue";
-//#region src/components/PlAccordion/PlAccordion.vue?vue&type=script&setup=true&lang.ts
-var l = /* @__PURE__ */ n({
+// src/components/PlAccordion/PlAccordion.vue?vue&type=script&setup=true&lang.ts
+var l = /*@__PURE__*/ n({
 	__name: "PlAccordion",
-	props: /* @__PURE__ */ r({ multiple: { type: Boolean } }, {
+	props: /*@__PURE__*/ r({ multiple: { type: Boolean } }, {
 		modelValue: {},
 		modelModifiers: {}
 	}),
@@ -12,7 +12,6 @@ var l = /* @__PURE__ */ n({
 		return a("pl-accordion-model", r), a("pl-accordion-props", s(l)), (n, r) => (i(), t(e, null, [o(n.$slots, "header"), o(n.$slots, "default")], 64));
 	}
 });
-//#endregion
 export { l as default };
 
 //# sourceMappingURL=PlAccordion.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PlAccordion.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/PlAccordion/PlAccordion.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { provide, toRef } from \"vue\";\n\nconst model = defineModel<string>();\n\nconst props = defineProps<{\n  /**\n   * Allow multiple accordion sections to be opened at the same time\n   */\n  multiple?: boolean;\n}>();\n\nprovide(\"pl-accordion-model\", model);\nprovide(\"pl-accordion-props\", toRef(props));\n</script>\n\n<template>\n  <slot name=\"header\" />\n  <slot />\n</template>\n"],"mappings":";;;;;;;;;;EAGA,IAAM,IAAQ,EAAmB,GAAA,aAAE,EAE7B,IAAQ;SAOd,EAAQ,sBAAsB,EAAM,EACpC,EAAQ,sBAAsB,EAAM,EAAM,CAAC,8BAIzC,EAAsB,EAAA,QAAA,SAAA,EACtB,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,GAAA"}
+{"version":3,"file":"PlAccordion.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createElementBlock","_Fragment","_renderSlot","PlAccordion_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","model","useModel","__props","props","provide","toRef","openBlock","createElementBlock","Fragment","renderSlot","_ctx"],"sources":["../../../src/components/PlAccordion/PlAccordion.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { provide, toRef } from \"vue\";\n\nconst model = defineModel<string>();\n\nconst props = defineProps<{\n  /**\n   * Allow multiple accordion sections to be opened at the same time\n   */\n  multiple?: boolean;\n}>();\n\nprovide(\"pl-accordion-model\", model);\nprovide(\"pl-accordion-props\", toRef(props));\n</script>\n\n<template>\n  <slot name=\"header\" />\n  <slot />\n</template>\n"],"mappings":";;;;;;;;;;EAGA,IAAMQ,IAAQR,EAAmBU,GAAA,YAAC,GAE5BC,IAAQD;E,OAOdE,EAAQ,sBAAsBJ,CAAK,GACnCI,EAAQ,sBAAsBC,EAAMF,CAAK,CAAC,I,2BAIxCP,EAAsBc,EAAA,QAAA,QAAA,GACtBd,EAAQc,EAAA,QAAA,SAAA,C"}

package/dist/components/PlAccordion/PlAccordionSection.js

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

package/dist/components/PlAccordion/PlAccordionSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAccordionSection.js","names":[],"sources":["../../../src/components/PlAccordion/PlAccordionSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { uniqueId } from \"@milaboratories/helpers\";\nimport { PlMaskIcon16 } from \"../PlMaskIcon16\";\nimport { PlSectionSeparator } from \"../PlSectionSeparator\";\nimport ExpandTransition from \"./ExpandTransition.vue\";\nimport type { Ref } from \"vue\";\nimport { computed, inject, toRef } from \"vue\";\n\nconst $m = inject<Ref<string>>(\"pl-accordion-model\", () => toRef(\"\"), true);\n\nconst $p = inject<\n  Ref<{\n    multiple?: boolean;\n  }>\n>(\"pl-accordion-props\", () => toRef({ multiple: false }), true);\n\nconst model = defineModel<boolean>();\n\nconst id = uniqueId();\n\nconst isMulti = computed(() => !$p || $p.value.multiple);\n\nconst open = computed({\n  get() {\n    if (isMulti.value) {\n      return model.value;\n    }\n\n    return $m ? $m.value === id : model.value;\n  },\n  set(on) {\n    if (isMulti.value) {\n      model.value = on;\n    } else if ($m) {\n      $m.value = $m.value === id ? \"\" : id;\n    }\n  },\n});\n\ndefineProps<{\n  /**\n   * The label text (optional)\n   */\n  label?: string;\n  /**\n   * If `true`, remove top padding\n   */\n  compact?: boolean;\n}>();\n</script>\n\n<template>\n  <div class=\"pl-accordion-section\" data-testid=\"pl-accordion-section\">\n    <PlSectionSeparator\n      data-testid=\"pl-accordion-section-header\"\n      :class=\"$style.separator\"\n      :compact=\"compact\"\n      @click=\"open = !open\"\n    >\n      <PlMaskIcon16\n        data-testid=\"pl-accordion-section-chevron\"\n        name=\"chevron-right\"\n        :class=\"[{ [$style.down]: open }, $style.chevron]\"\n      />\n      {{ label }}\n    </PlSectionSeparator>\n    <ExpandTransition>\n      <div v-if=\"open\" data-testid=\"pl-accordion-section-body\" :class=\"$style.content\">\n        <slot />\n      </div>\n    </ExpandTransition>\n  </div>\n</template>\n\n<style module>\n.content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gap-v);\n  will-change: height, opacity;\n  /* transform: translateZ(0);\n  backface-visibility: hidden; */\n}\n\n.content > *:first-child {\n  margin-top: 24px;\n}\n\n.content > *:last-child {\n  margin-bottom: 4px;\n}\n\n.separator {\n  cursor: pointer;\n  &:hover {\n    --pl-separator-txt-color: var(--txt-01);\n    --mask-icon-bg-color: var(--ic-01);\n  }\n}\n\n.chevron {\n  transition-duration: 50ms;\n}\n\n.down {\n  transform: rotate(90deg);\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"PlAccordionSection.js","names":["style0","_sfc_main","_plugin_vue_export_helper_default","PlAccordionSection_vue_vue_type_script_setup_true_lang_default","PlAccordionSection_vue_vue_type_style_index_0_lang_module_default","PlAccordionSection_default","\"$style\""],"sources":["../../../src/components/PlAccordion/PlAccordionSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { uniqueId } from \"@milaboratories/helpers\";\nimport { PlMaskIcon16 } from \"../PlMaskIcon16\";\nimport { PlSectionSeparator } from \"../PlSectionSeparator\";\nimport ExpandTransition from \"./ExpandTransition.vue\";\nimport type { Ref } from \"vue\";\nimport { computed, inject, toRef } from \"vue\";\n\nconst $m = inject<Ref<string>>(\"pl-accordion-model\", () => toRef(\"\"), true);\n\nconst $p = inject<\n  Ref<{\n    multiple?: boolean;\n  }>\n>(\"pl-accordion-props\", () => toRef({ multiple: false }), true);\n\nconst model = defineModel<boolean>();\n\nconst id = uniqueId();\n\nconst isMulti = computed(() => !$p || $p.value.multiple);\n\nconst open = computed({\n  get() {\n    if (isMulti.value) {\n      return model.value;\n    }\n\n    return $m ? $m.value === id : model.value;\n  },\n  set(on) {\n    if (isMulti.value) {\n      model.value = on;\n    } else if ($m) {\n      $m.value = $m.value === id ? \"\" : id;\n    }\n  },\n});\n\ndefineProps<{\n  /**\n   * The label text (optional)\n   */\n  label?: string;\n  /**\n   * If `true`, remove top padding\n   */\n  compact?: boolean;\n}>();\n</script>\n\n<template>\n  <div class=\"pl-accordion-section\" data-testid=\"pl-accordion-section\">\n    <PlSectionSeparator\n      data-testid=\"pl-accordion-section-header\"\n      :class=\"$style.separator\"\n      :compact=\"compact\"\n      @click=\"open = !open\"\n    >\n      <PlMaskIcon16\n        data-testid=\"pl-accordion-section-chevron\"\n        name=\"chevron-right\"\n        :class=\"[{ [$style.down]: open }, $style.chevron]\"\n      />\n      {{ label }}\n    </PlSectionSeparator>\n    <ExpandTransition>\n      <div v-if=\"open\" data-testid=\"pl-accordion-section-body\" :class=\"$style.content\">\n        <slot />\n      </div>\n    </ExpandTransition>\n  </div>\n</template>\n\n<style module>\n.content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gap-v);\n  will-change: height, opacity;\n  /* transform: translateZ(0);\n  backface-visibility: hidden; */\n}\n\n.content > *:first-child {\n  margin-top: 24px;\n}\n\n.content > *:last-child {\n  margin-bottom: 4px;\n}\n\n.separator {\n  cursor: pointer;\n  &:hover {\n    --pl-separator-txt-color: var(--txt-01);\n    --mask-icon-bg-color: var(--ic-01);\n  }\n}\n\n.chevron {\n  transition-duration: 50ms;\n}\n\n.down {\n  transform: rotate(90deg);\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAccordion/PlAccordionSection.style.js

@@ -1,10 +1,10 @@
-import './PlAccordionSection.vue.css';var e = {
-	content: "_content_e3dof_2",
-	separator: "_separator_e3dof_19",
-	chevron: "_chevron_e3dof_27",
-	down: "_down_e3dof_31"
+import './PlAccordionSection.style.css';// src/components/PlAccordion/PlAccordionSection.vue?vue&type=style&index=0&lang.module.css
+var e = "_content_e3dof_2", t = "_separator_e3dof_19", n = "_chevron_e3dof_27", r = "_down_e3dof_31", i = {
+	content: e,
+	separator: t,
+	chevron: n,
+	down: r
 };
-//#endregion
-export { e as default };
+export { n as chevron, e as content, i as default, r as down, t as separator };
 
 //# sourceMappingURL=PlAccordionSection.style.js.map

package/dist/components/PlAccordion/PlAccordionSection.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAccordionSection.vue_vue_type_style_index_0_lang.module.js","names":[],"sources":["../../../src/components/PlAccordion/PlAccordionSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { uniqueId } from \"@milaboratories/helpers\";\nimport { PlMaskIcon16 } from \"../PlMaskIcon16\";\nimport { PlSectionSeparator } from \"../PlSectionSeparator\";\nimport ExpandTransition from \"./ExpandTransition.vue\";\nimport type { Ref } from \"vue\";\nimport { computed, inject, toRef } from \"vue\";\n\nconst $m = inject<Ref<string>>(\"pl-accordion-model\", () => toRef(\"\"), true);\n\nconst $p = inject<\n  Ref<{\n    multiple?: boolean;\n  }>\n>(\"pl-accordion-props\", () => toRef({ multiple: false }), true);\n\nconst model = defineModel<boolean>();\n\nconst id = uniqueId();\n\nconst isMulti = computed(() => !$p || $p.value.multiple);\n\nconst open = computed({\n  get() {\n    if (isMulti.value) {\n      return model.value;\n    }\n\n    return $m ? $m.value === id : model.value;\n  },\n  set(on) {\n    if (isMulti.value) {\n      model.value = on;\n    } else if ($m) {\n      $m.value = $m.value === id ? \"\" : id;\n    }\n  },\n});\n\ndefineProps<{\n  /**\n   * The label text (optional)\n   */\n  label?: string;\n  /**\n   * If `true`, remove top padding\n   */\n  compact?: boolean;\n}>();\n</script>\n\n<template>\n  <div class=\"pl-accordion-section\" data-testid=\"pl-accordion-section\">\n    <PlSectionSeparator\n      data-testid=\"pl-accordion-section-header\"\n      :class=\"$style.separator\"\n      :compact=\"compact\"\n      @click=\"open = !open\"\n    >\n      <PlMaskIcon16\n        data-testid=\"pl-accordion-section-chevron\"\n        name=\"chevron-right\"\n        :class=\"[{ [$style.down]: open }, $style.chevron]\"\n      />\n      {{ label }}\n    </PlSectionSeparator>\n    <ExpandTransition>\n      <div v-if=\"open\" data-testid=\"pl-accordion-section-body\" :class=\"$style.content\">\n        <slot />\n      </div>\n    </ExpandTransition>\n  </div>\n</template>\n\n<style module>\n.content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gap-v);\n  will-change: height, opacity;\n  /* transform: translateZ(0);\n  backface-visibility: hidden; */\n}\n\n.content > *:first-child {\n  margin-top: 24px;\n}\n\n.content > *:last-child {\n  margin-bottom: 4px;\n}\n\n.separator {\n  cursor: pointer;\n  &:hover {\n    --pl-separator-txt-color: var(--txt-01);\n    --mask-icon-bg-color: var(--ic-01);\n  }\n}\n\n.chevron {\n  transition-duration: 50ms;\n}\n\n.down {\n  transform: rotate(90deg);\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"PlAccordionSection.vue_vue_type_style_index_0_lang.module.js","names":["content","separator","chevron","down","PlAccordionSection_vue_vue_type_style_index_0_lang_module_default"],"sources":["../../../src/components/PlAccordion/PlAccordionSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { uniqueId } from \"@milaboratories/helpers\";\nimport { PlMaskIcon16 } from \"../PlMaskIcon16\";\nimport { PlSectionSeparator } from \"../PlSectionSeparator\";\nimport ExpandTransition from \"./ExpandTransition.vue\";\nimport type { Ref } from \"vue\";\nimport { computed, inject, toRef } from \"vue\";\n\nconst $m = inject<Ref<string>>(\"pl-accordion-model\", () => toRef(\"\"), true);\n\nconst $p = inject<\n  Ref<{\n    multiple?: boolean;\n  }>\n>(\"pl-accordion-props\", () => toRef({ multiple: false }), true);\n\nconst model = defineModel<boolean>();\n\nconst id = uniqueId();\n\nconst isMulti = computed(() => !$p || $p.value.multiple);\n\nconst open = computed({\n  get() {\n    if (isMulti.value) {\n      return model.value;\n    }\n\n    return $m ? $m.value === id : model.value;\n  },\n  set(on) {\n    if (isMulti.value) {\n      model.value = on;\n    } else if ($m) {\n      $m.value = $m.value === id ? \"\" : id;\n    }\n  },\n});\n\ndefineProps<{\n  /**\n   * The label text (optional)\n   */\n  label?: string;\n  /**\n   * If `true`, remove top padding\n   */\n  compact?: boolean;\n}>();\n</script>\n\n<template>\n  <div class=\"pl-accordion-section\" data-testid=\"pl-accordion-section\">\n    <PlSectionSeparator\n      data-testid=\"pl-accordion-section-header\"\n      :class=\"$style.separator\"\n      :compact=\"compact\"\n      @click=\"open = !open\"\n    >\n      <PlMaskIcon16\n        data-testid=\"pl-accordion-section-chevron\"\n        name=\"chevron-right\"\n        :class=\"[{ [$style.down]: open }, $style.chevron]\"\n      />\n      {{ label }}\n    </PlSectionSeparator>\n    <ExpandTransition>\n      <div v-if=\"open\" data-testid=\"pl-accordion-section-body\" :class=\"$style.content\">\n        <slot />\n      </div>\n    </ExpandTransition>\n  </div>\n</template>\n\n<style module>\n.content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gap-v);\n  will-change: height, opacity;\n  /* transform: translateZ(0);\n  backface-visibility: hidden; */\n}\n\n.content > *:first-child {\n  margin-top: 24px;\n}\n\n.content > *:last-child {\n  margin-bottom: 4px;\n}\n\n.separator {\n  cursor: pointer;\n  &:hover {\n    --pl-separator-txt-color: var(--txt-01);\n    --mask-icon-bg-color: var(--ic-01);\n  }\n}\n\n.chevron {\n  transition-duration: 50ms;\n}\n\n.down {\n  transform: rotate(90deg);\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAccordion/PlAccordionSection.vue2.js

@@ -5,13 +5,13 @@ import "../PlSectionSeparator/index.js";
 import n from "./ExpandTransition.js";
 import { computed as r, createCommentVNode as i, createElementBlock as a, createTextVNode as o, createVNode as s, defineComponent as c, inject as l, mergeModels as u, normalizeClass as d, openBlock as f, renderSlot as p, toDisplayString as m, toRef as h, unref as g, useModel as _, withCtx as v } from "vue";
 import { uniqueId as y } from "@milaboratories/helpers";
-//#region src/components/PlAccordion/PlAccordionSection.vue?vue&type=script&setup=true&lang.ts
+// src/components/PlAccordion/PlAccordionSection.vue?vue&type=script&setup=true&lang.ts
 var b = {
 	class: "pl-accordion-section",
 	"data-testid": "pl-accordion-section"
-}, x = /* @__PURE__ */ c({
+}, x = /*@__PURE__*/ c({
 	__name: "PlAccordionSection",
-	props: /* @__PURE__ */ u({
+	props: /*@__PURE__*/ u({
 		label: {},
 		compact: { type: Boolean }
 	}, {
@@ -50,7 +50,6 @@ var b = {
 		})]));
 	}
 });
-//#endregion
 export { x as default };
 
 //# sourceMappingURL=PlAccordionSection.vue2.js.map

package/dist/components/PlAccordion/PlAccordionSection.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAccordionSection.vue_vue_type_script_setup_true_lang.js","names":["$style"],"sources":["../../../src/components/PlAccordion/PlAccordionSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { uniqueId } from \"@milaboratories/helpers\";\nimport { PlMaskIcon16 } from \"../PlMaskIcon16\";\nimport { PlSectionSeparator } from \"../PlSectionSeparator\";\nimport ExpandTransition from \"./ExpandTransition.vue\";\nimport type { Ref } from \"vue\";\nimport { computed, inject, toRef } from \"vue\";\n\nconst $m = inject<Ref<string>>(\"pl-accordion-model\", () => toRef(\"\"), true);\n\nconst $p = inject<\n  Ref<{\n    multiple?: boolean;\n  }>\n>(\"pl-accordion-props\", () => toRef({ multiple: false }), true);\n\nconst model = defineModel<boolean>();\n\nconst id = uniqueId();\n\nconst isMulti = computed(() => !$p || $p.value.multiple);\n\nconst open = computed({\n  get() {\n    if (isMulti.value) {\n      return model.value;\n    }\n\n    return $m ? $m.value === id : model.value;\n  },\n  set(on) {\n    if (isMulti.value) {\n      model.value = on;\n    } else if ($m) {\n      $m.value = $m.value === id ? \"\" : id;\n    }\n  },\n});\n\ndefineProps<{\n  /**\n   * The label text (optional)\n   */\n  label?: string;\n  /**\n   * If `true`, remove top padding\n   */\n  compact?: boolean;\n}>();\n</script>\n\n<template>\n  <div class=\"pl-accordion-section\" data-testid=\"pl-accordion-section\">\n    <PlSectionSeparator\n      data-testid=\"pl-accordion-section-header\"\n      :class=\"$style.separator\"\n      :compact=\"compact\"\n      @click=\"open = !open\"\n    >\n      <PlMaskIcon16\n        data-testid=\"pl-accordion-section-chevron\"\n        name=\"chevron-right\"\n        :class=\"[{ [$style.down]: open }, $style.chevron]\"\n      />\n      {{ label }}\n    </PlSectionSeparator>\n    <ExpandTransition>\n      <div v-if=\"open\" data-testid=\"pl-accordion-section-body\" :class=\"$style.content\">\n        <slot />\n      </div>\n    </ExpandTransition>\n  </div>\n</template>\n\n<style module>\n.content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gap-v);\n  will-change: height, opacity;\n  /* transform: translateZ(0);\n  backface-visibility: hidden; */\n}\n\n.content > *:first-child {\n  margin-top: 24px;\n}\n\n.content > *:last-child {\n  margin-bottom: 4px;\n}\n\n.separator {\n  cursor: pointer;\n  &:hover {\n    --pl-separator-txt-color: var(--txt-01);\n    --mask-icon-bg-color: var(--ic-01);\n  }\n}\n\n.chevron {\n  transition-duration: 50ms;\n}\n\n.down {\n  transform: rotate(90deg);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAQA,IAAM,IAAK,EAAoB,4BAA4B,EAAM,GAAG,EAAE,GAAK,EAErE,IAAK,EAIT,4BAA4B,EAAM,EAAE,UAAU,IAAO,CAAC,EAAE,GAAK,EAEzD,IAAQ,EAAoB,GAAA,aAAE,EAE9B,IAAK,GAAU,EAEf,IAAU,QAAe,CAAC,KAAM,EAAG,MAAM,SAAS,EAElD,IAAO,EAAS;GACpB,MAAM;AAKJ,WAJI,EAAQ,QACH,EAAM,QAGR,IAAK,EAAG,UAAU,IAAK,EAAM;;GAEtC,IAAI,GAAI;AACN,IAAI,EAAQ,QACV,EAAM,QAAQ,IACL,MACT,EAAG,QAAQ,EAAG,UAAU,IAAK,KAAK;;GAGvC,CAAC;yBAeA,EAmBM,OAnBN,GAmBM,CAlBJ,EAYqB,EAAA,EAAA,EAAA;GAXnB,eAAY;GACX,OAAK,EAAEA,EAAAA,OAAO,UAAS;GACvB,SAAS,EAAA;GACT,SAAK,AAAA,EAAA,QAAA,MAAE,EAAA,QAAI,CAAI,EAAA;;oBAMd,CAJF,EAIE,EAAA,EAAA,EAAA;IAHA,eAAY;IACZ,MAAK;IACJ,OAAK,EAAA,CAAA,GAAMA,EAAAA,OAAO,OAAO,EAAA,OAAI,EAAIA,EAAAA,OAAO,QAAO,CAAA;6BAChD,MACF,EAAG,EAAA,MAAK,EAAA,EAAA,CAAA,CAAA;;+BAEV,EAImB,GAAA,MAAA;oBADX,CAFK,EAAA,SAAA,GAAA,EAAX,EAEM,OAAA;;IAFW,eAAY;IAA6B,OAAK,EAAEA,EAAAA,OAAO,QAAO;OAC7E,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,CAAA,CAAA"}
+{"version":3,"file":"PlAccordionSection.vue_vue_type_script_setup_true_lang.js","names":["$style","_useModel","_openBlock","_createElementBlock","_createVNode","_unref","PlSectionSeparator","_normalizeClass","_withCtx","PlMaskIcon16","_createTextVNode","_toDisplayString","ExpandTransition","_renderSlot","_createCommentVNode","PlIcon16_default","PlSectionSeparator_default","ExpandTransition_default","_hoisted_1","PlAccordionSection_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","$m","inject","toRef","$p","model","useModel","__props","id","uniqueId","isMulti","computed","open","on","openBlock","createElementBlock","createVNode","unref","normalizeClass","_ctx","_cache","withCtx","createTextVNode","toDisplayString","renderSlot","createCommentVNode"],"sources":["../../../src/components/PlAccordion/PlAccordionSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { uniqueId } from \"@milaboratories/helpers\";\nimport { PlMaskIcon16 } from \"../PlMaskIcon16\";\nimport { PlSectionSeparator } from \"../PlSectionSeparator\";\nimport ExpandTransition from \"./ExpandTransition.vue\";\nimport type { Ref } from \"vue\";\nimport { computed, inject, toRef } from \"vue\";\n\nconst $m = inject<Ref<string>>(\"pl-accordion-model\", () => toRef(\"\"), true);\n\nconst $p = inject<\n  Ref<{\n    multiple?: boolean;\n  }>\n>(\"pl-accordion-props\", () => toRef({ multiple: false }), true);\n\nconst model = defineModel<boolean>();\n\nconst id = uniqueId();\n\nconst isMulti = computed(() => !$p || $p.value.multiple);\n\nconst open = computed({\n  get() {\n    if (isMulti.value) {\n      return model.value;\n    }\n\n    return $m ? $m.value === id : model.value;\n  },\n  set(on) {\n    if (isMulti.value) {\n      model.value = on;\n    } else if ($m) {\n      $m.value = $m.value === id ? \"\" : id;\n    }\n  },\n});\n\ndefineProps<{\n  /**\n   * The label text (optional)\n   */\n  label?: string;\n  /**\n   * If `true`, remove top padding\n   */\n  compact?: boolean;\n}>();\n</script>\n\n<template>\n  <div class=\"pl-accordion-section\" data-testid=\"pl-accordion-section\">\n    <PlSectionSeparator\n      data-testid=\"pl-accordion-section-header\"\n      :class=\"$style.separator\"\n      :compact=\"compact\"\n      @click=\"open = !open\"\n    >\n      <PlMaskIcon16\n        data-testid=\"pl-accordion-section-chevron\"\n        name=\"chevron-right\"\n        :class=\"[{ [$style.down]: open }, $style.chevron]\"\n      />\n      {{ label }}\n    </PlSectionSeparator>\n    <ExpandTransition>\n      <div v-if=\"open\" data-testid=\"pl-accordion-section-body\" :class=\"$style.content\">\n        <slot />\n      </div>\n    </ExpandTransition>\n  </div>\n</template>\n\n<style module>\n.content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--gap-v);\n  will-change: height, opacity;\n  /* transform: translateZ(0);\n  backface-visibility: hidden; */\n}\n\n.content > *:first-child {\n  margin-top: 24px;\n}\n\n.content > *:last-child {\n  margin-bottom: 4px;\n}\n\n.separator {\n  cursor: pointer;\n  &:hover {\n    --pl-separator-txt-color: var(--txt-01);\n    --mask-icon-bg-color: var(--ic-01);\n  }\n}\n\n.chevron {\n  transition-duration: 50ms;\n}\n\n.down {\n  transform: rotate(90deg);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAQA,IAAMsB,IAAKC,EAAoB,4BAA4BC,EAAM,EAAE,GAAG,EAAI,GAEpEC,IAAKF,EAIT,4BAA4BC,EAAM,EAAE,UAAU,GAAM,CAAC,GAAG,EAAI,GAExDE,IAAQzB,EAAoB2B,GAAA,YAAC,GAE7BC,IAAKC,EAAS,GAEdC,IAAUC,QAAe,CAACP,KAAMA,EAAG,MAAM,QAAQ,GAEjDQ,IAAOD,EAAS;GACpB,MAAM;IAKJ,OAJID,EAAQ,QACHL,EAAM,QAGRJ,IAAKA,EAAG,UAAUO,IAAKH,EAAM;GACtC;GACA,IAAI,GAAI;IACN,AAAIK,EAAQ,QACV,EAAM,QAAQG,IACLZ,MACT,EAAG,QAAQA,EAAG,UAAUO,IAAK,KAAKA;GAEtC;EACF,CAAC;E,kBAeC3B,EAAA,GAAAC,EAmBM,OAnBNe,GAmBM,CAlBJd,EAYqBC,EAAAC,CAAA,GAAA;GAXnB,eAAY;GACX,OAAKC,EAAEP,EAAAA,OAAO,SAAS;GACvB,SAAS4B,EAAA;GACT,SAAK,AAAAa,EAAA,QAAA,MAAE,EAAA,QAAI,CAAIR,EAAA;;GAEhB,SAAAzB,QAIE,CAJFJ,EAIEC,EAAAI,CAAA,GAAA;IAHA,eAAY;IACZ,MAAK;IACJ,OAAKF,EAAA,CAAA,GAAMP,EAAAA,OAAO,OAAOiC,EAAA,MAAI,GAAIjC,EAAAA,OAAO,OAAO,CAAA;G,wBAChDU,EAAA,MACFC,EAAGiB,EAAA,KAAK,GAAA,CAAA,C;;E,6BAEVxB,EAImBQ,GAAA,MAAA;GAHjB,SAAAJ,QAEM,CAFKyB,EAAA,SAAX/B,EAAA,GAAAC,EAEM,OAAA;;IAFW,eAAY;IAA6B,OAAKI,EAAEP,EAAAA,OAAO,OAAO;G,IAC7Ea,EAAQ2B,EAAA,QAAA,SAAA,C"}

package/dist/components/PlAccordion/index.js

@@ -1,2 +1,3 @@
-import "./PlAccordion.js";
-import "./PlAccordionSection.js";
+import e from "./PlAccordion.js";
+import t from "./PlAccordionSection.js";
+export { e as PlAccordion, t as PlAccordionSection };

package/dist/components/PlAlert/PlAlert.js

@@ -1,7 +1,6 @@
 import e from "./PlAlert.vue2.js";
-//#region src/components/PlAlert/PlAlert.vue
+// src/components/PlAlert/PlAlert.vue
 var t = e;
-//#endregion
 export { t as default };
 
 //# sourceMappingURL=PlAlert.js.map

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

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

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

@@ -1,7 +1,7 @@
 import './pl-alert.css';/* empty css         */
 import e from "../../utils/PlCloseModalBtn.js";
 import { createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeClass as o, normalizeStyle as s, openBlock as c, renderSlot as l, toDisplayString as u } from "vue";
-//#region src/components/PlAlert/PlAlert.vue?vue&type=script&setup=true&lang.ts
+// src/components/PlAlert/PlAlert.vue?vue&type=script&setup=true&lang.ts
 var d = {
 	key: 0,
 	"data-testid": "pl-alert-icon",
@@ -12,7 +12,7 @@ var d = {
 }, m = {
 	"data-testid": "pl-alert-message",
 	class: "pl-alert__main__text"
-}, h = /* @__PURE__ */ a({
+}, h = /*@__PURE__*/ a({
 	name: "PlAlert",
 	props: {
 		modelValue: {
@@ -67,7 +67,6 @@ var d = {
 		], 6)) : n("", !0);
 	}
 });
-//#endregion
 export { h as default };
 
 //# sourceMappingURL=PlAlert.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PlAlert.vue_vue_type_script_setup_true_lang.js","names":["$emit"],"sources":["../../../src/components/PlAlert/PlAlert.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n  name: \"PlAlert\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-alert.scss\";\n\nimport PlCloseModalBtn from \"../../utils/PlCloseModalBtn.vue\";\n\ndefineEmits<{\n  /**\n   * Emitted when the model value is updated, typically when the close button is clicked.\n   *\n   * @param value - The new value of the model, generally `false` when the alert is closed.\n   */\n  (e: \"update:modelValue\", value: boolean): void;\n}>();\n\nwithDefaults(\n  defineProps<{\n    /**\n     * Controls the visibility of the alert component. If `true`, the alert is visible.\n     *\n     * @default true\n     */\n    modelValue?: boolean;\n    /**\n     * The type of alert, which determines the alert's style and icon.\n     * Can be one of `'success' | 'info' | 'warn' | 'error'`.\n     */\n    type?: \"success\" | \"info\" | \"warn\" | \"error\";\n    /**\n     * An optional label that appears at the top of the alert.\n     */\n    label?: string;\n    /**\n     * If `true`, an icon corresponding to the alert type is displayed.\n     */\n    icon?: boolean;\n    /**\n     * If `true`, a close button is displayed in the alert, allowing the user to close it.\n     */\n    closeable?: boolean;\n    /**\n     * If `true`, the alert text is displayed in a monospace font.\n     */\n    monospace?: boolean;\n    /**\n     * If `true`, the alert content will preserve whitespace and line breaks.\n     */\n    whiteSpacePre?: boolean;\n\n    /**\n     * Max height (css value like '120px or 30%')\n     */\n    maxHeight?: string;\n  }>(),\n  {\n    modelValue: true,\n    type: undefined,\n    label: undefined,\n    icon: undefined,\n    closeable: undefined,\n    monospace: undefined,\n    whiteSpacePre: undefined,\n    maxHeight: undefined,\n  },\n);\n\nconst iconMap = {\n  success: \"success\",\n  warn: \"warning\",\n  info: \"edit\",\n  error: \"error\",\n};\n</script>\n\n<template>\n  <div\n    v-if=\"modelValue\"\n    data-testid=\"pl-alert\"\n    class=\"pl-alert\"\n    :style=\"{ maxHeight }\"\n    :class=\"[{ monospace, whiteSpacePre }, type ? `pl-alert__${type}` : '']\"\n  >\n    <div v-if=\"icon && type\" data-testid=\"pl-alert-icon\" class=\"pl-alert__icon\">\n      <div :class=\"`icon-24 icon-${iconMap[type]}`\" />\n    </div>\n    <div class=\"pl-alert__main\">\n      <label v-if=\"label\" data-testid=\"pl-alert-label\">{{ label }}</label>\n      <div data-testid=\"pl-alert-message\" class=\"pl-alert__main__text\"><slot /></div>\n    </div>\n    <PlCloseModalBtn\n      v-if=\"closeable\"\n      data-testid=\"pl-alert-close\"\n      class=\"pl-alert__close-btn\"\n      @click=\"$emit('update:modelValue', false)\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;CAEE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqER,IAAM,IAAU;GACd,SAAS;GACT,MAAM;GACN,MAAM;GACN,OAAO;GACR;mBAKS,EAAA,cAAA,GAAA,EADR,EAoBM,OAAA;;GAlBJ,eAAY;GACZ,OAAK,EAAA,CAAC,YAAU,CAAA;IAAA,WAEL,EAAA;IAAS,eAAE,EAAA;IAAa,EAAI,EAAA,OAAI,aAAgB,EAAA,SAAI,GAAA,CAAA,CAAA;GAD9D,OAAK,EAAA,EAAA,WAAI,EAAA,WAAS,CAAA;;GAGR,EAAA,QAAQ,EAAA,QAAA,GAAA,EAAnB,EAEM,OAFN,GAEM,CADJ,EAAgD,OAAA,EAA1C,OAAK,EAAA,gBAAkB,EAAQ,EAAA,QAAI,EAAA,EAAA,MAAA,EAAA,CAAA,CAAA,IAAA,EAAA,IAAA,GAAA;GAE3C,EAGM,OAHN,GAGM,CAFS,EAAA,SAAA,GAAA,EAAb,EAAoE,SAApE,GAAoE,EAAhB,EAAA,MAAK,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,EACzD,EAA+E,OAA/E,GAA+E,CAAd,EAAQ,EAAA,QAAA,UAAA,CAAA,CAAA,CAAA,CAAA;GAGnE,EAAA,aAAA,GAAA,EADR,EAKE,GAAA;;IAHA,eAAY;IACZ,OAAM;IACL,SAAK,AAAA,EAAA,QAAA,MAAEA,EAAAA,MAAK,qBAAA,GAAA"}
+{"version":3,"file":"PlAlert.vue_vue_type_script_setup_true_lang.js","names":["$emit","_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_createElementVNode","_createCommentVNode","_toDisplayString","_renderSlot","_createBlock","PlCloseModalBtn","PlCloseModalBtn_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","PlAlert_vue_vue_type_script_setup_true_lang_default","iconMap","__props","openBlock","createElementBlock","normalizeClass","normalizeStyle","createElementVNode","createCommentVNode","toDisplayString","renderSlot","_ctx","createBlock","_cache"],"sources":["../../../src/components/PlAlert/PlAlert.vue"],"sourcesContent":["<script lang=\"ts\">\nexport default {\n  name: \"PlAlert\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport \"./pl-alert.scss\";\n\nimport PlCloseModalBtn from \"../../utils/PlCloseModalBtn.vue\";\n\ndefineEmits<{\n  /**\n   * Emitted when the model value is updated, typically when the close button is clicked.\n   *\n   * @param value - The new value of the model, generally `false` when the alert is closed.\n   */\n  (e: \"update:modelValue\", value: boolean): void;\n}>();\n\nwithDefaults(\n  defineProps<{\n    /**\n     * Controls the visibility of the alert component. If `true`, the alert is visible.\n     *\n     * @default true\n     */\n    modelValue?: boolean;\n    /**\n     * The type of alert, which determines the alert's style and icon.\n     * Can be one of `'success' | 'info' | 'warn' | 'error'`.\n     */\n    type?: \"success\" | \"info\" | \"warn\" | \"error\";\n    /**\n     * An optional label that appears at the top of the alert.\n     */\n    label?: string;\n    /**\n     * If `true`, an icon corresponding to the alert type is displayed.\n     */\n    icon?: boolean;\n    /**\n     * If `true`, a close button is displayed in the alert, allowing the user to close it.\n     */\n    closeable?: boolean;\n    /**\n     * If `true`, the alert text is displayed in a monospace font.\n     */\n    monospace?: boolean;\n    /**\n     * If `true`, the alert content will preserve whitespace and line breaks.\n     */\n    whiteSpacePre?: boolean;\n\n    /**\n     * Max height (css value like '120px or 30%')\n     */\n    maxHeight?: string;\n  }>(),\n  {\n    modelValue: true,\n    type: undefined,\n    label: undefined,\n    icon: undefined,\n    closeable: undefined,\n    monospace: undefined,\n    whiteSpacePre: undefined,\n    maxHeight: undefined,\n  },\n);\n\nconst iconMap = {\n  success: \"success\",\n  warn: \"warning\",\n  info: \"edit\",\n  error: \"error\",\n};\n</script>\n\n<template>\n  <div\n    v-if=\"modelValue\"\n    data-testid=\"pl-alert\"\n    class=\"pl-alert\"\n    :style=\"{ maxHeight }\"\n    :class=\"[{ monospace, whiteSpacePre }, type ? `pl-alert__${type}` : '']\"\n  >\n    <div v-if=\"icon && type\" data-testid=\"pl-alert-icon\" class=\"pl-alert__icon\">\n      <div :class=\"`icon-24 icon-${iconMap[type]}`\" />\n    </div>\n    <div class=\"pl-alert__main\">\n      <label v-if=\"label\" data-testid=\"pl-alert-label\">{{ label }}</label>\n      <div data-testid=\"pl-alert-message\" class=\"pl-alert__main__text\"><slot /></div>\n    </div>\n    <PlCloseModalBtn\n      v-if=\"closeable\"\n      data-testid=\"pl-alert-close\"\n      class=\"pl-alert__close-btn\"\n      @click=\"$emit('update:modelValue', false)\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;CAEE,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqER,IAAMiB,IAAU;GACd,SAAS;GACT,MAAM;GACN,MAAM;GACN,OAAO;EACT;E,iBAKUC,EAAA,cADRjB,EAAA,GAAAC,EAoBM,OAAA;;GAlBJ,eAAY;GACZ,OAAKC,EAAA,CAAC,YAAU,CAAA;IAAA,WAELe,EAAA;IAAS,eAAEA,EAAA;GAAa,GAAIA,EAAA,OAAI,aAAgBA,EAAA,SAAI,EAAA,CAAA,CAAA;GAD9D,OAAKd,EAAA,EAAA,WAAIc,EAAA,UAAS,CAAA;;GAGRA,EAAA,QAAQA,EAAA,QAAnBjB,EAAA,GAAAC,EAEM,OAFNU,GAEM,CADJP,EAAgD,OAAA,EAA1C,OAAKF,EAAA,gBAAkBc,EAAQC,EAAA,OAAI,E;GAE3Cb,EAGM,OAHNQ,GAGM,CAFSK,EAAA,SAAbjB,EAAA,GAAAC,EAAoE,SAApEY,GAAoEP,EAAhBW,EAAA,KAAK,GAAA,CAAA,K,WACzDb,EAA+E,OAA/EU,GAA+E,CAAdP,EAAQmB,EAAA,QAAA,SAAA,C;GAGnET,EAAA,aADRjB,EAAA,GAAAQ,EAKEC,GAAA;;IAHA,eAAY;IACZ,OAAM;IACL,SAAK,AAAAmB,EAAA,QAAA,MAAE7B,EAAAA,MAAK,qBAAA,EAAA"}

package/dist/components/PlAlert/index.js

@@ -1 +1 @@
-import "./PlAlert.js";
+export { default as PlAlert } from "./PlAlert.js";

package/dist/components/PlAutocomplete/PlAutocomplete.js

@@ -1,7 +1,6 @@
 import e from "./PlAutocomplete.vue2.js";
-//#region src/components/PlAutocomplete/PlAutocomplete.vue
+// src/components/PlAutocomplete/PlAutocomplete.vue
 var t = e;
-//#endregion
 export { t as default };
 
 //# sourceMappingURL=PlAutocomplete.js.map

package/dist/components/PlAutocomplete/PlAutocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlAutocomplete.js","names":[],"sources":["../../../src/components/PlAutocomplete/PlAutocomplete.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * A component for selecting one value from a big list of options using string search request\n */\nexport default {\n  name: \"PlAutocomplete\",\n};\n</script>\n\n<script\n  lang=\"ts\"\n  setup\n  generic=\"M extends null | undefined | string | number = null | undefined | string\"\n>\nimport \"./pl-autocomplete.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 } from \"../../types\";\nimport { deepEqual } from \"../../helpers/objects\";\nimport DropdownListItem from \"../DropdownListItem.vue\";\nimport LongText from \"../LongText.vue\";\nimport { normalizeListOptions } from \"../../helpers/utils\";\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlMaskIcon24 } from \"../PlMaskIcon24\";\nimport { DropdownOverlay } from \"../../utils/DropdownOverlay\";\nimport { refDebounced } from \"@vueuse/core\";\nimport { useWatchFetch } from \"../../composition/useWatchFetch.ts\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport type { ListOptionBase } from \"@platforma-sdk/model\";\nimport { PlSvg } from \"../PlSvg\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\nimport { isNil } from \"@milaboratories/helpers\";\n\n/**\n * The current selected value.\n */\nconst model = defineModel<M>({ required: true });\n\nconst props = withDefaults(\n  defineProps<{\n    /**\n     * Lambda for requesting of available options for the dropdown by search string.\n     */\n    optionsSearch: (string: string, type: \"value\" | \"label\") => Promise<ListOption<M>[]>;\n    /**\n     * The label text for the dropdown field (optional)\n     */\n    label?: string;\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     * Formatter for the selected value if its label is absent\n     */\n    formatValue?: (value: M) => string;\n    /**\n     * Makes some of corners not rounded\n     * */\n    groupPosition?:\n      | \"top\"\n      | \"bottom\"\n      | \"left\"\n      | \"right\"\n      | \"top-left\"\n      | \"top-right\"\n      | \"bottom-left\"\n      | \"bottom-right\"\n      | \"middle\";\n  }>(),\n  {\n    modelSearch: undefined,\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    formatValue: (v: M) => String(v),\n    groupPosition: undefined,\n  },\n);\n\nconst slots = defineSlots<{\n  [key: string]: unknown;\n}>();\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst input = ref<HTMLInputElement | undefined>();\n\nconst overlayRef = useTemplateRef(\"overlay\");\n\nconst search = ref<string | null>(null);\nconst data = reactive({\n  activeIndex: -1,\n  open: false,\n});\n\nconst findActiveIndex = () =>\n  tap(\n    renderedOptionsRef.value.findIndex((o) => deepEqual(o.value, model.value)),\n    (v) => (v < 0 ? 0 : v),\n  );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst loadedOptionsRef = ref<ListOption<M>[]>([]);\nconst modelOptionRef = ref<ListOptionNormalized<M> | undefined>(); // list of 1 option that is selected or empty, to keep selected label\n\nconst renderedOptionsRef = computed(() => {\n  return normalizeListOptions(loadedOptionsRef.value).map((opt, index) => ({\n    ...opt,\n    index,\n    isSelected: index === selectedIndex.value,\n    isActive: index === data.activeIndex,\n  })) as (ListOptionBase<M> & { index: number; isSelected: boolean; isActive: boolean })[];\n});\nconst isLoadingOptions = ref<boolean>(true);\nconst isLoadingError = ref<boolean>(false);\n\nconst isDisabled = computed(() => {\n  return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n  return loadedOptionsRef.value.findIndex((o) => deepEqual(o.value, model.value));\n});\n\nconst computedError = computed(() => {\n  if (isLoadingOptions.value) {\n    return undefined;\n  }\n\n  if (props.error) {\n    return getErrorMessage(props.error);\n  }\n\n  if (isLoadingError.value) {\n    return \"Data loading error\";\n  }\n\n  return undefined;\n});\n\nconst textValue = computed(() => {\n  const modelOption = unref(modelOptionRef);\n  const options = unref(renderedOptionsRef);\n\n  const item: ListOptionNormalized | undefined =\n    modelOption ??\n    options.find((o) => deepEqual(o.value, model.value)) ??\n    options.find((o) => deepEqual(o.value, model.value));\n\n  return item?.label || (model.value ? props.formatValue(model.value) : \"\");\n});\n\n// Native tooltip with the full selected value; the value layer itself has\n// `pointer-events: none`, so the title goes on the field wrapper.\nconst fieldTitle = computed(() => (!data.open && textValue.value ? textValue.value : undefined));\n\nconst computedPlaceholder = computed(() => {\n  if (!data.open && model.value) {\n    return \"\";\n  }\n\n  return model.value ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n  return model.value !== undefined && model.value !== null;\n});\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : \"0\"));\n\nconst selectOption = (v: (ListOptionBase<M> & { index: number }) | undefined) => {\n  model.value = v?.value as M;\n  modelOptionRef.value = v;\n  search.value = null;\n  data.open = false;\n  rootRef?.value?.focus();\n};\n\nconst clear = () => {\n  model.value = undefined as M;\n  modelOptionRef.value = undefined;\n};\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => {\n  data.open = !data.open;\n};\n\nwatch(\n  () => data.open,\n  (v) => {\n    search.value = v ? \"\" : null;\n  },\n);\n\nconst onInputFocus = () => {\n  data.open = true;\n};\n\nconst onFocusOut = (event: FocusEvent) => {\n  const relatedTarget = event.relatedTarget as Node | null;\n\n  if (\n    !rootRef.value?.contains(relatedTarget) &&\n    !overlayRef.value?.listRef?.contains(relatedTarget)\n  ) {\n    search.value = null;\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      search.value = \"\";\n    }\n    return;\n  }\n\n  if (e.code === \"Escape\") {\n    data.open = false;\n    search.value = null;\n    rootRef.value?.focus();\n  }\n\n  const options = unref(renderedOptionsRef);\n\n  const { length } = options;\n\n  if (!length) {\n    return;\n  }\n\n  if (e.code === \"Enter\") {\n    selectOption(options.find((it) => it.index === activeIndex));\n  }\n\n  const localIndex = options.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 = renderedOptionsRef.value[newIndex].index ?? -1;\n};\n\nuseLabelNotch(rootRef);\n\nwatch(() => model.value, 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  search.value; // to watch\n\n  if (data.activeIndex >= 0 && data.open) {\n    overlayRef.value?.scrollIntoActive();\n  }\n});\n\nconst searchDebounced = refDebounced(search, 300, { maxWait: 1000 });\n\nconst optionsRequest = useWatchFetch(\n  () => searchDebounced.value,\n  async (v) => (isNil(v) ? undefined : props.optionsSearch(v, \"label\")),\n);\n\nconst modelOptionRequest = useWatchFetch(\n  () => model.value,\n  async (v) => {\n    if (isNil(v) || deepEqual(modelOptionRef.value?.value, v)) {\n      return modelOptionRef.value;\n    }\n\n    const options = await props.optionsSearch(String(v), \"value\");\n    return options.find((o) => String(o.value) === String(v));\n  },\n);\n\nwatch(\n  () => optionsRequest.value,\n  (result) => {\n    if (result) {\n      loadedOptionsRef.value = result;\n      if (search.value !== null) {\n        isLoadingError.value = false;\n      }\n    }\n  },\n);\n\nwatch(\n  () => modelOptionRequest.value,\n  (result) => {\n    if (result) {\n      modelOptionRef.value = normalizeListOptions([result])[0];\n    }\n  },\n);\n\nwatch(\n  () => optionsRequest.error,\n  (err) => {\n    if (err) {\n      isLoadingError.value = Boolean(err);\n    }\n  },\n);\n\nwatch(\n  () => optionsRequest.loading || modelOptionRequest.loading,\n  (loading) => {\n    isLoadingOptions.value = loading;\n  },\n);\n</script>\n\n<template>\n  <div\n    class=\"pl-autocomplete__envelope\"\n    @click.stop=\"setFocusOnInput\"\n    data-testid=\"pl-autocomplete\"\n  >\n    <div\n      ref=\"rootRef\"\n      :tabindex=\"tabindex\"\n      class=\"pl-autocomplete\"\n      data-testid=\"pl-autocomplete-control\"\n      :class=\"{ open: data.open, error: Boolean(computedError), disabled: isDisabled }\"\n      @keydown=\"handleKeydown\"\n      @focusout=\"onFocusOut\"\n    >\n      <div class=\"pl-autocomplete__container\">\n        <div class=\"pl-autocomplete__field\" :title=\"fieldTitle\">\n          <input\n            ref=\"input\"\n            v-model=\"search\"\n            type=\"text\"\n            tabindex=\"-1\"\n            :disabled=\"isDisabled\"\n            :placeholder=\"computedPlaceholder\"\n            spellcheck=\"false\"\n            autocomplete=\"chrome-off\"\n            data-testid=\"pl-autocomplete-input\"\n            @focus=\"onInputFocus\"\n          />\n\n          <div v-if=\"!data.open\" class=\"input-value\" data-testid=\"pl-autocomplete-value\">\n            <LongText> {{ textValue }} </LongText>\n          </div>\n\n          <div class=\"pl-autocomplete__controls\">\n            <PlMaskIcon24\n              v-if=\"isLoadingOptions\"\n              name=\"loading\"\n              data-testid=\"pl-autocomplete-loading\"\n            />\n            <PlIcon16\n              v-if=\"clearable && hasValue\"\n              class=\"clear\"\n              data-testid=\"pl-autocomplete-clear\"\n              name=\"delete-clear\"\n              @click.stop=\"clear\"\n            />\n            <slot name=\"append\" />\n            <div\n              class=\"pl-autocomplete__arrow-wrapper\"\n              data-testid=\"pl-autocomplete-arrow\"\n              @click.stop=\"toggleOpen\"\n            >\n              <div\n                v-if=\"arrowIconLarge\"\n                class=\"arrow-icon\"\n                :class=\"[`icon-24 ${arrowIconLarge}`]\"\n              />\n              <div v-else-if=\"arrowIcon\" class=\"arrow-icon\" :class=\"[`icon-16 ${arrowIcon}`]\" />\n              <div v-else class=\"arrow-icon arrow-icon-default\" />\n            </div>\n          </div>\n        </div>\n        <label v-if=\"label\" data-testid=\"pl-autocomplete-label\">\n          <PlSvg v-if=\"required\" :uri=\"SvgRequired\" data-testid=\"pl-autocomplete-required\" />\n          <span>{{ label }}</span>\n          <PlTooltip\n            v-if=\"slots.tooltip\"\n            class=\"info\"\n            position=\"top\"\n            data-testid=\"pl-autocomplete-tooltip\"\n          >\n            <template #tooltip>\n              <slot name=\"tooltip\" />\n            </template>\n          </PlTooltip>\n        </label>\n        <DropdownOverlay\n          v-if=\"data.open\"\n          ref=\"overlay\"\n          :root=\"rootRef\"\n          class=\"pl-autocomplete__options\"\n          data-testid=\"pl-autocomplete-options\"\n          tabindex=\"-1\"\n          :gap=\"3\"\n        >\n          <DropdownListItem\n            v-for=\"(item, index) in renderedOptionsRef\"\n            :key=\"index\"\n            :option=\"item\"\n            :is-selected=\"item.isSelected\"\n            :is-hovered=\"item.isActive\"\n            :size=\"optionSize\"\n            data-testid=\"pl-autocomplete-option\"\n            @click.stop=\"selectOption(item)\"\n          />\n          <div\n            v-if=\"!renderedOptionsRef.length\"\n            class=\"nothing-found\"\n            data-testid=\"pl-autocomplete-options-empty\"\n          >\n            Nothing found\n          </div>\n        </DropdownOverlay>\n        <DoubleContour class=\"pl-autocomplete__contour\" :group-position=\"groupPosition\" />\n      </div>\n    </div>\n    <div v-if=\"computedError\" class=\"pl-autocomplete__error\" data-testid=\"pl-autocomplete-error\">\n      {{ computedError }}\n    </div>\n    <div\n      v-else-if=\"isLoadingOptions && loadingOptionsHelper\"\n      class=\"pl-autocomplete__helper\"\n      data-testid=\"pl-autocomplete-helper\"\n    >\n      {{ loadingOptionsHelper }}\n    </div>\n    <div v-else-if=\"helper\" class=\"pl-autocomplete__helper\" data-testid=\"pl-autocomplete-helper\">\n      {{ helper }}\n    </div>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"PlAutocomplete.js","names":["_sfc_main","PlAutocomplete_vue_vue_type_script_setup_true_lang_default","PlAutocomplete_default"],"sources":["../../../src/components/PlAutocomplete/PlAutocomplete.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * A component for selecting one value from a big list of options using string search request\n */\nexport default {\n  name: \"PlAutocomplete\",\n};\n</script>\n\n<script\n  lang=\"ts\"\n  setup\n  generic=\"M extends null | undefined | string | number = null | undefined | string\"\n>\nimport \"./pl-autocomplete.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 } from \"../../types\";\nimport { deepEqual } from \"../../helpers/objects\";\nimport DropdownListItem from \"../DropdownListItem.vue\";\nimport LongText from \"../LongText.vue\";\nimport { normalizeListOptions } from \"../../helpers/utils\";\nimport { PlIcon16 } from \"../PlIcon16\";\nimport { PlMaskIcon24 } from \"../PlMaskIcon24\";\nimport { DropdownOverlay } from \"../../utils/DropdownOverlay\";\nimport { refDebounced } from \"@vueuse/core\";\nimport { useWatchFetch } from \"../../composition/useWatchFetch.ts\";\nimport { getErrorMessage } from \"../../helpers/error.ts\";\nimport type { ListOptionBase } from \"@platforma-sdk/model\";\nimport { PlSvg } from \"../PlSvg\";\nimport SvgRequired from \"../../assets/images/required.svg?raw\";\nimport { isNil } from \"@milaboratories/helpers\";\n\n/**\n * The current selected value.\n */\nconst model = defineModel<M>({ required: true });\n\nconst props = withDefaults(\n  defineProps<{\n    /**\n     * Lambda for requesting of available options for the dropdown by search string.\n     */\n    optionsSearch: (string: string, type: \"value\" | \"label\") => Promise<ListOption<M>[]>;\n    /**\n     * The label text for the dropdown field (optional)\n     */\n    label?: string;\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     * Formatter for the selected value if its label is absent\n     */\n    formatValue?: (value: M) => string;\n    /**\n     * Makes some of corners not rounded\n     * */\n    groupPosition?:\n      | \"top\"\n      | \"bottom\"\n      | \"left\"\n      | \"right\"\n      | \"top-left\"\n      | \"top-right\"\n      | \"bottom-left\"\n      | \"bottom-right\"\n      | \"middle\";\n  }>(),\n  {\n    modelSearch: undefined,\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    formatValue: (v: M) => String(v),\n    groupPosition: undefined,\n  },\n);\n\nconst slots = defineSlots<{\n  [key: string]: unknown;\n}>();\n\nconst rootRef = ref<HTMLElement | undefined>();\nconst input = ref<HTMLInputElement | undefined>();\n\nconst overlayRef = useTemplateRef(\"overlay\");\n\nconst search = ref<string | null>(null);\nconst data = reactive({\n  activeIndex: -1,\n  open: false,\n});\n\nconst findActiveIndex = () =>\n  tap(\n    renderedOptionsRef.value.findIndex((o) => deepEqual(o.value, model.value)),\n    (v) => (v < 0 ? 0 : v),\n  );\n\nconst updateActive = () => (data.activeIndex = findActiveIndex());\n\nconst loadedOptionsRef = ref<ListOption<M>[]>([]);\nconst modelOptionRef = ref<ListOptionNormalized<M> | undefined>(); // list of 1 option that is selected or empty, to keep selected label\n\nconst renderedOptionsRef = computed(() => {\n  return normalizeListOptions(loadedOptionsRef.value).map((opt, index) => ({\n    ...opt,\n    index,\n    isSelected: index === selectedIndex.value,\n    isActive: index === data.activeIndex,\n  })) as (ListOptionBase<M> & { index: number; isSelected: boolean; isActive: boolean })[];\n});\nconst isLoadingOptions = ref<boolean>(true);\nconst isLoadingError = ref<boolean>(false);\n\nconst isDisabled = computed(() => {\n  return props.disabled;\n});\n\nconst selectedIndex = computed(() => {\n  return loadedOptionsRef.value.findIndex((o) => deepEqual(o.value, model.value));\n});\n\nconst computedError = computed(() => {\n  if (isLoadingOptions.value) {\n    return undefined;\n  }\n\n  if (props.error) {\n    return getErrorMessage(props.error);\n  }\n\n  if (isLoadingError.value) {\n    return \"Data loading error\";\n  }\n\n  return undefined;\n});\n\nconst textValue = computed(() => {\n  const modelOption = unref(modelOptionRef);\n  const options = unref(renderedOptionsRef);\n\n  const item: ListOptionNormalized | undefined =\n    modelOption ??\n    options.find((o) => deepEqual(o.value, model.value)) ??\n    options.find((o) => deepEqual(o.value, model.value));\n\n  return item?.label || (model.value ? props.formatValue(model.value) : \"\");\n});\n\n// Native tooltip with the full selected value; the value layer itself has\n// `pointer-events: none`, so the title goes on the field wrapper.\nconst fieldTitle = computed(() => (!data.open && textValue.value ? textValue.value : undefined));\n\nconst computedPlaceholder = computed(() => {\n  if (!data.open && model.value) {\n    return \"\";\n  }\n\n  return model.value ? String(textValue.value) : props.placeholder;\n});\n\nconst hasValue = computed(() => {\n  return model.value !== undefined && model.value !== null;\n});\n\nconst tabindex = computed(() => (isDisabled.value ? undefined : \"0\"));\n\nconst selectOption = (v: (ListOptionBase<M> & { index: number }) | undefined) => {\n  model.value = v?.value as M;\n  modelOptionRef.value = v;\n  search.value = null;\n  data.open = false;\n  rootRef?.value?.focus();\n};\n\nconst clear = () => {\n  model.value = undefined as M;\n  modelOptionRef.value = undefined;\n};\n\nconst setFocusOnInput = () => input.value?.focus();\n\nconst toggleOpen = () => {\n  data.open = !data.open;\n};\n\nwatch(\n  () => data.open,\n  (v) => {\n    search.value = v ? \"\" : null;\n  },\n);\n\nconst onInputFocus = () => {\n  data.open = true;\n};\n\nconst onFocusOut = (event: FocusEvent) => {\n  const relatedTarget = event.relatedTarget as Node | null;\n\n  if (\n    !rootRef.value?.contains(relatedTarget) &&\n    !overlayRef.value?.listRef?.contains(relatedTarget)\n  ) {\n    search.value = null;\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      search.value = \"\";\n    }\n    return;\n  }\n\n  if (e.code === \"Escape\") {\n    data.open = false;\n    search.value = null;\n    rootRef.value?.focus();\n  }\n\n  const options = unref(renderedOptionsRef);\n\n  const { length } = options;\n\n  if (!length) {\n    return;\n  }\n\n  if (e.code === \"Enter\") {\n    selectOption(options.find((it) => it.index === activeIndex));\n  }\n\n  const localIndex = options.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 = renderedOptionsRef.value[newIndex].index ?? -1;\n};\n\nuseLabelNotch(rootRef);\n\nwatch(() => model.value, 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  search.value; // to watch\n\n  if (data.activeIndex >= 0 && data.open) {\n    overlayRef.value?.scrollIntoActive();\n  }\n});\n\nconst searchDebounced = refDebounced(search, 300, { maxWait: 1000 });\n\nconst optionsRequest = useWatchFetch(\n  () => searchDebounced.value,\n  async (v) => (isNil(v) ? undefined : props.optionsSearch(v, \"label\")),\n);\n\nconst modelOptionRequest = useWatchFetch(\n  () => model.value,\n  async (v) => {\n    if (isNil(v) || deepEqual(modelOptionRef.value?.value, v)) {\n      return modelOptionRef.value;\n    }\n\n    const options = await props.optionsSearch(String(v), \"value\");\n    return options.find((o) => String(o.value) === String(v));\n  },\n);\n\nwatch(\n  () => optionsRequest.value,\n  (result) => {\n    if (result) {\n      loadedOptionsRef.value = result;\n      if (search.value !== null) {\n        isLoadingError.value = false;\n      }\n    }\n  },\n);\n\nwatch(\n  () => modelOptionRequest.value,\n  (result) => {\n    if (result) {\n      modelOptionRef.value = normalizeListOptions([result])[0];\n    }\n  },\n);\n\nwatch(\n  () => optionsRequest.error,\n  (err) => {\n    if (err) {\n      isLoadingError.value = Boolean(err);\n    }\n  },\n);\n\nwatch(\n  () => optionsRequest.loading || modelOptionRequest.loading,\n  (loading) => {\n    isLoadingOptions.value = loading;\n  },\n);\n</script>\n\n<template>\n  <div\n    class=\"pl-autocomplete__envelope\"\n    @click.stop=\"setFocusOnInput\"\n    data-testid=\"pl-autocomplete\"\n  >\n    <div\n      ref=\"rootRef\"\n      :tabindex=\"tabindex\"\n      class=\"pl-autocomplete\"\n      data-testid=\"pl-autocomplete-control\"\n      :class=\"{ open: data.open, error: Boolean(computedError), disabled: isDisabled }\"\n      @keydown=\"handleKeydown\"\n      @focusout=\"onFocusOut\"\n    >\n      <div class=\"pl-autocomplete__container\">\n        <div class=\"pl-autocomplete__field\" :title=\"fieldTitle\">\n          <input\n            ref=\"input\"\n            v-model=\"search\"\n            type=\"text\"\n            tabindex=\"-1\"\n            :disabled=\"isDisabled\"\n            :placeholder=\"computedPlaceholder\"\n            spellcheck=\"false\"\n            autocomplete=\"chrome-off\"\n            data-testid=\"pl-autocomplete-input\"\n            @focus=\"onInputFocus\"\n          />\n\n          <div v-if=\"!data.open\" class=\"input-value\" data-testid=\"pl-autocomplete-value\">\n            <LongText> {{ textValue }} </LongText>\n          </div>\n\n          <div class=\"pl-autocomplete__controls\">\n            <PlMaskIcon24\n              v-if=\"isLoadingOptions\"\n              name=\"loading\"\n              data-testid=\"pl-autocomplete-loading\"\n            />\n            <PlIcon16\n              v-if=\"clearable && hasValue\"\n              class=\"clear\"\n              data-testid=\"pl-autocomplete-clear\"\n              name=\"delete-clear\"\n              @click.stop=\"clear\"\n            />\n            <slot name=\"append\" />\n            <div\n              class=\"pl-autocomplete__arrow-wrapper\"\n              data-testid=\"pl-autocomplete-arrow\"\n              @click.stop=\"toggleOpen\"\n            >\n              <div\n                v-if=\"arrowIconLarge\"\n                class=\"arrow-icon\"\n                :class=\"[`icon-24 ${arrowIconLarge}`]\"\n              />\n              <div v-else-if=\"arrowIcon\" class=\"arrow-icon\" :class=\"[`icon-16 ${arrowIcon}`]\" />\n              <div v-else class=\"arrow-icon arrow-icon-default\" />\n            </div>\n          </div>\n        </div>\n        <label v-if=\"label\" data-testid=\"pl-autocomplete-label\">\n          <PlSvg v-if=\"required\" :uri=\"SvgRequired\" data-testid=\"pl-autocomplete-required\" />\n          <span>{{ label }}</span>\n          <PlTooltip\n            v-if=\"slots.tooltip\"\n            class=\"info\"\n            position=\"top\"\n            data-testid=\"pl-autocomplete-tooltip\"\n          >\n            <template #tooltip>\n              <slot name=\"tooltip\" />\n            </template>\n          </PlTooltip>\n        </label>\n        <DropdownOverlay\n          v-if=\"data.open\"\n          ref=\"overlay\"\n          :root=\"rootRef\"\n          class=\"pl-autocomplete__options\"\n          data-testid=\"pl-autocomplete-options\"\n          tabindex=\"-1\"\n          :gap=\"3\"\n        >\n          <DropdownListItem\n            v-for=\"(item, index) in renderedOptionsRef\"\n            :key=\"index\"\n            :option=\"item\"\n            :is-selected=\"item.isSelected\"\n            :is-hovered=\"item.isActive\"\n            :size=\"optionSize\"\n            data-testid=\"pl-autocomplete-option\"\n            @click.stop=\"selectOption(item)\"\n          />\n          <div\n            v-if=\"!renderedOptionsRef.length\"\n            class=\"nothing-found\"\n            data-testid=\"pl-autocomplete-options-empty\"\n          >\n            Nothing found\n          </div>\n        </DropdownOverlay>\n        <DoubleContour class=\"pl-autocomplete__contour\" :group-position=\"groupPosition\" />\n      </div>\n    </div>\n    <div v-if=\"computedError\" class=\"pl-autocomplete__error\" data-testid=\"pl-autocomplete-error\">\n      {{ computedError }}\n    </div>\n    <div\n      v-else-if=\"isLoadingOptions && loadingOptionsHelper\"\n      class=\"pl-autocomplete__helper\"\n      data-testid=\"pl-autocomplete-helper\"\n    >\n      {{ loadingOptionsHelper }}\n    </div>\n    <div v-else-if=\"helper\" class=\"pl-autocomplete__helper\" data-testid=\"pl-autocomplete-helper\">\n      {{ helper }}\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/PlAutocomplete/PlAutocomplete.vue2.js

@@ -22,7 +22,7 @@ import ie from "../../assets/images/required.js";
 import { Fragment as ae, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as oe, createVNode as h, defineComponent as g, mergeModels as _, normalizeClass as v, openBlock as y, reactive as se, ref as b, renderList as ce, renderSlot as x, toDisplayString as S, unref as C, useModel as le, useSlots as ue, useTemplateRef as de, vModelText as fe, watch as w, watchPostEffect as pe, withCtx as T, withDirectives as me, withModifiers as E } from "vue";
 import { isNil as D } from "@milaboratories/helpers";
 import { refDebounced as he } from "@vueuse/core";
-//#region src/components/PlAutocomplete/PlAutocomplete.vue?vue&type=script&setup=true&lang.ts
+// src/components/PlAutocomplete/PlAutocomplete.vue?vue&type=script&setup=true&lang.ts
 var ge = ["tabindex"], _e = { class: "pl-autocomplete__container" }, ve = ["title"], O = ["disabled", "placeholder"], k = {
 	key: 0,
 	class: "input-value",
@@ -49,9 +49,9 @@ var ge = ["tabindex"], _e = { class: "pl-autocomplete__container" }, ve = ["titl
 	key: 2,
 	class: "pl-autocomplete__helper",
 	"data-testid": "pl-autocomplete-helper"
-}, I = /* @__PURE__ */ g({
+}, I = /*@__PURE__*/ g({
 	name: "PlAutocomplete",
-	props: /* @__PURE__ */ _({
+	props: /*@__PURE__*/ _({
 		optionsSearch: {},
 		label: { default: "" },
 		helper: { default: void 0 },
@@ -262,7 +262,6 @@ var ge = ["tabindex"], _e = { class: "pl-autocomplete__container" }, ve = ["titl
 		])], 42, ge), J.value ? (y(), p("div", P, S(J.value), 1)) : G.value && g.loadingOptionsHelper ? (y(), p("div", F, S(g.loadingOptionsHelper), 1)) : g.helper ? (y(), p("div", ye, S(g.helper), 1)) : f("", !0)]));
 	}
 });
-//#endregion
 export { I as default };
 
 //# sourceMappingURL=PlAutocomplete.vue2.js.map