@pequity/squirrel 1.2.9 → 1.2.11

package/dist/cjs/index.js

@@ -8,7 +8,7 @@ const pDropdown = require("./p-dropdown.js");
 const pAlert = require("./p-alert.js");
 const pAvatar = require("./p-avatar.js");
 const pCard_vue_vue_type_script_setup_true_lang = require("./chunks/p-card.js");
-const pCheckbox_vue_vue_type_script_setup_true_lang = require("./chunks/p-checkbox.js");
+const pCheckbox = require("./p-checkbox.js");
 const pChips = require("./p-chips.js");
 const pDatePicker = require("./p-date-picker.js");
 const pDrawer = require("./p-drawer.js");
@@ -296,8 +296,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
           res.push(file);
           continue;
         }
-        if (props.fileTypes.length === 0)
-          ;
+        if (props.fileTypes.length === 0) ;
         else {
           const extension = pFileUpload$1.getFileExtension(fileName) ? `.${pFileUpload$1.getFileExtension(fileName)}` : "";
           const isValidExtension = extension ? props.fileTypes.includes(extension) : false;
@@ -1045,7 +1044,7 @@ exports.PDropdown = pDropdown;
 exports.PAlert = pAlert;
 exports.PAvatar = pAvatar;
 exports.PCard = pCard_vue_vue_type_script_setup_true_lang._sfc_main;
-exports.PCheckbox = pCheckbox_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.PCheckbox = pCheckbox;
 exports.PChips = pChips;
 exports.PDatePicker = pDatePicker;
 exports.PDrawer = pDrawer;

package/dist/cjs/listKeyboardNavigation.js

@@ -74,8 +74,7 @@ const setupListKeyboardNavigation = (options) => {
     }
   };
   const init = () => {
-    if (activeInstance === instance)
-      ;
+    if (activeInstance === instance) ;
     else {
       if (activeInstance) {
         console.warn("There can only be one instance of list navigation active at a time.");

package/dist/cjs/p-btn.js

@@ -21,9 +21,9 @@ const DEFAULT_CLASSES = `relative inline-block outline-none disabled:opacity-50
 const BUTTON_CLASSES = {
   [BUTTON_TYPES.PRIMARY]: "text-surface bg-primary hover:bg-accent active:bg-p-blue-80",
   [BUTTON_TYPES.SECONDARY]: "bg-p-gray-20 hover:bg-p-gray-30 active:bg-p-gray-40",
-  [BUTTON_TYPES.PRIMARY_OUTLINE]: "text-p-purple-60 bg-p-blue-10 border border-p-purple-60 hover:bg-p-gray-20 focus:ring-1 focus:ring-p-purple-60",
-  [BUTTON_TYPES.SECONDARY_OUTLINE]: "text-p-purple-60 bg-surface border border-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-10",
-  [BUTTON_TYPES.SECONDARY_OUTLINE_BLUE]: "text-p-purple-60 bg-surface border border-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-15 aria-selected:text-p-blue-60",
+  [BUTTON_TYPES.PRIMARY_OUTLINE]: "text-p-purple-60 bg-p-blue-10 ring-1 ring-inset ring-p-purple-60 hover:bg-p-gray-20",
+  [BUTTON_TYPES.SECONDARY_OUTLINE]: "text-p-purple-60 bg-surface ring-1 ring-inset ring-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-10",
+  [BUTTON_TYPES.SECONDARY_OUTLINE_BLUE]: "text-p-purple-60 bg-surface ring-1 ring-inset ring-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-15 aria-selected:text-p-blue-60",
   [BUTTON_TYPES.ERROR]: "text-white bg-p-red-40 hover:bg-p-red-50",
   [BUTTON_TYPES.SUCCESS]: "text-white bg-p-green-40 hover:bg-p-green-50",
   [BUTTON_TYPES.PRIMARY_LINK]: "text-primary bg-transparent hover:text-accent underline",

package/dist/cjs/p-checkbox.js

@@ -1,3 +1,46 @@
 "use strict";
-const pCheckbox_vue_vue_type_script_setup_true_lang = require("./chunks/p-checkbox.js");
-module.exports = pCheckbox_vue_vue_type_script_setup_true_lang._sfc_main;
+const vue = require("vue");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const _hoisted_1 = { class: "inline-flex items-center" };
+const _hoisted_2 = ["checked"];
+const _hoisted_3 = {
+  key: 0,
+  class: "ml-2 text-sm"
+};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "PCheckbox",
+    inheritAttrs: false
+  },
+  __name: "p-checkbox",
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: false
+    },
+    label: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("label", _hoisted_1, [
+        vue.renderSlot(_ctx.$slots, "label-before", {}, void 0, true),
+        vue.createElementVNode("input", vue.mergeProps({
+          type: "checkbox",
+          class: "h-4 w-4 shrink-0 appearance-none rounded border border-p-gray-30 bg-surface duration-100 ease-in-out checked:border-none checked:bg-primary disabled:opacity-50",
+          checked: __props.modelValue
+        }, _ctx.$attrs, {
+          onChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", $event.target.checked))
+        }), null, 16, _hoisted_2),
+        vue.renderSlot(_ctx.$slots, "label", {}, () => [
+          __props.label ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true)
+        ], true)
+      ]);
+    };
+  }
+});
+const pCheckbox = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-6729bf3b"]]);
+module.exports = pCheckbox;

package/dist/cjs/pagination.js

@@ -5,8 +5,7 @@ const createPagingRange = (currentPage, totalPageNumber, offset = 2, separator =
   const offsetNumber = currentPageNumber <= offset || currentPageNumber > totalPageNumber - offset ? offset : offset - 1;
   const numbersList = [];
   const numbersListWithDots = [];
-  if (totalPageNumber <= 1 || totalPageNumber === void 0)
-    return [1];
+  if (totalPageNumber <= 1 || totalPageNumber === void 0) return [1];
   numbersList.push(1);
   for (let i = currentPageNumber - offsetNumber; i <= currentPageNumber + offsetNumber; i++) {
     if (i < totalPageNumber && i > 1) {

package/dist/es/index.js

@@ -6,52 +6,52 @@ import PDropdown from "./p-dropdown.js";
 import { default as default2 } from "./p-alert.js";
 import { default as default3 } from "./p-avatar.js";
 import { _ } from "./chunks/p-card.js";
-import { _ as _2 } from "./chunks/p-checkbox.js";
-import { default as default4 } from "./p-chips.js";
-import { default as default5 } from "./p-date-picker.js";
-import { default as default6 } from "./p-drawer.js";
+import { default as default4 } from "./p-checkbox.js";
+import { default as default5 } from "./p-chips.js";
+import { default as default6 } from "./p-date-picker.js";
+import { default as default7 } from "./p-drawer.js";
 import { a as _imports_0$2 } from "./chunks/p-dropdown-select.js";
-import { _ as _3 } from "./chunks/p-dropdown-select.js";
+import { _ as _2 } from "./chunks/p-dropdown-select.js";
 import { formatBytes, getFileExtension } from "./p-file-upload.js";
 import { uniq, kebabCase } from "lodash-es";
 import { useInputClasses } from "./useInputClasses.js";
 import { useToast } from "vue-toastification";
 import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
-import { default as default7 } from "./p-table-filter-icon.js";
-import { default as default8 } from "./p-info-icon.js";
-import { default as default9 } from "./p-inline-date-picker.js";
-import { default as default10 } from "./p-input.js";
-import { default as default11 } from "./p-input-number.js";
-import { _ as _4 } from "./chunks/p-input-percent.js";
+import { default as default8 } from "./p-table-filter-icon.js";
+import { default as default9 } from "./p-info-icon.js";
+import { default as default10 } from "./p-inline-date-picker.js";
+import { default as default11 } from "./p-input.js";
+import { default as default12 } from "./p-input-number.js";
+import { _ as _3 } from "./chunks/p-input-percent.js";
 import PInputSearch from "./p-input-search.js";
-import { default as default12 } from "./p-loading.js";
-import { default as default13 } from "./p-modal.js";
-import { _ as _5 } from "./chunks/p-pagination.js";
-import { _ as _6 } from "./chunks/p-pagination-info.js";
-import { default as default14 } from "./p-progress-bar.js";
-import { _ as _7 } from "./chunks/p-ring-loader.js";
-import { _ as _8 } from "./chunks/p-select.js";
-import { _ as _9 } from "./chunks/p-select-btn.js";
+import { default as default13 } from "./p-loading.js";
+import { default as default14 } from "./p-modal.js";
+import { _ as _4 } from "./chunks/p-pagination.js";
+import { _ as _5 } from "./chunks/p-pagination-info.js";
+import { default as default15 } from "./p-progress-bar.js";
+import { _ as _6 } from "./chunks/p-ring-loader.js";
+import { _ as _7 } from "./chunks/p-select.js";
+import { _ as _8 } from "./chunks/p-select-btn.js";
 import { SIZES } from "./p-select-list.js";
 import { splitStringForHighlight } from "./text.js";
 import { toString } from "./string.js";
 import { useSelectList } from "./useSelectList.js";
-import { default as default15 } from "./p-select-pill.js";
-import { default as default16 } from "./p-skeleton-loader.js";
+import { default as default16 } from "./p-select-pill.js";
+import { default as default17 } from "./p-skeleton-loader.js";
 import PTableHeaderCell from "./p-table-header-cell.js";
 import { colsInjectionKey, isFirstColFixedInjectionKey, isLastColFixedInjectionKey, isColsResizableInjectionKey } from "./p-table.js";
 import { MIN_WIDTH_COL_RESIZE } from "./p-table.js";
 import { usePTableColResize } from "./usePTableColResize.js";
-import { _ as _10 } from "./chunks/p-table-loader.js";
+import { _ as _9 } from "./chunks/p-table-loader.js";
 import { SORTING_TYPES } from "./p-table-sort.js";
-import { default as default17 } from "./p-table-td.js";
-import { _ as _11 } from "./chunks/p-tabs.js";
-import { default as default18 } from "./p-textarea.js";
-import { default as default19 } from "./p-toggle.js";
+import { default as default18 } from "./p-table-td.js";
+import { _ as _10 } from "./chunks/p-tabs.js";
+import { default as default19 } from "./p-textarea.js";
+import { default as default20 } from "./p-toggle.js";
 import { usePLoading } from "./usePLoading.js";
 import { usePModal } from "./usePModal.js";
 import { usePTableRowVirtualizer } from "./usePTableRowVirtualizer.js";
-import { default as default20 } from "./inputClassesMixin.js";
+import { default as default21 } from "./inputClassesMixin.js";
 import { CURRENCY_INPUT_DEFAULTS } from "./currency.js";
 import { getColor, getColorDeep, getScreen } from "./tailwind.js";
 import { ERROR_MSG, INPUT_BASE, INPUT_ERROR, INPUT_NORMAL, INPUT_SIZES, LABEL_BASE, LABEL_REQUIRED, LABEL_SIZES, SELECT_ARROW, SELECT_BASE, SELECT_SIZES, SPACING_LEFT, SPACING_PREFIX, SPACING_RIGHT, SPACING_SUFFIX, TEXTAREA_BASE } from "./inputClassesShared.js";
@@ -296,8 +296,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
           res.push(file);
           continue;
         }
-        if (props.fileTypes.length === 0)
-          ;
+        if (props.fileTypes.length === 0) ;
         else {
           const extension = getFileExtension(fileName) ? `.${getFileExtension(fileName)}` : "";
           const isValidExtension = extension ? props.fileTypes.includes(extension) : false;
@@ -1054,40 +1053,40 @@ export {
   default3 as PAvatar,
   PBtn,
   _ as PCard,
-  _2 as PCheckbox,
-  default4 as PChips,
+  default4 as PCheckbox,
+  default5 as PChips,
   PCloseBtn,
-  default5 as PDatePicker,
-  default6 as PDrawer,
+  default6 as PDatePicker,
+  default7 as PDrawer,
   PDropdown,
-  _3 as PDropdownSelect,
+  _2 as PDropdownSelect,
   pFileUpload as PFileUpload,
-  default7 as PFilterIcon,
-  default8 as PInfoIcon,
-  default9 as PInlineDatePicker,
-  default10 as PInput,
-  default11 as PInputNumber,
-  _4 as PInputPercent,
+  default8 as PFilterIcon,
+  default9 as PInfoIcon,
+  default10 as PInlineDatePicker,
+  default11 as PInput,
+  default12 as PInputNumber,
+  _3 as PInputPercent,
   PInputSearch,
-  default12 as PLoading,
-  default13 as PModal,
-  _5 as PPagination,
-  _6 as PPaginationInfo,
-  default14 as PProgressBar,
-  _7 as PRingLoader,
-  _8 as PSelect,
-  _9 as PSelectBtn,
+  default13 as PLoading,
+  default14 as PModal,
+  _4 as PPagination,
+  _5 as PPaginationInfo,
+  default15 as PProgressBar,
+  _6 as PRingLoader,
+  _7 as PSelect,
+  _8 as PSelectBtn,
   _sfc_main$2 as PSelectList,
-  default15 as PSelectPill,
-  default16 as PSkeletonLoader,
+  default16 as PSelectPill,
+  default17 as PSkeletonLoader,
   pTable as PTable,
   PTableHeaderCell,
-  _10 as PTableLoader,
+  _9 as PTableLoader,
   pTableSort as PTableSort,
-  default17 as PTableTd,
-  _11 as PTabs,
-  default18 as PTextarea,
-  default19 as PToggle,
+  default18 as PTableTd,
+  _10 as PTabs,
+  default19 as PTextarea,
+  default20 as PToggle,
   SELECT_ARROW,
   SELECT_BASE,
   SELECT_SIZES,
@@ -1104,7 +1103,7 @@ export {
   getColorDeep,
   getNextActiveElement,
   getScreen,
-  default20 as inputClassesMixin,
+  default21 as inputClassesMixin,
   isColsResizableInjectionKey,
   isElement,
   isFirstColFixedInjectionKey,

package/dist/es/listKeyboardNavigation.js

@@ -72,8 +72,7 @@ const setupListKeyboardNavigation = (options) => {
     }
   };
   const init = () => {
-    if (activeInstance === instance)
-      ;
+    if (activeInstance === instance) ;
     else {
       if (activeInstance) {
         console.warn("There can only be one instance of list navigation active at a time.");

package/dist/es/p-btn.js

@@ -20,9 +20,9 @@ const DEFAULT_CLASSES = `relative inline-block outline-none disabled:opacity-50
 const BUTTON_CLASSES = {
   [BUTTON_TYPES.PRIMARY]: "text-surface bg-primary hover:bg-accent active:bg-p-blue-80",
   [BUTTON_TYPES.SECONDARY]: "bg-p-gray-20 hover:bg-p-gray-30 active:bg-p-gray-40",
-  [BUTTON_TYPES.PRIMARY_OUTLINE]: "text-p-purple-60 bg-p-blue-10 border border-p-purple-60 hover:bg-p-gray-20 focus:ring-1 focus:ring-p-purple-60",
-  [BUTTON_TYPES.SECONDARY_OUTLINE]: "text-p-purple-60 bg-surface border border-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-10",
-  [BUTTON_TYPES.SECONDARY_OUTLINE_BLUE]: "text-p-purple-60 bg-surface border border-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-15 aria-selected:text-p-blue-60",
+  [BUTTON_TYPES.PRIMARY_OUTLINE]: "text-p-purple-60 bg-p-blue-10 ring-1 ring-inset ring-p-purple-60 hover:bg-p-gray-20",
+  [BUTTON_TYPES.SECONDARY_OUTLINE]: "text-p-purple-60 bg-surface ring-1 ring-inset ring-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-10",
+  [BUTTON_TYPES.SECONDARY_OUTLINE_BLUE]: "text-p-purple-60 bg-surface ring-1 ring-inset ring-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-15 aria-selected:text-p-blue-60",
   [BUTTON_TYPES.ERROR]: "text-white bg-p-red-40 hover:bg-p-red-50",
   [BUTTON_TYPES.SUCCESS]: "text-white bg-p-green-40 hover:bg-p-green-50",
   [BUTTON_TYPES.PRIMARY_LINK]: "text-primary bg-transparent hover:text-accent underline",

package/dist/es/p-checkbox.js

@@ -1,4 +1,47 @@
-import { _ as _sfc_main } from "./chunks/p-checkbox.js";
+import { defineComponent, openBlock, createElementBlock, renderSlot, createElementVNode, mergeProps, toDisplayString, createCommentVNode } from "vue";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "inline-flex items-center" };
+const _hoisted_2 = ["checked"];
+const _hoisted_3 = {
+  key: 0,
+  class: "ml-2 text-sm"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "PCheckbox",
+    inheritAttrs: false
+  },
+  __name: "p-checkbox",
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: false
+    },
+    label: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("label", _hoisted_1, [
+        renderSlot(_ctx.$slots, "label-before", {}, void 0, true),
+        createElementVNode("input", mergeProps({
+          type: "checkbox",
+          class: "h-4 w-4 shrink-0 appearance-none rounded border border-p-gray-30 bg-surface duration-100 ease-in-out checked:border-none checked:bg-primary disabled:opacity-50",
+          checked: __props.modelValue
+        }, _ctx.$attrs, {
+          onChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", $event.target.checked))
+        }), null, 16, _hoisted_2),
+        renderSlot(_ctx.$slots, "label", {}, () => [
+          __props.label ? (openBlock(), createElementBlock("div", _hoisted_3, toDisplayString(__props.label), 1)) : createCommentVNode("", true)
+        ], true)
+      ]);
+    };
+  }
+});
+const pCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6729bf3b"]]);
 export {
-  _sfc_main as default
+  pCheckbox as default
 };

