@7pmlabs/design-system 0.3.2 → 0.3.4

package/dist/design-system81.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system81.js","sources":["../src/components/BTabs/BTabs.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, toDisplayString as _toDisplayString, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-22ce07e0\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-flex ds-flex-wrap ds-overflow-hidden ds-rounded-lg ds-border ds-border-gray-100 ds-bg-gray-100\" }\nconst _hoisted_2 = [\"onClick\"]\nconst _hoisted_3 = [\"id\"]\n\nimport type { BTabsHeader } from '@/types';\nimport { v4 as uuid } from 'uuid';\nimport { computed, nextTick, onMounted, ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface BTabsProps {\n  /**\n   * Array of header objects.\n   */\n  headers: BTabsHeader[];\n  /**\n   * Index of tab.\n   */\n  modelValue?: number;\n  /**\n   * CSS of header.\n   */\n  headerCssClass?: string;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BTabs',\n  props: {\n    headers: {},\n    modelValue: { default: undefined },\n    headerCssClass: { default: '' }\n  },\n  emits: ['update:modelValue'],\n  setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\nconst tabContainer = ref<HTMLElement | null>(null);\nconst tabHeaders = ref<HTMLElement[] | null>(null);\nconst tabs = ref<Element[] | null>(null);\nconst activeTabIndex = ref(0);\n\n/**\n * Data\n */\nconst mValue = ref(0);\nconst value = computed({\n  get() {\n    return props.modelValue !== undefined ? props.modelValue : mValue.value;\n  },\n  set(val) {\n    if (props.modelValue !== undefined) {\n      emit('update:modelValue', val);\n    } else {\n      mValue.value = val;\n    }\n  },\n});\nconst tabBodyId = computed(() => `id-${uuid()}`);\n\n/**\n * Watch\n */\nwatch(value, (val) => {\n  selectTab(val);\n});\nwatch(\n  () => props.headers,\n  () => {\n    nextTick(() => {\n      initTabs();\n    });\n  },\n);\n\n/**\n * Methods\n */\nconst onClickTabHeader = (index: number) => {\n  value.value = index;\n};\nconst selectTab = (index: number) => {\n  if (tabs.value && tabHeaders.value) {\n    // Set activeTabIndex item to the index of the element clicked\n    activeTabIndex.value = index;\n    // Remove any active classes\n    [...tabs.value, ...tabHeaders.value].forEach((t) => {\n      t.classList.remove('active');\n    });\n    // Add active classes where appropriate, to the active element\n    if (\n      tabs.value[activeTabIndex.value] &&\n      tabHeaders.value[activeTabIndex.value]\n    ) {\n      tabs.value[activeTabIndex.value].classList.add('active');\n      tabHeaders.value[activeTabIndex.value].classList.add('active');\n    } else {\n      // Nearest element if desired index is not found\n      const nearestIndex = activeTabIndex.value - 1;\n      if (nearestIndex >= 0) {\n        tabs.value[nearestIndex].classList.add('active');\n        tabHeaders.value[nearestIndex].classList.add('active');\n      }\n    }\n  }\n};\nconst initTabs = () => {\n  if (tabContainer.value) {\n    // Selects all elements with the class '.tab', which are direct children of element with the id 'tabBodyId'\n    tabs.value = [\n      ...(tabContainer.value.querySelectorAll(\n        `#${tabBodyId.value} > .tab`,\n      ) as any),\n    ];\n    tabs.value.forEach((tab) => {\n      if (tab.classList.contains('active')) {\n        activeTabIndex.value = tabs.value!.indexOf(tab);\n      }\n    });\n    selectTab(activeTabIndex.value);\n  }\n};\n\n/**\n * Lifecycle Hooks\n */\nonMounted(() => {\n  initTabs();\n});\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", {\n    ref_key: \"tabContainer\",\n    ref: tabContainer\n  }, [\n    _renderSlot(_ctx.$slots, \"headers-prepend\", {}, undefined, true),\n    _createElementVNode(\"ul\", _hoisted_1, [\n      (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.headers, (header, index) => {\n        return (_openBlock(), _createElementBlock(\"li\", {\n          key: index,\n          ref_for: true,\n          ref_key: \"tabHeaders\",\n          ref: tabHeaders,\n          class: _normalizeClass([[\n          _ctx.headerCssClass,\n          header.disabled ? 'ds-pointer-events-none ds-text-black/40' : '',\n        ], \"tab-header ds-min-w-[5rem] ds-flex-1 ds-cursor-pointer ds-rounded-lg ds-p-2 ds-text-center ds-text-sm ds-font-medium ds-capitalize hover:ds-bg-slate-50 hover:ds-text-primary-t\"]),\n          onClick: ($event: any) => (onClickTabHeader(index))\n        }, _toDisplayString(header.text), 11, _hoisted_2))\n      }), 128))\n    ]),\n    _renderSlot(_ctx.$slots, \"headers-append\", {}, undefined, true),\n    _createElementVNode(\"div\", {\n      id: tabBodyId.value,\n      class: \"ds-w-full\"\n    }, [\n      _renderSlot(_ctx.$slots, \"default\", {}, undefined, true)\n    ], 8, _hoisted_3)\n  ], 512))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_sfc_main","_defineComponent","__props","emit","props","tabContainer","ref","tabHeaders","tabs","activeTabIndex","mValue","value","computed","val","tabBodyId","uuid","watch","selectTab","nextTick","initTabs","onClickTabHeader","index","t","nearestIndex","tab","onMounted","_ctx","_cache","_openBlock","_createElementBlock","_renderSlot","_createElementVNode","_Fragment","_renderList","header","_normalizeClass","$event","_toDisplayString"],"mappings":"sEAIMA,EAAa,CAAE,MAAO,qGACtBC,EAAa,CAAC,SAAS,EACvBC,EAAa,CAAC,IAAI,EAwBIC,EAAiBC,kBAAA,CAC3C,OAAQ,QACR,MAAO,CACL,QAAS,CAAC,EACV,WAAY,CAAE,QAAS,MAAU,EACjC,eAAgB,CAAE,QAAS,EAAG,CAChC,EACA,MAAO,CAAC,mBAAmB,EAC3B,MAAMC,EAAc,CAAE,KAAAC,GAAQ,CAEhC,MAAMC,EAAQF,EASRG,EAAeC,MAAwB,IAAI,EAC3CC,EAAaD,MAA0B,IAAI,EAC3CE,EAAOF,MAAsB,IAAI,EACjCG,EAAiBH,MAAI,CAAC,EAKtBI,EAASJ,MAAI,CAAC,EACdK,EAAQC,EAAAA,SAAS,CACrB,KAAM,CACJ,OAAOR,EAAM,aAAe,OAAYA,EAAM,WAAaM,EAAO,KACpE,EACA,IAAIG,EAAK,CACHT,EAAM,aAAe,OACvBD,EAAK,oBAAqBU,CAAG,EAE7BH,EAAO,MAAQG,CAEnB,CAAA,CACD,EACKC,EAAYF,EAAAA,SAAS,IAAM,MAAMG,EAAA,CAAM,EAAE,EAKzCC,QAAAL,EAAQE,GAAQ,CACpBI,EAAUJ,CAAG,CAAA,CACd,EACDG,EAAA,MACE,IAAMZ,EAAM,QACZ,IAAM,CACJc,EAAAA,SAAS,IAAM,CACJC,GAAA,CACV,CACH,CAAA,EAMI,MAAAC,EAAoBC,GAAkB,CAC1CV,EAAM,MAAQU,CAAA,EAEVJ,EAAaI,GAAkB,CAC/B,GAAAb,EAAK,OAASD,EAAW,MASzB,GAPFE,EAAe,MAAQY,EAEtB,CAAA,GAAGb,EAAK,MAAO,GAAGD,EAAW,KAAK,EAAE,QAASe,GAAM,CAChDA,EAAA,UAAU,OAAO,QAAQ,CAAA,CAC5B,EAGCd,EAAK,MAAMC,EAAe,KAAK,GAC/BF,EAAW,MAAME,EAAe,KAAK,EAErCD,EAAK,MAAMC,EAAe,KAAK,EAAE,UAAU,IAAI,QAAQ,EACvDF,EAAW,MAAME,EAAe,KAAK,EAAE,UAAU,IAAI,QAAQ,MACxD,CAEC,MAAAc,EAAed,EAAe,MAAQ,EACxCc,GAAgB,IAClBf,EAAK,MAAMe,CAAY,EAAE,UAAU,IAAI,QAAQ,EAC/ChB,EAAW,MAAMgB,CAAY,EAAE,UAAU,IAAI,QAAQ,EAEzD,CACF,EAEIJ,EAAW,IAAM,CACjBd,EAAa,QAEfG,EAAK,MAAQ,CACX,GAAIH,EAAa,MAAM,iBACrB,IAAIS,EAAU,KAAK,SACrB,CAAA,EAEGN,EAAA,MAAM,QAASgB,GAAQ,CACtBA,EAAI,UAAU,SAAS,QAAQ,IACjCf,EAAe,MAAQD,EAAK,MAAO,QAAQgB,CAAG,EAChD,CACD,EACDP,EAAUR,EAAe,KAAK,EAChC,EAMFgB,OAAAA,EAAAA,UAAU,IAAM,CACLN,GAAA,CACV,EAEM,CAACO,EAAUC,KACRC,EAAA,UAAA,EAAcC,EAAA,mBAAoB,MAAO,CAC/C,QAAS,eACT,IAAKxB,CAAA,EACJ,CACDyB,aAAYJ,EAAK,OAAQ,kBAAmB,CAAA,EAAI,OAAW,EAAI,EAC/DK,EAAA,mBAAoB,KAAMlC,EAAY,EACnC+B,EAAAA,UAAW,EAAI,EAAGC,EAAoB,mBAAAG,WAAW,KAAMC,EAAA,WAAYP,EAAK,QAAS,CAACQ,EAAQb,KACjFO,EAAA,UAAA,EAAcC,EAAA,mBAAoB,KAAM,CAC9C,IAAKR,EACL,QAAS,GACT,QAAS,aACT,IAAKd,EACL,MAAO4B,iBAAgB,CAAC,CACxBT,EAAK,eACLQ,EAAO,SAAW,0CAA4C,EAChE,EAAG,iLAAiL,CAAC,EACnL,QAAUE,GAAiBhB,EAAiBC,CAAK,CAAA,EAChDgB,EAAAA,gBAAiBH,EAAO,IAAI,EAAG,GAAIpC,CAAU,EACjD,EAAG,GAAG,EAAA,CACR,EACDgC,aAAYJ,EAAK,OAAQ,iBAAkB,CAAA,EAAI,OAAW,EAAI,EAC9DK,EAAAA,mBAAoB,MAAO,CACzB,GAAIjB,EAAU,MACd,MAAO,WAAA,EACN,CACDgB,aAAYJ,EAAK,OAAQ,UAAW,CAAA,EAAI,OAAW,EAAI,CAAA,EACtD,EAAG3B,CAAU,GACf,GAAG,EAER,CAEA,CAAC"}
+{"version":3,"file":"design-system81.js","sources":["../src/components/BTabs/BTabs.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, toDisplayString as _toDisplayString, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-0e61b97f\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-flex ds-flex-wrap ds-overflow-hidden ds-rounded-lg ds-border ds-border-gray-100 ds-bg-gray-100\" }\nconst _hoisted_2 = [\"onClick\"]\nconst _hoisted_3 = [\"id\"]\n\nimport type { BTabsHeader } from '@/types';\nimport { v4 as uuid } from 'uuid';\nimport { computed, nextTick, onMounted, ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface BTabsProps {\n  /**\n   * Array of header objects.\n   */\n  headers: BTabsHeader[];\n  /**\n   * Index of tab.\n   */\n  modelValue?: number;\n  /**\n   * CSS of header.\n   */\n  headerCssClass?: string;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BTabs',\n  props: {\n    headers: {},\n    modelValue: { default: undefined },\n    headerCssClass: { default: '' }\n  },\n  emits: [\"update:modelValue\"],\n  setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst tabContainer = ref<HTMLElement | null>(null);\nconst tabHeaders = ref<HTMLElement[] | null>(null);\nconst tabs = ref<Element[] | null>(null);\nconst activeTabIndex = ref(0);\nconst mValue = ref(0);\nconst value = computed({\n  get() {\n    return props.modelValue !== undefined ? props.modelValue : mValue.value;\n  },\n  set(val) {\n    if (props.modelValue !== undefined) {\n      emit('update:modelValue', val);\n    } else {\n      mValue.value = val;\n    }\n  },\n});\nconst tabBodyId = computed(() => `id-${uuid()}`);\n\n/**\n * Watch\n */\nwatch(value, (val) => {\n  selectTab(val);\n});\nwatch(\n  () => props.headers,\n  () => {\n    nextTick(() => {\n      initTabs();\n    });\n  },\n);\n\n/**\n * Methods\n */\nconst onClickTabHeader = (index: number) => {\n  value.value = index;\n};\nconst selectTab = (index: number) => {\n  if (tabs.value && tabHeaders.value) {\n    // Set activeTabIndex item to the index of the element clicked\n    activeTabIndex.value = index;\n    // Remove any active classes\n    [...tabs.value, ...tabHeaders.value].forEach((t) => {\n      t.classList.remove('active');\n    });\n    // Add active classes where appropriate, to the active element\n    if (\n      tabs.value[activeTabIndex.value] &&\n      tabHeaders.value[activeTabIndex.value]\n    ) {\n      tabs.value[activeTabIndex.value].classList.add('active');\n      tabHeaders.value[activeTabIndex.value].classList.add('active');\n    } else {\n      // Nearest element if desired index is not found\n      const nearestIndex = activeTabIndex.value - 1;\n      if (nearestIndex >= 0) {\n        tabs.value[nearestIndex].classList.add('active');\n        tabHeaders.value[nearestIndex].classList.add('active');\n      }\n    }\n  }\n};\nconst initTabs = () => {\n  if (tabContainer.value) {\n    // Selects all elements with the class '.tab', which are direct children of element with the id 'tabBodyId'\n    tabs.value = [\n      ...(tabContainer.value.querySelectorAll(\n        `#${tabBodyId.value} > .tab`,\n      ) as any),\n    ];\n    tabs.value.forEach((tab) => {\n      if (tab.classList.contains('active')) {\n        activeTabIndex.value = tabs.value!.indexOf(tab);\n      }\n    });\n    selectTab(activeTabIndex.value);\n  }\n};\n\n/**\n * Lifecycle Hooks\n */\nonMounted(() => {\n  initTabs();\n});\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", {\n    ref_key: \"tabContainer\",\n    ref: tabContainer\n  }, [\n    _renderSlot(_ctx.$slots, \"headers-prepend\", {}, undefined, true),\n    _createElementVNode(\"ul\", _hoisted_1, [\n      (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.headers, (header, index) => {\n        return (_openBlock(), _createElementBlock(\"li\", {\n          key: index,\n          ref_for: true,\n          ref_key: \"tabHeaders\",\n          ref: tabHeaders,\n          class: _normalizeClass([[\n          _ctx.headerCssClass,\n          header.disabled ? 'ds-pointer-events-none ds-text-black/40' : '',\n        ], \"tab-header ds-min-w-[5rem] ds-flex-1 ds-cursor-pointer ds-rounded-lg ds-p-2 ds-text-center ds-text-sm ds-font-medium ds-capitalize hover:ds-bg-slate-50 hover:ds-text-primary-t\"]),\n          onClick: ($event: any) => (onClickTabHeader(index))\n        }, _toDisplayString(header.text), 11, _hoisted_2))\n      }), 128))\n    ]),\n    _renderSlot(_ctx.$slots, \"headers-append\", {}, undefined, true),\n    _createElementVNode(\"div\", {\n      id: tabBodyId.value,\n      class: \"ds-w-full\"\n    }, [\n      _renderSlot(_ctx.$slots, \"default\", {}, undefined, true)\n    ], 8, _hoisted_3)\n  ], 512))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_sfc_main","_defineComponent","__props","emit","props","tabContainer","ref","tabHeaders","tabs","activeTabIndex","mValue","value","computed","val","tabBodyId","uuid","watch","selectTab","nextTick","initTabs","onClickTabHeader","index","t","nearestIndex","tab","onMounted","_ctx","_cache","_openBlock","_createElementBlock","_renderSlot","_createElementVNode","_Fragment","_renderList","header","_normalizeClass","$event","_toDisplayString"],"mappings":"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"}

package/dist/design-system81.mjs

@@ -1,5 +1,5 @@
 import { defineComponent as V, ref as d, computed as C, watch as k, nextTick as L, onMounted as T, openBlock as n, createElementBlock as u, renderSlot as i, createElementVNode as _, Fragment as $, renderList as w, normalizeClass as B, toDisplayString as E } from "vue";
-import H from "./design-system97.mjs";
+import H from "./design-system98.mjs";
 const I = { class: "ds-flex ds-flex-wrap ds-overflow-hidden ds-rounded-lg ds-border ds-border-gray-100 ds-bg-gray-100" }, S = ["onClick"], z = ["id"], F = /* @__PURE__ */ V({
   __name: "BTabs",
   props: {

package/dist/design-system81.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system81.mjs","sources":["../src/components/BTabs/BTabs.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, toDisplayString as _toDisplayString, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-22ce07e0\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-flex ds-flex-wrap ds-overflow-hidden ds-rounded-lg ds-border ds-border-gray-100 ds-bg-gray-100\" }\nconst _hoisted_2 = [\"onClick\"]\nconst _hoisted_3 = [\"id\"]\n\nimport type { BTabsHeader } from '@/types';\nimport { v4 as uuid } from 'uuid';\nimport { computed, nextTick, onMounted, ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface BTabsProps {\n  /**\n   * Array of header objects.\n   */\n  headers: BTabsHeader[];\n  /**\n   * Index of tab.\n   */\n  modelValue?: number;\n  /**\n   * CSS of header.\n   */\n  headerCssClass?: string;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BTabs',\n  props: {\n    headers: {},\n    modelValue: { default: undefined },\n    headerCssClass: { default: '' }\n  },\n  emits: ['update:modelValue'],\n  setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\nconst tabContainer = ref<HTMLElement | null>(null);\nconst tabHeaders = ref<HTMLElement[] | null>(null);\nconst tabs = ref<Element[] | null>(null);\nconst activeTabIndex = ref(0);\n\n/**\n * Data\n */\nconst mValue = ref(0);\nconst value = computed({\n  get() {\n    return props.modelValue !== undefined ? props.modelValue : mValue.value;\n  },\n  set(val) {\n    if (props.modelValue !== undefined) {\n      emit('update:modelValue', val);\n    } else {\n      mValue.value = val;\n    }\n  },\n});\nconst tabBodyId = computed(() => `id-${uuid()}`);\n\n/**\n * Watch\n */\nwatch(value, (val) => {\n  selectTab(val);\n});\nwatch(\n  () => props.headers,\n  () => {\n    nextTick(() => {\n      initTabs();\n    });\n  },\n);\n\n/**\n * Methods\n */\nconst onClickTabHeader = (index: number) => {\n  value.value = index;\n};\nconst selectTab = (index: number) => {\n  if (tabs.value && tabHeaders.value) {\n    // Set activeTabIndex item to the index of the element clicked\n    activeTabIndex.value = index;\n    // Remove any active classes\n    [...tabs.value, ...tabHeaders.value].forEach((t) => {\n      t.classList.remove('active');\n    });\n    // Add active classes where appropriate, to the active element\n    if (\n      tabs.value[activeTabIndex.value] &&\n      tabHeaders.value[activeTabIndex.value]\n    ) {\n      tabs.value[activeTabIndex.value].classList.add('active');\n      tabHeaders.value[activeTabIndex.value].classList.add('active');\n    } else {\n      // Nearest element if desired index is not found\n      const nearestIndex = activeTabIndex.value - 1;\n      if (nearestIndex >= 0) {\n        tabs.value[nearestIndex].classList.add('active');\n        tabHeaders.value[nearestIndex].classList.add('active');\n      }\n    }\n  }\n};\nconst initTabs = () => {\n  if (tabContainer.value) {\n    // Selects all elements with the class '.tab', which are direct children of element with the id 'tabBodyId'\n    tabs.value = [\n      ...(tabContainer.value.querySelectorAll(\n        `#${tabBodyId.value} > .tab`,\n      ) as any),\n    ];\n    tabs.value.forEach((tab) => {\n      if (tab.classList.contains('active')) {\n        activeTabIndex.value = tabs.value!.indexOf(tab);\n      }\n    });\n    selectTab(activeTabIndex.value);\n  }\n};\n\n/**\n * Lifecycle Hooks\n */\nonMounted(() => {\n  initTabs();\n});\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", {\n    ref_key: \"tabContainer\",\n    ref: tabContainer\n  }, [\n    _renderSlot(_ctx.$slots, \"headers-prepend\", {}, undefined, true),\n    _createElementVNode(\"ul\", _hoisted_1, [\n      (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.headers, (header, index) => {\n        return (_openBlock(), _createElementBlock(\"li\", {\n          key: index,\n          ref_for: true,\n          ref_key: \"tabHeaders\",\n          ref: tabHeaders,\n          class: _normalizeClass([[\n          _ctx.headerCssClass,\n          header.disabled ? 'ds-pointer-events-none ds-text-black/40' : '',\n        ], \"tab-header ds-min-w-[5rem] ds-flex-1 ds-cursor-pointer ds-rounded-lg ds-p-2 ds-text-center ds-text-sm ds-font-medium ds-capitalize hover:ds-bg-slate-50 hover:ds-text-primary-t\"]),\n          onClick: ($event: any) => (onClickTabHeader(index))\n        }, _toDisplayString(header.text), 11, _hoisted_2))\n      }), 128))\n    ]),\n    _renderSlot(_ctx.$slots, \"headers-append\", {}, undefined, true),\n    _createElementVNode(\"div\", {\n      id: tabBodyId.value,\n      class: \"ds-w-full\"\n    }, [\n      _renderSlot(_ctx.$slots, \"default\", {}, undefined, true)\n    ], 8, _hoisted_3)\n  ], 512))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_sfc_main","_defineComponent","__props","emit","props","tabContainer","ref","tabHeaders","tabs","activeTabIndex","mValue","value","computed","val","tabBodyId","uuid","watch","selectTab","nextTick","initTabs","onClickTabHeader","index","t","nearestIndex","tab","onMounted","_ctx","_cache","_openBlock","_createElementBlock","_renderSlot","_createElementVNode","_Fragment","_renderList","header","_normalizeClass","$event","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"design-system81.mjs","sources":["../src/components/BTabs/BTabs.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, toDisplayString as _toDisplayString, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-0e61b97f\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-flex ds-flex-wrap ds-overflow-hidden ds-rounded-lg ds-border ds-border-gray-100 ds-bg-gray-100\" }\nconst _hoisted_2 = [\"onClick\"]\nconst _hoisted_3 = [\"id\"]\n\nimport type { BTabsHeader } from '@/types';\nimport { v4 as uuid } from 'uuid';\nimport { computed, nextTick, onMounted, ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface BTabsProps {\n  /**\n   * Array of header objects.\n   */\n  headers: BTabsHeader[];\n  /**\n   * Index of tab.\n   */\n  modelValue?: number;\n  /**\n   * CSS of header.\n   */\n  headerCssClass?: string;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BTabs',\n  props: {\n    headers: {},\n    modelValue: { default: undefined },\n    headerCssClass: { default: '' }\n  },\n  emits: [\"update:modelValue\"],\n  setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst tabContainer = ref<HTMLElement | null>(null);\nconst tabHeaders = ref<HTMLElement[] | null>(null);\nconst tabs = ref<Element[] | null>(null);\nconst activeTabIndex = ref(0);\nconst mValue = ref(0);\nconst value = computed({\n  get() {\n    return props.modelValue !== undefined ? props.modelValue : mValue.value;\n  },\n  set(val) {\n    if (props.modelValue !== undefined) {\n      emit('update:modelValue', val);\n    } else {\n      mValue.value = val;\n    }\n  },\n});\nconst tabBodyId = computed(() => `id-${uuid()}`);\n\n/**\n * Watch\n */\nwatch(value, (val) => {\n  selectTab(val);\n});\nwatch(\n  () => props.headers,\n  () => {\n    nextTick(() => {\n      initTabs();\n    });\n  },\n);\n\n/**\n * Methods\n */\nconst onClickTabHeader = (index: number) => {\n  value.value = index;\n};\nconst selectTab = (index: number) => {\n  if (tabs.value && tabHeaders.value) {\n    // Set activeTabIndex item to the index of the element clicked\n    activeTabIndex.value = index;\n    // Remove any active classes\n    [...tabs.value, ...tabHeaders.value].forEach((t) => {\n      t.classList.remove('active');\n    });\n    // Add active classes where appropriate, to the active element\n    if (\n      tabs.value[activeTabIndex.value] &&\n      tabHeaders.value[activeTabIndex.value]\n    ) {\n      tabs.value[activeTabIndex.value].classList.add('active');\n      tabHeaders.value[activeTabIndex.value].classList.add('active');\n    } else {\n      // Nearest element if desired index is not found\n      const nearestIndex = activeTabIndex.value - 1;\n      if (nearestIndex >= 0) {\n        tabs.value[nearestIndex].classList.add('active');\n        tabHeaders.value[nearestIndex].classList.add('active');\n      }\n    }\n  }\n};\nconst initTabs = () => {\n  if (tabContainer.value) {\n    // Selects all elements with the class '.tab', which are direct children of element with the id 'tabBodyId'\n    tabs.value = [\n      ...(tabContainer.value.querySelectorAll(\n        `#${tabBodyId.value} > .tab`,\n      ) as any),\n    ];\n    tabs.value.forEach((tab) => {\n      if (tab.classList.contains('active')) {\n        activeTabIndex.value = tabs.value!.indexOf(tab);\n      }\n    });\n    selectTab(activeTabIndex.value);\n  }\n};\n\n/**\n * Lifecycle Hooks\n */\nonMounted(() => {\n  initTabs();\n});\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", {\n    ref_key: \"tabContainer\",\n    ref: tabContainer\n  }, [\n    _renderSlot(_ctx.$slots, \"headers-prepend\", {}, undefined, true),\n    _createElementVNode(\"ul\", _hoisted_1, [\n      (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.headers, (header, index) => {\n        return (_openBlock(), _createElementBlock(\"li\", {\n          key: index,\n          ref_for: true,\n          ref_key: \"tabHeaders\",\n          ref: tabHeaders,\n          class: _normalizeClass([[\n          _ctx.headerCssClass,\n          header.disabled ? 'ds-pointer-events-none ds-text-black/40' : '',\n        ], \"tab-header ds-min-w-[5rem] ds-flex-1 ds-cursor-pointer ds-rounded-lg ds-p-2 ds-text-center ds-text-sm ds-font-medium ds-capitalize hover:ds-bg-slate-50 hover:ds-text-primary-t\"]),\n          onClick: ($event: any) => (onClickTabHeader(index))\n        }, _toDisplayString(header.text), 11, _hoisted_2))\n      }), 128))\n    ]),\n    _renderSlot(_ctx.$slots, \"headers-append\", {}, undefined, true),\n    _createElementVNode(\"div\", {\n      id: tabBodyId.value,\n      class: \"ds-w-full\"\n    }, [\n      _renderSlot(_ctx.$slots, \"default\", {}, undefined, true)\n    ], 8, _hoisted_3)\n  ], 512))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_sfc_main","_defineComponent","__props","emit","props","tabContainer","ref","tabHeaders","tabs","activeTabIndex","mValue","value","computed","val","tabBodyId","uuid","watch","selectTab","nextTick","initTabs","onClickTabHeader","index","t","nearestIndex","tab","onMounted","_ctx","_cache","_openBlock","_createElementBlock","_renderSlot","_createElementVNode","_Fragment","_renderList","header","_normalizeClass","$event","_toDisplayString"],"mappings":"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"}

package/dist/design-system87.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("vue"),a=require("./design-system5.js"),y=r=>(e.pushScopeId("data-v-65d47649"),r=r(),e.popScopeId(),r),L={class:"ds-relative"},V=y(()=>e.createElementVNode("div",{class:"tooltip-arrow","data-popper-arrow":""},null,-1)),_=e.defineComponent({__name:"BTooltip",props:{modelValue:{type:Boolean,default:!1},position:{default:a.BTooltipPosition.Top},openEvent:{default:a.BTooltipOpenEvent.Hover}},emits:["update:modelValue"],setup(r,{emit:b}){const n=r,o=e.ref(null),s=e.ref(null),v=e.ref(!1),l=e.computed({get(){return n.modelValue!==void 0?n.modelValue:v.value},set(t){n.modelValue!==void 0?b("update:modelValue",t):v.value=t}});e.watch(()=>n.position,()=>{w(),E()}),e.watch(()=>n.openEvent,()=>{h(),k()});const c=()=>{l.value=!l.value},p=()=>{l.value=!0},g=()=>{l.value=!1},m=()=>{l.value=!0},f=()=>{l.value=!1},w=()=>{s.value&&(s.value.style.top="",s.value.style.right="",s.value.style.bottom="",s.value.style.left="")},E=()=>{if(s.value)switch(n.position){case a.BTooltipPosition.Bottom:s.value.style.top="4px";break;case a.BTooltipPosition.Top:default:s.value.style.bottom="24px";break}},k=()=>{var t,u,i,d,B;switch(n.openEvent){case a.BTooltipOpenEvent.Click:(t=o.value)==null||t.addEventListener("click",c);break;case a.BTooltipOpenEvent.Focus:(u=o.value)==null||u.addEventListener("focus",p),(i=o.value)==null||i.addEventListener("focusout",g);break;case a.BTooltipOpenEvent.Hover:default:(d=o.value)==null||d.addEventListener("mouseover",m),(B=o.value)==null||B.addEventListener("mouseleave",f);break}},h=()=>{var t,u,i,d;(t=o.value)==null||t.removeEventListener("click",c),(u=o.value)==null||u.removeEventListener("focus",p),(i=o.value)==null||i.removeEventListener("mouseover",m),(d=o.value)==null||d.removeEventListener("mouseleave",f)};return e.onMounted(()=>{k(),E()}),e.onBeforeUnmount(()=>{h()}),(t,u)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{ref_key:"toggleRef",ref:o,class:"ds-inline"},[e.renderSlot(t.$slots,"toggle",{},void 0,!0)],512),e.withDirectives(e.createElementVNode("div",L,[e.createElementVNode("div",{ref_key:"contentRef",ref:s,class:"ds-absolute ds-z-10 ds-inline-block ds-rounded-lg ds-bg-black/[0.65] ds-px-3 ds-py-2 ds-text-sm ds-font-medium ds-text-white ds-shadow-sm ds-transition-opacity ds-duration-300"},[e.renderSlot(t.$slots,"default",{},void 0,!0),V],512)],512),[[e.vShow,l.value]])],64))}});module.exports=_;
+"use strict";const e=require("vue"),a=require("./design-system5.js"),y=r=>(e.pushScopeId("data-v-bf99da80"),r=r(),e.popScopeId(),r),L={class:"ds-relative"},V=y(()=>e.createElementVNode("div",{class:"tooltip-arrow","data-popper-arrow":""},null,-1)),_=e.defineComponent({__name:"BTooltip",props:{modelValue:{type:Boolean,default:!1},position:{default:a.BTooltipPosition.Top},openEvent:{default:a.BTooltipOpenEvent.Hover}},emits:["update:modelValue"],setup(r,{emit:b}){const n=r,o=e.ref(null),s=e.ref(null),v=e.ref(!1),l=e.computed({get(){return n.modelValue!==void 0?n.modelValue:v.value},set(t){n.modelValue!==void 0?b("update:modelValue",t):v.value=t}});e.watch(()=>n.position,()=>{w(),E()}),e.watch(()=>n.openEvent,()=>{h(),k()});const c=()=>{l.value=!l.value},p=()=>{l.value=!0},g=()=>{l.value=!1},m=()=>{l.value=!0},f=()=>{l.value=!1},w=()=>{s.value&&(s.value.style.top="",s.value.style.right="",s.value.style.bottom="",s.value.style.left="")},E=()=>{if(s.value)switch(n.position){case a.BTooltipPosition.Bottom:s.value.style.top="4px";break;case a.BTooltipPosition.Top:default:s.value.style.bottom="24px";break}},k=()=>{var t,u,i,d,B;switch(n.openEvent){case a.BTooltipOpenEvent.Click:(t=o.value)==null||t.addEventListener("click",c);break;case a.BTooltipOpenEvent.Focus:(u=o.value)==null||u.addEventListener("focus",p),(i=o.value)==null||i.addEventListener("focusout",g);break;case a.BTooltipOpenEvent.Hover:default:(d=o.value)==null||d.addEventListener("mouseover",m),(B=o.value)==null||B.addEventListener("mouseleave",f);break}},h=()=>{var t,u,i,d;(t=o.value)==null||t.removeEventListener("click",c),(u=o.value)==null||u.removeEventListener("focus",p),(i=o.value)==null||i.removeEventListener("mouseover",m),(d=o.value)==null||d.removeEventListener("mouseleave",f)};return e.onMounted(()=>{k(),E()}),e.onBeforeUnmount(()=>{h()}),(t,u)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{ref_key:"toggleRef",ref:o,class:"ds-inline"},[e.renderSlot(t.$slots,"toggle",{},void 0,!0)],512),e.withDirectives(e.createElementVNode("div",L,[e.createElementVNode("div",{ref_key:"contentRef",ref:s,class:"ds-absolute ds-z-10 ds-inline-block ds-rounded-lg ds-bg-black/[0.65] ds-px-3 ds-py-2 ds-text-sm ds-font-medium ds-text-white ds-shadow-sm ds-transition-opacity ds-duration-300"},[e.renderSlot(t.$slots,"default",{},void 0,!0),V],512)],512),[[e.vShow,l.value]])],64))}});module.exports=_;
 //# sourceMappingURL=design-system87.js.map

