@saooti/octopus-sdk 42.0.3 → 42.0.5

package/dist/ClassicMultiselect-wJ9U_4b2.mjs

@@ -0,0 +1,246 @@
+import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.mjs";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineAsyncComponent, defineComponent, guardReactiveProps, normalizeClass, normalizeProps, normalizeStyle, openBlock, ref, renderSlot, toDisplayString, unref, watch, withCtx } from "vue";
+import { useI18n } from "vue-i18n";
+import AsteriskIcon from "vue-material-design-icons/Asterisk.vue";
+import ChevronDownIcon from "vue-material-design-icons/ChevronDown.vue";
+import vSelect from "vue-select";
+import HelpCircleIcon from "vue-material-design-icons/HelpCircle.vue";
+//#region src/components/form/ClassicMultiselect.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "d-flex align-items-center" };
+var _hoisted_2 = ["for"];
+var _hoisted_3 = ["id", "title"];
+var _hoisted_4 = ["innerHTML"];
+var _hoisted_5 = { key: 0 };
+var _hoisted_6 = { key: 1 };
+var _hoisted_7 = { key: 0 };
+var _hoisted_8 = { key: 1 };
+var _hoisted_9 = {
+	key: 0,
+	class: "vs__dropdown-option"
+};
+var _hoisted_10 = {
+	key: 0,
+	class: "vs__dropdown-option"
+};
+var _hoisted_11 = {
+	key: 0,
+	class: "text-danger"
+};
+var ClassicMultiselect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "ClassicMultiselect",
+	props: {
+		id: {},
+		label: {},
+		placeholder: {},
+		optionLabel: {},
+		inModal: {
+			type: Boolean,
+			default: false
+		},
+		multiple: {
+			type: Boolean,
+			default: false
+		},
+		isDisabled: {
+			type: Boolean,
+			default: false
+		},
+		width: { default: "100%" },
+		height: {},
+		maxElement: { default: 50 },
+		minSearchLength: { default: 3 },
+		optionChosen: {},
+		noDeselect: {
+			type: Boolean,
+			default: true
+		},
+		optionCustomTemplating: { default: "" },
+		optionSelectedCustomTemplating: { default: "" },
+		displayLabel: {
+			type: Boolean,
+			default: false
+		},
+		maxOptions: { default: null },
+		allowEmpty: {
+			type: Boolean,
+			default: true
+		},
+		textDanger: {},
+		displayRequired: { type: Boolean },
+		popover: {},
+		popoverRelativeClass: {},
+		withSelectAll: {
+			type: [Boolean, String],
+			default: false
+		}
+	},
+	emits: [
+		"onSearch",
+		"selected",
+		"onClose"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const ClassicPopover = defineAsyncComponent(() => import("./ClassicPopover-Bk5kf37e.mjs").then((n) => n.n));
+		const emit = __emit;
+		const { t } = useI18n();
+		const optionSelected = ref(void 0);
+		const options = ref([]);
+		const remainingElements = ref(0);
+		const isLoading = ref(false);
+		const searchInput = ref("");
+		const selectAll = {
+			id: "SELECT_ALL",
+			[__props.optionLabel]: __props.withSelectAll && typeof __props.withSelectAll === "string" ? __props.withSelectAll : t("All")
+		};
+		const maxOptionsSelected = computed(() => {
+			if (__props.maxOptions !== null && __props.multiple) return optionSelected.value.length >= __props.maxOptions;
+			return false;
+		});
+		watch(() => __props.optionChosen, () => {
+			optionSelected.value = __props.optionChosen;
+		}, {
+			deep: true,
+			immediate: true
+		});
+		watch(optionSelected, () => {
+			if (__props.noDeselect || null !== optionSelected.value) return;
+			emit("selected", void 0);
+		}, { deep: true });
+		function fakeSearch() {
+			return options.value;
+		}
+		function onSearch(search) {
+			if (search && search.length < __props.minSearchLength) return;
+			else if (search) searchInput.value = search;
+			isLoading.value = true;
+			emit("onSearch", search);
+		}
+		function onClose() {
+			emit("onClose", searchInput.value);
+			searchInput.value = "";
+		}
+		function afterSearch(optionsFetched, count) {
+			if (__props.withSelectAll) {
+				options.value = [selectAll, ...optionsFetched];
+				count += 1;
+			} else options.value = optionsFetched;
+			remainingElements.value = Math.max(0, count - __props.maxElement);
+			isLoading.value = false;
+		}
+		function onOptionSelected(newValue) {
+			if (__props.withSelectAll && Array.isArray(newValue) && newValue.find((o) => o.id === selectAll.id)) emit("selected", options.value.slice(1));
+			else emit("selected", newValue);
+		}
+		function onOptionDeselect(event) {
+			if (!__props.multiple) return;
+			if (!__props.allowEmpty && 0 === optionSelected.value.length) {
+				optionSelected.value.push(event);
+				return;
+			}
+			emit("selected", optionSelected.value);
+		}
+		__expose({ afterSearch });
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: normalizeClass({
+					"multiselect-in-modal": __props.inModal,
+					"multiselect-no-deselect": __props.noDeselect,
+					"form-margin": __props.displayLabel
+				}),
+				style: normalizeStyle({
+					width: __props.width,
+					height: __props.height
+				})
+			}, [
+				createElementVNode("div", _hoisted_1, [createElementVNode("label", {
+					class: normalizeClass([__props.displayLabel ? "" : "d-none", "form-label"]),
+					for: __props.id
+				}, [createTextVNode(toDisplayString(__props.label) + " ", 1), __props.displayRequired ? (openBlock(), createBlock(AsteriskIcon, {
+					key: 0,
+					size: 10,
+					class: "ms-1 mb-2",
+					title: unref(t)("Mandatory input")
+				}, null, 8, ["title"])) : createCommentVNode("", true)], 10, _hoisted_2), __props.popover ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createElementVNode("button", {
+					id: "popover" + __props.id,
+					title: unref(t)("Help"),
+					class: "btn-transparent"
+				}, [createVNode(HelpCircleIcon, { size: 30 })], 8, _hoisted_3), createVNode(unref(ClassicPopover), {
+					target: "popover" + __props.id,
+					"popover-class": "popover-z-index",
+					"relative-class": __props.popoverRelativeClass
+				}, {
+					default: withCtx(() => [createElementVNode("div", { innerHTML: __props.popover }, null, 8, _hoisted_4)]),
+					_: 1
+				}, 8, ["target", "relative-class"])], 64)) : createCommentVNode("", true)]),
+				createVNode(unref(vSelect), {
+					modelValue: optionSelected.value,
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => optionSelected.value = $event),
+					"input-id": __props.id,
+					label: __props.optionLabel,
+					multiple: __props.multiple,
+					options: options.value,
+					disabled: __props.isDisabled,
+					loading: isLoading.value,
+					placeholder: __props.placeholder,
+					"clear-search-on-blur": () => {
+						return true;
+					},
+					filter: fakeSearch,
+					selectable: () => !maxOptionsSelected.value,
+					style: normalizeStyle({ height: __props.height }),
+					class: normalizeClass({ "border border-danger": __props.textDanger?.length }),
+					onOpen: onSearch,
+					onSearch,
+					onClose,
+					"onOption:selected": onOptionSelected,
+					"onOption:deselected": onOptionDeselect
+				}, createSlots({
+					"selected-option-container": withCtx(({ option, deselect, disabled, multiple: mul }) => [renderSlot(_ctx.$slots, "selected-option-container", normalizeProps(guardReactiveProps({
+						option,
+						deselect,
+						disabled,
+						multiple: mul
+					})))]),
+					"no-options": withCtx(({ searching }) => [searching ? (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(unref(t)("No elements found. Consider changing the search query.")), 1)) : (openBlock(), createElementBlock("span", _hoisted_8, toDisplayString(unref(t)("List is empty")), 1))]),
+					"list-footer": withCtx(() => [remainingElements.value ? (openBlock(), createElementBlock("div", _hoisted_9, toDisplayString(unref(t)("Count more elements matched your query, please make a more specific search.", { count: remainingElements.value })), 1)) : createCommentVNode("", true)]),
+					"list-header": withCtx(() => [maxOptionsSelected.value ? (openBlock(), createElementBlock("div", _hoisted_10, toDisplayString(unref(t)("Multiselect max options", { max: __props.maxOptions })), 1)) : createCommentVNode("", true)]),
+					"open-indicator": withCtx(({ attributes }) => [createVNode(ChevronDownIcon, normalizeProps(guardReactiveProps(attributes)), null, 16)]),
+					_: 2
+				}, [__props.optionCustomTemplating.length ? {
+					name: "option",
+					fn: withCtx((option) => [renderSlot(_ctx.$slots, __props.optionCustomTemplating, { option })]),
+					key: "0"
+				} : __props.withSelectAll ? {
+					name: "option",
+					fn: withCtx((option) => [option.id === selectAll.id ? (openBlock(), createElementBlock("strong", _hoisted_5, toDisplayString(option[__props.optionLabel]), 1)) : (openBlock(), createElementBlock("span", _hoisted_6, toDisplayString(option[__props.optionLabel]), 1))]),
+					key: "1"
+				} : void 0, __props.optionSelectedCustomTemplating.length ? {
+					name: "selected-option",
+					fn: withCtx((option) => [renderSlot(_ctx.$slots, __props.optionSelectedCustomTemplating, { option })]),
+					key: "2"
+				} : void 0]), 1032, [
+					"modelValue",
+					"input-id",
+					"label",
+					"multiple",
+					"options",
+					"disabled",
+					"loading",
+					"placeholder",
+					"selectable",
+					"style",
+					"class"
+				]),
+				__props.textDanger ? (openBlock(), createElementBlock("div", _hoisted_11, toDisplayString(__props.textDanger), 1)) : createCommentVNode("", true)
+			], 6);
+		};
+	}
+});
+//#endregion
+//#region src/components/form/ClassicMultiselect.vue
+var ClassicMultiselect_exports = /* @__PURE__ */ __exportAll({ default: () => ClassicMultiselect_default });
+var ClassicMultiselect_default = ClassicMultiselect_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ClassicMultiselect_exports as n, ClassicMultiselect_default as t };
+
+//# sourceMappingURL=ClassicMultiselect-wJ9U_4b2.mjs.map