package/dist/es/pagination.js

@@ -3,8 +3,7 @@ const createPagingRange = (currentPage, totalPageNumber, offset = 2, separator =
   const offsetNumber = currentPageNumber <= offset || currentPageNumber > totalPageNumber - offset ? offset : offset - 1;
   const numbersList = [];
   const numbersListWithDots = [];
-  if (totalPageNumber <= 1 || totalPageNumber === void 0)
-    return [1];
+  if (totalPageNumber <= 1 || totalPageNumber === void 0) return [1];
   numbersList.push(1);
   for (let i = currentPageNumber - offsetNumber; i <= currentPageNumber + offsetNumber; i++) {
     if (i < totalPageNumber && i > 1) {

package/dist/squirrel/components/p-btn/p-btn.vue.d.ts

@@ -1,5 +1,4 @@
 import { type PropType } from 'vue';
-import { type RouteLocationRaw } from 'vue-router';
 import { type Size } from './p-btn.types';
 declare const BUTTON_TYPES: {
     readonly PRIMARY: "primary";
@@ -61,7 +60,7 @@ declare const _default: import("vue").DefineComponent<{
      * See https://router.vuejs.org/api/#RouteLocationRaw
      */
     to: {
-        type: PropType<RouteLocationRaw>;
+        type: PropType<string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric>;
         default: string;
     };
 }, unknown, {
@@ -117,7 +116,7 @@ declare const _default: import("vue").DefineComponent<{
      * See https://router.vuejs.org/api/#RouteLocationRaw
      */
     to: {
-        type: PropType<RouteLocationRaw>;
+        type: PropType<string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric>;
         default: string;
     };
 }>>, {
@@ -126,6 +125,6 @@ declare const _default: import("vue").DefineComponent<{
     nativeType: "button" | "submit" | "reset";
     loading: boolean;
     selected: boolean;
-    to: RouteLocationRaw;
+    to: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric;
 }, {}>;
 export default _default;

package/dist/squirrel/components/p-checkbox/p-checkbox.vue.d.ts

@@ -1,8 +1,12 @@
-declare const _default: import("vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     modelValue: {
         type: BooleanConstructor;
         default: boolean;
     };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -10,9 +14,22 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
+    label: string;
     modelValue: boolean;
-}, {}>;
+}, {}>, {
+    "label-before"?(_: {}): any;
+    label?(_: {}): any;
+}>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/squirrel/components/p-table/usePTableRowVirtualizer.d.ts

@@ -17,7 +17,7 @@ export declare const usePTableRowVirtualizer: (options: Options) => {
     measureElement: () => Ref<undefined>;
 } | {
     virtualizer: Ref<import("@tanstack/vue-virtual").Virtualizer<HTMLElement, Element>>;
-    virtualRows: ComputedRef<import("@tanstack/vue-virtual").VirtualItem[]>;
+    virtualRows: ComputedRef<import("@tanstack/vue-virtual").VirtualItem<Element>[]>;
     paddingTop: ComputedRef<number>;
     paddingBottom: ComputedRef<number>;
     measureElement: (cmp: ComponentPublicInstance | Ref<HTMLElement>) => undefined;

package/dist/style.css

@@ -1,160 +1,16 @@
-
-.shadow-inner-toggle[data-v-3a6de4eb]::after {
-  box-shadow:
-    rgba(0, 0, 0, 0.3) 0px 1px 2px 0px,
-    rgba(0, 0, 0, 0.05) 0px 0px 1px 0px inset;
-}
-.td-shadow-right[data-v-09e6d191] {
-  box-shadow: -1px 1px 5px 4px rgba(0, 0, 0, 0.15);
-  clip-path: inset(0px -12px 0px 0px);
-}
-.td-shadow-left[data-v-09e6d191] {
-  box-shadow: -2px 1px 8px rgba(0, 0, 0, 0.15);
-  clip-path: inset(0px 0px 0px -12px);
-}
-.td-col-fixed-border-b[data-v-09e6d191]::after {
-  position: absolute;
-  bottom: 0px;
-  left: 0px;
-  height: 1px;
-  width: 100%;
-  background-color: var(--color-p-gray-30);
-  --tw-content: "";
-  content: var(--tw-content);
-}.filter[data-v-cbac2434] {
-  background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15.5%206.73H4.5C4.36739%206.73%204.24021%206.67732%204.14645%206.58355C4.05268%206.48978%204%206.3626%204%206.23C4%206.09739%204.05268%205.97021%204.14645%205.87644C4.24021%205.78267%204.36739%205.73%204.5%205.73H15.5C15.6326%205.73%2015.7598%205.78267%2015.8536%205.87644C15.9473%205.97021%2016%206.09739%2016%206.23C16%206.3626%2015.9473%206.48978%2015.8536%206.58355C15.7598%206.67732%2015.6326%206.73%2015.5%206.73Z'%20fill='%23424E6E'/%3e%3cpath%20d='M14.33%209.245H5.67C5.53739%209.245%205.41021%209.19232%205.31644%209.09855C5.22268%209.00478%205.17%208.8776%205.17%208.745C5.17%208.61239%205.22268%208.48521%205.31644%208.39144C5.41021%208.29767%205.53739%208.245%205.67%208.245H14.33C14.4626%208.245%2014.5898%208.29767%2014.6836%208.39144C14.7773%208.48521%2014.83%208.61239%2014.83%208.745C14.83%208.8776%2014.7773%209.00478%2014.6836%209.09855C14.5898%209.19232%2014.4626%209.245%2014.33%209.245Z'%20fill='%23424E6E'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1235C7.94768%2014.0298%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4164C8.13522%2013.3227%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3227%2011.9586%2013.4164C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0298%2011.9586%2014.1235C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%23424E6E'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6085C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9014C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9014C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6085C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%23424E6E'/%3e%3c/svg%3e") no-repeat;
-}
-.filter[data-v-cbac2434]:hover {
-  background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='20'%20height='20'%20rx='4'%20fill='black'%20fill-opacity='0.05'/%3e%3cpath%20d='M15.5%206.73001H4.5C4.36739%206.73001%204.24021%206.67733%204.14645%206.58356C4.05268%206.4898%204%206.36262%204%206.23001C4%206.0974%204.05268%205.97023%204.14645%205.87646C4.24021%205.78269%204.36739%205.73001%204.5%205.73001H15.5C15.6326%205.73001%2015.7598%205.78269%2015.8536%205.87646C15.9473%205.97023%2016%206.0974%2016%206.23001C16%206.36262%2015.9473%206.4898%2015.8536%206.58356C15.7598%206.67733%2015.6326%206.73001%2015.5%206.73001Z'%20fill='%23424E6E'/%3e%3cpath%20d='M14.33%209.24503H5.67C5.53739%209.24503%205.41021%209.19235%205.31644%209.09858C5.22268%209.00481%205.17%208.87763%205.17%208.74503C5.17%208.61242%205.22268%208.48524%205.31644%208.39147C5.41021%208.2977%205.53739%208.24503%205.67%208.24503H14.33C14.4626%208.24503%2014.5898%208.2977%2014.6836%208.39147C14.7773%208.48524%2014.83%208.61242%2014.83%208.74503C14.83%208.87763%2014.7773%209.00481%2014.6836%209.09858C14.5898%209.19235%2014.4626%209.24503%2014.33%209.24503Z'%20fill='%23424E6E'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1236C7.94768%2014.0298%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4165C8.13522%2013.3227%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3227%2011.9586%2013.4165C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0298%2011.9586%2014.1236C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%23424E6E'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6086C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9015C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9015C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6086C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%23424E6E'/%3e%3c/svg%3e") no-repeat;
-}
-.filter.active[data-v-cbac2434] {
-  background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15.5%206.72998H4.5C4.36739%206.72998%204.24021%206.6773%204.14645%206.58353C4.05268%206.48977%204%206.36259%204%206.22998C4%206.09737%204.05268%205.9702%204.14645%205.87643C4.24021%205.78266%204.36739%205.72998%204.5%205.72998H15.5C15.6326%205.72998%2015.7598%205.78266%2015.8536%205.87643C15.9473%205.9702%2016%206.09737%2016%206.22998C16%206.36259%2015.9473%206.48977%2015.8536%206.58353C15.7598%206.6773%2015.6326%206.72998%2015.5%206.72998Z'%20fill='%230F45AF'/%3e%3cpath%20d='M14.33%209.245H5.67C5.53739%209.245%205.41021%209.19232%205.31644%209.09855C5.22268%209.00478%205.17%208.8776%205.17%208.745C5.17%208.61239%205.22268%208.48521%205.31644%208.39144C5.41021%208.29767%205.53739%208.245%205.67%208.245H14.33C14.4626%208.245%2014.5898%208.29767%2014.6836%208.39144C14.7773%208.48521%2014.83%208.61239%2014.83%208.745C14.83%208.8776%2014.7773%209.00478%2014.6836%209.09855C14.5898%209.19232%2014.4626%209.245%2014.33%209.245Z'%20fill='%230F45AF'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1235C7.94768%2014.0297%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4164C8.13522%2013.3226%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3226%2011.9586%2013.4164C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0297%2011.9586%2014.1235C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%230F45AF'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6086C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9015C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9015C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6086C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%230F45AF'/%3e%3c/svg%3e") no-repeat;
-}
-.filter.active[data-v-cbac2434]:hover {
-  background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='20'%20height='20'%20rx='4'%20fill='black'%20fill-opacity='0.05'/%3e%3cpath%20d='M15.5%206.72998H4.5C4.36739%206.72998%204.24021%206.6773%204.14645%206.58353C4.05268%206.48977%204%206.36259%204%206.22998C4%206.09737%204.05268%205.9702%204.14645%205.87643C4.24021%205.78266%204.36739%205.72998%204.5%205.72998H15.5C15.6326%205.72998%2015.7598%205.78266%2015.8536%205.87643C15.9473%205.9702%2016%206.09737%2016%206.22998C16%206.36259%2015.9473%206.48977%2015.8536%206.58353C15.7598%206.6773%2015.6326%206.72998%2015.5%206.72998Z'%20fill='%230F45AF'/%3e%3cpath%20d='M14.33%209.245H5.67C5.53739%209.245%205.41021%209.19232%205.31644%209.09855C5.22268%209.00478%205.17%208.8776%205.17%208.745C5.17%208.61239%205.22268%208.48521%205.31644%208.39144C5.41021%208.29767%205.53739%208.245%205.67%208.245H14.33C14.4626%208.245%2014.5898%208.29767%2014.6836%208.39144C14.7773%208.48521%2014.83%208.61239%2014.83%208.745C14.83%208.8776%2014.7773%209.00478%2014.6836%209.09855C14.5898%209.19232%2014.4626%209.245%2014.33%209.245Z'%20fill='%230F45AF'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1235C7.94768%2014.0297%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4164C8.13522%2013.3226%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3226%2011.9586%2013.4164C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0297%2011.9586%2014.1235C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%230F45AF'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6086C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9015C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9015C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6086C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%230F45AF'/%3e%3c/svg%3e") no-repeat;
-}
-.bg-cross[data-v-cb511035] {
-  background-image: url("data:image/svg+xml,%3csvg%20width='6'%20height='6'%20viewBox='0%200%206%206'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_2511_8629)'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M3%203.51667L5.42083%205.9375L5.9375%205.42083L3.51667%203L5.9375%200.57917L5.42083%200.0625L3%202.48333L0.57917%200.0625L0.0625%200.57917L2.48333%203L0.0625%205.42083L0.57917%205.9375L3%203.51667Z'%20fill='%231A123B'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_2511_8629'%3e%3crect%20width='6'%20height='6'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
-}
-
-.x-black-icon[data-v-f61993bb] {
-  background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Remove'%20clip-path='url(%23clip0_3453_5756)'%3e%3cpath%20id='Vector'%20d='M0.219996%2010.72C0.149851%2010.7893%200.0941591%2010.8718%200.0561487%2010.9628C0.0181382%2011.0537%20-0.00143433%2011.1514%20-0.00143433%2011.25C-0.00143433%2011.3486%200.0181382%2011.4462%200.0561487%2011.5372C0.0941591%2011.6281%200.149851%2011.7107%200.219996%2011.78C0.360622%2011.9204%200.551246%2011.9993%200.749996%2011.9993C0.948747%2011.9993%201.13937%2011.9204%201.28%2011.78L5.91%207.14997C5.92166%207.13787%205.93564%207.12825%205.9511%207.12168C5.96656%207.1151%205.98319%207.11172%206%207.11172C6.0168%207.11172%206.03343%207.1151%206.04889%207.12168C6.06436%207.12825%206.07834%207.13787%206.09%207.14997L10.72%2011.78C10.8606%2011.9204%2011.0512%2011.9993%2011.25%2011.9993C11.4487%2011.9993%2011.6394%2011.9204%2011.78%2011.78C11.8501%2011.7107%2011.9058%2011.6281%2011.9438%2011.5372C11.9819%2011.4462%2012.0014%2011.3486%2012.0014%2011.25C12.0014%2011.1514%2011.9819%2011.0537%2011.9438%2010.9628C11.9058%2010.8718%2011.8501%2010.7893%2011.78%2010.72L7.15%206.08997C7.1379%206.07831%207.12828%206.06433%207.1217%206.04886C7.11513%206.0334%207.11174%206.01677%207.11174%205.99997C7.11174%205.98317%207.11513%205.96654%207.1217%205.95107C7.12828%205.93561%207.1379%205.92163%207.15%205.90997L11.78%201.27997C11.9125%201.13779%2011.9846%200.949747%2011.9812%200.755446C11.9777%200.561145%2011.899%200.37576%2011.7616%200.238347C11.6242%200.100934%2011.4388%200.0222218%2011.2445%200.0187936C11.0502%200.0153654%2010.8622%200.0874886%2010.72%200.219969L6.09%204.84997C6.07834%204.86207%206.06436%204.87169%206.04889%204.87826C6.03343%204.88483%206.0168%204.88822%206%204.88822C5.98319%204.88822%205.96656%204.88483%205.9511%204.87826C5.93564%204.87169%205.92166%204.86207%205.91%204.84997L1.28%200.219969C1.13782%200.0874886%200.949775%200.0153654%200.755474%200.0187936C0.561173%200.0222218%200.375787%200.100934%200.238374%200.238347C0.100961%200.37576%200.0222494%200.561145%200.0188212%200.755446C0.015393%200.949747%200.0875162%201.13779%200.219996%201.27997L4.85%205.90997C4.86209%205.92163%204.87172%205.93561%204.87829%205.95107C4.88486%205.96654%204.88825%205.98317%204.88825%205.99997C4.88825%206.01677%204.88486%206.0334%204.87829%206.04886C4.87172%206.06433%204.86209%206.07831%204.85%206.08997L0.219996%2010.72Z'%20fill='%231A123B'%20/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_3453_5756'%3e%3crect%20width='12'%20height='12'%20fill='white'%20/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
-}
-.x-white-icon[data-v-f61993bb] {
-  background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Remove'%20clip-path='url(%23clip0_3453_5756)'%3e%3cpath%20id='Vector'%20d='M0.219996%2010.72C0.149851%2010.7893%200.0941591%2010.8718%200.0561487%2010.9628C0.0181382%2011.0537%20-0.00143433%2011.1514%20-0.00143433%2011.25C-0.00143433%2011.3486%200.0181382%2011.4462%200.0561487%2011.5372C0.0941591%2011.6281%200.149851%2011.7107%200.219996%2011.78C0.360622%2011.9204%200.551246%2011.9993%200.749996%2011.9993C0.948747%2011.9993%201.13937%2011.9204%201.28%2011.78L5.91%207.14997C5.92166%207.13787%205.93564%207.12825%205.9511%207.12168C5.96656%207.1151%205.98319%207.11172%206%207.11172C6.0168%207.11172%206.03343%207.1151%206.04889%207.12168C6.06436%207.12825%206.07834%207.13787%206.09%207.14997L10.72%2011.78C10.8606%2011.9204%2011.0512%2011.9993%2011.25%2011.9993C11.4487%2011.9993%2011.6394%2011.9204%2011.78%2011.78C11.8501%2011.7107%2011.9058%2011.6281%2011.9438%2011.5372C11.9819%2011.4462%2012.0014%2011.3486%2012.0014%2011.25C12.0014%2011.1514%2011.9819%2011.0537%2011.9438%2010.9628C11.9058%2010.8718%2011.8501%2010.7893%2011.78%2010.72L7.15%206.08997C7.1379%206.07831%207.12828%206.06433%207.1217%206.04886C7.11513%206.0334%207.11174%206.01677%207.11174%205.99997C7.11174%205.98317%207.11513%205.96654%207.1217%205.95107C7.12828%205.93561%207.1379%205.92163%207.15%205.90997L11.78%201.27997C11.9125%201.13779%2011.9846%200.949747%2011.9812%200.755446C11.9777%200.561145%2011.899%200.37576%2011.7616%200.238347C11.6242%200.100934%2011.4388%200.0222218%2011.2445%200.0187936C11.0502%200.0153654%2010.8622%200.0874886%2010.72%200.219969L6.09%204.84997C6.07834%204.86207%206.06436%204.87169%206.04889%204.87826C6.03343%204.88483%206.0168%204.88822%206%204.88822C5.98319%204.88822%205.96656%204.88483%205.9511%204.87826C5.93564%204.87169%205.92166%204.86207%205.91%204.84997L1.28%200.219969C1.13782%200.0874886%200.949775%200.0153654%200.755474%200.0187936C0.561173%200.0222218%200.375787%200.100934%200.238374%200.238347C0.100961%200.37576%200.0222494%200.561145%200.0188212%200.755446C0.015393%200.949747%200.0875162%201.13779%200.219996%201.27997L4.85%205.90997C4.86209%205.92163%204.87172%205.93561%204.87829%205.95107C4.88486%205.96654%204.88825%205.98317%204.88825%205.99997C4.88825%206.01677%204.88486%206.0334%204.87829%206.04886C4.87172%206.06433%204.86209%206.07831%204.85%206.08997L0.219996%2010.72Z'%20fill='%23FFFFFF'%20/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_3453_5756'%3e%3crect%20width='12'%20height='12'%20fill='white'%20/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
-}
-.drawer[data-v-f474eec2] {
-  position: fixed;
-  bottom: 0px;
-  top: 0px;
-  display: flex;
-  flex-direction: column;
-  background-color: var(--color-surface);
-  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
-  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-  outline: 2px solid transparent;
-  outline-offset: 2px;
-  max-width: var(--4c0aead4);
-  width: 100%;
-}
-.drawer.drawer-left[data-v-f474eec2] {
-  left: 0px;
-}
-.drawer.drawer-right[data-v-f474eec2] {
-  right: 0px;
-}
-
-/* Slide from right animations */
-@keyframes slideInRight-f474eec2 {
-0% {
-    transform: translate3d(100%, 0, 0);
-    visibility: visible;
-}
-100% {
-    transform: translate3d(0, 0, 0);
-}
-}
-.slideInRight[data-v-f474eec2] {
-  animation-duration: var(--59cfae08);
-  animation-fill-mode: both;
-  animation-name: slideInRight-f474eec2;
-}
-@keyframes slideOutRight-f474eec2 {
-0% {
-    transform: translate3d(0, 0, 0);
-}
-100% {
-    visibility: hidden;
-    transform: translate3d(100%, 0, 0);
-}
-}
-.slideOutRight[data-v-f474eec2] {
-  animation-duration: var(--59cfae08);
-  animation-fill-mode: both;
-  animation-name: slideOutRight-f474eec2;
-}
-
-/* Slide from left animations */
-@keyframes slideInLeft-f474eec2 {
-0% {
-    transform: translate3d(-100%, 0, 0);
-    visibility: visible;
-}
-100% {
-    transform: translate3d(0, 0, 0);
-}
-}
-.slideInLeft[data-v-f474eec2] {
-  animation-duration: var(--59cfae08);
-  animation-fill-mode: both;
-  animation-name: slideInLeft-f474eec2;
-}
-@keyframes slideOutLeft-f474eec2 {
-0% {
-    transform: translate3d(0, 0, 0);
+.shimmer[data-v-53e537dc] {
+  transform: translateX(-100%);
+  animation: shimmer-53e537dc 1.4s infinite;
 }
+@keyframes shimmer-53e537dc {
 100% {
-    visibility: hidden;
-    transform: translate3d(-100%, 0, 0);
-}
-}
-.slideOutLeft[data-v-f474eec2] {
-  animation-duration: var(--59cfae08);
-  animation-fill-mode: both;
-  animation-name: slideOutLeft-f474eec2;
-}
-
-/* Backdrop */
-.fadeIn[data-v-f474eec2] {
-  animation-name: fadeInFrames-f474eec2;
-}
-.fadeOut[data-v-f474eec2] {
-  animation-name: fadeOutFrames-f474eec2;
-}
-.fadeIn[data-v-f474eec2],
-.fadeOut[data-v-f474eec2] {
-  animation-duration: 0.25s;
-  animation-fill-mode: both;
-}
-@keyframes fadeInFrames-f474eec2 {
-from {
-    opacity: 0;
-    animation-timing-function: cubic-bezier(0, 0, 1, 1);
-}
-to {
-    opacity: 1;
-}
+    transform: translateX(100%);
 }
-@keyframes fadeOutFrames-f474eec2 {
-from {
-    opacity: 1;
-    animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);
 }
-to {
-    opacity: 0;
+.bg-info-circle-icon[data-v-189b159e] {
+  background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_4002_33291)'%3e%3cpath%20d='M0.5%206C0.5%207.45869%201.07946%208.85764%202.11091%209.88909C3.14236%2010.9205%204.54131%2011.5%206%2011.5C7.45869%2011.5%208.85764%2010.9205%209.88909%209.88909C10.9205%208.85764%2011.5%207.45869%2011.5%206C11.5%204.54131%2010.9205%203.14236%209.88909%202.11091C8.85764%201.07946%207.45869%200.5%206%200.5C4.54131%200.5%203.14236%201.07946%202.11091%202.11091C1.07946%203.14236%200.5%204.54131%200.5%206Z'%20stroke='%231A123B'%20stroke-miterlimit='10'/%3e%3cpath%20d='M6.5%203.5H5.5V2.5H6.5V3.5Z'%20fill='%231A123B'/%3e%3cpath%20d='M4.5%205H6V9M4.5%208.5H7.5'%20stroke='%231A123B'%20stroke-miterlimit='10'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_4002_33291'%3e%3crect%20width='12'%20height='12'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
 }
-}div[id^=popper_].dropdown {
+div[id^=popper_].dropdown {
 
     outline: 2px solid transparent;
 
@@ -289,11 +145,7 @@ div[id^=popper_].dropdown .v-popper__inner .dropdown-menu .dropdown-divider {
     border-color: var(--color-p-gray-30);
 
     opacity: 1
-}
-.bg-info-circle-icon[data-v-189b159e] {
-  background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_4002_33291)'%3e%3cpath%20d='M0.5%206C0.5%207.45869%201.07946%208.85764%202.11091%209.88909C3.14236%2010.9205%204.54131%2011.5%206%2011.5C7.45869%2011.5%208.85764%2010.9205%209.88909%209.88909C10.9205%208.85764%2011.5%207.45869%2011.5%206C11.5%204.54131%2010.9205%203.14236%209.88909%202.11091C8.85764%201.07946%207.45869%200.5%206%200.5C4.54131%200.5%203.14236%201.07946%202.11091%202.11091C1.07946%203.14236%200.5%204.54131%200.5%206Z'%20stroke='%231A123B'%20stroke-miterlimit='10'/%3e%3cpath%20d='M6.5%203.5H5.5V2.5H6.5V3.5Z'%20fill='%231A123B'/%3e%3cpath%20d='M4.5%205H6V9M4.5%208.5H7.5'%20stroke='%231A123B'%20stroke-miterlimit='10'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_4002_33291'%3e%3crect%20width='12'%20height='12'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
-}
-.icon.clear[data-v-7a1e1e82] {
+}.icon.clear[data-v-7a1e1e82] {
   background-image: url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_1634_880)'%3e%3cpath%20d='M16%208C16%206.41775%2015.5308%204.87104%2014.6518%203.55544C13.7727%202.23985%2012.5233%201.21447%2011.0615%200.608967C9.59966%200.00346629%207.99113%20-0.15496%206.43928%200.153721C4.88743%200.462403%203.46197%201.22433%202.34315%202.34315C1.22433%203.46197%200.462403%204.88743%200.153721%206.43928C-0.15496%207.99113%200.00346629%209.59966%200.608967%2011.0615C1.21447%2012.5233%202.23985%2013.7727%203.55544%2014.6518C4.87104%2015.5308%206.41775%2016%208%2016C10.1217%2016%2012.1566%2015.1571%2013.6569%2013.6569C15.1571%2012.1566%2016%2010.1217%2016%208ZM11.14%2010.1867C11.2642%2010.3116%2011.3339%2010.4805%2011.3339%2010.6567C11.3339%2010.8328%2011.2642%2011.0018%2011.14%2011.1267C11.078%2011.1892%2011.0043%2011.2388%2010.9231%2011.2726C10.8418%2011.3064%2010.7547%2011.3239%2010.6667%2011.3239C10.5787%2011.3239%2010.4915%2011.3064%2010.4103%2011.2726C10.329%2011.2388%2010.2553%2011.1892%2010.1933%2011.1267L8.12%209.05334C8.08809%209.02429%208.04649%209.0082%208.00334%209.0082C7.96019%209.0082%207.91858%209.02429%207.88667%209.05334L5.81334%2011.1267C5.6858%2011.2359%205.52175%2011.293%205.35397%2011.2865C5.18618%2011.28%205.02702%2011.2104%204.90829%2011.0917C4.78957%2010.973%204.72001%2010.8138%204.71353%2010.646C4.70705%2010.4783%204.76412%2010.3142%204.87334%2010.1867L6.94667%208.11334C6.97572%208.08142%206.99181%208.03982%206.99181%207.99667C6.99181%207.95352%206.97572%207.91192%206.94667%207.88L4.87334%205.80667C4.81085%205.7447%204.76126%205.67096%204.72741%205.58972C4.69356%205.50848%204.67614%205.42135%204.67614%205.33334C4.67614%205.24533%204.69356%205.15819%204.72741%205.07695C4.76126%204.99571%204.81085%204.92198%204.87334%204.86C4.99825%204.73584%205.16721%204.66614%205.34334%204.66614C5.51946%204.66614%205.68843%204.73584%205.81334%204.86L7.88667%206.93334C7.90163%206.94928%207.91971%206.96199%207.93977%206.97068C7.95984%206.97936%207.98147%206.98384%208.00334%206.98384C8.0252%206.98384%208.04684%206.97936%208.0669%206.97068C8.08697%206.96199%208.10504%206.94928%208.12%206.93334L10.1933%204.86C10.2555%204.79784%2010.3293%204.74854%2010.4105%204.7149C10.4917%204.68126%2010.5788%204.66394%2010.6667%204.66394C10.7546%204.66394%2010.8416%204.68126%2010.9228%204.7149C11.0041%204.74854%2011.0778%204.79784%2011.14%204.86C11.2022%204.92216%2011.2515%204.99596%2011.2851%205.07717C11.3188%205.15839%2011.3361%205.24543%2011.3361%205.33334C11.3361%205.42124%2011.3188%205.50829%2011.2851%205.5895C11.2515%205.67072%2011.2022%205.74451%2011.14%205.80667L9.06667%207.88C9.05073%207.89497%209.03802%207.91304%209.02933%207.93311C9.02065%207.95317%209.01616%207.97481%209.01616%207.99667C9.01616%208.01854%209.02065%208.04017%209.02933%208.06024C9.03802%208.0803%209.05073%208.09837%209.06667%208.11334L11.14%2010.1867Z'%20fill='%23A0AEC0'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_1634_880'%3e%3crect%20width='16'%20height='16'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
   background-position: center center;
   transition: background-image 0.4s;
@@ -369,6 +221,166 @@ div[id^=popper_].dropdown .v-popper__inner .dropdown-menu .dropdown-divider {
   height: 1.5rem;
   right: 2.5rem;
   bottom: 0.75rem;
+}.filter[data-v-cbac2434] {
+  background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15.5%206.73H4.5C4.36739%206.73%204.24021%206.67732%204.14645%206.58355C4.05268%206.48978%204%206.3626%204%206.23C4%206.09739%204.05268%205.97021%204.14645%205.87644C4.24021%205.78267%204.36739%205.73%204.5%205.73H15.5C15.6326%205.73%2015.7598%205.78267%2015.8536%205.87644C15.9473%205.97021%2016%206.09739%2016%206.23C16%206.3626%2015.9473%206.48978%2015.8536%206.58355C15.7598%206.67732%2015.6326%206.73%2015.5%206.73Z'%20fill='%23424E6E'/%3e%3cpath%20d='M14.33%209.245H5.67C5.53739%209.245%205.41021%209.19232%205.31644%209.09855C5.22268%209.00478%205.17%208.8776%205.17%208.745C5.17%208.61239%205.22268%208.48521%205.31644%208.39144C5.41021%208.29767%205.53739%208.245%205.67%208.245H14.33C14.4626%208.245%2014.5898%208.29767%2014.6836%208.39144C14.7773%208.48521%2014.83%208.61239%2014.83%208.745C14.83%208.8776%2014.7773%209.00478%2014.6836%209.09855C14.5898%209.19232%2014.4626%209.245%2014.33%209.245Z'%20fill='%23424E6E'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1235C7.94768%2014.0298%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4164C8.13522%2013.3227%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3227%2011.9586%2013.4164C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0298%2011.9586%2014.1235C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%23424E6E'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6085C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9014C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9014C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6085C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%23424E6E'/%3e%3c/svg%3e") no-repeat;
+}
+.filter[data-v-cbac2434]:hover {
+  background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='20'%20height='20'%20rx='4'%20fill='black'%20fill-opacity='0.05'/%3e%3cpath%20d='M15.5%206.73001H4.5C4.36739%206.73001%204.24021%206.67733%204.14645%206.58356C4.05268%206.4898%204%206.36262%204%206.23001C4%206.0974%204.05268%205.97023%204.14645%205.87646C4.24021%205.78269%204.36739%205.73001%204.5%205.73001H15.5C15.6326%205.73001%2015.7598%205.78269%2015.8536%205.87646C15.9473%205.97023%2016%206.0974%2016%206.23001C16%206.36262%2015.9473%206.4898%2015.8536%206.58356C15.7598%206.67733%2015.6326%206.73001%2015.5%206.73001Z'%20fill='%23424E6E'/%3e%3cpath%20d='M14.33%209.24503H5.67C5.53739%209.24503%205.41021%209.19235%205.31644%209.09858C5.22268%209.00481%205.17%208.87763%205.17%208.74503C5.17%208.61242%205.22268%208.48524%205.31644%208.39147C5.41021%208.2977%205.53739%208.24503%205.67%208.24503H14.33C14.4626%208.24503%2014.5898%208.2977%2014.6836%208.39147C14.7773%208.48524%2014.83%208.61242%2014.83%208.74503C14.83%208.87763%2014.7773%209.00481%2014.6836%209.09858C14.5898%209.19235%2014.4626%209.24503%2014.33%209.24503Z'%20fill='%23424E6E'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1236C7.94768%2014.0298%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4165C8.13522%2013.3227%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3227%2011.9586%2013.4165C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0298%2011.9586%2014.1236C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%23424E6E'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6086C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9015C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9015C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6086C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%23424E6E'/%3e%3c/svg%3e") no-repeat;
+}
+.filter.active[data-v-cbac2434] {
+  background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15.5%206.72998H4.5C4.36739%206.72998%204.24021%206.6773%204.14645%206.58353C4.05268%206.48977%204%206.36259%204%206.22998C4%206.09737%204.05268%205.9702%204.14645%205.87643C4.24021%205.78266%204.36739%205.72998%204.5%205.72998H15.5C15.6326%205.72998%2015.7598%205.78266%2015.8536%205.87643C15.9473%205.9702%2016%206.09737%2016%206.22998C16%206.36259%2015.9473%206.48977%2015.8536%206.58353C15.7598%206.6773%2015.6326%206.72998%2015.5%206.72998Z'%20fill='%230F45AF'/%3e%3cpath%20d='M14.33%209.245H5.67C5.53739%209.245%205.41021%209.19232%205.31644%209.09855C5.22268%209.00478%205.17%208.8776%205.17%208.745C5.17%208.61239%205.22268%208.48521%205.31644%208.39144C5.41021%208.29767%205.53739%208.245%205.67%208.245H14.33C14.4626%208.245%2014.5898%208.29767%2014.6836%208.39144C14.7773%208.48521%2014.83%208.61239%2014.83%208.745C14.83%208.8776%2014.7773%209.00478%2014.6836%209.09855C14.5898%209.19232%2014.4626%209.245%2014.33%209.245Z'%20fill='%230F45AF'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1235C7.94768%2014.0297%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4164C8.13522%2013.3226%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3226%2011.9586%2013.4164C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0297%2011.9586%2014.1235C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%230F45AF'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6086C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9015C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9015C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6086C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%230F45AF'/%3e%3c/svg%3e") no-repeat;
+}
+.filter.active[data-v-cbac2434]:hover {
+  background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='20'%20height='20'%20rx='4'%20fill='black'%20fill-opacity='0.05'/%3e%3cpath%20d='M15.5%206.72998H4.5C4.36739%206.72998%204.24021%206.6773%204.14645%206.58353C4.05268%206.48977%204%206.36259%204%206.22998C4%206.09737%204.05268%205.9702%204.14645%205.87643C4.24021%205.78266%204.36739%205.72998%204.5%205.72998H15.5C15.6326%205.72998%2015.7598%205.78266%2015.8536%205.87643C15.9473%205.9702%2016%206.09737%2016%206.22998C16%206.36259%2015.9473%206.48977%2015.8536%206.58353C15.7598%206.6773%2015.6326%206.72998%2015.5%206.72998Z'%20fill='%230F45AF'/%3e%3cpath%20d='M14.33%209.245H5.67C5.53739%209.245%205.41021%209.19232%205.31644%209.09855C5.22268%209.00478%205.17%208.8776%205.17%208.745C5.17%208.61239%205.22268%208.48521%205.31644%208.39144C5.41021%208.29767%205.53739%208.245%205.67%208.245H14.33C14.4626%208.245%2014.5898%208.29767%2014.6836%208.39144C14.7773%208.48521%2014.83%208.61239%2014.83%208.745C14.83%208.8776%2014.7773%209.00478%2014.6836%209.09855C14.5898%209.19232%2014.4626%209.245%2014.33%209.245Z'%20fill='%230F45AF'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1235C7.94768%2014.0297%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4164C8.13522%2013.3226%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3226%2011.9586%2013.4164C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0297%2011.9586%2014.1235C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%230F45AF'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6086C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9015C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9015C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6086C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%230F45AF'/%3e%3c/svg%3e") no-repeat;
+}
+.shadow-inner-toggle[data-v-3a6de4eb]::after {
+  box-shadow:
+    rgba(0, 0, 0, 0.3) 0px 1px 2px 0px,
+    rgba(0, 0, 0, 0.05) 0px 0px 1px 0px inset;
+}
+.td-shadow-right[data-v-09e6d191] {
+  box-shadow: -1px 1px 5px 4px rgba(0, 0, 0, 0.15);
+  clip-path: inset(0px -12px 0px 0px);
+}
+.td-shadow-left[data-v-09e6d191] {
+  box-shadow: -2px 1px 8px rgba(0, 0, 0, 0.15);
+  clip-path: inset(0px 0px 0px -12px);
+}
+.td-col-fixed-border-b[data-v-09e6d191]::after {
+  position: absolute;
+  bottom: 0px;
+  left: 0px;
+  height: 1px;
+  width: 100%;
+  background-color: var(--color-p-gray-30);
+  --tw-content: "";
+  content: var(--tw-content);
+}
+input[type='checkbox'][data-v-6729bf3b]:checked {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3E%3C/svg%3E");
+}
+
+.bg-cross[data-v-cb511035] {
+  background-image: url("data:image/svg+xml,%3csvg%20width='6'%20height='6'%20viewBox='0%200%206%206'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_2511_8629)'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M3%203.51667L5.42083%205.9375L5.9375%205.42083L3.51667%203L5.9375%200.57917L5.42083%200.0625L3%202.48333L0.57917%200.0625L0.0625%200.57917L2.48333%203L0.0625%205.42083L0.57917%205.9375L3%203.51667Z'%20fill='%231A123B'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_2511_8629'%3e%3crect%20width='6'%20height='6'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
+}
+
+.x-black-icon[data-v-f61993bb] {
+  background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Remove'%20clip-path='url(%23clip0_3453_5756)'%3e%3cpath%20id='Vector'%20d='M0.219996%2010.72C0.149851%2010.7893%200.0941591%2010.8718%200.0561487%2010.9628C0.0181382%2011.0537%20-0.00143433%2011.1514%20-0.00143433%2011.25C-0.00143433%2011.3486%200.0181382%2011.4462%200.0561487%2011.5372C0.0941591%2011.6281%200.149851%2011.7107%200.219996%2011.78C0.360622%2011.9204%200.551246%2011.9993%200.749996%2011.9993C0.948747%2011.9993%201.13937%2011.9204%201.28%2011.78L5.91%207.14997C5.92166%207.13787%205.93564%207.12825%205.9511%207.12168C5.96656%207.1151%205.98319%207.11172%206%207.11172C6.0168%207.11172%206.03343%207.1151%206.04889%207.12168C6.06436%207.12825%206.07834%207.13787%206.09%207.14997L10.72%2011.78C10.8606%2011.9204%2011.0512%2011.9993%2011.25%2011.9993C11.4487%2011.9993%2011.6394%2011.9204%2011.78%2011.78C11.8501%2011.7107%2011.9058%2011.6281%2011.9438%2011.5372C11.9819%2011.4462%2012.0014%2011.3486%2012.0014%2011.25C12.0014%2011.1514%2011.9819%2011.0537%2011.9438%2010.9628C11.9058%2010.8718%2011.8501%2010.7893%2011.78%2010.72L7.15%206.08997C7.1379%206.07831%207.12828%206.06433%207.1217%206.04886C7.11513%206.0334%207.11174%206.01677%207.11174%205.99997C7.11174%205.98317%207.11513%205.96654%207.1217%205.95107C7.12828%205.93561%207.1379%205.92163%207.15%205.90997L11.78%201.27997C11.9125%201.13779%2011.9846%200.949747%2011.9812%200.755446C11.9777%200.561145%2011.899%200.37576%2011.7616%200.238347C11.6242%200.100934%2011.4388%200.0222218%2011.2445%200.0187936C11.0502%200.0153654%2010.8622%200.0874886%2010.72%200.219969L6.09%204.84997C6.07834%204.86207%206.06436%204.87169%206.04889%204.87826C6.03343%204.88483%206.0168%204.88822%206%204.88822C5.98319%204.88822%205.96656%204.88483%205.9511%204.87826C5.93564%204.87169%205.92166%204.86207%205.91%204.84997L1.28%200.219969C1.13782%200.0874886%200.949775%200.0153654%200.755474%200.0187936C0.561173%200.0222218%200.375787%200.100934%200.238374%200.238347C0.100961%200.37576%200.0222494%200.561145%200.0188212%200.755446C0.015393%200.949747%200.0875162%201.13779%200.219996%201.27997L4.85%205.90997C4.86209%205.92163%204.87172%205.93561%204.87829%205.95107C4.88486%205.96654%204.88825%205.98317%204.88825%205.99997C4.88825%206.01677%204.88486%206.0334%204.87829%206.04886C4.87172%206.06433%204.86209%206.07831%204.85%206.08997L0.219996%2010.72Z'%20fill='%231A123B'%20/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_3453_5756'%3e%3crect%20width='12'%20height='12'%20fill='white'%20/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
+}
+.x-white-icon[data-v-f61993bb] {
+  background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Remove'%20clip-path='url(%23clip0_3453_5756)'%3e%3cpath%20id='Vector'%20d='M0.219996%2010.72C0.149851%2010.7893%200.0941591%2010.8718%200.0561487%2010.9628C0.0181382%2011.0537%20-0.00143433%2011.1514%20-0.00143433%2011.25C-0.00143433%2011.3486%200.0181382%2011.4462%200.0561487%2011.5372C0.0941591%2011.6281%200.149851%2011.7107%200.219996%2011.78C0.360622%2011.9204%200.551246%2011.9993%200.749996%2011.9993C0.948747%2011.9993%201.13937%2011.9204%201.28%2011.78L5.91%207.14997C5.92166%207.13787%205.93564%207.12825%205.9511%207.12168C5.96656%207.1151%205.98319%207.11172%206%207.11172C6.0168%207.11172%206.03343%207.1151%206.04889%207.12168C6.06436%207.12825%206.07834%207.13787%206.09%207.14997L10.72%2011.78C10.8606%2011.9204%2011.0512%2011.9993%2011.25%2011.9993C11.4487%2011.9993%2011.6394%2011.9204%2011.78%2011.78C11.8501%2011.7107%2011.9058%2011.6281%2011.9438%2011.5372C11.9819%2011.4462%2012.0014%2011.3486%2012.0014%2011.25C12.0014%2011.1514%2011.9819%2011.0537%2011.9438%2010.9628C11.9058%2010.8718%2011.8501%2010.7893%2011.78%2010.72L7.15%206.08997C7.1379%206.07831%207.12828%206.06433%207.1217%206.04886C7.11513%206.0334%207.11174%206.01677%207.11174%205.99997C7.11174%205.98317%207.11513%205.96654%207.1217%205.95107C7.12828%205.93561%207.1379%205.92163%207.15%205.90997L11.78%201.27997C11.9125%201.13779%2011.9846%200.949747%2011.9812%200.755446C11.9777%200.561145%2011.899%200.37576%2011.7616%200.238347C11.6242%200.100934%2011.4388%200.0222218%2011.2445%200.0187936C11.0502%200.0153654%2010.8622%200.0874886%2010.72%200.219969L6.09%204.84997C6.07834%204.86207%206.06436%204.87169%206.04889%204.87826C6.03343%204.88483%206.0168%204.88822%206%204.88822C5.98319%204.88822%205.96656%204.88483%205.9511%204.87826C5.93564%204.87169%205.92166%204.86207%205.91%204.84997L1.28%200.219969C1.13782%200.0874886%200.949775%200.0153654%200.755474%200.0187936C0.561173%200.0222218%200.375787%200.100934%200.238374%200.238347C0.100961%200.37576%200.0222494%200.561145%200.0188212%200.755446C0.015393%200.949747%200.0875162%201.13779%200.219996%201.27997L4.85%205.90997C4.86209%205.92163%204.87172%205.93561%204.87829%205.95107C4.88486%205.96654%204.88825%205.98317%204.88825%205.99997C4.88825%206.01677%204.88486%206.0334%204.87829%206.04886C4.87172%206.06433%204.86209%206.07831%204.85%206.08997L0.219996%2010.72Z'%20fill='%23FFFFFF'%20/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_3453_5756'%3e%3crect%20width='12'%20height='12'%20fill='white'%20/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
+}
+.drawer[data-v-f474eec2] {
+  position: fixed;
+  bottom: 0px;
+  top: 0px;
+  display: flex;
+  flex-direction: column;
+  background-color: var(--color-surface);
+  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  max-width: var(--4c0aead4);
+  width: 100%;
+}
+.drawer.drawer-left[data-v-f474eec2] {
+  left: 0px;
+}
+.drawer.drawer-right[data-v-f474eec2] {
+  right: 0px;
+}
+
+/* Slide from right animations */
+@keyframes slideInRight-f474eec2 {
+0% {
+    transform: translate3d(100%, 0, 0);
+    visibility: visible;
+}
+100% {
+    transform: translate3d(0, 0, 0);
+}
+}
+.slideInRight[data-v-f474eec2] {
+  animation-duration: var(--59cfae08);
+  animation-fill-mode: both;
+  animation-name: slideInRight-f474eec2;
+}
+@keyframes slideOutRight-f474eec2 {
+0% {
+    transform: translate3d(0, 0, 0);
+}
+100% {
+    visibility: hidden;
+    transform: translate3d(100%, 0, 0);
+}
+}
+.slideOutRight[data-v-f474eec2] {
+  animation-duration: var(--59cfae08);
+  animation-fill-mode: both;
+  animation-name: slideOutRight-f474eec2;
+}
+
+/* Slide from left animations */
+@keyframes slideInLeft-f474eec2 {
+0% {
+    transform: translate3d(-100%, 0, 0);
+    visibility: visible;
+}
+100% {
+    transform: translate3d(0, 0, 0);
+}
+}
+.slideInLeft[data-v-f474eec2] {
+  animation-duration: var(--59cfae08);
+  animation-fill-mode: both;
+  animation-name: slideInLeft-f474eec2;
+}
+@keyframes slideOutLeft-f474eec2 {
+0% {
+    transform: translate3d(0, 0, 0);
+}
+100% {
+    visibility: hidden;
+    transform: translate3d(-100%, 0, 0);
+}
+}
+.slideOutLeft[data-v-f474eec2] {
+  animation-duration: var(--59cfae08);
+  animation-fill-mode: both;
+  animation-name: slideOutLeft-f474eec2;
+}
+
+/* Backdrop */
+.fadeIn[data-v-f474eec2] {
+  animation-name: fadeInFrames-f474eec2;
+}
+.fadeOut[data-v-f474eec2] {
+  animation-name: fadeOutFrames-f474eec2;
+}
+.fadeIn[data-v-f474eec2],
+.fadeOut[data-v-f474eec2] {
+  animation-duration: 0.25s;
+  animation-fill-mode: both;
+}
+@keyframes fadeInFrames-f474eec2 {
+from {
+    opacity: 0;
+    animation-timing-function: cubic-bezier(0, 0, 1, 1);
+}
+to {
+    opacity: 1;
+}
+}
+@keyframes fadeOutFrames-f474eec2 {
+from {
+    opacity: 1;
+    animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);
+}
+to {
+    opacity: 0;
+}
 }.fadeInDown[data-v-122d5e30] {
   animation-duration: 0.4s;
   animation-fill-mode: both;
@@ -458,14 +470,6 @@ from {
 to {
     opacity: 0;
 }
-}.shimmer[data-v-53e537dc] {
-  transform: translateX(-100%);
-  animation: shimmer-53e537dc 1.4s infinite;
-}
-@keyframes shimmer-53e537dc {
-100% {
-    transform: translateX(100%);
-}
 }.resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.v-popper__popper{z-index:10000;top:0;left:0;outline:none}.v-popper__popper.v-popper__popper--hidden{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s;pointer-events:none}.v-popper__popper.v-popper__popper--shown{visibility:visible;opacity:1;transition:opacity .15s}.v-popper__popper.v-popper__popper--skip-transition,.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper{transition:none!important}.v-popper__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.v-popper__inner{position:relative;box-sizing:border-box;overflow-y:auto}.v-popper__inner>div{position:relative;z-index:1;max-width:inherit;max-height:inherit}.v-popper__arrow-container{position:absolute;width:10px;height:10px}.v-popper__popper--arrow-overflow .v-popper__arrow-container,.v-popper__popper--no-positioning .v-popper__arrow-container{display:none}.v-popper__arrow-inner,.v-popper__arrow-outer{border-style:solid;position:absolute;top:0;left:0;width:0;height:0}.v-popper__arrow-inner{visibility:hidden;border-width:7px}.v-popper__arrow-outer{border-width:6px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{left:-2px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{left:-1px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer{border-bottom-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container{top:0}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{border-top-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{top:-4px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{top:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{top:-1px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{border-left-width:0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{left:-4px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{left:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container{right:-10px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer{border-right-width:0;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner{left:-2px}.v-popper--theme-tooltip .v-popper__inner{background:rgba(0,0,0,.8);color:#fff;border-radius:6px;padding:7px 12px 6px}.v-popper--theme-tooltip .v-popper__arrow-outer{border-color:#000c}.v-popper--theme-dropdown .v-popper__inner{background:#fff;color:#000;border-radius:6px;border:1px solid #ddd;box-shadow:0 6px 30px #0000001a}.v-popper--theme-dropdown .v-popper__arrow-inner{visibility:visible;border-color:#fff}.v-popper--theme-dropdown .v-popper__arrow-outer{border-color:#ddd}/* sass-plugin-1:/Users/maronato/Developer/vue-toastification/src/scss/index.scss */.Vue-Toastification__container {
   z-index: 9999;
   position: fixed;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pequity/squirrel",
   "description": "Squirrel component library",
-  "version": "1.2.9",
+  "version": "1.2.11",
   "packageManager": "pnpm@8.9.2",
   "type": "module",
   "scripts": {
@@ -58,26 +58,26 @@
     "@popperjs/core": "2.11.8",
     "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
-    "@storybook/addon-a11y": "^8.1.8",
-    "@storybook/addon-actions": "^8.1.8",
-    "@storybook/addon-essentials": "^8.1.8",
-    "@storybook/addon-interactions": "^8.1.8",
-    "@storybook/addon-links": "^8.1.8",
-    "@storybook/blocks": "^8.1.8",
+    "@storybook/addon-a11y": "^8.1.10",
+    "@storybook/addon-actions": "^8.1.10",
+    "@storybook/addon-essentials": "^8.1.10",
+    "@storybook/addon-interactions": "^8.1.10",
+    "@storybook/addon-links": "^8.1.10",
+    "@storybook/blocks": "^8.1.10",
     "@storybook/jest": "^0.2.3",
-    "@storybook/manager-api": "^8.1.8",
-    "@storybook/test-runner": "^0.18.2",
+    "@storybook/manager-api": "^8.1.10",
+    "@storybook/test-runner": "^0.19.0",
     "@storybook/testing-library": "^0.2.2",
-    "@storybook/theming": "^8.1.8",
-    "@storybook/vue3": "^8.1.8",
-    "@storybook/vue3-vite": "^8.1.8",
-    "@tanstack/vue-virtual": "3.5.1",
+    "@storybook/theming": "^8.1.10",
+    "@storybook/vue3": "^8.1.10",
+    "@storybook/vue3-vite": "^8.1.10",
+    "@tanstack/vue-virtual": "3.7.0",
     "@types/jest": "^29.5.12",
     "@types/jsdom": "^21.1.7",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^20.14.2",
+    "@types/node": "^20.14.8",
     "@vitejs/plugin-vue": "^5.0.5",
-    "@vue/compiler-sfc": "3.4.27",
+    "@vue/compiler-sfc": "3.4.30",
     "@vue/test-utils": "^2.4.6",
     "@vue/vue3-jest": "^29.2.6",
     "autoprefixer": "^10.4.19",
@@ -86,7 +86,7 @@
     "eslint": "^8.57.0",
     "eslint-plugin-storybook": "^0.8.0",
     "floating-vue": "5.2.2",
-    "glob": "^10.4.1",
+    "glob": "^10.4.2",
     "husky": "^9.0.11",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
@@ -95,22 +95,22 @@
     "make-coverage-badge": "^1.2.0",
     "postcss": "^8.4.38",
     "prettier": "^3.3.2",
-    "prettier-plugin-tailwindcss": "^0.6.4",
+    "prettier-plugin-tailwindcss": "^0.6.5",
     "resolve-tspaths": "^0.8.19",
     "rimraf": "^5.0.7",
-    "sass": "^1.77.5",
+    "sass": "^1.77.6",
     "semantic-release": "^24.0.0",
-    "storybook": "^8.1.8",
+    "storybook": "^8.1.10",
     "svgo": "^3.3.2",
     "tailwindcss": "^3.4.4",
-    "ts-jest": "^29.1.4",
+    "ts-jest": "^29.1.5",
     "typescript": "5.4.5",
     "v-calendar": "3.1.2",
-    "vite": "^5.2.13",
-    "vue": "3.4.27",
+    "vite": "^5.3.1",
+    "vue": "3.4.30",
     "vue-currency-input": "3.1.0",
-    "vue-router": "4.3.3",
+    "vue-router": "4.4.0",
     "vue-toastification": "2.0.0-rc.5",
-    "vue-tsc": "2.0.21"
+    "vue-tsc": "2.0.22"
   }
 }

package/squirrel/components/p-btn/p-btn.spec.js

@@ -16,23 +16,16 @@ describe('PBtn.vue', () => {
       ['secondary', ['bg-p-gray-20', 'hover:bg-p-gray-30', 'active:bg-p-gray-40']],
       [
         'primary-outline',
-        [
-          'text-p-purple-60',
-          'bg-p-blue-10',
-          'border',
-          'border-p-purple-60',
-          'hover:bg-p-gray-20',
-          'focus:ring-1',
-          'focus:ring-p-purple-60',
-        ],
+        ['text-p-purple-60', 'bg-p-blue-10', 'ring-1', 'ring-inset', 'ring-p-purple-60', 'hover:bg-p-gray-20'],
       ],
       [
         'secondary-outline',
         [
           'text-p-purple-60',
           'bg-surface',
-          'border',
-          'border-p-gray-30',
+          'ring-1',
+          'ring-inset',
+          'ring-p-gray-30',
           'hover:bg-p-blue-10',
           'aria-selected:bg-p-blue-10',
         ],
@@ -42,8 +35,9 @@ describe('PBtn.vue', () => {
         [
           'text-p-purple-60',
           'bg-surface',
-          'border',
-          'border-p-gray-30',
+          'ring-1',
+          'ring-inset',
+          'ring-p-gray-30',
           'hover:bg-p-blue-10',
           'aria-selected:bg-p-blue-15',
           'aria-selected:text-p-blue-60',

package/squirrel/components/p-btn/p-btn.vue

@@ -58,12 +58,11 @@ type ButtonClass = {
 const BUTTON_CLASSES: ButtonClass = {
   [BUTTON_TYPES.PRIMARY]: 'text-surface bg-primary hover:bg-accent active:bg-p-blue-80',
   [BUTTON_TYPES.SECONDARY]: 'bg-p-gray-20 hover:bg-p-gray-30 active:bg-p-gray-40',
-  [BUTTON_TYPES.PRIMARY_OUTLINE]:
-    'text-p-purple-60 bg-p-blue-10 border border-p-purple-60 hover:bg-p-gray-20 focus:ring-1 focus:ring-p-purple-60',
+  [BUTTON_TYPES.PRIMARY_OUTLINE]: 'text-p-purple-60 bg-p-blue-10 ring-1 ring-inset ring-p-purple-60 hover:bg-p-gray-20',
   [BUTTON_TYPES.SECONDARY_OUTLINE]:
-    'text-p-purple-60 bg-surface border border-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-10',
+    'text-p-purple-60 bg-surface ring-1 ring-inset ring-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-10',
   [BUTTON_TYPES.SECONDARY_OUTLINE_BLUE]:
-    'text-p-purple-60 bg-surface border border-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-15 aria-selected:text-p-blue-60',
+    'text-p-purple-60 bg-surface ring-1 ring-inset ring-p-gray-30 hover:bg-p-blue-10 aria-selected:bg-p-blue-15 aria-selected:text-p-blue-60',
   [BUTTON_TYPES.ERROR]: 'text-white bg-p-red-40 hover:bg-p-red-50',
   [BUTTON_TYPES.SUCCESS]: 'text-white bg-p-green-40 hover:bg-p-green-50',
   [BUTTON_TYPES.PRIMARY_LINK]: 'text-primary bg-transparent hover:text-accent underline',

package/squirrel/components/p-checkbox/p-checkbox.spec.js

@@ -1,6 +1,22 @@
 import PCheckbox from '@squirrel/components/p-checkbox/p-checkbox.vue';
 import { createWrapperFor } from '@tests/jest.helpers';
 
+const checkboxClasses = [
+  'h-4',
+  'w-4',
+  'shrink-0',
+  'appearance-none',
+  'rounded',
+  'border',
+  'border-p-gray-30',
+  'bg-surface',
+  'duration-100',
+  'ease-in-out',
+  'checked:border-none',
+  'checked:bg-primary',
+  'disabled:opacity-50',
+];
+
 describe('PCheckbox.vue', () => {
   it('renders correctly', async () => {
     const wrapper = createWrapperFor(PCheckbox);
@@ -9,7 +25,7 @@ describe('PCheckbox.vue', () => {
 
     expect(input.exists()).toBe(true);
     expect(input.attributes().type).toBe('checkbox');
-    expect(input.classes()).toEqual(['cursor-pointer', 'accent-p-blue-50']);
+    expect(input.classes()).toEqual(checkboxClasses);
     expect(input.attributes().disabled).toBeUndefined();
   });
 
@@ -20,7 +36,7 @@ describe('PCheckbox.vue', () => {
 
     expect(input.exists()).toBe(true);
     expect(input.attributes().type).toBe('checkbox');
-    expect(input.classes()).toEqual(['cursor-pointer', 'accent-p-blue-50']);
+    expect(input.classes()).toEqual(checkboxClasses);
     expect(input.attributes().disabled).toBeDefined();
   });
 });

package/squirrel/components/p-checkbox/p-checkbox.stories.js

@@ -8,7 +8,7 @@ export default {
   parameters: {
     docs: {
       description: {
-        component: 'Checkbox Component',
+        component: 'Checkboxes allow the user to select multiple options from a set.',
       },
     },
   },
@@ -25,7 +25,39 @@ export const Default = {
     template: `<PCheckbox v-bind="args" @click="onClick" />`,
   }),
   args: {
-    checked: false,
+    modelValue: false,
     disabled: false,
   },
 };
+
+export const WithLabel = {
+  args: {
+    ...Default.args,
+    label: 'Checkbox label',
+  },
+};
+
+export const WithLabelBefore = {
+  render: (args) => {
+    const { default: defaultSlot, labelBefore, ...argsWithoutSlots } = args;
+
+    return {
+      components: { PCheckbox },
+      setup() {
+        return { argsWithoutSlots };
+      },
+      template: `
+        <PCheckbox v-bind="argsWithoutSlots">
+          <template #label-before>
+            <div class="text-sm mr-2">${args.labelBefore}</div>
+          </template>
+        </PCheckbox>
+      `,
+    };
+  },
+  args: {
+    modelValue: false,
+    disabled: false,
+    labelBefore: 'Test label',
+  },
+};

package/squirrel/components/p-checkbox/p-checkbox.vue

@@ -1,13 +1,27 @@
 <template>
-  <input
-    type="checkbox"
-    class="cursor-pointer accent-p-blue-50"
-    :checked="modelValue"
-    @change="$emit('update:modelValue', ($event.target as HTMLInputElement).checked)"
-  />
+  <label class="inline-flex items-center">
+    <slot name="label-before"></slot>
+    <input
+      type="checkbox"
+      class="h-4 w-4 shrink-0 appearance-none rounded border border-p-gray-30 bg-surface duration-100 ease-in-out checked:border-none checked:bg-primary disabled:opacity-50"
+      :checked="modelValue"
+      v-bind="$attrs"
+      @change="$emit('update:modelValue', ($event.target as HTMLInputElement).checked)"
+    />
+    <slot name="label">
+      <div v-if="label" class="ml-2 text-sm">
+        {{ label }}
+      </div>
+    </slot>
+  </label>
 </template>
 
 <script setup lang="ts">
+defineOptions({
+  name: 'PCheckbox',
+  inheritAttrs: false,
+});
+
 defineEmits(['update:modelValue']);
 
 defineProps({
@@ -15,5 +29,15 @@ defineProps({
     type: Boolean,
     default: false,
   },
+  label: {
+    type: String,
+    default: '',
+  },
 });
 </script>
+
+<style lang="css" scoped>
+input[type='checkbox']:checked {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3E%3C/svg%3E");
+}
+</style>

package/dist/cjs/chunks/p-checkbox.js

@@ -1,24 +0,0 @@
-"use strict";
-const vue = require("vue");
-const _hoisted_1 = ["checked"];
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  __name: "p-checkbox",
-  props: {
-    modelValue: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ["update:modelValue"],
-  setup(__props) {
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("input", {
-        type: "checkbox",
-        class: "cursor-pointer accent-p-blue-50",
-        checked: __props.modelValue,
-        onChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", $event.target.checked))
-      }, null, 40, _hoisted_1);
-    };
-  }
-});
-exports._sfc_main = _sfc_main;

package/dist/es/chunks/p-checkbox.js

@@ -1,25 +0,0 @@
-import { defineComponent, openBlock, createElementBlock } from "vue";
-const _hoisted_1 = ["checked"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "p-checkbox",
-  props: {
-    modelValue: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ["update:modelValue"],
-  setup(__props) {
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("input", {
-        type: "checkbox",
-        class: "cursor-pointer accent-p-blue-50",
-        checked: __props.modelValue,
-        onChange: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", $event.target.checked))
-      }, null, 40, _hoisted_1);
-    };
-  }
-});
-export {
-  _sfc_main as _
-};