@7pmlabs/design-system 0.4.4 → 0.4.5

package/dist/design-system22.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system22.js","sources":["../src/components/BSelect.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock, withCtx as _withCtx, createBlock as _createBlock, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, renderList as _renderList, Fragment as _Fragment, vShow as _vShow, withDirectives as _withDirectives, unref as _unref } from \"vue\"\n\nconst _hoisted_1 = /*#__PURE__*/_createElementVNode(\"path\", { d: \"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" }, null, -1)\nconst _hoisted_2 = [\n  _hoisted_1\n]\nconst _hoisted_3 = [\"id\", \"disabled\"]\nconst _hoisted_4 = { key: 0 }\nconst _hoisted_5 = {\n  key: 1,\n  class: \"ds-text-black/[0.4]\"\n}\nconst _hoisted_6 = /*#__PURE__*/_createElementVNode(\"path\", { d: \"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" }, null, -1)\nconst _hoisted_7 = [\n  _hoisted_6\n]\nconst _hoisted_8 = [\"id\", \"data-cy\", \"data-ut\"]\nconst _hoisted_9 = { class: \"ds-max-h-72 ds-overflow-y-auto ds-rounded-lg ds-bg-white ds-shadow\" }\nconst _hoisted_10 = { class: \"ds-py-1 ds-text-sm ds-text-black/[0.85]\" }\nconst _hoisted_11 = [\"onClick\"]\n\nimport {\n  useValidationField,\n  type ValidationRule,\n} from '@/composables/Validation';\nimport {\n  ensureVisiblePosition,\n  lockScrollBody,\n  resetPosition,\n  unlockScrollBody,\n} from '@/helpers/ComponentHelper';\nimport type { DisplayItem } from '@/types';\nimport { v4 as uuid } from 'uuid';\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  watch,\n} from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BErrorMessage from './BErrorMessage.vue';\nimport BLabel from './BLabel.vue';\nimport BTextField from './BTextField.vue';\n\n//#region Props\nexport interface BSelectProps {\n  inputId?: string;\n  modelValue: string | number;\n  label?: string;\n  items: DisplayItem[];\n  disabled?: boolean;\n  placeholder?: string;\n  valueCssClass?: string;\n  menuCssClass?: string;\n  /**\n   * Array of custom validation rules.\n   */\n  validationRules?: ValidationRule[];\n  /**\n   * Validate if the field is left empty.\n   */\n  required?: boolean;\n  requiredErrorMessage?: string;\n  /**\n   * Hide the validation error message.\n   */\n  hideDetails?: boolean;\n  /**\n   * Allow to type to search.\n   */\n  allowInput?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BSelect',\n  props: {\n    inputId: { default: '' },\n    modelValue: {},\n    label: { default: '' },\n    items: {},\n    disabled: { type: Boolean, default: false },\n    placeholder: { default: '' },\n    valueCssClass: { default: '' },\n    menuCssClass: { default: '' },\n    validationRules: { default: undefined },\n    required: { type: Boolean, default: false },\n    requiredErrorMessage: { default: '' },\n    hideDetails: { type: Boolean, default: false },\n    allowInput: { type: Boolean, default: false }\n  },\n  emits: [\"change\", \"open\", \"close\", \"change:input\", \"update:modelValue\"],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n\n//#endregion\n\n//#region Events\n\n//#endregion\n\n//#region Data\nconst selectEl = ref<HTMLElement | null>(null);\nconst inputRef = ref<InstanceType<typeof BTextField> | null>(null);\nconst selectMenuEl = ref<HTMLElement | null>(null);\nconst selectMenu = ref(false);\nconst { t } = useI18n();\nconst validateRequired: ValidationRule = {\n  validateRule: (val) => !!val,\n  errorMessage: () =>\n    props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst inputText = ref('');\nconst selectedItem = ref<DisplayItem>();\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst value = computed({\n  get() {\n    return props.modelValue;\n  },\n  set(val) {\n    emit('update:modelValue', val);\n  },\n});\nconst btnCssClass = computed(() => {\n  let result = `ds-border ds-drop-shadow-light ds-text-sm ds-h-[40px] ds-px-3 ds-rounded-lg ds-block ds-w-full ds-inline-flex ds-items-center ds-justify-between `;\n  result += props.disabled\n    ? `ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4] `\n    : `ds-bg-white ds-text-black/[0.85] `;\n  result += !validationResult.value.valid\n    ? `ds-border-error focus:ds-ring-1 focus:ds-ring-error `\n    : `ds-border-black/10 focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus `;\n\n  return result;\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\n  return result.length ? result : undefined;\n});\n\nconst { validate, validationResult } = useValidationField(\n  id.value,\n  value,\n  vRules.value,\n);\n//#endregion\n\n//#region Watchers\nwatch(selectMenu, (val) => {\n  if (val) {\n    lockScrollBody();\n    ensureMenuPosition();\n    emit('open');\n  } else {\n    unlockScrollBody();\n    resetMenuPosition();\n    emit('close');\n  }\n});\nwatch(value, () => {\n  ensureSelectedItem();\n  ensureInputText();\n});\nwatch(\n  () => props.items,\n  () => {\n    if (value.value && !selectedItem.value?.value) {\n      ensureSelectedItem();\n      ensureInputText();\n    }\n  },\n  {\n    deep: true,\n  },\n);\n//#endregion\n\n//#region Methods\nconst ensureSelectedItem = () => {\n  selectedItem.value = props.items.find((i) => i.value === value.value);\n};\nconst ensureInputText = () => {\n  if (props.allowInput) {\n    inputText.value = selectedItem.value?.text || '';\n  }\n};\nconst initPressEscapeEventListener = () => {\n  document.addEventListener('keydown', closeOnEscapePressed);\n};\nconst closeOnEscapePressed = (event: KeyboardEvent) => {\n  if (event.key === 'Escape') {\n    closeSelectMenu();\n  }\n};\nconst initClickOutsideEventListener = () => {\n  document.addEventListener('click', closeOnClickOutside);\n};\nconst closeOnClickOutside = (event: any) => {\n  const refs = [selectEl.value, selectMenuEl.value];\n  const withinBoundaries = refs.some((r) => event.composedPath().includes(r));\n  if (!withinBoundaries) {\n    closeSelectMenu();\n  }\n};\nconst onClickItem = (item: DisplayItem) => {\n  value.value = item.value;\n  closeSelectMenu();\n  emit('change', item.value);\n  nextTick(() => {\n    validate();\n  });\n};\nconst ensureMenuWidth = (parentEl: HTMLElement, menuEl: HTMLElement) => {\n  menuEl.style.width = `${parentEl.offsetWidth}px`;\n};\nconst ensureMenuPosition = () => {\n  nextTick(() => {\n    ensureVisiblePosition(selectEl.value!, selectMenuEl.value!);\n    ensureMenuWidth(selectEl.value!, selectMenuEl.value!);\n  });\n};\nconst resetMenuPosition = () => {\n  resetPosition(selectEl.value!, selectMenuEl.value!);\n};\nconst onChangeInputText = (text: string) => {\n  emit('change:input', text);\n};\nconst closeSelectMenu = () => {\n  selectMenu.value = false;\n  inputRef.value?.blur();\n  ensureInputText();\n};\nconst init = () => {\n  ensureSelectedItem();\n  ensureInputText();\n};\ninit();\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  initPressEscapeEventListener();\n  initClickOutsideEventListener();\n});\nonBeforeUnmount(() => {\n  document.removeEventListener('keydown', closeOnEscapePressed);\n  document.removeEventListener('click', closeOnClickOutside);\n  unlockScrollBody();\n  // Make sure dropdown menu unmounted with itself\n  resetMenuPosition();\n});\n//#endregion\n\n__expose({ validate, selectMenu });\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"selectEl\",\n      ref: selectEl\n    }, [\n      _createVNode(BLabel, {\n        id: id.value,\n        label: _ctx.label,\n        required: _ctx.required\n      }, null, 8, [\"id\", \"label\", \"required\"]),\n      (props.allowInput)\n        ? (_openBlock(), _createBlock(BTextField, {\n            key: 0,\n            id: id.value,\n            ref_key: \"inputRef\",\n            ref: inputRef,\n            modelValue: inputText.value,\n            \"onUpdate:modelValue\": [\n              _cache[0] || (_cache[0] = ($event: any) => ((inputText).value = $event)),\n              onChangeInputText\n            ],\n            disabled: props.disabled,\n            placeholder: props.placeholder,\n            \"hide-details\": \"\",\n            onFocus: _cache[1] || (_cache[1] = ($event: any) => (selectMenu.value = true)),\n            \"onClick:append\": _cache[2] || (_cache[2] = ($event: any) => (inputRef.value?.focus()))\n          }, {\n            appendIcon: _withCtx(() => [\n              (_openBlock(), _createElementBlock(\"svg\", {\n                class: _normalizeClass([[selectMenu.value ? 'ds-rotate-180' : ''], \"ds-h-4 ds-w-4 ds-transition-transform\"]),\n                viewBox: \"0 0 320 512\",\n                xmlns: \"http://www.w3.org/2000/svg\"\n              }, _hoisted_2, 2))\n            ]),\n            _: 1\n          }, 8, [\"id\", \"modelValue\", \"disabled\", \"placeholder\"]))\n        : (_openBlock(), _createElementBlock(\"button\", {\n            key: 1,\n            id: id.value,\n            class: _normalizeClass(btnCssClass.value),\n            disabled: props.disabled,\n            type: \"button\",\n            onClick: _cache[3] || (_cache[3] = ($event: any) => (selectMenu.value = !selectMenu.value))\n          }, [\n            _createElementVNode(\"span\", {\n              class: _normalizeClass([_ctx.valueCssClass, \"ds-truncate\"])\n            }, [\n              (selectedItem.value?.text)\n                ? (_openBlock(), _createElementBlock(\"span\", _hoisted_4, _toDisplayString(selectedItem.value?.text), 1))\n                : (_openBlock(), _createElementBlock(\"span\", _hoisted_5, _toDisplayString(props.placeholder), 1))\n            ], 2),\n            _createTextVNode(\"   \"),\n            (_openBlock(), _createElementBlock(\"svg\", {\n              class: _normalizeClass([[selectMenu.value ? 'ds-rotate-180' : ''], \"ds-h-4 ds-w-4 ds-transition-transform\"]),\n              viewBox: \"0 0 320 512\",\n              xmlns: \"http://www.w3.org/2000/svg\"\n            }, _hoisted_7, 2))\n          ], 10, _hoisted_3)),\n      _withDirectives(_createElementVNode(\"div\", {\n        id: `${id.value}Menu`,\n        ref_key: \"selectMenuEl\",\n        ref: selectMenuEl,\n        class: _normalizeClass([_ctx.menuCssClass, \"ds-absolute ds-z-50 ds-min-w-[8rem] ds-py-1\"]),\n        \"data-cy\": _ctx.$attrs['data-cy'] ? `${_ctx.$attrs['data-cy']}Menu` : undefined,\n        \"data-ut\": _ctx.$attrs['data-ut'] ? `${_ctx.$attrs['data-ut']}Menu` : undefined\n      }, [\n        _createElementVNode(\"div\", _hoisted_9, [\n          _createElementVNode(\"ul\", _hoisted_10, [\n            (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.items, (item, index) => {\n              return (_openBlock(), _createElementBlock(\"li\", {\n                key: `item${index}`,\n                class: \"ds-cursor-pointer\",\n                onClick: ($event: any) => (onClickItem(item))\n              }, [\n                _createElementVNode(\"a\", {\n                  class: _normalizeClass([\n                  item.cssClass +\n                  `${item.value === value.value ? ' ds-bg-gray-150' : ''}`\n                , \"ds-block ds-px-4 ds-py-2 hover:ds-bg-gray-150\"])\n                }, _toDisplayString(item?.text), 3)\n              ], 8, _hoisted_11))\n            }), 128))\n          ])\n        ])\n      ], 10, _hoisted_8), [\n        [_vShow, selectMenu.value]\n      ])\n    ], 512),\n    (!_ctx.hideDetails)\n      ? (_openBlock(), _createBlock(BErrorMessage, {\n          key: 0,\n          \"error-message\": _unref(validationResult).errorMessage(),\n          class: \"ds-mt-1\"\n        }, null, 8, [\"error-message\"]))\n      : _createCommentVNode(\"\", true)\n  ]))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_sfc_main","_defineComponent","__props","__expose","emit","props","selectEl","ref","inputRef","selectMenuEl","selectMenu","t","useI18n","validateRequired","val","inputText","selectedItem","id","computed","uuid","value","btnCssClass","result","validationResult","vRules","validate","useValidationField","watch","lockScrollBody","ensureMenuPosition","unlockScrollBody","resetMenuPosition","ensureSelectedItem","ensureInputText","_a","i","initPressEscapeEventListener","closeOnEscapePressed","event","closeSelectMenu","initClickOutsideEventListener","closeOnClickOutside","r","onClickItem","item","nextTick","ensureMenuWidth","parentEl","menuEl","ensureVisiblePosition","resetPosition","onChangeInputText","text","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","_createVNode","BLabel","_createBlock","BTextField","$event","_withCtx","_normalizeClass","_toDisplayString","_b","_createTextVNode","_withDirectives","_Fragment","_renderList","index","_vShow","_createCommentVNode","BErrorMessage","_unref"],"mappings":"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"}
+{"version":3,"file":"design-system22.js","sources":["../src/components/BSelect.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock, withCtx as _withCtx, createBlock as _createBlock, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, renderList as _renderList, Fragment as _Fragment, vShow as _vShow, withDirectives as _withDirectives, unref as _unref } from \"vue\"\n\nconst _hoisted_1 = /*#__PURE__*/_createElementVNode(\"path\", { d: \"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" }, null, -1)\nconst _hoisted_2 = [\n  _hoisted_1\n]\nconst _hoisted_3 = [\"id\", \"disabled\"]\nconst _hoisted_4 = { key: 0 }\nconst _hoisted_5 = {\n  key: 1,\n  class: \"ds-text-black/[0.4]\"\n}\nconst _hoisted_6 = /*#__PURE__*/_createElementVNode(\"path\", { d: \"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" }, null, -1)\nconst _hoisted_7 = [\n  _hoisted_6\n]\nconst _hoisted_8 = [\"id\", \"data-cy\", \"data-ut\"]\nconst _hoisted_9 = { class: \"ds-max-h-72 ds-overflow-y-auto ds-rounded-lg ds-bg-white ds-shadow\" }\nconst _hoisted_10 = { class: \"ds-py-1 ds-text-sm ds-text-black/[0.85]\" }\nconst _hoisted_11 = [\"onClick\"]\n\nimport {\n  useValidationField,\n  type ValidationRule,\n} from '@/composables/Validation';\nimport {\n  ensureVisiblePosition,\n  lockScrollBody,\n  resetPosition,\n  unlockScrollBody,\n} from '@/helpers/ComponentHelper';\nimport type { DisplayItem } from '@/types';\nimport { v4 as uuid } from 'uuid';\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  watch,\n} from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BErrorMessage from './BErrorMessage.vue';\nimport BLabel from './BLabel.vue';\nimport BTextField from './BTextField.vue';\n\n//#region Props\nexport interface BSelectProps {\n  inputId?: string;\n  modelValue: string | number;\n  label?: string;\n  items: DisplayItem[];\n  disabled?: boolean;\n  placeholder?: string;\n  valueCssClass?: string;\n  menuCssClass?: string;\n  /**\n   * Array of custom validation rules.\n   */\n  validationRules?: ValidationRule[];\n  /**\n   * Validate if the field is left empty.\n   */\n  required?: boolean;\n  requiredErrorMessage?: string;\n  /**\n   * Hide the validation error message.\n   */\n  hideDetails?: boolean;\n  /**\n   * Allow to type to search.\n   */\n  allowInput?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BSelect',\n  props: {\n    inputId: { default: '' },\n    modelValue: {},\n    label: { default: '' },\n    items: {},\n    disabled: { type: Boolean, default: false },\n    placeholder: { default: '' },\n    valueCssClass: { default: '' },\n    menuCssClass: { default: '' },\n    validationRules: { default: undefined },\n    required: { type: Boolean, default: false },\n    requiredErrorMessage: { default: '' },\n    hideDetails: { type: Boolean, default: false },\n    allowInput: { type: Boolean, default: false }\n  },\n  emits: [\"change\", \"open\", \"close\", \"change:input\", \"update:modelValue\"],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n\n//#endregion\n\n//#region Events\n\n//#endregion\n\n//#region Data\nconst selectEl = ref<HTMLElement | null>(null);\nconst inputRef = ref<InstanceType<typeof BTextField> | null>(null);\nconst selectMenuEl = ref<HTMLElement | null>(null);\nconst selectMenu = ref(false);\nconst { t } = useI18n();\nconst validateRequired: ValidationRule = {\n  validateRule: (val) => !!val,\n  errorMessage: () =>\n    props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst inputText = ref('');\nconst selectedItem = ref<DisplayItem>();\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst value = computed({\n  get() {\n    return props.modelValue;\n  },\n  set(val) {\n    emit('update:modelValue', val);\n  },\n});\nconst btnCssClass = computed(() => {\n  let result = `ds-border ds-drop-shadow-light ds-text-sm ds-h-[40px] ds-px-3 ds-rounded-lg ds-block ds-w-full ds-inline-flex ds-items-center ds-justify-between `;\n  result += props.disabled\n    ? `ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4] `\n    : `ds-bg-white ds-text-black/[0.85] `;\n  result += !validationResult.value.valid\n    ? `ds-border-error focus:ds-ring-1 focus:ds-ring-error `\n    : `ds-border-black/10 focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus `;\n\n  return result;\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\n  return result.length ? result : undefined;\n});\n\nconst { validate, validationResult } = useValidationField(\n  id.value,\n  value,\n  vRules.value,\n);\n//#endregion\n\n//#region Watchers\nwatch(selectMenu, (val) => {\n  if (val) {\n    lockScrollBody();\n    ensureMenuPosition();\n    emit('open');\n  } else {\n    unlockScrollBody();\n    resetMenuPosition();\n    emit('close');\n  }\n});\nwatch(value, () => {\n  ensureSelectedItem();\n  ensureInputText();\n});\nwatch(\n  () => props.items,\n  () => {\n    if (value.value && !selectedItem.value?.value) {\n      ensureSelectedItem();\n      ensureInputText();\n    }\n  },\n  {\n    deep: true,\n  },\n);\n//#endregion\n\n//#region Methods\nconst ensureSelectedItem = () => {\n  selectedItem.value = props.items?.find((i) => i.value === value.value);\n};\nconst ensureInputText = () => {\n  if (props.allowInput) {\n    inputText.value = selectedItem.value?.text || '';\n  }\n};\nconst initPressEscapeEventListener = () => {\n  document.addEventListener('keydown', closeOnEscapePressed);\n};\nconst closeOnEscapePressed = (event: KeyboardEvent) => {\n  if (event.key === 'Escape') {\n    closeSelectMenu();\n  }\n};\nconst initClickOutsideEventListener = () => {\n  document.addEventListener('click', closeOnClickOutside);\n};\nconst closeOnClickOutside = (event: any) => {\n  const refs = [selectEl.value, selectMenuEl.value];\n  const withinBoundaries = refs.some((r) => event.composedPath().includes(r));\n  if (!withinBoundaries) {\n    closeSelectMenu();\n  }\n};\nconst onClickItem = (item: DisplayItem) => {\n  value.value = item.value;\n  closeSelectMenu();\n  emit('change', item.value);\n  nextTick(() => {\n    validate();\n  });\n};\nconst ensureMenuWidth = (parentEl: HTMLElement, menuEl: HTMLElement) => {\n  menuEl.style.width = `${parentEl.offsetWidth}px`;\n};\nconst ensureMenuPosition = () => {\n  nextTick(() => {\n    ensureVisiblePosition(selectEl.value!, selectMenuEl.value!);\n    ensureMenuWidth(selectEl.value!, selectMenuEl.value!);\n  });\n};\nconst resetMenuPosition = () => {\n  resetPosition(selectEl.value!, selectMenuEl.value!);\n};\nconst onChangeInputText = (text: string) => {\n  emit('change:input', text);\n};\nconst closeSelectMenu = () => {\n  selectMenu.value = false;\n  inputRef.value?.blur();\n  ensureInputText();\n};\nconst init = () => {\n  ensureSelectedItem();\n  ensureInputText();\n};\ninit();\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  initPressEscapeEventListener();\n  initClickOutsideEventListener();\n});\nonBeforeUnmount(() => {\n  document.removeEventListener('keydown', closeOnEscapePressed);\n  document.removeEventListener('click', closeOnClickOutside);\n  unlockScrollBody();\n  // Make sure dropdown menu unmounted with itself\n  resetMenuPosition();\n});\n//#endregion\n\n__expose({ validate, selectMenu });\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"selectEl\",\n      ref: selectEl\n    }, [\n      _createVNode(BLabel, {\n        id: id.value,\n        label: _ctx.label,\n        required: _ctx.required\n      }, null, 8, [\"id\", \"label\", \"required\"]),\n      (props.allowInput)\n        ? (_openBlock(), _createBlock(BTextField, {\n            key: 0,\n            id: id.value,\n            ref_key: \"inputRef\",\n            ref: inputRef,\n            modelValue: inputText.value,\n            \"onUpdate:modelValue\": [\n              _cache[0] || (_cache[0] = ($event: any) => ((inputText).value = $event)),\n              onChangeInputText\n            ],\n            disabled: props.disabled,\n            placeholder: props.placeholder,\n            \"hide-details\": \"\",\n            onFocus: _cache[1] || (_cache[1] = ($event: any) => (selectMenu.value = true)),\n            \"onClick:append\": _cache[2] || (_cache[2] = ($event: any) => (inputRef.value?.focus()))\n          }, {\n            appendIcon: _withCtx(() => [\n              (_openBlock(), _createElementBlock(\"svg\", {\n                class: _normalizeClass([[selectMenu.value ? 'ds-rotate-180' : ''], \"ds-h-4 ds-w-4 ds-transition-transform\"]),\n                viewBox: \"0 0 320 512\",\n                xmlns: \"http://www.w3.org/2000/svg\"\n              }, _hoisted_2, 2))\n            ]),\n            _: 1\n          }, 8, [\"id\", \"modelValue\", \"disabled\", \"placeholder\"]))\n        : (_openBlock(), _createElementBlock(\"button\", {\n            key: 1,\n            id: id.value,\n            class: _normalizeClass(btnCssClass.value),\n            disabled: props.disabled,\n            type: \"button\",\n            onClick: _cache[3] || (_cache[3] = ($event: any) => (selectMenu.value = !selectMenu.value))\n          }, [\n            _createElementVNode(\"span\", {\n              class: _normalizeClass([_ctx.valueCssClass, \"ds-truncate\"])\n            }, [\n              (selectedItem.value?.text)\n                ? (_openBlock(), _createElementBlock(\"span\", _hoisted_4, _toDisplayString(selectedItem.value?.text), 1))\n                : (_openBlock(), _createElementBlock(\"span\", _hoisted_5, _toDisplayString(props.placeholder), 1))\n            ], 2),\n            _createTextVNode(\"   \"),\n            (_openBlock(), _createElementBlock(\"svg\", {\n              class: _normalizeClass([[selectMenu.value ? 'ds-rotate-180' : ''], \"ds-h-4 ds-w-4 ds-transition-transform\"]),\n              viewBox: \"0 0 320 512\",\n              xmlns: \"http://www.w3.org/2000/svg\"\n            }, _hoisted_7, 2))\n          ], 10, _hoisted_3)),\n      _withDirectives(_createElementVNode(\"div\", {\n        id: `${id.value}Menu`,\n        ref_key: \"selectMenuEl\",\n        ref: selectMenuEl,\n        class: _normalizeClass([_ctx.menuCssClass, \"ds-absolute ds-z-50 ds-min-w-[8rem] ds-py-1\"]),\n        \"data-cy\": _ctx.$attrs['data-cy'] ? `${_ctx.$attrs['data-cy']}Menu` : undefined,\n        \"data-ut\": _ctx.$attrs['data-ut'] ? `${_ctx.$attrs['data-ut']}Menu` : undefined\n      }, [\n        _createElementVNode(\"div\", _hoisted_9, [\n          _createElementVNode(\"ul\", _hoisted_10, [\n            (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.items, (item, index) => {\n              return (_openBlock(), _createElementBlock(\"li\", {\n                key: `item${index}`,\n                class: \"ds-cursor-pointer\",\n                onClick: ($event: any) => (onClickItem(item))\n              }, [\n                _createElementVNode(\"a\", {\n                  class: _normalizeClass([\n                  item.cssClass +\n                  `${item.value === value.value ? ' ds-bg-gray-150' : ''}`\n                , \"ds-block ds-px-4 ds-py-2 hover:ds-bg-gray-150\"])\n                }, _toDisplayString(item?.text), 3)\n              ], 8, _hoisted_11))\n            }), 128))\n          ])\n        ])\n      ], 10, _hoisted_8), [\n        [_vShow, selectMenu.value]\n      ])\n    ], 512),\n    (!_ctx.hideDetails)\n      ? (_openBlock(), _createBlock(BErrorMessage, {\n          key: 0,\n          \"error-message\": _unref(validationResult).errorMessage(),\n          class: \"ds-mt-1\"\n        }, null, 8, [\"error-message\"]))\n      : _createCommentVNode(\"\", true)\n  ]))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_sfc_main","_defineComponent","__props","__expose","emit","props","selectEl","ref","inputRef","selectMenuEl","selectMenu","t","useI18n","validateRequired","val","inputText","selectedItem","id","computed","uuid","value","btnCssClass","result","validationResult","vRules","validate","useValidationField","watch","lockScrollBody","ensureMenuPosition","unlockScrollBody","resetMenuPosition","ensureSelectedItem","ensureInputText","_a","i","initPressEscapeEventListener","closeOnEscapePressed","event","closeSelectMenu","initClickOutsideEventListener","closeOnClickOutside","r","onClickItem","item","nextTick","ensureMenuWidth","parentEl","menuEl","ensureVisiblePosition","resetPosition","onChangeInputText","text","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","_createVNode","BLabel","_createBlock","BTextField","$event","_withCtx","_normalizeClass","_toDisplayString","_b","_createTextVNode","_withDirectives","_Fragment","_renderList","index","_vShow","_createCommentVNode","BErrorMessage","_unref"],"mappings":"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"}