package/dist/ClassicMultiselect-wJ9U_4b2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClassicMultiselect-wJ9U_4b2.mjs","names":[],"sources":["../src/components/form/ClassicMultiselect.vue","../src/components/form/ClassicMultiselect.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"{\n      'multiselect-in-modal': inModal,\n      'multiselect-no-deselect': noDeselect,\n      'form-margin': displayLabel,\n    }\"\n    :style=\"{ width: width, height: height }\"\n  >\n    <div class=\"d-flex align-items-center\">\n      <label :class=\"displayLabel ? '' : 'd-none'\" :for=\"id\" class=\"form-label\">{{\n        label\n      }}\n        <AsteriskIcon v-if=\"displayRequired\" :size=\"10\" class=\"ms-1 mb-2\" :title=\"t('Mandatory input')\"/>\n      </label>\n\n      <template v-if=\"popover\">\n        <button\n          :id=\"'popover' + id\"\n          :title=\"t('Help')\"\n          class=\"btn-transparent\"\n        >\n          <HelpCircleIcon :size=\"30\" />\n        </button>\n        <ClassicPopover\n          :target=\"'popover' + id\"\n          popover-class=\"popover-z-index\"\n          :relative-class=\"popoverRelativeClass\"\n        >\n          <!-- eslint-disable vue/no-v-html -->\n          <div v-html=\"popover\" />\n          <!-- eslint-enable -->\n        </ClassicPopover>\n      </template>\n    </div>\n\n    <vSelect\n      v-model=\"optionSelected\"\n      :input-id=\"id\"\n      :label=\"optionLabel\"\n      :multiple=\"multiple\"\n      :options=\"options\"\n      :disabled=\"isDisabled\"\n      :loading=\"isLoading\"\n      :placeholder=\"placeholder\"\n      :clear-search-on-blur=\"\n        () => {\n          return true;\n        }\n      \"\n      :filter=\"fakeSearch\"\n      :selectable=\"() => !maxOptionsSelected\"\n      :style=\"{height: height }\"\n      :class=\"{ 'border border-danger': textDanger?.length }\"\n      @open=\"onSearch\"\n      @search=\"onSearch\"\n      @close=\"onClose\"\n      @option:selected=\"onOptionSelected\"\n      @option:deselected=\"onOptionDeselect\"\n    >\n      \n      <template v-if=\"optionCustomTemplating.length\" #option=\"option\">\n        <slot :name=\"optionCustomTemplating\" :option=\"option\" />\n      </template>\n\n      <template v-else-if=\"withSelectAll\" #option=\"option\">\n        <strong v-if=\"option.id === selectAll.id\">\n          {{ option[optionLabel] }}\n        </strong>\n        <span v-else>\n          {{ option[optionLabel] }}\n        </span>\n      </template>\n\n      <template\n        v-if=\"optionSelectedCustomTemplating.length\"\n        #selected-option=\"option\"\n      >\n        <slot :name=\"optionSelectedCustomTemplating\" :option=\"option\" />\n      </template>\n\n      <template #selected-option-container=\"{ option, deselect, disabled, multiple: mul }\">\n        <slot name=\"selected-option-container\" v-bind=\"{ option, deselect, disabled, multiple: mul }\" />\n      </template>\n\n      <template #no-options=\"{ searching }\">\n        <span v-if=\"searching\">{{\n          t(\"No elements found. Consider changing the search query.\")\n        }}</span>\n        <span v-else>{{ t(\"List is empty\") }}</span>\n      </template>\n\n      <template #list-footer>\n        <div v-if=\"remainingElements\" class=\"vs__dropdown-option\">\n          {{\n            t(\n              \"Count more elements matched your query, please make a more specific search.\",\n              { count: remainingElements },\n            )\n          }}\n        </div>\n      </template>\n\n      <template #list-header>\n        <div v-if=\"maxOptionsSelected\" class=\"vs__dropdown-option\">\n          {{ t(\"Multiselect max options\", { max: maxOptions }) }}\n        </div>\n      </template>\n\n      <template #open-indicator=\"{ attributes }\">\n        <ChevronDownIcon v-bind=\"attributes\" />\n      </template>\n    </vSelect>\n    <div v-if=\"textDanger\" class=\"text-danger\">\n      {{ textDanger }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\" generic=\"T\">\nimport { computed, defineAsyncComponent, ref, Ref, watch } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\nimport AsteriskIcon from \"vue-material-design-icons/Asterisk.vue\";\nimport ChevronDownIcon from \"vue-material-design-icons/ChevronDown.vue\";\nimport vSelect from \"vue-select\";\nimport HelpCircleIcon from \"vue-material-design-icons/HelpCircle.vue\";\nconst ClassicPopover = defineAsyncComponent(\n  () => import(\"../misc/ClassicPopover.vue\"),\n);\n\n//Props \nconst {\n  inModal = false, multiple = false, isDisabled = false, width = \"100%\",\n  maxElement = 50, minSearchLength = 3, noDeselect = true, displayLabel = false,\n  allowEmpty = true, optionChosen, maxOptions = null,\n  optionCustomTemplating = '', optionSelectedCustomTemplating = '',\n  optionLabel,\n  withSelectAll = false\n} = defineProps<{\n  id?: string;\n  label?: string;\n  placeholder?: string;\n  optionLabel?: keyof T;\n  inModal?: boolean;\n  multiple?: boolean;\n  isDisabled?: boolean;\n  width?: string;\n  height?: string;\n  maxElement?: number;\n  minSearchLength?: number;\n  /** Currently chosen option */\n  optionChosen?: T|Array<T>;\n  noDeselect?: boolean;\n  optionCustomTemplating?: string;\n  optionSelectedCustomTemplating?: string;\n  displayLabel?: boolean;\n  maxOptions?: number;\n  allowEmpty?: boolean;\n  textDanger ?:string;\n  displayRequired?: boolean;\n  popover?: string;\n  popoverRelativeClass?: string;\n  /**\n   * Add an option to select everything at once\n   * If set to a truthy string, the added option will have this value as its\n   * label. If set to true, use a generic label.\n   */\n  withSelectAll?: boolean|string;\n}>();\n\n//Emits\nconst emit = defineEmits<{\n  (e: \"onSearch\", query: string): void;\n  (e: \"selected\", data: Array<T>|T): void;\n  (e: \"onClose\", data: string): void;\n}>();\n\n//Composables\nconst { t } = useI18n();\n\n\n//Data \nconst optionSelected : Ref<T|T[]>= ref(undefined);\nconst options : Ref<Array<T>>= ref([]);\nconst remainingElements = ref(0);\nconst isLoading = ref(false);\nconst searchInput = ref(\"\");\nconst selectAll = {\n  id: 'SELECT_ALL',\n  [optionLabel]: withSelectAll && typeof withSelectAll === 'string' ? withSelectAll : t('All')\n} as unknown as T;\n\n//Computed\nconst maxOptionsSelected = computed(() => {\n  if (maxOptions !== null && multiple) {\n    return (\n      (optionSelected.value as Array<T>).length >= maxOptions\n    );\n  }\n  return false;\n});\n\n//Watch\nwatch(()=>optionChosen, () => {\n  optionSelected.value = optionChosen;\n}, {deep: true, immediate: true});\nwatch(optionSelected, () => {\n  if (noDeselect || null !== optionSelected.value) {\n    return;\n  }\n  emit(\"selected\", undefined);\n}, {deep: true});\n\n//Methods\nfunction fakeSearch(): Array<unknown> {\n  return options.value;\n}\n\nfunction onSearch(search?: string): void {\n  if (search && search.length < minSearchLength) {\n    return;\n  } else if (search) {\n    searchInput.value = search;\n  }\n  isLoading.value = true;\n  emit(\"onSearch\", search);\n}\n\nfunction onClose() {\n  emit(\"onClose\", searchInput.value);\n  searchInput.value = \"\";\n}\n\nfunction afterSearch(optionsFetched: Array<T>, count: number): void {\n  if (withSelectAll) {\n    options.value = [selectAll, ...optionsFetched];\n    count += 1;\n  } else {\n    options.value = optionsFetched;\n  }\n  remainingElements.value = Math.max(0, count - maxElement);\n  isLoading.value = false;\n}\n\nfunction onOptionSelected(newValue: Array<T>|T): void {\n  // Check if selectAll is included\n  if (withSelectAll && Array.isArray(newValue) && newValue.find(o => o.id === selectAll.id)) {\n    emit(\"selected\", options.value.slice(1));\n  } else {\n    emit(\"selected\", newValue);\n  }\n}\n\nfunction onOptionDeselect(event: T): void {\n  if (!multiple) {\n    return;\n  }\n  if (\n    !allowEmpty &&\n    0 === (optionSelected.value as Array<T>).length\n  ) {\n    (optionSelected.value as Array<T>).push(event);\n    return;\n  }\n  emit(\"selected\", (optionSelected.value as Array<T>));\n}\n\n//Expose\ndefineExpose({\n  afterSearch\n});\n</script>\n\n<style lang=\"scss\">\n@use \"vue-select/dist/vue-select.css\";\n/* stylelint-disable */\n:root {\n  --vs-dropdown-z-index: 1405;\n  --vs-border-radius: 0.2rem;\n  --vs-dropdown-option--active-bg: var(--octopus-secondary);\n  --vs-dropdown-option--active-color: black;\n  --vs-font-size: 0.8rem;\n  --vs-border-width: 2px;\n  --vs-border-color: var(--octopus-border-default);\n}\n\n.octopus-app {\n  .vs__dropdown-option {\n    white-space: initial;\n  }\n\n  .vs--searchable .vs__dropdown-toggle {\n    cursor: pointer;\n  }\n\n  .vs__dropdown-toggle {\n    padding: 0;\n    height: 100%;\n  }\n\n  .vs__search, .vs__search:focus{\n    border: var(--vs-selected-border-width) solid transparent;\n  }\n  .vs__search:focus {\n    min-width: 150px;\n  }\n\n  .multiselect-no-deselect .vs__clear {\n    display: none;\n  }\n\n  .multiselect-transparent {\n    --vs-border-color: transparent;\n  }\n\n  .multiselect-white {\n    --vs-selected-color: white;\n    --vs-selected-bg: transparent;\n    --vs-dropdown-bg: black;\n    --vs-controls-color: white;\n\n    .vs__actions path {\n      fill: white;\n    }\n  }\n\n  .multiselect-in-modal{\n    .vs__dropdown-menu{\n      position: relative !important;\n    }\n  }\n}\n/* stylelint-enable */\n</style>\n","<template>\n  <div\n    :class=\"{\n      'multiselect-in-modal': inModal,\n      'multiselect-no-deselect': noDeselect,\n      'form-margin': displayLabel,\n    }\"\n    :style=\"{ width: width, height: height }\"\n  >\n    <div class=\"d-flex align-items-center\">\n      <label :class=\"displayLabel ? '' : 'd-none'\" :for=\"id\" class=\"form-label\">{{\n        label\n      }}\n        <AsteriskIcon v-if=\"displayRequired\" :size=\"10\" class=\"ms-1 mb-2\" :title=\"t('Mandatory input')\"/>\n      </label>\n\n      <template v-if=\"popover\">\n        <button\n          :id=\"'popover' + id\"\n          :title=\"t('Help')\"\n          class=\"btn-transparent\"\n        >\n          <HelpCircleIcon :size=\"30\" />\n        </button>\n        <ClassicPopover\n          :target=\"'popover' + id\"\n          popover-class=\"popover-z-index\"\n          :relative-class=\"popoverRelativeClass\"\n        >\n          <!-- eslint-disable vue/no-v-html -->\n          <div v-html=\"popover\" />\n          <!-- eslint-enable -->\n        </ClassicPopover>\n      </template>\n    </div>\n\n    <vSelect\n      v-model=\"optionSelected\"\n      :input-id=\"id\"\n      :label=\"optionLabel\"\n      :multiple=\"multiple\"\n      :options=\"options\"\n      :disabled=\"isDisabled\"\n      :loading=\"isLoading\"\n      :placeholder=\"placeholder\"\n      :clear-search-on-blur=\"\n        () => {\n          return true;\n        }\n      \"\n      :filter=\"fakeSearch\"\n      :selectable=\"() => !maxOptionsSelected\"\n      :style=\"{height: height }\"\n      :class=\"{ 'border border-danger': textDanger?.length }\"\n      @open=\"onSearch\"\n      @search=\"onSearch\"\n      @close=\"onClose\"\n      @option:selected=\"onOptionSelected\"\n      @option:deselected=\"onOptionDeselect\"\n    >\n      \n      <template v-if=\"optionCustomTemplating.length\" #option=\"option\">\n        <slot :name=\"optionCustomTemplating\" :option=\"option\" />\n      </template>\n\n      <template v-else-if=\"withSelectAll\" #option=\"option\">\n        <strong v-if=\"option.id === selectAll.id\">\n          {{ option[optionLabel] }}\n        </strong>\n        <span v-else>\n          {{ option[optionLabel] }}\n        </span>\n      </template>\n\n      <template\n        v-if=\"optionSelectedCustomTemplating.length\"\n        #selected-option=\"option\"\n      >\n        <slot :name=\"optionSelectedCustomTemplating\" :option=\"option\" />\n      </template>\n\n      <template #selected-option-container=\"{ option, deselect, disabled, multiple: mul }\">\n        <slot name=\"selected-option-container\" v-bind=\"{ option, deselect, disabled, multiple: mul }\" />\n      </template>\n\n      <template #no-options=\"{ searching }\">\n        <span v-if=\"searching\">{{\n          t(\"No elements found. Consider changing the search query.\")\n        }}</span>\n        <span v-else>{{ t(\"List is empty\") }}</span>\n      </template>\n\n      <template #list-footer>\n        <div v-if=\"remainingElements\" class=\"vs__dropdown-option\">\n          {{\n            t(\n              \"Count more elements matched your query, please make a more specific search.\",\n              { count: remainingElements },\n            )\n          }}\n        </div>\n      </template>\n\n      <template #list-header>\n        <div v-if=\"maxOptionsSelected\" class=\"vs__dropdown-option\">\n          {{ t(\"Multiselect max options\", { max: maxOptions }) }}\n        </div>\n      </template>\n\n      <template #open-indicator=\"{ attributes }\">\n        <ChevronDownIcon v-bind=\"attributes\" />\n      </template>\n    </vSelect>\n    <div v-if=\"textDanger\" class=\"text-danger\">\n      {{ textDanger }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\" generic=\"T\">\nimport { computed, defineAsyncComponent, ref, Ref, watch } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\nimport AsteriskIcon from \"vue-material-design-icons/Asterisk.vue\";\nimport ChevronDownIcon from \"vue-material-design-icons/ChevronDown.vue\";\nimport vSelect from \"vue-select\";\nimport HelpCircleIcon from \"vue-material-design-icons/HelpCircle.vue\";\nconst ClassicPopover = defineAsyncComponent(\n  () => import(\"../misc/ClassicPopover.vue\"),\n);\n\n//Props \nconst {\n  inModal = false, multiple = false, isDisabled = false, width = \"100%\",\n  maxElement = 50, minSearchLength = 3, noDeselect = true, displayLabel = false,\n  allowEmpty = true, optionChosen, maxOptions = null,\n  optionCustomTemplating = '', optionSelectedCustomTemplating = '',\n  optionLabel,\n  withSelectAll = false\n} = defineProps<{\n  id?: string;\n  label?: string;\n  placeholder?: string;\n  optionLabel?: keyof T;\n  inModal?: boolean;\n  multiple?: boolean;\n  isDisabled?: boolean;\n  width?: string;\n  height?: string;\n  maxElement?: number;\n  minSearchLength?: number;\n  /** Currently chosen option */\n  optionChosen?: T|Array<T>;\n  noDeselect?: boolean;\n  optionCustomTemplating?: string;\n  optionSelectedCustomTemplating?: string;\n  displayLabel?: boolean;\n  maxOptions?: number;\n  allowEmpty?: boolean;\n  textDanger ?:string;\n  displayRequired?: boolean;\n  popover?: string;\n  popoverRelativeClass?: string;\n  /**\n   * Add an option to select everything at once\n   * If set to a truthy string, the added option will have this value as its\n   * label. If set to true, use a generic label.\n   */\n  withSelectAll?: boolean|string;\n}>();\n\n//Emits\nconst emit = defineEmits<{\n  (e: \"onSearch\", query: string): void;\n  (e: \"selected\", data: Array<T>|T): void;\n  (e: \"onClose\", data: string): void;\n}>();\n\n//Composables\nconst { t } = useI18n();\n\n\n//Data \nconst optionSelected : Ref<T|T[]>= ref(undefined);\nconst options : Ref<Array<T>>= ref([]);\nconst remainingElements = ref(0);\nconst isLoading = ref(false);\nconst searchInput = ref(\"\");\nconst selectAll = {\n  id: 'SELECT_ALL',\n  [optionLabel]: withSelectAll && typeof withSelectAll === 'string' ? withSelectAll : t('All')\n} as unknown as T;\n\n//Computed\nconst maxOptionsSelected = computed(() => {\n  if (maxOptions !== null && multiple) {\n    return (\n      (optionSelected.value as Array<T>).length >= maxOptions\n    );\n  }\n  return false;\n});\n\n//Watch\nwatch(()=>optionChosen, () => {\n  optionSelected.value = optionChosen;\n}, {deep: true, immediate: true});\nwatch(optionSelected, () => {\n  if (noDeselect || null !== optionSelected.value) {\n    return;\n  }\n  emit(\"selected\", undefined);\n}, {deep: true});\n\n//Methods\nfunction fakeSearch(): Array<unknown> {\n  return options.value;\n}\n\nfunction onSearch(search?: string): void {\n  if (search && search.length < minSearchLength) {\n    return;\n  } else if (search) {\n    searchInput.value = search;\n  }\n  isLoading.value = true;\n  emit(\"onSearch\", search);\n}\n\nfunction onClose() {\n  emit(\"onClose\", searchInput.value);\n  searchInput.value = \"\";\n}\n\nfunction afterSearch(optionsFetched: Array<T>, count: number): void {\n  if (withSelectAll) {\n    options.value = [selectAll, ...optionsFetched];\n    count += 1;\n  } else {\n    options.value = optionsFetched;\n  }\n  remainingElements.value = Math.max(0, count - maxElement);\n  isLoading.value = false;\n}\n\nfunction onOptionSelected(newValue: Array<T>|T): void {\n  // Check if selectAll is included\n  if (withSelectAll && Array.isArray(newValue) && newValue.find(o => o.id === selectAll.id)) {\n    emit(\"selected\", options.value.slice(1));\n  } else {\n    emit(\"selected\", newValue);\n  }\n}\n\nfunction onOptionDeselect(event: T): void {\n  if (!multiple) {\n    return;\n  }\n  if (\n    !allowEmpty &&\n    0 === (optionSelected.value as Array<T>).length\n  ) {\n    (optionSelected.value as Array<T>).push(event);\n    return;\n  }\n  emit(\"selected\", (optionSelected.value as Array<T>));\n}\n\n//Expose\ndefineExpose({\n  afterSearch\n});\n</script>\n\n<style lang=\"scss\">\n@use \"vue-select/dist/vue-select.css\";\n/* stylelint-disable */\n:root {\n  --vs-dropdown-z-index: 1405;\n  --vs-border-radius: 0.2rem;\n  --vs-dropdown-option--active-bg: var(--octopus-secondary);\n  --vs-dropdown-option--active-color: black;\n  --vs-font-size: 0.8rem;\n  --vs-border-width: 2px;\n  --vs-border-color: var(--octopus-border-default);\n}\n\n.octopus-app {\n  .vs__dropdown-option {\n    white-space: initial;\n  }\n\n  .vs--searchable .vs__dropdown-toggle {\n    cursor: pointer;\n  }\n\n  .vs__dropdown-toggle {\n    padding: 0;\n    height: 100%;\n  }\n\n  .vs__search, .vs__search:focus{\n    border: var(--vs-selected-border-width) solid transparent;\n  }\n  .vs__search:focus {\n    min-width: 150px;\n  }\n\n  .multiselect-no-deselect .vs__clear {\n    display: none;\n  }\n\n  .multiselect-transparent {\n    --vs-border-color: transparent;\n  }\n\n  .multiselect-white {\n    --vs-selected-color: white;\n    --vs-selected-bg: transparent;\n    --vs-dropdown-bg: black;\n    --vs-controls-color: white;\n\n    .vs__actions path {\n      fill: white;\n    }\n  }\n\n  .multiselect-in-modal{\n    .vs__dropdown-menu{\n      position: relative !important;\n    }\n  }\n}\n/* stylelint-enable */\n</style>\n"],"mappings":"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"}

