yuyeon 0.2.3-rc.18 → 0.2.3-rc.20

package/lib/components/table/YDataTableCell.mjs

@@ -17,6 +17,9 @@ export const YDataTableCell = defineComponent({
     fixedOffset: {
       type: Number
     },
+    rightOffset: {
+      type: Number
+    },
     width: {
       type: [Number, String]
     },
@@ -41,10 +44,10 @@ export const YDataTableCell = defineComponent({
     const offsetStyle = computed(() => {
       const ret = {};
       if (props.fixed && props.fixedOffset !== undefined) {
-        if (props.fixed === 'lead') {
-          ret['left'] = toStyleSizeValue(props.fixedOffset);
-        } else if (props.fixed === 'last') {
+        if (props.fixed.startsWith('lead')) {
           ret['left'] = toStyleSizeValue(props.fixedOffset);
+        } else if (props.fixed.startsWith('trail')) {
+          ret['right'] = toStyleSizeValue(props.rightOffset);
         }
       }
       return ret;
@@ -54,7 +57,8 @@ export const YDataTableCell = defineComponent({
       return _createVNode(ElTag, _mergeProps({
         "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-last': props.fixed?.endsWith('last'),
+          [`y-data-table-cell--fixed-${props.fixed?.replace('-last', '')}`]: props.fixed,
           [`y-data-table-cell--align-${props.align}`]: props.align
         }],
         "style": {

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

@@ -1 +1 @@
-{"version":3,"file":"YDataTableCell.mjs","names":["computed","useRender","defineComponent","toStyleSizeValue","YDataTableCell","name","functional","props","type","String","default","fixed","fixedOffset","Number","width","maxWidth","height","align","emits","setup","_ref","slots","emit","attrs","offsetStyle","ret","undefined","ElTag","_createVNode","_mergeProps","value","e"],"sources":["../../../src/components/table/YDataTableCell.tsx"],"sourcesContent":["import { type CSSProperties, type PropType, computed } from 'vue';\r\n\r\nimport { useRender } from '@/composables/component';\r\nimport { defineComponent } from '@/util/component';\r\nimport { toStyleSizeValue } from '@/util/ui';\r\n\r\nexport const YDataTableCell = defineComponent({\r\n  name: 'YDataTableCell',\r\n  functional: true,\r\n  props: {\r\n    type: {\r\n      type: String as PropType<'head' | 'data'>,\r\n      default: 'data',\r\n    },\r\n    fixed: {\r\n      type: String as PropType<'lead' | 'last'>,\r\n    },\r\n    fixedOffset: {\r\n      type: Number as PropType<number>,\r\n    },\r\n    width: {\r\n      type: [Number, String] as PropType<string | number>,\r\n    },\r\n    maxWidth: {\r\n      type: [Number, String] as PropType<string | number>,\r\n    },\r\n    height: {\r\n      type: [Number, String] as PropType<string | number>,\r\n    },\r\n    align: {\r\n      type: String as PropType<'start' | 'center' | 'end'>,\r\n      default: 'start',\r\n    },\r\n  },\r\n  emits: ['click'],\r\n  setup(props, { slots, emit, attrs }) {\r\n    const offsetStyle = computed(() => {\r\n      const ret: CSSProperties = {};\r\n      if (props.fixed && props.fixedOffset !== undefined) {\r\n        if (props.fixed === 'lead') {\r\n          ret['left'] = toStyleSizeValue(props.fixedOffset);\r\n        } else if (props.fixed === 'last') {\r\n          ret['left'] = toStyleSizeValue(props.fixedOffset);\r\n        }\r\n      }\r\n      return ret;\r\n    });\r\n\r\n    useRender(() => {\r\n      const ElTag = props.type === 'head' ? 'th' : 'td';\r\n      return (\r\n        <ElTag\r\n          class={[\r\n            `y-data-table__${ElTag}`,\r\n            'y-data-table-cell',\r\n            {\r\n              'y-data-table-cell--fixed': props.fixed,\r\n              [`y-data-table-cell--fixed-${props.fixed}`]: props.fixed,\r\n              [`y-data-table-cell--align-${props.align}`]: props.align,\r\n            },\r\n          ]}\r\n          style={{\r\n            width: toStyleSizeValue(props.width),\r\n            height: toStyleSizeValue(props.height),\r\n            maxWidth: toStyleSizeValue(props.maxWidth),\r\n            ...offsetStyle.value,\r\n          }}\r\n          {...attrs}\r\n          onClick={(e) => emit('click', e)}\r\n        >\r\n          {slots.default?.()}\r\n        </ElTag>\r\n      );\r\n    });\r\n  },\r\n});\r\n\r\nexport type YDataTableCell = InstanceType<typeof YDataTableCell>;\r\n"],"mappings":";AAAA,SAA4CA,QAAQ,QAAQ,KAAK;AAAC,SAEzDC,SAAS;AAAA,SACTC,eAAe;AAAA,SACfC,gBAAgB;AAEzB,OAAO,MAAMC,cAAc,GAAGF,eAAe,CAAC;EAC5CG,IAAI,EAAE,gBAAgB;EACtBC,UAAU,EAAE,IAAI;EAChBC,KAAK,EAAE;IACLC,IAAI,EAAE;MACJA,IAAI,EAAEC,MAAmC;MACzCC,OAAO,EAAE;IACX,CAAC;IACDC,KAAK,EAAE;MACLH,IAAI,EAAEC;IACR,CAAC;IACDG,WAAW,EAAE;MACXJ,IAAI,EAAEK;IACR,CAAC;IACDC,KAAK,EAAE;MACLN,IAAI,EAAE,CAACK,MAAM,EAAEJ,MAAM;IACvB,CAAC;IACDM,QAAQ,EAAE;MACRP,IAAI,EAAE,CAACK,MAAM,EAAEJ,MAAM;IACvB,CAAC;IACDO,MAAM,EAAE;MACNR,IAAI,EAAE,CAACK,MAAM,EAAEJ,MAAM;IACvB,CAAC;IACDQ,KAAK,EAAE;MACLT,IAAI,EAAEC,MAA8C;MACpDC,OAAO,EAAE;IACX;EACF,CAAC;EACDQ,KAAK,EAAE,CAAC,OAAO,CAAC;EAChBC,KAAKA,CAACZ,KAAK,EAAAa,IAAA,EAA0B;IAAA,IAAxB;MAAEC,KAAK;MAAEC,IAAI;MAAEC;IAAM,CAAC,GAAAH,IAAA;IACjC,MAAMI,WAAW,GAAGxB,QAAQ,CAAC,MAAM;MACjC,MAAMyB,GAAkB,GAAG,CAAC,CAAC;MAC7B,IAAIlB,KAAK,CAACI,KAAK,IAAIJ,KAAK,CAACK,WAAW,KAAKc,SAAS,EAAE;QAClD,IAAInB,KAAK,CAACI,KAAK,KAAK,MAAM,EAAE;UAC1Bc,GAAG,CAAC,MAAM,CAAC,GAAGtB,gBAAgB,CAACI,KAAK,CAACK,WAAW,CAAC;QACnD,CAAC,MAAM,IAAIL,KAAK,CAACI,KAAK,KAAK,MAAM,EAAE;UACjCc,GAAG,CAAC,MAAM,CAAC,GAAGtB,gBAAgB,CAACI,KAAK,CAACK,WAAW,CAAC;QACnD;MACF;MACA,OAAOa,GAAG;IACZ,CAAC,CAAC;IAEFxB,SAAS,CAAC,MAAM;MACd,MAAM0B,KAAK,GAAGpB,KAAK,CAACC,IAAI,KAAK,MAAM,GAAG,IAAI,GAAG,IAAI;MACjD,OAAAoB,YAAA,CAAAD,KAAA,EAAAE,WAAA;QAAA,SAEW,CACJ,iBAAgBF,KAAM,EAAC,EACxB,mBAAmB,EACnB;UACE,0BAA0B,EAAEpB,KAAK,CAACI,KAAK;UACvC,CAAE,4BAA2BJ,KAAK,CAACI,KAAM,EAAC,GAAGJ,KAAK,CAACI,KAAK;UACxD,CAAE,4BAA2BJ,KAAK,CAACU,KAAM,EAAC,GAAGV,KAAK,CAACU;QACrD,CAAC,CACF;QAAA,SACM;UACLH,KAAK,EAAEX,gBAAgB,CAACI,KAAK,CAACO,KAAK,CAAC;UACpCE,MAAM,EAAEb,gBAAgB,CAACI,KAAK,CAACS,MAAM,CAAC;UACtCD,QAAQ,EAAEZ,gBAAgB,CAACI,KAAK,CAACQ,QAAQ,CAAC;UAC1C,GAAGS,WAAW,CAACM;QACjB;MAAC,GACGP,KAAK;QAAA,WACCQ,CAAC,IAAKT,IAAI,CAAC,OAAO,EAAES,CAAC;MAAC;QAAArB,OAAA,EAAAA,CAAA,MAE/BW,KAAK,CAACX,OAAO,GAAG,CAAC;MAAA;IAGxB,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
+{"version":3,"file":"YDataTableCell.mjs","names":["computed","useRender","defineComponent","toStyleSizeValue","YDataTableCell","name","functional","props","type","String","default","fixed","fixedOffset","Number","rightOffset","width","maxWidth","height","align","emits","setup","_ref","slots","emit","attrs","offsetStyle","ret","undefined","startsWith","ElTag","_createVNode","_mergeProps","endsWith","replace","value","e"],"sources":["../../../src/components/table/YDataTableCell.tsx"],"sourcesContent":["import { type CSSProperties, type PropType, computed } from 'vue';\n\nimport type { FixedPropType } from '@/components/table/types';\nimport { useRender } from '@/composables/component';\nimport { defineComponent } from '@/util/component';\nimport { toStyleSizeValue } from '@/util/ui';\n\nexport const YDataTableCell = defineComponent({\n  name: 'YDataTableCell',\n  functional: true,\n  props: {\n    type: {\n      type: String as PropType<'head' | 'data'>,\n      default: 'data',\n    },\n    fixed: {\n      type: String as PropType<FixedPropType>,\n    },\n    fixedOffset: {\n      type: Number as PropType<number>,\n    },\n    rightOffset: {\n      type: Number as PropType<number>,\n    },\n    width: {\n      type: [Number, String] as PropType<string | number>,\n    },\n    maxWidth: {\n      type: [Number, String] as PropType<string | number>,\n    },\n    height: {\n      type: [Number, String] as PropType<string | number>,\n    },\n    align: {\n      type: String as PropType<'start' | 'center' | 'end'>,\n      default: 'start',\n    },\n  },\n  emits: ['click'],\n  setup(props, { slots, emit, attrs }) {\n    const offsetStyle = computed(() => {\n      const ret: CSSProperties = {};\n      if (props.fixed && props.fixedOffset !== undefined) {\n        if (props.fixed.startsWith('lead')) {\n          ret['left'] = toStyleSizeValue(props.fixedOffset);\n        } else if (props.fixed.startsWith('trail')) {\n          ret['right'] = toStyleSizeValue(props.rightOffset);\n        }\n      }\n      return ret;\n    });\n\n    useRender(() => {\n      const ElTag = props.type === 'head' ? 'th' : 'td';\n      return (\n        <ElTag\n          class={[\n            `y-data-table__${ElTag}`,\n            'y-data-table-cell',\n            {\n              'y-data-table-cell--fixed': props.fixed,\n              'y-data-table-cell--fixed-last': props.fixed?.endsWith('last'),\n              [`y-data-table-cell--fixed-${props.fixed?.replace('-last', '')}`]:\n                props.fixed,\n              [`y-data-table-cell--align-${props.align}`]: props.align,\n            },\n          ]}\n          style={{\n            width: toStyleSizeValue(props.width),\n            height: toStyleSizeValue(props.height),\n            maxWidth: toStyleSizeValue(props.maxWidth),\n            ...offsetStyle.value,\n          }}\n          {...attrs}\n          onClick={(e) => emit('click', e)}\n        >\n          {slots.default?.()}\n        </ElTag>\n      );\n    });\n  },\n});\n\nexport type YDataTableCell = InstanceType<typeof YDataTableCell>;\n"],"mappings":"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"}

package/lib/components/table/YDataTableHead.mjs

@@ -1,8 +1,9 @@
-import { Fragment as _Fragment, createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+import { Fragment as _Fragment, mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import { useRender } from "../../composables/component.mjs";
 import { wrapInArray } from "../../util/index.mjs";
 import { defineComponent, propsFactory } from "../../util/component/index.mjs";
 import { toStyleSizeValue } from "../../util/ui.mjs";
+import { YButton } from "../button/YButton.mjs";
 import { YIconCheckbox } from "../icons/YIconCheckbox.mjs";
 import { YIconSort } from "../icons/YIconSort.mjs";
 import { YDataTableCell } from "./YDataTableCell.mjs";
@@ -52,11 +53,18 @@ export const YDataTableHead = defineComponent({
     } = useHeader();
     const getFixedStyles = (column, y) => {
       if (!props.sticky && !column.fixed) return undefined;
+      let fixedOffset = {};
+      if (column.fixed === true || column.fixed === 'left') {
+        fixedOffset.left = toStyleSizeValue(column.fixedOffset);
+      }
+      if (column.fixed === 'right') {
+        fixedOffset.right = toStyleSizeValue(column.rightOffset);
+      }
       return {
         position: 'sticky',
         zIndex: column.fixed ? 4 : props.sticky ? 3 : undefined,
-        left: column.fixed ? toStyleSizeValue(column.fixedOffset) : undefined,
-        top: props.sticky ? `calc(var(--v-table-header-height) * ${y})` : undefined
+        top: props.sticky ? `calc(var(--v-table-header-height) * ${y})` : undefined,
+        ...fixedOffset
       };
     };
     function onClick(e) {
@@ -83,7 +91,7 @@ export const YDataTableHead = defineComponent({
       return _createVNode(YDataTableCell, _mergeProps({
         "type": "head",
         "align": column.align,
-        "fixed": column.fixed ? column.lastFixed ? 'last' : 'lead' : undefined,
+        "fixed": column.fixed ? (column.fixed === 'right' ? 'trail' : 'lead') + (column.lastFixed ? '-last' : '') : undefined,
         "class": ['y-data-table-header', {
           'y-data-table-header--sortable': column.sortable,
           'y-data-table-header--sorted': isSorted(column),
@@ -118,16 +126,20 @@ export const YDataTableHead = defineComponent({
             return slots[headerSlotName]?.(headerSlotProps);
           }
           if (column.key === 'data-table-select') {
-            return slots['header.data-table-select']?.(headerSlotProps) ?? (showSelectAll && _createVNode(YIconCheckbox, _mergeProps({
-              "checked": allSelected.value,
-              "indeterminate": !allSelected.value && someSelected.value,
-              "disabled": selectables.value.length < 1
-            }, {
-              onClick: e => {
+            return slots['header.data-table-select']?.(headerSlotProps) ?? (showSelectAll && _createVNode(YButton, {
+              "variation": 'text,small',
+              "disabled": selectables.value.length < 1,
+              "onClick": e => {
                 e.stopPropagation();
                 selectAll(!allSelected.value);
               }
-            }), null));
+            }, {
+              default: () => [_createVNode(YIconCheckbox, {
+                "checked": allSelected.value,
+                "indeterminate": !allSelected.value && someSelected.value,
+                "disabled": selectables.value.length < 1
+              }, null)]
+            }));
           }
           return _createVNode("div", {
             "class": "y-data-table-header__content"

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

@@ -1 +1 @@
-{"version":3,"file":"YDataTableHead.mjs","names":["useRender","wrapInArray","defineComponent","propsFactory","toStyleSizeValue","YIconCheckbox","YIconSort","YDataTableCell","useHeader","useSelection","useSorting","pressYDataTableHeadProps","multiSort","Boolean","sortAscIcon","type","String","default","sortDescIcon","dualSortIcon","sticky","YDataTableHead","name","components","props","setup","_ref","slots","toggleSort","sortBy","isSorted","someSelected","allSelected","selectAll","showSelectAll","selectables","columns","headers","getFixedStyles","column","y","fixed","undefined","position","zIndex","left","fixedOffset","top","onClick","e","getSortDirection","found","value","find","by","key","order","YDataTableTh","_ref2","x","_createVNode","_mergeProps","align","lastFixed","sortable","headerClasses","width","minWidth","maxWidth","rowspan","colspan","headerSlotName","headerSlotProps","length","stopPropagation","text","_Fragment","head","map","row"],"sources":["../../../src/components/table/YDataTableHead.tsx"],"sourcesContent":["import { type CSSProperties } from 'vue';\n\nimport { useRender } from '@/composables/component';\nimport { wrapInArray } from '@/util';\nimport { defineComponent, propsFactory } from '@/util/component';\nimport { toStyleSizeValue } from '@/util/ui';\n\nimport { YIconCheckbox } from '../icons/YIconCheckbox';\nimport { YIconSort } from '../icons/YIconSort';\nimport { YDataTableCell } from './YDataTableCell';\nimport { useHeader } from './composibles/header';\nimport { useSelection } from './composibles/selection';\nimport { useSorting } from './composibles/sorting';\nimport { InternalDataTableHeader } from './types';\n\nexport const pressYDataTableHeadProps = propsFactory(\n  {\n    multiSort: Boolean,\n    sortAscIcon: {\n      type: String,\n      default: '@sortAsc',\n    },\n    sortDescIcon: {\n      type: String,\n      default: '@sortDesc',\n    },\n    dualSortIcon: Boolean,\n    sticky: Boolean,\n  },\n  'YDataTableHead',\n);\n\nexport const YDataTableHead = defineComponent({\n  name: 'YDataTableHead',\n  components: {\n    YDataTableCell,\n  },\n  props: {\n    ...pressYDataTableHeadProps(),\n  },\n  setup(props, { slots }) {\n    const { toggleSort, sortBy, isSorted } = useSorting();\n    const { someSelected, allSelected, selectAll, showSelectAll, selectables } =\n      useSelection();\n    const { columns, headers } = useHeader();\n\n    const getFixedStyles = (\n      column: InternalDataTableHeader,\n      y: number,\n    ): CSSProperties | undefined => {\n      if (!props.sticky && !column.fixed) return undefined;\n\n      return {\n        position: 'sticky',\n        zIndex: column.fixed ? 4 : props.sticky ? 3 : undefined,\n        left: column.fixed ? toStyleSizeValue(column.fixedOffset) : undefined,\n        top: props.sticky\n          ? `calc(var(--v-table-header-height) * ${y})`\n          : undefined,\n      };\n    };\n\n    function onClick(e: Event) {\n      //\n    }\n\n    function getSortDirection(column: InternalDataTableHeader) {\n      const found = sortBy.value.find((by) => by.key === column.key);\n      if (!found) {\n        return undefined;\n      }\n      if (found.order === 'asc') {\n        return 'asc';\n      }\n      if (found.order === 'desc') {\n        return 'desc';\n      }\n    }\n\n    const YDataTableTh = ({\n      column,\n      x,\n      y,\n    }: {\n      column: InternalDataTableHeader;\n      x: number;\n      y: number;\n    }) => {\n      return (\n        <YDataTableCell\n          type=\"head\"\n          align={column.align}\n          fixed={\n            column.fixed ? (column.lastFixed ? 'last' : 'lead') : undefined\n          }\n          class={[\n            'y-data-table-header',\n            {\n              'y-data-table-header--sortable': column.sortable,\n              'y-data-table-header--sorted': isSorted(column),\n              'y-data-table-header--select': column.key === 'data-table-select',\n            },\n            ...wrapInArray(column.headerClasses ?? []),\n          ]}\n          style={{\n            width: toStyleSizeValue(column.width),\n            minWidth: toStyleSizeValue(column.width),\n            maxWidth: toStyleSizeValue(column.maxWidth),\n            ...getFixedStyles(column, y),\n          }}\n          {...{ rowspan: column.rowspan, colspan: column.colspan }}\n          onClick={onClick}\n        >\n          {{\n            default: () => {\n              const headerSlotName = `header.${column.key}` as const;\n              const headerSlotProps = {\n                column,\n                selectAll,\n                isSorted,\n                toggleSort,\n                sortBy: sortBy.value,\n                someSelected: someSelected.value,\n                allSelected: allSelected.value,\n                selectables: selectables.value,\n                getSortDirection,\n              };\n\n              if (slots[headerSlotName]) {\n                return slots[headerSlotName]?.(headerSlotProps);\n              }\n\n              if (column.key === 'data-table-select') {\n                return (\n                  slots['header.data-table-select']?.(headerSlotProps) ??\n                  (showSelectAll && (\n                    <YIconCheckbox\n                      checked={allSelected.value}\n                      indeterminate={!allSelected.value && someSelected.value}\n                      disabled={selectables.value.length < 1}\n                      {...{\n                        onClick: (e: MouseEvent) => {\n                          e.stopPropagation();\n                          selectAll(!allSelected.value);\n                        },\n                      }}\n                    ></YIconCheckbox>\n                  ))\n                );\n              }\n\n              return (\n                <div class=\"y-data-table-header__content\">\n                  <span class=\"y-data-table-header__text\">\n                    {slots?.[`header-text.${column.key}`]?.(headerSlotProps) ??\n                      column.text}\n                  </span>\n                  <span\n                    class={[\n                      'y-data-table-header__sorting-icon',\n                      {\n                        'y-data-table-header__sorting-icon--disabled':\n                          !column.sortable,\n                      },\n                    ]}\n                    onClick={\n                      column.sortable\n                        ? (e) => {\n                            e.stopPropagation();\n                            toggleSort(column);\n                          }\n                        : undefined\n                    }\n                  >\n                    <YIconSort\n                      disabled={!column.sortable}\n                      direction={getSortDirection(column)}\n                    ></YIconSort>\n                  </span>\n                </div>\n              );\n            },\n          }}\n        </YDataTableCell>\n      );\n    };\n\n    useRender(() => {\n      return (\n        <>\n          {slots.head\n            ? slots.head?.(props)\n            : headers.value.map((row, y) => (\n                <tr>\n                  {row.map((column, x) => (\n                    <YDataTableTh column={column} x={x} y={y} />\n                  ))}\n                </tr>\n              ))}\n        </>\n      );\n    });\n  },\n});\n\nexport type YDataTableHead = InstanceType<typeof YDataTableHead>;\n"],"mappings":"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"}
+{"version":3,"file":"YDataTableHead.mjs","names":["useRender","wrapInArray","defineComponent","propsFactory","toStyleSizeValue","YButton","YIconCheckbox","YIconSort","YDataTableCell","useHeader","useSelection","useSorting","pressYDataTableHeadProps","multiSort","Boolean","sortAscIcon","type","String","default","sortDescIcon","dualSortIcon","sticky","YDataTableHead","name","components","props","setup","_ref","slots","toggleSort","sortBy","isSorted","someSelected","allSelected","selectAll","showSelectAll","selectables","columns","headers","getFixedStyles","column","y","fixed","undefined","fixedOffset","left","right","rightOffset","position","zIndex","top","onClick","e","getSortDirection","found","value","find","by","key","order","YDataTableTh","_ref2","x","_createVNode","_mergeProps","align","lastFixed","sortable","headerClasses","width","minWidth","maxWidth","rowspan","colspan","headerSlotName","headerSlotProps","length","stopPropagation","text","_Fragment","head","map","row"],"sources":["../../../src/components/table/YDataTableHead.tsx"],"sourcesContent":["import { type CSSProperties } from 'vue';\n\nimport { useRender } from '@/composables/component';\nimport { wrapInArray } from '@/util';\nimport { defineComponent, propsFactory } from '@/util/component';\nimport { toStyleSizeValue } from '@/util/ui';\n\nimport { YButton } from '../button/YButton';\nimport { YIconCheckbox } from '../icons/YIconCheckbox';\nimport { YIconSort } from '../icons/YIconSort';\nimport { YDataTableCell } from './YDataTableCell';\nimport { useHeader } from './composibles/header';\nimport { useSelection } from './composibles/selection';\nimport { useSorting } from './composibles/sorting';\nimport { type FixedPropType, InternalDataTableHeader } from './types';\n\nexport const pressYDataTableHeadProps = propsFactory(\n  {\n    multiSort: Boolean,\n    sortAscIcon: {\n      type: String,\n      default: '@sortAsc',\n    },\n    sortDescIcon: {\n      type: String,\n      default: '@sortDesc',\n    },\n    dualSortIcon: Boolean,\n    sticky: Boolean,\n  },\n  'YDataTableHead',\n);\n\nexport const YDataTableHead = defineComponent({\n  name: 'YDataTableHead',\n  components: {\n    YDataTableCell,\n  },\n  props: {\n    ...pressYDataTableHeadProps(),\n  },\n  setup(props, { slots }) {\n    const { toggleSort, sortBy, isSorted } = useSorting();\n    const { someSelected, allSelected, selectAll, showSelectAll, selectables } =\n      useSelection();\n    const { columns, headers } = useHeader();\n\n    const getFixedStyles = (\n      column: InternalDataTableHeader,\n      y: number,\n    ): CSSProperties | undefined => {\n      if (!props.sticky && !column.fixed) return undefined;\n      let fixedOffset: any = {};\n      if (column.fixed === true || column.fixed === 'left') {\n        fixedOffset.left = toStyleSizeValue(column.fixedOffset);\n      }\n      if (column.fixed === 'right') {\n        fixedOffset.right = toStyleSizeValue(column.rightOffset);\n      }\n\n      return {\n        position: 'sticky',\n        zIndex: column.fixed ? 4 : props.sticky ? 3 : undefined,\n        top: props.sticky\n          ? `calc(var(--v-table-header-height) * ${y})`\n          : undefined,\n        ...fixedOffset,\n      };\n    };\n\n    function onClick(e: Event) {\n      //\n    }\n\n    function getSortDirection(column: InternalDataTableHeader) {\n      const found = sortBy.value.find((by) => by.key === column.key);\n      if (!found) {\n        return undefined;\n      }\n      if (found.order === 'asc') {\n        return 'asc';\n      }\n      if (found.order === 'desc') {\n        return 'desc';\n      }\n    }\n\n    const YDataTableTh = ({\n      column,\n      x,\n      y,\n    }: {\n      column: InternalDataTableHeader;\n      x: number;\n      y: number;\n    }) => {\n      return (\n        <YDataTableCell\n          type=\"head\"\n          align={column.align}\n          fixed={\n            column.fixed\n              ? (((column.fixed === 'right' ? 'trail' : 'lead') +\n                  (column.lastFixed ? '-last' : '')) as FixedPropType)\n              : undefined\n          }\n          class={[\n            'y-data-table-header',\n            {\n              'y-data-table-header--sortable': column.sortable,\n              'y-data-table-header--sorted': isSorted(column),\n              'y-data-table-header--select': column.key === 'data-table-select',\n            },\n            ...wrapInArray(column.headerClasses ?? []),\n          ]}\n          style={{\n            width: toStyleSizeValue(column.width),\n            minWidth: toStyleSizeValue(column.width),\n            maxWidth: toStyleSizeValue(column.maxWidth),\n            ...getFixedStyles(column, y),\n          }}\n          {...{ rowspan: column.rowspan, colspan: column.colspan }}\n          onClick={onClick}\n        >\n          {{\n            default: () => {\n              const headerSlotName = `header.${column.key}` as const;\n              const headerSlotProps = {\n                column,\n                selectAll,\n                isSorted,\n                toggleSort,\n                sortBy: sortBy.value,\n                someSelected: someSelected.value,\n                allSelected: allSelected.value,\n                selectables: selectables.value,\n                getSortDirection,\n              };\n\n              if (slots[headerSlotName]) {\n                return slots[headerSlotName]?.(headerSlotProps);\n              }\n\n              if (column.key === 'data-table-select') {\n                return (\n                  slots['header.data-table-select']?.(headerSlotProps) ??\n                  (showSelectAll && (\n                    <YButton\n                      variation={'text,small'}\n                      disabled={selectables.value.length < 1}\n                      onClick={(e: MouseEvent) => {\n                        e.stopPropagation();\n                        selectAll(!allSelected.value);\n                      }}\n                    >\n                      <YIconCheckbox\n                        checked={allSelected.value}\n                        indeterminate={!allSelected.value && someSelected.value}\n                        disabled={selectables.value.length < 1}\n                      ></YIconCheckbox>\n                    </YButton>\n                  ))\n                );\n              }\n\n              return (\n                <div class=\"y-data-table-header__content\">\n                  <span class=\"y-data-table-header__text\">\n                    {slots?.[`header-text.${column.key}`]?.(headerSlotProps) ??\n                      column.text}\n                  </span>\n                  <span\n                    class={[\n                      'y-data-table-header__sorting-icon',\n                      {\n                        'y-data-table-header__sorting-icon--disabled':\n                          !column.sortable,\n                      },\n                    ]}\n                    onClick={\n                      column.sortable\n                        ? (e) => {\n                            e.stopPropagation();\n                            toggleSort(column);\n                          }\n                        : undefined\n                    }\n                  >\n                    <YIconSort\n                      disabled={!column.sortable}\n                      direction={getSortDirection(column)}\n                    ></YIconSort>\n                  </span>\n                </div>\n              );\n            },\n          }}\n        </YDataTableCell>\n      );\n    };\n\n    useRender(() => {\n      return (\n        <>\n          {slots.head\n            ? slots.head?.(props)\n            : headers.value.map((row, y) => (\n                <tr>\n                  {row.map((column, x) => (\n                    <YDataTableTh column={column} x={x} y={y} />\n                  ))}\n                </tr>\n              ))}\n        </>\n      );\n    });\n  },\n});\n\nexport type YDataTableHead = InstanceType<typeof YDataTableHead>;\n"],"mappings":"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"}

package/lib/components/table/YDataTableRow.mjs

@@ -1,5 +1,6 @@
-import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import { computed, getCurrentInstance } from 'vue';
+import { YButton } from "./../index.mjs";
 import { useRender } from "../../composables/component.mjs";
 import { getPropertyFromItem } from "../../util/common.mjs";
 import { defineComponent } from "../../util/component/index.mjs";
@@ -110,8 +111,9 @@ export const YDataTableRow = defineComponent({
         }) : props.cellProps;
         return _createVNode(YDataTableCell, _mergeProps({
           "align": column.align,
-          "fixed": column.fixed ? column.lastFixed ? 'last' : 'lead' : undefined,
+          "fixed": column.fixed ? (column.fixed === 'right' ? 'trail' : 'lead') + (column.lastFixed ? '-last' : '') : undefined,
           "fixedOffset": column.fixedOffset,
+          "rightOffset": column.rightOffset,
           "width": column.width,
           "maxWidth": column.maxWidth,
           "class": ['y-data-table-data', {
@@ -124,15 +126,19 @@ export const YDataTableRow = defineComponent({
               return slots[slotName]?.(slotProps);
             }
             if (column.key === 'data-table-select') {
-              return slots['item.data-table-select']?.(slotProps) ?? _createVNode(YIconCheckbox, _mergeProps({
-                "checked": isSelected(item),
-                "disabled": !item.selectable
-              }, {
-                onClick: e => {
+              return slots['item.data-table-select']?.(slotProps) ?? _createVNode(YButton, {
+                "variation": 'text,small',
+                "disabled": !item.selectable,
+                "onClick": e => {
                   e.stopPropagation();
                   if (item.selectable) toggleSelect(item);
                 }
-              }), null);
+              }, {
+                default: () => [_createVNode(YIconCheckbox, {
+                  "checked": isSelected(item),
+                  "disabled": !item.selectable
+                }, null)]
+              });
             }
             return slotProps.value;
           }

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

@@ -1 +1 @@
-{"version":3,"file":"YDataTableRow.mjs","names":["computed","getCurrentInstance","useRender","getPropertyFromItem","defineComponent","propsFactory","YIconCheckbox","YDataTableCell","useHeader","useSelection","pressYDataTableRowProps","index","Number","onHover","Function","onMousedown","onClick","onDblclick","onContextmenu","onKeydown","YDataTableRow","name","props","item","Object","cellProps","emits","setup","_ref","emit","slots","vm","isSelected","toggleSelect","columns","selected","arrayClasses","classes","ret","push","Array","isArray","forEach","c","event","proxy","$el","_createVNode","value","map","column","colIndex","slotProps","raw","internalItem","key","el","result","call","_mergeProps","align","fixed","lastFixed","undefined","fixedOffset","width","maxWidth","default","slotName","selectable","e","stopPropagation"],"sources":["../../../src/components/table/YDataTableRow.tsx"],"sourcesContent":["import { type PropType, computed, getCurrentInstance } from 'vue';\n\nimport { useRender } from '@/composables/component';\nimport { getPropertyFromItem } from '@/util/common';\nimport { defineComponent } from '@/util/component';\nimport { propsFactory } from '@/util/component';\n\nimport { YIconCheckbox } from '../icons';\nimport { YDataTableCell } from './YDataTableCell';\nimport { useHeader } from './composibles/header';\nimport { useSelection } from './composibles/selection';\nimport { CellProps, DataTableItem } from './types';\n\nexport const pressYDataTableRowProps = propsFactory(\n  {\n    index: Number as PropType<number>,\n    onHover: Function as PropType<(...args: any[]) => void>,\n    onMousedown: Function as PropType<(...args: any[]) => void>,\n    onClick: Function as PropType<(...args: any[]) => void>,\n    onDblclick: Function as PropType<(...args: any[]) => void>,\n    onContextmenu: Function as PropType<(...args: any[]) => void>,\n    onKeydown: Function as PropType<(...args: any[]) => void>,\n  },\n  'YDataTableRow',\n);\n\nexport const YDataTableRow = defineComponent({\n  name: 'YDataTableRow',\n  props: {\n    item: Object as PropType<DataTableItem>,\n    cellProps: [Object, Function] as PropType<CellProps>,\n    ...pressYDataTableRowProps(),\n  },\n  emits: ['hover', 'mousedown', 'click', 'dblclick', 'contextmenu'],\n  setup(props, { emit, slots }) {\n    const vm = getCurrentInstance();\n    const { isSelected, toggleSelect } = useSelection();\n    const { columns } = useHeader();\n\n    const selected = computed(() => props.item && isSelected(props.item));\n\n    function arrayClasses(classes: string | string[]) {\n      const ret: string[] = [];\n      if (typeof classes === 'string') {\n        ret.push(classes);\n      }\n      if (Array.isArray(classes)) {\n        classes.forEach((c) => {\n          if (typeof c === 'string') ret.push(c);\n        });\n      }\n      return ret;\n    }\n\n    function onMousedown(event: MouseEvent) {\n      props.onMousedown?.(event, vm?.proxy?.$el);\n    }\n\n    function onClick(event: MouseEvent) {\n      props.onClick?.(event, vm?.proxy?.$el);\n    }\n\n    function onContextmenu(event: MouseEvent) {\n      props.onContextmenu?.(event, vm?.proxy?.$el);\n    }\n\n    function onDblclick(event: MouseEvent) {\n      props.onDblclick?.(event, vm?.proxy?.$el);\n    }\n\n    function onKeydown(event: KeyboardEvent) {\n      props.onKeydown?.(event, vm?.proxy?.$el);\n    }\n\n    useRender(() => {\n      return (\n        <tr\n          class={[\n            'y-data-table__row',\n            { 'y-data-table__row--selected': selected.value },\n          ]}\n          onClick={props.onClick && onClick}\n          onContextmenu={props.onContextmenu && onContextmenu}\n          onDblclick={props.onDblclick && onDblclick}\n          onMousedown={props.onMousedown && onMousedown}\n          onKeydown={props.onKeydown && onKeydown}\n        >\n          {props.item &&\n            columns.value.map((column, colIndex) => {\n              const item = props.item!;\n              const slotProps = {\n                index: props.index!,\n                item: props.item!.raw,\n                internalItem: props.item!,\n                columns: columns.value,\n                value: getPropertyFromItem(item.columns, column.key),\n                selected: selected.value,\n                toggleSelect,\n                el: vm?.proxy?.$el,\n              };\n\n              const classes = computed(() => {\n                const ret: string[] = [];\n                if (typeof column.classes === 'function') {\n                  const result = column.classes.call(\n                    null,\n                    slotProps.item,\n                    slotProps.index,\n                    column,\n                  );\n                  if (result) {\n                    ret.push(...arrayClasses(result));\n                  }\n                } else if (column.classes) {\n                  ret.push(...arrayClasses(column.classes));\n                }\n\n                return ret;\n              });\n\n              const cellProps =\n                typeof props.cellProps === 'function'\n                  ? props.cellProps({\n                      index: slotProps.index,\n                      column,\n                      internalItem: slotProps.internalItem,\n                      item: slotProps.item,\n                      value: slotProps.value,\n                      selected: slotProps.selected,\n                    })\n                  : props.cellProps;\n\n              return (\n                <YDataTableCell\n                  align={column.align}\n                  fixed={\n                    column.fixed\n                      ? column.lastFixed\n                        ? 'last'\n                        : 'lead'\n                      : undefined\n                  }\n                  fixedOffset={column.fixedOffset}\n                  width={column.width}\n                  maxWidth={column.maxWidth}\n                  class={[\n                    'y-data-table-data',\n                    {\n                      'y-data-table-data--select':\n                        column.key === 'data-table-select',\n                    },\n                    ...classes.value,\n                  ]}\n                  {...cellProps}\n                >\n                  {{\n                    default: () => {\n                      const slotName = `item.${column.key}`;\n\n                      if (slots[slotName]) {\n                        return slots[slotName]?.(slotProps);\n                      }\n\n                      if (column.key === 'data-table-select') {\n                        return (\n                          slots['item.data-table-select']?.(slotProps) ?? (\n                            <YIconCheckbox\n                              checked={isSelected(item)}\n                              disabled={!item.selectable}\n                              {...{\n                                onClick: (e: MouseEvent) => {\n                                  e.stopPropagation();\n                                  if (item.selectable) toggleSelect(item);\n                                },\n                              }}\n                            ></YIconCheckbox>\n                          )\n                        );\n                      }\n\n                      return slotProps.value;\n                    },\n                  }}\n                </YDataTableCell>\n              );\n            })}\n        </tr>\n      );\n    });\n  },\n});\n\nexport type YDataTableRow = InstanceType<typeof YDataTableRow>;\n"],"mappings":"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"}
+{"version":3,"file":"YDataTableRow.mjs","names":["computed","getCurrentInstance","YButton","useRender","getPropertyFromItem","defineComponent","propsFactory","YIconCheckbox","YDataTableCell","useHeader","useSelection","pressYDataTableRowProps","index","Number","onHover","Function","onMousedown","onClick","onDblclick","onContextmenu","onKeydown","YDataTableRow","name","props","item","Object","cellProps","emits","setup","_ref","emit","slots","vm","isSelected","toggleSelect","columns","selected","arrayClasses","classes","ret","push","Array","isArray","forEach","c","event","proxy","$el","_createVNode","value","map","column","colIndex","slotProps","raw","internalItem","key","el","result","call","_mergeProps","align","fixed","lastFixed","undefined","fixedOffset","rightOffset","width","maxWidth","default","slotName","selectable","e","stopPropagation"],"sources":["../../../src/components/table/YDataTableRow.tsx"],"sourcesContent":["import { type PropType, computed, getCurrentInstance } from 'vue';\n\nimport { YButton } from '@/components';\nimport { useRender } from '@/composables/component';\nimport { getPropertyFromItem } from '@/util/common';\nimport { defineComponent } from '@/util/component';\nimport { propsFactory } from '@/util/component';\n\nimport { YIconCheckbox } from '../icons';\nimport { YDataTableCell } from './YDataTableCell';\nimport { useHeader } from './composibles/header';\nimport { useSelection } from './composibles/selection';\nimport { CellProps, DataTableItem, type FixedPropType } from './types';\n\nexport const pressYDataTableRowProps = propsFactory(\n  {\n    index: Number as PropType<number>,\n    onHover: Function as PropType<(...args: any[]) => void>,\n    onMousedown: Function as PropType<(...args: any[]) => void>,\n    onClick: Function as PropType<(...args: any[]) => void>,\n    onDblclick: Function as PropType<(...args: any[]) => void>,\n    onContextmenu: Function as PropType<(...args: any[]) => void>,\n    onKeydown: Function as PropType<(...args: any[]) => void>,\n  },\n  'YDataTableRow',\n);\n\nexport const YDataTableRow = defineComponent({\n  name: 'YDataTableRow',\n  props: {\n    item: Object as PropType<DataTableItem>,\n    cellProps: [Object, Function] as PropType<CellProps>,\n    ...pressYDataTableRowProps(),\n  },\n  emits: ['hover', 'mousedown', 'click', 'dblclick', 'contextmenu'],\n  setup(props, { emit, slots }) {\n    const vm = getCurrentInstance();\n    const { isSelected, toggleSelect } = useSelection();\n    const { columns } = useHeader();\n\n    const selected = computed(() => props.item && isSelected(props.item));\n\n    function arrayClasses(classes: string | string[]) {\n      const ret: string[] = [];\n      if (typeof classes === 'string') {\n        ret.push(classes);\n      }\n      if (Array.isArray(classes)) {\n        classes.forEach((c) => {\n          if (typeof c === 'string') ret.push(c);\n        });\n      }\n      return ret;\n    }\n\n    function onMousedown(event: MouseEvent) {\n      props.onMousedown?.(event, vm?.proxy?.$el);\n    }\n\n    function onClick(event: MouseEvent) {\n      props.onClick?.(event, vm?.proxy?.$el);\n    }\n\n    function onContextmenu(event: MouseEvent) {\n      props.onContextmenu?.(event, vm?.proxy?.$el);\n    }\n\n    function onDblclick(event: MouseEvent) {\n      props.onDblclick?.(event, vm?.proxy?.$el);\n    }\n\n    function onKeydown(event: KeyboardEvent) {\n      props.onKeydown?.(event, vm?.proxy?.$el);\n    }\n\n    useRender(() => {\n      return (\n        <tr\n          class={[\n            'y-data-table__row',\n            { 'y-data-table__row--selected': selected.value },\n          ]}\n          onClick={props.onClick && onClick}\n          onContextmenu={props.onContextmenu && onContextmenu}\n          onDblclick={props.onDblclick && onDblclick}\n          onMousedown={props.onMousedown && onMousedown}\n          onKeydown={props.onKeydown && onKeydown}\n        >\n          {props.item &&\n            columns.value.map((column, colIndex) => {\n              const item = props.item!;\n              const slotProps = {\n                index: props.index!,\n                item: props.item!.raw,\n                internalItem: props.item!,\n                columns: columns.value,\n                value: getPropertyFromItem(item.columns, column.key),\n                selected: selected.value,\n                toggleSelect,\n                el: vm?.proxy?.$el,\n              };\n\n              const classes = computed(() => {\n                const ret: string[] = [];\n                if (typeof column.classes === 'function') {\n                  const result = column.classes.call(\n                    null,\n                    slotProps.item,\n                    slotProps.index,\n                    column,\n                  );\n                  if (result) {\n                    ret.push(...arrayClasses(result));\n                  }\n                } else if (column.classes) {\n                  ret.push(...arrayClasses(column.classes));\n                }\n\n                return ret;\n              });\n\n              const cellProps =\n                typeof props.cellProps === 'function'\n                  ? props.cellProps({\n                      index: slotProps.index,\n                      column,\n                      internalItem: slotProps.internalItem,\n                      item: slotProps.item,\n                      value: slotProps.value,\n                      selected: slotProps.selected,\n                    })\n                  : props.cellProps;\n\n              return (\n                <YDataTableCell\n                  align={column.align}\n                  fixed={\n                    column.fixed\n                      ? (((column.fixed === 'right' ? 'trail' : 'lead') +\n                          (column.lastFixed ? '-last' : '')) as FixedPropType)\n                      : undefined\n                  }\n                  fixedOffset={column.fixedOffset}\n                  rightOffset={column.rightOffset}\n                  width={column.width}\n                  maxWidth={column.maxWidth}\n                  class={[\n                    'y-data-table-data',\n                    {\n                      'y-data-table-data--select':\n                        column.key === 'data-table-select',\n                    },\n                    ...classes.value,\n                  ]}\n                  {...cellProps}\n                >\n                  {{\n                    default: () => {\n                      const slotName = `item.${column.key}`;\n\n                      if (slots[slotName]) {\n                        return slots[slotName]?.(slotProps);\n                      }\n\n                      if (column.key === 'data-table-select') {\n                        return (\n                          slots['item.data-table-select']?.(slotProps) ?? (\n                            <YButton\n                              variation={'text,small'}\n                              disabled={!item.selectable}\n                              onClick={(e: MouseEvent) => {\n                                e.stopPropagation();\n                                if (item.selectable) toggleSelect(item);\n                              }}\n                            >\n                              <YIconCheckbox\n                                checked={isSelected(item)}\n                                disabled={!item.selectable}\n                              ></YIconCheckbox>\n                            </YButton>\n                          )\n                        );\n                      }\n\n                      return slotProps.value;\n                    },\n                  }}\n                </YDataTableCell>\n              );\n            })}\n        </tr>\n      );\n    });\n  },\n});\n\nexport type YDataTableRow = InstanceType<typeof YDataTableRow>;\n"],"mappings":"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"}

package/lib/components/table/composibles/header.mjs

@@ -38,7 +38,7 @@ export function createHeader(props, options) {
           let {
             column
           } = _ref2;
-          return !!column?.fixed;
+          return column?.fixed === true || column?.fixed === 'left';
         });
         flat.unshift({
           column: {
@@ -80,10 +80,20 @@ export function createHeader(props, options) {
       }
     });
     fixedRows.forEach(row => {
-      for (let i = row.length; i -= 1; i >= 0) {
-        if (row[i].fixed) {
+      for (let i = row.length - 1; i >= 0; i--) {
+        if (row[i].fixed === true || row[i].fixed === 'left') {
           row[i].lastFixed = true;
-          return;
+          break;
+        }
+      }
+      // fixed right
+      const rightFixed = row.filter(col => col.fixed === 'right');
+      let rightOffsets = 0;
+      for (let i = rightFixed.length - 1; i >= 0; i--) {
+        rightFixed[i].rightOffset = rightOffsets;
+        rightOffsets += Number(rightFixed[i].width ?? 0);
+        if (i === 0) {
+          rightFixed[i].lastFixed = true;
         }
       }
     });

package/lib/components/table/composibles/header.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"header.mjs","names":["inject","provide","ref","watchEffect","getRangeArr","propsFactory","pressDataTableHeader","headers","type","Array","default","Y_DATA_TABLE_HEADER_KEY","Symbol","for","createHeader","props","options","columns","rows","length","flat","flatMap","row","index","map","column","rowIndex","rowCount","defaultHeader","text","sortable","defaultActionHeader","width","enableSelect","value","foundIndex","findIndex","_ref","key","fixed","some","_ref2","unshift","rowspan","splice","fixedRows","fixedOffsets","fill","forEach","_ref3","i","push","fixedOffset","Number","lastFixed","seen","Set","filtered","has","add","at","data","useHeader","Error","description"],"sources":["../../../../src/components/table/composibles/header.ts"],"sourcesContent":["import { type DeepReadonly, type InjectionKey, type PropType, type Ref, inject, provide, ref, watchEffect } from 'vue';\r\n\r\n\r\n\r\nimport { getRangeArr } from '@/util/common';\r\nimport { propsFactory } from '@/util/component';\r\n\r\n\r\n\r\nimport { type DataTableHeader, type InternalDataTableHeader } from '../types';\r\n\r\n\r\nexport const pressDataTableHeader = propsFactory(\r\n  {\r\n    headers: {\r\n      type: Array as PropType<DeepReadonly<DataTableHeader[]>>,\r\n      default: () => [],\r\n    },\r\n  },\r\n  'YDataTable--header',\r\n);\r\n\r\nexport const Y_DATA_TABLE_HEADER_KEY: InjectionKey<{\r\n  headers: Ref<InternalDataTableHeader[][]>;\r\n  columns: Ref<InternalDataTableHeader[]>;\r\n}> = Symbol.for('yuyeon.data-table.header');\r\n\r\ntype HeaderProps = {\r\n  headers: DeepReadonly<DataTableHeader[]> | undefined;\r\n};\r\n\r\nexport function createHeader(\r\n  props: HeaderProps,\r\n  options?: {\r\n    enableSelect?: Ref<boolean>;\r\n  },\r\n) {\r\n  const headers = ref<InternalDataTableHeader[][]>([]);\r\n  const columns = ref<InternalDataTableHeader[]>([]);\r\n\r\n  watchEffect(() => {\r\n    const rows = props.headers?.length\r\n      ? [props.headers as DataTableHeader[]]\r\n      : [];\r\n    const flat = rows.flatMap((row, index) =>\r\n      row.map((column) => ({ column, rowIndex: index })),\r\n    );\r\n    const rowCount = rows.length;\r\n    const defaultHeader = { text: '', sortable: false };\r\n    const defaultActionHeader = { ...defaultHeader, width: 48 };\r\n\r\n    if (options?.enableSelect?.value) {\r\n      const foundIndex = flat.findIndex(\r\n        ({ column }) => column.key === 'data-table-select',\r\n      );\r\n      if (foundIndex < 0) {\r\n        const fixed = flat.some(({ column }) => !!column?.fixed);\r\n        flat.unshift({\r\n          column: {\r\n            ...defaultActionHeader,\r\n            key: 'data-table-select',\r\n            rowspan: rowCount,\r\n            fixed,\r\n          },\r\n          rowIndex: 0,\r\n        });\r\n      } else {\r\n        flat.splice(foundIndex, 1, {\r\n          column: {\r\n            ...defaultActionHeader,\r\n            ...flat[foundIndex].column,\r\n          },\r\n          rowIndex: flat[foundIndex].rowIndex,\r\n        });\r\n      }\r\n    }\r\n\r\n    const fixedRows: InternalDataTableHeader[][] = getRangeArr(rowCount).map(\r\n      () => [],\r\n    );\r\n    const fixedOffsets = getRangeArr(rowCount).fill(0);\r\n\r\n    flat.forEach(({ column, rowIndex }) => {\r\n      const { key } = column;\r\n      for (\r\n        let i = rowIndex;\r\n        i <= rowIndex + (column.rowspan ?? 1) - 1;\r\n        i += 1\r\n      ) {\r\n        fixedRows[i].push({\r\n          ...column,\r\n          key,\r\n          fixedOffset: fixedOffsets[i],\r\n          sortable: column.sortable ?? !!key,\r\n        });\r\n        fixedOffsets[i] += Number(column.width ?? 0);\r\n      }\r\n    });\r\n\r\n    fixedRows.forEach((row) => {\r\n      for (let i = row.length; (i -= 1); i >= 0) {\r\n        if (row[i].fixed) {\r\n          row[i].lastFixed = true;\r\n          return;\r\n        }\r\n      }\r\n    });\r\n\r\n    const seen = new Set();\r\n    headers.value = fixedRows.map((row) => {\r\n      const filtered = [];\r\n      for (const column of row) {\r\n        if (!seen.has(column.key)) {\r\n          seen.add(column.key);\r\n          filtered.push(column);\r\n        }\r\n      }\r\n      return filtered;\r\n    });\r\n\r\n    columns.value = fixedRows.at(-1) ?? [];\r\n  });\r\n\r\n  const data = { headers, columns };\r\n\r\n  provide(Y_DATA_TABLE_HEADER_KEY, data);\r\n\r\n  return data;\r\n}\r\n\r\nexport function useHeader() {\r\n  const data = inject(Y_DATA_TABLE_HEADER_KEY);\r\n  if (!data) {\r\n    throw new Error(`Not provided: ${Y_DATA_TABLE_HEADER_KEY.description}`);\r\n  }\r\n  return data;\r\n}\r\n"],"mappings":"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"}
+{"version":3,"file":"header.mjs","names":["inject","provide","ref","watchEffect","getRangeArr","propsFactory","pressDataTableHeader","headers","type","Array","default","Y_DATA_TABLE_HEADER_KEY","Symbol","for","createHeader","props","options","columns","rows","length","flat","flatMap","row","index","map","column","rowIndex","rowCount","defaultHeader","text","sortable","defaultActionHeader","width","enableSelect","value","foundIndex","findIndex","_ref","key","fixed","some","_ref2","unshift","rowspan","splice","fixedRows","fixedOffsets","fill","forEach","_ref3","i","push","fixedOffset","Number","lastFixed","rightFixed","filter","col","rightOffsets","rightOffset","seen","Set","filtered","has","add","at","data","useHeader","Error","description"],"sources":["../../../../src/components/table/composibles/header.ts"],"sourcesContent":["import {\n  type DeepReadonly,\n  type InjectionKey,\n  type PropType,\n  type Ref,\n  inject,\n  provide,\n  ref,\n  watchEffect,\n} from 'vue';\n\nimport { getRangeArr } from '@/util/common';\nimport { propsFactory } from '@/util/component';\n\nimport { type DataTableHeader, type InternalDataTableHeader } from '../types';\n\nexport const pressDataTableHeader = propsFactory(\n  {\n    headers: {\n      type: Array as PropType<DeepReadonly<DataTableHeader[]>>,\n      default: () => [],\n    },\n  },\n  'YDataTable--header',\n);\n\nexport const Y_DATA_TABLE_HEADER_KEY: InjectionKey<{\n  headers: Ref<InternalDataTableHeader[][]>;\n  columns: Ref<InternalDataTableHeader[]>;\n}> = Symbol.for('yuyeon.data-table.header');\n\ntype HeaderProps = {\n  headers: DeepReadonly<DataTableHeader[]> | undefined;\n};\n\nexport function createHeader(\n  props: HeaderProps,\n  options?: {\n    enableSelect?: Ref<boolean>;\n  },\n) {\n  const headers = ref<InternalDataTableHeader[][]>([]);\n  const columns = ref<InternalDataTableHeader[]>([]);\n\n  watchEffect(() => {\n    const rows = props.headers?.length\n      ? [props.headers as DataTableHeader[]]\n      : [];\n    const flat = rows.flatMap((row, index) =>\n      row.map((column) => ({ column, rowIndex: index })),\n    );\n    const rowCount = rows.length;\n    const defaultHeader = { text: '', sortable: false };\n    const defaultActionHeader = { ...defaultHeader, width: 48 };\n\n    if (options?.enableSelect?.value) {\n      const foundIndex = flat.findIndex(\n        ({ column }) => column.key === 'data-table-select',\n      );\n      if (foundIndex < 0) {\n        const fixed = flat.some(\n          ({ column }) => column?.fixed === true || column?.fixed === 'left',\n        );\n        flat.unshift({\n          column: {\n            ...defaultActionHeader,\n            key: 'data-table-select',\n            rowspan: rowCount,\n            fixed,\n          },\n          rowIndex: 0,\n        });\n      } else {\n        flat.splice(foundIndex, 1, {\n          column: {\n            ...defaultActionHeader,\n            ...flat[foundIndex].column,\n          },\n          rowIndex: flat[foundIndex].rowIndex,\n        });\n      }\n    }\n\n    const fixedRows: InternalDataTableHeader[][] = getRangeArr(rowCount).map(\n      () => [],\n    );\n    const fixedOffsets = getRangeArr(rowCount).fill(0);\n\n    flat.forEach(({ column, rowIndex }) => {\n      const { key } = column;\n      for (\n        let i = rowIndex;\n        i <= rowIndex + (column.rowspan ?? 1) - 1;\n        i += 1\n      ) {\n        fixedRows[i].push({\n          ...column,\n          key,\n          fixedOffset: fixedOffsets[i],\n          sortable: column.sortable ?? !!key,\n        });\n        fixedOffsets[i] += Number(column.width ?? 0);\n      }\n    });\n\n    fixedRows.forEach((row) => {\n      for (let i = row.length - 1; i >= 0; i--) {\n        if (row[i].fixed === true || row[i].fixed === 'left') {\n          row[i].lastFixed = true;\n          break;\n        }\n      }\n      // fixed right\n      const rightFixed = row.filter((col) => col.fixed === 'right');\n      let rightOffsets = 0;\n      for (let i = rightFixed.length - 1; i >= 0; i--) {\n        rightFixed[i].rightOffset = rightOffsets;\n        rightOffsets += Number(rightFixed[i].width ?? 0);\n        if (i === 0) {\n          rightFixed[i].lastFixed = true;\n        }\n      }\n    });\n\n    const seen = new Set();\n    headers.value = fixedRows.map((row) => {\n      const filtered = [];\n      for (const column of row) {\n        if (!seen.has(column.key)) {\n          seen.add(column.key);\n          filtered.push(column);\n        }\n      }\n      return filtered;\n    });\n\n    columns.value = fixedRows.at(-1) ?? [];\n  });\n\n  const data = { headers, columns };\n\n  provide(Y_DATA_TABLE_HEADER_KEY, data);\n\n  return data;\n}\n\nexport function useHeader() {\n  const data = inject(Y_DATA_TABLE_HEADER_KEY);\n  if (!data) {\n    throw new Error(`Not provided: ${Y_DATA_TABLE_HEADER_KEY.description}`);\n  }\n  return data;\n}\n"],"mappings":"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"}

package/lib/components/table/types/header.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"header.mjs","names":[],"sources":["../../../../src/components/table/types/header.ts"],"sourcesContent":["import { type DataTableCellClassesFn, type DataTableCompareFn } from './common';\r\n\r\nexport type DataTableHeader = {\r\n  key: string;\r\n  text: string;\r\n  value?: any;\r\n\r\n  colspan?: number;\r\n  rowspan?: number;\r\n  fixed?: boolean;\r\n\r\n  classes?: string | string[] | DataTableCellClassesFn;\r\n  headerClasses?: string | string[];\r\n  align?: 'start' | 'end' | 'center';\r\n  width?: number | string;\r\n  minWidth?: string;\r\n  maxWidth?: string;\r\n  sortable?: boolean;\r\n  sort?: DataTableCompareFn;\r\n  mustSort?: boolean;\r\n};\r\n\r\nexport type InternalDataTableHeader = DataTableHeader & {\r\n  sortable: boolean;\r\n  fixedOffset?: number;\r\n  lastFixed?: boolean;\r\n};\r\n"],"mappings":""}
+{"version":3,"file":"header.mjs","names":[],"sources":["../../../../src/components/table/types/header.ts"],"sourcesContent":["import { type DataTableCellClassesFn, type DataTableCompareFn } from './common';\r\n\r\nexport type DataTableHeader = {\r\n  key: string;\r\n  text: string;\r\n  value?: any;\r\n\r\n  colspan?: number;\r\n  rowspan?: number;\r\n  fixed?: boolean | 'left' | 'right';\r\n\r\n  classes?: string | string[] | DataTableCellClassesFn;\r\n  headerClasses?: string | string[];\r\n  align?: 'start' | 'end' | 'center';\r\n  width?: number | string;\r\n  minWidth?: string;\r\n  maxWidth?: string;\r\n  sortable?: boolean;\r\n  sort?: DataTableCompareFn;\r\n  mustSort?: boolean;\r\n};\r\n\r\nexport type InternalDataTableHeader = DataTableHeader & {\r\n  sortable: boolean;\r\n  fixedOffset?: number;\r\n  lastFixed?: boolean;\r\n  rightOffset?: number;\r\n};\r\n"],"mappings":""}

package/lib/components/table/types/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/table/types/index.ts"],"sourcesContent":["import { ComputedRef, Ref, UnwrapRef } from 'vue';\r\n\r\nimport { SelectableItem } from '../composibles/selection';\r\nimport type { DataTableCompareFn } from './common';\r\nimport type { DataTableHeader, InternalDataTableHeader } from './header';\r\nimport type { DataTableItem, ItemKeySlot } from './item';\r\nimport type { CellProps, RowProps } from './row';\r\n\r\nexport type {\r\n  ItemKeySlot,\r\n  RowProps,\r\n  CellProps,\r\n  DataTableHeader,\r\n  InternalDataTableHeader,\r\n  DataTableItem,\r\n  DataTableCompareFn,\r\n};\r\n\r\nexport type SortOption = { key: string; order?: boolean | 'asc' | 'desc' };\r\n\r\nexport type DataTableProvideSortingData = {\r\n  sortBy: Ref<readonly SortOption[]>;\r\n  toggleSort: (column: InternalDataTableHeader) => void;\r\n  isSorted: (column: InternalDataTableHeader) => boolean;\r\n};\r\n\r\nexport interface DataTableProvidePaginationData {\r\n  page: Ref<number>;\r\n  pageSize: Ref<number>;\r\n  startIndex: ComputedRef<number>;\r\n  endIndex: ComputedRef<number>;\r\n  pageLength: ComputedRef<number>;\r\n  total: Ref<number>;\r\n  nextPage: () => void;\r\n  prevPage: () => void;\r\n  setPage: (value: number) => void;\r\n  setPageSize: (value: number) => void;\r\n}\r\n\r\nexport interface DataTableProvideSelectionData {\r\n  toggleSelect: (item: SelectableItem) => void;\r\n  select: (items: SelectableItem[], value: boolean) => void;\r\n  selectAll: (value: boolean) => void;\r\n  isSelected: (items: SelectableItem | SelectableItem[]) => any;\r\n  isSomeSelected: (items: SelectableItem | SelectableItem[]) => any;\r\n  someSelected: ComputedRef<boolean>;\r\n  allSelected: ComputedRef<any>;\r\n  showSelectAll: boolean;\r\n  selectables: ComputedRef<SelectableItem[]>;\r\n}\r\n\r\nexport type YDataTableSlotProps = {\r\n  // pagination\r\n  page: number;\r\n  pageSize: number;\r\n  pageLength: number;\r\n  setPageSize: DataTableProvidePaginationData['setPageSize'];\r\n  // sorting\r\n  sortBy: UnwrapRef<DataTableProvideSortingData['sortBy']>;\r\n  toggleSort: DataTableProvideSortingData['toggleSort'];\r\n  // selection\r\n  someSelected: boolean;\r\n  allSelected: boolean;\r\n  isSelected: DataTableProvideSelectionData['isSelected'];\r\n  select: DataTableProvideSelectionData['select'];\r\n  selectAll: DataTableProvideSelectionData['selectAll'];\r\n  toggleSelect: DataTableProvideSelectionData['toggleSelect'];\r\n  //\r\n  items: readonly DataTableItem[];\r\n  columns: InternalDataTableHeader[];\r\n  headers: InternalDataTableHeader[][];\r\n};\r\n"],"mappings":""}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/table/types/index.ts"],"sourcesContent":["import { ComputedRef, Ref, UnwrapRef } from 'vue';\r\n\r\nimport { SelectableItem } from '../composibles/selection';\r\nimport type { DataTableCompareFn } from './common';\r\nimport type { DataTableHeader, InternalDataTableHeader } from './header';\r\nimport type { DataTableItem, ItemKeySlot } from './item';\r\nimport type { CellProps, RowProps } from './row';\r\n\r\nexport type {\r\n  ItemKeySlot,\r\n  RowProps,\r\n  CellProps,\r\n  DataTableHeader,\r\n  InternalDataTableHeader,\r\n  DataTableItem,\r\n  DataTableCompareFn,\r\n};\r\n\r\nexport type SortOption = { key: string; order?: boolean | 'asc' | 'desc' };\r\n\r\nexport type DataTableProvideSortingData = {\r\n  sortBy: Ref<readonly SortOption[]>;\r\n  toggleSort: (column: InternalDataTableHeader) => void;\r\n  isSorted: (column: InternalDataTableHeader) => boolean;\r\n};\r\n\r\nexport interface DataTableProvidePaginationData {\r\n  page: Ref<number>;\r\n  pageSize: Ref<number>;\r\n  startIndex: ComputedRef<number>;\r\n  endIndex: ComputedRef<number>;\r\n  pageLength: ComputedRef<number>;\r\n  total: Ref<number>;\r\n  nextPage: () => void;\r\n  prevPage: () => void;\r\n  setPage: (value: number) => void;\r\n  setPageSize: (value: number) => void;\r\n}\r\n\r\nexport interface DataTableProvideSelectionData {\r\n  toggleSelect: (item: SelectableItem) => void;\r\n  select: (items: SelectableItem[], value: boolean) => void;\r\n  selectAll: (value: boolean) => void;\r\n  isSelected: (items: SelectableItem | SelectableItem[]) => any;\r\n  isSomeSelected: (items: SelectableItem | SelectableItem[]) => any;\r\n  someSelected: ComputedRef<boolean>;\r\n  allSelected: ComputedRef<any>;\r\n  showSelectAll: boolean;\r\n  selectables: ComputedRef<SelectableItem[]>;\r\n}\r\n\r\nexport type YDataTableSlotProps = {\r\n  // pagination\r\n  page: number;\r\n  pageSize: number;\r\n  pageLength: number;\r\n  setPageSize: DataTableProvidePaginationData['setPageSize'];\r\n  // sorting\r\n  sortBy: UnwrapRef<DataTableProvideSortingData['sortBy']>;\r\n  toggleSort: DataTableProvideSortingData['toggleSort'];\r\n  // selection\r\n  someSelected: boolean;\r\n  allSelected: boolean;\r\n  isSelected: DataTableProvideSelectionData['isSelected'];\r\n  select: DataTableProvideSelectionData['select'];\r\n  selectAll: DataTableProvideSelectionData['selectAll'];\r\n  toggleSelect: DataTableProvideSelectionData['toggleSelect'];\r\n  //\r\n  items: readonly DataTableItem[];\r\n  columns: InternalDataTableHeader[];\r\n  headers: InternalDataTableHeader[][];\r\n};\r\n\r\nexport type FixedPropType = 'lead' | 'trail' | 'lead-last' | 'trail-last';\r\n"],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yuyeon",
-  "version": "0.2.3-rc.18",
+  "version": "0.2.3-rc.20",
   "keywords": [
     "UI Library",
     "Vue"

package/types/components/table/YDataTable.d.ts

@@ -209,7 +209,7 @@ export declare const pressDataTableProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -228,7 +228,7 @@ export declare const pressDataTableProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -247,7 +247,7 @@ export declare const pressDataTableProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -263,7 +263,7 @@ export declare const pressDataTableProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -280,7 +280,7 @@ export declare const pressDataTableProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -296,7 +296,7 @@ export declare const pressDataTableProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -437,7 +437,7 @@ export declare const YDataTable: import('vue').DefineComponent<{
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;

package/types/components/table/YDataTableCell.d.ts

@@ -1,4 +1,5 @@
 import { PropType } from 'vue';
+import { FixedPropType } from './types';
 
 export declare const YDataTableCell: import('vue').DefineComponent<{
     type: {
@@ -6,11 +7,14 @@ export declare const YDataTableCell: import('vue').DefineComponent<{
         default: string;
     };
     fixed: {
-        type: PropType<"last" | "lead">;
+        type: PropType<FixedPropType>;
     };
     fixedOffset: {
         type: PropType<number>;
     };
+    rightOffset: {
+        type: PropType<number>;
+    };
     width: {
         type: PropType<string | number>;
     };

package/types/components/table/YDataTableServer.d.ts

@@ -212,7 +212,7 @@ export declare const pressDataTableServerProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -231,7 +231,7 @@ export declare const pressDataTableServerProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -250,7 +250,7 @@ export declare const pressDataTableServerProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -266,7 +266,7 @@ export declare const pressDataTableServerProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -283,7 +283,7 @@ export declare const pressDataTableServerProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -299,7 +299,7 @@ export declare const pressDataTableServerProps: <Defaults extends {
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;
@@ -470,7 +470,7 @@ export declare const YDataTableServer: import('vue').DefineComponent<{
             readonly value?: any;
             readonly colspan?: number | undefined;
             readonly rowspan?: number | undefined;
-            readonly fixed?: boolean | undefined;
+            readonly fixed?: boolean | "left" | "right" | undefined;
             readonly classes?: string | readonly string[] | import('./types/common').DataTableCellClassesFn | undefined;
             readonly headerClasses?: string | readonly string[] | undefined;
             readonly align?: "start" | "end" | "center" | undefined;