package/dist/design-system87.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system87.js","sources":["../src/components/BTooltip.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, createElementVNode as _createElementVNode, vShow as _vShow, withDirectives as _withDirectives, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-65d47649\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-relative\" }\nconst _hoisted_2 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"div\", {\n  class: \"tooltip-arrow\",\n  \"data-popper-arrow\": \"\"\n}, null, -1))\n\nimport { BTooltipOpenEvent, BTooltipPosition } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface BTooltipProps {\n  modelValue?: boolean;\n  /**\n   * Position of opened tooltip compare to its toggle.\n   */\n  position?: `${BTooltipPosition}`;\n  /**\n   * Event to open tooltip.\n   */\n  openEvent?: `${BTooltipOpenEvent}`;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BTooltip',\n  props: {\n    modelValue: { type: Boolean, default: false },\n    position: { default: BTooltipPosition.Top },\n    openEvent: { default: BTooltipOpenEvent.Hover }\n  },\n  emits: ['update:modelValue'],\n  setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst toggleRef = ref<HTMLDivElement | null>(null);\nconst contentRef = ref<HTMLDivElement | null>(null);\nconst mValue = ref(false);\nconst value = computed({\n  get() {\n    return props.modelValue !== undefined ? props.modelValue : mValue.value;\n  },\n  set(val: boolean) {\n    if (props.modelValue !== undefined) {\n      emit('update:modelValue', val);\n    } else {\n      mValue.value = val;\n    }\n  },\n});\n\n/**\n * Watch\n */\nwatch(\n  () => props.position,\n  () => {\n    resetContentPosition();\n    ensureContentPosition();\n  },\n);\nwatch(\n  () => props.openEvent,\n  () => {\n    clearEventListeners();\n    ensureEventListeners();\n  },\n);\n\n/**\n * Methods\n */\nconst onClick = () => {\n  value.value = !value.value;\n};\nconst onFocus = () => {\n  value.value = true;\n};\nconst onFocusOut = () => {\n  value.value = false;\n};\nconst onHover = () => {\n  value.value = true;\n};\nconst onHoverOut = () => {\n  value.value = false;\n};\nconst resetContentPosition = () => {\n  if (!contentRef.value) {\n    return;\n  }\n  contentRef.value.style.top = '';\n  contentRef.value.style.right = '';\n  contentRef.value.style.bottom = '';\n  contentRef.value.style.left = '';\n};\nconst ensureContentPosition = () => {\n  if (!contentRef.value) {\n    return;\n  }\n\n  switch (props.position) {\n    case BTooltipPosition.Bottom:\n      contentRef.value.style.top = '4px';\n      break;\n    case BTooltipPosition.Top:\n    default:\n      contentRef.value.style.bottom = '24px';\n      break;\n  }\n};\nconst ensureEventListeners = () => {\n  switch (props.openEvent) {\n    case BTooltipOpenEvent.Click:\n      toggleRef.value?.addEventListener('click', onClick);\n      break;\n    case BTooltipOpenEvent.Focus:\n      toggleRef.value?.addEventListener('focus', onFocus);\n      toggleRef.value?.addEventListener('focusout', onFocusOut);\n      break;\n    case BTooltipOpenEvent.Hover:\n    default:\n      toggleRef.value?.addEventListener('mouseover', onHover);\n      toggleRef.value?.addEventListener('mouseleave', onHoverOut);\n      break;\n  }\n};\nconst clearEventListeners = () => {\n  toggleRef.value?.removeEventListener('click', onClick);\n  toggleRef.value?.removeEventListener('focus', onFocus);\n  toggleRef.value?.removeEventListener('mouseover', onHover);\n  toggleRef.value?.removeEventListener('mouseleave', onHoverOut);\n};\n\n/**\n * Lifecycle hooks\n */\nonMounted(() => {\n  ensureEventListeners();\n  ensureContentPosition();\n});\nonBeforeUnmount(() => {\n  clearEventListeners();\n});\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(_Fragment, null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"toggleRef\",\n      ref: toggleRef,\n      class: \"ds-inline\"\n    }, [\n      _renderSlot(_ctx.$slots, \"toggle\", {}, undefined, true)\n    ], 512),\n    _withDirectives(_createElementVNode(\"div\", _hoisted_1, [\n      _createElementVNode(\"div\", {\n        ref_key: \"contentRef\",\n        ref: contentRef,\n        class: \"ds-absolute ds-z-10 ds-inline-block ds-rounded-lg ds-bg-black/[0.65] ds-px-3 ds-py-2 ds-text-sm ds-font-medium ds-text-white ds-shadow-sm ds-transition-opacity ds-duration-300\"\n      }, [\n        _renderSlot(_ctx.$slots, \"default\", {}, undefined, true),\n        _hoisted_2\n      ], 512)\n    ], 512), [\n      [_vShow, value.value]\n    ])\n  ], 64))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_createElementVNode","_sfc_main","_defineComponent","BTooltipPosition","BTooltipOpenEvent","__props","emit","props","toggleRef","ref","contentRef","mValue","value","computed","val","watch","resetContentPosition","ensureContentPosition","clearEventListeners","ensureEventListeners","onClick","onFocus","onFocusOut","onHover","onHoverOut","_a","_b","_c","_d","_e","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_Fragment","_renderSlot","_withDirectives","_vShow"],"mappings":"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"}
+{"version":3,"file":"design-system87.js","sources":["../src/components/BTooltip.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, createElementVNode as _createElementVNode, vShow as _vShow, withDirectives as _withDirectives, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-bf99da80\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-relative\" }\nconst _hoisted_2 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"div\", {\n  class: \"tooltip-arrow\",\n  \"data-popper-arrow\": \"\"\n}, null, -1))\n\nimport { BTooltipOpenEvent, BTooltipPosition } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface BTooltipProps {\n  modelValue?: boolean;\n  /**\n   * Position of opened tooltip compare to its toggle.\n   */\n  position?: `${BTooltipPosition}`;\n  /**\n   * Event to open tooltip.\n   */\n  openEvent?: `${BTooltipOpenEvent}`;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BTooltip',\n  props: {\n    modelValue: { type: Boolean, default: false },\n    position: { default: BTooltipPosition.Top },\n    openEvent: { default: BTooltipOpenEvent.Hover }\n  },\n  emits: [\"update:modelValue\"],\n  setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst toggleRef = ref<HTMLDivElement | null>(null);\nconst contentRef = ref<HTMLDivElement | null>(null);\nconst mValue = ref(false);\nconst value = computed({\n  get() {\n    return props.modelValue !== undefined ? props.modelValue : mValue.value;\n  },\n  set(val: boolean) {\n    if (props.modelValue !== undefined) {\n      emit('update:modelValue', val);\n    } else {\n      mValue.value = val;\n    }\n  },\n});\n\n/**\n * Watch\n */\nwatch(\n  () => props.position,\n  () => {\n    resetContentPosition();\n    ensureContentPosition();\n  },\n);\nwatch(\n  () => props.openEvent,\n  () => {\n    clearEventListeners();\n    ensureEventListeners();\n  },\n);\n\n/**\n * Methods\n */\nconst onClick = () => {\n  value.value = !value.value;\n};\nconst onFocus = () => {\n  value.value = true;\n};\nconst onFocusOut = () => {\n  value.value = false;\n};\nconst onHover = () => {\n  value.value = true;\n};\nconst onHoverOut = () => {\n  value.value = false;\n};\nconst resetContentPosition = () => {\n  if (!contentRef.value) {\n    return;\n  }\n  contentRef.value.style.top = '';\n  contentRef.value.style.right = '';\n  contentRef.value.style.bottom = '';\n  contentRef.value.style.left = '';\n};\nconst ensureContentPosition = () => {\n  if (!contentRef.value) {\n    return;\n  }\n\n  switch (props.position) {\n    case BTooltipPosition.Bottom:\n      contentRef.value.style.top = '4px';\n      break;\n    case BTooltipPosition.Top:\n    default:\n      contentRef.value.style.bottom = '24px';\n      break;\n  }\n};\nconst ensureEventListeners = () => {\n  switch (props.openEvent) {\n    case BTooltipOpenEvent.Click:\n      toggleRef.value?.addEventListener('click', onClick);\n      break;\n    case BTooltipOpenEvent.Focus:\n      toggleRef.value?.addEventListener('focus', onFocus);\n      toggleRef.value?.addEventListener('focusout', onFocusOut);\n      break;\n    case BTooltipOpenEvent.Hover:\n    default:\n      toggleRef.value?.addEventListener('mouseover', onHover);\n      toggleRef.value?.addEventListener('mouseleave', onHoverOut);\n      break;\n  }\n};\nconst clearEventListeners = () => {\n  toggleRef.value?.removeEventListener('click', onClick);\n  toggleRef.value?.removeEventListener('focus', onFocus);\n  toggleRef.value?.removeEventListener('mouseover', onHover);\n  toggleRef.value?.removeEventListener('mouseleave', onHoverOut);\n};\n\n/**\n * Lifecycle hooks\n */\nonMounted(() => {\n  ensureEventListeners();\n  ensureContentPosition();\n});\nonBeforeUnmount(() => {\n  clearEventListeners();\n});\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(_Fragment, null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"toggleRef\",\n      ref: toggleRef,\n      class: \"ds-inline\"\n    }, [\n      _renderSlot(_ctx.$slots, \"toggle\", {}, undefined, true)\n    ], 512),\n    _withDirectives(_createElementVNode(\"div\", _hoisted_1, [\n      _createElementVNode(\"div\", {\n        ref_key: \"contentRef\",\n        ref: contentRef,\n        class: \"ds-absolute ds-z-10 ds-inline-block ds-rounded-lg ds-bg-black/[0.65] ds-px-3 ds-py-2 ds-text-sm ds-font-medium ds-text-white ds-shadow-sm ds-transition-opacity ds-duration-300\"\n      }, [\n        _renderSlot(_ctx.$slots, \"default\", {}, undefined, true),\n        _hoisted_2\n      ], 512)\n    ], 512), [\n      [_vShow, value.value]\n    ])\n  ], 64))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_createElementVNode","_sfc_main","_defineComponent","BTooltipPosition","BTooltipOpenEvent","__props","emit","props","toggleRef","ref","contentRef","mValue","value","computed","val","watch","resetContentPosition","ensureContentPosition","clearEventListeners","ensureEventListeners","onClick","onFocus","onFocusOut","onHover","onHoverOut","_a","_b","_c","_d","_e","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_Fragment","_renderSlot","_withDirectives","_vShow"],"mappings":"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"}

