yuyeon 0.0.9 → 0.0.10

package/lib/components/button/YButton.scss

@@ -36,10 +36,9 @@ $button-disabled-background: #d3d3d3 !default;
     opacity: 0.06;
   }
 
-  &:not(&--disabled):not(&--outlined):not(&--loading):not(&--filled):not(
-      &--text
-    ):not(&--icon) {
+  & {
     box-shadow: 1px 1px 4px 1px rgba(0, 0, 0, 0.14);
+
     &:active {
       box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.24);
     }
@@ -50,11 +49,16 @@ $button-disabled-background: #d3d3d3 !default;
     color: #ffffff;
   }
 
-  &:not(&--outlined):disabled,
-  &--disabled:not(&--outlined) {
+  &--text {
+    box-shadow: none;
+  }
+
+  &:disabled,
+  &--disabled {
     background-color: $button-disabled-background;
     opacity: 0.4;
     cursor: default;
+    box-shadow: none;
   }
 
   &--rounded {
@@ -62,10 +66,11 @@ $button-disabled-background: #d3d3d3 !default;
   }
 
   &--outlined {
-    color: rgba(var(--y-button__color), 1);
+    //color: rgba(var(--y-button__color), 1);
     border-width: 1px;
     border-style: solid;
     border-color: currentColor;
+    box-shadow: none;
   }
 
   &--color:not(&--filled) {
@@ -74,6 +79,8 @@ $button-disabled-background: #d3d3d3 !default;
 
   &--loading {
     cursor: wait;
+    box-shadow: none;
+
     .y-spinner-ring {
       margin-right: 0.4em;
     }

package/lib/components/icons/YIconCheckbox.mjs

@@ -5,13 +5,15 @@ export const YIconCheckbox = defineComponent({
   name: 'YIconCheckbox',
   props: {
     checked: Boolean,
-    immediate: Boolean
+    indeterminate: Boolean,
+    disabled: Boolean
   },
   render() {
     return _createVNode("svg", {
       "class": ['y-icon-checkbox', {
         'y-icon-checkbox--checked': this.checked,
-        'y-icon-checkbox--immediate': this.immediate
+        'y-icon-checkbox--indeterminate': this.indeterminate,
+        'y-icon-checkbox--disabled': this.disabled
       }],
       "xmlns": "http://www.w3.org/2000/svg",
       "width": "24",
@@ -23,7 +25,7 @@ export const YIconCheckbox = defineComponent({
     }, null), _createVNode("path", {
       "class": "y-icon-checkbox__checkmark-path",
       "fill": "none",
-      "d": "M5.73,11.91 11.1,16.28 17.79,7.59"
+      "d": this.indeterminate ? 'M5.73,11.91 11.1,11.91 17.79,11.91' : 'M5.73,11.91 11.1,16.28 17.79,7.59'
     }, null)]);
   }
 });

package/lib/components/icons/YIconCheckbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YIconCheckbox.mjs","names":["defineComponent","YIconCheckbox","name","props","checked","Boolean","immediate","render","_createVNode"],"sources":["../../../src/components/icons/YIconCheckbox.tsx"],"sourcesContent":["import { defineComponent } from 'vue';\n\nimport './YIconCheckbox.scss';\n\nexport const YIconCheckbox = defineComponent({\n  name: 'YIconCheckbox',\n  props: {\n    checked: Boolean,\n    immediate: Boolean,\n  },\n  render() {\n    return (\n      <svg\n        class={[\n          'y-icon-checkbox',\n          {\n            'y-icon-checkbox--checked': this.checked,\n            'y-icon-checkbox--immediate': this.immediate,\n          },\n        ]}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n      >\n        <path\n          class=\"y-icon-checkbox__border-path\"\n          d=\"M 15.525 21.825 H 8.325 C 4.851 21.825 2.025 18.999 2.025 15.525 V 8.325 C 2.025 4.851 4.851 2.025 8.325 2.025 H 15.525 C 18.999 2.025 21.825 4.851 21.825 8.325 V 15.525 C 21.825 18.999 18.999 21.825 15.525 21.825 Z\"\n        />\n        <path\n          class=\"y-icon-checkbox__checkmark-path\"\n          fill=\"none\"\n          d=\"M5.73,11.91 11.1,16.28 17.79,7.59\"\n        ></path>\n      </svg>\n    );\n  },\n});\n"],"mappings":";AAAA,SAASA,eAAe,QAAQ,KAAK;AAErC;AAEA,OAAO,MAAMC,aAAa,GAAGD,eAAe,CAAC;EAC3CE,IAAI,EAAE,eAAe;EACrBC,KAAK,EAAE;IACLC,OAAO,EAAEC,OAAO;IAChBC,SAAS,EAAED;EACb,CAAC;EACDE,MAAMA,CAAA,EAAG;IACP,OAAAC,YAAA;MAAA,SAEW,CACL,iBAAiB,EACjB;QACE,0BAA0B,EAAE,IAAI,CAACJ,OAAO;QACxC,4BAA4B,EAAE,IAAI,CAACE;MACrC,CAAC,CACF;MAAA,SACK,4BAA4B;MAAA,SAC5B,IAAI;MAAA,UACH,IAAI;MAAA,WACH;IAAW,IAAAE,YAAA;MAAA,SAGX,8BAA8B;MAAA,KAClC;IAAyN,UAAAA,YAAA;MAAA,SAGrN,iCAAiC;MAAA,QAClC,MAAM;MAAA,KACT;IAAmC;EAI7C;AACF,CAAC,CAAC"}
+{"version":3,"file":"YIconCheckbox.mjs","names":["defineComponent","YIconCheckbox","name","props","checked","Boolean","indeterminate","disabled","render","_createVNode"],"sources":["../../../src/components/icons/YIconCheckbox.tsx"],"sourcesContent":["import { defineComponent } from 'vue';\n\nimport './YIconCheckbox.scss';\n\nexport const YIconCheckbox = defineComponent({\n  name: 'YIconCheckbox',\n  props: {\n    checked: Boolean,\n    indeterminate: Boolean,\n    disabled: Boolean,\n  },\n  render() {\n    return (\n      <svg\n        class={[\n          'y-icon-checkbox',\n          {\n            'y-icon-checkbox--checked': this.checked,\n            'y-icon-checkbox--indeterminate': this.indeterminate,\n            'y-icon-checkbox--disabled': this.disabled,\n          },\n        ]}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n      >\n        <path\n          class=\"y-icon-checkbox__border-path\"\n          d=\"M 15.525 21.825 H 8.325 C 4.851 21.825 2.025 18.999 2.025 15.525 V 8.325 C 2.025 4.851 4.851 2.025 8.325 2.025 H 15.525 C 18.999 2.025 21.825 4.851 21.825 8.325 V 15.525 C 21.825 18.999 18.999 21.825 15.525 21.825 Z\"\n        />\n        <path\n          class=\"y-icon-checkbox__checkmark-path\"\n          fill=\"none\"\n          d={\n            this.indeterminate\n              ? 'M5.73,11.91 11.1,11.91 17.79,11.91'\n              : 'M5.73,11.91 11.1,16.28 17.79,7.59'\n          }\n        ></path>\n      </svg>\n    );\n  },\n});\n"],"mappings":";AAAA,SAASA,eAAe,QAAQ,KAAK;AAErC;AAEA,OAAO,MAAMC,aAAa,GAAGD,eAAe,CAAC;EAC3CE,IAAI,EAAE,eAAe;EACrBC,KAAK,EAAE;IACLC,OAAO,EAAEC,OAAO;IAChBC,aAAa,EAAED,OAAO;IACtBE,QAAQ,EAAEF;EACZ,CAAC;EACDG,MAAMA,CAAA,EAAG;IACP,OAAAC,YAAA;MAAA,SAEW,CACL,iBAAiB,EACjB;QACE,0BAA0B,EAAE,IAAI,CAACL,OAAO;QACxC,gCAAgC,EAAE,IAAI,CAACE,aAAa;QACpD,2BAA2B,EAAE,IAAI,CAACC;MACpC,CAAC,CACF;MAAA,SACK,4BAA4B;MAAA,SAC5B,IAAI;MAAA,UACH,IAAI;MAAA,WACH;IAAW,IAAAE,YAAA;MAAA,SAGX,8BAA8B;MAAA,KAClC;IAAyN,UAAAA,YAAA;MAAA,SAGrN,iCAAiC;MAAA,QAClC,MAAM;MAAA,KAET,IAAI,CAACH,aAAa,GACd,oCAAoC,GACpC;IAAmC;EAKjD;AACF,CAAC,CAAC"}

package/lib/components/icons/YIconCheckbox.scss

@@ -21,6 +21,7 @@
 
   &--checked & {
     &__checkmark-path {
+      d: path('M5.73,11.91 11.1,16.28 17.79,7.59');
       stroke-dashoffset: 0;
       transition: stroke-dashoffset 120ms 140ms cubic-bezier(0.4, 0, 0.6, 1);
     }
@@ -31,4 +32,29 @@
       transition: fill 200ms ease-in;
     }
   }
+
+  &--indeterminate & {
+    &__checkmark-path {
+      d: path('M5.73,11.91 11.1,11.91 17.79,11.91');
+      stroke: #ffffff;
+      stroke-width: 2;
+      stroke-dashoffset: 0;
+      transition: 0.2s cubic-bezier(0.56, 0.14, 0.49, 0.88);
+    }
+
+    &__border-path {
+      fill: rgb(var(--y-icon-checkbox__color));
+      stroke: rgba(var(--y-icon-checkbox__color), 0.8);
+      transition: fill 200ms ease-in;
+    }
+  }
+
+  &--disabled {
+    opacity: 0.4;
+    filter: grayscale(0.4);
+  }
+
+  &--disabled &__checkmark-path {
+    fill: rgba(var(--y-icon-checkbox__color), 0.1);
+  }
 }

package/lib/components/icons/YIconSort.mjs

@@ -0,0 +1,45 @@
+import { createVNode as _createVNode } from "vue";
+import { defineComponent } from 'vue';
+import "./YIconSort.scss";
+export const YIconSort = defineComponent({
+  name: 'YIconSort',
+  props: {
+    direction: {
+      type: String
+    },
+    disabled: {
+      type: Boolean
+    }
+  },
+  render() {
+    return _createVNode("svg", {
+      "version": "1.1",
+      "width": "16",
+      "height": "16",
+      "viewBox": "0 0 32 32",
+      "xmlns": "http://www.w3.org/2000/svg",
+      "class": ['y-icon-sort', {
+        'y-icon-sort--disabled': this.disabled,
+        'y-icon-sort--asc': this.direction === 'asc',
+        'y-icon-sort--desc': this.direction === 'desc'
+      }]
+    }, [_createVNode("path", {
+      "d": "m8.4146 12.52 7.5489-7.6399 7.622 7.4693",
+      "fill": "none",
+      "stroke": "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "3",
+      "class": "y-icon-sort__asc"
+    }, null), _createVNode("path", {
+      "d": "m8.4146 19.48 7.5489 7.6399 7.622-7.4693",
+      "fill": "none",
+      "stroke": "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "3",
+      "class": "y-icon-sort__desc"
+    }, null)]);
+  }
+});
+//# sourceMappingURL=YIconSort.mjs.map

package/lib/components/icons/YIconSort.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"YIconSort.mjs","names":["defineComponent","YIconSort","name","props","direction","type","String","disabled","Boolean","render","_createVNode"],"sources":["../../../src/components/icons/YIconSort.tsx"],"sourcesContent":["import { PropType, defineComponent } from 'vue';\n\nimport './YIconSort.scss';\n\nexport const YIconSort = defineComponent({\n  name: 'YIconSort',\n  props: {\n    direction: {\n      type: String as PropType<'asc' | 'desc'>,\n    },\n    disabled: {\n      type: Boolean,\n    },\n  },\n  render() {\n    return (\n      <svg\n        version=\"1.1\"\n        width=\"16\"\n        height=\"16\"\n        viewBox=\"0 0 32 32\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        class={[\n          'y-icon-sort',\n          {\n            'y-icon-sort--disabled': this.disabled,\n            'y-icon-sort--asc': this.direction === 'asc',\n            'y-icon-sort--desc': this.direction === 'desc',\n          },\n        ]}\n      >\n        <path\n          d=\"m8.4146 12.52 7.5489-7.6399 7.622 7.4693\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          stroke-width=\"3\"\n          class=\"y-icon-sort__asc\"\n        />\n        <path\n          d=\"m8.4146 19.48 7.5489 7.6399 7.622-7.4693\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          stroke-width=\"3\"\n          class=\"y-icon-sort__desc\"\n        />\n      </svg>\n    );\n  },\n});\n"],"mappings":";AAAA,SAAmBA,eAAe,QAAQ,KAAK;AAE/C;AAEA,OAAO,MAAMC,SAAS,GAAGD,eAAe,CAAC;EACvCE,IAAI,EAAE,WAAW;EACjBC,KAAK,EAAE;IACLC,SAAS,EAAE;MACTC,IAAI,EAAEC;IACR,CAAC;IACDC,QAAQ,EAAE;MACRF,IAAI,EAAEG;IACR;EACF,CAAC;EACDC,MAAMA,CAAA,EAAG;IACP,OAAAC,YAAA;MAAA,WAEY,KAAK;MAAA,SACP,IAAI;MAAA,UACH,IAAI;MAAA,WACH,WAAW;MAAA,SACb,4BAA4B;MAAA,SAC3B,CACL,aAAa,EACb;QACE,uBAAuB,EAAE,IAAI,CAACH,QAAQ;QACtC,kBAAkB,EAAE,IAAI,CAACH,SAAS,KAAK,KAAK;QAC5C,mBAAmB,EAAE,IAAI,CAACA,SAAS,KAAK;MAC1C,CAAC;IACF,IAAAM,YAAA;MAAA,KAGG,0CAA0C;MAAA,QACvC,MAAM;MAAA,UACJ,cAAc;MAAA,kBACN,OAAO;MAAA,mBACN,OAAO;MAAA,gBACV,GAAG;MAAA,SACV;IAAkB,UAAAA,YAAA;MAAA,KAGtB,0CAA0C;MAAA,QACvC,MAAM;MAAA,UACJ,cAAc;MAAA,kBACN,OAAO;MAAA,mBACN,OAAO;MAAA,gBACV,GAAG;MAAA,SACV;IAAmB;EAIjC;AACF,CAAC,CAAC"}

package/lib/components/icons/YIconSort.scss

@@ -0,0 +1,23 @@
+.y-icon-sort {
+  &__asc, &__desc {
+    opacity: 0.24;
+  }
+
+  &--asc & {
+    &__desc {
+      opacity: 0.1;
+    }
+    &__asc {
+      opacity: 0.8;
+    }
+  }
+
+  &--desc & {
+    &__asc {
+      opacity: 0.1;
+    }
+    &__desc {
+      opacity: 0.8;
+    }
+  }
+}

package/lib/components/pagination/YPagination.mjs

@@ -32,7 +32,8 @@ export const pressYPaginationProps = propsFactory({
     default: 4
   },
   color: String,
-  activeColor: String
+  activeColor: String,
+  buttonVariations: [String]
   // firstIcon: [String],
   // lastIcon: [String],
   // prevIcon: [String],
@@ -90,6 +91,7 @@ export const YPagination = defineComponent({
       return {
         first: {
           disabled: prevDisabled,
+          variation: props.buttonVariations,
           onClick: e => {
             e.preventDefault();
             page.value = 1;
@@ -98,6 +100,7 @@ export const YPagination = defineComponent({
         },
         prev: {
           disabled: prevDisabled,
+          variation: props.buttonVariations,
           onClick: e => {
             e.preventDefault();
             const to = Math.max(1, page.value - 1);
@@ -107,6 +110,7 @@ export const YPagination = defineComponent({
         },
         next: {
           disabled: nextDisabled,
+          variation: props.buttonVariations,
           onClick: e => {
             e.preventDefault();
             const to = Math.min(+length.value, page.value + 1);
@@ -116,6 +120,7 @@ export const YPagination = defineComponent({
         },
         last: {
           disabled: nextDisabled,
+          variation: props.buttonVariations,
           onClick: e => {
             e.preventDefault();
             const to = +length.value;
@@ -182,6 +187,7 @@ export const YPagination = defineComponent({
               ellipsis: false,
               disabled: !!props.disabled || +props.length < 2,
               color: active ? props.activeColor : props.color,
+              variation: props.buttonVariations,
               onClick: e => changePage(e, item)
             }
           };

package/lib/components/pagination/YPagination.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YPagination.mjs","names":["computed","defineComponent","shallowRef","useModelDuplex","useRender","useRefs","useResizeObserver","getRangeArr","toStyleSizeValue","propsFactory","YButton","YIconPageControl","pressYPaginationProps","start","type","Number","String","default","modelValue","props","disabled","Boolean","length","validator","val","totalVisible","showEndButton","gap","color","activeColor","YPagination","name","components","emits","value","change","control","setup","_ref","slots","emit","page","parseInt","itemCount","resizeObservedRef","entries","target","contentRect","firstItem","querySelector","listWidth","width","itemWidth","offsetWidth","parseFloat","getComputedStyle","marginRight","calcItemCount","fixedCount","fixedWidth","Math","max","floor","toFixed","innerWidth","controls","prevDisabled","nextDisabled","first","onClick","e","preventDefault","prev","to","next","min","last","range","isNaN","MAX_SAFE_INTEGER","even","middle","left","right","rangeLength","rangeStart","ceil","refs","updateRef","changePage","event","arguments","undefined","items","map","item","index","ref","active","key","ellipsis","styles","_createVNode"],"sources":["../../../src/components/pagination/YPagination.tsx"],"sourcesContent":["import {\n  ComponentPublicInstance,\n  computed,\n  defineComponent,\n  shallowRef,\n} from 'vue';\n\nimport { useModelDuplex } from '../../composables/communication';\nimport { useRender } from '../../composables/component';\nimport { useRefs } from '../../composables/ref';\nimport { useResizeObserver } from '../../composables/resize-observer';\nimport { getRangeArr } from '../../util/common';\nimport { toStyleSizeValue } from '../../util/ui';\nimport { propsFactory } from '../../util/vue-component';\nimport { YButton } from '../button';\nimport { YIconPageControl } from '../icons/YIconPageControl';\n\nimport './YPagination.scss';\n\nexport const pressYPaginationProps = propsFactory(\n  {\n    start: {\n      type: [Number, String],\n      default: 1,\n    },\n    modelValue: {\n      type: Number,\n      default: (props: any) => props.start as number,\n    },\n    disabled: Boolean,\n    length: {\n      type: [Number, String],\n      default: 1,\n      validator: (val: number) => val % 1 === 0,\n    },\n    totalVisible: [Number, String],\n    showEndButton: Boolean,\n    gap: {\n      type: [String, Number],\n      default: 4,\n    },\n    color: String,\n    activeColor: String,\n    // firstIcon: [String],\n    // lastIcon: [String],\n    // prevIcon: [String],\n    // nextIcon: [String],\n  },\n  'y-pagination',\n);\n\nexport const YPagination = defineComponent({\n  name: 'YPagination',\n  components: {\n    YButton,\n  },\n  props: {\n    ...pressYPaginationProps(),\n  },\n  emits: {\n    'update:modelValue': (value: number) => true,\n    change: (value: number, control?: string) => true,\n  },\n  setup(props, { slots, emit }) {\n    const page = useModelDuplex(props);\n\n    const length = computed(() => parseInt(props.length as string, 10));\n    const start = computed(() => parseInt(props.start as string, 10));\n\n    const itemCount = shallowRef(-1);\n\n    const { resizeObservedRef } = useResizeObserver((entries) => {\n      if (1 > entries.length) return;\n      const { target, contentRect } = entries[0];\n\n      const firstItem = target.querySelector(\n        '.y-pagination__list > *',\n      ) as HTMLElement;\n      if (firstItem) {\n        const listWidth = contentRect.width;\n        const itemWidth =\n          firstItem.offsetWidth +\n          parseFloat(getComputedStyle(firstItem).marginRight) * 2;\n        itemCount.value = calcItemCount(listWidth, itemWidth);\n      }\n    });\n\n    function calcItemCount(listWidth: number, itemWidth: number) {\n      const fixedCount = props.showEndButton ? 5 : 3;\n      const fixedWidth = itemWidth * fixedCount;\n      const gap = +(props.gap ?? 4);\n      return Math.max(\n        0,\n        Math.floor(\n          +((listWidth - fixedWidth - gap) / (itemWidth + gap)).toFixed(2),\n        ),\n      );\n    }\n\n    const totalVisible = computed(() => {\n      if (props.totalVisible) return parseInt(props.totalVisible as string, 10);\n      else if (itemCount.value >= 0) return itemCount.value;\n      return calcItemCount(innerWidth, 58);\n    });\n\n    const controls = computed(() => {\n      const prevDisabled = !!props.disabled || page.value <= start.value;\n      const nextDisabled =\n        !!props.disabled || page.value >= start.value + length.value - 1;\n      return {\n        first: {\n          disabled: prevDisabled,\n          onClick: (e: MouseEvent) => {\n            e.preventDefault();\n            page.value = 1;\n            emit('change', 1, 'first');\n          },\n        },\n        prev: {\n          disabled: prevDisabled,\n          onClick: (e: MouseEvent) => {\n            e.preventDefault();\n            const to = Math.max(1, page.value - 1);\n            page.value = to;\n            emit('change', to, 'prev');\n          },\n        },\n        next: {\n          disabled: nextDisabled,\n          onClick: (e: MouseEvent) => {\n            e.preventDefault();\n            const to = Math.min(+length.value, page.value + 1);\n            page.value = to;\n            emit('change', to, 'next');\n          },\n        },\n        last: {\n          disabled: nextDisabled,\n          onClick: (e: MouseEvent) => {\n            e.preventDefault();\n            const to = +length.value;\n            page.value = +length.value;\n            emit('change', to, 'last');\n          },\n        },\n      };\n    });\n\n    const range = computed(() => {\n      if (\n        length.value <= 0 ||\n        isNaN(length.value) ||\n        length.value > Number.MAX_SAFE_INTEGER\n      )\n        return [];\n      if (totalVisible.value <= 1) return [page.value];\n      if (length.value <= totalVisible.value) {\n        return getRangeArr(length.value, start.value);\n      }\n      const even = totalVisible.value % 2 === 0;\n      const middle = even\n        ? totalVisible.value / 2\n        : Math.floor(totalVisible.value / 2);\n      const left = even ? middle : middle + 1;\n      const right = length.value - middle;\n\n      if (left - page.value >= 0) {\n        return [\n          ...getRangeArr(Math.max(1, totalVisible.value - 1), start.value),\n          'ellipsis',\n          length.value,\n        ];\n      } else if (page.value - right >= (even ? 1 : 0)) {\n        const rangeLength = totalVisible.value - 1;\n        const rangeStart = length.value - rangeLength + start.value;\n        return [\n          start.value,\n          'ellipsis',\n          ...getRangeArr(rangeLength, rangeStart),\n        ];\n      } else {\n        const rangeLength = Math.max(1, totalVisible.value - 3);\n        const rangeStart =\n          rangeLength === 1\n            ? page.value\n            : page.value - Math.ceil(rangeLength / 2) + start.value;\n        return [\n          start.value,\n          'ellipsis',\n          ...getRangeArr(rangeLength, rangeStart),\n          'ellipsis',\n          length.value,\n        ];\n      }\n    });\n\n    const { refs, updateRef } = useRefs<ComponentPublicInstance>();\n\n    function changePage(event: Event, to = 1) {\n      event.preventDefault();\n      page.value = to;\n      emit('change', to);\n    }\n\n    const items = computed(() => {\n      return range.value.map((item, index) => {\n        const ref = (e: any) => updateRef(e, index);\n\n        if (item === 'ellipsis') {\n          return {\n            active: false,\n            key: `ellipsis-${index}`,\n            page: item,\n            props: {\n              ref,\n              ellipsis: true,\n              disabled: true, // TODO: skipper\n            },\n          };\n        } else {\n          const active = item === page.value;\n          return {\n            active,\n            key: `item-${item}`,\n            page: item,\n            props: {\n              ref,\n              ellipsis: false,\n              disabled: !!props.disabled || +props.length < 2,\n              color: active ? props.activeColor : props.color,\n              onClick: (e: MouseEvent) => changePage(e, item),\n            },\n          };\n        }\n      });\n    });\n\n    const styles = computed(() => {\n      let gap = undefined;\n      if (props.gap) {\n        const value = +props.gap;\n        if (!isNaN(value)) {\n          gap = toStyleSizeValue(value);\n        } else if (typeof props.gap === 'string') {\n          gap = props.gap;\n        }\n      }\n      return {\n        '--y-pagination__gap': gap,\n      };\n    });\n\n    useRender(() => {\n      return (\n        <div\n          class={['y-pagination']}\n          role={'navigation'}\n          style={styles.value}\n          ref={resizeObservedRef}\n        >\n          <ul class={['y-pagination__list']}>\n            {props.showEndButton && (\n              <li key=\"first\" class=\"y-pagination__first\">\n                {slots.first ? (\n                  slots.first(controls.value.first)\n                ) : (\n                  <YButton {...controls.value.first}>\n                    {slots['first-icon'] ? (\n                      slots['first-icon']()\n                    ) : (\n                      <YIconPageControl type={'first'}></YIconPageControl>\n                    )}\n                  </YButton>\n                )}\n              </li>\n            )}\n            <li key=\"prev\" class=\"y-pagination__prev\">\n              {slots.prev ? (\n                slots.prev(controls.value.prev)\n              ) : (\n                <YButton {...controls.value.prev}>\n                  {slots['prev-icon'] ? (\n                    slots['prev-icon']()\n                  ) : (\n                    <YIconPageControl type={'prev'}></YIconPageControl>\n                  )}\n                </YButton>\n              )}\n            </li>\n            {items.value.map((item, index) => {\n              return (\n                <li\n                  key={item.key}\n                  class={[\n                    'y-pagination__item',\n                    { 'y-pagination__item--active': item.active },\n                  ]}\n                >\n                  <YButton {...item.props}>\n                    {item.props.ellipsis\n                      ? slots.ellipsis\n                        ? slots.ellipsis()\n                        : '...'\n                      : item.page}\n                  </YButton>\n                </li>\n              );\n            })}\n            <li key=\"next\" class=\"y-pagination__next\">\n              {slots.next ? (\n                slots.next(controls.value.next)\n              ) : (\n                <YButton {...controls.value.next}>\n                  {slots['next-icon'] ? (\n                    slots['next-icon']()\n                  ) : (\n                    <YIconPageControl type={'next'}></YIconPageControl>\n                  )}\n                </YButton>\n              )}\n            </li>\n            {props.showEndButton && (\n              <li key=\"last\" class=\"y-pagination__last\">\n                {slots.last ? (\n                  slots.last(controls.value.last)\n                ) : (\n                  <YButton {...controls.value.last}>\n                    {slots['last-icon'] ? (\n                      slots['last-icon']()\n                    ) : (\n                      <YIconPageControl type={'last'}></YIconPageControl>\n                    )}\n                  </YButton>\n                )}\n              </li>\n            )}\n          </ul>\n        </div>\n      );\n    });\n\n    return {\n      itemCount,\n      page,\n      refs,\n    };\n  },\n});\n"],"mappings":"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"}
+{"version":3,"file":"YPagination.mjs","names":["computed","defineComponent","shallowRef","useModelDuplex","useRender","useRefs","useResizeObserver","getRangeArr","toStyleSizeValue","propsFactory","YButton","YIconPageControl","pressYPaginationProps","start","type","Number","String","default","modelValue","props","disabled","Boolean","length","validator","val","totalVisible","showEndButton","gap","color","activeColor","buttonVariations","YPagination","name","components","emits","value","change","control","setup","_ref","slots","emit","page","parseInt","itemCount","resizeObservedRef","entries","target","contentRect","firstItem","querySelector","listWidth","width","itemWidth","offsetWidth","parseFloat","getComputedStyle","marginRight","calcItemCount","fixedCount","fixedWidth","Math","max","floor","toFixed","innerWidth","controls","prevDisabled","nextDisabled","first","variation","onClick","e","preventDefault","prev","to","next","min","last","range","isNaN","MAX_SAFE_INTEGER","even","middle","left","right","rangeLength","rangeStart","ceil","refs","updateRef","changePage","event","arguments","undefined","items","map","item","index","ref","active","key","ellipsis","styles","_createVNode"],"sources":["../../../src/components/pagination/YPagination.tsx"],"sourcesContent":["import {\n  ComponentPublicInstance,\n  computed,\n  defineComponent,\n  shallowRef,\n} from 'vue';\n\nimport { useModelDuplex } from '../../composables/communication';\nimport { useRender } from '../../composables/component';\nimport { useRefs } from '../../composables/ref';\nimport { useResizeObserver } from '../../composables/resize-observer';\nimport { getRangeArr } from '../../util/common';\nimport { toStyleSizeValue } from '../../util/ui';\nimport { propsFactory } from '../../util/vue-component';\nimport { YButton } from '../button';\nimport { YIconPageControl } from '../icons/YIconPageControl';\n\nimport './YPagination.scss';\n\nexport const pressYPaginationProps = propsFactory(\n  {\n    start: {\n      type: [Number, String],\n      default: 1,\n    },\n    modelValue: {\n      type: Number,\n      default: (props: any) => props.start as number,\n    },\n    disabled: Boolean,\n    length: {\n      type: [Number, String],\n      default: 1,\n      validator: (val: number) => val % 1 === 0,\n    },\n    totalVisible: [Number, String],\n    showEndButton: Boolean,\n    gap: {\n      type: [String, Number],\n      default: 4,\n    },\n    color: String,\n    activeColor: String,\n    buttonVariations: [String],\n    // firstIcon: [String],\n    // lastIcon: [String],\n    // prevIcon: [String],\n    // nextIcon: [String],\n  },\n  'y-pagination',\n);\n\nexport const YPagination = defineComponent({\n  name: 'YPagination',\n  components: {\n    YButton,\n  },\n  props: {\n    ...pressYPaginationProps(),\n  },\n  emits: {\n    'update:modelValue': (value: number) => true,\n    change: (value: number, control?: string) => true,\n  },\n  setup(props, { slots, emit }) {\n    const page = useModelDuplex(props);\n\n    const length = computed(() => parseInt(props.length as string, 10));\n    const start = computed(() => parseInt(props.start as string, 10));\n\n    const itemCount = shallowRef(-1);\n\n    const { resizeObservedRef } = useResizeObserver((entries) => {\n      if (1 > entries.length) return;\n      const { target, contentRect } = entries[0];\n\n      const firstItem = target.querySelector(\n        '.y-pagination__list > *',\n      ) as HTMLElement;\n      if (firstItem) {\n        const listWidth = contentRect.width;\n        const itemWidth =\n          firstItem.offsetWidth +\n          parseFloat(getComputedStyle(firstItem).marginRight) * 2;\n        itemCount.value = calcItemCount(listWidth, itemWidth);\n      }\n    });\n\n    function calcItemCount(listWidth: number, itemWidth: number) {\n      const fixedCount = props.showEndButton ? 5 : 3;\n      const fixedWidth = itemWidth * fixedCount;\n      const gap = +(props.gap ?? 4);\n      return Math.max(\n        0,\n        Math.floor(\n          +((listWidth - fixedWidth - gap) / (itemWidth + gap)).toFixed(2),\n        ),\n      );\n    }\n\n    const totalVisible = computed(() => {\n      if (props.totalVisible) return parseInt(props.totalVisible as string, 10);\n      else if (itemCount.value >= 0) return itemCount.value;\n      return calcItemCount(innerWidth, 58);\n    });\n\n    const controls = computed(() => {\n      const prevDisabled = !!props.disabled || page.value <= start.value;\n      const nextDisabled =\n        !!props.disabled || page.value >= start.value + length.value - 1;\n      return {\n        first: {\n          disabled: prevDisabled,\n          variation: props.buttonVariations,\n          onClick: (e: MouseEvent) => {\n            e.preventDefault();\n            page.value = 1;\n            emit('change', 1, 'first');\n          },\n        },\n        prev: {\n          disabled: prevDisabled,\n          variation: props.buttonVariations,\n          onClick: (e: MouseEvent) => {\n            e.preventDefault();\n            const to = Math.max(1, page.value - 1);\n            page.value = to;\n            emit('change', to, 'prev');\n          },\n        },\n        next: {\n          disabled: nextDisabled,\n          variation: props.buttonVariations,\n          onClick: (e: MouseEvent) => {\n            e.preventDefault();\n            const to = Math.min(+length.value, page.value + 1);\n            page.value = to;\n            emit('change', to, 'next');\n          },\n        },\n        last: {\n          disabled: nextDisabled,\n          variation: props.buttonVariations,\n          onClick: (e: MouseEvent) => {\n            e.preventDefault();\n            const to = +length.value;\n            page.value = +length.value;\n            emit('change', to, 'last');\n          },\n        },\n      };\n    });\n\n    const range = computed(() => {\n      if (\n        length.value <= 0 ||\n        isNaN(length.value) ||\n        length.value > Number.MAX_SAFE_INTEGER\n      )\n        return [];\n      if (totalVisible.value <= 1) return [page.value];\n      if (length.value <= totalVisible.value) {\n        return getRangeArr(length.value, start.value);\n      }\n      const even = totalVisible.value % 2 === 0;\n      const middle = even\n        ? totalVisible.value / 2\n        : Math.floor(totalVisible.value / 2);\n      const left = even ? middle : middle + 1;\n      const right = length.value - middle;\n\n      if (left - page.value >= 0) {\n        return [\n          ...getRangeArr(Math.max(1, totalVisible.value - 1), start.value),\n          'ellipsis',\n          length.value,\n        ];\n      } else if (page.value - right >= (even ? 1 : 0)) {\n        const rangeLength = totalVisible.value - 1;\n        const rangeStart = length.value - rangeLength + start.value;\n        return [\n          start.value,\n          'ellipsis',\n          ...getRangeArr(rangeLength, rangeStart),\n        ];\n      } else {\n        const rangeLength = Math.max(1, totalVisible.value - 3);\n        const rangeStart =\n          rangeLength === 1\n            ? page.value\n            : page.value - Math.ceil(rangeLength / 2) + start.value;\n        return [\n          start.value,\n          'ellipsis',\n          ...getRangeArr(rangeLength, rangeStart),\n          'ellipsis',\n          length.value,\n        ];\n      }\n    });\n\n    const { refs, updateRef } = useRefs<ComponentPublicInstance>();\n\n    function changePage(event: Event, to = 1) {\n      event.preventDefault();\n      page.value = to;\n      emit('change', to);\n    }\n\n    const items = computed(() => {\n      return range.value.map((item, index) => {\n        const ref = (e: any) => updateRef(e, index);\n\n        if (item === 'ellipsis') {\n          return {\n            active: false,\n            key: `ellipsis-${index}`,\n            page: item,\n            props: {\n              ref,\n              ellipsis: true,\n              disabled: true, // TODO: skipper\n            },\n          };\n        } else {\n          const active = item === page.value;\n          return {\n            active,\n            key: `item-${item}`,\n            page: item,\n            props: {\n              ref,\n              ellipsis: false,\n              disabled: !!props.disabled || +props.length < 2,\n              color: active ? props.activeColor : props.color,\n              variation: props.buttonVariations,\n              onClick: (e: MouseEvent) => changePage(e, item),\n            },\n          };\n        }\n      });\n    });\n\n    const styles = computed(() => {\n      let gap = undefined;\n      if (props.gap) {\n        const value = +props.gap;\n        if (!isNaN(value)) {\n          gap = toStyleSizeValue(value);\n        } else if (typeof props.gap === 'string') {\n          gap = props.gap;\n        }\n      }\n      return {\n        '--y-pagination__gap': gap,\n      };\n    });\n\n    useRender(() => {\n      return (\n        <div\n          class={['y-pagination']}\n          role={'navigation'}\n          style={styles.value}\n          ref={resizeObservedRef}\n        >\n          <ul class={['y-pagination__list']}>\n            {props.showEndButton && (\n              <li key=\"first\" class=\"y-pagination__first\">\n                {slots.first ? (\n                  slots.first(controls.value.first)\n                ) : (\n                  <YButton {...controls.value.first}>\n                    {slots['first-icon'] ? (\n                      slots['first-icon']()\n                    ) : (\n                      <YIconPageControl type={'first'}></YIconPageControl>\n                    )}\n                  </YButton>\n                )}\n              </li>\n            )}\n            <li key=\"prev\" class=\"y-pagination__prev\">\n              {slots.prev ? (\n                slots.prev(controls.value.prev)\n              ) : (\n                <YButton {...controls.value.prev}>\n                  {slots['prev-icon'] ? (\n                    slots['prev-icon']()\n                  ) : (\n                    <YIconPageControl type={'prev'}></YIconPageControl>\n                  )}\n                </YButton>\n              )}\n            </li>\n            {items.value.map((item, index) => {\n              return (\n                <li\n                  key={item.key}\n                  class={[\n                    'y-pagination__item',\n                    { 'y-pagination__item--active': item.active },\n                  ]}\n                >\n                  <YButton {...item.props}>\n                    {item.props.ellipsis\n                      ? slots.ellipsis\n                        ? slots.ellipsis()\n                        : '...'\n                      : item.page}\n                  </YButton>\n                </li>\n              );\n            })}\n            <li key=\"next\" class=\"y-pagination__next\">\n              {slots.next ? (\n                slots.next(controls.value.next)\n              ) : (\n                <YButton {...controls.value.next}>\n                  {slots['next-icon'] ? (\n                    slots['next-icon']()\n                  ) : (\n                    <YIconPageControl type={'next'}></YIconPageControl>\n                  )}\n                </YButton>\n              )}\n            </li>\n            {props.showEndButton && (\n              <li key=\"last\" class=\"y-pagination__last\">\n                {slots.last ? (\n                  slots.last(controls.value.last)\n                ) : (\n                  <YButton {...controls.value.last}>\n                    {slots['last-icon'] ? (\n                      slots['last-icon']()\n                    ) : (\n                      <YIconPageControl type={'last'}></YIconPageControl>\n                    )}\n                  </YButton>\n                )}\n              </li>\n            )}\n          </ul>\n        </div>\n      );\n    });\n\n    return {\n      itemCount,\n      page,\n      refs,\n    };\n  },\n});\n"],"mappings":"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"}

package/lib/components/pagination/YPagination.scss

@@ -9,7 +9,7 @@
     list-style: none;
 
     .y-button {
-      min-width: 2.2em;
+      min-width: 2.429em;
       min-height: 0;
       padding: 4px;
 

package/lib/components/table/YDataTable.mjs

@@ -1,21 +1,31 @@
 import { createVNode as _createVNode, resolveDirective as _resolveDirective, Fragment as _Fragment } from "vue";
-import { computed, defineComponent } from "vue";
+import { computed, defineComponent } from 'vue';
 import { useRender } from "../../composables/component.mjs";
+import { propsFactory } from "../../util/vue-component.mjs";
 import { YDataTableBody } from "./YDataTableBody.mjs";
 import { YDataTableControl } from "./YDataTableControl.mjs";
-import { YDataTableHead } from "./YDataTableHead.mjs";
+import { pressYDataTableHeadProps, YDataTableHead } from "./YDataTableHead.mjs";
 import { YDataTableLayer } from "./YDataTableLayer.mjs";
-import { YTable } from "./YTable.mjs";
-import { propsFactory } from "../../util/vue-component.mjs";
-import { createPagination, pressDataTablePaginationProps } from "./pagination.mjs";
+import { pressYTableProps, YTable } from "./YTable.mjs";
+import { pressDataTableHeader } from "./composibles/header.mjs";
+import { createPagination, pressDataTablePaginationProps } from "./composibles/pagination.mjs";
+import { pressDataTableSortProps } from "./composibles/sorting.mjs";
+import { pressDataTableSelectionProps } from "./composibles/selection.mjs";
+import { pressDataTableItemsProps } from "./composibles/items.mjs";
 export const pressDataTableProps = propsFactory({
   width: [String, Number],
   search: String,
-  ...pressDataTablePaginationProps()
-}, 'YDataTable');
+  ...pressDataTableHeader(),
+  ...pressDataTableItemsProps(),
+  ...pressDataTableSortProps(),
+  ...pressDataTableSelectionProps(),
+  ...pressYDataTableHeadProps(),
+  ...pressYTableProps()
+}, 'DataTable');
 export const YDataTable = defineComponent({
   name: 'YDataTable',
   props: {
+    ...pressDataTablePaginationProps(),
     ...pressDataTableProps()
   },
   emits: {

package/lib/components/table/YDataTable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YDataTable.mjs","names":["computed","defineComponent","useRender","YDataTableBody","YDataTableControl","YDataTableHead","YDataTableLayer","YTable","propsFactory","createPagination","pressDataTablePaginationProps","pressDataTableProps","width","String","Number","search","YDataTable","name","props","emits","value","setup","_ref","slots","page","pageSize","slotProps","_createVNode","default","top","leading","_Fragment","thead","tbody","tfoot","trailing","bottom","prepend"],"sources":["../../../src/components/table/YDataTable.tsx"],"sourcesContent":["import { computed, defineComponent, PropType } from \"vue\";\r\n\r\nimport { useRender } from '../../composables/component';\r\nimport { YDataTableBody } from './YDataTableBody';\r\nimport { YDataTableControl } from './YDataTableControl';\r\nimport { YDataTableHead } from './YDataTableHead';\r\nimport { YDataTableLayer } from './YDataTableLayer';\r\nimport { YTable } from './YTable';\r\nimport { propsFactory } from \"../../util/vue-component\";\r\nimport {createPagination, pressDataTablePaginationProps} from \"./pagination\";\r\n\r\nexport const pressDataTableProps = propsFactory({\r\n  width: [String, Number] as PropType<string | number>,\r\n  search: String as PropType<string>,\r\n  ...pressDataTablePaginationProps(),\r\n}, 'YDataTable')\r\n\r\nexport const YDataTable = defineComponent({\r\n  name: 'YDataTable',\r\n  props: {\r\n    ...pressDataTableProps(),\r\n  },\r\n  emits: {\r\n    'update:modelValue': (value: any[]) => true,\r\n    'update:page': (value: number) => true,\r\n    'update:pageSize': (value: number) => true,\r\n    'update:sortBy': (value: any) => true,\r\n    'update:options': (value: any) => true,\r\n  },\r\n  setup(props, { slots }) {\r\n\r\n    const { page, pageSize } = createPagination(props as any);\r\n\r\n    const slotProps = computed(() => {\r\n      return {\r\n        page: page.value,\r\n        pageSize: pageSize.value,\r\n\r\n      };\r\n    });\r\n    useRender(() => {\r\n      return (\r\n        <YTable class={['y-data-table']} v-slots={slots}>\r\n          {{\r\n            top: () => slots.top?.(slotProps.value),\r\n            leading: () =>\r\n              slots.leading ? (\r\n                slots.leading(slotProps.value)\r\n              ) : (\r\n                <>\r\n                  <YDataTableLayer v-slots={slots}></YDataTableLayer>\r\n                </>\r\n              ),\r\n            default: () =>\r\n              slots.default ? (\r\n                slots.default(slotProps.value)\r\n              ) : (\r\n                <>\r\n                  <thead>\r\n                    <YDataTableHead v-slots={slots}></YDataTableHead>\r\n                  </thead>\r\n                  {slots.thead?.(slotProps.value)}\r\n                  <tbody>\r\n                    <YDataTableBody v-slots={slots}></YDataTableBody>\r\n                  </tbody>\r\n                  {slots.tbody?.(slotProps.value)}\r\n                  {slots.tfoot?.(slotProps.value)}\r\n                </>\r\n              ),\r\n            trailing: () => slots.trailing?.(slotProps.value),\r\n            bottom: () =>\r\n              slots.bottom ? (\r\n                slots.bottom(slotProps.value)\r\n              ) : (\r\n                <YDataTableControl\r\n                  v-slots={{\r\n                    prepend: slots['control.prepend'],\r\n                  }}\r\n                ></YDataTableControl>\r\n              ),\r\n          }}\r\n        </YTable>\r\n      );\r\n    });\r\n  },\r\n});\r\n\r\nexport type YDataTable = InstanceType<typeof YDataTable>;\r\n"],"mappings":";AAAA,SAASA,QAAQ,EAAEC,eAAe,QAAkB,KAAK;AAAC,SAEjDC,SAAS;AAAA,SACTC,cAAc;AAAA,SACdC,iBAAiB;AAAA,SACjBC,cAAc;AAAA,SACdC,eAAe;AAAA,SACfC,MAAM;AAAA,SACNC,YAAY;AAAA,SACbC,gBAAgB,EAAEC,6BAA6B;AAEvD,OAAO,MAAMC,mBAAmB,GAAGH,YAAY,CAAC;EAC9CI,KAAK,EAAE,CAACC,MAAM,EAAEC,MAAM,CAA8B;EACpDC,MAAM,EAAEF,MAA0B;EAClC,GAAGH,6BAA6B,CAAC;AACnC,CAAC,EAAE,YAAY,CAAC;AAEhB,OAAO,MAAMM,UAAU,GAAGf,eAAe,CAAC;EACxCgB,IAAI,EAAE,YAAY;EAClBC,KAAK,EAAE;IACL,GAAGP,mBAAmB,CAAC;EACzB,CAAC;EACDQ,KAAK,EAAE;IACL,mBAAmB,EAAGC,KAAY,IAAK,IAAI;IAC3C,aAAa,EAAGA,KAAa,IAAK,IAAI;IACtC,iBAAiB,EAAGA,KAAa,IAAK,IAAI;IAC1C,eAAe,EAAGA,KAAU,IAAK,IAAI;IACrC,gBAAgB,EAAGA,KAAU,IAAK;EACpC,CAAC;EACDC,KAAKA,CAACH,KAAK,EAAAI,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IAEpB,MAAM;MAAEE,IAAI;MAAEC;IAAS,CAAC,GAAGhB,gBAAgB,CAACS,KAAY,CAAC;IAEzD,MAAMQ,SAAS,GAAG1B,QAAQ,CAAC,MAAM;MAC/B,OAAO;QACLwB,IAAI,EAAEA,IAAI,CAACJ,KAAK;QAChBK,QAAQ,EAAEA,QAAQ,CAACL;MAErB,CAAC;IACH,CAAC,CAAC;IACFlB,SAAS,CAAC,MAAM;MACd,OAAAyB,YAAA,CAAApB,MAAA;QAAA,SACiB,CAAC,cAAc;MAAC;QAAAqB,OAAA,EAAAA,CAAA,MAC5B;UACCC,GAAG,EAAEA,CAAA,KAAMN,KAAK,CAACM,GAAG,GAAGH,SAAS,CAACN,KAAK,CAAC;UACvCU,OAAO,EAAEA,CAAA,KACPP,KAAK,CAACO,OAAO,GACXP,KAAK,CAACO,OAAO,CAACJ,SAAS,CAACN,KAAK,CAAC,GAAAO,YAAA,CAAAI,SAAA,SAAAJ,YAAA,CAAArB,eAAA,QAGFiB,KAAK,GAElC;UACHK,OAAO,EAAEA,CAAA,KACPL,KAAK,CAACK,OAAO,GACXL,KAAK,CAACK,OAAO,CAACF,SAAS,CAACN,KAAK,CAAC,GAAAO,YAAA,CAAAI,SAAA,SAAAJ,YAAA,iBAAAA,YAAA,CAAAtB,cAAA,QAIDkB,KAAK,KAE/BA,KAAK,CAACS,KAAK,GAAGN,SAAS,CAACN,KAAK,CAAC,EAAAO,YAAA,iBAAAA,YAAA,CAAAxB,cAAA,QAEJoB,KAAK,KAE/BA,KAAK,CAACU,KAAK,GAAGP,SAAS,CAACN,KAAK,CAAC,EAC9BG,KAAK,CAACW,KAAK,GAAGR,SAAS,CAACN,KAAK,CAAC,EAElC;UACHe,QAAQ,EAAEA,CAAA,KAAMZ,KAAK,CAACY,QAAQ,GAAGT,SAAS,CAACN,KAAK,CAAC;UACjDgB,MAAM,EAAEA,CAAA,KACNb,KAAK,CAACa,MAAM,GACVb,KAAK,CAACa,MAAM,CAACV,SAAS,CAACN,KAAK,CAAC,GAAAO,YAAA,CAAAvB,iBAAA,QAGlB;YACPiC,OAAO,EAAEd,KAAK,CAAC,iBAAiB;UAClC,CAAC;QAGT,CAAC;QAAA,GAtCuCA;MAAK;IAyCnD,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
+{"version":3,"file":"YDataTable.mjs","names":["computed","defineComponent","useRender","propsFactory","YDataTableBody","YDataTableControl","pressYDataTableHeadProps","YDataTableHead","YDataTableLayer","pressYTableProps","YTable","pressDataTableHeader","createPagination","pressDataTablePaginationProps","pressDataTableSortProps","pressDataTableSelectionProps","pressDataTableItemsProps","pressDataTableProps","width","String","Number","search","YDataTable","name","props","emits","value","setup","_ref","slots","page","pageSize","slotProps","_createVNode","default","top","leading","_Fragment","thead","tbody","tfoot","trailing","bottom","prepend"],"sources":["../../../src/components/table/YDataTable.tsx"],"sourcesContent":["import { PropType, computed, defineComponent } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { propsFactory } from '../../util/vue-component';\nimport { YDataTableBody } from './YDataTableBody';\nimport { YDataTableControl } from './YDataTableControl';\nimport { pressYDataTableHeadProps, YDataTableHead } from \"./YDataTableHead\";\nimport { YDataTableLayer } from './YDataTableLayer';\nimport { pressYTableProps, YTable } from \"./YTable\";\nimport { pressDataTableHeader } from './composibles/header';\nimport {\n  createPagination,\n  pressDataTablePaginationProps,\n} from './composibles/pagination';\nimport { pressDataTableSortProps } from './composibles/sorting';\nimport { pressDataTableSelectionProps } from \"./composibles/selection\";\nimport { pressDataTableItemsProps } from \"./composibles/items\";\n\nexport const pressDataTableProps = propsFactory(\n  {\n    width: [String, Number] as PropType<string | number>,\n    search: String as PropType<string>,\n    ...pressDataTableHeader(),\n    ...pressDataTableItemsProps(),\n    ...pressDataTableSortProps(),\n    ...pressDataTableSelectionProps(),\n    ...pressYDataTableHeadProps(),\n    ...pressYTableProps(),\n  },\n  'DataTable',\n);\n\nexport const YDataTable = defineComponent({\n  name: 'YDataTable',\n  props: {\n    ...pressDataTablePaginationProps(),\n    ...pressDataTableProps(),\n  },\n  emits: {\n    'update:modelValue': (value: any[]) => true,\n    'update:page': (value: number) => true,\n    'update:pageSize': (value: number) => true,\n    'update:sortBy': (value: any) => true,\n    'update:options': (value: any) => true,\n  },\n  setup(props, { slots }) {\n    const { page, pageSize } = createPagination(props as any);\n\n    const slotProps = computed(() => {\n      return {\n        page: page.value,\n        pageSize: pageSize.value,\n      };\n    });\n    useRender(() => {\n      return (\n        <YTable class={['y-data-table']} v-slots={slots}>\n          {{\n            top: () => slots.top?.(slotProps.value),\n            leading: () =>\n              slots.leading ? (\n                slots.leading(slotProps.value)\n              ) : (\n                <>\n                  <YDataTableLayer v-slots={slots}></YDataTableLayer>\n                </>\n              ),\n            default: () =>\n              slots.default ? (\n                slots.default(slotProps.value)\n              ) : (\n                <>\n                  <thead>\n                    <YDataTableHead v-slots={slots}></YDataTableHead>\n                  </thead>\n                  {slots.thead?.(slotProps.value)}\n                  <tbody>\n                    <YDataTableBody v-slots={slots}></YDataTableBody>\n                  </tbody>\n                  {slots.tbody?.(slotProps.value)}\n                  {slots.tfoot?.(slotProps.value)}\n                </>\n              ),\n            trailing: () => slots.trailing?.(slotProps.value),\n            bottom: () =>\n              slots.bottom ? (\n                slots.bottom(slotProps.value)\n              ) : (\n                <YDataTableControl\n                  v-slots={{\n                    prepend: slots['control.prepend'],\n                  }}\n                ></YDataTableControl>\n              ),\n          }}\n        </YTable>\n      );\n    });\n  },\n});\n\nexport type YDataTable = InstanceType<typeof YDataTable>;\n"],"mappings":";AAAA,SAAmBA,QAAQ,EAAEC,eAAe,QAAQ,KAAK;AAAC,SAEjDC,SAAS;AAAA,SACTC,YAAY;AAAA,SACZC,cAAc;AAAA,SACdC,iBAAiB;AAAA,SACjBC,wBAAwB,EAAEC,cAAc;AAAA,SACxCC,eAAe;AAAA,SACfC,gBAAgB,EAAEC,MAAM;AAAA,SACxBC,oBAAoB;AAAA,SAE3BC,gBAAgB,EAChBC,6BAA6B;AAAA,SAEtBC,uBAAuB;AAAA,SACvBC,4BAA4B;AAAA,SAC5BC,wBAAwB;AAEjC,OAAO,MAAMC,mBAAmB,GAAGd,YAAY,CAC7C;EACEe,KAAK,EAAE,CAACC,MAAM,EAAEC,MAAM,CAA8B;EACpDC,MAAM,EAAEF,MAA0B;EAClC,GAAGR,oBAAoB,CAAC,CAAC;EACzB,GAAGK,wBAAwB,CAAC,CAAC;EAC7B,GAAGF,uBAAuB,CAAC,CAAC;EAC5B,GAAGC,4BAA4B,CAAC,CAAC;EACjC,GAAGT,wBAAwB,CAAC,CAAC;EAC7B,GAAGG,gBAAgB,CAAC;AACtB,CAAC,EACD,WACF,CAAC;AAED,OAAO,MAAMa,UAAU,GAAGrB,eAAe,CAAC;EACxCsB,IAAI,EAAE,YAAY;EAClBC,KAAK,EAAE;IACL,GAAGX,6BAA6B,CAAC,CAAC;IAClC,GAAGI,mBAAmB,CAAC;EACzB,CAAC;EACDQ,KAAK,EAAE;IACL,mBAAmB,EAAGC,KAAY,IAAK,IAAI;IAC3C,aAAa,EAAGA,KAAa,IAAK,IAAI;IACtC,iBAAiB,EAAGA,KAAa,IAAK,IAAI;IAC1C,eAAe,EAAGA,KAAU,IAAK,IAAI;IACrC,gBAAgB,EAAGA,KAAU,IAAK;EACpC,CAAC;EACDC,KAAKA,CAACH,KAAK,EAAAI,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACpB,MAAM;MAAEE,IAAI;MAAEC;IAAS,CAAC,GAAGnB,gBAAgB,CAACY,KAAY,CAAC;IAEzD,MAAMQ,SAAS,GAAGhC,QAAQ,CAAC,MAAM;MAC/B,OAAO;QACL8B,IAAI,EAAEA,IAAI,CAACJ,KAAK;QAChBK,QAAQ,EAAEA,QAAQ,CAACL;MACrB,CAAC;IACH,CAAC,CAAC;IACFxB,SAAS,CAAC,MAAM;MACd,OAAA+B,YAAA,CAAAvB,MAAA;QAAA,SACiB,CAAC,cAAc;MAAC;QAAAwB,OAAA,EAAAA,CAAA,MAC5B;UACCC,GAAG,EAAEA,CAAA,KAAMN,KAAK,CAACM,GAAG,GAAGH,SAAS,CAACN,KAAK,CAAC;UACvCU,OAAO,EAAEA,CAAA,KACPP,KAAK,CAACO,OAAO,GACXP,KAAK,CAACO,OAAO,CAACJ,SAAS,CAACN,KAAK,CAAC,GAAAO,YAAA,CAAAI,SAAA,SAAAJ,YAAA,CAAAzB,eAAA,QAGFqB,KAAK,GAElC;UACHK,OAAO,EAAEA,CAAA,KACPL,KAAK,CAACK,OAAO,GACXL,KAAK,CAACK,OAAO,CAACF,SAAS,CAACN,KAAK,CAAC,GAAAO,YAAA,CAAAI,SAAA,SAAAJ,YAAA,iBAAAA,YAAA,CAAA1B,cAAA,QAIDsB,KAAK,KAE/BA,KAAK,CAACS,KAAK,GAAGN,SAAS,CAACN,KAAK,CAAC,EAAAO,YAAA,iBAAAA,YAAA,CAAA7B,cAAA,QAEJyB,KAAK,KAE/BA,KAAK,CAACU,KAAK,GAAGP,SAAS,CAACN,KAAK,CAAC,EAC9BG,KAAK,CAACW,KAAK,GAAGR,SAAS,CAACN,KAAK,CAAC,EAElC;UACHe,QAAQ,EAAEA,CAAA,KAAMZ,KAAK,CAACY,QAAQ,GAAGT,SAAS,CAACN,KAAK,CAAC;UACjDgB,MAAM,EAAEA,CAAA,KACNb,KAAK,CAACa,MAAM,GACVb,KAAK,CAACa,MAAM,CAACV,SAAS,CAACN,KAAK,CAAC,GAAAO,YAAA,CAAA5B,iBAAA,QAGlB;YACPsC,OAAO,EAAEd,KAAK,CAAC,iBAAiB;UAClC,CAAC;QAGT,CAAC;QAAA,GAtCuCA;MAAK;IAyCnD,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}

package/lib/components/table/YDataTableBody.mjs

@@ -1,20 +1,83 @@
-import { createVNode as _createVNode, Fragment as _Fragment } from "vue";
+import { resolveDirective as _resolveDirective, Fragment as _Fragment, createVNode as _createVNode } from "vue";
 import { defineComponent } from 'vue';
 import { useRender } from "../../composables/component.mjs";
+import { propsFactory } from "../../util/vue-component.mjs";
+import { YDataTableRow } from "./YDataTableRow.mjs";
+import { useHeader } from "./composibles/header.mjs";
+import { useSelection } from "./composibles/selection.mjs";
+const pressYDataTableBodyProps = propsFactory({
+  items: {
+    type: Array,
+    default: () => []
+  },
+  loading: [Boolean, String],
+  loadingText: String,
+  hideNoData: Boolean,
+  noDataText: {
+    type: String,
+    default: ''
+  },
+  rowHeight: Number,
+  'onClick:row': Function
+}, 'YDataTableBody');
 export const YDataTableBody = defineComponent({
   name: 'YDataTableBody',
   props: {
-    headers: {
-      type: [Array]
-    }
+    ...pressYDataTableBodyProps()
   },
+  emits: ['click:row'],
   setup(props, _ref) {
     let {
-      slots
+      slots,
+      emit
     } = _ref;
+    const {
+      columns
+    } = useHeader();
+    const {
+      isSelected,
+      toggleSelect
+    } = useSelection();
     useRender(() => {
-      return _createVNode(_Fragment, null, [slots.body ? slots.body?.(props) : _createVNode("tr", null, null)]);
+      if (props.loading && slots.loading) {
+        return _createVNode("tr", null, [_createVNode("td", {
+          "colspan": columns.value.length
+        }, [slots.loading()])]);
+      }
+      if (!props.loading && props.items.length < 1 && !props.hideNoData) {
+        return _createVNode("tr", {
+          "key": "no-data"
+        }, [_createVNode("td", {
+          "colspan": columns.value.length
+        }, [slots['no-data']?.() ?? props.noDataText])]);
+      }
+      return _createVNode(_Fragment, null, [slots.body ? slots.body?.(props) : props.items.map((item, index) => {
+        const stateProps = {
+          index,
+          item,
+          columns: columns.value,
+          isSelected,
+          toggleSelect
+        };
+        const slotProps = {
+          ...stateProps,
+          props: {
+            key: `item__${item.value}`,
+            onClick: props['onClick:row'] ? event => {
+              props['onClick:row']?.(event, {
+                item
+              });
+            } : undefined,
+            index,
+            item
+          }
+        };
+        return _createVNode(_Fragment, null, [slots.item ? slots.item(slotProps) : _createVNode(YDataTableRow, slotProps.props, slots)]);
+      })]);
     });
+
+    // end
+    return {};
   }
 });
 //# sourceMappingURL=YDataTableBody.mjs.map

package/lib/components/table/YDataTableBody.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YDataTableBody.mjs","names":["defineComponent","useRender","YDataTableBody","name","props","headers","type","Array","setup","_ref","slots","_createVNode","_Fragment","body"],"sources":["../../../src/components/table/YDataTableBody.tsx"],"sourcesContent":["import { defineComponent } from 'vue';\r\n\r\nimport { useRender } from '../../composables/component';\r\n\r\nexport const YDataTableBody = defineComponent({\r\n  name: 'YDataTableBody',\r\n  props: {\r\n    headers: {\r\n      type: [Array],\r\n    },\r\n  },\r\n  setup(props, { slots }) {\r\n    useRender(() => {\r\n      return <>{slots.body ? slots.body?.(props) : <tr></tr>}</>;\r\n    });\r\n  },\r\n});\r\n\r\nexport type YDataTableBody = InstanceType<typeof YDataTableBody>;\r\n"],"mappings":";AAAA,SAASA,eAAe,QAAQ,KAAK;AAAC,SAE7BC,SAAS;AAElB,OAAO,MAAMC,cAAc,GAAGF,eAAe,CAAC;EAC5CG,IAAI,EAAE,gBAAgB;EACtBC,KAAK,EAAE;IACLC,OAAO,EAAE;MACPC,IAAI,EAAE,CAACC,KAAK;IACd;EACF,CAAC;EACDC,KAAKA,CAACJ,KAAK,EAAAK,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACpBR,SAAS,CAAC,MAAM;MACd,OAAAU,YAAA,CAAAC,SAAA,SAAUF,KAAK,CAACG,IAAI,GAAGH,KAAK,CAACG,IAAI,GAAGT,KAAK,CAAC,GAAAO,YAAA,kBAAY;IACxD,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
+{"version":3,"file":"YDataTableBody.mjs","names":["defineComponent","useRender","propsFactory","YDataTableRow","useHeader","useSelection","pressYDataTableBodyProps","items","type","Array","default","loading","Boolean","String","loadingText","hideNoData","noDataText","rowHeight","Number","Function","YDataTableBody","name","props","emits","setup","_ref","slots","emit","columns","isSelected","toggleSelect","_createVNode","value","length","_Fragment","body","map","item","index","stateProps","slotProps","key","onClick","event","undefined"],"sources":["../../../src/components/table/YDataTableBody.tsx"],"sourcesContent":["import { PropType, defineComponent } from 'vue';\r\n\r\nimport { useRender } from '../../composables/component';\r\nimport { propsFactory } from '../../util/vue-component';\r\nimport { YDataTableRow } from './YDataTableRow';\r\nimport { useHeader } from './composibles/header';\r\nimport { useSelection } from './composibles/selection';\r\n\r\nimport { DataTableItem } from './types';\r\n\r\nconst pressYDataTableBodyProps = propsFactory(\r\n  {\r\n    items: {\r\n      type: Array as PropType<readonly DataTableItem[]>,\r\n      default: () => [],\r\n    },\r\n    loading: [Boolean, String],\r\n    loadingText: String,\r\n    hideNoData: Boolean,\r\n    noDataText: {\r\n      type: String,\r\n      default: '',\r\n    },\r\n    rowHeight: Number,\r\n    'onClick:row': Function as PropType<(e: Event, value: any) => void>,\r\n  },\r\n  'YDataTableBody',\r\n);\r\n\r\nexport const YDataTableBody = defineComponent({\r\n  name: 'YDataTableBody',\r\n  props: {\r\n    ...pressYDataTableBodyProps(),\r\n  },\r\n  emits: ['click:row'],\r\n  setup(props, { slots, emit }) {\r\n    const { columns } = useHeader();\r\n    const { isSelected, toggleSelect } = useSelection();\r\n\r\n    useRender(() => {\r\n      if (props.loading && slots.loading) {\r\n        return (\r\n          <tr>\r\n            <td colspan={columns.value.length}>{slots.loading()}</td>\r\n          </tr>\r\n        );\r\n      }\r\n      if (!props.loading && props.items.length < 1 && !props.hideNoData) {\r\n        return (\r\n          <tr key=\"no-data\">\r\n            <td colspan={columns.value.length}>\r\n              {slots['no-data']?.() ?? props.noDataText}\r\n            </td>\r\n          </tr>\r\n        );\r\n      }\r\n      return (\r\n        <>\r\n          {slots.body\r\n            ? slots.body?.(props)\r\n            : props.items.map((item, index) => {\r\n                const stateProps = {\r\n                  index,\r\n                  item,\r\n                  columns: columns.value,\r\n                  isSelected,\r\n                  toggleSelect,\r\n                };\r\n                const slotProps = {\r\n                  ...stateProps,\r\n                  props: {\r\n                    key: `item__${item.value}`,\r\n                    onClick: props['onClick:row']\r\n                      ? (event: Event) => {\r\n                          props['onClick:row']?.(event, { item });\r\n                        }\r\n                      : undefined,\r\n                    index,\r\n                    item,\r\n                  },\r\n                };\r\n\r\n                return (\r\n                  <>\r\n                    {slots.item ? (\r\n                      slots.item(slotProps)\r\n                    ) : (\r\n                      <YDataTableRow\r\n                        v-slots={slots}\r\n                        {...slotProps.props }\r\n                      ></YDataTableRow>\r\n                    )}\r\n                  </>\r\n                );\r\n              })}\r\n        </>\r\n      );\r\n    });\r\n\r\n    // end\r\n    return {}\r\n  },\r\n});\r\n\r\nexport type YDataTableBody = InstanceType<typeof YDataTableBody>;\r\n"],"mappings":";AAAA,SAAmBA,eAAe,QAAQ,KAAK;AAAC,SAEvCC,SAAS;AAAA,SACTC,YAAY;AAAA,SACZC,aAAa;AAAA,SACbC,SAAS;AAAA,SACTC,YAAY;AAIrB,MAAMC,wBAAwB,GAAGJ,YAAY,CAC3C;EACEK,KAAK,EAAE;IACLC,IAAI,EAAEC,KAA2C;IACjDC,OAAO,EAAEA,CAAA,KAAM;EACjB,CAAC;EACDC,OAAO,EAAE,CAACC,OAAO,EAAEC,MAAM,CAAC;EAC1BC,WAAW,EAAED,MAAM;EACnBE,UAAU,EAAEH,OAAO;EACnBI,UAAU,EAAE;IACVR,IAAI,EAAEK,MAAM;IACZH,OAAO,EAAE;EACX,CAAC;EACDO,SAAS,EAAEC,MAAM;EACjB,aAAa,EAAEC;AACjB,CAAC,EACD,gBACF,CAAC;AAED,OAAO,MAAMC,cAAc,GAAGpB,eAAe,CAAC;EAC5CqB,IAAI,EAAE,gBAAgB;EACtBC,KAAK,EAAE;IACL,GAAGhB,wBAAwB,CAAC;EAC9B,CAAC;EACDiB,KAAK,EAAE,CAAC,WAAW,CAAC;EACpBC,KAAKA,CAACF,KAAK,EAAAG,IAAA,EAAmB;IAAA,IAAjB;MAAEC,KAAK;MAAEC;IAAK,CAAC,GAAAF,IAAA;IAC1B,MAAM;MAAEG;IAAQ,CAAC,GAAGxB,SAAS,CAAC,CAAC;IAC/B,MAAM;MAAEyB,UAAU;MAAEC;IAAa,CAAC,GAAGzB,YAAY,CAAC,CAAC;IAEnDJ,SAAS,CAAC,MAAM;MACd,IAAIqB,KAAK,CAACX,OAAO,IAAIe,KAAK,CAACf,OAAO,EAAE;QAClC,OAAAoB,YAAA,cAAAA,YAAA;UAAA,WAEiBH,OAAO,CAACI,KAAK,CAACC;QAAM,IAAGP,KAAK,CAACf,OAAO,CAAC,CAAC;MAGzD;MACA,IAAI,CAACW,KAAK,CAACX,OAAO,IAAIW,KAAK,CAACf,KAAK,CAAC0B,MAAM,GAAG,CAAC,IAAI,CAACX,KAAK,CAACP,UAAU,EAAE;QACjE,OAAAgB,YAAA;UAAA,OACU;QAAS,IAAAA,YAAA;UAAA,WACFH,OAAO,CAACI,KAAK,CAACC;QAAM,IAC9BP,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,IAAIJ,KAAK,CAACN,UAAU;MAIjD;MACA,OAAAe,YAAA,CAAAG,SAAA,SAEKR,KAAK,CAACS,IAAI,GACPT,KAAK,CAACS,IAAI,GAAGb,KAAK,CAAC,GACnBA,KAAK,CAACf,KAAK,CAAC6B,GAAG,CAAC,CAACC,IAAI,EAAEC,KAAK,KAAK;QAC/B,MAAMC,UAAU,GAAG;UACjBD,KAAK;UACLD,IAAI;UACJT,OAAO,EAAEA,OAAO,CAACI,KAAK;UACtBH,UAAU;UACVC;QACF,CAAC;QACD,MAAMU,SAAS,GAAG;UAChB,GAAGD,UAAU;UACbjB,KAAK,EAAE;YACLmB,GAAG,EAAG,SAAQJ,IAAI,CAACL,KAAM,EAAC;YAC1BU,OAAO,EAAEpB,KAAK,CAAC,aAAa,CAAC,GACxBqB,KAAY,IAAK;cAChBrB,KAAK,CAAC,aAAa,CAAC,GAAGqB,KAAK,EAAE;gBAAEN;cAAK,CAAC,CAAC;YACzC,CAAC,GACDO,SAAS;YACbN,KAAK;YACLD;UACF;QACF,CAAC;QAED,OAAAN,YAAA,CAAAG,SAAA,SAEKR,KAAK,CAACW,IAAI,GACTX,KAAK,CAACW,IAAI,CAACG,SAAS,CAAC,GAAAT,YAAA,CAAA5B,aAAA,EAIfqC,SAAS,CAAClB,KAAK,EADVI,KAAK,CAGjB;MAGP,CAAC,CAAC;IAGZ,CAAC,CAAC;;IAEF;IACA,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

package/lib/components/table/YDataTableCell.mjs

@@ -1,9 +1,10 @@
 import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
-import { defineComponent, computed } from "vue";
+import { computed, defineComponent } from 'vue';
 import { useRender } from "../../composables/component.mjs";
 import { toStyleSizeValue } from "../../util/ui.mjs";
 export const YDataTableCell = defineComponent({
   name: 'YDataTableCell',
+  functional: true,
   props: {
     type: {
       type: String,
@@ -17,11 +18,20 @@ export const YDataTableCell = defineComponent({
     },
     width: {
       type: [Number, String]
+    },
+    height: {
+      type: [Number, String]
+    },
+    align: {
+      type: String,
+      default: 'start'
     }
   },
+  emits: ['click'],
   setup(props, _ref) {
     let {
       slots,
+      emit,
       attrs
     } = _ref;
     const offsetStyle = computed(() => {
@@ -38,15 +48,19 @@ export const YDataTableCell = defineComponent({
     useRender(() => {
       const ElTag = props.type === 'head' ? 'th' : 'td';
       return _createVNode(ElTag, _mergeProps({
-        "class": ['y-data-table__cell', 'y-data-table-cell', {
+        "class": [`y-data-table__${ElTag}`, 'y-data-table-cell', {
           'y-data-table-cell--fixed': props.fixed,
-          [`y-data-table-cell--fixed-${props.fixed}`]: props.fixed
+          [`y-data-table-cell--fixed-${props.fixed}`]: props.fixed,
+          [`y-data-table-cell--align-${props.align}`]: props.align
         }],
         "style": {
           width: toStyleSizeValue(props.width),
+          height: toStyleSizeValue(props.height),
           ...offsetStyle.value
         }
-      }, attrs), {
+      }, attrs, {
+        "onClick": e => emit('click', e)
+      }), {
         default: () => [slots.default?.()]
       });
     });