package/dist/ClassicNav-Dvm8faD9.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClassicNav-Dvm8faD9.mjs","names":[],"sources":["../src/components/misc/ClassicNav.vue","../src/components/misc/ClassicNav.vue"],"sourcesContent":["<!--\n  Component to make a tab-based navigation\n  @deprecated Use ClassicTabs instead\n-->\n<template>\n  <ul class=\"octopus-nav\" :class=\"light ? 'light' : ''\">\n    <li\n      v-for=\"index in tabNumber\"\n      v-show=\"$slots[index - 1]\"\n      :key=\"index - 1\"\n      class=\"octopus-nav-item\"\n    >\n      <button\n        class=\"octopus-nav-link\"\n        :class=\"activeTab === index - 1 ? 'active' : ''\"\n        @click=\"emit('update:activeTab', index - 1)\"\n      >\n        <slot :name=\"index - 1\" />\n      </button>\n    </li>\n  </ul>\n  <div\n    :class=\"\n      transparent\n        ? 'd-flex flex-grow-1 classic-nav-tab-container'\n        : 'octopus-tab-content'\n    \"\n  >\n    <div\n      v-for=\"index in tabNumber\"\n      v-show=\"$slots['tab' + (index - 1)]\"\n      :key=\"index - 1\"\n      class=\"octopus-tab-pane\"\n      :class=\"{ active: activeTab === index - 1, 'flex-column': flexColumn }\"\n    >\n      <slot :name=\"'tab' + (index - 1)\" :is-active=\"activeTab === index - 1\" />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\n\n//Props \ndefineProps({\n  /** Number of tabs to display */\n  tabNumber: { default: 0, type: Number },\n  /** Currently active tab */\n  activeTab: { default: 0, type: Number },\n  /** Alternative css */\n  transparent: { default: false, type: Boolean },\n  /** Alternative css */\n  light: { default: false, type: Boolean },\n  /** Vertical content */\n  flexColumn: { default: false, type: Boolean }\n})\n\n//Emits\nconst emit = defineEmits([\"update:activeTab\"]);\n\n</script>\n\n<style lang=\"scss\">\n\n\n.octopus-app {\n  .octopus-nav {\n    display: flex;\n    flex-wrap: wrap;\n    padding-left: 0;\n    margin-bottom: 0;\n    margin-top: 0;\n    list-style: none;\n    border-bottom: 0.05rem solid var(--octopus-border-default);\n\n    &.light {\n      border: 0;\n    }\n  }\n\n  .octopus-nav-item {\n    border-right: solid 1px var(--octopus-border-default);\n    border-left: solid 1px var(--octopus-border-default);\n    border-top: solid 1px var(--octopus-border-default);\n    border-top-left-radius: 0.25rem;\n    border-top-right-radius: 0.25rem;\n    cursor: pointer;\n    display: flex;\n    flex-grow: 1;\n    text-align: center;\n  }\n\n  .octopus-tab-content {\n    border-right: solid 1px var(--octopus-border-default);\n    border-left: solid 1px var(--octopus-border-default);\n    border-bottom: solid 1px var(--octopus-border-default);\n    background-color: var(--octopus-background);\n  }\n  .octopus-nav.light  .octopus-tab-content{\n    border-top: solid 1px var(--octopus-border-default);\n  }\n\n\n  .octopus-nav.light .octopus-nav-item {\n    border: 0;\n  }\n\n  .octopus-nav-link {\n    display: block;\n    background: transparent;\n    flex-grow: 1;\n    padding: 0.5rem 1rem;\n    text-decoration: none;\n    transition:\n      color 0.15s ease-in-out,\n      background-color 0.15s ease-in-out,\n      border-color 0.15s ease-in-out;\n    border: 0.1rem solid transparent;\n\n    &:hover {\n      border-color: var(--octopus-border-default);\n      border-bottom-color: var(--octopus-primary);\n      color: var(--octopus-primary);\n    }\n\n    &.active {\n      border-color: var(--octopus-primary);\n      background: var(--octopus-primary);\n      color: white;\n    }\n  }\n\n  .octopus-nav.light .octopus-nav-link {\n    font-weight: bold;\n    background:var(--octopus-border-default);\n    &.active{\n      border-bottom-color: var(--octopus-primary);\n      background: transparent;\n      color: var(--octopus-primary);\n    }\n  }\n\n\n  .octopus-tab-pane {\n    display: none;\n\n    &.active {\n      display: flex;\n      justify-content: space-between;\n      padding: 0.5rem;\n      flex-grow: 1;\n      @media (width <= 550px) {\n        padding:0;\n      }\n    }\n  }\n}\n</style>\n","<!--\n  Component to make a tab-based navigation\n  @deprecated Use ClassicTabs instead\n-->\n<template>\n  <ul class=\"octopus-nav\" :class=\"light ? 'light' : ''\">\n    <li\n      v-for=\"index in tabNumber\"\n      v-show=\"$slots[index - 1]\"\n      :key=\"index - 1\"\n      class=\"octopus-nav-item\"\n    >\n      <button\n        class=\"octopus-nav-link\"\n        :class=\"activeTab === index - 1 ? 'active' : ''\"\n        @click=\"emit('update:activeTab', index - 1)\"\n      >\n        <slot :name=\"index - 1\" />\n      </button>\n    </li>\n  </ul>\n  <div\n    :class=\"\n      transparent\n        ? 'd-flex flex-grow-1 classic-nav-tab-container'\n        : 'octopus-tab-content'\n    \"\n  >\n    <div\n      v-for=\"index in tabNumber\"\n      v-show=\"$slots['tab' + (index - 1)]\"\n      :key=\"index - 1\"\n      class=\"octopus-tab-pane\"\n      :class=\"{ active: activeTab === index - 1, 'flex-column': flexColumn }\"\n    >\n      <slot :name=\"'tab' + (index - 1)\" :is-active=\"activeTab === index - 1\" />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\n\n//Props \ndefineProps({\n  /** Number of tabs to display */\n  tabNumber: { default: 0, type: Number },\n  /** Currently active tab */\n  activeTab: { default: 0, type: Number },\n  /** Alternative css */\n  transparent: { default: false, type: Boolean },\n  /** Alternative css */\n  light: { default: false, type: Boolean },\n  /** Vertical content */\n  flexColumn: { default: false, type: Boolean }\n})\n\n//Emits\nconst emit = defineEmits([\"update:activeTab\"]);\n\n</script>\n\n<style lang=\"scss\">\n\n\n.octopus-app {\n  .octopus-nav {\n    display: flex;\n    flex-wrap: wrap;\n    padding-left: 0;\n    margin-bottom: 0;\n    margin-top: 0;\n    list-style: none;\n    border-bottom: 0.05rem solid var(--octopus-border-default);\n\n    &.light {\n      border: 0;\n    }\n  }\n\n  .octopus-nav-item {\n    border-right: solid 1px var(--octopus-border-default);\n    border-left: solid 1px var(--octopus-border-default);\n    border-top: solid 1px var(--octopus-border-default);\n    border-top-left-radius: 0.25rem;\n    border-top-right-radius: 0.25rem;\n    cursor: pointer;\n    display: flex;\n    flex-grow: 1;\n    text-align: center;\n  }\n\n  .octopus-tab-content {\n    border-right: solid 1px var(--octopus-border-default);\n    border-left: solid 1px var(--octopus-border-default);\n    border-bottom: solid 1px var(--octopus-border-default);\n    background-color: var(--octopus-background);\n  }\n  .octopus-nav.light  .octopus-tab-content{\n    border-top: solid 1px var(--octopus-border-default);\n  }\n\n\n  .octopus-nav.light .octopus-nav-item {\n    border: 0;\n  }\n\n  .octopus-nav-link {\n    display: block;\n    background: transparent;\n    flex-grow: 1;\n    padding: 0.5rem 1rem;\n    text-decoration: none;\n    transition:\n      color 0.15s ease-in-out,\n      background-color 0.15s ease-in-out,\n      border-color 0.15s ease-in-out;\n    border: 0.1rem solid transparent;\n\n    &:hover {\n      border-color: var(--octopus-border-default);\n      border-bottom-color: var(--octopus-primary);\n      color: var(--octopus-primary);\n    }\n\n    &.active {\n      border-color: var(--octopus-primary);\n      background: var(--octopus-primary);\n      color: white;\n    }\n  }\n\n  .octopus-nav.light .octopus-nav-link {\n    font-weight: bold;\n    background:var(--octopus-border-default);\n    &.active{\n      border-bottom-color: var(--octopus-primary);\n      background: transparent;\n      color: var(--octopus-primary);\n    }\n  }\n\n\n  .octopus-tab-pane {\n    display: none;\n\n    &.active {\n      display: flex;\n      justify-content: space-between;\n      padding: 0.5rem;\n      flex-grow: 1;\n      @media (width <= 550px) {\n        padding:0;\n      }\n    }\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yDCKE,mBAeK,MAAA,EAfD,OAAK,eAAA,CAAC,eAAsB,OAAA,QAAK,UAAA,EAAA,CAAA,EAAA,GAAA,EAAA,UAAA,IAAA,GACnC,mBAaK,UAAA,MAAA,WAZa,OAAA,YAAT,UAAK;sCADd,mBAaK,MAAA;GAVF,KAAK,QAAK;GACX,OAAM;MAEN,mBAMS,UAAA;GALP,OAAK,eAAA,CAAC,oBACE,OAAA,cAAc,QAAK,IAAA,WAAA,EAAA,CAAA;GAC1B,UAAK,WAAE,OAAA,KAAI,oBAAqB,QAAK,CAAA;MAEtC,WAA0B,KAAA,QAAb,QAAK,CAAA,CAAA,GAAA,IAAA,UAAA,CAAA,CAAA,IAAA,CAAA,CAAA,OATZ,KAAA,OAAO,QAAK,EAAA,CAAA,CAAA;iBAaxB,mBAgBM,OAAA,EAfH,OAAK,eAAS,OAAA,cAAA,iDAAA,qBAAA,EAAA,GAAA,EAAA,UAAA,IAAA,GAMf,mBAQM,UAAA,MAAA,WAPY,OAAA,YAAT,UAAK;sCADd,mBAQM,OAAA;GALH,KAAK,QAAK;GACX,OAAK,eAAA,CAAC,oBAAkB;IAAA,QACN,OAAA,cAAc,QAAK;IAAA,eAAqB,OAAA;GAAU,CAAA,CAAA;MAEpE,WAAyE,KAAA,QAAA,SAAnD,QAAK,IAAA,EAAQ,UAAW,OAAA,cAAc,QAAK,EAAA,CAAA,CAAA,GAAA,CAAA,IAAA,CAAA,CAAA,OALzD,KAAA,OAAM,SAAU,QAAK,GAAA,CAAA,CAAA"}