package/dist/design-system87.mjs

@@ -1,6 +1,6 @@
 import { defineComponent as x, ref as v, computed as C, watch as L, onMounted as S, onBeforeUnmount as T, openBlock as F, createElementBlock as H, Fragment as R, createElementVNode as d, renderSlot as _, withDirectives as I, vShow as O, pushScopeId as P, popScopeId as $ } from "vue";
 import { BTooltipPosition as c, BTooltipOpenEvent as i } from "./design-system5.mjs";
-const z = (a) => (P("data-v-65d47649"), a = a(), $(), a), D = { class: "ds-relative" }, M = /* @__PURE__ */ z(() => /* @__PURE__ */ d("div", {
+const z = (a) => (P("data-v-bf99da80"), a = a(), $(), a), D = { class: "ds-relative" }, M = /* @__PURE__ */ z(() => /* @__PURE__ */ d("div", {
   class: "tooltip-arrow",
   "data-popper-arrow": ""
 }, null, -1)), j = /* @__PURE__ */ x({

package/dist/design-system87.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system87.mjs","sources":["../src/components/BTooltip.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, createElementVNode as _createElementVNode, vShow as _vShow, withDirectives as _withDirectives, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-65d47649\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-relative\" }\nconst _hoisted_2 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"div\", {\n  class: \"tooltip-arrow\",\n  \"data-popper-arrow\": \"\"\n}, null, -1))\n\nimport { BTooltipOpenEvent, BTooltipPosition } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface BTooltipProps {\n  modelValue?: boolean;\n  /**\n   * Position of opened tooltip compare to its toggle.\n   */\n  position?: `${BTooltipPosition}`;\n  /**\n   * Event to open tooltip.\n   */\n  openEvent?: `${BTooltipOpenEvent}`;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BTooltip',\n  props: {\n    modelValue: { type: Boolean, default: false },\n    position: { default: BTooltipPosition.Top },\n    openEvent: { default: BTooltipOpenEvent.Hover }\n  },\n  emits: ['update:modelValue'],\n  setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst toggleRef = ref<HTMLDivElement | null>(null);\nconst contentRef = ref<HTMLDivElement | null>(null);\nconst mValue = ref(false);\nconst value = computed({\n  get() {\n    return props.modelValue !== undefined ? props.modelValue : mValue.value;\n  },\n  set(val: boolean) {\n    if (props.modelValue !== undefined) {\n      emit('update:modelValue', val);\n    } else {\n      mValue.value = val;\n    }\n  },\n});\n\n/**\n * Watch\n */\nwatch(\n  () => props.position,\n  () => {\n    resetContentPosition();\n    ensureContentPosition();\n  },\n);\nwatch(\n  () => props.openEvent,\n  () => {\n    clearEventListeners();\n    ensureEventListeners();\n  },\n);\n\n/**\n * Methods\n */\nconst onClick = () => {\n  value.value = !value.value;\n};\nconst onFocus = () => {\n  value.value = true;\n};\nconst onFocusOut = () => {\n  value.value = false;\n};\nconst onHover = () => {\n  value.value = true;\n};\nconst onHoverOut = () => {\n  value.value = false;\n};\nconst resetContentPosition = () => {\n  if (!contentRef.value) {\n    return;\n  }\n  contentRef.value.style.top = '';\n  contentRef.value.style.right = '';\n  contentRef.value.style.bottom = '';\n  contentRef.value.style.left = '';\n};\nconst ensureContentPosition = () => {\n  if (!contentRef.value) {\n    return;\n  }\n\n  switch (props.position) {\n    case BTooltipPosition.Bottom:\n      contentRef.value.style.top = '4px';\n      break;\n    case BTooltipPosition.Top:\n    default:\n      contentRef.value.style.bottom = '24px';\n      break;\n  }\n};\nconst ensureEventListeners = () => {\n  switch (props.openEvent) {\n    case BTooltipOpenEvent.Click:\n      toggleRef.value?.addEventListener('click', onClick);\n      break;\n    case BTooltipOpenEvent.Focus:\n      toggleRef.value?.addEventListener('focus', onFocus);\n      toggleRef.value?.addEventListener('focusout', onFocusOut);\n      break;\n    case BTooltipOpenEvent.Hover:\n    default:\n      toggleRef.value?.addEventListener('mouseover', onHover);\n      toggleRef.value?.addEventListener('mouseleave', onHoverOut);\n      break;\n  }\n};\nconst clearEventListeners = () => {\n  toggleRef.value?.removeEventListener('click', onClick);\n  toggleRef.value?.removeEventListener('focus', onFocus);\n  toggleRef.value?.removeEventListener('mouseover', onHover);\n  toggleRef.value?.removeEventListener('mouseleave', onHoverOut);\n};\n\n/**\n * Lifecycle hooks\n */\nonMounted(() => {\n  ensureEventListeners();\n  ensureContentPosition();\n});\nonBeforeUnmount(() => {\n  clearEventListeners();\n});\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(_Fragment, null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"toggleRef\",\n      ref: toggleRef,\n      class: \"ds-inline\"\n    }, [\n      _renderSlot(_ctx.$slots, \"toggle\", {}, undefined, true)\n    ], 512),\n    _withDirectives(_createElementVNode(\"div\", _hoisted_1, [\n      _createElementVNode(\"div\", {\n        ref_key: \"contentRef\",\n        ref: contentRef,\n        class: \"ds-absolute ds-z-10 ds-inline-block ds-rounded-lg ds-bg-black/[0.65] ds-px-3 ds-py-2 ds-text-sm ds-font-medium ds-text-white ds-shadow-sm ds-transition-opacity ds-duration-300\"\n      }, [\n        _renderSlot(_ctx.$slots, \"default\", {}, undefined, true),\n        _hoisted_2\n      ], 512)\n    ], 512), [\n      [_vShow, value.value]\n    ])\n  ], 64))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_createElementVNode","_sfc_main","_defineComponent","BTooltipPosition","BTooltipOpenEvent","__props","emit","props","toggleRef","ref","contentRef","mValue","value","computed","val","watch","resetContentPosition","ensureContentPosition","clearEventListeners","ensureEventListeners","onClick","onFocus","onFocusOut","onHover","onHoverOut","_a","_b","_c","_d","_e","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_Fragment","_renderSlot","_withDirectives","_vShow"],"mappings":"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"}
+{"version":3,"file":"design-system87.mjs","sources":["../src/components/BTooltip.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, createElementVNode as _createElementVNode, vShow as _vShow, withDirectives as _withDirectives, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-bf99da80\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-relative\" }\nconst _hoisted_2 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"div\", {\n  class: \"tooltip-arrow\",\n  \"data-popper-arrow\": \"\"\n}, null, -1))\n\nimport { BTooltipOpenEvent, BTooltipPosition } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface BTooltipProps {\n  modelValue?: boolean;\n  /**\n   * Position of opened tooltip compare to its toggle.\n   */\n  position?: `${BTooltipPosition}`;\n  /**\n   * Event to open tooltip.\n   */\n  openEvent?: `${BTooltipOpenEvent}`;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BTooltip',\n  props: {\n    modelValue: { type: Boolean, default: false },\n    position: { default: BTooltipPosition.Top },\n    openEvent: { default: BTooltipOpenEvent.Hover }\n  },\n  emits: [\"update:modelValue\"],\n  setup(__props: any, { emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst toggleRef = ref<HTMLDivElement | null>(null);\nconst contentRef = ref<HTMLDivElement | null>(null);\nconst mValue = ref(false);\nconst value = computed({\n  get() {\n    return props.modelValue !== undefined ? props.modelValue : mValue.value;\n  },\n  set(val: boolean) {\n    if (props.modelValue !== undefined) {\n      emit('update:modelValue', val);\n    } else {\n      mValue.value = val;\n    }\n  },\n});\n\n/**\n * Watch\n */\nwatch(\n  () => props.position,\n  () => {\n    resetContentPosition();\n    ensureContentPosition();\n  },\n);\nwatch(\n  () => props.openEvent,\n  () => {\n    clearEventListeners();\n    ensureEventListeners();\n  },\n);\n\n/**\n * Methods\n */\nconst onClick = () => {\n  value.value = !value.value;\n};\nconst onFocus = () => {\n  value.value = true;\n};\nconst onFocusOut = () => {\n  value.value = false;\n};\nconst onHover = () => {\n  value.value = true;\n};\nconst onHoverOut = () => {\n  value.value = false;\n};\nconst resetContentPosition = () => {\n  if (!contentRef.value) {\n    return;\n  }\n  contentRef.value.style.top = '';\n  contentRef.value.style.right = '';\n  contentRef.value.style.bottom = '';\n  contentRef.value.style.left = '';\n};\nconst ensureContentPosition = () => {\n  if (!contentRef.value) {\n    return;\n  }\n\n  switch (props.position) {\n    case BTooltipPosition.Bottom:\n      contentRef.value.style.top = '4px';\n      break;\n    case BTooltipPosition.Top:\n    default:\n      contentRef.value.style.bottom = '24px';\n      break;\n  }\n};\nconst ensureEventListeners = () => {\n  switch (props.openEvent) {\n    case BTooltipOpenEvent.Click:\n      toggleRef.value?.addEventListener('click', onClick);\n      break;\n    case BTooltipOpenEvent.Focus:\n      toggleRef.value?.addEventListener('focus', onFocus);\n      toggleRef.value?.addEventListener('focusout', onFocusOut);\n      break;\n    case BTooltipOpenEvent.Hover:\n    default:\n      toggleRef.value?.addEventListener('mouseover', onHover);\n      toggleRef.value?.addEventListener('mouseleave', onHoverOut);\n      break;\n  }\n};\nconst clearEventListeners = () => {\n  toggleRef.value?.removeEventListener('click', onClick);\n  toggleRef.value?.removeEventListener('focus', onFocus);\n  toggleRef.value?.removeEventListener('mouseover', onHover);\n  toggleRef.value?.removeEventListener('mouseleave', onHoverOut);\n};\n\n/**\n * Lifecycle hooks\n */\nonMounted(() => {\n  ensureEventListeners();\n  ensureContentPosition();\n});\nonBeforeUnmount(() => {\n  clearEventListeners();\n});\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(_Fragment, null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"toggleRef\",\n      ref: toggleRef,\n      class: \"ds-inline\"\n    }, [\n      _renderSlot(_ctx.$slots, \"toggle\", {}, undefined, true)\n    ], 512),\n    _withDirectives(_createElementVNode(\"div\", _hoisted_1, [\n      _createElementVNode(\"div\", {\n        ref_key: \"contentRef\",\n        ref: contentRef,\n        class: \"ds-absolute ds-z-10 ds-inline-block ds-rounded-lg ds-bg-black/[0.65] ds-px-3 ds-py-2 ds-text-sm ds-font-medium ds-text-white ds-shadow-sm ds-transition-opacity ds-duration-300\"\n      }, [\n        _renderSlot(_ctx.$slots, \"default\", {}, undefined, true),\n        _hoisted_2\n      ], 512)\n    ], 512), [\n      [_vShow, value.value]\n    ])\n  ], 64))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_createElementVNode","_sfc_main","_defineComponent","BTooltipPosition","BTooltipOpenEvent","__props","emit","props","toggleRef","ref","contentRef","mValue","value","computed","val","watch","resetContentPosition","ensureContentPosition","clearEventListeners","ensureEventListeners","onClick","onFocus","onFocusOut","onHover","onHoverOut","_a","_b","_c","_d","_e","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_Fragment","_renderSlot","_withDirectives","_vShow"],"mappings":"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"}

package/dist/design-system89.js

@@ -1,2 +1,2 @@
-"use strict";const t=require("vue"),h=require("./design-system4.js"),L=require("./design-system48.js"),P=require("./design-system104.js"),j=require("./design-system46.js"),A=require("./design-system3.js"),$=require("./design-system31.js"),U=require("./design-system11.js"),H=require("./design-system30.js"),O=require("./design-system97.js"),G=require("./design-system99.js"),J=d=>(t.pushScopeId("data-v-0ad5e718"),d=d(),t.popScopeId(),d),K={class:"ds-w-full"},Q={class:"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow"},W={key:0,class:"ds-flex ds-flex-wrap ds-justify-center ds-gap-1"},X=["onClick","onDragenter","onDragstart","onDrop"],Y=["src"],Z={class:"ds-flex ds-flex-wrap ds-justify-center"},ee=J(()=>t.createElementVNode("svg",{class:"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t",viewBox:"0 0 512 512",xmlns:"http://www.w3.org/2000/svg"},[t.createElementVNode("path",{d:"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z"})],-1)),te=["accept","multiple"],ae=t.defineComponent({__name:"BImagePicker",props:{inputId:{default:""},modelValue:{},label:{default:""},multiple:{type:Boolean,default:!1},maxFileSize:{default:20},hideDetails:{type:Boolean,default:!1},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},validationRules:{default:void 0}},emits:["update:modelValue","change"],setup(d,{expose:y,emit:c}){const l=d,{t:p}=L.useI18n(),m=t.ref(null),_=t.ref(0),n=t.computed({get(){return l.modelValue},set(e){c("update:modelValue",e)}}),g=t.ref(!0),v=t.ref(!0),i=t.ref({visible:!1,url:""}),f=t.computed(()=>h.FileImageTypes.join(", ")),V=t.computed(()=>l.inputId||`id-${O()}`),k={validateRule:e=>!!e&&e.length>0,errorMessage:()=>l.requiredErrorMessage||p("ds.global.field_required")},B={validateRule:()=>g.value,errorMessage:()=>p("ds.components.base.image_picker.file_types_valid",{types:f.value})},D={validateRule:()=>v.value,errorMessage:()=>p("ds.components.base.image_picker.file_size_valid",{size:l.maxFileSize})},w=t.computed(()=>{let e=[];return l.required&&e.push(k),l.validationRules&&(e=e.concat(l.validationRules)),e.push(B),e.push(D),e.length?e:void 0}),{validate:u,validationResult:C}=A.useValidationField(V.value,n,w.value);y({validate:u});const I=(e,a)=>{_.value=e,a.target.classList.add("dragging"),a.dataTransfer.effectAllowed="move",a.dataTransfer.setData("index",e.toString())},b=e=>{e.target.classList.remove("dragging")},E=(e,a)=>{const s=a.target;_.value!==e&&s.classList.add("dropped-target")},q=e=>{e.preventDefault(),e.dataTransfer.dropEffect="move"},x=e=>{e.target.classList.remove("dropped-target")},F=(e,a)=>{a.preventDefault(),a.target.classList.remove("dropped-target");const r=parseInt(a.dataTransfer.getData("index")),o=n.value[r];n.value.splice(r,1),n.value.splice(e,0,o),c("change"),u()},N=()=>{var e;(e=m.value)==null||e.click()},R=e=>{let a=e.target.files||e.dataTransfer.files;a.length&&S(a)},S=e=>{Array.from(e).forEach(a=>{if(g.value=h.FileImageTypes.includes(a.type),v.value=z(a.size)<=l.maxFileSize,g.value&&v.value){let s=new FileReader;s.onload=r=>{l.multiple?n.value.push({url:r.target.result,file:a,type:a.type}):n.value.splice(0,1,{url:r.target.result,file:a,type:a.type}),c("change"),u()},s.readAsDataURL(a)}else u()})},T=(e,a)=>{e.stopPropagation(),n.value.splice(a,1),c("change"),u()},z=e=>e/1024**2,M=e=>{i.value.url=e.url,i.value.visible=!0};return(e,a)=>(t.openBlock(),t.createElementBlock("div",K,[t.createVNode($,{label:l.label},null,8,["label"]),t.createElementVNode("div",Q,[t.unref(G)(n.value)?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",W,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(n.value,(s,r)=>(t.openBlock(),t.createElementBlock("div",{key:r,class:"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t",draggable:"true",onClick:o=>M(s),onDragend:b,onDragenter:o=>E(r,o),onDragleave:x,onDragover:q,onDragstart:o=>I(r,o),onDrop:o=>F(r,o)},[t.createElementVNode("img",{src:s.url,alt:"image",class:"ds-h-full ds-w-full ds-rounded-lg"},null,8,Y),t.createVNode(P,{class:"ds-right-1 ds-top-1 ds-h-8 ds-w-8",onClick:o=>T(o,r)},null,8,["onClick"])],40,X))),128))])),t.createElementVNode("div",Z,[t.createVNode(U,{onClick:N},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(e.$t("ds.components.base.image_picker.select_image")),1)]),"append-icon":t.withCtx(()=>[ee]),_:1}),t.createElementVNode("input",{ref_key:"inputRef",ref:m,accept:f.value,multiple:l.multiple,class:"ds-hidden",type:"file",onChange:R},null,40,te)])]),l.hideDetails?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(H,{key:0,"error-message":t.unref(C).errorMessage(),class:"mt-1"},null,8,["error-message"])),t.createVNode(j,{modelValue:i.value.visible,"onUpdate:modelValue":a[0]||(a[0]=s=>i.value.visible=s),url:i.value.url},null,8,["modelValue","url"])]))}});module.exports=ae;
+"use strict";const t=require("vue"),h=require("./design-system4.js"),L=require("./design-system48.js"),P=require("./design-system104.js"),j=require("./design-system46.js"),A=require("./design-system3.js"),$=require("./design-system31.js"),U=require("./design-system11.js"),H=require("./design-system30.js"),O=require("./design-system98.js"),G=require("./design-system103.js"),J=d=>(t.pushScopeId("data-v-91ede486"),d=d(),t.popScopeId(),d),K={class:"ds-w-full"},Q={class:"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow"},W={key:0,class:"ds-flex ds-flex-wrap ds-justify-center ds-gap-1"},X=["onClick","onDragenter","onDragstart","onDrop"],Y=["src"],Z={class:"ds-flex ds-flex-wrap ds-justify-center"},ee=J(()=>t.createElementVNode("svg",{class:"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t",viewBox:"0 0 512 512",xmlns:"http://www.w3.org/2000/svg"},[t.createElementVNode("path",{d:"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z"})],-1)),te=["accept","multiple"],ae=t.defineComponent({__name:"BImagePicker",props:{inputId:{default:""},modelValue:{},label:{default:""},multiple:{type:Boolean,default:!1},maxFileSize:{default:20},hideDetails:{type:Boolean,default:!1},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},validationRules:{default:void 0}},emits:["change","update:modelValue"],setup(d,{expose:y,emit:c}){const l=d,{t:p}=L.useI18n(),m=t.ref(null),_=t.ref(0),n=t.computed({get(){return l.modelValue},set(e){c("update:modelValue",e)}}),g=t.ref(!0),v=t.ref(!0),i=t.ref({visible:!1,url:""}),f=t.computed(()=>h.FileImageTypes.join(", ")),V=t.computed(()=>l.inputId||`id-${O()}`),k={validateRule:e=>!!e&&e.length>0,errorMessage:()=>l.requiredErrorMessage||p("ds.global.field_required")},B={validateRule:()=>g.value,errorMessage:()=>p("ds.components.base.image_picker.file_types_valid",{types:f.value})},D={validateRule:()=>v.value,errorMessage:()=>p("ds.components.base.image_picker.file_size_valid",{size:l.maxFileSize})},w=t.computed(()=>{let e=[];return l.required&&e.push(k),l.validationRules&&(e=e.concat(l.validationRules)),e.push(B),e.push(D),e.length?e:void 0}),{validate:u,validationResult:C}=A.useValidationField(V.value,n,w.value);y({validate:u});const I=(e,a)=>{_.value=e,a.target.classList.add("dragging"),a.dataTransfer.effectAllowed="move",a.dataTransfer.setData("index",e.toString())},b=e=>{e.target.classList.remove("dragging")},E=(e,a)=>{const s=a.target;_.value!==e&&s.classList.add("dropped-target")},q=e=>{e.preventDefault(),e.dataTransfer.dropEffect="move"},x=e=>{e.target.classList.remove("dropped-target")},F=(e,a)=>{a.preventDefault(),a.target.classList.remove("dropped-target");const r=parseInt(a.dataTransfer.getData("index")),o=n.value[r];n.value.splice(r,1),n.value.splice(e,0,o),c("change"),u()},N=()=>{var e;(e=m.value)==null||e.click()},R=e=>{let a=e.target.files||e.dataTransfer.files;a.length&&S(a)},S=e=>{Array.from(e).forEach(a=>{if(g.value=h.FileImageTypes.includes(a.type),v.value=z(a.size)<=l.maxFileSize,g.value&&v.value){let s=new FileReader;s.onload=r=>{l.multiple?n.value.push({url:r.target.result,file:a,type:a.type}):n.value.splice(0,1,{url:r.target.result,file:a,type:a.type}),c("change"),u()},s.readAsDataURL(a)}else u()})},T=(e,a)=>{e.stopPropagation(),n.value.splice(a,1),c("change"),u()},z=e=>e/1024**2,M=e=>{i.value.url=e.url,i.value.visible=!0};return(e,a)=>(t.openBlock(),t.createElementBlock("div",K,[t.createVNode($,{label:l.label},null,8,["label"]),t.createElementVNode("div",Q,[t.unref(G)(n.value)?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",W,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(n.value,(s,r)=>(t.openBlock(),t.createElementBlock("div",{key:r,class:"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t",draggable:"true",onClick:o=>M(s),onDragend:b,onDragenter:o=>E(r,o),onDragleave:x,onDragover:q,onDragstart:o=>I(r,o),onDrop:o=>F(r,o)},[t.createElementVNode("img",{src:s.url,alt:"image",class:"ds-h-full ds-w-full ds-rounded-lg"},null,8,Y),t.createVNode(P,{class:"ds-right-1 ds-top-1 ds-h-8 ds-w-8",onClick:o=>T(o,r)},null,8,["onClick"])],40,X))),128))])),t.createElementVNode("div",Z,[t.createVNode(U,{onClick:N},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(e.$t("ds.components.base.image_picker.select_image")),1)]),"append-icon":t.withCtx(()=>[ee]),_:1}),t.createElementVNode("input",{ref_key:"inputRef",ref:m,accept:f.value,multiple:l.multiple,class:"ds-hidden",type:"file",onChange:R},null,40,te)])]),l.hideDetails?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(H,{key:0,"error-message":t.unref(C).errorMessage(),class:"mt-1"},null,8,["error-message"])),t.createVNode(j,{modelValue:i.value.visible,"onUpdate:modelValue":a[0]||(a[0]=s=>i.value.visible=s),url:i.value.url},null,8,["modelValue","url"])]))}});module.exports=ae;
 //# sourceMappingURL=design-system89.js.map

package/dist/design-system89.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system89.js","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-0ad5e718\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n  key: 0,\n  class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_7 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n  class: \"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t\",\n  viewBox: \"0 0 512 512\",\n  xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n  /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n/**\n * Props\n */\nexport interface Props {\n  inputId?: string;\n  modelValue: FileItemRead[];\n  label?: string;\n  multiple?: boolean;\n  maxFileSize?: number;\n  hideDetails?: boolean;\n  required?: boolean;\n  requiredErrorMessage?: string;\n  validationRules?: ValidationRule[];\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BImagePicker',\n  props: {\n    inputId: { default: '' },\n    modelValue: {},\n    label: { default: '' },\n    multiple: { type: Boolean, default: false },\n    maxFileSize: { default: 20 },\n    hideDetails: { type: Boolean, default: false },\n    required: { type: Boolean, default: false },\n    requiredErrorMessage: { default: '' },\n    validationRules: { default: undefined }\n  },\n  emits: ['update:modelValue', 'change'],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n/**\n * Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\n */\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n  get() {\n    return props.modelValue;\n  },\n  set(val) {\n    emit('update:modelValue', val);\n  },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n  visible: false,\n  url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n  validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n  errorMessage: () =>\n    props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n  validateRule: () => fileTypesValid.value,\n  errorMessage: () =>\n    t('ds.components.base.image_picker.file_types_valid', {\n      types: allowedTypes.value,\n    }),\n};\nconst validateFileSizeValid: ValidationRule = {\n  validateRule: () => fileSizeValid.value,\n  errorMessage: () =>\n    t('ds.components.base.image_picker.file_size_valid', {\n      size: props.maxFileSize,\n    }),\n};\nconst vRules = computed(() => {\n  let result: ValidationRule[] = [];\n\n  if (props.required) {\n    result.push(validateRequired);\n  }\n  if (props.validationRules) {\n    result = result.concat(props.validationRules);\n  }\n  result.push(validateFileTypesValid);\n  result.push(validateFileSizeValid);\n\n  return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n  id.value,\n  value,\n  vRules.value,\n);\n__expose({ validate });\n\n/**\n * Methods\n */\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n  draggedIndex.value = index;\n  const target = e.target as HTMLDivElement;\n  target.classList.add('dragging');\n  e.dataTransfer!.effectAllowed = 'move';\n  e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n  const target = e.target as HTMLDivElement;\n  if (draggedIndex.value !== index) {\n    target.classList.add('dropped-target');\n  }\n};\nconst handleDragOver = (e: DragEvent) => {\n  // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n  e.preventDefault();\n  e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n  // When the draggable p element leaves the droptarget, reset the style\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n  e.preventDefault();\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dropped-target');\n  const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n  const draggedImg = value.value[draggedIndex];\n  value.value.splice(draggedIndex, 1);\n  value.value.splice(index, 0, draggedImg);\n\n  emit('change');\n  validate();\n};\nconst openFileDialog = () => {\n  inputRef.value?.click();\n};\nconst onChangeInput = (e: any) => {\n  let fileList: FileList = e.target.files || e.dataTransfer.files;\n  if (!fileList.length) {\n    return;\n  }\n  createFileImages(fileList);\n};\nconst createFileImages = (fileList: FileList) => {\n  Array.from(fileList).forEach((file) => {\n    fileTypesValid.value = FileImageTypes.includes(file.type);\n    fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n    if (fileTypesValid.value && fileSizeValid.value) {\n      let reader: any = new FileReader();\n\n      reader.onload = (f: any) => {\n        if (props.multiple) {\n          value.value.push({\n            url: f.target.result,\n            file,\n            type: file.type,\n          });\n        } else {\n          value.value.splice(0, 1, {\n            url: f.target.result,\n            file,\n            type: file.type,\n          });\n        }\n\n        emit('change');\n        validate();\n      };\n\n      reader.readAsDataURL(file);\n    } else {\n      validate();\n    }\n  });\n};\nconst removeFileImage = (e: Event, index: number) => {\n  e.stopPropagation();\n  value.value.splice(index, 1);\n\n  emit('change');\n  validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n  previewImage.value.url = item.url;\n  previewImage.value.visible = true;\n};\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n    _createVNode(BLabel, {\n      label: props.label\n    }, null, 8, [\"label\"]),\n    _createElementVNode(\"div\", _hoisted_2, [\n      (!_unref(isEmpty)(value.value))\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n            (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(value.value, (item, index) => {\n              return (_openBlock(), _createElementBlock(\"div\", {\n                key: index,\n                class: \"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n                draggable: \"true\",\n                onClick: ($event: any) => (preview(item)),\n                onDragend: handleDragEnd,\n                onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n                onDragleave: handleDragLeave,\n                onDragover: handleDragOver,\n                onDragstart: ($event: any) => (handleDragStart(index, $event)),\n                onDrop: ($event: any) => (handleDrop(index, $event))\n              }, [\n                _createElementVNode(\"img\", {\n                  src: item.url,\n                  alt: \"image\",\n                  class: \"ds-h-full ds-w-full ds-rounded-lg\"\n                }, null, 8, _hoisted_5),\n                _createVNode(BImagePickerCloseButton, {\n                  class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n                  onClick: (e) => removeFileImage(e, index)\n                }, null, 8, [\"onClick\"])\n              ], 40, _hoisted_4))\n            }), 128))\n          ]))\n        : _createCommentVNode(\"\", true),\n      _createElementVNode(\"div\", _hoisted_6, [\n        _createVNode(BButton, { onClick: openFileDialog }, {\n          default: _withCtx(() => [\n            _createTextVNode(_toDisplayString(_ctx.$t('ds.components.base.image_picker.select_image')), 1)\n          ]),\n          \"append-icon\": _withCtx(() => [\n            _hoisted_7\n          ]),\n          _: 1\n        }),\n        _createElementVNode(\"input\", {\n          ref_key: \"inputRef\",\n          ref: inputRef,\n          accept: allowedTypes.value,\n          multiple: props.multiple,\n          class: \"ds-hidden\",\n          type: \"file\",\n          onChange: onChangeInput\n        }, null, 40, _hoisted_8)\n      ])\n    ]),\n    (!props.hideDetails)\n      ? (_openBlock(), _createBlock(BErrorMessage, {\n          key: 0,\n          \"error-message\": _unref(validationResult).errorMessage(),\n          class: \"mt-1\"\n        }, null, 8, [\"error-message\"]))\n      : _createCommentVNode(\"\", true),\n    _createVNode(ImagePreview, {\n      modelValue: previewImage.value.visible,\n      \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((previewImage.value.visible) = $event)),\n      url: previewImage.value.url\n    }, null, 8, [\"modelValue\", \"url\"])\n  ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_createElementVNode","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","emit","props","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","onChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":"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"}
+{"version":3,"file":"design-system89.js","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-91ede486\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n  key: 0,\n  class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_7 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n  class: \"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t\",\n  viewBox: \"0 0 512 512\",\n  xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n  /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n/**\n * Props\n */\nexport interface Props {\n  inputId?: string;\n  modelValue: FileItemRead[];\n  label?: string;\n  multiple?: boolean;\n  maxFileSize?: number;\n  hideDetails?: boolean;\n  required?: boolean;\n  requiredErrorMessage?: string;\n  validationRules?: ValidationRule[];\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BImagePicker',\n  props: {\n    inputId: { default: '' },\n    modelValue: {},\n    label: { default: '' },\n    multiple: { type: Boolean, default: false },\n    maxFileSize: { default: 20 },\n    hideDetails: { type: Boolean, default: false },\n    required: { type: Boolean, default: false },\n    requiredErrorMessage: { default: '' },\n    validationRules: { default: undefined }\n  },\n  emits: [\"change\", \"update:modelValue\"],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n/**\n * Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\n */\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n  get() {\n    return props.modelValue;\n  },\n  set(val) {\n    emit('update:modelValue', val);\n  },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n  visible: false,\n  url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n  validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n  errorMessage: () =>\n    props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n  validateRule: () => fileTypesValid.value,\n  errorMessage: () =>\n    t('ds.components.base.image_picker.file_types_valid', {\n      types: allowedTypes.value,\n    }),\n};\nconst validateFileSizeValid: ValidationRule = {\n  validateRule: () => fileSizeValid.value,\n  errorMessage: () =>\n    t('ds.components.base.image_picker.file_size_valid', {\n      size: props.maxFileSize,\n    }),\n};\nconst vRules = computed(() => {\n  let result: ValidationRule[] = [];\n\n  if (props.required) {\n    result.push(validateRequired);\n  }\n  if (props.validationRules) {\n    result = result.concat(props.validationRules);\n  }\n  result.push(validateFileTypesValid);\n  result.push(validateFileSizeValid);\n\n  return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n  id.value,\n  value,\n  vRules.value,\n);\n__expose({ validate });\n\n/**\n * Methods\n */\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n  draggedIndex.value = index;\n  const target = e.target as HTMLDivElement;\n  target.classList.add('dragging');\n  e.dataTransfer!.effectAllowed = 'move';\n  e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n  const target = e.target as HTMLDivElement;\n  if (draggedIndex.value !== index) {\n    target.classList.add('dropped-target');\n  }\n};\nconst handleDragOver = (e: DragEvent) => {\n  // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n  e.preventDefault();\n  e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n  // When the draggable p element leaves the droptarget, reset the style\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n  e.preventDefault();\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dropped-target');\n  const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n  const draggedImg = value.value[draggedIndex];\n  value.value.splice(draggedIndex, 1);\n  value.value.splice(index, 0, draggedImg);\n\n  emit('change');\n  validate();\n};\nconst openFileDialog = () => {\n  inputRef.value?.click();\n};\nconst onChangeInput = (e: any) => {\n  let fileList: FileList = e.target.files || e.dataTransfer.files;\n  if (!fileList.length) {\n    return;\n  }\n  createFileImages(fileList);\n};\nconst createFileImages = (fileList: FileList) => {\n  Array.from(fileList).forEach((file) => {\n    fileTypesValid.value = FileImageTypes.includes(file.type);\n    fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n    if (fileTypesValid.value && fileSizeValid.value) {\n      let reader: any = new FileReader();\n\n      reader.onload = (f: any) => {\n        if (props.multiple) {\n          value.value.push({\n            url: f.target.result,\n            file,\n            type: file.type,\n          });\n        } else {\n          value.value.splice(0, 1, {\n            url: f.target.result,\n            file,\n            type: file.type,\n          });\n        }\n\n        emit('change');\n        validate();\n      };\n\n      reader.readAsDataURL(file);\n    } else {\n      validate();\n    }\n  });\n};\nconst removeFileImage = (e: Event, index: number) => {\n  e.stopPropagation();\n  value.value.splice(index, 1);\n\n  emit('change');\n  validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n  previewImage.value.url = item.url;\n  previewImage.value.visible = true;\n};\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n    _createVNode(BLabel, {\n      label: props.label\n    }, null, 8, [\"label\"]),\n    _createElementVNode(\"div\", _hoisted_2, [\n      (!_unref(isEmpty)(value.value))\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n            (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(value.value, (item, index) => {\n              return (_openBlock(), _createElementBlock(\"div\", {\n                key: index,\n                class: \"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n                draggable: \"true\",\n                onClick: ($event: any) => (preview(item)),\n                onDragend: handleDragEnd,\n                onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n                onDragleave: handleDragLeave,\n                onDragover: handleDragOver,\n                onDragstart: ($event: any) => (handleDragStart(index, $event)),\n                onDrop: ($event: any) => (handleDrop(index, $event))\n              }, [\n                _createElementVNode(\"img\", {\n                  src: item.url,\n                  alt: \"image\",\n                  class: \"ds-h-full ds-w-full ds-rounded-lg\"\n                }, null, 8, _hoisted_5),\n                _createVNode(BImagePickerCloseButton, {\n                  class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n                  onClick: (e) => removeFileImage(e, index)\n                }, null, 8, [\"onClick\"])\n              ], 40, _hoisted_4))\n            }), 128))\n          ]))\n        : _createCommentVNode(\"\", true),\n      _createElementVNode(\"div\", _hoisted_6, [\n        _createVNode(BButton, { onClick: openFileDialog }, {\n          default: _withCtx(() => [\n            _createTextVNode(_toDisplayString(_ctx.$t('ds.components.base.image_picker.select_image')), 1)\n          ]),\n          \"append-icon\": _withCtx(() => [\n            _hoisted_7\n          ]),\n          _: 1\n        }),\n        _createElementVNode(\"input\", {\n          ref_key: \"inputRef\",\n          ref: inputRef,\n          accept: allowedTypes.value,\n          multiple: props.multiple,\n          class: \"ds-hidden\",\n          type: \"file\",\n          onChange: onChangeInput\n        }, null, 40, _hoisted_8)\n      ])\n    ]),\n    (!props.hideDetails)\n      ? (_openBlock(), _createBlock(BErrorMessage, {\n          key: 0,\n          \"error-message\": _unref(validationResult).errorMessage(),\n          class: \"mt-1\"\n        }, null, 8, [\"error-message\"]))\n      : _createCommentVNode(\"\", true),\n    _createVNode(ImagePreview, {\n      modelValue: previewImage.value.visible,\n      \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((previewImage.value.visible) = $event)),\n      url: previewImage.value.url\n    }, null, 8, [\"modelValue\", \"url\"])\n  ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_createElementVNode","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","emit","props","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","onChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":"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"}

package/dist/design-system89.mjs

@@ -7,9 +7,9 @@ import { useValidationField as le } from "./design-system3.mjs";
 import se from "./design-system31.mjs";
 import re from "./design-system11.mjs";
 import oe from "./design-system30.mjs";
-import de from "./design-system97.mjs";
-import ne from "./design-system99.mjs";
-const ie = (n) => (Y("data-v-0ad5e718"), n = n(), Z(), n), ue = { class: "ds-w-full" }, ce = { class: "ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow" }, pe = {
+import de from "./design-system98.mjs";
+import ne from "./design-system103.mjs";
+const ie = (n) => (Y("data-v-91ede486"), n = n(), Z(), n), ue = { class: "ds-w-full" }, ce = { class: "ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow" }, pe = {
   key: 0,
   class: "ds-flex ds-flex-wrap ds-justify-center ds-gap-1"
 }, ge = ["onClick", "onDragenter", "onDragstart", "onDrop"], me = ["src"], ve = { class: "ds-flex ds-flex-wrap ds-justify-center" }, fe = /* @__PURE__ */ ie(() => /* @__PURE__ */ d("svg", {
@@ -31,7 +31,7 @@ const ie = (n) => (Y("data-v-0ad5e718"), n = n(), Z(), n), ue = { class: "ds-w-f
     requiredErrorMessage: { default: "" },
     validationRules: { default: void 0 }
   },
-  emits: ["update:modelValue", "change"],
+  emits: ["change", "update:modelValue"],
   setup(n, { expose: x, emit: g }) {
     const a = n, { t: h } = ee(), D = c(null), w = c(0), o = m({
       get() {

package/dist/design-system89.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system89.mjs","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-0ad5e718\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n  key: 0,\n  class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_7 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n  class: \"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t\",\n  viewBox: \"0 0 512 512\",\n  xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n  /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n/**\n * Props\n */\nexport interface Props {\n  inputId?: string;\n  modelValue: FileItemRead[];\n  label?: string;\n  multiple?: boolean;\n  maxFileSize?: number;\n  hideDetails?: boolean;\n  required?: boolean;\n  requiredErrorMessage?: string;\n  validationRules?: ValidationRule[];\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BImagePicker',\n  props: {\n    inputId: { default: '' },\n    modelValue: {},\n    label: { default: '' },\n    multiple: { type: Boolean, default: false },\n    maxFileSize: { default: 20 },\n    hideDetails: { type: Boolean, default: false },\n    required: { type: Boolean, default: false },\n    requiredErrorMessage: { default: '' },\n    validationRules: { default: undefined }\n  },\n  emits: ['update:modelValue', 'change'],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n/**\n * Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\n */\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n  get() {\n    return props.modelValue;\n  },\n  set(val) {\n    emit('update:modelValue', val);\n  },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n  visible: false,\n  url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n  validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n  errorMessage: () =>\n    props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n  validateRule: () => fileTypesValid.value,\n  errorMessage: () =>\n    t('ds.components.base.image_picker.file_types_valid', {\n      types: allowedTypes.value,\n    }),\n};\nconst validateFileSizeValid: ValidationRule = {\n  validateRule: () => fileSizeValid.value,\n  errorMessage: () =>\n    t('ds.components.base.image_picker.file_size_valid', {\n      size: props.maxFileSize,\n    }),\n};\nconst vRules = computed(() => {\n  let result: ValidationRule[] = [];\n\n  if (props.required) {\n    result.push(validateRequired);\n  }\n  if (props.validationRules) {\n    result = result.concat(props.validationRules);\n  }\n  result.push(validateFileTypesValid);\n  result.push(validateFileSizeValid);\n\n  return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n  id.value,\n  value,\n  vRules.value,\n);\n__expose({ validate });\n\n/**\n * Methods\n */\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n  draggedIndex.value = index;\n  const target = e.target as HTMLDivElement;\n  target.classList.add('dragging');\n  e.dataTransfer!.effectAllowed = 'move';\n  e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n  const target = e.target as HTMLDivElement;\n  if (draggedIndex.value !== index) {\n    target.classList.add('dropped-target');\n  }\n};\nconst handleDragOver = (e: DragEvent) => {\n  // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n  e.preventDefault();\n  e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n  // When the draggable p element leaves the droptarget, reset the style\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n  e.preventDefault();\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dropped-target');\n  const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n  const draggedImg = value.value[draggedIndex];\n  value.value.splice(draggedIndex, 1);\n  value.value.splice(index, 0, draggedImg);\n\n  emit('change');\n  validate();\n};\nconst openFileDialog = () => {\n  inputRef.value?.click();\n};\nconst onChangeInput = (e: any) => {\n  let fileList: FileList = e.target.files || e.dataTransfer.files;\n  if (!fileList.length) {\n    return;\n  }\n  createFileImages(fileList);\n};\nconst createFileImages = (fileList: FileList) => {\n  Array.from(fileList).forEach((file) => {\n    fileTypesValid.value = FileImageTypes.includes(file.type);\n    fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n    if (fileTypesValid.value && fileSizeValid.value) {\n      let reader: any = new FileReader();\n\n      reader.onload = (f: any) => {\n        if (props.multiple) {\n          value.value.push({\n            url: f.target.result,\n            file,\n            type: file.type,\n          });\n        } else {\n          value.value.splice(0, 1, {\n            url: f.target.result,\n            file,\n            type: file.type,\n          });\n        }\n\n        emit('change');\n        validate();\n      };\n\n      reader.readAsDataURL(file);\n    } else {\n      validate();\n    }\n  });\n};\nconst removeFileImage = (e: Event, index: number) => {\n  e.stopPropagation();\n  value.value.splice(index, 1);\n\n  emit('change');\n  validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n  previewImage.value.url = item.url;\n  previewImage.value.visible = true;\n};\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n    _createVNode(BLabel, {\n      label: props.label\n    }, null, 8, [\"label\"]),\n    _createElementVNode(\"div\", _hoisted_2, [\n      (!_unref(isEmpty)(value.value))\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n            (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(value.value, (item, index) => {\n              return (_openBlock(), _createElementBlock(\"div\", {\n                key: index,\n                class: \"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n                draggable: \"true\",\n                onClick: ($event: any) => (preview(item)),\n                onDragend: handleDragEnd,\n                onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n                onDragleave: handleDragLeave,\n                onDragover: handleDragOver,\n                onDragstart: ($event: any) => (handleDragStart(index, $event)),\n                onDrop: ($event: any) => (handleDrop(index, $event))\n              }, [\n                _createElementVNode(\"img\", {\n                  src: item.url,\n                  alt: \"image\",\n                  class: \"ds-h-full ds-w-full ds-rounded-lg\"\n                }, null, 8, _hoisted_5),\n                _createVNode(BImagePickerCloseButton, {\n                  class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n                  onClick: (e) => removeFileImage(e, index)\n                }, null, 8, [\"onClick\"])\n              ], 40, _hoisted_4))\n            }), 128))\n          ]))\n        : _createCommentVNode(\"\", true),\n      _createElementVNode(\"div\", _hoisted_6, [\n        _createVNode(BButton, { onClick: openFileDialog }, {\n          default: _withCtx(() => [\n            _createTextVNode(_toDisplayString(_ctx.$t('ds.components.base.image_picker.select_image')), 1)\n          ]),\n          \"append-icon\": _withCtx(() => [\n            _hoisted_7\n          ]),\n          _: 1\n        }),\n        _createElementVNode(\"input\", {\n          ref_key: \"inputRef\",\n          ref: inputRef,\n          accept: allowedTypes.value,\n          multiple: props.multiple,\n          class: \"ds-hidden\",\n          type: \"file\",\n          onChange: onChangeInput\n        }, null, 40, _hoisted_8)\n      ])\n    ]),\n    (!props.hideDetails)\n      ? (_openBlock(), _createBlock(BErrorMessage, {\n          key: 0,\n          \"error-message\": _unref(validationResult).errorMessage(),\n          class: \"mt-1\"\n        }, null, 8, [\"error-message\"]))\n      : _createCommentVNode(\"\", true),\n    _createVNode(ImagePreview, {\n      modelValue: previewImage.value.visible,\n      \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((previewImage.value.visible) = $event)),\n      url: previewImage.value.url\n    }, null, 8, [\"modelValue\", \"url\"])\n  ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_createElementVNode","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","emit","props","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","onChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":"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"}
+{"version":3,"file":"design-system89.mjs","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-91ede486\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n  key: 0,\n  class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_7 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n  class: \"ds-absolute -ds-bottom-[3px] ds-left-0 ds-h-4 ds-w-4 ds-fill-primary-t\",\n  viewBox: \"0 0 512 512\",\n  xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n  /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n/**\n * Props\n */\nexport interface Props {\n  inputId?: string;\n  modelValue: FileItemRead[];\n  label?: string;\n  multiple?: boolean;\n  maxFileSize?: number;\n  hideDetails?: boolean;\n  required?: boolean;\n  requiredErrorMessage?: string;\n  validationRules?: ValidationRule[];\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BImagePicker',\n  props: {\n    inputId: { default: '' },\n    modelValue: {},\n    label: { default: '' },\n    multiple: { type: Boolean, default: false },\n    maxFileSize: { default: 20 },\n    hideDetails: { type: Boolean, default: false },\n    required: { type: Boolean, default: false },\n    requiredErrorMessage: { default: '' },\n    validationRules: { default: undefined }\n  },\n  emits: [\"change\", \"update:modelValue\"],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n/**\n * Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\n */\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n  get() {\n    return props.modelValue;\n  },\n  set(val) {\n    emit('update:modelValue', val);\n  },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n  visible: false,\n  url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n  validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n  errorMessage: () =>\n    props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n  validateRule: () => fileTypesValid.value,\n  errorMessage: () =>\n    t('ds.components.base.image_picker.file_types_valid', {\n      types: allowedTypes.value,\n    }),\n};\nconst validateFileSizeValid: ValidationRule = {\n  validateRule: () => fileSizeValid.value,\n  errorMessage: () =>\n    t('ds.components.base.image_picker.file_size_valid', {\n      size: props.maxFileSize,\n    }),\n};\nconst vRules = computed(() => {\n  let result: ValidationRule[] = [];\n\n  if (props.required) {\n    result.push(validateRequired);\n  }\n  if (props.validationRules) {\n    result = result.concat(props.validationRules);\n  }\n  result.push(validateFileTypesValid);\n  result.push(validateFileSizeValid);\n\n  return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n  id.value,\n  value,\n  vRules.value,\n);\n__expose({ validate });\n\n/**\n * Methods\n */\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n  draggedIndex.value = index;\n  const target = e.target as HTMLDivElement;\n  target.classList.add('dragging');\n  e.dataTransfer!.effectAllowed = 'move';\n  e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n  const target = e.target as HTMLDivElement;\n  if (draggedIndex.value !== index) {\n    target.classList.add('dropped-target');\n  }\n};\nconst handleDragOver = (e: DragEvent) => {\n  // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n  e.preventDefault();\n  e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n  // When the draggable p element leaves the droptarget, reset the style\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n  e.preventDefault();\n  const target = e.target as HTMLDivElement;\n  target.classList.remove('dropped-target');\n  const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n  const draggedImg = value.value[draggedIndex];\n  value.value.splice(draggedIndex, 1);\n  value.value.splice(index, 0, draggedImg);\n\n  emit('change');\n  validate();\n};\nconst openFileDialog = () => {\n  inputRef.value?.click();\n};\nconst onChangeInput = (e: any) => {\n  let fileList: FileList = e.target.files || e.dataTransfer.files;\n  if (!fileList.length) {\n    return;\n  }\n  createFileImages(fileList);\n};\nconst createFileImages = (fileList: FileList) => {\n  Array.from(fileList).forEach((file) => {\n    fileTypesValid.value = FileImageTypes.includes(file.type);\n    fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n    if (fileTypesValid.value && fileSizeValid.value) {\n      let reader: any = new FileReader();\n\n      reader.onload = (f: any) => {\n        if (props.multiple) {\n          value.value.push({\n            url: f.target.result,\n            file,\n            type: file.type,\n          });\n        } else {\n          value.value.splice(0, 1, {\n            url: f.target.result,\n            file,\n            type: file.type,\n          });\n        }\n\n        emit('change');\n        validate();\n      };\n\n      reader.readAsDataURL(file);\n    } else {\n      validate();\n    }\n  });\n};\nconst removeFileImage = (e: Event, index: number) => {\n  e.stopPropagation();\n  value.value.splice(index, 1);\n\n  emit('change');\n  validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n  previewImage.value.url = item.url;\n  previewImage.value.visible = true;\n};\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n    _createVNode(BLabel, {\n      label: props.label\n    }, null, 8, [\"label\"]),\n    _createElementVNode(\"div\", _hoisted_2, [\n      (!_unref(isEmpty)(value.value))\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n            (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(value.value, (item, index) => {\n              return (_openBlock(), _createElementBlock(\"div\", {\n                key: index,\n                class: \"draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n                draggable: \"true\",\n                onClick: ($event: any) => (preview(item)),\n                onDragend: handleDragEnd,\n                onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n                onDragleave: handleDragLeave,\n                onDragover: handleDragOver,\n                onDragstart: ($event: any) => (handleDragStart(index, $event)),\n                onDrop: ($event: any) => (handleDrop(index, $event))\n              }, [\n                _createElementVNode(\"img\", {\n                  src: item.url,\n                  alt: \"image\",\n                  class: \"ds-h-full ds-w-full ds-rounded-lg\"\n                }, null, 8, _hoisted_5),\n                _createVNode(BImagePickerCloseButton, {\n                  class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n                  onClick: (e) => removeFileImage(e, index)\n                }, null, 8, [\"onClick\"])\n              ], 40, _hoisted_4))\n            }), 128))\n          ]))\n        : _createCommentVNode(\"\", true),\n      _createElementVNode(\"div\", _hoisted_6, [\n        _createVNode(BButton, { onClick: openFileDialog }, {\n          default: _withCtx(() => [\n            _createTextVNode(_toDisplayString(_ctx.$t('ds.components.base.image_picker.select_image')), 1)\n          ]),\n          \"append-icon\": _withCtx(() => [\n            _hoisted_7\n          ]),\n          _: 1\n        }),\n        _createElementVNode(\"input\", {\n          ref_key: \"inputRef\",\n          ref: inputRef,\n          accept: allowedTypes.value,\n          multiple: props.multiple,\n          class: \"ds-hidden\",\n          type: \"file\",\n          onChange: onChangeInput\n        }, null, 40, _hoisted_8)\n      ])\n    ]),\n    (!props.hideDetails)\n      ? (_openBlock(), _createBlock(BErrorMessage, {\n          key: 0,\n          \"error-message\": _unref(validationResult).errorMessage(),\n          class: \"mt-1\"\n        }, null, 8, [\"error-message\"]))\n      : _createCommentVNode(\"\", true),\n    _createVNode(ImagePreview, {\n      modelValue: previewImage.value.visible,\n      \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((previewImage.value.visible) = $event)),\n      url: previewImage.value.url\n    }, null, 8, [\"modelValue\", \"url\"])\n  ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_createElementVNode","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","emit","props","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","onChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":";;;;;;;;;;;AAGA,MAAMA,KAAe,QAAMC,EAAa,iBAAiB,GAAE,IAAE,KAAIC,KAAc,IACzEC,KAAa,EAAE,OAAO,eACtBC,KAAa,EAAE,OAAO,2EACtBC,KAAa;AAAA,EACjB,KAAK;AAAA,EACL,OAAO;AACT,GACMC,KAAa,CAAC,WAAW,eAAe,eAAe,QAAQ,GAC/DC,KAAa,CAAC,KAAK,GACnBC,KAAa,EAAE,OAAO,4CACtBC,KAA2B,gBAAAT,GAAa,MAAmBU,gBAAAA,EAAoB,OAAO;AAAA,EAC1F,OAAO;AAAA,EACP,SAAS;AAAA,EACT,OAAO;AACT,GAAG;AAAA,EACgCA,gBAAAA,EAAA,QAAQ,EAAE,GAAG,ygBAAygB;AACzjB,GAAG,EAAE,CAAC,GACAC,KAAa,CAAC,UAAU,UAAU,GA+BZC,KAAiBC,gBAAAA,EAAA;AAAA,EAC3C,QAAQ;AAAA,EACR,OAAO;AAAA,IACL,SAAS,EAAE,SAAS,GAAG;AAAA,IACvB,YAAY,CAAC;AAAA,IACb,OAAO,EAAE,SAAS,GAAG;AAAA,IACrB,UAAU,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC1C,aAAa,EAAE,SAAS,GAAG;AAAA,IAC3B,aAAa,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC7C,UAAU,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC1C,sBAAsB,EAAE,SAAS,GAAG;AAAA,IACpC,iBAAiB,EAAE,SAAS,OAAU;AAAA,EACxC;AAAA,EACA,OAAO,CAAC,UAAU,mBAAmB;AAAA,EACrC,MAAMC,GAAc,EAAE,QAAQC,GAAU,MAAAC,KAAQ;AAElD,UAAMC,IAAQH,GAeR,EAAE,GAAAI,MAAMC,MACRC,IAAWC,EAA6B,IAAI,GAC5CC,IAAeD,EAAI,CAAC,GACpBE,IAAQC,EAAS;AAAA,MACrB,MAAM;AACJ,eAAOP,EAAM;AAAA,MACf;AAAA,MACA,IAAIQ,GAAK;AACP,QAAAT,EAAK,qBAAqBS,CAAG;AAAA,MAC/B;AAAA,IAAA,CACD,GACKC,IAAiBL,EAAI,EAAI,GACzBM,IAAgBN,EAAI,EAAI,GACxBO,IAAeP,EAAI;AAAA,MACvB,SAAS;AAAA,MACT,KAAK;AAAA,IAAA,CACN,GACKQ,IAAeL,EAAS,MAAMM,EAAe,KAAK,IAAI,CAAC,GACvDC,IAAKP,EAAS,MAAMP,EAAM,WAAW,MAAMe,IAAM,EAAE,GACnDC,IAAmC;AAAA,MACvC,cAAc,CAACR,MAAwB,CAAC,CAACA,KAAOA,EAAI,SAAS;AAAA,MAC7D,cAAc,MACZR,EAAM,wBAAwBC,EAAE,0BAA0B;AAAA,IAAA,GAExDgB,IAAyC;AAAA,MAC7C,cAAc,MAAMR,EAAe;AAAA,MACnC,cAAc,MACZR,EAAE,oDAAoD;AAAA,QACpD,OAAOW,EAAa;AAAA,MAAA,CACrB;AAAA,IAAA,GAECM,IAAwC;AAAA,MAC5C,cAAc,MAAMR,EAAc;AAAA,MAClC,cAAc,MACZT,EAAE,mDAAmD;AAAA,QACnD,MAAMD,EAAM;AAAA,MAAA,CACb;AAAA,IAAA,GAECmB,IAASZ,EAAS,MAAM;AAC5B,UAAIa,IAA2B,CAAA;AAE/B,aAAIpB,EAAM,YACRoB,EAAO,KAAKJ,CAAgB,GAE1BhB,EAAM,oBACCoB,IAAAA,EAAO,OAAOpB,EAAM,eAAe,IAE9CoB,EAAO,KAAKH,CAAsB,GAClCG,EAAO,KAAKF,CAAqB,GAE1BE,EAAO,SAASA,IAAS;AAAA,IAAA,CACjC,GACK,EAAE,UAAAC,GAAU,kBAAAC,EAAA,IAAqBC;AAAA,MACrCT,EAAG;AAAA,MACHR;AAAA,MACAa,EAAO;AAAA,IAAA;AAEA,IAAArB,EAAA,EAAE,UAAAuB,GAAU;AAMf,UAAAG,IAAkB,CAACC,GAAeC,MAAiB;AACvD,MAAArB,EAAa,QAAQoB,GACNC,EAAE,OACV,UAAU,IAAI,UAAU,GAC/BA,EAAE,aAAc,gBAAgB,QAChCA,EAAE,aAAc,QAAQ,SAASD,EAAM,UAAU;AAAA,IAAA,GAE7CE,IAAgB,CAAC,MAAiB;AAE/B,MADQ,EAAE,OACV,UAAU,OAAO,UAAU;AAAA,IAAA,GAG9BC,IAAkB,CAACH,GAAeC,MAAiB;AACvD,YAAMG,IAASH,EAAE;AACb,MAAArB,EAAa,UAAUoB,KAClBI,EAAA,UAAU,IAAI,gBAAgB;AAAA,IACvC,GAEIC,IAAiB,CAAC,MAAiB;AAEvC,QAAE,eAAe,GACjB,EAAE,aAAc,aAAa;AAAA,IAAA,GAEzBC,IAAkB,CAAC,MAAiB;AAGjC,MADQ,EAAE,OACV,UAAU,OAAO,gBAAgB;AAAA,IAAA,GAEpCC,IAAa,CAACP,GAAeC,MAAiB;AAClD,MAAAA,EAAE,eAAe,GACFA,EAAE,OACV,UAAU,OAAO,gBAAgB;AACxC,YAAMrB,IAAe,SAASqB,EAAE,aAAc,QAAQ,OAAO,CAAC,GACxDO,IAAa3B,EAAM,MAAMD,CAAY;AACrC,MAAAC,EAAA,MAAM,OAAOD,GAAc,CAAC,GAClCC,EAAM,MAAM,OAAOmB,GAAO,GAAGQ,CAAU,GAEvClC,EAAK,QAAQ,GACJsB;IAAA,GAELa,IAAiB,MAAM;;AAC3B,OAAAC,IAAAhC,EAAS,UAAT,QAAAgC,EAAgB;AAAA,IAAM,GAElBC,IAAgB,CAAC,MAAW;AAChC,UAAIC,IAAqB,EAAE,OAAO,SAAS,EAAE,aAAa;AACtD,MAACA,EAAS,UAGdC,EAAiBD,CAAQ;AAAA,IAAA,GAErBC,IAAmB,CAACD,MAAuB;AAC/C,YAAM,KAAKA,CAAQ,EAAE,QAAQ,CAACE,MAAS;AAIjC,YAHJ9B,EAAe,QAAQI,EAAe,SAAS0B,EAAK,IAAI,GACxD7B,EAAc,QAAQ8B,EAAYD,EAAK,IAAI,KAAKvC,EAAM,aAElDS,EAAe,SAASC,EAAc,OAAO;AAC3C,cAAA+B,IAAc,IAAI;AAEf,UAAAA,EAAA,SAAS,CAACC,MAAW;AAC1B,YAAI1C,EAAM,WACRM,EAAM,MAAM,KAAK;AAAA,cACf,KAAKoC,EAAE,OAAO;AAAA,cACd,MAAAH;AAAA,cACA,MAAMA,EAAK;AAAA,YAAA,CACZ,IAEKjC,EAAA,MAAM,OAAO,GAAG,GAAG;AAAA,cACvB,KAAKoC,EAAE,OAAO;AAAA,cACd,MAAAH;AAAA,cACA,MAAMA,EAAK;AAAA,YAAA,CACZ,GAGHxC,EAAK,QAAQ,GACJsB;UAAA,GAGXoB,EAAO,cAAcF,CAAI;AAAA,QAAA;AAEhB,UAAAlB;MACX,CACD;AAAA,IAAA,GAEGsB,IAAkB,CAAC,GAAUlB,MAAkB;AACnD,QAAE,gBAAgB,GACZnB,EAAA,MAAM,OAAOmB,GAAO,CAAC,GAE3B1B,EAAK,QAAQ,GACJsB;IAAA,GAELmB,IAAc,CAACI,MAA0BA,IAAgB,QAAQ,GACjEC,IAAU,CAACC,MAAuB;AACzB,MAAAnC,EAAA,MAAM,MAAMmC,EAAK,KAC9BnC,EAAa,MAAM,UAAU;AAAA,IAAA;AAGxB,WAAA,CAACoC,GAAUC,OACRC,EAAW,GAAGC,EAAoB,OAAOhE,IAAY;AAAA,MAC3DiE,EAAaC,IAAQ;AAAA,QACnB,OAAOpD,EAAM;AAAA,MACZ,GAAA,MAAM,GAAG,CAAC,OAAO,CAAC;AAAA,MACrBP,EAAoB,OAAON,IAAY;AAAA,QACnCkE,EAAOC,EAAO,EAAEhD,EAAM,KAAK,IA2BzBiD,EAAoB,IAAI,EAAI,KA1B3BN,KAAcC,EAAoB,OAAO9D,IAAY;AAAA,WACnD6D,EAAW,EAAI,GAAGC,EAAoBM,GAAW,MAAMC,EAAYnD,EAAM,OAAO,CAACwC,GAAMrB,OAC9EwB,EAAA,GAAcC,EAAoB,OAAO;AAAA,YAC/C,KAAKzB;AAAA,YACL,OAAO;AAAA,YACP,WAAW;AAAA,YACX,SAAS,CAACiC,MAAiBb,EAAQC,CAAI;AAAA,YACvC,WAAWnB;AAAA,YACX,aAAa,CAAC+B,MAAiB9B,EAAgBH,GAAOiC,CAAM;AAAA,YAC5D,aAAa3B;AAAA,YACb,YAAYD;AAAA,YACZ,aAAa,CAAC4B,MAAiBlC,EAAgBC,GAAOiC,CAAM;AAAA,YAC5D,QAAQ,CAACA,MAAiB1B,EAAWP,GAAOiC,CAAM;AAAA,UAAA,GACjD;AAAA,YACDjE,EAAoB,OAAO;AAAA,cACzB,KAAKqD,EAAK;AAAA,cACV,KAAK;AAAA,cACL,OAAO;AAAA,YAAA,GACN,MAAM,GAAGxD,EAAU;AAAA,YACtB6D,EAAaQ,IAAyB;AAAA,cACpC,OAAO;AAAA,cACP,SAAS,CAACjC,MAAMiB,EAAgBjB,GAAGD,CAAK;AAAA,YACvC,GAAA,MAAM,GAAG,CAAC,SAAS,CAAC;AAAA,UAAA,GACtB,IAAIpC,EAAU,EAClB,GAAG,GAAG;AAAA,QAAA,CACR;AAAA,QAELI,EAAoB,OAAOF,IAAY;AAAA,UACrC4D,EAAaS,IAAS,EAAE,SAAS1B,KAAkB;AAAA,YACjD,SAAS2B,EAAS,MAAM;AAAA,cACtBC,EAAiBC,EAAiBhB,EAAK,GAAG,8CAA8C,CAAC,GAAG,CAAC;AAAA,YAAA,CAC9F;AAAA,YACD,eAAec,EAAS,MAAM;AAAA,cAC5BrE;AAAA,YAAA,CACD;AAAA,YACD,GAAG;AAAA,UAAA,CACJ;AAAA,UACDC,EAAoB,SAAS;AAAA,YAC3B,SAAS;AAAA,YACT,KAAKU;AAAA,YACL,QAAQS,EAAa;AAAA,YACrB,UAAUZ,EAAM;AAAA,YAChB,OAAO;AAAA,YACP,MAAM;AAAA,YACN,UAAUoC;AAAA,UAAA,GACT,MAAM,IAAI1C,EAAU;AAAA,QAAA,CACxB;AAAA,MAAA,CACF;AAAA,MACCM,EAAM,cAMJuD,EAAoB,IAAI,EAAI,KAL3BN,EAAW,GAAGe,EAAaC,IAAe;AAAA,QACzC,KAAK;AAAA,QACL,iBAAiBZ,EAAO/B,CAAgB,EAAE,aAAa;AAAA,QACvD,OAAO;AAAA,MAAA,GACN,MAAM,GAAG,CAAC,eAAe,CAAC;AAAA,MAEjC6B,EAAae,IAAc;AAAA,QACzB,YAAYvD,EAAa,MAAM;AAAA,QAC/B,uBAAuBqC,EAAO,CAAC,MAAMA,EAAO,CAAC,IAAI,CAACU,MAAkB/C,EAAa,MAAM,UAAW+C;AAAA,QAClG,KAAK/C,EAAa,MAAM;AAAA,SACvB,MAAM,GAAG,CAAC,cAAc,KAAK,CAAC;AAAA,IAAA,CAClC;AAAA,EAEH;AAEA,CAAC;"}

package/dist/design-system97.js

@@ -1,2 +1,2 @@
-"use strict";const c=require("./design-system105.js"),u=require("./design-system106.js"),a=require("./design-system107.js");function x(n,e,t){if(c.randomUUID&&!e&&!n)return c.randomUUID();n=n||{};const r=n.random||(n.rng||u)();if(r[6]=r[6]&15|64,r[8]=r[8]&63|128,e){t=t||0;for(let i=0;i<16;++i)e[t+i]=r[i];return e}return a.unsafeStringify(r)}module.exports=x;
+"use strict";const l=require("vue"),k=["disabled"],w=l.defineComponent({__name:"BOtpFieldBox",props:{value:{default:""},focus:{type:Boolean,default:!1},isDisabled:{type:Boolean,default:!1}},emits:["on-change","on-keydown","on-keyup","on-paste","on-focus","on-blur"],setup(c,{expose:d,emit:t}){const u=c,n=l.ref(u.value||""),o=l.ref(null),a=["0","1","2","3","4","5","6","7","8","9"],r=()=>{if(!a.includes(n.value)){n.value="";return}return n.value=n.value.toString(),n.value.length>1&&(n.value=n.value.slice(0,1)),t("on-change",n.value)},i=e=>{u.isDisabled&&e.preventDefault();const s=e;["Alt","Control","Meta","Backspace","ArrowLeft","ArrowRight","v",...a].includes(s.key)?t("on-keydown",e):s.preventDefault()},f=e=>{t("on-keyup",e)},p=e=>{t("on-paste",e)},v=()=>(o.value.select(),t("on-focus")),h=()=>t("on-blur"),y=()=>{o.value.focus(),o.value.select()};return l.watch(()=>u.value,(e,s)=>{e!==s&&(n.value=e)}),l.watch(()=>u.focus,(e,s)=>{s!==e&&o.value&&u.focus&&(o.value.focus(),o.value.select())}),l.onMounted(()=>{o.value&&u.focus&&(o.value.focus(),o.value.select())}),d({focus:y}),(e,s)=>l.withDirectives((l.openBlock(),l.createElementBlock("input",{ref_key:"inputRef",ref:o,"onUpdate:modelValue":s[0]||(s[0]=g=>n.value=g),disabled:e.isDisabled,class:"ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200",inputmode:"numeric",maxlength:"1",onBlur:h,onFocus:v,onInput:r,onKeydown:i,onKeyup:f,onPaste:p},null,40,k)),[[l.vModelText,n.value]])}});module.exports=w;
 //# sourceMappingURL=design-system97.js.map

package/dist/design-system97.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system97.js","sources":["../node_modules/uuid/dist/esm-browser/v4.js"],"sourcesContent":["import native from './native.js';\nimport rng from './rng.js';\nimport { unsafeStringify } from './stringify.js';\n\nfunction v4(options, buf, offset) {\n  if (native.randomUUID && !buf && !options) {\n    return native.randomUUID();\n  }\n\n  options = options || {};\n  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`\n\n  rnds[6] = rnds[6] & 0x0f | 0x40;\n  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided\n\n  if (buf) {\n    offset = offset || 0;\n\n    for (let i = 0; i < 16; ++i) {\n      buf[offset + i] = rnds[i];\n    }\n\n    return buf;\n  }\n\n  return unsafeStringify(rnds);\n}\n\nexport default v4;"],"names":["v4","options","buf","offset","native","rnds","rng","unsafeStringify"],"mappings":"4HAIA,SAASA,EAAGC,EAASC,EAAKC,EAAQ,CAChC,GAAIC,EAAO,YAAc,CAACF,GAAO,CAACD,EAChC,OAAOG,EAAO,aAGhBH,EAAUA,GAAW,GACrB,MAAMI,EAAOJ,EAAQ,SAAWA,EAAQ,KAAOK,KAK/C,GAHAD,EAAK,CAAC,EAAIA,EAAK,CAAC,EAAI,GAAO,GAC3BA,EAAK,CAAC,EAAIA,EAAK,CAAC,EAAI,GAAO,IAEvBH,EAAK,CACPC,EAASA,GAAU,EAEnB,QAAS,EAAI,EAAG,EAAI,GAAI,EAAE,EACxBD,EAAIC,EAAS,CAAC,EAAIE,EAAK,CAAC,EAG1B,OAAOH,CACR,CAED,OAAOK,EAAAA,gBAAgBF,CAAI,CAC7B","x_google_ignoreList":[0]}
+{"version":3,"file":"design-system97.js","sources":["../src/components/BOtpField/BOtpFieldBox.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { vModelText as _vModelText, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = [\"disabled\"]\n\nimport { onMounted, ref, type Ref, watch } from 'vue';\n\n/**\n * Props\n */\nexport interface Props {\n  value?: string;\n  focus?: boolean;\n  isDisabled?: boolean;\n}\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BOtpFieldBox',\n  props: {\n    value: { default: '' },\n    focus: { type: Boolean, default: false },\n    isDisabled: { type: Boolean, default: false }\n  },\n  emits: [\"on-change\", \"on-keydown\", \"on-keyup\", \"on-paste\", \"on-focus\", \"on-blur\"],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n\n\n/**\n * Events\n */\n\n\n/**\n * Data\n */\nconst model = ref(props.value || '');\nconst inputRef = ref<HTMLInputElement | null>(null) as Ref<HTMLInputElement>;\nconst digits = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];\n\n/**\n * Methods\n */\nconst handleOnChange = () => {\n  if (!digits.includes(model.value)) {\n    model.value = '';\n    return;\n  }\n\n  model.value = model.value.toString();\n  if (model.value.length > 1) {\n    model.value = model.value.slice(0, 1);\n  }\n  return emit('on-change', model.value);\n};\n\nconst handleOnKeyDown = (event: KeyboardEvent) => {\n  if (props.isDisabled) {\n    event.preventDefault();\n  }\n  // Only allow characters 0-9, DEL, Backspace, Enter, Right and Left Arrows, and Pasting\n  const keyEvent = event;\n  if (\n    [\n      'Alt',\n      'Control',\n      'Meta',\n      'Backspace',\n      'ArrowLeft',\n      'ArrowRight',\n      'v',\n      ...digits,\n    ].includes(keyEvent.key)\n  ) {\n    emit('on-keydown', event);\n  } else {\n    keyEvent.preventDefault();\n  }\n};\nconst handleOnKeyUp = (event: KeyboardEvent) => {\n  emit('on-keyup', event);\n};\nconst handleOnPaste = (event: ClipboardEvent) => {\n  emit('on-paste', event);\n};\nconst handleOnFocus = () => {\n  inputRef.value.select();\n  return emit('on-focus');\n};\nconst handleOnBlur = () => emit('on-blur');\nconst focusFn = () => {\n  inputRef.value.focus();\n  inputRef.value.select();\n};\n\n/**\n * Watch\n */\nwatch(\n  () => props.value,\n  (newValue, oldValue) => {\n    if (newValue !== oldValue) {\n      model.value = newValue;\n    }\n  },\n);\nwatch(\n  () => props.focus,\n  (newFocusValue, oldFocusValue) => {\n    // Check if focusedInput changed\n    // Prevent calling function if input already in focus\n    if (oldFocusValue !== newFocusValue && inputRef.value && props.focus) {\n      inputRef.value.focus();\n      inputRef.value.select();\n    }\n  },\n);\n\n/**\n * Lifecycle Hooks\n */\nonMounted(() => {\n  if (inputRef.value && props.focus) {\n    inputRef.value.focus();\n    inputRef.value.select();\n  }\n});\n\n__expose({ focus: focusFn });\n\nreturn (_ctx: any,_cache: any) => {\n  return _withDirectives((_openBlock(), _createElementBlock(\"input\", {\n    ref_key: \"inputRef\",\n    ref: inputRef,\n    \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((model).value = $event)),\n    disabled: _ctx.isDisabled,\n    class: \"ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200\",\n    inputmode: \"numeric\",\n    maxlength: \"1\",\n    onBlur: handleOnBlur,\n    onFocus: handleOnFocus,\n    onInput: handleOnChange,\n    onKeydown: handleOnKeyDown,\n    onKeyup: handleOnKeyUp,\n    onPaste: handleOnPaste\n  }, null, 40, _hoisted_1)), [\n    [_vModelText, model.value]\n  ])\n}\n}\n\n})"],"names":["_hoisted_1","_sfc_main","_defineComponent","__props","__expose","emit","props","model","ref","inputRef","digits","handleOnChange","handleOnKeyDown","event","keyEvent","handleOnKeyUp","handleOnPaste","handleOnFocus","handleOnBlur","focusFn","watch","newValue","oldValue","newFocusValue","oldFocusValue","onMounted","_ctx","_cache","_withDirectives","_openBlock","_createElementBlock","$event","_vModelText"],"mappings":"oCAGMA,EAAa,CAAC,UAAU,EAaFC,EAAiBC,kBAAA,CAC3C,OAAQ,eACR,MAAO,CACL,MAAO,CAAE,QAAS,EAAG,EACrB,MAAO,CAAE,KAAM,QAAS,QAAS,EAAM,EACvC,WAAY,CAAE,KAAM,QAAS,QAAS,EAAM,CAC9C,EACA,MAAO,CAAC,YAAa,aAAc,WAAY,WAAY,WAAY,SAAS,EAChF,MAAMC,EAAc,CAAE,OAAQC,EAAU,KAAAC,GAAQ,CAElD,MAAMC,EAAQH,EAYRI,EAAQC,EAAA,IAAIF,EAAM,OAAS,EAAE,EAC7BG,EAAWD,MAA6B,IAAI,EAC5CE,EAAS,CAAC,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,GAAG,EAK1DC,EAAiB,IAAM,CAC3B,GAAI,CAACD,EAAO,SAASH,EAAM,KAAK,EAAG,CACjCA,EAAM,MAAQ,GACd,MACF,CAEM,OAAAA,EAAA,MAAQA,EAAM,MAAM,SAAS,EAC/BA,EAAM,MAAM,OAAS,IACvBA,EAAM,MAAQA,EAAM,MAAM,MAAM,EAAG,CAAC,GAE/BF,EAAK,YAAaE,EAAM,KAAK,CAAA,EAGhCK,EAAmBC,GAAyB,CAC5CP,EAAM,YACRO,EAAM,eAAe,EAGvB,MAAMC,EAAWD,EAEf,CACE,MACA,UACA,OACA,YACA,YACA,aACA,IACA,GAAGH,CAAA,EACH,SAASI,EAAS,GAAG,EAEvBT,EAAK,aAAcQ,CAAK,EAExBC,EAAS,eAAe,CAC1B,EAEIC,EAAiBF,GAAyB,CAC9CR,EAAK,WAAYQ,CAAK,CAAA,EAElBG,EAAiBH,GAA0B,CAC/CR,EAAK,WAAYQ,CAAK,CAAA,EAElBI,EAAgB,KACpBR,EAAS,MAAM,SACRJ,EAAK,UAAU,GAElBa,EAAe,IAAMb,EAAK,SAAS,EACnCc,EAAU,IAAM,CACpBV,EAAS,MAAM,QACfA,EAAS,MAAM,QAAO,EAMxBW,OAAAA,EAAA,MACE,IAAMd,EAAM,MACZ,CAACe,EAAUC,IAAa,CAClBD,IAAaC,IACff,EAAM,MAAQc,EAElB,CAAA,EAEFD,EAAA,MACE,IAAMd,EAAM,MACZ,CAACiB,EAAeC,IAAkB,CAG5BA,IAAkBD,GAAiBd,EAAS,OAASH,EAAM,QAC7DG,EAAS,MAAM,QACfA,EAAS,MAAM,SAEnB,CAAA,EAMFgB,EAAAA,UAAU,IAAM,CACVhB,EAAS,OAASH,EAAM,QAC1BG,EAAS,MAAM,QACfA,EAAS,MAAM,SACjB,CACD,EAEQL,EAAA,CAAE,MAAOe,CAAA,CAAS,EAEpB,CAACO,EAAUC,IACTC,kBAAiBC,EAAAA,YAAcC,EAAAA,mBAAoB,QAAS,CACjE,QAAS,WACT,IAAKrB,EACL,sBAAuBkB,EAAO,CAAC,IAAMA,EAAO,CAAC,EAAKI,GAAkBxB,EAAO,MAAQwB,GACnF,SAAUL,EAAK,WACf,MAAO,gHACP,UAAW,UACX,UAAW,IACX,OAAQR,EACR,QAASD,EACT,QAASN,EACT,UAAWC,EACX,QAASG,EACT,QAASC,CAAA,EACR,KAAM,GAAIhB,CAAU,GAAI,CACzB,CAACgC,EAAa,WAAAzB,EAAM,KAAK,CAAA,CAC1B,CAEH,CAEA,CAAC"}