package/dist/design-system22.mjs

@@ -5,7 +5,7 @@ import { useI18n as re } from "./design-system48.mjs";
 import ie from "./design-system29.mjs";
 import ce from "./design-system30.mjs";
 import ve from "./design-system39.mjs";
-import pe from "./design-system96.mjs";
+import pe from "./design-system94.mjs";
 const fe = /* @__PURE__ */ n("path", { d: "M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z" }, null, -1), me = [
   fe
 ], he = ["id", "disabled"], be = { key: 0 }, ge = {
@@ -68,7 +68,8 @@ const fe = /* @__PURE__ */ n("path", { d: "M137.4 374.6c12.5 12.5 32.8 12.5 45.3
       }
     );
     const C = () => {
-      f.value = s.items.find((e) => e.value === u.value);
+      var e;
+      f.value = (e = s.items) == null ? void 0 : e.find((t) => t.value === u.value);
     }, h = () => {
       var e;
       s.allowInput && (y.value = ((e = f.value) == null ? void 0 : e.text) || "");

package/dist/design-system22.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system22.mjs","sources":["../src/components/BSelect.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock, withCtx as _withCtx, createBlock as _createBlock, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, renderList as _renderList, Fragment as _Fragment, vShow as _vShow, withDirectives as _withDirectives, unref as _unref } from \"vue\"\n\nconst _hoisted_1 = /*#__PURE__*/_createElementVNode(\"path\", { d: \"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" }, null, -1)\nconst _hoisted_2 = [\n  _hoisted_1\n]\nconst _hoisted_3 = [\"id\", \"disabled\"]\nconst _hoisted_4 = { key: 0 }\nconst _hoisted_5 = {\n  key: 1,\n  class: \"ds-text-black/[0.4]\"\n}\nconst _hoisted_6 = /*#__PURE__*/_createElementVNode(\"path\", { d: \"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" }, null, -1)\nconst _hoisted_7 = [\n  _hoisted_6\n]\nconst _hoisted_8 = [\"id\", \"data-cy\", \"data-ut\"]\nconst _hoisted_9 = { class: \"ds-max-h-72 ds-overflow-y-auto ds-rounded-lg ds-bg-white ds-shadow\" }\nconst _hoisted_10 = { class: \"ds-py-1 ds-text-sm ds-text-black/[0.85]\" }\nconst _hoisted_11 = [\"onClick\"]\n\nimport {\n  useValidationField,\n  type ValidationRule,\n} from '@/composables/Validation';\nimport {\n  ensureVisiblePosition,\n  lockScrollBody,\n  resetPosition,\n  unlockScrollBody,\n} from '@/helpers/ComponentHelper';\nimport type { DisplayItem } from '@/types';\nimport { v4 as uuid } from 'uuid';\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  watch,\n} from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BErrorMessage from './BErrorMessage.vue';\nimport BLabel from './BLabel.vue';\nimport BTextField from './BTextField.vue';\n\n//#region Props\nexport interface BSelectProps {\n  inputId?: string;\n  modelValue: string | number;\n  label?: string;\n  items: DisplayItem[];\n  disabled?: boolean;\n  placeholder?: string;\n  valueCssClass?: string;\n  menuCssClass?: string;\n  /**\n   * Array of custom validation rules.\n   */\n  validationRules?: ValidationRule[];\n  /**\n   * Validate if the field is left empty.\n   */\n  required?: boolean;\n  requiredErrorMessage?: string;\n  /**\n   * Hide the validation error message.\n   */\n  hideDetails?: boolean;\n  /**\n   * Allow to type to search.\n   */\n  allowInput?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BSelect',\n  props: {\n    inputId: { default: '' },\n    modelValue: {},\n    label: { default: '' },\n    items: {},\n    disabled: { type: Boolean, default: false },\n    placeholder: { default: '' },\n    valueCssClass: { default: '' },\n    menuCssClass: { default: '' },\n    validationRules: { default: undefined },\n    required: { type: Boolean, default: false },\n    requiredErrorMessage: { default: '' },\n    hideDetails: { type: Boolean, default: false },\n    allowInput: { type: Boolean, default: false }\n  },\n  emits: [\"change\", \"open\", \"close\", \"change:input\", \"update:modelValue\"],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n\n//#endregion\n\n//#region Events\n\n//#endregion\n\n//#region Data\nconst selectEl = ref<HTMLElement | null>(null);\nconst inputRef = ref<InstanceType<typeof BTextField> | null>(null);\nconst selectMenuEl = ref<HTMLElement | null>(null);\nconst selectMenu = ref(false);\nconst { t } = useI18n();\nconst validateRequired: ValidationRule = {\n  validateRule: (val) => !!val,\n  errorMessage: () =>\n    props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst inputText = ref('');\nconst selectedItem = ref<DisplayItem>();\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst value = computed({\n  get() {\n    return props.modelValue;\n  },\n  set(val) {\n    emit('update:modelValue', val);\n  },\n});\nconst btnCssClass = computed(() => {\n  let result = `ds-border ds-drop-shadow-light ds-text-sm ds-h-[40px] ds-px-3 ds-rounded-lg ds-block ds-w-full ds-inline-flex ds-items-center ds-justify-between `;\n  result += props.disabled\n    ? `ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4] `\n    : `ds-bg-white ds-text-black/[0.85] `;\n  result += !validationResult.value.valid\n    ? `ds-border-error focus:ds-ring-1 focus:ds-ring-error `\n    : `ds-border-black/10 focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus `;\n\n  return result;\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\n  return result.length ? result : undefined;\n});\n\nconst { validate, validationResult } = useValidationField(\n  id.value,\n  value,\n  vRules.value,\n);\n//#endregion\n\n//#region Watchers\nwatch(selectMenu, (val) => {\n  if (val) {\n    lockScrollBody();\n    ensureMenuPosition();\n    emit('open');\n  } else {\n    unlockScrollBody();\n    resetMenuPosition();\n    emit('close');\n  }\n});\nwatch(value, () => {\n  ensureSelectedItem();\n  ensureInputText();\n});\nwatch(\n  () => props.items,\n  () => {\n    if (value.value && !selectedItem.value?.value) {\n      ensureSelectedItem();\n      ensureInputText();\n    }\n  },\n  {\n    deep: true,\n  },\n);\n//#endregion\n\n//#region Methods\nconst ensureSelectedItem = () => {\n  selectedItem.value = props.items.find((i) => i.value === value.value);\n};\nconst ensureInputText = () => {\n  if (props.allowInput) {\n    inputText.value = selectedItem.value?.text || '';\n  }\n};\nconst initPressEscapeEventListener = () => {\n  document.addEventListener('keydown', closeOnEscapePressed);\n};\nconst closeOnEscapePressed = (event: KeyboardEvent) => {\n  if (event.key === 'Escape') {\n    closeSelectMenu();\n  }\n};\nconst initClickOutsideEventListener = () => {\n  document.addEventListener('click', closeOnClickOutside);\n};\nconst closeOnClickOutside = (event: any) => {\n  const refs = [selectEl.value, selectMenuEl.value];\n  const withinBoundaries = refs.some((r) => event.composedPath().includes(r));\n  if (!withinBoundaries) {\n    closeSelectMenu();\n  }\n};\nconst onClickItem = (item: DisplayItem) => {\n  value.value = item.value;\n  closeSelectMenu();\n  emit('change', item.value);\n  nextTick(() => {\n    validate();\n  });\n};\nconst ensureMenuWidth = (parentEl: HTMLElement, menuEl: HTMLElement) => {\n  menuEl.style.width = `${parentEl.offsetWidth}px`;\n};\nconst ensureMenuPosition = () => {\n  nextTick(() => {\n    ensureVisiblePosition(selectEl.value!, selectMenuEl.value!);\n    ensureMenuWidth(selectEl.value!, selectMenuEl.value!);\n  });\n};\nconst resetMenuPosition = () => {\n  resetPosition(selectEl.value!, selectMenuEl.value!);\n};\nconst onChangeInputText = (text: string) => {\n  emit('change:input', text);\n};\nconst closeSelectMenu = () => {\n  selectMenu.value = false;\n  inputRef.value?.blur();\n  ensureInputText();\n};\nconst init = () => {\n  ensureSelectedItem();\n  ensureInputText();\n};\ninit();\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  initPressEscapeEventListener();\n  initClickOutsideEventListener();\n});\nonBeforeUnmount(() => {\n  document.removeEventListener('keydown', closeOnEscapePressed);\n  document.removeEventListener('click', closeOnClickOutside);\n  unlockScrollBody();\n  // Make sure dropdown menu unmounted with itself\n  resetMenuPosition();\n});\n//#endregion\n\n__expose({ validate, selectMenu });\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"selectEl\",\n      ref: selectEl\n    }, [\n      _createVNode(BLabel, {\n        id: id.value,\n        label: _ctx.label,\n        required: _ctx.required\n      }, null, 8, [\"id\", \"label\", \"required\"]),\n      (props.allowInput)\n        ? (_openBlock(), _createBlock(BTextField, {\n            key: 0,\n            id: id.value,\n            ref_key: \"inputRef\",\n            ref: inputRef,\n            modelValue: inputText.value,\n            \"onUpdate:modelValue\": [\n              _cache[0] || (_cache[0] = ($event: any) => ((inputText).value = $event)),\n              onChangeInputText\n            ],\n            disabled: props.disabled,\n            placeholder: props.placeholder,\n            \"hide-details\": \"\",\n            onFocus: _cache[1] || (_cache[1] = ($event: any) => (selectMenu.value = true)),\n            \"onClick:append\": _cache[2] || (_cache[2] = ($event: any) => (inputRef.value?.focus()))\n          }, {\n            appendIcon: _withCtx(() => [\n              (_openBlock(), _createElementBlock(\"svg\", {\n                class: _normalizeClass([[selectMenu.value ? 'ds-rotate-180' : ''], \"ds-h-4 ds-w-4 ds-transition-transform\"]),\n                viewBox: \"0 0 320 512\",\n                xmlns: \"http://www.w3.org/2000/svg\"\n              }, _hoisted_2, 2))\n            ]),\n            _: 1\n          }, 8, [\"id\", \"modelValue\", \"disabled\", \"placeholder\"]))\n        : (_openBlock(), _createElementBlock(\"button\", {\n            key: 1,\n            id: id.value,\n            class: _normalizeClass(btnCssClass.value),\n            disabled: props.disabled,\n            type: \"button\",\n            onClick: _cache[3] || (_cache[3] = ($event: any) => (selectMenu.value = !selectMenu.value))\n          }, [\n            _createElementVNode(\"span\", {\n              class: _normalizeClass([_ctx.valueCssClass, \"ds-truncate\"])\n            }, [\n              (selectedItem.value?.text)\n                ? (_openBlock(), _createElementBlock(\"span\", _hoisted_4, _toDisplayString(selectedItem.value?.text), 1))\n                : (_openBlock(), _createElementBlock(\"span\", _hoisted_5, _toDisplayString(props.placeholder), 1))\n            ], 2),\n            _createTextVNode(\"   \"),\n            (_openBlock(), _createElementBlock(\"svg\", {\n              class: _normalizeClass([[selectMenu.value ? 'ds-rotate-180' : ''], \"ds-h-4 ds-w-4 ds-transition-transform\"]),\n              viewBox: \"0 0 320 512\",\n              xmlns: \"http://www.w3.org/2000/svg\"\n            }, _hoisted_7, 2))\n          ], 10, _hoisted_3)),\n      _withDirectives(_createElementVNode(\"div\", {\n        id: `${id.value}Menu`,\n        ref_key: \"selectMenuEl\",\n        ref: selectMenuEl,\n        class: _normalizeClass([_ctx.menuCssClass, \"ds-absolute ds-z-50 ds-min-w-[8rem] ds-py-1\"]),\n        \"data-cy\": _ctx.$attrs['data-cy'] ? `${_ctx.$attrs['data-cy']}Menu` : undefined,\n        \"data-ut\": _ctx.$attrs['data-ut'] ? `${_ctx.$attrs['data-ut']}Menu` : undefined\n      }, [\n        _createElementVNode(\"div\", _hoisted_9, [\n          _createElementVNode(\"ul\", _hoisted_10, [\n            (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.items, (item, index) => {\n              return (_openBlock(), _createElementBlock(\"li\", {\n                key: `item${index}`,\n                class: \"ds-cursor-pointer\",\n                onClick: ($event: any) => (onClickItem(item))\n              }, [\n                _createElementVNode(\"a\", {\n                  class: _normalizeClass([\n                  item.cssClass +\n                  `${item.value === value.value ? ' ds-bg-gray-150' : ''}`\n                , \"ds-block ds-px-4 ds-py-2 hover:ds-bg-gray-150\"])\n                }, _toDisplayString(item?.text), 3)\n              ], 8, _hoisted_11))\n            }), 128))\n          ])\n        ])\n      ], 10, _hoisted_8), [\n        [_vShow, selectMenu.value]\n      ])\n    ], 512),\n    (!_ctx.hideDetails)\n      ? (_openBlock(), _createBlock(BErrorMessage, {\n          key: 0,\n          \"error-message\": _unref(validationResult).errorMessage(),\n          class: \"ds-mt-1\"\n        }, null, 8, [\"error-message\"]))\n      : _createCommentVNode(\"\", true)\n  ]))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_sfc_main","_defineComponent","__props","__expose","emit","props","selectEl","ref","inputRef","selectMenuEl","selectMenu","t","useI18n","validateRequired","val","inputText","selectedItem","id","computed","uuid","value","btnCssClass","result","validationResult","vRules","validate","useValidationField","watch","lockScrollBody","ensureMenuPosition","unlockScrollBody","resetMenuPosition","ensureSelectedItem","ensureInputText","_a","i","initPressEscapeEventListener","closeOnEscapePressed","event","closeSelectMenu","initClickOutsideEventListener","closeOnClickOutside","r","onClickItem","item","nextTick","ensureMenuWidth","parentEl","menuEl","ensureVisiblePosition","resetPosition","onChangeInputText","text","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","_createVNode","BLabel","_createBlock","BTextField","$event","_withCtx","_normalizeClass","_toDisplayString","_b","_createTextVNode","_withDirectives","_Fragment","_renderList","index","_vShow","_createCommentVNode","BErrorMessage","_unref"],"mappings":"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"}
+{"version":3,"file":"design-system22.mjs","sources":["../src/components/BSelect.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock, withCtx as _withCtx, createBlock as _createBlock, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, renderList as _renderList, Fragment as _Fragment, vShow as _vShow, withDirectives as _withDirectives, unref as _unref } from \"vue\"\n\nconst _hoisted_1 = /*#__PURE__*/_createElementVNode(\"path\", { d: \"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" }, null, -1)\nconst _hoisted_2 = [\n  _hoisted_1\n]\nconst _hoisted_3 = [\"id\", \"disabled\"]\nconst _hoisted_4 = { key: 0 }\nconst _hoisted_5 = {\n  key: 1,\n  class: \"ds-text-black/[0.4]\"\n}\nconst _hoisted_6 = /*#__PURE__*/_createElementVNode(\"path\", { d: \"M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z\" }, null, -1)\nconst _hoisted_7 = [\n  _hoisted_6\n]\nconst _hoisted_8 = [\"id\", \"data-cy\", \"data-ut\"]\nconst _hoisted_9 = { class: \"ds-max-h-72 ds-overflow-y-auto ds-rounded-lg ds-bg-white ds-shadow\" }\nconst _hoisted_10 = { class: \"ds-py-1 ds-text-sm ds-text-black/[0.85]\" }\nconst _hoisted_11 = [\"onClick\"]\n\nimport {\n  useValidationField,\n  type ValidationRule,\n} from '@/composables/Validation';\nimport {\n  ensureVisiblePosition,\n  lockScrollBody,\n  resetPosition,\n  unlockScrollBody,\n} from '@/helpers/ComponentHelper';\nimport type { DisplayItem } from '@/types';\nimport { v4 as uuid } from 'uuid';\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  watch,\n} from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BErrorMessage from './BErrorMessage.vue';\nimport BLabel from './BLabel.vue';\nimport BTextField from './BTextField.vue';\n\n//#region Props\nexport interface BSelectProps {\n  inputId?: string;\n  modelValue: string | number;\n  label?: string;\n  items: DisplayItem[];\n  disabled?: boolean;\n  placeholder?: string;\n  valueCssClass?: string;\n  menuCssClass?: string;\n  /**\n   * Array of custom validation rules.\n   */\n  validationRules?: ValidationRule[];\n  /**\n   * Validate if the field is left empty.\n   */\n  required?: boolean;\n  requiredErrorMessage?: string;\n  /**\n   * Hide the validation error message.\n   */\n  hideDetails?: boolean;\n  /**\n   * Allow to type to search.\n   */\n  allowInput?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BSelect',\n  props: {\n    inputId: { default: '' },\n    modelValue: {},\n    label: { default: '' },\n    items: {},\n    disabled: { type: Boolean, default: false },\n    placeholder: { default: '' },\n    valueCssClass: { default: '' },\n    menuCssClass: { default: '' },\n    validationRules: { default: undefined },\n    required: { type: Boolean, default: false },\n    requiredErrorMessage: { default: '' },\n    hideDetails: { type: Boolean, default: false },\n    allowInput: { type: Boolean, default: false }\n  },\n  emits: [\"change\", \"open\", \"close\", \"change:input\", \"update:modelValue\"],\n  setup(__props: any, { expose: __expose, emit }) {\n\nconst props = __props;\n\n\n//#endregion\n\n//#region Events\n\n//#endregion\n\n//#region Data\nconst selectEl = ref<HTMLElement | null>(null);\nconst inputRef = ref<InstanceType<typeof BTextField> | null>(null);\nconst selectMenuEl = ref<HTMLElement | null>(null);\nconst selectMenu = ref(false);\nconst { t } = useI18n();\nconst validateRequired: ValidationRule = {\n  validateRule: (val) => !!val,\n  errorMessage: () =>\n    props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst inputText = ref('');\nconst selectedItem = ref<DisplayItem>();\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst value = computed({\n  get() {\n    return props.modelValue;\n  },\n  set(val) {\n    emit('update:modelValue', val);\n  },\n});\nconst btnCssClass = computed(() => {\n  let result = `ds-border ds-drop-shadow-light ds-text-sm ds-h-[40px] ds-px-3 ds-rounded-lg ds-block ds-w-full ds-inline-flex ds-items-center ds-justify-between `;\n  result += props.disabled\n    ? `ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4] `\n    : `ds-bg-white ds-text-black/[0.85] `;\n  result += !validationResult.value.valid\n    ? `ds-border-error focus:ds-ring-1 focus:ds-ring-error `\n    : `ds-border-black/10 focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus `;\n\n  return result;\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\n  return result.length ? result : undefined;\n});\n\nconst { validate, validationResult } = useValidationField(\n  id.value,\n  value,\n  vRules.value,\n);\n//#endregion\n\n//#region Watchers\nwatch(selectMenu, (val) => {\n  if (val) {\n    lockScrollBody();\n    ensureMenuPosition();\n    emit('open');\n  } else {\n    unlockScrollBody();\n    resetMenuPosition();\n    emit('close');\n  }\n});\nwatch(value, () => {\n  ensureSelectedItem();\n  ensureInputText();\n});\nwatch(\n  () => props.items,\n  () => {\n    if (value.value && !selectedItem.value?.value) {\n      ensureSelectedItem();\n      ensureInputText();\n    }\n  },\n  {\n    deep: true,\n  },\n);\n//#endregion\n\n//#region Methods\nconst ensureSelectedItem = () => {\n  selectedItem.value = props.items?.find((i) => i.value === value.value);\n};\nconst ensureInputText = () => {\n  if (props.allowInput) {\n    inputText.value = selectedItem.value?.text || '';\n  }\n};\nconst initPressEscapeEventListener = () => {\n  document.addEventListener('keydown', closeOnEscapePressed);\n};\nconst closeOnEscapePressed = (event: KeyboardEvent) => {\n  if (event.key === 'Escape') {\n    closeSelectMenu();\n  }\n};\nconst initClickOutsideEventListener = () => {\n  document.addEventListener('click', closeOnClickOutside);\n};\nconst closeOnClickOutside = (event: any) => {\n  const refs = [selectEl.value, selectMenuEl.value];\n  const withinBoundaries = refs.some((r) => event.composedPath().includes(r));\n  if (!withinBoundaries) {\n    closeSelectMenu();\n  }\n};\nconst onClickItem = (item: DisplayItem) => {\n  value.value = item.value;\n  closeSelectMenu();\n  emit('change', item.value);\n  nextTick(() => {\n    validate();\n  });\n};\nconst ensureMenuWidth = (parentEl: HTMLElement, menuEl: HTMLElement) => {\n  menuEl.style.width = `${parentEl.offsetWidth}px`;\n};\nconst ensureMenuPosition = () => {\n  nextTick(() => {\n    ensureVisiblePosition(selectEl.value!, selectMenuEl.value!);\n    ensureMenuWidth(selectEl.value!, selectMenuEl.value!);\n  });\n};\nconst resetMenuPosition = () => {\n  resetPosition(selectEl.value!, selectMenuEl.value!);\n};\nconst onChangeInputText = (text: string) => {\n  emit('change:input', text);\n};\nconst closeSelectMenu = () => {\n  selectMenu.value = false;\n  inputRef.value?.blur();\n  ensureInputText();\n};\nconst init = () => {\n  ensureSelectedItem();\n  ensureInputText();\n};\ninit();\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  initPressEscapeEventListener();\n  initClickOutsideEventListener();\n});\nonBeforeUnmount(() => {\n  document.removeEventListener('keydown', closeOnEscapePressed);\n  document.removeEventListener('click', closeOnClickOutside);\n  unlockScrollBody();\n  // Make sure dropdown menu unmounted with itself\n  resetMenuPosition();\n});\n//#endregion\n\n__expose({ validate, selectMenu });\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"selectEl\",\n      ref: selectEl\n    }, [\n      _createVNode(BLabel, {\n        id: id.value,\n        label: _ctx.label,\n        required: _ctx.required\n      }, null, 8, [\"id\", \"label\", \"required\"]),\n      (props.allowInput)\n        ? (_openBlock(), _createBlock(BTextField, {\n            key: 0,\n            id: id.value,\n            ref_key: \"inputRef\",\n            ref: inputRef,\n            modelValue: inputText.value,\n            \"onUpdate:modelValue\": [\n              _cache[0] || (_cache[0] = ($event: any) => ((inputText).value = $event)),\n              onChangeInputText\n            ],\n            disabled: props.disabled,\n            placeholder: props.placeholder,\n            \"hide-details\": \"\",\n            onFocus: _cache[1] || (_cache[1] = ($event: any) => (selectMenu.value = true)),\n            \"onClick:append\": _cache[2] || (_cache[2] = ($event: any) => (inputRef.value?.focus()))\n          }, {\n            appendIcon: _withCtx(() => [\n              (_openBlock(), _createElementBlock(\"svg\", {\n                class: _normalizeClass([[selectMenu.value ? 'ds-rotate-180' : ''], \"ds-h-4 ds-w-4 ds-transition-transform\"]),\n                viewBox: \"0 0 320 512\",\n                xmlns: \"http://www.w3.org/2000/svg\"\n              }, _hoisted_2, 2))\n            ]),\n            _: 1\n          }, 8, [\"id\", \"modelValue\", \"disabled\", \"placeholder\"]))\n        : (_openBlock(), _createElementBlock(\"button\", {\n            key: 1,\n            id: id.value,\n            class: _normalizeClass(btnCssClass.value),\n            disabled: props.disabled,\n            type: \"button\",\n            onClick: _cache[3] || (_cache[3] = ($event: any) => (selectMenu.value = !selectMenu.value))\n          }, [\n            _createElementVNode(\"span\", {\n              class: _normalizeClass([_ctx.valueCssClass, \"ds-truncate\"])\n            }, [\n              (selectedItem.value?.text)\n                ? (_openBlock(), _createElementBlock(\"span\", _hoisted_4, _toDisplayString(selectedItem.value?.text), 1))\n                : (_openBlock(), _createElementBlock(\"span\", _hoisted_5, _toDisplayString(props.placeholder), 1))\n            ], 2),\n            _createTextVNode(\"   \"),\n            (_openBlock(), _createElementBlock(\"svg\", {\n              class: _normalizeClass([[selectMenu.value ? 'ds-rotate-180' : ''], \"ds-h-4 ds-w-4 ds-transition-transform\"]),\n              viewBox: \"0 0 320 512\",\n              xmlns: \"http://www.w3.org/2000/svg\"\n            }, _hoisted_7, 2))\n          ], 10, _hoisted_3)),\n      _withDirectives(_createElementVNode(\"div\", {\n        id: `${id.value}Menu`,\n        ref_key: \"selectMenuEl\",\n        ref: selectMenuEl,\n        class: _normalizeClass([_ctx.menuCssClass, \"ds-absolute ds-z-50 ds-min-w-[8rem] ds-py-1\"]),\n        \"data-cy\": _ctx.$attrs['data-cy'] ? `${_ctx.$attrs['data-cy']}Menu` : undefined,\n        \"data-ut\": _ctx.$attrs['data-ut'] ? `${_ctx.$attrs['data-ut']}Menu` : undefined\n      }, [\n        _createElementVNode(\"div\", _hoisted_9, [\n          _createElementVNode(\"ul\", _hoisted_10, [\n            (_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.items, (item, index) => {\n              return (_openBlock(), _createElementBlock(\"li\", {\n                key: `item${index}`,\n                class: \"ds-cursor-pointer\",\n                onClick: ($event: any) => (onClickItem(item))\n              }, [\n                _createElementVNode(\"a\", {\n                  class: _normalizeClass([\n                  item.cssClass +\n                  `${item.value === value.value ? ' ds-bg-gray-150' : ''}`\n                , \"ds-block ds-px-4 ds-py-2 hover:ds-bg-gray-150\"])\n                }, _toDisplayString(item?.text), 3)\n              ], 8, _hoisted_11))\n            }), 128))\n          ])\n        ])\n      ], 10, _hoisted_8), [\n        [_vShow, selectMenu.value]\n      ])\n    ], 512),\n    (!_ctx.hideDetails)\n      ? (_openBlock(), _createBlock(BErrorMessage, {\n          key: 0,\n          \"error-message\": _unref(validationResult).errorMessage(),\n          class: \"ds-mt-1\"\n        }, null, 8, [\"error-message\"]))\n      : _createCommentVNode(\"\", true)\n  ]))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_sfc_main","_defineComponent","__props","__expose","emit","props","selectEl","ref","inputRef","selectMenuEl","selectMenu","t","useI18n","validateRequired","val","inputText","selectedItem","id","computed","uuid","value","btnCssClass","result","validationResult","vRules","validate","useValidationField","watch","lockScrollBody","ensureMenuPosition","unlockScrollBody","resetMenuPosition","ensureSelectedItem","ensureInputText","_a","i","initPressEscapeEventListener","closeOnEscapePressed","event","closeSelectMenu","initClickOutsideEventListener","closeOnClickOutside","r","onClickItem","item","nextTick","ensureMenuWidth","parentEl","menuEl","ensureVisiblePosition","resetPosition","onChangeInputText","text","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","_createVNode","BLabel","_createBlock","BTextField","$event","_withCtx","_normalizeClass","_toDisplayString","_b","_createTextVNode","_withDirectives","_Fragment","_renderList","index","_vShow","_createCommentVNode","BErrorMessage","_unref"],"mappings":"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"}