package/dist/ClassicNav-P2h4OFEY.mjs

@@ -0,0 +1,65 @@
+import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.mjs";
+import { Fragment, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, renderList, renderSlot, vShow, withDirectives } from "vue";
+//#region src/components/misc/ClassicNav.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["onClick"];
+var ClassicNav_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "ClassicNav",
+	props: {
+		/** Number of tabs to display */
+		tabNumber: {
+			default: 0,
+			type: Number
+		},
+		/** Currently active tab */
+		activeTab: {
+			default: 0,
+			type: Number
+		},
+		/** Alternative css */
+		transparent: {
+			default: false,
+			type: Boolean
+		},
+		/** Alternative css */
+		light: {
+			default: false,
+			type: Boolean
+		},
+		/** Vertical content */
+		flexColumn: {
+			default: false,
+			type: Boolean
+		}
+	},
+	emits: ["update:activeTab"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [createElementVNode("ul", { class: normalizeClass(["octopus-nav", __props.light ? "light" : ""]) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.tabNumber, (index) => {
+				return withDirectives((openBlock(), createElementBlock("li", {
+					key: index - 1,
+					class: "octopus-nav-item"
+				}, [createElementVNode("button", {
+					class: normalizeClass(["octopus-nav-link", __props.activeTab === index - 1 ? "active" : ""]),
+					onClick: ($event) => emit("update:activeTab", index - 1)
+				}, [renderSlot(_ctx.$slots, index - 1)], 10, _hoisted_1)])), [[vShow, _ctx.$slots[index - 1]]]);
+			}), 128))], 2), createElementVNode("div", { class: normalizeClass(__props.transparent ? "d-flex flex-grow-1 classic-nav-tab-container" : "octopus-tab-content") }, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.tabNumber, (index) => {
+				return withDirectives((openBlock(), createElementBlock("div", {
+					key: index - 1,
+					class: normalizeClass(["octopus-tab-pane", {
+						active: __props.activeTab === index - 1,
+						"flex-column": __props.flexColumn
+					}])
+				}, [renderSlot(_ctx.$slots, "tab" + (index - 1), { isActive: __props.activeTab === index - 1 })], 2)), [[vShow, _ctx.$slots["tab" + (index - 1)]]]);
+			}), 128))], 2)], 64);
+		};
+	}
+});
+//#endregion
+//#region src/components/misc/ClassicNav.vue
+var ClassicNav_exports = /* @__PURE__ */ __exportAll({ default: () => ClassicNav_default });
+var ClassicNav_default = ClassicNav_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ClassicNav_exports as n, ClassicNav_default as t };
+
+//# sourceMappingURL=ClassicNav-P2h4OFEY.mjs.map

