@7pmlabs/design-system 0.6.4 → 0.6.5

package/dist/design-system100.mjs

@@ -1,71 +1,9 @@
-import { defineComponent as w, ref as a, watch as c, onMounted as B, withDirectives as b, openBlock as D, createElementBlock as O, vModelText as x } from "vue";
-const _ = ["disabled"], K = /* @__PURE__ */ w({
-  __name: "BOtpFieldBox",
-  props: {
-    value: { default: "" },
-    focus: { type: Boolean, default: !1 },
-    isDisabled: { type: Boolean, default: !1 }
-  },
-  emits: ["on-change", "on-keydown", "on-keyup", "on-paste", "on-focus", "on-blur"],
-  setup(d, { expose: i, emit: r }) {
-    const t = d, s = r, n = a(t.value || ""), o = a(null), u = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], f = () => {
-      if (!u.includes(n.value)) {
-        n.value = "";
-        return;
-      }
-      return n.value = n.value.toString(), n.value.length > 1 && (n.value = n.value.slice(0, 1)), s("on-change", n.value);
-    }, p = (e) => {
-      t.isDisabled && e.preventDefault();
-      const l = e;
-      [
-        "Alt",
-        "Control",
-        "Meta",
-        "Backspace",
-        "ArrowLeft",
-        "ArrowRight",
-        "v",
-        ...u
-      ].includes(l.key) ? s("on-keydown", e) : l.preventDefault();
-    }, v = (e) => {
-      s("on-keyup", e);
-    }, h = (e) => {
-      s("on-paste", e);
-    }, m = () => (o.value.select(), s("on-focus")), y = () => s("on-blur"), g = () => {
-      o.value.focus(), o.value.select();
-    };
-    return c(
-      () => t.value,
-      (e, l) => {
-        e !== l && (n.value = e);
-      }
-    ), c(
-      () => t.focus,
-      (e, l) => {
-        l !== e && o.value && t.focus && (o.value.focus(), o.value.select());
-      }
-    ), B(() => {
-      o.value && t.focus && (o.value.focus(), o.value.select());
-    }), i({ focus: g }), (e, l) => b((D(), O("input", {
-      ref_key: "inputRef",
-      ref: o,
-      "onUpdate:modelValue": l[0] || (l[0] = (k) => n.value = k),
-      disabled: e.isDisabled,
-      class: "ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200",
-      inputmode: "numeric",
-      maxlength: "1",
-      onBlur: y,
-      onFocus: m,
-      onInput: f,
-      onKeydown: p,
-      onKeyup: v,
-      onPaste: h
-    }, null, 40, _)), [
-      [x, n.value]
-    ]);
-  }
-});
+import o from "./design-system128.mjs";
+var r = 1, n = 4;
+function L(e) {
+  return o(e, r | n);
+}
 export {
-  K as default
+  L as default
 };
 //# sourceMappingURL=design-system100.mjs.map

package/dist/design-system100.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system100.mjs","sources":["../src/components/BOtpField/BOtpFieldBox.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { vModelText as _vModelText, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = [\"disabled\"]\n\nimport { onMounted, ref, type Ref, watch } from 'vue';\n\n//#region Props\nexport interface Props {\n  value?: string;\n  focus?: boolean;\n  isDisabled?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BOtpFieldBox',\n  props: {\n    value: { default: '' },\n    focus: { type: Boolean, default: false },\n    isDisabled: { type: Boolean, default: false }\n  },\n  emits: [\"on-change\", \"on-keydown\", \"on-keyup\", \"on-paste\", \"on-focus\", \"on-blur\"],\n  setup(__props: any, { expose: __expose, emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst model = ref(props.value || '');\nconst inputRef = ref<HTMLInputElement | null>(null) as Ref<HTMLInputElement>;\nconst digits = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];\n//#endregion\n\n//#region Methods\nconst handleOnChange = () => {\n  if (!digits.includes(model.value)) {\n    model.value = '';\n    return;\n  }\n\n  model.value = model.value.toString();\n  if (model.value.length > 1) {\n    model.value = model.value.slice(0, 1);\n  }\n  return emit('on-change', model.value);\n};\n\nconst handleOnKeyDown = (event: KeyboardEvent) => {\n  if (props.isDisabled) {\n    event.preventDefault();\n  }\n  // Only allow characters 0-9, DEL, Backspace, Enter, Right and Left Arrows, and Pasting\n  const keyEvent = event;\n  if (\n    [\n      'Alt',\n      'Control',\n      'Meta',\n      'Backspace',\n      'ArrowLeft',\n      'ArrowRight',\n      'v',\n      ...digits,\n    ].includes(keyEvent.key)\n  ) {\n    emit('on-keydown', event);\n  } else {\n    keyEvent.preventDefault();\n  }\n};\nconst handleOnKeyUp = (event: KeyboardEvent) => {\n  emit('on-keyup', event);\n};\nconst handleOnPaste = (event: ClipboardEvent) => {\n  emit('on-paste', event);\n};\nconst handleOnFocus = () => {\n  inputRef.value.select();\n  return emit('on-focus');\n};\nconst handleOnBlur = () => emit('on-blur');\nconst focusFn = () => {\n  inputRef.value.focus();\n  inputRef.value.select();\n};\n//#endregion\n\n//#region Watchers\nwatch(\n  () => props.value,\n  (newValue, oldValue) => {\n    if (newValue !== oldValue) {\n      model.value = newValue;\n    }\n  },\n);\nwatch(\n  () => props.focus,\n  (newFocusValue, oldFocusValue) => {\n    // Check if focusedInput changed\n    // Prevent calling function if input already in focus\n    if (oldFocusValue !== newFocusValue && inputRef.value && props.focus) {\n      inputRef.value.focus();\n      inputRef.value.select();\n    }\n  },\n);\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  if (inputRef.value && props.focus) {\n    inputRef.value.focus();\n    inputRef.value.select();\n  }\n});\n//#endregion\n\n__expose({ focus: focusFn });\n\nreturn (_ctx: any,_cache: any) => {\n  return _withDirectives((_openBlock(), _createElementBlock(\"input\", {\n    ref_key: \"inputRef\",\n    ref: inputRef,\n    \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((model).value = $event)),\n    disabled: _ctx.isDisabled,\n    class: \"ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200\",\n    inputmode: \"numeric\",\n    maxlength: \"1\",\n    onBlur: handleOnBlur,\n    onFocus: handleOnFocus,\n    onInput: handleOnChange,\n    onKeydown: handleOnKeyDown,\n    onKeyup: handleOnKeyUp,\n    onPaste: handleOnPaste\n  }, null, 40, _hoisted_1)), [\n    [_vModelText, model.value]\n  ])\n}\n}\n\n})"],"names":["_hoisted_1","_sfc_main","_defineComponent","__props","__expose","__emit","props","emit","model","ref","inputRef","digits","handleOnChange","handleOnKeyDown","event","keyEvent","handleOnKeyUp","handleOnPaste","handleOnFocus","handleOnBlur","focusFn","watch","newValue","oldValue","newFocusValue","oldFocusValue","onMounted","_ctx","_cache","_withDirectives","_openBlock","_createElementBlock","$event","_vModelText"],"mappings":"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"}
+{"version":3,"file":"design-system100.mjs","sources":["../node_modules/lodash-es/cloneDeep.js"],"sourcesContent":["import baseClone from './_baseClone.js';\n\n/** Used to compose bitmasks for cloning. */\nvar CLONE_DEEP_FLAG = 1,\n    CLONE_SYMBOLS_FLAG = 4;\n\n/**\n * This method is like `_.clone` except that it recursively clones `value`.\n *\n * @static\n * @memberOf _\n * @since 1.0.0\n * @category Lang\n * @param {*} value The value to recursively clone.\n * @returns {*} Returns the deep cloned value.\n * @see _.clone\n * @example\n *\n * var objects = [{ 'a': 1 }, { 'b': 2 }];\n *\n * var deep = _.cloneDeep(objects);\n * console.log(deep[0] === objects[0]);\n * // => false\n */\nfunction cloneDeep(value) {\n  return baseClone(value, CLONE_DEEP_FLAG | CLONE_SYMBOLS_FLAG);\n}\n\nexport default cloneDeep;\n"],"names":["CLONE_DEEP_FLAG","CLONE_SYMBOLS_FLAG","cloneDeep","value","baseClone"],"mappings":";AAGA,IAAIA,IAAkB,GAClBC,IAAqB;AAoBzB,SAASC,EAAUC,GAAO;AACxB,SAAOC,EAAUD,GAAOH,IAAkBC,CAAkB;AAC9D;","x_google_ignoreList":[0]}

package/dist/design-system101.mjs

@@ -1,9 +1,70 @@
-import o from "./design-system128.mjs";
-var r = 1, n = 4;
-function L(e) {
-  return o(e, r | n);
-}
+import { defineComponent as C, ref as h, computed as d, onMounted as B, onBeforeUnmount as E, openBlock as x, createBlock as y, withCtx as L, createElementVNode as a, normalizeClass as c, renderSlot as _ } from "vue";
+import { BModalSize as t } from "./design-system5.mjs";
+import M from "./design-system35.mjs";
+const g = /* @__PURE__ */ C({
+  __name: "BModalContainer",
+  props: {
+    size: { default: t.Medium },
+    fullscreen: { type: Boolean, default: !1 },
+    persistent: { type: Boolean, default: !1 }
+  },
+  emits: ["close"],
+  setup(i, { emit: u }) {
+    const s = i, n = u, o = h(null), m = d(() => {
+      let e = "ds-relative ds-w-full ds-h-auto ds-m-auto ds-flex ds-items-center ";
+      if (s.fullscreen)
+        e += "ds-w-screen ds-h-screen ";
+      else
+        switch (e += "ds-p-4 ", s.size) {
+          case t.Small:
+            e += "ds-max-w-md ";
+            break;
+          case t.Large:
+            e += "ds-max-w-4xl ";
+            break;
+          case t.Medium:
+          default:
+            e += "ds-max-w-2xl ";
+            break;
+        }
+      return e;
+    }), p = d(() => {
+      let e = "ds-relative ds-bg-white ds-rounded-lg ds-shadow ";
+      return e += s.fullscreen ? "ds-w-screen ds-h-screen ds-rounded-none " : "", e;
+    }), f = () => {
+      document.addEventListener("keydown", r);
+    }, r = (e) => {
+      e.key === "Escape" && n("close");
+    }, w = () => {
+      document.addEventListener("click", l);
+    }, l = (e) => {
+      [o.value].some((k) => e.composedPath().includes(k)) || n("close");
+    };
+    return B(() => {
+      s.persistent || setTimeout(() => {
+        f(), w();
+      }, 200);
+    }), E(() => {
+      s.persistent || (document.removeEventListener("keydown", r), document.removeEventListener("click", l));
+    }), (e, v) => (x(), y(M, null, {
+      default: L(() => [
+        a("div", {
+          class: c([m.value, "modal-wrapper"])
+        }, [
+          a("div", {
+            ref_key: "modalWrapperContentRef",
+            ref: o,
+            class: c([p.value, "modal-wrapper-content ds-w-full"])
+          }, [
+            _(e.$slots, "default")
+          ], 2)
+        ], 2)
+      ]),
+      _: 3
+    }));
+  }
+});
 export {
-  L as default
+  g as default
 };
 //# sourceMappingURL=design-system101.mjs.map