package/dist/design-system23.js

@@ -1,2 +1,2 @@
-"use strict";const l=require("vue"),b=require("./design-system3.js"),g=require("./design-system48.js"),_=require("./design-system29.js"),q=require("./design-system30.js"),y=require("./design-system96.js"),B=["id","autocomplete","disabled","placeholder","readonly","rows"],h=l.defineComponent({__name:"BTextarea",props:{inputId:{default:""},inputCssClass:{default:""},modelValue:{},validationRules:{default:void 0},label:{default:""},placeholder:{default:""},autocomplete:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},rows:{default:3},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},hideDetails:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(a,{expose:u,emit:i}){const s=a,{t:n}=g.useI18n(),c={validateRule:e=>typeof e=="number"?!!e:!!(e&&(e!=null&&e.trim())),errorMessage:()=>s.requiredErrorMessage||n("ds.global.field_required")},r=l.computed(()=>s.inputId||`id-${y()}`),t=l.computed({get(){return s.modelValue},set(e){i("update:modelValue",e)}}),p=l.computed(()=>[{"ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/40":s.disabled,"ds-text-black/[0.85]":!s.disabled,"ds-border-error focus:ds-ring-1 focus:ds-ring-error":!d.value.valid,"ds-border-black/[0.1] focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus":d.value.valid},s.inputCssClass]),f=l.computed(()=>{let e=[];return s.required&&e.push(c),s.validationRules&&(e=e.concat(s.validationRules)),e.length?e:void 0}),{validate:m,validationResult:d}=b.useValidationField(r.value,t,f.value);return u({validate:m}),(e,o)=>(l.openBlock(),l.createElementBlock("div",null,[l.createVNode(q,{id:r.value,label:e.label,required:e.required},null,8,["id","label","required"]),l.withDirectives(l.createElementVNode("textarea",{id:r.value,"onUpdate:modelValue":o[0]||(o[0]=v=>t.value=v),autocomplete:s.autocomplete?"on":"off",class:l.normalizeClass([p.value,"ds-block ds-w-full ds-rounded-lg ds-border ds-px-3 ds-py-1 ds-text-sm ds-drop-shadow-light"]),disabled:s.disabled,placeholder:s.placeholder,readonly:s.readonly,rows:s.rows},null,10,B),[[l.vModelText,t.value]]),e.hideDetails?l.createCommentVNode("",!0):(l.openBlock(),l.createBlock(_,{key:0,"error-message":l.unref(d).errorMessage(),class:"ds-mt-1"},null,8,["error-message"]))]))}});module.exports=h;
+"use strict";const l=require("vue"),b=require("./design-system3.js"),g=require("./design-system48.js"),_=require("./design-system29.js"),q=require("./design-system30.js"),y=require("./design-system94.js"),B=["id","autocomplete","disabled","placeholder","readonly","rows"],h=l.defineComponent({__name:"BTextarea",props:{inputId:{default:""},inputCssClass:{default:""},modelValue:{},validationRules:{default:void 0},label:{default:""},placeholder:{default:""},autocomplete:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},rows:{default:3},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},hideDetails:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(a,{expose:u,emit:i}){const s=a,{t:n}=g.useI18n(),c={validateRule:e=>typeof e=="number"?!!e:!!(e&&(e!=null&&e.trim())),errorMessage:()=>s.requiredErrorMessage||n("ds.global.field_required")},r=l.computed(()=>s.inputId||`id-${y()}`),t=l.computed({get(){return s.modelValue},set(e){i("update:modelValue",e)}}),p=l.computed(()=>[{"ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/40":s.disabled,"ds-text-black/[0.85]":!s.disabled,"ds-border-error focus:ds-ring-1 focus:ds-ring-error":!d.value.valid,"ds-border-black/[0.1] focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus":d.value.valid},s.inputCssClass]),f=l.computed(()=>{let e=[];return s.required&&e.push(c),s.validationRules&&(e=e.concat(s.validationRules)),e.length?e:void 0}),{validate:m,validationResult:d}=b.useValidationField(r.value,t,f.value);return u({validate:m}),(e,o)=>(l.openBlock(),l.createElementBlock("div",null,[l.createVNode(q,{id:r.value,label:e.label,required:e.required},null,8,["id","label","required"]),l.withDirectives(l.createElementVNode("textarea",{id:r.value,"onUpdate:modelValue":o[0]||(o[0]=v=>t.value=v),autocomplete:s.autocomplete?"on":"off",class:l.normalizeClass([p.value,"ds-block ds-w-full ds-rounded-lg ds-border ds-px-3 ds-py-1 ds-text-sm ds-drop-shadow-light"]),disabled:s.disabled,placeholder:s.placeholder,readonly:s.readonly,rows:s.rows},null,10,B),[[l.vModelText,t.value]]),e.hideDetails?l.createCommentVNode("",!0):(l.openBlock(),l.createBlock(_,{key:0,"error-message":l.unref(d).errorMessage(),class:"ds-mt-1"},null,8,["error-message"]))]))}});module.exports=h;
 //# sourceMappingURL=design-system23.js.map