package/dist/ClassicNav-P2h4OFEY.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClassicNav-P2h4OFEY.mjs","names":["$slots"],"sources":["../src/components/misc/ClassicNav.vue","../src/components/misc/ClassicNav.vue"],"sourcesContent":["<!--\n  Component to make a tab-based navigation\n  @deprecated Use ClassicTabs instead\n-->\n<template>\n  <ul class=\"octopus-nav\" :class=\"light ? 'light' : ''\">\n    <li\n      v-for=\"index in tabNumber\"\n      v-show=\"$slots[index - 1]\"\n      :key=\"index - 1\"\n      class=\"octopus-nav-item\"\n    >\n      <button\n        class=\"octopus-nav-link\"\n        :class=\"activeTab === index - 1 ? 'active' : ''\"\n        @click=\"emit('update:activeTab', index - 1)\"\n      >\n        <slot :name=\"index - 1\" />\n      </button>\n    </li>\n  </ul>\n  <div\n    :class=\"\n      transparent\n        ? 'd-flex flex-grow-1 classic-nav-tab-container'\n        : 'octopus-tab-content'\n    \"\n  >\n    <div\n      v-for=\"index in tabNumber\"\n      v-show=\"$slots['tab' + (index - 1)]\"\n      :key=\"index - 1\"\n      class=\"octopus-tab-pane\"\n      :class=\"{ active: activeTab === index - 1, 'flex-column': flexColumn }\"\n    >\n      <slot :name=\"'tab' + (index - 1)\" :is-active=\"activeTab === index - 1\" />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\n\n//Props \ndefineProps({\n  /** Number of tabs to display */\n  tabNumber: { default: 0, type: Number },\n  /** Currently active tab */\n  activeTab: { default: 0, type: Number },\n  /** Alternative css */\n  transparent: { default: false, type: Boolean },\n  /** Alternative css */\n  light: { default: false, type: Boolean },\n  /** Vertical content */\n  flexColumn: { default: false, type: Boolean }\n})\n\n//Emits\nconst emit = defineEmits([\"update:activeTab\"]);\n\n</script>\n\n<style lang=\"scss\">\n\n\n.octopus-app {\n  .octopus-nav {\n    display: flex;\n    flex-wrap: wrap;\n    padding-left: 0;\n    margin-bottom: 0;\n    margin-top: 0;\n    list-style: none;\n    border-bottom: 0.05rem solid var(--octopus-border-default);\n\n    &.light {\n      border: 0;\n    }\n  }\n\n  .octopus-nav-item {\n    border-right: solid 1px var(--octopus-border-default);\n    border-left: solid 1px var(--octopus-border-default);\n    border-top: solid 1px var(--octopus-border-default);\n    border-top-left-radius: 0.25rem;\n    border-top-right-radius: 0.25rem;\n    cursor: pointer;\n    display: flex;\n    flex-grow: 1;\n    text-align: center;\n  }\n\n  .octopus-tab-content {\n    border-right: solid 1px var(--octopus-border-default);\n    border-left: solid 1px var(--octopus-border-default);\n    border-bottom: solid 1px var(--octopus-border-default);\n    background-color: var(--octopus-background);\n  }\n  .octopus-nav.light  .octopus-tab-content{\n    border-top: solid 1px var(--octopus-border-default);\n  }\n\n\n  .octopus-nav.light .octopus-nav-item {\n    border: 0;\n  }\n\n  .octopus-nav-link {\n    display: block;\n    background: transparent;\n    flex-grow: 1;\n    padding: 0.5rem 1rem;\n    text-decoration: none;\n    transition:\n      color 0.15s ease-in-out,\n      background-color 0.15s ease-in-out,\n      border-color 0.15s ease-in-out;\n    border: 0.1rem solid transparent;\n\n    &:hover {\n      border-color: var(--octopus-border-default);\n      border-bottom-color: var(--octopus-primary);\n      color: var(--octopus-primary);\n    }\n\n    &.active {\n      border-color: var(--octopus-primary);\n      background: var(--octopus-primary);\n      color: white;\n    }\n  }\n\n  .octopus-nav.light .octopus-nav-link {\n    font-weight: bold;\n    background:var(--octopus-border-default);\n    &.active{\n      border-bottom-color: var(--octopus-primary);\n      background: transparent;\n      color: var(--octopus-primary);\n    }\n  }\n\n\n  .octopus-tab-pane {\n    display: none;\n\n    &.active {\n      display: flex;\n      justify-content: space-between;\n      padding: 0.5rem;\n      flex-grow: 1;\n      @media (width <= 550px) {\n        padding:0;\n      }\n    }\n  }\n}\n</style>\n","<!--\n  Component to make a tab-based navigation\n  @deprecated Use ClassicTabs instead\n-->\n<template>\n  <ul class=\"octopus-nav\" :class=\"light ? 'light' : ''\">\n    <li\n      v-for=\"index in tabNumber\"\n      v-show=\"$slots[index - 1]\"\n      :key=\"index - 1\"\n      class=\"octopus-nav-item\"\n    >\n      <button\n        class=\"octopus-nav-link\"\n        :class=\"activeTab === index - 1 ? 'active' : ''\"\n        @click=\"emit('update:activeTab', index - 1)\"\n      >\n        <slot :name=\"index - 1\" />\n      </button>\n    </li>\n  </ul>\n  <div\n    :class=\"\n      transparent\n        ? 'd-flex flex-grow-1 classic-nav-tab-container'\n        : 'octopus-tab-content'\n    \"\n  >\n    <div\n      v-for=\"index in tabNumber\"\n      v-show=\"$slots['tab' + (index - 1)]\"\n      :key=\"index - 1\"\n      class=\"octopus-tab-pane\"\n      :class=\"{ active: activeTab === index - 1, 'flex-column': flexColumn }\"\n    >\n      <slot :name=\"'tab' + (index - 1)\" :is-active=\"activeTab === index - 1\" />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\n\n//Props \ndefineProps({\n  /** Number of tabs to display */\n  tabNumber: { default: 0, type: Number },\n  /** Currently active tab */\n  activeTab: { default: 0, type: Number },\n  /** Alternative css */\n  transparent: { default: false, type: Boolean },\n  /** Alternative css */\n  light: { default: false, type: Boolean },\n  /** Vertical content */\n  flexColumn: { default: false, type: Boolean }\n})\n\n//Emits\nconst emit = defineEmits([\"update:activeTab\"]);\n\n</script>\n\n<style lang=\"scss\">\n\n\n.octopus-app {\n  .octopus-nav {\n    display: flex;\n    flex-wrap: wrap;\n    padding-left: 0;\n    margin-bottom: 0;\n    margin-top: 0;\n    list-style: none;\n    border-bottom: 0.05rem solid var(--octopus-border-default);\n\n    &.light {\n      border: 0;\n    }\n  }\n\n  .octopus-nav-item {\n    border-right: solid 1px var(--octopus-border-default);\n    border-left: solid 1px var(--octopus-border-default);\n    border-top: solid 1px var(--octopus-border-default);\n    border-top-left-radius: 0.25rem;\n    border-top-right-radius: 0.25rem;\n    cursor: pointer;\n    display: flex;\n    flex-grow: 1;\n    text-align: center;\n  }\n\n  .octopus-tab-content {\n    border-right: solid 1px var(--octopus-border-default);\n    border-left: solid 1px var(--octopus-border-default);\n    border-bottom: solid 1px var(--octopus-border-default);\n    background-color: var(--octopus-background);\n  }\n  .octopus-nav.light  .octopus-tab-content{\n    border-top: solid 1px var(--octopus-border-default);\n  }\n\n\n  .octopus-nav.light .octopus-nav-item {\n    border: 0;\n  }\n\n  .octopus-nav-link {\n    display: block;\n    background: transparent;\n    flex-grow: 1;\n    padding: 0.5rem 1rem;\n    text-decoration: none;\n    transition:\n      color 0.15s ease-in-out,\n      background-color 0.15s ease-in-out,\n      border-color 0.15s ease-in-out;\n    border: 0.1rem solid transparent;\n\n    &:hover {\n      border-color: var(--octopus-border-default);\n      border-bottom-color: var(--octopus-primary);\n      color: var(--octopus-primary);\n    }\n\n    &.active {\n      border-color: var(--octopus-primary);\n      background: var(--octopus-primary);\n      color: white;\n    }\n  }\n\n  .octopus-nav.light .octopus-nav-link {\n    font-weight: bold;\n    background:var(--octopus-border-default);\n    &.active{\n      border-bottom-color: var(--octopus-primary);\n      background: transparent;\n      color: var(--octopus-primary);\n    }\n  }\n\n\n  .octopus-tab-pane {\n    display: none;\n\n    &.active {\n      display: flex;\n      justify-content: space-between;\n      padding: 0.5rem;\n      flex-grow: 1;\n      @media (width <= 550px) {\n        padding:0;\n      }\n    }\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyDA,MAAM,OAAO;;2DApDX,mBAeK,MAAA,EAfD,OAAK,eAAA,CAAC,eAAsB,QAAA,QAAK,UAAA,EAAA,CAAA,EAAA,GAAA,EAAA,UAAA,IAAA,GACnC,mBAaK,UAAA,MAAA,WAZa,QAAA,YAAT,UAAK;wCADd,mBAaK,MAAA;KAVF,KAAK,QAAK;KACX,OAAM;QAEN,mBAMS,UAAA;KALP,OAAK,eAAA,CAAC,oBACE,QAAA,cAAc,QAAK,IAAA,WAAA,EAAA,CAAA;KAC1B,UAAK,WAAE,KAAI,oBAAqB,QAAK,CAAA;QAEtC,WAA0B,KAAA,QAAb,QAAK,CAAA,CAAA,GAAA,IAAA,UAAA,CAAA,CAAA,IAAA,CAAA,CAAA,OATZA,KAAAA,OAAO,QAAK,EAAA,CAAA,CAAA;mBAaxB,mBAgBM,OAAA,EAfH,OAAK,eAAS,QAAA,cAAA,iDAAA,qBAAA,EAAA,GAAA,EAAA,UAAA,IAAA,GAMf,mBAQM,UAAA,MAAA,WAPY,QAAA,YAAT,UAAK;wCADd,mBAQM,OAAA;KALH,KAAK,QAAK;KACX,OAAK,eAAA,CAAC,oBAAkB;MAAA,QACN,QAAA,cAAc,QAAK;MAAA,eAAqB,QAAA;KAAU,CAAA,CAAA;QAEpE,WAAyE,KAAA,QAAA,SAAnD,QAAK,IAAA,EAAQ,UAAW,QAAA,cAAc,QAAK,EAAA,CAAA,CAAA,GAAA,CAAA,IAAA,CAAA,CAAA,OALzDA,KAAAA,OAAM,SAAU,QAAK,GAAA,CAAA,CAAA"}