package/dist/design-system101.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system101.mjs","sources":["../node_modules/lodash-es/cloneDeep.js"],"sourcesContent":["import baseClone from './_baseClone.js';\n\n/** Used to compose bitmasks for cloning. */\nvar CLONE_DEEP_FLAG = 1,\n    CLONE_SYMBOLS_FLAG = 4;\n\n/**\n * This method is like `_.clone` except that it recursively clones `value`.\n *\n * @static\n * @memberOf _\n * @since 1.0.0\n * @category Lang\n * @param {*} value The value to recursively clone.\n * @returns {*} Returns the deep cloned value.\n * @see _.clone\n * @example\n *\n * var objects = [{ 'a': 1 }, { 'b': 2 }];\n *\n * var deep = _.cloneDeep(objects);\n * console.log(deep[0] === objects[0]);\n * // => false\n */\nfunction cloneDeep(value) {\n  return baseClone(value, CLONE_DEEP_FLAG | CLONE_SYMBOLS_FLAG);\n}\n\nexport default cloneDeep;\n"],"names":["CLONE_DEEP_FLAG","CLONE_SYMBOLS_FLAG","cloneDeep","value","baseClone"],"mappings":";AAGA,IAAIA,IAAkB,GAClBC,IAAqB;AAoBzB,SAASC,EAAUC,GAAO;AACxB,SAAOC,EAAUD,GAAOH,IAAkBC,CAAkB;AAC9D;","x_google_ignoreList":[0]}
+{"version":3,"file":"design-system101.mjs","sources":["../src/components/BModal/BModalContainer.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from \"vue\"\n\nimport { BModalSize } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue';\nimport BOverlay from '../BOverlay.vue';\n\n//#region Props\nexport interface Props {\n  size?: BModalSize;\n  fullscreen?: boolean;\n  persistent?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BModalContainer',\n  props: {\n    size: { default: BModalSize.Medium },\n    fullscreen: { type: Boolean, default: false },\n    persistent: { type: Boolean, default: false }\n  },\n  emits: [\"close\"],\n  setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst modalWrapperContentRef = ref<HTMLDivElement | null>(null);\nconst modalWrapperCssClass = computed(() => {\n  let result = `ds-relative ds-w-full ds-h-auto ds-m-auto ds-flex ds-items-center `;\n\n  if (props.fullscreen) {\n    result += `ds-w-screen ds-h-screen `;\n  } else {\n    result += `ds-p-4 `;\n    switch (props.size) {\n      case BModalSize.Small:\n        result += `ds-max-w-md `;\n        break;\n      case BModalSize.Large:\n        result += `ds-max-w-4xl `;\n        break;\n      case BModalSize.Medium:\n      default:\n        result += `ds-max-w-2xl `;\n        break;\n    }\n  }\n\n  return result;\n});\nconst modalWrapperContentCssClass = computed(() => {\n  let result = `ds-relative ds-bg-white ds-rounded-lg ds-shadow `;\n  result += props.fullscreen ? `ds-w-screen ds-h-screen ds-rounded-none ` : ``;\n\n  return result;\n});\n//#endregion\n\n//#region Methods\nconst initPressEscapeEventListener = () => {\n  document.addEventListener('keydown', closeOnEscapePressed);\n};\nconst closeOnEscapePressed = (event: KeyboardEvent) => {\n  if (event.key === 'Escape') {\n    emit('close');\n  }\n};\nconst initClickOutsideEventListener = () => {\n  document.addEventListener('click', closeOnClickOutside);\n};\nconst closeOnClickOutside = (event: any) => {\n  const refs = [modalWrapperContentRef.value];\n  const withinBoundaries = refs.some((r) => event.composedPath().includes(r));\n  if (!withinBoundaries) {\n    emit('close');\n  }\n};\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  if (!props.persistent) {\n    setTimeout(() => {\n      initPressEscapeEventListener();\n      initClickOutsideEventListener();\n    }, 200);\n  }\n});\nonBeforeUnmount(() => {\n  if (!props.persistent) {\n    document.removeEventListener('keydown', closeOnEscapePressed);\n    document.removeEventListener('click', closeOnClickOutside);\n  }\n});\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createBlock(BOverlay, null, {\n    default: _withCtx(() => [\n      _createElementVNode(\"div\", {\n        class: _normalizeClass([modalWrapperCssClass.value, \"modal-wrapper\"])\n      }, [\n        _createElementVNode(\"div\", {\n          ref_key: \"modalWrapperContentRef\",\n          ref: modalWrapperContentRef,\n          class: _normalizeClass([modalWrapperContentCssClass.value, \"modal-wrapper-content ds-w-full\"])\n        }, [\n          _renderSlot(_ctx.$slots, \"default\")\n        ], 2)\n      ], 2)\n    ]),\n    _: 3\n  }))\n}\n}\n\n})"],"names":["_sfc_main","_defineComponent","BModalSize","__props","__emit","props","emit","modalWrapperContentRef","ref","modalWrapperCssClass","computed","result","modalWrapperContentCssClass","initPressEscapeEventListener","closeOnEscapePressed","event","initClickOutsideEventListener","closeOnClickOutside","r","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createBlock","BOverlay","_withCtx","_createElementVNode","_normalizeClass","_renderSlot"],"mappings":";;;AAeA,MAA4BA,IAAiBC,gBAAAA,EAAA;AAAA,EAC3C,QAAQ;AAAA,EACR,OAAO;AAAA,IACL,MAAM,EAAE,SAASC,EAAW,OAAO;AAAA,IACnC,YAAY,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC5C,YAAY,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,EAC9C;AAAA,EACA,OAAO,CAAC,OAAO;AAAA,EACf,MAAMC,GAAc,EAAE,MAAMC,KAAU;AAExC,UAAMC,IAAQF,GAIRG,IAAOF,GAIPG,IAAyBC,EAA2B,IAAI,GACxDC,IAAuBC,EAAS,MAAM;AAC1C,UAAIC,IAAS;AAEb,UAAIN,EAAM;AACE,QAAAM,KAAA;AAAA;AAGV,gBADUA,KAAA,WACFN,EAAM,MAAM;AAAA,UAClB,KAAKH,EAAW;AACJ,YAAAS,KAAA;AACV;AAAA,UACF,KAAKT,EAAW;AACJ,YAAAS,KAAA;AACV;AAAA,UACF,KAAKT,EAAW;AAAA,UAChB;AACY,YAAAS,KAAA;AACV;AAAA,QACJ;AAGK,aAAAA;AAAA,IAAA,CACR,GACKC,IAA8BF,EAAS,MAAM;AACjD,UAAIC,IAAS;AACH,aAAAA,KAAAN,EAAM,aAAa,6CAA6C,IAEnEM;AAAA,IAAA,CACR,GAIKE,IAA+B,MAAM;AAChC,eAAA,iBAAiB,WAAWC,CAAoB;AAAA,IAAA,GAErDA,IAAuB,CAACC,MAAyB;AACjD,MAAAA,EAAM,QAAQ,YAChBT,EAAK,OAAO;AAAA,IACd,GAEIU,IAAgC,MAAM;AACjC,eAAA,iBAAiB,SAASC,CAAmB;AAAA,IAAA,GAElDA,IAAsB,CAACF,MAAe;AAG1C,MAFa,CAACR,EAAuB,KAAK,EACZ,KAAK,CAACW,MAAMH,EAAM,eAAe,SAASG,CAAC,CAAC,KAExEZ,EAAK,OAAO;AAAA,IACd;AAKF,WAAAa,EAAU,MAAM;AACV,MAACd,EAAM,cACT,WAAW,MAAM;AACc,QAAAQ,KACCG;SAC7B,GAAG;AAAA,IACR,CACD,GACDI,EAAgB,MAAM;AAChB,MAACf,EAAM,eACA,SAAA,oBAAoB,WAAWS,CAAoB,GACnD,SAAA,oBAAoB,SAASG,CAAmB;AAAA,IAC3D,CACD,GAGM,CAACI,GAAUC,OACRC,EAAW,GAAGC,EAAaC,GAAU,MAAM;AAAA,MACjD,SAASC,EAAS,MAAM;AAAA,QACtBC,EAAoB,OAAO;AAAA,UACzB,OAAOC,EAAgB,CAACnB,EAAqB,OAAO,eAAe,CAAC;AAAA,QAAA,GACnE;AAAA,UACDkB,EAAoB,OAAO;AAAA,YACzB,SAAS;AAAA,YACT,KAAKpB;AAAA,YACL,OAAOqB,EAAgB,CAAChB,EAA4B,OAAO,iCAAiC,CAAC;AAAA,UAAA,GAC5F;AAAA,YACDiB,EAAYR,EAAK,QAAQ,SAAS;AAAA,aACjC,CAAC;AAAA,WACH,CAAC;AAAA,MAAA,CACL;AAAA,MACD,GAAG;AAAA,IAAA,CACJ;AAAA,EAEH;AAEA,CAAC;"}

package/dist/design-system116.mjs

@@ -1,4 +1,4 @@
-import f from "./design-system100.mjs";
+import f from "./design-system101.mjs";
 export {
   f as default
 };

package/dist/design-system16.mjs

@@ -1,7 +1,7 @@
 import { defineComponent as u, computed as m, watch as f, onBeforeUnmount as p, openBlock as o, createBlock as a, Teleport as y, createVNode as B, Transition as _, withCtx as r, normalizeClass as v, renderSlot as z, createCommentVNode as V } from "vue";
 import { BModalSize as k } from "./design-system5.mjs";
 import { lockScrollBody as C, unlockScrollBody as n } from "./design-system6.mjs";