package/dist/design-system23.mjs

@@ -3,7 +3,7 @@ import { useValidationField as x } from "./design-system3.mjs";
 import { useI18n as R } from "./design-system48.mjs";
 import M from "./design-system29.mjs";
 import E from "./design-system30.mjs";
-import D from "./design-system96.mjs";
+import D from "./design-system94.mjs";
 const I = ["id", "autocomplete", "disabled", "placeholder", "readonly", "rows"], j = /* @__PURE__ */ g({
   __name: "BTextarea",
   props: {

package/dist/design-system55.js

@@ -1,4 +1,4 @@
-"use strict";const e=require("vue"),a=require("./design-system5.js"),p=require("./design-system96.js"),m=["id","disabled","value"],b=["for"],f=["for"],k=`
+"use strict";const e=require("vue"),a=require("./design-system5.js"),p=require("./design-system94.js"),m=["id","disabled","value"],b=["for"],f=["for"],k=`
   peer-checked:ds-text-transparent peer-checked:ds-bg-gradient-to-r peer-checked:ds-from-primary-f-stop peer-checked:ds-from-primary-f peer-checked:ds-to-primary-t
   peer-checked:after:ds-opacity-100
 `,h=e.defineComponent({__name:"BCheckbox",props:{inputId:{default:""},inputCssClass:{default:""},modelValue:{type:[Boolean,Array],default:!1},label:{default:""},labelOrphan:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},size:{default:a.BCheckboxSize.Medium}},emits:["update:modelValue"],setup(r,{emit:u}){const l=r,t=e.computed(()=>l.inputId||`id-${p()}`),o=e.computed({get(){return l.modelValue},set(s){u("update:modelValue",s)}}),n=e.computed(()=>{let s="";switch(l.size){case a.BCheckboxSize.Small:s+="size-sm ";break;case a.BCheckboxSize.Medium:default:s+=" ";break}return s}),i=e.computed(()=>[l.inputCssClass,{"ds-cursor-not-allowed":l.disabled}]);return(s,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.value,"b-checkbox ds-flex ds-items-center"])},[e.withDirectives(e.createElementVNode("input",{id:t.value,"onUpdate:modelValue":d[0]||(d[0]=c=>o.value=c),class:e.normalizeClass([i.value,"ds-peer ds-invisible"]),disabled:s.disabled,value:s.$attrs.value,type:"checkbox"},null,10,m),[[e.vModelCheckbox,o.value]]),e.createElementVNode("label",{class:e.normalizeClass([k,"input-label"]),for:t.value},null,8,b),s.label||s.$slots.default?(e.openBlock(),e.createElementBlock("label",{key:0,for:s.labelOrphan?void 0:t.value,class:"ds-ml-2 ds-text-sm ds-font-medium ds-text-gray-900"},[e.renderSlot(s.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(l.label),1)],!0)],8,f)):e.createCommentVNode("",!0)],2))}});module.exports=h;

package/dist/design-system55.mjs

@@ -1,6 +1,6 @@
 import { defineComponent as h, computed as s, openBlock as u, createElementBlock as i, normalizeClass as t, withDirectives as v, createElementVNode as n, vModelCheckbox as k, renderSlot as C, createTextVNode as y, toDisplayString as V, createCommentVNode as B } from "vue";
 import { BCheckboxSize as d } from "./design-system5.mjs";
-import g from "./design-system96.mjs";
+import g from "./design-system94.mjs";
 const x = ["id", "disabled", "value"], z = ["for"], S = ["for"], _ = `
   peer-checked:ds-text-transparent peer-checked:ds-bg-gradient-to-r peer-checked:ds-from-primary-f-stop peer-checked:ds-from-primary-f peer-checked:ds-to-primary-t
   peer-checked:after:ds-opacity-100

package/dist/design-system75.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("vue"),k=require("./design-system96.js"),C={class:"ds-flex ds-flex-wrap ds-overflow-hidden ds-rounded-lg ds-border ds-border-gray-100 ds-bg-gray-100"},_=["onClick"],g=["id"],y=e.defineComponent({__name:"BTabs",props:{headers:{},modelValue:{default:void 0},headerCssClass:{default:""}},emits:["update:modelValue"],setup(p,{emit:b}){const r=p,o=e.ref(null),l=e.ref(null),s=e.ref(null),t=e.ref(0),n=e.ref(0),u=e.computed({get(){return r.modelValue!==void 0?r.modelValue:n.value},set(a){r.modelValue!==void 0?b("update:modelValue",a):n.value=a}}),c=e.computed(()=>`id-${k()}`);e.watch(u,a=>{i(a)}),e.watch(()=>r.headers,()=>{e.nextTick(()=>{v()})});const h=a=>{u.value=a},i=a=>{if(s.value&&l.value)if(t.value=a,[...s.value,...l.value].forEach(d=>{d.classList.remove("active")}),s.value[t.value]&&l.value[t.value])s.value[t.value].classList.add("active"),l.value[t.value].classList.add("active");else{const d=t.value-1;d>=0&&(s.value[d].classList.add("active"),l.value[d].classList.add("active"))}},v=()=>{o.value&&(s.value=[...o.value.querySelectorAll(`#${c.value} > .tab`)],s.value.forEach(a=>{a.classList.contains("active")&&(t.value=s.value.indexOf(a))}),i(t.value))};return e.onMounted(()=>{v()}),(a,d)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"tabContainer",ref:o},[e.renderSlot(a.$slots,"headers-prepend",{},void 0,!0),e.createElementVNode("ul",C,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.headers,(f,m)=>(e.openBlock(),e.createElementBlock("li",{key:m,ref_for:!0,ref_key:"tabHeaders",ref:l,class:e.normalizeClass([[a.headerCssClass,f.disabled?"ds-pointer-events-none ds-text-black/40":""],"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"]),onClick:V=>h(m)},e.toDisplayString(f.text),11,_))),128))]),e.renderSlot(a.$slots,"headers-append",{},void 0,!0),e.createElementVNode("div",{id:c.value,class:"ds-w-full"},[e.renderSlot(a.$slots,"default",{},void 0,!0)],8,g)],512))}});module.exports=y;
+"use strict";const e=require("vue"),k=require("./design-system94.js"),C={class:"ds-flex ds-flex-wrap ds-overflow-hidden ds-rounded-lg ds-border ds-border-gray-100 ds-bg-gray-100"},_=["onClick"],g=["id"],y=e.defineComponent({__name:"BTabs",props:{headers:{},modelValue:{default:void 0},headerCssClass:{default:""}},emits:["update:modelValue"],setup(p,{emit:b}){const r=p,o=e.ref(null),l=e.ref(null),s=e.ref(null),t=e.ref(0),n=e.ref(0),u=e.computed({get(){return r.modelValue!==void 0?r.modelValue:n.value},set(a){r.modelValue!==void 0?b("update:modelValue",a):n.value=a}}),c=e.computed(()=>`id-${k()}`);e.watch(u,a=>{i(a)}),e.watch(()=>r.headers,()=>{e.nextTick(()=>{v()})});const h=a=>{u.value=a},i=a=>{if(s.value&&l.value)if(t.value=a,[...s.value,...l.value].forEach(d=>{d.classList.remove("active")}),s.value[t.value]&&l.value[t.value])s.value[t.value].classList.add("active"),l.value[t.value].classList.add("active");else{const d=t.value-1;d>=0&&(s.value[d].classList.add("active"),l.value[d].classList.add("active"))}},v=()=>{o.value&&(s.value=[...o.value.querySelectorAll(`#${c.value} > .tab`)],s.value.forEach(a=>{a.classList.contains("active")&&(t.value=s.value.indexOf(a))}),i(t.value))};return e.onMounted(()=>{v()}),(a,d)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"tabContainer",ref:o},[e.renderSlot(a.$slots,"headers-prepend",{},void 0,!0),e.createElementVNode("ul",C,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.headers,(f,m)=>(e.openBlock(),e.createElementBlock("li",{key:m,ref_for:!0,ref_key:"tabHeaders",ref:l,class:e.normalizeClass([[a.headerCssClass,f.disabled?"ds-pointer-events-none ds-text-black/40":""],"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"]),onClick:V=>h(m)},e.toDisplayString(f.text),11,_))),128))]),e.renderSlot(a.$slots,"headers-append",{},void 0,!0),e.createElementVNode("div",{id:c.value,class:"ds-w-full"},[e.renderSlot(a.$slots,"default",{},void 0,!0)],8,g)],512))}});module.exports=y;
 //# sourceMappingURL=design-system75.js.map