package/dist/ClassicPopover-BIyLKorz.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClassicPopover-BIyLKorz.mjs","names":[],"sources":["../src/components/misc/ClassicPopover.vue","../src/components/misc/ClassicPopover.vue"],"sourcesContent":["<template>\n  <Teleport to=\"#app\">\n    <div\n      v-show=\"displayPopover\"\n      :id=\"'popover' + target\"\n      ref=\"popover\"\n      popover\n      tabindex=\"0\"\n      class=\"octopus-popover border position-fixed\"\n      :class=\"[\n        displayPopover ? 'd-block': '',\n        onlyClick ? 'octopus-dropdown' : '',\n        popoverClass]\"\n      :style=\"positionInlineStyle\"\n      @mouseenter=\"overPopover = true\"\n      @mouseleave=\"\n        overPopover = false;\n        clearData();\n      \"\n    >\n      <div v-if=\"title\" class=\"bg-secondary-light p-2\">\n        {{ title }}\n      </div>\n      <div class=\"p-2\">\n        <slot>{{ content }}</slot>\n      </div>\n    </div>\n  </Teleport>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, onMounted, onUnmounted, Ref, ref, useTemplateRef, watch } from 'vue';\nimport { useRouter } from 'vue-router';\n\n//Props \nconst props = defineProps({\n  content: { type: String, default: \"\" },\n  title: { type: String, default: \"\" },\n  target: { type: String, required: true },\n  disable: { type: Boolean, default: false },\n  onlyClick: { type: Boolean, default: false },\n  onlyMouse: { type: Boolean, default: false },\n  isFixed: { type: Boolean, default: false },\n  /** @deprecated No longer needed. The popover is teleported to body and always uses position:fixed. */\n  relativeClass: { type: String, default: undefined },\n  leftPos: { type: Boolean, default: false },\n  topPos: { type: Boolean, default: false },\n  popoverClass: { type: String, default: undefined },\n  isTopLayer: { type: Boolean, default: false },\n  /** @deprecated No longer needed. If set to true, max height of popover will not overflow from parent */\n  constrainHeight: { type: Boolean, default: true },\n  /** Force z-index */\n  zIndex: { type: Number, default: undefined }\n})\n\n//Emits\nconst emit = defineEmits([\"updateVisibility\"]);\n\n\n//Data\nconst show = ref(false);\nconst isClick = ref(false);\nconst openedByHover = ref(false);\nconst posX = ref(0);\nconst posY = ref(0);\nconst targetElement: Ref<HTMLElement | null> = ref(null);\nconst overPopover = ref(false);\nconst isTabAction = ref(false);\nconst maxHeight = ref('80dvh');\nconst clearTimeout: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\nconst popoverRef = useTemplateRef('popover');\n\n\n//Composables\nconst router = useRouter();\n\n//Computed\nconst popoverId = computed(() => \"popover\" + props.target);\nconst positionInlineStyle = computed(() => ({\n  left: `${posX.value}px`,\n  top: `${posY.value}px`,\n  'max-height': maxHeight.value,\n  'z-index': props.zIndex ?? 10\n}));\nconst displayPopover = computed(() => show.value && !props.disable);\nconst isTopLayerPopover = computed(() => (props.isTopLayer || \"octopus-modal\"===props.relativeClass) && Object.hasOwn(HTMLElement.prototype, \"popover\"));\n\n\n//Watch\nwatch(displayPopover, async () => {\n  if(!isTopLayerPopover.value){return;}\n  if(displayPopover.value){\n    (popoverRef.value as HTMLElement).showPopover();\n  }else{\n    (popoverRef.value as HTMLElement).hidePopover();\n  }\n});\nwatch(show, async () => {\n  emit(\"updateVisibility\", show.value);\n  if (show.value) {\n    window.addEventListener(\"keyup\", addAccessibilityControl);\n  } else {\n    window.removeEventListener(\"keyup\", addAccessibilityControl);\n  }\n});\nwatch(isClick, async () => {\n  // Only add global click listener if opened by click (not hover)\n  if (isClick.value && !openedByHover.value) {\n    window.addEventListener(\"click\", handleOutsideClick, true);\n  } else {\n    window.removeEventListener(\"click\", handleOutsideClick, true);\n  }\n});\n\nonMounted(()=>init())\n\nonUnmounted(()=>removeListeners())\n\n\n//Methods\nfunction handleOutsideClick(event: MouseEvent): void {\n  const target = event.target as HTMLElement;\n  const popover = popoverRef?.value as HTMLElement;\n  const targetEl = targetElement.value;\n\n  // Check if click is outside both the popover and the target element\n  if (\n    popover &&\n    !popover.contains(target) &&\n    targetEl &&\n    !targetEl.contains(target)\n  ) {\n    clearClick();\n  }\n}\nfunction addAccessibilityControl(event: KeyboardEvent): void {\n  if (!event || null === event) {\n    return;\n  }\n  if (\"Tab\" !== event.key) {\n    return;\n  }\n  const myElement = event.target as HTMLElement;\n  const parent = popoverRef?.value as HTMLElement;\n  if (parent?.contains(myElement)) {\n    isTabAction.value = true;\n  } else {\n    clearClick();\n  }\n}\nfunction init() {\n  targetElement.value = document.getElementById(props.target);\n  if (targetElement.value) {\n    if (!props.onlyClick) {\n      targetElement.value.addEventListener( \"mouseenter\",setPopoverData);\n      targetElement.value.addEventListener(\"mouseleave\",clearDataTimeout);\n    }\n    if (!props.onlyMouse) {\n      targetElement.value.addEventListener(\"click\", setPopoverData);\n    }\n    targetElement.value.addEventListener(\"focusout\", clearDataBlur);\n  }\n}\nfunction removeListeners() {\n  if (targetElement.value) {\n    if (!props.onlyClick) {\n      targetElement.value.removeEventListener(\"mouseenter\",setPopoverData,);\n      targetElement.value.removeEventListener(\"mouseleave\",clearDataTimeout,);\n    }\n    if (!props.onlyMouse) {\n      targetElement.value.removeEventListener(\"click\", setPopoverData);\n    }\n    targetElement.value.removeEventListener(\"focusout\", clearDataBlur);\n  }\n}\nfunction handleClickEvent(e: MouseEvent | PointerEvent){\n  if (show.value && isClick.value && e.target !== popoverRef.value && !popoverRef.value?.contains(e.target)) {\n    isClick.value = false;\n    clearData();\n    return -1;\n  }\n  if (show.value && isTopLayerPopover.value) {\n    const popover = popoverRef?.value as HTMLElement;\n    popover.showPopover();\n    isClick.value = true;\n    return -1;\n  }\n  isClick.value = true;\n  return 0;\n}\nfunction handleLeftPos(rectElement: DOMRect, parentLeft: number, sizeAvailable: number, sizePopover: number){\n  const elementRightRelative = rectElement.right - parentLeft;\n  const hasPlaceRightButton = (sizeAvailable - (sizeAvailable - elementRightRelative)) > sizePopover;\n  if(hasPlaceRightButton){\n    posX.value =\n    rectElement.right -\n    parentLeft -\n    sizePopover;\n  }else{\n    posX.value =parentLeft;\n  }\n}\nfunction handleRightPos(rectElement: DOMRect, parentLeft: number, sizeAvailable: number, sizePopover: number){\n  const elementLeftRelative = rectElement.left - parentLeft;\n  const hasPlaceRightButton = (sizeAvailable - elementLeftRelative) > sizePopover;\n  if(hasPlaceRightButton){\n    posX.value = elementLeftRelative;\n  }else{\n    posX.value = sizeAvailable - sizePopover + parentLeft;\n  }\n}\nfunction setPopoverData(e: MouseEvent | PointerEvent) {\n  clearInterval(clearTimeout.value as unknown as number);\n  if (props.disable || !e || !e.target) {\n    return;\n  }\n  if (\"click\" === e.type && -1 === handleClickEvent(e)) {\n    return;\n  }\n  // Track if opened by hover (mouseenter) vs click\n  if (e.type === \"mouseenter\") {\n    openedByHover.value = true;\n  }\n  show.value = true;\n  const popover = popoverRef?.value as HTMLElement;\n  // The popover is teleported to <body> and uses position:fixed, so\n  // getBoundingClientRect() coordinates map directly to viewport coordinates.\n  const rectElement = (e.target as HTMLElement).getBoundingClientRect();\n  popover.style.display = \"block\";\n  const sizePopover = popover.clientWidth;\n  if (props.leftPos) {\n    handleLeftPos(rectElement, 0, window.innerWidth, sizePopover);\n  } else {\n    handleRightPos(rectElement, 0, window.innerWidth, sizePopover);\n  }\n  posX.value = Math.max(0, posX.value);\n  const yPosParent = props.topPos ? rectElement.top : rectElement.bottom;\n  const yGap = props.topPos\n    ? -5 - popover.clientHeight\n    : 5;\n  posY.value = Math.max(0, yPosParent + yGap);\n  maxHeight.value = (window.innerHeight - posY.value) + \"px\";\n}\n\nfunction clearDataBlur(e: FocusEvent) {\n  if (isTabAction.value) {\n    isTabAction.value = false;\n    return;\n  }\n  //Exception timepicker in popover\n  const result = Array.from(e?.target?.classList ?? []).findIndex((val) => { return val.startsWith(\"dp__\");});\n  if (-1!==result) {\n    return;\n  }\n\n  const parent = popoverRef?.value as HTMLElement;\n  if (!e.relatedTarget) {\n    if (parent !== null && parent.contains(e.target)) {\n      return;\n    }\n    return clearClick();\n  }\n  const myElement = e.relatedTarget as HTMLElement;\n  if (popoverId.value === myElement.id) {\n    return;\n  }\n  if (null === parent || !parent.contains(myElement)) {\n    return clearClick();\n  }\n  if (\n    null === myElement.classList ||\n    !myElement.classList.contains(\"octopus-dropdown-item\")\n  ) {\n    return;\n  }\n  if (!(myElement as HTMLAnchorElement).href) {\n    return clearClick();\n  }\n  if (myElement.classList.contains(\"realLink\")) {\n    myElement.click();\n  } else {\n    router.push((myElement as HTMLAnchorElement).pathname);\n  }\n  nextTick(() => {\n    isClick.value = false;\n    clearData();\n  });\n}\nfunction clearClick() {\n  isClick.value = false;\n  clearData();\n}\nfunction clearDataTimeout() {\n  clearTimeout.value = setTimeout(() => {\n    if (!overPopover.value) {\n      clearData();\n    }\n    clearTimeout.value=undefined;\n  }, 500);\n}\nfunction clearData() {\n  // Allow closing if opened by hover, even if clicked afterwards\n  if (isClick.value && !openedByHover.value) {\n    return;\n  }\n  show.value = false;\n  posX.value = 0;\n  posY.value = 0;\n  openedByHover.value = false;\n}\n\n//Expose\ndefineExpose({\n  clearClick\n});\n</script>\n\n<style lang=\"scss\">\n.octopus-popover {\n  background: var(--octopus-background);\n  border-radius: var(--octopus-border-radius);\n  overflow: auto;\n  margin: 0 !important;\n  z-index: 10;\n\n  &.popover-z-index {\n    z-index: 9999;\n  }\n\n  &.octopus-dropdown {\n    min-width: 200px;\n\n    .octopus-dropdown-item {\n      display: flex;\n      justify-content: center;\n      color: var(--octopus-color-text);\n      width: 100%;\n      padding: 0.25rem 1rem;\n      font-weight: 400;\n      text-decoration: none;\n      white-space: nowrap;\n      background-color: transparent;\n      border: 0;\n\n      &:disabled {\n        background: var(--octopus-secondary-darker);\n      }\n\n      &:is(:hover, :focus){\n        background: var(--octopus-secondary-lighter);\n      }\n    }\n\n    hr {\n      margin: 0.5rem 0;\n      overflow: hidden;\n      border-top: 1px solid var(--octopus-border-default);\n      opacity: 1;\n    }\n  }\n}\n</style>\n","<template>\n  <Teleport to=\"#app\">\n    <div\n      v-show=\"displayPopover\"\n      :id=\"'popover' + target\"\n      ref=\"popover\"\n      popover\n      tabindex=\"0\"\n      class=\"octopus-popover border position-fixed\"\n      :class=\"[\n        displayPopover ? 'd-block': '',\n        onlyClick ? 'octopus-dropdown' : '',\n        popoverClass]\"\n      :style=\"positionInlineStyle\"\n      @mouseenter=\"overPopover = true\"\n      @mouseleave=\"\n        overPopover = false;\n        clearData();\n      \"\n    >\n      <div v-if=\"title\" class=\"bg-secondary-light p-2\">\n        {{ title }}\n      </div>\n      <div class=\"p-2\">\n        <slot>{{ content }}</slot>\n      </div>\n    </div>\n  </Teleport>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, onMounted, onUnmounted, Ref, ref, useTemplateRef, watch } from 'vue';\nimport { useRouter } from 'vue-router';\n\n//Props \nconst props = defineProps({\n  content: { type: String, default: \"\" },\n  title: { type: String, default: \"\" },\n  target: { type: String, required: true },\n  disable: { type: Boolean, default: false },\n  onlyClick: { type: Boolean, default: false },\n  onlyMouse: { type: Boolean, default: false },\n  isFixed: { type: Boolean, default: false },\n  /** @deprecated No longer needed. The popover is teleported to body and always uses position:fixed. */\n  relativeClass: { type: String, default: undefined },\n  leftPos: { type: Boolean, default: false },\n  topPos: { type: Boolean, default: false },\n  popoverClass: { type: String, default: undefined },\n  isTopLayer: { type: Boolean, default: false },\n  /** @deprecated No longer needed. If set to true, max height of popover will not overflow from parent */\n  constrainHeight: { type: Boolean, default: true },\n  /** Force z-index */\n  zIndex: { type: Number, default: undefined }\n})\n\n//Emits\nconst emit = defineEmits([\"updateVisibility\"]);\n\n\n//Data\nconst show = ref(false);\nconst isClick = ref(false);\nconst openedByHover = ref(false);\nconst posX = ref(0);\nconst posY = ref(0);\nconst targetElement: Ref<HTMLElement | null> = ref(null);\nconst overPopover = ref(false);\nconst isTabAction = ref(false);\nconst maxHeight = ref('80dvh');\nconst clearTimeout: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\nconst popoverRef = useTemplateRef('popover');\n\n\n//Composables\nconst router = useRouter();\n\n//Computed\nconst popoverId = computed(() => \"popover\" + props.target);\nconst positionInlineStyle = computed(() => ({\n  left: `${posX.value}px`,\n  top: `${posY.value}px`,\n  'max-height': maxHeight.value,\n  'z-index': props.zIndex ?? 10\n}));\nconst displayPopover = computed(() => show.value && !props.disable);\nconst isTopLayerPopover = computed(() => (props.isTopLayer || \"octopus-modal\"===props.relativeClass) && Object.hasOwn(HTMLElement.prototype, \"popover\"));\n\n\n//Watch\nwatch(displayPopover, async () => {\n  if(!isTopLayerPopover.value){return;}\n  if(displayPopover.value){\n    (popoverRef.value as HTMLElement).showPopover();\n  }else{\n    (popoverRef.value as HTMLElement).hidePopover();\n  }\n});\nwatch(show, async () => {\n  emit(\"updateVisibility\", show.value);\n  if (show.value) {\n    window.addEventListener(\"keyup\", addAccessibilityControl);\n  } else {\n    window.removeEventListener(\"keyup\", addAccessibilityControl);\n  }\n});\nwatch(isClick, async () => {\n  // Only add global click listener if opened by click (not hover)\n  if (isClick.value && !openedByHover.value) {\n    window.addEventListener(\"click\", handleOutsideClick, true);\n  } else {\n    window.removeEventListener(\"click\", handleOutsideClick, true);\n  }\n});\n\nonMounted(()=>init())\n\nonUnmounted(()=>removeListeners())\n\n\n//Methods\nfunction handleOutsideClick(event: MouseEvent): void {\n  const target = event.target as HTMLElement;\n  const popover = popoverRef?.value as HTMLElement;\n  const targetEl = targetElement.value;\n\n  // Check if click is outside both the popover and the target element\n  if (\n    popover &&\n    !popover.contains(target) &&\n    targetEl &&\n    !targetEl.contains(target)\n  ) {\n    clearClick();\n  }\n}\nfunction addAccessibilityControl(event: KeyboardEvent): void {\n  if (!event || null === event) {\n    return;\n  }\n  if (\"Tab\" !== event.key) {\n    return;\n  }\n  const myElement = event.target as HTMLElement;\n  const parent = popoverRef?.value as HTMLElement;\n  if (parent?.contains(myElement)) {\n    isTabAction.value = true;\n  } else {\n    clearClick();\n  }\n}\nfunction init() {\n  targetElement.value = document.getElementById(props.target);\n  if (targetElement.value) {\n    if (!props.onlyClick) {\n      targetElement.value.addEventListener( \"mouseenter\",setPopoverData);\n      targetElement.value.addEventListener(\"mouseleave\",clearDataTimeout);\n    }\n    if (!props.onlyMouse) {\n      targetElement.value.addEventListener(\"click\", setPopoverData);\n    }\n    targetElement.value.addEventListener(\"focusout\", clearDataBlur);\n  }\n}\nfunction removeListeners() {\n  if (targetElement.value) {\n    if (!props.onlyClick) {\n      targetElement.value.removeEventListener(\"mouseenter\",setPopoverData,);\n      targetElement.value.removeEventListener(\"mouseleave\",clearDataTimeout,);\n    }\n    if (!props.onlyMouse) {\n      targetElement.value.removeEventListener(\"click\", setPopoverData);\n    }\n    targetElement.value.removeEventListener(\"focusout\", clearDataBlur);\n  }\n}\nfunction handleClickEvent(e: MouseEvent | PointerEvent){\n  if (show.value && isClick.value && e.target !== popoverRef.value && !popoverRef.value?.contains(e.target)) {\n    isClick.value = false;\n    clearData();\n    return -1;\n  }\n  if (show.value && isTopLayerPopover.value) {\n    const popover = popoverRef?.value as HTMLElement;\n    popover.showPopover();\n    isClick.value = true;\n    return -1;\n  }\n  isClick.value = true;\n  return 0;\n}\nfunction handleLeftPos(rectElement: DOMRect, parentLeft: number, sizeAvailable: number, sizePopover: number){\n  const elementRightRelative = rectElement.right - parentLeft;\n  const hasPlaceRightButton = (sizeAvailable - (sizeAvailable - elementRightRelative)) > sizePopover;\n  if(hasPlaceRightButton){\n    posX.value =\n    rectElement.right -\n    parentLeft -\n    sizePopover;\n  }else{\n    posX.value =parentLeft;\n  }\n}\nfunction handleRightPos(rectElement: DOMRect, parentLeft: number, sizeAvailable: number, sizePopover: number){\n  const elementLeftRelative = rectElement.left - parentLeft;\n  const hasPlaceRightButton = (sizeAvailable - elementLeftRelative) > sizePopover;\n  if(hasPlaceRightButton){\n    posX.value = elementLeftRelative;\n  }else{\n    posX.value = sizeAvailable - sizePopover + parentLeft;\n  }\n}\nfunction setPopoverData(e: MouseEvent | PointerEvent) {\n  clearInterval(clearTimeout.value as unknown as number);\n  if (props.disable || !e || !e.target) {\n    return;\n  }\n  if (\"click\" === e.type && -1 === handleClickEvent(e)) {\n    return;\n  }\n  // Track if opened by hover (mouseenter) vs click\n  if (e.type === \"mouseenter\") {\n    openedByHover.value = true;\n  }\n  show.value = true;\n  const popover = popoverRef?.value as HTMLElement;\n  // The popover is teleported to <body> and uses position:fixed, so\n  // getBoundingClientRect() coordinates map directly to viewport coordinates.\n  const rectElement = (e.target as HTMLElement).getBoundingClientRect();\n  popover.style.display = \"block\";\n  const sizePopover = popover.clientWidth;\n  if (props.leftPos) {\n    handleLeftPos(rectElement, 0, window.innerWidth, sizePopover);\n  } else {\n    handleRightPos(rectElement, 0, window.innerWidth, sizePopover);\n  }\n  posX.value = Math.max(0, posX.value);\n  const yPosParent = props.topPos ? rectElement.top : rectElement.bottom;\n  const yGap = props.topPos\n    ? -5 - popover.clientHeight\n    : 5;\n  posY.value = Math.max(0, yPosParent + yGap);\n  maxHeight.value = (window.innerHeight - posY.value) + \"px\";\n}\n\nfunction clearDataBlur(e: FocusEvent) {\n  if (isTabAction.value) {\n    isTabAction.value = false;\n    return;\n  }\n  //Exception timepicker in popover\n  const result = Array.from(e?.target?.classList ?? []).findIndex((val) => { return val.startsWith(\"dp__\");});\n  if (-1!==result) {\n    return;\n  }\n\n  const parent = popoverRef?.value as HTMLElement;\n  if (!e.relatedTarget) {\n    if (parent !== null && parent.contains(e.target)) {\n      return;\n    }\n    return clearClick();\n  }\n  const myElement = e.relatedTarget as HTMLElement;\n  if (popoverId.value === myElement.id) {\n    return;\n  }\n  if (null === parent || !parent.contains(myElement)) {\n    return clearClick();\n  }\n  if (\n    null === myElement.classList ||\n    !myElement.classList.contains(\"octopus-dropdown-item\")\n  ) {\n    return;\n  }\n  if (!(myElement as HTMLAnchorElement).href) {\n    return clearClick();\n  }\n  if (myElement.classList.contains(\"realLink\")) {\n    myElement.click();\n  } else {\n    router.push((myElement as HTMLAnchorElement).pathname);\n  }\n  nextTick(() => {\n    isClick.value = false;\n    clearData();\n  });\n}\nfunction clearClick() {\n  isClick.value = false;\n  clearData();\n}\nfunction clearDataTimeout() {\n  clearTimeout.value = setTimeout(() => {\n    if (!overPopover.value) {\n      clearData();\n    }\n    clearTimeout.value=undefined;\n  }, 500);\n}\nfunction clearData() {\n  // Allow closing if opened by hover, even if clicked afterwards\n  if (isClick.value && !openedByHover.value) {\n    return;\n  }\n  show.value = false;\n  posX.value = 0;\n  posY.value = 0;\n  openedByHover.value = false;\n}\n\n//Expose\ndefineExpose({\n  clearClick\n});\n</script>\n\n<style lang=\"scss\">\n.octopus-popover {\n  background: var(--octopus-background);\n  border-radius: var(--octopus-border-radius);\n  overflow: auto;\n  margin: 0 !important;\n  z-index: 10;\n\n  &.popover-z-index {\n    z-index: 9999;\n  }\n\n  &.octopus-dropdown {\n    min-width: 200px;\n\n    .octopus-dropdown-item {\n      display: flex;\n      justify-content: center;\n      color: var(--octopus-color-text);\n      width: 100%;\n      padding: 0.25rem 1rem;\n      font-weight: 400;\n      text-decoration: none;\n      white-space: nowrap;\n      background-color: transparent;\n      border: 0;\n\n      &:disabled {\n        background: var(--octopus-secondary-darker);\n      }\n\n      &:is(:hover, :focus){\n        background: var(--octopus-secondary-lighter);\n      }\n    }\n\n    hr {\n      margin: 0.5rem 0;\n      overflow: hidden;\n      border-top: 1px solid var(--octopus-border-default);\n      opacity: 1;\n    }\n  }\n}\n</style>\n"],"mappings":"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"}