-import S from "./design-system99.mjs";
+import S from "./design-system101.mjs";
 const $ = {
   // https://vuejs.org/guide/components/attrs.html#disabling-attribute-inheritance
   inheritAttrs: !1

package/dist/design-system18.mjs

@@ -2,9 +2,9 @@ import { defineComponent as L, ref as f, computed as l, openBlock as d, createEl
 import J from "./design-system14.mjs";
 import { useValidationField as Q } from "./design-system3.mjs";
 import { useI18n as T } from "./design-system49.mjs";
-import X from "./design-system100.mjs";
+import X from "./design-system99.mjs";
 import Y from "./design-system98.mjs";
-import Z from "./design-system101.mjs";
+import Z from "./design-system100.mjs";
 const ee = { class: "ds-flex ds-items-center ds-justify-center ds-space-x-2" }, re = /* @__PURE__ */ L({
   __name: "BOtpField",
   props: {

package/dist/design-system19.mjs

@@ -1,13 +1,13 @@
-import { defineComponent as P, computed as f, openBlock as C, createElementBlock as O, createElementVNode as s, normalizeClass as n, toDisplayString as u, withDirectives as o, vShow as i } from "vue";
-import { BPaginationSize as p } from "./design-system5.mjs";
-const B = { class: "ds-inline-flex ds-space-x-1" }, y = /* @__PURE__ */ s("svg", {
+import { defineComponent as P, computed as p, openBlock as C, createElementBlock as O, createElementVNode as s, normalizeClass as n, toDisplayString as r, withDirectives as o, vShow as i } from "vue";
+import { BPaginationSize as f } from "./design-system5.mjs";
+const B = { class: "ds-inline-flex ds-space-x-1" }, x = /* @__PURE__ */ s("svg", {
   class: "ds-h-4 ds-w-4 ds-fill-black/80",
   viewBox: "0 0 320 512",
   xmlns: "http://www.w3.org/2000/svg"
 }, [
   /* @__PURE__ */ s("path", { d: "M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z" })
-], -1), x = [
-  y
+], -1), y = [
+  x
 ], z = /* @__PURE__ */ s("svg", {
   class: "ds-h-4 ds-w-4 ds-fill-black/80",
   viewBox: "0 0 320 512",
@@ -23,26 +23,26 @@ const B = { class: "ds-inline-flex ds-space-x-1" }, y = /* @__PURE__ */ s("svg",
     numberOfPages: {},
     border: { type: Boolean, default: !1 },
     transparent: { type: Boolean, default: !1 },
-    size: { default: p.Medium }
+    size: { default: f.Medium }
   },
   emits: ["change", "update:modelValue"],
   setup(b, { emit: w }) {
-    const d = b, v = w, e = f({
+    const d = b, v = w, e = p({
       get() {
         return d.modelValue + 1;
       },
       set(l) {
         v("update:modelValue", l - 1);
       }
-    }), t = f(() => {
+    }), t = p(() => {
       let l = `
   ds-flex ds-items-center ds-justify-center
   ds-rounded-lg `;
       switch (d.border && (l += "ds-border ds-border-gray-300 "), d.size) {
-        case p.Small:
+        case f.Small:
           l += "ds-w-8 ds-h-8 ";
           break;
-        case p.Medium:
+        case f.Medium:
         default:
           l += "ds-w-10 ds-h-10 ";
           break;
@@ -54,67 +54,67 @@ const B = { class: "ds-inline-flex ds-space-x-1" }, y = /* @__PURE__ */ s("svg",
       e.value > 1 && (e.value--, v("change", e.value));
     }, h = () => {
       e.value < d.numberOfPages && (e.value++, v("change", e.value));
-    }, r = (l = !0) => l ? "ds-text-white ds-bg-primary-t " : `ds-text-black/80 hover:ds-bg-primary-t/10 ${d.transparent ? "ds-bg-transparent" : "ds-bg-white"}`;
+    }, u = (l = !0) => l ? "ds-text-white ds-bg-primary-t " : `ds-text-black/80 ${d.transparent ? "ds-bg-transparent" : "ds-bg-white"}`;
     return (l, a) => (C(), O("nav", null, [
       s("ul", B, [
         s("li", {
-          class: n([[t.value, r(!1)], "ds-ml-0 ds-cursor-pointer"]),
+          class: n([[t.value, u(!1)], "ds-ml-0 ds-cursor-pointer"]),
           onClick: k
-        }, x, 2),
+        }, y, 2),
         s("li", {
-          class: n([[r(e.value === 1), t.value], "ds-cursor-pointer"]),
+          class: n([[u(e.value === 1), t.value], "ds-cursor-pointer"]),
           onClick: a[0] || (a[0] = (m) => c(1))
         }, [
-          s("a", null, u(V))
+          s("a", null, r(V))
         ], 2),
         o(s("li", {
           class: n([[t.value], "ds-cursor-default"])
         }, [
-          s("a", null, u(g))
+          s("a", null, r(g))
         ], 2), [
           [i, e.value > 3]
         ]),
         o(s("li", {
-          class: n([[t.value, r(!1)], "ds-cursor-pointer"]),
+          class: n([[t.value, u(!1)], "ds-cursor-pointer"]),
           onClick: a[1] || (a[1] = (m) => c(e.value - 1))
         }, [
-          s("a", null, u(e.value - 1), 1)
+          s("a", null, r(e.value - 1), 1)
         ], 2), [
           [i, e.value > 2]
         ]),
         o(s("li", {
-          class: n([[t.value, r()], "ds-cursor-pointer"]),
+          class: n([[t.value, u()], "ds-cursor-pointer"]),
           onClick: a[2] || (a[2] = (m) => c(e.value))
         }, [
-          s("a", null, u(e.value), 1)
+          s("a", null, r(e.value), 1)
         ], 2), [
           [i, e.value !== 1 && e.value !== l.numberOfPages]
         ]),
         o(s("li", {
-          class: n([[t.value, r(!1)], "ds-cursor-pointer"]),
+          class: n([[t.value, u(!1)], "ds-cursor-pointer"]),
           onClick: a[3] || (a[3] = (m) => c(e.value + 1))
         }, [
-          s("a", null, u(e.value + 1), 1)
+          s("a", null, r(e.value + 1), 1)
         ], 2), [
           [i, e.value < l.numberOfPages - 1]
         ]),
         o(s("li", {
           class: n([[t.value], "ds-cursor-default"])
         }, [
-          s("a", null, u(g))
+          s("a", null, r(g))
         ], 2), [
           [i, e.value < l.numberOfPages - 2]
         ]),
         o(s("li", {
-          class: n([[t.value, r(e.value === l.numberOfPages)], "ds-cursor-pointer"]),
+          class: n([[t.value, u(e.value === l.numberOfPages)], "ds-cursor-pointer"]),
           onClick: a[4] || (a[4] = (m) => c(l.numberOfPages))
         }, [
-          s("a", null, u(l.numberOfPages), 1)
+          s("a", null, r(l.numberOfPages), 1)
         ], 2), [
           [i, l.numberOfPages > 1]
         ]),
         s("li", {
-          class: n([[t.value, r(!1)], "ds-cursor-pointer"]),
+          class: n([[t.value, u(!1)], "ds-cursor-pointer"]),
           onClick: h
         }, $, 2)
       ])

package/dist/design-system19.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system19.mjs","sources":["../src/components/BPagination.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, toDisplayString as _toDisplayString, vShow as _vShow, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = { class: \"ds-inline-flex ds-space-x-1\" }\nconst _hoisted_2 = /*#__PURE__*/_createElementVNode(\"svg\", {\n  class: \"ds-h-4 ds-w-4 ds-fill-black/80\",\n  viewBox: \"0 0 320 512\",\n  xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n  /*#__PURE__*/_createElementVNode(\"path\", { d: \"M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z\" })\n], -1)\nconst _hoisted_3 = [\n  _hoisted_2\n]\nconst _hoisted_4 = /*#__PURE__*/_createElementVNode(\"svg\", {\n  class: \"ds-h-4 ds-w-4 ds-fill-black/80\",\n  viewBox: \"0 0 320 512\",\n  xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n  /*#__PURE__*/_createElementVNode(\"path\", { d: \"M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z\" })\n], -1)\nconst _hoisted_5 = [\n  _hoisted_4\n]\n\nimport { BPaginationSize } from '@/constants/Enums';\nimport { computed } from 'vue';\n\n//#region Props\nexport interface BPaginationProps {\n  /**\n   * Start by 1.\n   */\n  modelValue: number;\n  numberOfPages: number;\n  /**\n   * Bordered buttons.\n   */\n  border?: boolean;\n  /**\n   * Transparent background buttons.\n   */\n  transparent?: boolean;\n  size?: `${BPaginationSize}`;\n}\n\nconst First = 1;\nconst EllipsisText = '...';\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BPagination',\n  props: {\n    modelValue: {},\n    numberOfPages: {},\n    border: { type: Boolean, default: false },\n    transparent: { type: Boolean, default: false },\n    size: { default: BPaginationSize.Medium }\n  },\n  emits: [\"change\", \"update:modelValue\"],\n  setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst value = computed({\n  get() {\n    return props.modelValue + 1;\n  },\n  set(val: number) {\n    emit('update:modelValue', val - 1);\n  },\n});\nconst paginationItemClass = computed(() => {\n  let result = `\n  ds-flex ds-items-center ds-justify-center\n  ds-rounded-lg `;\n\n  if (props.border) {\n    result += 'ds-border ds-border-gray-300 ';\n  }\n\n  switch (props.size) {\n    case BPaginationSize.Small:\n      result += `ds-w-8 ds-h-8 `;\n      break;\n    case BPaginationSize.Medium:\n    default:\n      result += `ds-w-10 ds-h-10 `;\n      break;\n  }\n\n  return result;\n});\n//#endregion\n\n//#region Methods\nconst clickPage = (page: number) => {\n  value.value = page;\n  // Emitted when page changes via user interaction\n  emit('change', value.value);\n};\nconst clickPrevious = () => {\n  if (value.value > 1) {\n    value.value--;\n    emit('change', value.value);\n  }\n};\nconst clickNext = () => {\n  if (value.value < props.numberOfPages) {\n    value.value++;\n    emit('change', value.value);\n  }\n};\nconst getActiveClass = (isActive: boolean = true) => {\n  return isActive\n    ? `ds-text-white ds-bg-primary-t `\n    : `ds-text-black/80 hover:ds-bg-primary-t/10 ${\n        props.transparent ? 'ds-bg-transparent' : 'ds-bg-white'\n      }`;\n};\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"nav\", null, [\n    _createElementVNode(\"ul\", _hoisted_1, [\n      _createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(false)], \"ds-ml-0 ds-cursor-pointer\"]),\n        onClick: clickPrevious\n      }, _hoisted_3, 2),\n      _createElementVNode(\"li\", {\n        class: _normalizeClass([[getActiveClass(value.value === 1), paginationItemClass.value], \"ds-cursor-pointer\"]),\n        onClick: _cache[0] || (_cache[0] = ($event: any) => (clickPage(1)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(First))\n      ], 2),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value], \"ds-cursor-default\"])\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(EllipsisText))\n      ], 2), [\n        [_vShow, value.value > 3]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(false)], \"ds-cursor-pointer\"]),\n        onClick: _cache[1] || (_cache[1] = ($event: any) => (clickPage(value.value - 1)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(value.value - 1), 1)\n      ], 2), [\n        [_vShow, value.value > 2]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass()], \"ds-cursor-pointer\"]),\n        onClick: _cache[2] || (_cache[2] = ($event: any) => (clickPage(value.value)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(value.value), 1)\n      ], 2), [\n        [_vShow, value.value !== 1 && value.value !== _ctx.numberOfPages]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(false)], \"ds-cursor-pointer\"]),\n        onClick: _cache[3] || (_cache[3] = ($event: any) => (clickPage(value.value + 1)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(value.value + 1), 1)\n      ], 2), [\n        [_vShow, value.value < _ctx.numberOfPages - 1]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value], \"ds-cursor-default\"])\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(EllipsisText))\n      ], 2), [\n        [_vShow, value.value < _ctx.numberOfPages - 2]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(value.value === _ctx.numberOfPages)], \"ds-cursor-pointer\"]),\n        onClick: _cache[4] || (_cache[4] = ($event: any) => (clickPage(_ctx.numberOfPages)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(_ctx.numberOfPages), 1)\n      ], 2), [\n        [_vShow, _ctx.numberOfPages > 1]\n      ]),\n      _createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(false)], \"ds-cursor-pointer\"]),\n        onClick: clickNext\n      }, _hoisted_5, 2)\n    ])\n  ]))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_createElementVNode","_hoisted_3","_hoisted_4","_hoisted_5","First","EllipsisText","_sfc_main","_defineComponent","BPaginationSize","__props","__emit","props","emit","value","computed","val","paginationItemClass","result","clickPage","page","clickPrevious","clickNext","getActiveClass","isActive","_ctx","_cache","_openBlock","_createElementBlock","_normalizeClass","$event","_toDisplayString","_withDirectives","_vShow"],"mappings":"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"}
+{"version":3,"file":"design-system19.mjs","sources":["../src/components/BPagination.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, toDisplayString as _toDisplayString, vShow as _vShow, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = { class: \"ds-inline-flex ds-space-x-1\" }\nconst _hoisted_2 = /*#__PURE__*/_createElementVNode(\"svg\", {\n  class: \"ds-h-4 ds-w-4 ds-fill-black/80\",\n  viewBox: \"0 0 320 512\",\n  xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n  /*#__PURE__*/_createElementVNode(\"path\", { d: \"M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z\" })\n], -1)\nconst _hoisted_3 = [\n  _hoisted_2\n]\nconst _hoisted_4 = /*#__PURE__*/_createElementVNode(\"svg\", {\n  class: \"ds-h-4 ds-w-4 ds-fill-black/80\",\n  viewBox: \"0 0 320 512\",\n  xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n  /*#__PURE__*/_createElementVNode(\"path\", { d: \"M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z\" })\n], -1)\nconst _hoisted_5 = [\n  _hoisted_4\n]\n\nimport { BPaginationSize } from '@/constants/Enums';\nimport { computed } from 'vue';\n\n//#region Props\nexport interface BPaginationProps {\n  /**\n   * Start by 1.\n   */\n  modelValue: number;\n  numberOfPages: number;\n  /**\n   * Bordered buttons.\n   */\n  border?: boolean;\n  /**\n   * Transparent background buttons.\n   */\n  transparent?: boolean;\n  size?: `${BPaginationSize}`;\n}\n\nconst First = 1;\nconst EllipsisText = '...';\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BPagination',\n  props: {\n    modelValue: {},\n    numberOfPages: {},\n    border: { type: Boolean, default: false },\n    transparent: { type: Boolean, default: false },\n    size: { default: BPaginationSize.Medium }\n  },\n  emits: [\"change\", \"update:modelValue\"],\n  setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst value = computed({\n  get() {\n    return props.modelValue + 1;\n  },\n  set(val: number) {\n    emit('update:modelValue', val - 1);\n  },\n});\nconst paginationItemClass = computed(() => {\n  let result = `\n  ds-flex ds-items-center ds-justify-center\n  ds-rounded-lg `;\n\n  if (props.border) {\n    result += 'ds-border ds-border-gray-300 ';\n  }\n\n  switch (props.size) {\n    case BPaginationSize.Small:\n      result += `ds-w-8 ds-h-8 `;\n      break;\n    case BPaginationSize.Medium:\n    default:\n      result += `ds-w-10 ds-h-10 `;\n      break;\n  }\n\n  return result;\n});\n//#endregion\n\n//#region Methods\nconst clickPage = (page: number) => {\n  value.value = page;\n  // Emitted when page changes via user interaction\n  emit('change', value.value);\n};\nconst clickPrevious = () => {\n  if (value.value > 1) {\n    value.value--;\n    emit('change', value.value);\n  }\n};\nconst clickNext = () => {\n  if (value.value < props.numberOfPages) {\n    value.value++;\n    emit('change', value.value);\n  }\n};\nconst getActiveClass = (isActive: boolean = true) => {\n  return isActive\n    ? `ds-text-white ds-bg-primary-t `\n    : `ds-text-black/80 ${\n        props.transparent ? 'ds-bg-transparent' : 'ds-bg-white'\n      }`;\n};\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"nav\", null, [\n    _createElementVNode(\"ul\", _hoisted_1, [\n      _createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(false)], \"ds-ml-0 ds-cursor-pointer\"]),\n        onClick: clickPrevious\n      }, _hoisted_3, 2),\n      _createElementVNode(\"li\", {\n        class: _normalizeClass([[getActiveClass(value.value === 1), paginationItemClass.value], \"ds-cursor-pointer\"]),\n        onClick: _cache[0] || (_cache[0] = ($event: any) => (clickPage(1)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(First))\n      ], 2),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value], \"ds-cursor-default\"])\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(EllipsisText))\n      ], 2), [\n        [_vShow, value.value > 3]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(false)], \"ds-cursor-pointer\"]),\n        onClick: _cache[1] || (_cache[1] = ($event: any) => (clickPage(value.value - 1)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(value.value - 1), 1)\n      ], 2), [\n        [_vShow, value.value > 2]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass()], \"ds-cursor-pointer\"]),\n        onClick: _cache[2] || (_cache[2] = ($event: any) => (clickPage(value.value)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(value.value), 1)\n      ], 2), [\n        [_vShow, value.value !== 1 && value.value !== _ctx.numberOfPages]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(false)], \"ds-cursor-pointer\"]),\n        onClick: _cache[3] || (_cache[3] = ($event: any) => (clickPage(value.value + 1)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(value.value + 1), 1)\n      ], 2), [\n        [_vShow, value.value < _ctx.numberOfPages - 1]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value], \"ds-cursor-default\"])\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(EllipsisText))\n      ], 2), [\n        [_vShow, value.value < _ctx.numberOfPages - 2]\n      ]),\n      _withDirectives(_createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(value.value === _ctx.numberOfPages)], \"ds-cursor-pointer\"]),\n        onClick: _cache[4] || (_cache[4] = ($event: any) => (clickPage(_ctx.numberOfPages)))\n      }, [\n        _createElementVNode(\"a\", null, _toDisplayString(_ctx.numberOfPages), 1)\n      ], 2), [\n        [_vShow, _ctx.numberOfPages > 1]\n      ]),\n      _createElementVNode(\"li\", {\n        class: _normalizeClass([[paginationItemClass.value, getActiveClass(false)], \"ds-cursor-pointer\"]),\n        onClick: clickNext\n      }, _hoisted_5, 2)\n    ])\n  ]))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_createElementVNode","_hoisted_3","_hoisted_4","_hoisted_5","First","EllipsisText","_sfc_main","_defineComponent","BPaginationSize","__props","__emit","props","emit","value","computed","val","paginationItemClass","result","clickPage","page","clickPrevious","clickNext","getActiveClass","isActive","_ctx","_cache","_openBlock","_createElementBlock","_normalizeClass","$event","_toDisplayString","_withDirectives","_vShow"],"mappings":"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"}

package/dist/design-system99.mjs

@@ -1,70 +1,71 @@
-import { defineComponent as C, ref as h, computed as d, onMounted as B, onBeforeUnmount as E, openBlock as x, createBlock as y, withCtx as L, createElementVNode as a, normalizeClass as c, renderSlot as _ } from "vue";
-import { BModalSize as t } from "./design-system5.mjs";
-import M from "./design-system35.mjs";
-const g = /* @__PURE__ */ C({
-  __name: "BModalContainer",
+import { defineComponent as w, ref as a, watch as c, onMounted as B, withDirectives as b, openBlock as D, createElementBlock as O, vModelText as x } from "vue";
+const _ = ["disabled"], K = /* @__PURE__ */ w({
+  __name: "BOtpFieldBox",
   props: {
-    size: { default: t.Medium },
-    fullscreen: { type: Boolean, default: !1 },
-    persistent: { type: Boolean, default: !1 }
+    value: { default: "" },
+    focus: { type: Boolean, default: !1 },
+    isDisabled: { type: Boolean, default: !1 }
   },
-  emits: ["close"],
-  setup(i, { emit: u }) {
-    const s = i, n = u, o = h(null), m = d(() => {
-      let e = "ds-relative ds-w-full ds-h-auto ds-m-auto ds-flex ds-items-center ";
-      if (s.fullscreen)
-        e += "ds-w-screen ds-h-screen ";
-      else
-        switch (e += "ds-p-4 ", s.size) {
-          case t.Small:
-            e += "ds-max-w-md ";
-            break;
-          case t.Large:
-            e += "ds-max-w-4xl ";
-            break;
-          case t.Medium:
-          default:
-            e += "ds-max-w-2xl ";
-            break;
-        }
-      return e;
-    }), p = d(() => {
-      let e = "ds-relative ds-bg-white ds-rounded-lg ds-shadow ";
-      return e += s.fullscreen ? "ds-w-screen ds-h-screen ds-rounded-none " : "", e;
-    }), f = () => {
-      document.addEventListener("keydown", r);
-    }, r = (e) => {
-      e.key === "Escape" && n("close");
-    }, w = () => {
-      document.addEventListener("click", l);
-    }, l = (e) => {
-      [o.value].some((k) => e.composedPath().includes(k)) || n("close");
+  emits: ["on-change", "on-keydown", "on-keyup", "on-paste", "on-focus", "on-blur"],
+  setup(d, { expose: i, emit: r }) {
+    const t = d, s = r, n = a(t.value || ""), o = a(null), u = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], f = () => {
+      if (!u.includes(n.value)) {
+        n.value = "";
+        return;
+      }
+      return n.value = n.value.toString(), n.value.length > 1 && (n.value = n.value.slice(0, 1)), s("on-change", n.value);
+    }, p = (e) => {
+      t.isDisabled && e.preventDefault();
+      const l = e;
+      [
+        "Alt",
+        "Control",
+        "Meta",
+        "Backspace",
+        "ArrowLeft",
+        "ArrowRight",
+        "v",
+        ...u
+      ].includes(l.key) ? s("on-keydown", e) : l.preventDefault();
+    }, v = (e) => {
+      s("on-keyup", e);
+    }, h = (e) => {
+      s("on-paste", e);
+    }, m = () => (o.value.select(), s("on-focus")), y = () => s("on-blur"), g = () => {
+      o.value.focus(), o.value.select();
     };
-    return B(() => {
-      s.persistent || setTimeout(() => {
-        f(), w();
-      }, 200);
-    }), E(() => {
-      s.persistent || (document.removeEventListener("keydown", r), document.removeEventListener("click", l));
-    }), (e, v) => (x(), y(M, null, {
-      default: L(() => [
-        a("div", {
-          class: c([m.value, "modal-wrapper"])
-        }, [
-          a("div", {
-            ref_key: "modalWrapperContentRef",
-            ref: o,
-            class: c([p.value, "modal-wrapper-content ds-w-full"])
-          }, [
-            _(e.$slots, "default")
-          ], 2)
-        ], 2)
-      ]),
-      _: 3
-    }));
+    return c(
+      () => t.value,
+      (e, l) => {
+        e !== l && (n.value = e);
+      }
+    ), c(
+      () => t.focus,
+      (e, l) => {
+        l !== e && o.value && t.focus && (o.value.focus(), o.value.select());
+      }
+    ), B(() => {
+      o.value && t.focus && (o.value.focus(), o.value.select());
+    }), i({ focus: g }), (e, l) => b((D(), O("input", {
+      ref_key: "inputRef",
+      ref: o,
+      "onUpdate:modelValue": l[0] || (l[0] = (k) => n.value = k),
+      disabled: e.isDisabled,
+      class: "ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200",
+      inputmode: "numeric",
+      maxlength: "1",
+      onBlur: y,
+      onFocus: m,
+      onInput: f,
+      onKeydown: p,
+      onKeyup: v,
+      onPaste: h
+    }, null, 40, _)), [
+      [x, n.value]
+    ]);
   }
 });
 export {
-  g as default
+  K as default
 };
 //# sourceMappingURL=design-system99.mjs.map

package/dist/design-system99.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system99.mjs","sources":["../src/components/BModal/BModalContainer.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from \"vue\"\n\nimport { BModalSize } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue';\nimport BOverlay from '../BOverlay.vue';\n\n//#region Props\nexport interface Props {\n  size?: BModalSize;\n  fullscreen?: boolean;\n  persistent?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BModalContainer',\n  props: {\n    size: { default: BModalSize.Medium },\n    fullscreen: { type: Boolean, default: false },\n    persistent: { type: Boolean, default: false }\n  },\n  emits: [\"close\"],\n  setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst modalWrapperContentRef = ref<HTMLDivElement | null>(null);\nconst modalWrapperCssClass = computed(() => {\n  let result = `ds-relative ds-w-full ds-h-auto ds-m-auto ds-flex ds-items-center `;\n\n  if (props.fullscreen) {\n    result += `ds-w-screen ds-h-screen `;\n  } else {\n    result += `ds-p-4 `;\n    switch (props.size) {\n      case BModalSize.Small:\n        result += `ds-max-w-md `;\n        break;\n      case BModalSize.Large:\n        result += `ds-max-w-4xl `;\n        break;\n      case BModalSize.Medium:\n      default:\n        result += `ds-max-w-2xl `;\n        break;\n    }\n  }\n\n  return result;\n});\nconst modalWrapperContentCssClass = computed(() => {\n  let result = `ds-relative ds-bg-white ds-rounded-lg ds-shadow `;\n  result += props.fullscreen ? `ds-w-screen ds-h-screen ds-rounded-none ` : ``;\n\n  return result;\n});\n//#endregion\n\n//#region Methods\nconst initPressEscapeEventListener = () => {\n  document.addEventListener('keydown', closeOnEscapePressed);\n};\nconst closeOnEscapePressed = (event: KeyboardEvent) => {\n  if (event.key === 'Escape') {\n    emit('close');\n  }\n};\nconst initClickOutsideEventListener = () => {\n  document.addEventListener('click', closeOnClickOutside);\n};\nconst closeOnClickOutside = (event: any) => {\n  const refs = [modalWrapperContentRef.value];\n  const withinBoundaries = refs.some((r) => event.composedPath().includes(r));\n  if (!withinBoundaries) {\n    emit('close');\n  }\n};\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  if (!props.persistent) {\n    setTimeout(() => {\n      initPressEscapeEventListener();\n      initClickOutsideEventListener();\n    }, 200);\n  }\n});\nonBeforeUnmount(() => {\n  if (!props.persistent) {\n    document.removeEventListener('keydown', closeOnEscapePressed);\n    document.removeEventListener('click', closeOnClickOutside);\n  }\n});\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createBlock(BOverlay, null, {\n    default: _withCtx(() => [\n      _createElementVNode(\"div\", {\n        class: _normalizeClass([modalWrapperCssClass.value, \"modal-wrapper\"])\n      }, [\n        _createElementVNode(\"div\", {\n          ref_key: \"modalWrapperContentRef\",\n          ref: modalWrapperContentRef,\n          class: _normalizeClass([modalWrapperContentCssClass.value, \"modal-wrapper-content ds-w-full\"])\n        }, [\n          _renderSlot(_ctx.$slots, \"default\")\n        ], 2)\n      ], 2)\n    ]),\n    _: 3\n  }))\n}\n}\n\n})"],"names":["_sfc_main","_defineComponent","BModalSize","__props","__emit","props","emit","modalWrapperContentRef","ref","modalWrapperCssClass","computed","result","modalWrapperContentCssClass","initPressEscapeEventListener","closeOnEscapePressed","event","initClickOutsideEventListener","closeOnClickOutside","r","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createBlock","BOverlay","_withCtx","_createElementVNode","_normalizeClass","_renderSlot"],"mappings":";;;AAeA,MAA4BA,IAAiBC,gBAAAA,EAAA;AAAA,EAC3C,QAAQ;AAAA,EACR,OAAO;AAAA,IACL,MAAM,EAAE,SAASC,EAAW,OAAO;AAAA,IACnC,YAAY,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC5C,YAAY,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,EAC9C;AAAA,EACA,OAAO,CAAC,OAAO;AAAA,EACf,MAAMC,GAAc,EAAE,MAAMC,KAAU;AAExC,UAAMC,IAAQF,GAIRG,IAAOF,GAIPG,IAAyBC,EAA2B,IAAI,GACxDC,IAAuBC,EAAS,MAAM;AAC1C,UAAIC,IAAS;AAEb,UAAIN,EAAM;AACE,QAAAM,KAAA;AAAA;AAGV,gBADUA,KAAA,WACFN,EAAM,MAAM;AAAA,UAClB,KAAKH,EAAW;AACJ,YAAAS,KAAA;AACV;AAAA,UACF,KAAKT,EAAW;AACJ,YAAAS,KAAA;AACV;AAAA,UACF,KAAKT,EAAW;AAAA,UAChB;AACY,YAAAS,KAAA;AACV;AAAA,QACJ;AAGK,aAAAA;AAAA,IAAA,CACR,GACKC,IAA8BF,EAAS,MAAM;AACjD,UAAIC,IAAS;AACH,aAAAA,KAAAN,EAAM,aAAa,6CAA6C,IAEnEM;AAAA,IAAA,CACR,GAIKE,IAA+B,MAAM;AAChC,eAAA,iBAAiB,WAAWC,CAAoB;AAAA,IAAA,GAErDA,IAAuB,CAACC,MAAyB;AACjD,MAAAA,EAAM,QAAQ,YAChBT,EAAK,OAAO;AAAA,IACd,GAEIU,IAAgC,MAAM;AACjC,eAAA,iBAAiB,SAASC,CAAmB;AAAA,IAAA,GAElDA,IAAsB,CAACF,MAAe;AAG1C,MAFa,CAACR,EAAuB,KAAK,EACZ,KAAK,CAACW,MAAMH,EAAM,eAAe,SAASG,CAAC,CAAC,KAExEZ,EAAK,OAAO;AAAA,IACd;AAKF,WAAAa,EAAU,MAAM;AACV,MAACd,EAAM,cACT,WAAW,MAAM;AACc,QAAAQ,KACCG;SAC7B,GAAG;AAAA,IACR,CACD,GACDI,EAAgB,MAAM;AAChB,MAACf,EAAM,eACA,SAAA,oBAAoB,WAAWS,CAAoB,GACnD,SAAA,oBAAoB,SAASG,CAAmB;AAAA,IAC3D,CACD,GAGM,CAACI,GAAUC,OACRC,EAAW,GAAGC,EAAaC,GAAU,MAAM;AAAA,MACjD,SAASC,EAAS,MAAM;AAAA,QACtBC,EAAoB,OAAO;AAAA,UACzB,OAAOC,EAAgB,CAACnB,EAAqB,OAAO,eAAe,CAAC;AAAA,QAAA,GACnE;AAAA,UACDkB,EAAoB,OAAO;AAAA,YACzB,SAAS;AAAA,YACT,KAAKpB;AAAA,YACL,OAAOqB,EAAgB,CAAChB,EAA4B,OAAO,iCAAiC,CAAC;AAAA,UAAA,GAC5F;AAAA,YACDiB,EAAYR,EAAK,QAAQ,SAAS;AAAA,aACjC,CAAC;AAAA,WACH,CAAC;AAAA,MAAA,CACL;AAAA,MACD,GAAG;AAAA,IAAA,CACJ;AAAA,EAEH;AAEA,CAAC;"}
+{"version":3,"file":"design-system99.mjs","sources":["../src/components/BOtpField/BOtpFieldBox.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { vModelText as _vModelText, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = [\"disabled\"]\n\nimport { onMounted, ref, type Ref, watch } from 'vue';\n\n//#region Props\nexport interface Props {\n  value?: string;\n  focus?: boolean;\n  isDisabled?: boolean;\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n  __name: 'BOtpFieldBox',\n  props: {\n    value: { default: '' },\n    focus: { type: Boolean, default: false },\n    isDisabled: { type: Boolean, default: false }\n  },\n  emits: [\"on-change\", \"on-keydown\", \"on-keyup\", \"on-paste\", \"on-focus\", \"on-blur\"],\n  setup(__props: any, { expose: __expose, emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst model = ref(props.value || '');\nconst inputRef = ref<HTMLInputElement | null>(null) as Ref<HTMLInputElement>;\nconst digits = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];\n//#endregion\n\n//#region Methods\nconst handleOnChange = () => {\n  if (!digits.includes(model.value)) {\n    model.value = '';\n    return;\n  }\n\n  model.value = model.value.toString();\n  if (model.value.length > 1) {\n    model.value = model.value.slice(0, 1);\n  }\n  return emit('on-change', model.value);\n};\n\nconst handleOnKeyDown = (event: KeyboardEvent) => {\n  if (props.isDisabled) {\n    event.preventDefault();\n  }\n  // Only allow characters 0-9, DEL, Backspace, Enter, Right and Left Arrows, and Pasting\n  const keyEvent = event;\n  if (\n    [\n      'Alt',\n      'Control',\n      'Meta',\n      'Backspace',\n      'ArrowLeft',\n      'ArrowRight',\n      'v',\n      ...digits,\n    ].includes(keyEvent.key)\n  ) {\n    emit('on-keydown', event);\n  } else {\n    keyEvent.preventDefault();\n  }\n};\nconst handleOnKeyUp = (event: KeyboardEvent) => {\n  emit('on-keyup', event);\n};\nconst handleOnPaste = (event: ClipboardEvent) => {\n  emit('on-paste', event);\n};\nconst handleOnFocus = () => {\n  inputRef.value.select();\n  return emit('on-focus');\n};\nconst handleOnBlur = () => emit('on-blur');\nconst focusFn = () => {\n  inputRef.value.focus();\n  inputRef.value.select();\n};\n//#endregion\n\n//#region Watchers\nwatch(\n  () => props.value,\n  (newValue, oldValue) => {\n    if (newValue !== oldValue) {\n      model.value = newValue;\n    }\n  },\n);\nwatch(\n  () => props.focus,\n  (newFocusValue, oldFocusValue) => {\n    // Check if focusedInput changed\n    // Prevent calling function if input already in focus\n    if (oldFocusValue !== newFocusValue && inputRef.value && props.focus) {\n      inputRef.value.focus();\n      inputRef.value.select();\n    }\n  },\n);\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  if (inputRef.value && props.focus) {\n    inputRef.value.focus();\n    inputRef.value.select();\n  }\n});\n//#endregion\n\n__expose({ focus: focusFn });\n\nreturn (_ctx: any,_cache: any) => {\n  return _withDirectives((_openBlock(), _createElementBlock(\"input\", {\n    ref_key: \"inputRef\",\n    ref: inputRef,\n    \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((model).value = $event)),\n    disabled: _ctx.isDisabled,\n    class: \"ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200\",\n    inputmode: \"numeric\",\n    maxlength: \"1\",\n    onBlur: handleOnBlur,\n    onFocus: handleOnFocus,\n    onInput: handleOnChange,\n    onKeydown: handleOnKeyDown,\n    onKeyup: handleOnKeyUp,\n    onPaste: handleOnPaste\n  }, null, 40, _hoisted_1)), [\n    [_vModelText, model.value]\n  ])\n}\n}\n\n})"],"names":["_hoisted_1","_sfc_main","_defineComponent","__props","__expose","__emit","props","emit","model","ref","inputRef","digits","handleOnChange","handleOnKeyDown","event","keyEvent","handleOnKeyUp","handleOnPaste","handleOnFocus","handleOnBlur","focusFn","watch","newValue","oldValue","newFocusValue","oldFocusValue","onMounted","_ctx","_cache","_withDirectives","_openBlock","_createElementBlock","$event","_vModelText"],"mappings":"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"}

package/dist/style.css

@@ -1 +1 @@
-@layer design-system{*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}:root{--ds-colors-primary-f: 6 182 212;--ds-colors-primary-t: 59 130 246;--ds-colors-focus: 86 221 214;--ds-colors-primary-f-stop: 0%;--ds-colors-primary-t-stop: 100%}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.ds-container{width:100%}@media (min-width: 640px){.ds-container{max-width:640px}}@media (min-width: 768px){.ds-container{max-width:768px}}@media (min-width: 1024px){.ds-container{max-width:1024px}}@media (min-width: 1280px){.ds-container{max-width:1280px}}@media (min-width: 1536px){.ds-container{max-width:1536px}}.ds-pointer-events-none{pointer-events:none}.ds-fixed{position:fixed}.ds-absolute{position:absolute}.ds-relative{position:relative}.ds-left-0{left:0}.ds-left-3{left:.75rem}.ds-right-0{right:0}.ds-right-1{right:.25rem}.ds-right-3{right:.75rem}.ds-right-4{right:1rem}.ds-top-0{top:0}.ds-top-1{top:.25rem}.ds-top-4{top:1rem}.ds-z-10{z-index:10}.ds-z-100{z-index:100}.ds-z-50{z-index:50}.ds-z-\[110\]{z-index:110}.ds-z-\[1\]{z-index:1}.ds-z-\[3\]{z-index:3}.ds-m-auto{margin:auto}.-ds-mx-0{margin-left:-0px;margin-right:-0px}.-ds-mx-0\.5{margin-left:-.125rem;margin-right:-.125rem}.ds-mx-auto{margin-left:auto;margin-right:auto}.ds-my-0{margin-top:0;margin-bottom:0}.ds-my-0\.5{margin-top:.125rem;margin-bottom:.125rem}.ds-my-2{margin-top:.5rem;margin-bottom:.5rem}.ds-my-4{margin-top:1rem;margin-bottom:1rem}.-ds-ml-\[25px\]{margin-left:-25px}.ds-mb-0{margin-bottom:0}.ds-mb-0\.5{margin-bottom:.125rem}.ds-mb-1{margin-bottom:.25rem}.ds-mb-2{margin-bottom:.5rem}.ds-mb-4{margin-bottom:1rem}.ds-ml-0{margin-left:0}.ds-ml-1{margin-left:.25rem}.ds-ml-2{margin-left:.5rem}.ds-ml-4{margin-left:1rem}.ds-mt-1{margin-top:.25rem}.ds-mt-4{margin-top:1rem}.ds-mt-8{margin-top:2rem}.ds-block{display:block}.ds-inline-block{display:inline-block}.ds-inline{display:inline}.ds-flex{display:flex}.ds-inline-flex{display:inline-flex}.ds-grid{display:grid}.ds-hidden{display:none}.ds-aspect-square{aspect-ratio:1 / 1}.\!ds-h-\[30px\]{height:30px!important}.ds-h-10{height:2.5rem}.ds-h-11{height:2.75rem}.ds-h-12{height:3rem}.ds-h-3{height:.75rem}.ds-h-3\.5{height:.875rem}.ds-h-4{height:1rem}.ds-h-4\.5{height:1.125rem}.ds-h-5{height:1.25rem}.ds-h-8{height:2rem}.ds-h-9{height:2.25rem}.ds-h-\[40px\]{height:40px}.ds-h-auto{height:auto}.ds-h-full{height:100%}.ds-h-screen{height:100vh}.ds-max-h-72{max-height:18rem}.ds-min-h-\[1rem\]{min-height:1rem}.ds-min-h-\[6rem\]{min-height:6rem}.ds-w-10{width:2.5rem}.ds-w-11{width:2.75rem}.ds-w-12{width:3rem}.ds-w-3{width:.75rem}.ds-w-3\.5{width:.875rem}.ds-w-4{width:1rem}.ds-w-4\.5{width:1.125rem}.ds-w-5{width:1.25rem}.ds-w-8{width:2rem}.ds-w-80{width:20rem}.ds-w-full{width:100%}.ds-w-screen{width:100vw}.ds-min-w-\[5rem\]{min-width:5rem}.ds-min-w-\[8rem\]{min-width:8rem}.ds-max-w-2xl{max-width:42rem}.ds-max-w-4xl{max-width:56rem}.ds-max-w-md{max-width:28rem}.ds-flex-1{flex:1 1 0%}.ds-flex-auto{flex:1 1 auto}.ds-flex-initial{flex:0 1 auto}.ds-rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ds-cursor-default{cursor:default}.ds-cursor-not-allowed{cursor:not-allowed}.ds-cursor-pointer{cursor:pointer}.ds-grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.ds-grid-rows-\[0fr\]{grid-template-rows:0fr}.ds-grid-rows-\[1fr\]{grid-template-rows:1fr}.ds-flex-wrap{flex-wrap:wrap}.ds-items-start{align-items:flex-start}.ds-items-center{align-items:center}.ds-justify-end{justify-content:flex-end}.ds-justify-center{justify-content:center}.ds-justify-between{justify-content:space-between}.ds-gap-1{gap:.25rem}.ds-gap-2{gap:.5rem}.ds-gap-3{gap:.75rem}.ds-gap-4{gap:1rem}.ds-gap-5{gap:1.25rem}.ds-gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.ds-gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.ds-gap-y-3{row-gap:.75rem}.ds-space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.ds-space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.ds-space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.ds-space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.ds-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.ds-overflow-hidden{overflow:hidden}.ds-overflow-y-auto{overflow-y:auto}.ds-overflow-x-hidden{overflow-x:hidden}.ds-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds-whitespace-nowrap{white-space:nowrap}.ds-rounded-full{border-radius:9999px}.ds-rounded-lg{border-radius:.5rem}.ds-rounded-none{border-radius:0}.ds-rounded-xl{border-radius:.75rem}.ds-rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.ds-rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.ds-border{border-width:1px}.ds-border-2{border-width:2px}.ds-border-l-2{border-left-width:2px}.ds-border-none{border-style:none}.\!ds-border-focus{--tw-border-opacity: 1 !important;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))!important}.ds-border-black\/10,.ds-border-black\/\[0\.1\]{border-color:#0000001a}.ds-border-error{--tw-border-opacity: 1;border-color:rgb(236 55 65 / var(--tw-border-opacity))}.ds-border-focus{--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))}.ds-border-gray-100{--tw-border-opacity: 1;border-color:rgb(243 244 246 / var(--tw-border-opacity))}.ds-border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.ds-border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.ds-border-primary-f\/50{border-color:rgb(var(--ds-colors-primary-f) / .5)}.ds-bg-\[\#00a86b\]{--tw-bg-opacity: 1;background-color:rgb(0 168 107 / var(--tw-bg-opacity))}.ds-bg-\[\#f2f2f2\]{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.ds-bg-black\/10{background-color:#0000001a}.ds-bg-black\/20{background-color:#0003}.ds-bg-black\/65{background-color:#000000a6}.ds-bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.ds-bg-gray-150{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.ds-bg-gray-200{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))}.ds-bg-primary-f{--tw-bg-opacity: 1;background-color:rgb(var(--ds-colors-primary-f) / var(--tw-bg-opacity))}.ds-bg-primary-f\/40{background-color:rgb(var(--ds-colors-primary-f) / .4)}.ds-bg-primary-t{--tw-bg-opacity: 1;background-color:rgb(var(--ds-colors-primary-t) / var(--tw-bg-opacity))}.ds-bg-primary-t\/10{background-color:rgb(var(--ds-colors-primary-t) / .1)}.ds-bg-red-600{--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity))}.ds-bg-slate-100{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.ds-bg-slate-50{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.ds-bg-transparent{background-color:transparent}.ds-bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/hd\/colorful-love-birds-0ctuhn6r2rubq7v3\.webp\'\)\]{background-image:url(https://wallpapers.com/images/hd/colorful-love-birds-0ctuhn6r2rubq7v3.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/hd\/elegant-feline-in-soft-natural-light-00nbm86akvtczty6\.webp\'\)\]{background-image:url(https://wallpapers.com/images/hd/elegant-feline-in-soft-natural-light-00nbm86akvtczty6.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/high\/dog-underwater-swimming-2siawk4nemp214kj\.webp\'\)\]{background-image:url(https://wallpapers.com/images/high/dog-underwater-swimming-2siawk4nemp214kj.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/high\/three-teen-lions-9xiimjysh7htjow3\.webp\'\)\]{background-image:url(https://wallpapers.com/images/high/three-teen-lions-9xiimjysh7htjow3.webp)}.ds-bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.ds-from-primary-f{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / 1) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.ds-from-primary-f-stop{--tw-gradient-from-position: var(--ds-colors-primary-f-stop)}.ds-to-primary-t{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / 1) var(--tw-gradient-to-position)}.ds-bg-contain{background-size:contain}.ds-bg-cover{background-size:cover}.ds-bg-center{background-position:center}.ds-bg-no-repeat{background-repeat:no-repeat}.ds-fill-black\/40{fill:#0006}.ds-fill-black\/60{fill:#0009}.ds-fill-black\/80{fill:#000c}.ds-fill-gray-500{fill:#6b7280}.ds-fill-primary-t{fill:rgb(var(--ds-colors-primary-t) / 1)}.ds-fill-white{fill:#fff}.ds-p-0{padding:0}.ds-p-0\.5{padding:.125rem}.ds-p-2{padding:.5rem}.ds-p-3{padding:.75rem}.ds-p-4{padding:1rem}.ds-p-5{padding:1.25rem}.ds-px-0{padding-left:0;padding-right:0}.ds-px-2{padding-left:.5rem;padding-right:.5rem}.ds-px-3{padding-left:.75rem;padding-right:.75rem}.ds-px-4{padding-left:1rem;padding-right:1rem}.ds-py-1{padding-top:.25rem;padding-bottom:.25rem}.ds-py-2{padding-top:.5rem;padding-bottom:.5rem}.ds-py-3{padding-top:.75rem;padding-bottom:.75rem}.ds-py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.ds-py-4{padding-top:1rem;padding-bottom:1rem}.ds-py-5{padding-top:1.25rem;padding-bottom:1.25rem}.ds-pb-2{padding-bottom:.5rem}.ds-pl-0{padding-left:0}.ds-pl-1{padding-left:.25rem}.ds-pl-2{padding-left:.5rem}.ds-pr-1{padding-right:.25rem}.ds-text-center{text-align:center}.ds-text-right{text-align:right}.ds-text-2xl{font-size:1.5rem;line-height:2rem}.ds-text-4xl{font-size:2.25rem;line-height:2.5rem}.ds-text-base{font-size:1rem;line-height:1.5rem}.ds-text-sm{font-size:.875rem;line-height:1.25rem}.ds-text-xs{font-size:.75rem;line-height:1rem}.ds-font-bold{font-weight:700}.ds-font-medium{font-weight:500}.ds-font-normal{font-weight:400}.ds-font-semibold{font-weight:600}.ds-capitalize{text-transform:capitalize}.ds-leading-4{line-height:1rem}.ds-text-black\/40{color:#0006}.ds-text-black\/80{color:#000c}.ds-text-black\/\[0\.4\]{color:#0006}.ds-text-black\/\[0\.85\]{color:#000000d9}.ds-text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.ds-text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.ds-text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity))}.ds-text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.ds-text-primary-t{--tw-text-opacity: 1;color:rgb(var(--ds-colors-primary-t) / var(--tw-text-opacity))}.ds-text-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity))}.ds-text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.ds-opacity-0{opacity:0}.ds-shadow{--tw-shadow: 0px 5px 10px rgba(0, 0, 0, .04), 0px 1px 2px rgba(0, 0, 0, .06);--tw-shadow-colored: 0px 5px 10px var(--tw-shadow-color), 0px 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ds-shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ds-shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.\!ds-ring-0{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)!important}.ds-ring-1{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ds-ring-error{--tw-ring-opacity: 1;--tw-ring-color: rgb(236 55 65 / var(--tw-ring-opacity))}.ds-ring-focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-focus) / var(--tw-ring-opacity))}.ds-drop-shadow{--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / .1)) drop-shadow(0 1px 1px rgb(0 0 0 / .06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-drop-shadow-light{--tw-drop-shadow: drop-shadow(0 1px 3px rgba(0, 0, 0, .11));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-drop-shadow-none{--tw-drop-shadow: drop-shadow(0 0 #0000);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.ds-transition-\[grid-template-rows\]{transition-property:grid-template-rows;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-duration-200{transition-duration:.2s}.ds-duration-300{transition-duration:.3s}.ds-ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}:focus-visible{outline-offset:unset;outline:unset}.ds-border-inner-secondary{box-shadow:inset 0 0 0 1px rgb(var(--ds-colors-primary-t) / 1)}.ds-border-inner-secondary--disabled{box-shadow:inset 0 0 0 1px #0006}.ds-border-inner-additional,.ds-border-inner-additional--disabled{box-shadow:inset 0 0 0 1px #00000040}.fade-enter-from,.fade-leave-to{opacity:0}.fade-enter-active,.fade-leave-active{transition:opacity .3s cubic-bezier(.4,0,.2,1)}}.after\:ds-mx-3:after{content:var(--tw-content);margin-left:.75rem;margin-right:.75rem}.after\:ds-h-1:after{content:var(--tw-content);height:.25rem}.after\:ds-w-full:after{content:var(--tw-content);width:100%}.after\:ds-border-b:after{content:var(--tw-content);border-bottom-width:1px}.after\:ds-border-gray-200:after{content:var(--tw-content);--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.hover\:ds-bg-blue-light:hover{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.hover\:ds-bg-gray-150:hover{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.hover\:ds-bg-primary-f\/70:hover{background-color:rgb(var(--ds-colors-primary-f) / .7)}.hover\:ds-bg-primary-t\/10:hover{background-color:rgb(var(--ds-colors-primary-t) / .1)}.hover\:ds-bg-slate-100:hover{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.hover\:ds-bg-slate-50:hover{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.hover\:ds-fill-black\/40:hover{fill:#0006}.hover\:ds-fill-primary-t\/80:hover{fill:rgb(var(--ds-colors-primary-t) / .8)}.hover\:ds-fill-white\/60:hover{fill:#fff9}.hover\:ds-text-primary-t:hover{--tw-text-opacity: 1;color:rgb(var(--ds-colors-primary-t) / var(--tw-text-opacity))}.hover\:ds-ring-2:hover{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.hover\:ds-ring-primary-t:hover{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-primary-t) / var(--tw-ring-opacity))}.focus\:ds-border-focus:focus{--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))}.focus\:ds-ring-1:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ds-ring-error:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(236 55 65 / var(--tw-ring-opacity))}.focus\:ds-ring-focus:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-focus) / var(--tw-ring-opacity))}.focus\:ds-ring-primary-t:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-primary-t) / var(--tw-ring-opacity))}.focus-visible\:ds-bg-blue-light:focus-visible{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.focus-visible\:ds-bg-gray-150:focus-visible{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.focus-visible\:ds-from-primary-f\/90:focus-visible{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / .9) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.focus-visible\:ds-to-primary-t\/90:focus-visible{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / .9) var(--tw-gradient-to-position)}.focus-visible\:ds-fill-primary-t\/80:focus-visible{fill:rgb(var(--ds-colors-primary-t) / .8)}.enabled\:ds-text-gray-400:enabled{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.enabled\:hover\:ds-bg-blue-light:hover:enabled{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.enabled\:hover\:ds-bg-gray-150:hover:enabled{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.enabled\:hover\:ds-from-primary-f\/90:hover:enabled{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / .9) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.enabled\:hover\:ds-to-primary-t\/90:hover:enabled{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / .9) var(--tw-gradient-to-position)}.\*\:enabled\:hover\:ds-bg-gray-150:hover:enabled>*{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.disabled\:ds-cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:ds-bg-gray-150:disabled{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.disabled\:ds-fill-black\/40:disabled{fill:#0006}.disabled\:ds-text-black\/40:disabled{color:#0006}.disabled\:ds-text-black\/\[0\.4\]:disabled{color:#0006}.disabled\:ds-text-gray-200:disabled{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity))}@media (min-width: 640px){.sm\:ds-absolute{position:absolute}.sm\:ds-left-\[unset\]{left:unset}.sm\:ds-top-\[unset\]{top:unset}.sm\:ds-z-50{z-index:50}.sm\:ds-block{display:block}.sm\:ds-h-auto{height:auto}.sm\:ds-w-auto{width:auto}.sm\:ds-bg-transparent{background-color:transparent}.sm\:ds-backdrop-blur-none{--tw-backdrop-blur: blur(0);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}}@media (min-width: 1024px){.lg\:ds-h-10{height:2.5rem}.lg\:ds-w-10{width:2.5rem}.lg\:ds-py-3{padding-top:.75rem;padding-bottom:.75rem}}.tab[data-v-797a82dc]{display:none}.tab.active[data-v-797a82dc]{display:block}.b-checkbox .b-checkbox__input[data-v-2082b68c]{display:none;width:1.5rem;height:1.5rem;min-width:1.5rem;min-height:1.5rem}.b-checkbox .b-checkbox__input:checked+.b-checkbox__input-label[data-v-2082b68c]{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-checkbox .b-checkbox__input:checked+.b-checkbox__input-label[data-v-2082b68c]:after{border-color:#fff}.b-checkbox .b-checkbox__input:disabled+.b-checkbox__input-label[data-v-2082b68c]{background-color:#f3f4f6}.b-checkbox .b-checkbox__input:disabled+.b-checkbox__input-label[data-v-2082b68c]:after{border-color:#f3f4f6}.b-checkbox .b-checkbox__input-label[data-v-2082b68c]{position:relative;background-color:#fff;border-radius:.5rem;cursor:pointer;width:1.5rem;height:1.5rem;transition:all .15s linear}.b-checkbox .b-checkbox__input-label[data-v-2082b68c]:after{border:3px solid transparent;border-top:none;border-right:none;content:"";height:7px;left:5.5px;position:absolute;top:7px;transform:rotate(-45deg);width:.75rem;transition:all .15s linear}.b-checkbox.size-sm .b-checkbox__input[data-v-2082b68c]{width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem}.b-checkbox.size-sm .b-checkbox__input-label[data-v-2082b68c]{width:1.25rem;height:1.25rem}.b-checkbox.size-sm .b-checkbox__input-label[data-v-2082b68c]:after{border:2.5px solid transparent;border-top:none;border-right:none;left:3.5px;top:4.5px}.b-loading-bar[data-v-31348ccc]{height:.25rem;display:block;width:100%;background-color:#e6effe;overflow:hidden}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]{background-color:#3b82f6}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]:before{content:"";position:absolute;z-index:100;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;animation:indeterminate-31348ccc 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]:after{content:"";position:absolute;z-index:100;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;animation:indeterminate-short-31348ccc 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate-31348ccc{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short-31348ccc{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}.spinner[data-v-c49c635e]{border:.25rem solid #e5e7eb;border-radius:50%;border-top:.25rem solid rgb(var(--ds-colors-primary-t) / 1);border-right:.25rem solid rgb(var(--ds-colors-primary-t) / 1);border-bottom:.25rem solid rgb(var(--ds-colors-primary-t) / 1);animation:spin-c49c635e 2s linear infinite}@keyframes spin-c49c635e{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.carousel-item[data-v-6f2b0dc4]{position:absolute;height:100%;width:100%;display:none;transform:translate(100%)}.carousel-item.reverse[data-v-6f2b0dc4]{transform:translate(-100%)}.carousel-item.active[data-v-6f2b0dc4]{display:block}.slide-in[data-v-6f2b0dc4]{animation:slide-in-6f2b0dc4 .5s forwards}.slide-out[data-v-6f2b0dc4]{animation:slide-out-6f2b0dc4 .5s forwards}@keyframes slide-in-6f2b0dc4{to{transform:translate(0)}}@keyframes slide-out-6f2b0dc4{0%{transform:translate(0)}to{transform:translate(-100%)}}.slide-in-reverse[data-v-6f2b0dc4]{animation:slide-in-reverse-6f2b0dc4 .5s forwards}.slide-out-reverse[data-v-6f2b0dc4]{animation:slide-out-reverse-6f2b0dc4 .5s forwards}@keyframes slide-in-reverse-6f2b0dc4{to{transform:translate(0)}}@keyframes slide-out-reverse-6f2b0dc4{0%{transform:translate(0)}to{transform:translate(100%)}}.carousel-item img{min-width:100%;height:100%}.carousel-content[data-v-b5c5062f]{position:absolute;top:0;left:0;width:100%;max-height:100%;height:100%}.carousel-navigation--left[data-v-b5c5062f],.carousel-navigation--right[data-v-b5c5062f]{padding:0 1rem;height:100%;position:absolute;display:flex;justify-content:center;align-items:center}.carousel-navigation--right[data-v-b5c5062f]{right:0}.carousel-pagination[data-v-b5c5062f]{position:absolute;bottom:.5rem;width:100%;display:flex;gap:1rem;justify-content:center;align-items:center}.carousel-pagination span[data-v-b5c5062f]{cursor:pointer;width:1.25rem;height:1.25rem;border-radius:50%;background-color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;opacity:.8}.b-radio__input[data-v-98637356]{display:none}.b-radio__input:checked+.b-radio__input-label[data-v-98637356]:before{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-radio__input:disabled+.b-radio__input-label[data-v-98637356]{background-color:#f3f4f6}.b-radio__input:disabled+.b-radio__input-label[data-v-98637356]:before{background-color:#f3f4f6}.b-radio__input-label[data-v-98637356]{position:relative;width:1.5rem;height:1.5rem;background-color:#fff;border-radius:9999px}.b-radio__input-label[data-v-98637356]:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-color:transparent;height:1rem;width:1rem;border-radius:9999px;transition:all .15s linear}.tab-header.active[data-v-646ae8c4]{background-color:#fff;color:rgb(var(--ds-colors-primary-t) / 1)}.b-text-field:has(.b-text-field__prepend-icon) input[data-v-d47b93d4]{padding-left:2.25rem}.b-text-field:has(.b-text-field__append-icon) input[data-v-d47b93d4]{padding-right:2.25rem}.tooltip-arrow[data-v-78f7c276]{position:absolute;left:0;transform:translate3d(59.5px,0,0)}.b-image-picker[data-v-8033e228]{container-name:image-picker;container-type:inline-size}.b-image-picker__draggable[data-v-8033e228]{width:100%;position:relative}.b-image-picker__draggable[data-v-8033e228]:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:.5rem}@container image-picker (min-width: 640px){.b-image-picker__draggable[data-v-8033e228]{width:calc(33.3333333333% - .3333333333rem)}}@container image-pbnicker (min-width: 768px){.b-image-picker__draggable[data-v-8033e228]{width:calc(25% - .375rem)}}@container image-picker (min-width: 1280px){.b-image-picker__draggable[data-v-8033e228]{width:calc(20% - .4rem)}}.dragging[data-v-8033e228]{opacity:.5}.dropped-target[data-v-8033e228]{border-width:2px;--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-primary-f) / var(--tw-border-opacity))}.b-currency-field:has(.b-currency-field__prepend-icon) input[data-v-5cbc4bba]{padding-left:2.25rem}.b-currency-field:has(.b-currency-field__append-icon) input[data-v-5cbc4bba]{padding-right:2.25rem}.b-switch__input[data-v-94d47575]{display:none}.b-switch__input:checked+.b-switch__input-label[data-v-94d47575]{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-switch__input:checked+.b-switch__input-label[data-v-94d47575]:before{transform:translate(100%);background-color:#fff}.b-switch__input:disabled+.b-switch__input-label[data-v-94d47575]:before{background-color:#f3f4f6}.b-switch__input-label[data-v-94d47575]{position:relative;display:flex;background-color:#e5e7eb;border-radius:1rem;padding:.125rem;width:2.75rem;height:1.5rem}.b-switch__input-label[data-v-94d47575]:before{content:"";position:absolute;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:9999px;left:calc(.125rem - 1px);top:calc(.125rem - 1px);transition:all .15s linear}.date-range:not(:has(.--start):has(.--end)) .date-item.--selected~.date-item:has(~.date-item:hover) .date-item__inner[data-v-9a965dba]{background-color:rgb(var(--ds-colors-primary-t) / 10%)}.date-range:not(:has(.--start):has(.--end)) .date-item:hover~.date-item:has(~.date-item.--selected) .date-item__inner[data-v-9a965dba]{background-color:rgb(var(--ds-colors-primary-t) / 10%)}
+@layer design-system{*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}:root{--ds-colors-primary-f: 6 182 212;--ds-colors-primary-t: 59 130 246;--ds-colors-focus: 86 221 214;--ds-colors-primary-f-stop: 0%;--ds-colors-primary-t-stop: 100%}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.ds-container{width:100%}@media (min-width: 640px){.ds-container{max-width:640px}}@media (min-width: 768px){.ds-container{max-width:768px}}@media (min-width: 1024px){.ds-container{max-width:1024px}}@media (min-width: 1280px){.ds-container{max-width:1280px}}@media (min-width: 1536px){.ds-container{max-width:1536px}}.ds-pointer-events-none{pointer-events:none}.ds-fixed{position:fixed}.ds-absolute{position:absolute}.ds-relative{position:relative}.ds-left-0{left:0}.ds-left-3{left:.75rem}.ds-right-0{right:0}.ds-right-1{right:.25rem}.ds-right-3{right:.75rem}.ds-right-4{right:1rem}.ds-top-0{top:0}.ds-top-1{top:.25rem}.ds-top-4{top:1rem}.ds-z-10{z-index:10}.ds-z-100{z-index:100}.ds-z-50{z-index:50}.ds-z-\[110\]{z-index:110}.ds-z-\[1\]{z-index:1}.ds-z-\[3\]{z-index:3}.ds-m-auto{margin:auto}.-ds-mx-0{margin-left:-0px;margin-right:-0px}.-ds-mx-0\.5{margin-left:-.125rem;margin-right:-.125rem}.ds-mx-auto{margin-left:auto;margin-right:auto}.ds-my-0{margin-top:0;margin-bottom:0}.ds-my-0\.5{margin-top:.125rem;margin-bottom:.125rem}.ds-my-2{margin-top:.5rem;margin-bottom:.5rem}.ds-my-4{margin-top:1rem;margin-bottom:1rem}.-ds-ml-\[25px\]{margin-left:-25px}.ds-mb-0{margin-bottom:0}.ds-mb-0\.5{margin-bottom:.125rem}.ds-mb-1{margin-bottom:.25rem}.ds-mb-2{margin-bottom:.5rem}.ds-mb-4{margin-bottom:1rem}.ds-ml-0{margin-left:0}.ds-ml-1{margin-left:.25rem}.ds-ml-2{margin-left:.5rem}.ds-ml-4{margin-left:1rem}.ds-mt-1{margin-top:.25rem}.ds-mt-4{margin-top:1rem}.ds-mt-8{margin-top:2rem}.ds-block{display:block}.ds-inline-block{display:inline-block}.ds-inline{display:inline}.ds-flex{display:flex}.ds-inline-flex{display:inline-flex}.ds-grid{display:grid}.ds-hidden{display:none}.ds-aspect-square{aspect-ratio:1 / 1}.\!ds-h-\[30px\]{height:30px!important}.ds-h-10{height:2.5rem}.ds-h-11{height:2.75rem}.ds-h-12{height:3rem}.ds-h-3{height:.75rem}.ds-h-3\.5{height:.875rem}.ds-h-4{height:1rem}.ds-h-4\.5{height:1.125rem}.ds-h-5{height:1.25rem}.ds-h-8{height:2rem}.ds-h-9{height:2.25rem}.ds-h-\[40px\]{height:40px}.ds-h-auto{height:auto}.ds-h-full{height:100%}.ds-h-screen{height:100vh}.ds-max-h-72{max-height:18rem}.ds-min-h-\[1rem\]{min-height:1rem}.ds-min-h-\[6rem\]{min-height:6rem}.ds-w-10{width:2.5rem}.ds-w-11{width:2.75rem}.ds-w-12{width:3rem}.ds-w-3{width:.75rem}.ds-w-3\.5{width:.875rem}.ds-w-4{width:1rem}.ds-w-4\.5{width:1.125rem}.ds-w-5{width:1.25rem}.ds-w-8{width:2rem}.ds-w-80{width:20rem}.ds-w-full{width:100%}.ds-w-screen{width:100vw}.ds-min-w-\[5rem\]{min-width:5rem}.ds-min-w-\[8rem\]{min-width:8rem}.ds-max-w-2xl{max-width:42rem}.ds-max-w-4xl{max-width:56rem}.ds-max-w-md{max-width:28rem}.ds-flex-1{flex:1 1 0%}.ds-flex-auto{flex:1 1 auto}.ds-flex-initial{flex:0 1 auto}.ds-rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ds-cursor-default{cursor:default}.ds-cursor-not-allowed{cursor:not-allowed}.ds-cursor-pointer{cursor:pointer}.ds-grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.ds-grid-rows-\[0fr\]{grid-template-rows:0fr}.ds-grid-rows-\[1fr\]{grid-template-rows:1fr}.ds-flex-wrap{flex-wrap:wrap}.ds-items-start{align-items:flex-start}.ds-items-center{align-items:center}.ds-justify-end{justify-content:flex-end}.ds-justify-center{justify-content:center}.ds-justify-between{justify-content:space-between}.ds-gap-1{gap:.25rem}.ds-gap-2{gap:.5rem}.ds-gap-3{gap:.75rem}.ds-gap-4{gap:1rem}.ds-gap-5{gap:1.25rem}.ds-gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.ds-gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.ds-gap-y-3{row-gap:.75rem}.ds-space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.ds-space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.ds-space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.ds-space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.ds-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.ds-overflow-hidden{overflow:hidden}.ds-overflow-y-auto{overflow-y:auto}.ds-overflow-x-hidden{overflow-x:hidden}.ds-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds-whitespace-nowrap{white-space:nowrap}.ds-rounded-full{border-radius:9999px}.ds-rounded-lg{border-radius:.5rem}.ds-rounded-none{border-radius:0}.ds-rounded-xl{border-radius:.75rem}.ds-rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.ds-rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.ds-border{border-width:1px}.ds-border-2{border-width:2px}.ds-border-l-2{border-left-width:2px}.ds-border-none{border-style:none}.\!ds-border-focus{--tw-border-opacity: 1 !important;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))!important}.ds-border-black\/10,.ds-border-black\/\[0\.1\]{border-color:#0000001a}.ds-border-error{--tw-border-opacity: 1;border-color:rgb(236 55 65 / var(--tw-border-opacity))}.ds-border-focus{--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))}.ds-border-gray-100{--tw-border-opacity: 1;border-color:rgb(243 244 246 / var(--tw-border-opacity))}.ds-border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.ds-border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.ds-border-primary-f\/50{border-color:rgb(var(--ds-colors-primary-f) / .5)}.ds-bg-\[\#00a86b\]{--tw-bg-opacity: 1;background-color:rgb(0 168 107 / var(--tw-bg-opacity))}.ds-bg-\[\#f2f2f2\]{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.ds-bg-black\/10{background-color:#0000001a}.ds-bg-black\/20{background-color:#0003}.ds-bg-black\/65{background-color:#000000a6}.ds-bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.ds-bg-gray-150{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.ds-bg-gray-200{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))}.ds-bg-primary-f{--tw-bg-opacity: 1;background-color:rgb(var(--ds-colors-primary-f) / var(--tw-bg-opacity))}.ds-bg-primary-f\/40{background-color:rgb(var(--ds-colors-primary-f) / .4)}.ds-bg-primary-t{--tw-bg-opacity: 1;background-color:rgb(var(--ds-colors-primary-t) / var(--tw-bg-opacity))}.ds-bg-primary-t\/10{background-color:rgb(var(--ds-colors-primary-t) / .1)}.ds-bg-red-600{--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity))}.ds-bg-slate-100{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.ds-bg-slate-50{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.ds-bg-transparent{background-color:transparent}.ds-bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/hd\/colorful-love-birds-0ctuhn6r2rubq7v3\.webp\'\)\]{background-image:url(https://wallpapers.com/images/hd/colorful-love-birds-0ctuhn6r2rubq7v3.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/hd\/elegant-feline-in-soft-natural-light-00nbm86akvtczty6\.webp\'\)\]{background-image:url(https://wallpapers.com/images/hd/elegant-feline-in-soft-natural-light-00nbm86akvtczty6.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/high\/dog-underwater-swimming-2siawk4nemp214kj\.webp\'\)\]{background-image:url(https://wallpapers.com/images/high/dog-underwater-swimming-2siawk4nemp214kj.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/high\/three-teen-lions-9xiimjysh7htjow3\.webp\'\)\]{background-image:url(https://wallpapers.com/images/high/three-teen-lions-9xiimjysh7htjow3.webp)}.ds-bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.ds-from-primary-f{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / 1) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.ds-from-primary-f-stop{--tw-gradient-from-position: var(--ds-colors-primary-f-stop)}.ds-to-primary-t{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / 1) var(--tw-gradient-to-position)}.ds-bg-contain{background-size:contain}.ds-bg-cover{background-size:cover}.ds-bg-center{background-position:center}.ds-bg-no-repeat{background-repeat:no-repeat}.ds-fill-black\/40{fill:#0006}.ds-fill-black\/60{fill:#0009}.ds-fill-black\/80{fill:#000c}.ds-fill-gray-500{fill:#6b7280}.ds-fill-primary-t{fill:rgb(var(--ds-colors-primary-t) / 1)}.ds-fill-white{fill:#fff}.ds-p-0{padding:0}.ds-p-0\.5{padding:.125rem}.ds-p-2{padding:.5rem}.ds-p-3{padding:.75rem}.ds-p-4{padding:1rem}.ds-p-5{padding:1.25rem}.ds-px-0{padding-left:0;padding-right:0}.ds-px-2{padding-left:.5rem;padding-right:.5rem}.ds-px-3{padding-left:.75rem;padding-right:.75rem}.ds-px-4{padding-left:1rem;padding-right:1rem}.ds-py-1{padding-top:.25rem;padding-bottom:.25rem}.ds-py-2{padding-top:.5rem;padding-bottom:.5rem}.ds-py-3{padding-top:.75rem;padding-bottom:.75rem}.ds-py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.ds-py-4{padding-top:1rem;padding-bottom:1rem}.ds-py-5{padding-top:1.25rem;padding-bottom:1.25rem}.ds-pb-2{padding-bottom:.5rem}.ds-pl-0{padding-left:0}.ds-pl-1{padding-left:.25rem}.ds-pl-2{padding-left:.5rem}.ds-pr-1{padding-right:.25rem}.ds-text-center{text-align:center}.ds-text-right{text-align:right}.ds-text-2xl{font-size:1.5rem;line-height:2rem}.ds-text-4xl{font-size:2.25rem;line-height:2.5rem}.ds-text-base{font-size:1rem;line-height:1.5rem}.ds-text-sm{font-size:.875rem;line-height:1.25rem}.ds-text-xs{font-size:.75rem;line-height:1rem}.ds-font-bold{font-weight:700}.ds-font-medium{font-weight:500}.ds-font-normal{font-weight:400}.ds-font-semibold{font-weight:600}.ds-capitalize{text-transform:capitalize}.ds-leading-4{line-height:1rem}.ds-text-black\/40{color:#0006}.ds-text-black\/80{color:#000c}.ds-text-black\/\[0\.4\]{color:#0006}.ds-text-black\/\[0\.85\]{color:#000000d9}.ds-text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.ds-text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.ds-text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity))}.ds-text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.ds-text-primary-t{--tw-text-opacity: 1;color:rgb(var(--ds-colors-primary-t) / var(--tw-text-opacity))}.ds-text-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity))}.ds-text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.ds-opacity-0{opacity:0}.ds-shadow{--tw-shadow: 0px 5px 10px rgba(0, 0, 0, .04), 0px 1px 2px rgba(0, 0, 0, .06);--tw-shadow-colored: 0px 5px 10px var(--tw-shadow-color), 0px 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ds-shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ds-shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.\!ds-ring-0{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)!important}.ds-ring-1{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ds-ring-error{--tw-ring-opacity: 1;--tw-ring-color: rgb(236 55 65 / var(--tw-ring-opacity))}.ds-ring-focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-focus) / var(--tw-ring-opacity))}.ds-drop-shadow{--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / .1)) drop-shadow(0 1px 1px rgb(0 0 0 / .06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-drop-shadow-light{--tw-drop-shadow: drop-shadow(0 1px 3px rgba(0, 0, 0, .11));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-drop-shadow-none{--tw-drop-shadow: drop-shadow(0 0 #0000);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.ds-transition-\[grid-template-rows\]{transition-property:grid-template-rows;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-duration-200{transition-duration:.2s}.ds-duration-300{transition-duration:.3s}.ds-ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}:focus-visible{outline-offset:unset;outline:unset}.ds-border-inner-secondary{box-shadow:inset 0 0 0 1px rgb(var(--ds-colors-primary-t) / 1)}.ds-border-inner-secondary--disabled{box-shadow:inset 0 0 0 1px #0006}.ds-border-inner-additional,.ds-border-inner-additional--disabled{box-shadow:inset 0 0 0 1px #00000040}.fade-enter-from,.fade-leave-to{opacity:0}.fade-enter-active,.fade-leave-active{transition:opacity .3s cubic-bezier(.4,0,.2,1)}}.after\:ds-mx-3:after{content:var(--tw-content);margin-left:.75rem;margin-right:.75rem}.after\:ds-h-1:after{content:var(--tw-content);height:.25rem}.after\:ds-w-full:after{content:var(--tw-content);width:100%}.after\:ds-border-b:after{content:var(--tw-content);border-bottom-width:1px}.after\:ds-border-gray-200:after{content:var(--tw-content);--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.hover\:ds-bg-blue-light:hover{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.hover\:ds-bg-gray-150:hover{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.hover\:ds-bg-primary-f\/70:hover{background-color:rgb(var(--ds-colors-primary-f) / .7)}.hover\:ds-bg-slate-100:hover{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.hover\:ds-bg-slate-50:hover{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.hover\:ds-fill-black\/40:hover{fill:#0006}.hover\:ds-fill-primary-t\/80:hover{fill:rgb(var(--ds-colors-primary-t) / .8)}.hover\:ds-fill-white\/60:hover{fill:#fff9}.hover\:ds-text-primary-t:hover{--tw-text-opacity: 1;color:rgb(var(--ds-colors-primary-t) / var(--tw-text-opacity))}.hover\:ds-ring-2:hover{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.hover\:ds-ring-primary-t:hover{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-primary-t) / var(--tw-ring-opacity))}.focus\:ds-border-focus:focus{--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))}.focus\:ds-ring-1:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ds-ring-error:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(236 55 65 / var(--tw-ring-opacity))}.focus\:ds-ring-focus:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-focus) / var(--tw-ring-opacity))}.focus\:ds-ring-primary-t:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-primary-t) / var(--tw-ring-opacity))}.focus-visible\:ds-bg-blue-light:focus-visible{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.focus-visible\:ds-bg-gray-150:focus-visible{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.focus-visible\:ds-from-primary-f\/90:focus-visible{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / .9) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.focus-visible\:ds-to-primary-t\/90:focus-visible{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / .9) var(--tw-gradient-to-position)}.focus-visible\:ds-fill-primary-t\/80:focus-visible{fill:rgb(var(--ds-colors-primary-t) / .8)}.enabled\:ds-text-gray-400:enabled{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.enabled\:hover\:ds-bg-blue-light:hover:enabled{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.enabled\:hover\:ds-bg-gray-150:hover:enabled{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.enabled\:hover\:ds-from-primary-f\/90:hover:enabled{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / .9) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.enabled\:hover\:ds-to-primary-t\/90:hover:enabled{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / .9) var(--tw-gradient-to-position)}.\*\:enabled\:hover\:ds-bg-gray-150:hover:enabled>*{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.disabled\:ds-cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:ds-bg-gray-150:disabled{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.disabled\:ds-fill-black\/40:disabled{fill:#0006}.disabled\:ds-text-black\/40:disabled{color:#0006}.disabled\:ds-text-black\/\[0\.4\]:disabled{color:#0006}.disabled\:ds-text-gray-200:disabled{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity))}@media (min-width: 640px){.sm\:ds-absolute{position:absolute}.sm\:ds-left-\[unset\]{left:unset}.sm\:ds-top-\[unset\]{top:unset}.sm\:ds-z-50{z-index:50}.sm\:ds-block{display:block}.sm\:ds-h-auto{height:auto}.sm\:ds-w-auto{width:auto}.sm\:ds-bg-transparent{background-color:transparent}.sm\:ds-backdrop-blur-none{--tw-backdrop-blur: blur(0);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}}@media (min-width: 1024px){.lg\:ds-h-10{height:2.5rem}.lg\:ds-w-10{width:2.5rem}.lg\:ds-py-3{padding-top:.75rem;padding-bottom:.75rem}}.tab[data-v-797a82dc]{display:none}.tab.active[data-v-797a82dc]{display:block}.b-loading-bar[data-v-31348ccc]{height:.25rem;display:block;width:100%;background-color:#e6effe;overflow:hidden}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]{background-color:#3b82f6}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]:before{content:"";position:absolute;z-index:100;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;animation:indeterminate-31348ccc 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]:after{content:"";position:absolute;z-index:100;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;animation:indeterminate-short-31348ccc 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate-31348ccc{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short-31348ccc{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}.carousel-item[data-v-6f2b0dc4]{position:absolute;height:100%;width:100%;display:none;transform:translate(100%)}.carousel-item.reverse[data-v-6f2b0dc4]{transform:translate(-100%)}.carousel-item.active[data-v-6f2b0dc4]{display:block}.slide-in[data-v-6f2b0dc4]{animation:slide-in-6f2b0dc4 .5s forwards}.slide-out[data-v-6f2b0dc4]{animation:slide-out-6f2b0dc4 .5s forwards}@keyframes slide-in-6f2b0dc4{to{transform:translate(0)}}@keyframes slide-out-6f2b0dc4{0%{transform:translate(0)}to{transform:translate(-100%)}}.slide-in-reverse[data-v-6f2b0dc4]{animation:slide-in-reverse-6f2b0dc4 .5s forwards}.slide-out-reverse[data-v-6f2b0dc4]{animation:slide-out-reverse-6f2b0dc4 .5s forwards}@keyframes slide-in-reverse-6f2b0dc4{to{transform:translate(0)}}@keyframes slide-out-reverse-6f2b0dc4{0%{transform:translate(0)}to{transform:translate(100%)}}.carousel-item img{min-width:100%;height:100%}.spinner[data-v-c49c635e]{border:.25rem solid #e5e7eb;border-radius:50%;border-top:.25rem solid rgb(var(--ds-colors-primary-t) / 1);border-right:.25rem solid rgb(var(--ds-colors-primary-t) / 1);border-bottom:.25rem solid rgb(var(--ds-colors-primary-t) / 1);animation:spin-c49c635e 2s linear infinite}@keyframes spin-c49c635e{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.carousel-content[data-v-b5c5062f]{position:absolute;top:0;left:0;width:100%;max-height:100%;height:100%}.carousel-navigation--left[data-v-b5c5062f],.carousel-navigation--right[data-v-b5c5062f]{padding:0 1rem;height:100%;position:absolute;display:flex;justify-content:center;align-items:center}.carousel-navigation--right[data-v-b5c5062f]{right:0}.carousel-pagination[data-v-b5c5062f]{position:absolute;bottom:.5rem;width:100%;display:flex;gap:1rem;justify-content:center;align-items:center}.carousel-pagination span[data-v-b5c5062f]{cursor:pointer;width:1.25rem;height:1.25rem;border-radius:50%;background-color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;opacity:.8}.b-checkbox .b-checkbox__input[data-v-2082b68c]{display:none;width:1.5rem;height:1.5rem;min-width:1.5rem;min-height:1.5rem}.b-checkbox .b-checkbox__input:checked+.b-checkbox__input-label[data-v-2082b68c]{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-checkbox .b-checkbox__input:checked+.b-checkbox__input-label[data-v-2082b68c]:after{border-color:#fff}.b-checkbox .b-checkbox__input:disabled+.b-checkbox__input-label[data-v-2082b68c]{background-color:#f3f4f6}.b-checkbox .b-checkbox__input:disabled+.b-checkbox__input-label[data-v-2082b68c]:after{border-color:#f3f4f6}.b-checkbox .b-checkbox__input-label[data-v-2082b68c]{position:relative;background-color:#fff;border-radius:.5rem;cursor:pointer;width:1.5rem;height:1.5rem;transition:all .15s linear}.b-checkbox .b-checkbox__input-label[data-v-2082b68c]:after{border:3px solid transparent;border-top:none;border-right:none;content:"";height:7px;left:5.5px;position:absolute;top:7px;transform:rotate(-45deg);width:.75rem;transition:all .15s linear}.b-checkbox.size-sm .b-checkbox__input[data-v-2082b68c]{width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem}.b-checkbox.size-sm .b-checkbox__input-label[data-v-2082b68c]{width:1.25rem;height:1.25rem}.b-checkbox.size-sm .b-checkbox__input-label[data-v-2082b68c]:after{border:2.5px solid transparent;border-top:none;border-right:none;left:3.5px;top:4.5px}.b-radio__input[data-v-98637356]{display:none}.b-radio__input:checked+.b-radio__input-label[data-v-98637356]:before{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-radio__input:disabled+.b-radio__input-label[data-v-98637356]{background-color:#f3f4f6}.b-radio__input:disabled+.b-radio__input-label[data-v-98637356]:before{background-color:#f3f4f6}.b-radio__input-label[data-v-98637356]{position:relative;width:1.5rem;height:1.5rem;background-color:#fff;border-radius:9999px}.b-radio__input-label[data-v-98637356]:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-color:transparent;height:1rem;width:1rem;border-radius:9999px;transition:all .15s linear}.tab-header.active[data-v-646ae8c4]{background-color:#fff;color:rgb(var(--ds-colors-primary-t) / 1)}.b-text-field:has(.b-text-field__prepend-icon) input[data-v-d47b93d4]{padding-left:2.25rem}.b-text-field:has(.b-text-field__append-icon) input[data-v-d47b93d4]{padding-right:2.25rem}.tooltip-arrow[data-v-78f7c276]{position:absolute;left:0;transform:translate3d(59.5px,0,0)}.b-image-picker[data-v-8033e228]{container-name:image-picker;container-type:inline-size}.b-image-picker__draggable[data-v-8033e228]{width:100%;position:relative}.b-image-picker__draggable[data-v-8033e228]:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:.5rem}@container image-picker (min-width: 640px){.b-image-picker__draggable[data-v-8033e228]{width:calc(33.3333333333% - .3333333333rem)}}@container image-pbnicker (min-width: 768px){.b-image-picker__draggable[data-v-8033e228]{width:calc(25% - .375rem)}}@container image-picker (min-width: 1280px){.b-image-picker__draggable[data-v-8033e228]{width:calc(20% - .4rem)}}.dragging[data-v-8033e228]{opacity:.5}.dropped-target[data-v-8033e228]{border-width:2px;--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-primary-f) / var(--tw-border-opacity))}.b-currency-field:has(.b-currency-field__prepend-icon) input[data-v-5cbc4bba]{padding-left:2.25rem}.b-currency-field:has(.b-currency-field__append-icon) input[data-v-5cbc4bba]{padding-right:2.25rem}.b-switch__input[data-v-94d47575]{display:none}.b-switch__input:checked+.b-switch__input-label[data-v-94d47575]{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-switch__input:checked+.b-switch__input-label[data-v-94d47575]:before{transform:translate(100%);background-color:#fff}.b-switch__input:disabled+.b-switch__input-label[data-v-94d47575]:before{background-color:#f3f4f6}.b-switch__input-label[data-v-94d47575]{position:relative;display:flex;background-color:#e5e7eb;border-radius:1rem;padding:.125rem;width:2.75rem;height:1.5rem}.b-switch__input-label[data-v-94d47575]:before{content:"";position:absolute;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:9999px;left:calc(.125rem - 1px);top:calc(.125rem - 1px);transition:all .15s linear}.date-range:not(:has(.--start):has(.--end)) .date-item.--selected~.date-item:has(~.date-item:hover) .date-item__inner[data-v-9a965dba]{background-color:rgb(var(--ds-colors-primary-t) / 10%)}.date-range:not(:has(.--start):has(.--end)) .date-item:hover~.date-item:has(~.date-item.--selected) .date-item__inner[data-v-9a965dba]{background-color:rgb(var(--ds-colors-primary-t) / 10%)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@7pmlabs/design-system",
-  "version": "0.6.4",
+  "version": "0.6.5",
   "homepage": "https://github.com/ngphanducthinh/design-system",
   "sideEffects": [
     "style.css"