package/dist/design-system75.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-system96.mjs";
+import H from "./design-system94.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-system78.js

@@ -1,2 +1,2 @@
-"use strict";const t=require("vue"),B=require("./design-system3.js"),k=require("./design-system48.js"),q=require("./design-system29.js"),V=require("./design-system30.js"),C=require("./design-system96.js"),x={class:"b-text-field"},E={class:"ds-relative"},I={key:0,class:"b-text-field__prepend-icon ds-absolute ds-left-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},R=["id","autocomplete","disabled","inputmode","placeholder","readonly","type","onKeyup"],M={key:1,class:"b-text-field__append-icon ds-absolute ds-right-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},N=t.defineComponent({__name:"BTextField",props:{inputId:{default:""},inputCssClass:{default:""},validationRules:{default:void 0},modelValue:{},label:{default:""},placeholder:{default:""},autocomplete:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},type:{default:"text"},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},hideDetails:{type:Boolean,default:!1},inputHandler:{default:void 0},inputmode:{default:"text"}},emits:["focus","blur","press:enter","update:modelValue"],setup(p,{expose:c,emit:o}){const s=p,{t:f}=k.useI18n(),d=t.ref(null),m={validateRule:e=>typeof e=="number"?!!e:!!(e&&(e!=null&&e.trim())),errorMessage:()=>s.requiredErrorMessage||f("ds.global.field_required")},r=t.computed(()=>s.inputId||`id-${C()}`),u=t.computed({get(){return s.modelValue},set(e){o("update:modelValue",e)}}),v=t.computed(()=>[{"ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4]":s.disabled,"ds-text-black/[0.85]":!s.disabled,"ds-border-error focus:ds-ring-1 focus:ds-ring-error":!n.value.valid,"ds-border-black/[0.1] focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus":n.value.valid},s.inputCssClass]),b=t.computed(()=>{let e=[];return s.required&&e.push(m),s.validationRules&&(e=e.concat(s.validationRules)),e.length?e:void 0}),{validate:i,validationResult:n}=B.useValidationField(r.value,u,b.value),y=()=>{o("press:enter")},_=()=>{o("focus")},g=()=>{o("blur")},h=()=>{i()};return c({validate:i,focus:()=>{var e;(e=d.value)==null||e.focus()},blur:()=>{var e;(e=d.value)==null||e.blur()}}),(e,l)=>(t.openBlock(),t.createElementBlock("div",x,[t.createVNode(V,{id:r.value,label:e.label,required:e.required},null,8,["id","label","required"]),t.createElementVNode("div",E,[e.$slots.prependIcon?(t.openBlock(),t.createElementBlock("div",I,[t.renderSlot(e.$slots,"prependIcon",{},void 0,!0)])):t.createCommentVNode("",!0),t.withDirectives(t.createElementVNode("input",{id:r.value,ref_key:"inputRef",ref:d,"onUpdate:modelValue":l[0]||(l[0]=a=>u.value=a),autocomplete:s.autocomplete?"on":"off",disabled:s.disabled,inputmode:s.inputmode,placeholder:s.placeholder,readonly:s.readonly,type:s.type,class:t.normalizeClass([[v.value],"ds-block ds-h-[40px] ds-w-full ds-rounded-lg ds-border ds-px-3 ds-text-sm ds-drop-shadow-light"]),onBlur:g,onFocus:_,onInput:l[1]||(l[1]=(...a)=>e.inputHandler&&e.inputHandler(...a)),onKeyup:[h,t.withKeys(y,["enter"])]},null,42,R),[[t.vModelDynamic,u.value]]),e.$slots.appendIcon?(t.openBlock(),t.createElementBlock("div",M,[t.renderSlot(e.$slots,"appendIcon",{},void 0,!0)])):t.createCommentVNode("",!0)]),e.hideDetails?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(q,{key:0,"error-message":t.unref(n).errorMessage(),class:"ds-mt-1"},null,8,["error-message"]))]))}});module.exports=N;
+"use strict";const t=require("vue"),B=require("./design-system3.js"),k=require("./design-system48.js"),q=require("./design-system29.js"),V=require("./design-system30.js"),C=require("./design-system94.js"),x={class:"b-text-field"},E={class:"ds-relative"},I={key:0,class:"b-text-field__prepend-icon ds-absolute ds-left-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},R=["id","autocomplete","disabled","inputmode","placeholder","readonly","type","onKeyup"],M={key:1,class:"b-text-field__append-icon ds-absolute ds-right-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},N=t.defineComponent({__name:"BTextField",props:{inputId:{default:""},inputCssClass:{default:""},validationRules:{default:void 0},modelValue:{},label:{default:""},placeholder:{default:""},autocomplete:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},type:{default:"text"},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},hideDetails:{type:Boolean,default:!1},inputHandler:{default:void 0},inputmode:{default:"text"}},emits:["focus","blur","press:enter","update:modelValue"],setup(p,{expose:c,emit:o}){const s=p,{t:f}=k.useI18n(),d=t.ref(null),m={validateRule:e=>typeof e=="number"?!!e:!!(e&&(e!=null&&e.trim())),errorMessage:()=>s.requiredErrorMessage||f("ds.global.field_required")},r=t.computed(()=>s.inputId||`id-${C()}`),u=t.computed({get(){return s.modelValue},set(e){o("update:modelValue",e)}}),v=t.computed(()=>[{"ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4]":s.disabled,"ds-text-black/[0.85]":!s.disabled,"ds-border-error focus:ds-ring-1 focus:ds-ring-error":!n.value.valid,"ds-border-black/[0.1] focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus":n.value.valid},s.inputCssClass]),b=t.computed(()=>{let e=[];return s.required&&e.push(m),s.validationRules&&(e=e.concat(s.validationRules)),e.length?e:void 0}),{validate:i,validationResult:n}=B.useValidationField(r.value,u,b.value),y=()=>{o("press:enter")},_=()=>{o("focus")},g=()=>{o("blur")},h=()=>{i()};return c({validate:i,focus:()=>{var e;(e=d.value)==null||e.focus()},blur:()=>{var e;(e=d.value)==null||e.blur()}}),(e,l)=>(t.openBlock(),t.createElementBlock("div",x,[t.createVNode(V,{id:r.value,label:e.label,required:e.required},null,8,["id","label","required"]),t.createElementVNode("div",E,[e.$slots.prependIcon?(t.openBlock(),t.createElementBlock("div",I,[t.renderSlot(e.$slots,"prependIcon",{},void 0,!0)])):t.createCommentVNode("",!0),t.withDirectives(t.createElementVNode("input",{id:r.value,ref_key:"inputRef",ref:d,"onUpdate:modelValue":l[0]||(l[0]=a=>u.value=a),autocomplete:s.autocomplete?"on":"off",disabled:s.disabled,inputmode:s.inputmode,placeholder:s.placeholder,readonly:s.readonly,type:s.type,class:t.normalizeClass([[v.value],"ds-block ds-h-[40px] ds-w-full ds-rounded-lg ds-border ds-px-3 ds-text-sm ds-drop-shadow-light"]),onBlur:g,onFocus:_,onInput:l[1]||(l[1]=(...a)=>e.inputHandler&&e.inputHandler(...a)),onKeyup:[h,t.withKeys(y,["enter"])]},null,42,R),[[t.vModelDynamic,u.value]]),e.$slots.appendIcon?(t.openBlock(),t.createElementBlock("div",M,[t.renderSlot(e.$slots,"appendIcon",{},void 0,!0)])):t.createCommentVNode("",!0)]),e.hideDetails?t.createCommentVNode("",!0):(t.openBlock(),t.createBlock(q,{key:0,"error-message":t.unref(n).errorMessage(),class:"ds-mt-1"},null,8,["error-message"]))]))}});module.exports=N;
 //# sourceMappingURL=design-system78.js.map

package/dist/design-system78.mjs

@@ -3,7 +3,7 @@ import { useValidationField as z } from "./design-system3.mjs";
 import { useI18n as F } from "./design-system48.mjs";
 import H from "./design-system29.mjs";
 import N from "./design-system30.mjs";
-import U from "./design-system96.mjs";
+import U from "./design-system94.mjs";
 const S = { class: "b-text-field" }, T = { class: "ds-relative" }, j = {
   key: 0,
   class: "b-text-field__prepend-icon ds-absolute ds-left-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"

package/dist/design-system84.js

@@ -1,2 +1,2 @@
-"use strict";const t=require("vue"),h=require("./design-system4.js"),L=require("./design-system48.js"),P=require("./design-system101.js"),j=require("./design-system45.js"),A=require("./design-system3.js"),$=require("./design-system30.js"),U=require("./design-system11.js"),H=require("./design-system29.js"),O=require("./design-system96.js"),G=require("./design-system99.js"),J=d=>(t.pushScopeId("data-v-1f555f5e"),d=d(),t.popScopeId(),d),K={class:"b-image-picker 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:g}=L.useI18n(),p=t.ref(null),f=t.ref(0),n=t.computed({get(){return l.modelValue},set(e){c("update:modelValue",e)}}),v=t.ref(!0),m=t.ref(!0),i=t.ref({visible:!1,url:""}),_=t.computed(()=>h.FileImageTypes.join(", ")),k=t.computed(()=>l.inputId||`id-${O()}`),V={validateRule:e=>!!e&&e.length>0,errorMessage:()=>l.requiredErrorMessage||g("ds.global.field_required")},B={validateRule:()=>v.value,errorMessage:()=>g("ds.components.base.image_picker.file_types_valid",{types:_.value})},D={validateRule:()=>m.value,errorMessage:()=>g("ds.components.base.image_picker.file_size_valid",{size:l.maxFileSize})},w=t.computed(()=>{let e=[];return l.required&&e.push(V),l.validationRules&&(e=e.concat(l.validationRules)),e.push(B),e.push(D),e.length?e:void 0}),{validate:u,validationResult:I}=A.useValidationField(k.value,n,w.value),b=(e,a)=>{f.value=e,a.target.classList.add("dragging"),a.dataTransfer.effectAllowed="move",a.dataTransfer.setData("index",e.toString())},C=e=>{e.target.classList.remove("dragging")},E=(e,a)=>{const s=a.target;f.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=p.value)==null||e.click()},R=e=>{let a=e.target.files||e.dataTransfer.files;a.length&&(S(a),p.value&&(p.value.value=null))},S=e=>{Array.from(e).forEach(a=>{if(v.value=h.FileImageTypes.includes(a.type),m.value=z(a.size)<=l.maxFileSize,v.value&&m.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 y({validate:u}),(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:"b-image-picker__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:C,onDragenter:o=>E(r,o),onDragleave:x,onDragover:q,onDragstart:o=>b(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)]),appendIcon:t.withCtx(()=>[ee]),_:1}),t.createElementVNode("input",{ref_key:"inputRef",ref:p,accept:_.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(I).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-system101.js"),j=require("./design-system45.js"),A=require("./design-system3.js"),$=require("./design-system30.js"),U=require("./design-system11.js"),H=require("./design-system29.js"),O=require("./design-system94.js"),G=require("./design-system99.js"),J=d=>(t.pushScopeId("data-v-1f555f5e"),d=d(),t.popScopeId(),d),K={class:"b-image-picker 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:g}=L.useI18n(),p=t.ref(null),f=t.ref(0),n=t.computed({get(){return l.modelValue},set(e){c("update:modelValue",e)}}),v=t.ref(!0),m=t.ref(!0),i=t.ref({visible:!1,url:""}),_=t.computed(()=>h.FileImageTypes.join(", ")),k=t.computed(()=>l.inputId||`id-${O()}`),V={validateRule:e=>!!e&&e.length>0,errorMessage:()=>l.requiredErrorMessage||g("ds.global.field_required")},B={validateRule:()=>v.value,errorMessage:()=>g("ds.components.base.image_picker.file_types_valid",{types:_.value})},D={validateRule:()=>m.value,errorMessage:()=>g("ds.components.base.image_picker.file_size_valid",{size:l.maxFileSize})},w=t.computed(()=>{let e=[];return l.required&&e.push(V),l.validationRules&&(e=e.concat(l.validationRules)),e.push(B),e.push(D),e.length?e:void 0}),{validate:u,validationResult:I}=A.useValidationField(k.value,n,w.value),b=(e,a)=>{f.value=e,a.target.classList.add("dragging"),a.dataTransfer.effectAllowed="move",a.dataTransfer.setData("index",e.toString())},C=e=>{e.target.classList.remove("dragging")},E=(e,a)=>{const s=a.target;f.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=p.value)==null||e.click()},R=e=>{let a=e.target.files||e.dataTransfer.files;a.length&&(S(a),p.value&&(p.value.value=null))},S=e=>{Array.from(e).forEach(a=>{if(v.value=h.FileImageTypes.includes(a.type),m.value=z(a.size)<=l.maxFileSize,v.value&&m.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 y({validate:u}),(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:"b-image-picker__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:C,onDragenter:o=>E(r,o),onDragleave:x,onDragover:q,onDragstart:o=>b(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)]),appendIcon:t.withCtx(()=>[ee]),_:1}),t.createElementVNode("input",{ref_key:"inputRef",ref:p,accept:_.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(I).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-system84.js.map

package/dist/design-system84.mjs

@@ -7,7 +7,7 @@ import { useValidationField as le } from "./design-system3.mjs";
 import se from "./design-system30.mjs";
 import re from "./design-system11.mjs";
 import oe from "./design-system29.mjs";
-import de from "./design-system96.mjs";
+import de from "./design-system94.mjs";
 import ie from "./design-system99.mjs";
 const ne = (i) => (Y("data-v-1f555f5e"), i = i(), Z(), i), ue = { class: "b-image-picker 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,

package/dist/design-system87.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("vue"),h=require("./design-system30.js"),g=require("./design-system3.js"),V=require("./design-system29.js"),q=require("./design-system48.js"),B=require("./design-system94.js"),C=require("./design-system5.js"),E=require("./design-system96.js"),N={class:"b-currency-field"},R={class:"ds-relative"},I={key:0,class:"b-currency-field__prepend-icon ds-absolute ds-left-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},S=["id","autocomplete","disabled","placeholder","readonly","onKeyup"],M={key:1,class:"b-currency-field__append-icon ds-absolute ds-right-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},w=e.defineComponent({__name:"BCurrencyField",props:{inputId:{default:""},inputCssClass:{default:""},modelValue:{},label:{default:""},validationRules:{default:void 0},placeholder:{default:""},autocomplete:{type:Boolean,default:!1},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},hideDetails:{type:Boolean,default:!1},locale:{default:C.SupportedLocale["vi-VN"]}},emits:["press:enter","update:modelValue"],setup(i,{emit:a}){const t=i;let o;const{t:c}=q.useI18n(),u=e.ref(null),p={validateRule:s=>!!(s&&(s!=null&&s.trim())),errorMessage:()=>t.requiredErrorMessage||c("ds.global.field_required")},r=e.computed(()=>t.inputId||`id-${E()}`),l=e.computed({get(){return t.modelValue},set(s){a("update:modelValue",s)}}),m=e.computed(()=>[{"ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4]":t.disabled,"ds-text-black/[0.85]":!t.disabled,"ds-border-error focus:ds-ring-1 focus:ds-ring-error":!d.value.valid,"ds-border-black/[0.1] focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus":d.value.valid},t.inputCssClass]),f=e.computed(()=>{let s=[];return t.required&&s.push(p),t.validationRules&&(s=s.concat(t.validationRules)),s.length?s:void 0}),v=e.computed(()=>t.locale==="en-US"?{mask:"$num",blocks:{num:{mask:Number,thousandsSeparator:" "}}}:[{mask:""},{mask:"num VND",lazy:!1,blocks:{num:{mask:Number,thousandsSeparator:" "}}}]),{validate:k,validationResult:d}=g.useValidationField(r.value,l,f.value);e.watch(()=>t.locale,()=>{n()}),e.watch(()=>t.modelValue,s=>{s!=o.unmaskedValue&&(o.unmaskedValue=s.toString())});const _=()=>{k()},b=()=>{a("press:enter")},y=()=>{l.value=typeof l.value=="number"?+o.unmaskedValue:o.unmaskedValue},n=()=>{o&&o.destroy(),o=B(u.value,v.value),o.on("accept",y)};return e.onMounted(()=>{n(),o.unmaskedValue=l.value.toString()}),(s,$)=>(e.openBlock(),e.createElementBlock("div",N,[e.createVNode(h,{id:r.value,label:s.label,required:s.required},null,8,["id","label","required"]),e.createElementVNode("div",R,[s.$slots.prependIcon?(e.openBlock(),e.createElementBlock("div",I,[e.renderSlot(s.$slots,"prependIcon",{},void 0,!0)])):e.createCommentVNode("",!0),e.createElementVNode("input",{id:r.value,ref_key:"inputRef",ref:u,autocomplete:t.autocomplete?"on":"off",class:e.normalizeClass([m.value,"ds-block ds-h-[40px] ds-w-full ds-rounded-lg ds-border ds-px-3 ds-text-sm ds-drop-shadow-light"]),disabled:t.disabled,placeholder:t.placeholder,readonly:t.readonly,onKeyup:[_,e.withKeys(b,["enter"])]},null,42,S),s.$slots.appendIcon?(e.openBlock(),e.createElementBlock("div",M,[e.renderSlot(s.$slots,"appendIcon",{},void 0,!0)])):e.createCommentVNode("",!0)]),s.hideDetails?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(V,{key:0,"error-message":e.unref(d).errorMessage(),class:"ds-mt-1"},null,8,["error-message"]))]))}});module.exports=w;
+"use strict";const e=require("vue"),h=require("./design-system30.js"),g=require("./design-system3.js"),V=require("./design-system29.js"),q=require("./design-system48.js"),B=require("./design-system97.js"),C=require("./design-system5.js"),E=require("./design-system94.js"),N={class:"b-currency-field"},R={class:"ds-relative"},I={key:0,class:"b-currency-field__prepend-icon ds-absolute ds-left-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},S=["id","autocomplete","disabled","placeholder","readonly","onKeyup"],M={key:1,class:"b-currency-field__append-icon ds-absolute ds-right-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"},w=e.defineComponent({__name:"BCurrencyField",props:{inputId:{default:""},inputCssClass:{default:""},modelValue:{},label:{default:""},validationRules:{default:void 0},placeholder:{default:""},autocomplete:{type:Boolean,default:!1},required:{type:Boolean,default:!1},requiredErrorMessage:{default:""},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},hideDetails:{type:Boolean,default:!1},locale:{default:C.SupportedLocale["vi-VN"]}},emits:["press:enter","update:modelValue"],setup(i,{emit:a}){const t=i;let o;const{t:c}=q.useI18n(),u=e.ref(null),p={validateRule:s=>!!(s&&(s!=null&&s.trim())),errorMessage:()=>t.requiredErrorMessage||c("ds.global.field_required")},r=e.computed(()=>t.inputId||`id-${E()}`),l=e.computed({get(){return t.modelValue},set(s){a("update:modelValue",s)}}),m=e.computed(()=>[{"ds-cursor-not-allowed ds-bg-[#f2f2f2] ds-text-black/[0.4]":t.disabled,"ds-text-black/[0.85]":!t.disabled,"ds-border-error focus:ds-ring-1 focus:ds-ring-error":!d.value.valid,"ds-border-black/[0.1] focus:ds-border-focus focus:ds-ring-1 focus:ds-ring-focus":d.value.valid},t.inputCssClass]),f=e.computed(()=>{let s=[];return t.required&&s.push(p),t.validationRules&&(s=s.concat(t.validationRules)),s.length?s:void 0}),v=e.computed(()=>t.locale==="en-US"?{mask:"$num",blocks:{num:{mask:Number,thousandsSeparator:" "}}}:[{mask:""},{mask:"num VND",lazy:!1,blocks:{num:{mask:Number,thousandsSeparator:" "}}}]),{validate:k,validationResult:d}=g.useValidationField(r.value,l,f.value);e.watch(()=>t.locale,()=>{n()}),e.watch(()=>t.modelValue,s=>{s!=o.unmaskedValue&&(o.unmaskedValue=s.toString())});const _=()=>{k()},b=()=>{a("press:enter")},y=()=>{l.value=typeof l.value=="number"?+o.unmaskedValue:o.unmaskedValue},n=()=>{o&&o.destroy(),o=B(u.value,v.value),o.on("accept",y)};return e.onMounted(()=>{n(),o.unmaskedValue=l.value.toString()}),(s,$)=>(e.openBlock(),e.createElementBlock("div",N,[e.createVNode(h,{id:r.value,label:s.label,required:s.required},null,8,["id","label","required"]),e.createElementVNode("div",R,[s.$slots.prependIcon?(e.openBlock(),e.createElementBlock("div",I,[e.renderSlot(s.$slots,"prependIcon",{},void 0,!0)])):e.createCommentVNode("",!0),e.createElementVNode("input",{id:r.value,ref_key:"inputRef",ref:u,autocomplete:t.autocomplete?"on":"off",class:e.normalizeClass([m.value,"ds-block ds-h-[40px] ds-w-full ds-rounded-lg ds-border ds-px-3 ds-text-sm ds-drop-shadow-light"]),disabled:t.disabled,placeholder:t.placeholder,readonly:t.readonly,onKeyup:[_,e.withKeys(b,["enter"])]},null,42,S),s.$slots.appendIcon?(e.openBlock(),e.createElementBlock("div",M,[e.renderSlot(s.$slots,"appendIcon",{},void 0,!0)])):e.createCommentVNode("",!0)]),s.hideDetails?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(V,{key:0,"error-message":e.unref(d).errorMessage(),class:"ds-mt-1"},null,8,["error-message"]))]))}});module.exports=w;
 //# sourceMappingURL=design-system87.js.map

package/dist/design-system87.mjs

@@ -3,9 +3,9 @@ import K from "./design-system30.mjs";
 import { useValidationField as x } from "./design-system3.mjs";
 import z from "./design-system29.mjs";
 import { useI18n as D } from "./design-system48.mjs";
-import U from "./design-system94.mjs";
+import U from "./design-system97.mjs";
 import { SupportedLocale as F } from "./design-system5.mjs";
-import A from "./design-system96.mjs";
+import A from "./design-system94.mjs";
 const L = { class: "b-currency-field" }, O = { class: "ds-relative" }, j = {
   key: 0,
   class: "b-currency-field__prepend-icon ds-absolute ds-left-3 ds-top-0 ds-z-[1] ds-flex ds-h-full ds-cursor-pointer ds-items-center hover:ds-text-primary-t"

package/dist/design-system90.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./design-system89.js"),y=require("./design-system91.js"),Q=require("./design-system93.js");/*!
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./design-system89.js"),y=require("./design-system91.js"),Q=require("./design-system100.js");/*!
   * core-base v9.2.2
   * (c) 2022 kazuya kawaguchi
   * Released under the MIT License.