yuyeon 0.0.31 → 0.0.33

package/lib/components/select/YSelect.mjs

@@ -28,6 +28,7 @@ export const pressSelectPropsOptions = propsFactory({
     type: Function,
     default: deepEqual
   },
+  defaultSelect: Boolean,
   ...pressListItemsPropsOptions()
 }, 'Select');
 export const pressYSelectPropsOptions = propsFactory({

package/lib/components/select/YSelect.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"YSelect.mjs","names":["shallowRef","computed","defineComponent","mergeProps","ref","useModelDuplex","useRender","pressCoordinateProps","pressListItemsPropsOptions","useItems","wrapInArray","deepEqual","getObjectValueByPath","omit","chooseProps","propsFactory","YCard","YFieldInput","pressYFieldInputPropsOptions","YIconDropdown","YList","YListItem","YMenu","returnItemEquals","optionsItem","valueItem","valueKey","arguments","length","undefined","valueItemType","itemValue","pressSelectPropsOptions","opened","Boolean","multiple","weakEquals","valueEquals","type","Function","default","pressYSelectPropsOptions","maxHeight","Number","String","position","YSelect","name","props","emits","value","setup","_ref","slots","fieldInputRef","menuRef","listRef","focused","items","toRefineItems","toEmitItems","model","v","emitValue","selections","map","find","item","selected","selection","onMousedownDisplay","event","disabled","onBlur","$el","contains","relatedTarget","onClickItem","select","onAfterLeave","focus","displayText","text","join","fieldInputProps","_createVNode","$event","offset","origin","base","_len","args","Array","_key","_mergeProps","leading","_len2","_key2","trailing","menu","e","_createTextVNode"],"sources":["../../../src/components/select/YSelect.tsx"],"sourcesContent":["import { shallowRef } from '@vue/runtime-core';\r\nimport type { PropType } from 'vue';\r\nimport { computed, defineComponent, mergeProps, ref } from 'vue';\r\n\r\nimport { useModelDuplex } from '../../composables/communication';\r\nimport { useRender } from '../../composables/component';\r\nimport { pressCoordinateProps } from '../../composables/coordinate';\r\nimport {\r\n  ListItem,\r\n  pressListItemsPropsOptions,\r\n  useItems,\r\n} from '../../composables/list-items';\r\nimport { wrapInArray } from '../../util/array';\r\nimport { deepEqual, getObjectValueByPath, omit } from '../../util/common';\r\nimport { chooseProps, propsFactory } from '../../util/vue-component';\r\nimport { YCard } from '../card';\r\nimport { YFieldInput, pressYFieldInputPropsOptions } from '../field-input';\r\nimport { YIconDropdown } from '../icons/YIconDropdown';\r\nimport { YList, YListItem } from '../list';\r\nimport { YMenu } from '../menu';\r\n\r\nimport './YSelect.scss';\r\n\r\nexport type SelectEquals = (\r\n  optionsItem: any,\r\n  valueItem: any,\r\n  valueKey?: string,\r\n) => boolean;\r\n\r\nexport function returnItemEquals(\r\n  optionsItem: any,\r\n  valueItem: any,\r\n  valueKey = 'value',\r\n) {\r\n  const valueItemType = typeof valueItem;\r\n  const itemValue =\r\n    valueItemType === 'string' || valueItemType === 'number'\r\n      ? getObjectValueByPath(optionsItem, valueKey)\r\n      : optionsItem;\r\n  return deepEqual(itemValue, valueItem);\r\n}\r\n\r\nexport const pressSelectPropsOptions = propsFactory(\r\n  {\r\n    opened: Boolean as PropType<boolean>,\r\n    multiple: Boolean,\r\n    weakEquals: Boolean,\r\n    valueEquals: {\r\n      type: Function as PropType<SelectEquals>,\r\n      default: deepEqual,\r\n    },\r\n    ...pressListItemsPropsOptions(),\r\n  },\r\n  'Select',\r\n);\r\n\r\nexport const pressYSelectPropsOptions = propsFactory(\r\n  {\r\n    maxHeight: {\r\n      type: [Number, String],\r\n      default: 310,\r\n    },\r\n    ...pressSelectPropsOptions(),\r\n    ...pressYFieldInputPropsOptions(),\r\n    ...omit(pressCoordinateProps({ position: 'bottom' as 'bottom' }), [\r\n      'coordinateStrategy',\r\n    ]),\r\n  },\r\n  'YSelect',\r\n);\r\n\r\nexport const YSelect = defineComponent({\r\n  name: 'YSelect',\r\n  props: {\r\n    ...pressYSelectPropsOptions(),\r\n  },\r\n  emits: {\r\n    'update:modelValue': (value: any) => true,\r\n    'update:opened': (opened: boolean) => true,\r\n  },\r\n  setup(props, { slots }) {\r\n    const fieldInputRef = ref();\r\n    const menuRef = ref();\r\n    const listRef = ref<InstanceType<typeof YList>>();\r\n\r\n    const opened = useModelDuplex(props, 'opened');\r\n    const focused = shallowRef(false);\r\n\r\n    const { items, toRefineItems, toEmitItems } = useItems(props);\r\n    const model = useModelDuplex(\r\n      props,\r\n      'modelValue',\r\n      [],\r\n      (v) => toRefineItems(v === null ? [null] : wrapInArray(v)),\r\n      (v) => {\r\n        const emitValue = toEmitItems(wrapInArray(v));\r\n        return props.multiple ? emitValue : emitValue[0] ?? null;\r\n      },\r\n    );\r\n\r\n    const selections = computed<ListItem[]>(() => {\r\n      return model.value.map((v: any) => {\r\n        return items.value.find((item) => {\r\n          return props.valueEquals(item.value, v.value);\r\n        });\r\n      });\r\n    });\r\n\r\n    const selected = computed(() => {\r\n      return selections.value.map((selection) => selection.props.value);\r\n    });\r\n\r\n    // Field\r\n    function onMousedownDisplay(event: MouseEvent) {\r\n      if (props.disabled) {\r\n        return;\r\n      }\r\n      opened.value = !opened.value;\r\n    }\r\n\r\n    function onBlur(event: FocusEvent) {\r\n      if (listRef.value?.$el.contains(event.relatedTarget)) {\r\n        opened.value = false;\r\n      }\r\n    }\r\n\r\n    // Menu Contents\r\n    function onClickItem(item: ListItem) {\r\n      select(item);\r\n      if (!props.multiple) {\r\n        opened.value = false;\r\n      }\r\n    }\r\n\r\n    function onAfterLeave() {\r\n      if (focused.value) {\r\n        fieldInputRef.value?.focus();\r\n      }\r\n    }\r\n\r\n    function select(item: ListItem) {\r\n      if (props.multiple) {\r\n        //\r\n      } else {\r\n        model.value = [item];\r\n      }\r\n    }\r\n\r\n    const displayText = computed(() => {\r\n      if (props.multiple) {\r\n        return selections.value.map((item) => item.text).join(', ');\r\n      }\r\n      return selections.value?.[0]?.text ?? '';\r\n    });\r\n\r\n    useRender(() => {\r\n      const fieldInputProps = chooseProps(props, YFieldInput.props);\r\n      return (\r\n        <YMenu\r\n          v-model={opened.value}\r\n          ref={menuRef}\r\n          offset={props.offset}\r\n          position={props.position}\r\n          origin={props.origin}\r\n          content-classes={['y-select__content']}\r\n          maxHeight={props.maxHeight}\r\n          open-on-click-base={false}\r\n          onAfterLeave={onAfterLeave}\r\n        >\r\n          {{\r\n            base: (...args: any[]) =>\r\n              slots.base ? (\r\n                slots.base?.(...args)\r\n              ) : (\r\n                <YFieldInput\r\n                  {...{\r\n                    ...fieldInputProps,\r\n                    ...mergeProps({ ...args[0].props }, { ref: fieldInputRef }),\r\n                  }}\r\n                  onMousedown:display={onMousedownDisplay}\r\n                  onBlur={onBlur}\r\n                  readonly\r\n                  class={['y-select', { 'y-select--opened': opened.value }]}\r\n                  v-model:focused={focused.value}\r\n                >\r\n                  {{\r\n                    default: () => {\r\n                      return (\r\n                        <div class={['y-select__selection']}>\r\n                          {slots.selection\r\n                            ? slots.selection?.()\r\n                            : displayText.value}\r\n                        </div>\r\n                      );\r\n                    },\r\n                    leading: slots.leading\r\n                      ? (...args: any[]) => slots.leading?.(...args)\r\n                      : undefined,\r\n                    trailing: (...args: any[]) => {\r\n                      return slots['expand-icon'] ? (\r\n                        slots['expand-icon']()\r\n                      ) : (\r\n                        <i class=\"y-select__icon\">\r\n                          <YIconDropdown></YIconDropdown>\r\n                        </i>\r\n                      );\r\n                    },\r\n                    'helper-text': slots['helper-text']\r\n                      ? slots['helper-text']?.()\r\n                      : undefined,\r\n                  }}\r\n                </YFieldInput>\r\n              ),\r\n            default: () =>\r\n              slots.menu ? (\r\n                slots.menu()\r\n              ) : (\r\n                <YCard>\r\n                  {items.value.length > 0 ? (\r\n                    <YList ref={listRef}>\r\n                      {items.value.map((item) => {\r\n                        return (\r\n                          <YListItem onClick={(e) => onClickItem(item)}>\r\n                            {item.text}\r\n                          </YListItem>\r\n                        );\r\n                      })}\r\n                    </YList>\r\n                  ) : (\r\n                    <div class=\"y-select__no-options\">항목이 없습니다.</div>\r\n                  )}\r\n                </YCard>\r\n              ),\r\n          }}\r\n        </YMenu>\r\n      );\r\n    });\r\n\r\n    return {\r\n      fieldInputRef,\r\n      model,\r\n      selections,\r\n    };\r\n  },\r\n});\r\n"],"mappings":"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"}
+{"version":3,"file":"YSelect.mjs","names":["shallowRef","computed","defineComponent","mergeProps","ref","useModelDuplex","useRender","pressCoordinateProps","pressListItemsPropsOptions","useItems","wrapInArray","deepEqual","getObjectValueByPath","omit","chooseProps","propsFactory","YCard","YFieldInput","pressYFieldInputPropsOptions","YIconDropdown","YList","YListItem","YMenu","returnItemEquals","optionsItem","valueItem","valueKey","arguments","length","undefined","valueItemType","itemValue","pressSelectPropsOptions","opened","Boolean","multiple","weakEquals","valueEquals","type","Function","default","defaultSelect","pressYSelectPropsOptions","maxHeight","Number","String","position","YSelect","name","props","emits","value","setup","_ref","slots","fieldInputRef","menuRef","listRef","focused","items","toRefineItems","toEmitItems","model","v","emitValue","selections","map","find","item","selected","selection","onMousedownDisplay","event","disabled","onBlur","$el","contains","relatedTarget","onClickItem","select","onAfterLeave","focus","displayText","text","join","fieldInputProps","_createVNode","$event","offset","origin","base","_len","args","Array","_key","_mergeProps","leading","_len2","_key2","trailing","menu","e","_createTextVNode"],"sources":["../../../src/components/select/YSelect.tsx"],"sourcesContent":["import { shallowRef } from '@vue/runtime-core';\r\nimport type { PropType } from 'vue';\r\nimport { computed, defineComponent, mergeProps, ref } from 'vue';\r\n\r\nimport { useModelDuplex } from '../../composables/communication';\r\nimport { useRender } from '../../composables/component';\r\nimport { pressCoordinateProps } from '../../composables/coordinate';\r\nimport {\r\n  ListItem,\r\n  pressListItemsPropsOptions,\r\n  useItems,\r\n} from '../../composables/list-items';\r\nimport { wrapInArray } from '../../util/array';\r\nimport { deepEqual, getObjectValueByPath, omit } from '../../util/common';\r\nimport { chooseProps, propsFactory } from '../../util/vue-component';\r\nimport { YCard } from '../card';\r\nimport { YFieldInput, pressYFieldInputPropsOptions } from '../field-input';\r\nimport { YIconDropdown } from '../icons/YIconDropdown';\r\nimport { YList, YListItem } from '../list';\r\nimport { YMenu } from '../menu';\r\n\r\nimport './YSelect.scss';\r\n\r\nexport type SelectEquals = (\r\n  optionsItem: any,\r\n  valueItem: any,\r\n  valueKey?: string,\r\n) => boolean;\r\n\r\nexport function returnItemEquals(\r\n  optionsItem: any,\r\n  valueItem: any,\r\n  valueKey = 'value',\r\n) {\r\n  const valueItemType = typeof valueItem;\r\n  const itemValue =\r\n    valueItemType === 'string' || valueItemType === 'number'\r\n      ? getObjectValueByPath(optionsItem, valueKey)\r\n      : optionsItem;\r\n  return deepEqual(itemValue, valueItem);\r\n}\r\n\r\nexport const pressSelectPropsOptions = propsFactory(\r\n  {\r\n    opened: Boolean as PropType<boolean>,\r\n    multiple: Boolean,\r\n    weakEquals: Boolean,\r\n    valueEquals: {\r\n      type: Function as PropType<SelectEquals>,\r\n      default: deepEqual,\r\n    },\r\n    defaultSelect: Boolean,\r\n    ...pressListItemsPropsOptions(),\r\n  },\r\n  'Select',\r\n);\r\n\r\nexport const pressYSelectPropsOptions = propsFactory(\r\n  {\r\n    maxHeight: {\r\n      type: [Number, String],\r\n      default: 310,\r\n    },\r\n    ...pressSelectPropsOptions(),\r\n    ...pressYFieldInputPropsOptions(),\r\n    ...omit(pressCoordinateProps({ position: 'bottom' as 'bottom' }), [\r\n      'coordinateStrategy',\r\n    ]),\r\n  },\r\n  'YSelect',\r\n);\r\n\r\nexport const YSelect = defineComponent({\r\n  name: 'YSelect',\r\n  props: {\r\n    ...pressYSelectPropsOptions(),\r\n  },\r\n  emits: {\r\n    'update:modelValue': (value: any) => true,\r\n    'update:opened': (opened: boolean) => true,\r\n  },\r\n  setup(props, { slots }) {\r\n    const fieldInputRef = ref();\r\n    const menuRef = ref();\r\n    const listRef = ref<InstanceType<typeof YList>>();\r\n\r\n    const opened = useModelDuplex(props, 'opened');\r\n    const focused = shallowRef(false);\r\n\r\n    const { items, toRefineItems, toEmitItems } = useItems(props);\r\n    const model = useModelDuplex(\r\n      props,\r\n      'modelValue',\r\n      [],\r\n      (v) => toRefineItems(v === null ? [null] : wrapInArray(v)),\r\n      (v) => {\r\n        const emitValue = toEmitItems(wrapInArray(v));\r\n        return props.multiple ? emitValue : emitValue[0] ?? null;\r\n      },\r\n    );\r\n\r\n    const selections = computed<ListItem[]>(() => {\r\n      return model.value.map((v: any) => {\r\n        return items.value.find((item) => {\r\n          return props.valueEquals(item.value, v.value);\r\n        });\r\n      });\r\n    });\r\n\r\n    const selected = computed(() => {\r\n      return selections.value.map((selection) => selection.props.value);\r\n    });\r\n\r\n    // Field\r\n    function onMousedownDisplay(event: MouseEvent) {\r\n      if (props.disabled) {\r\n        return;\r\n      }\r\n      opened.value = !opened.value;\r\n    }\r\n\r\n    function onBlur(event: FocusEvent) {\r\n      if (listRef.value?.$el.contains(event.relatedTarget)) {\r\n        opened.value = false;\r\n      }\r\n    }\r\n\r\n    // Menu Contents\r\n    function onClickItem(item: ListItem) {\r\n      select(item);\r\n      if (!props.multiple) {\r\n        opened.value = false;\r\n      }\r\n    }\r\n\r\n    function onAfterLeave() {\r\n      if (focused.value) {\r\n        fieldInputRef.value?.focus();\r\n      }\r\n    }\r\n\r\n    function select(item: ListItem) {\r\n      if (props.multiple) {\r\n        //\r\n      } else {\r\n        model.value = [item];\r\n      }\r\n    }\r\n\r\n    const displayText = computed(() => {\r\n      if (props.multiple) {\r\n        return selections.value.map((item) => item.text).join(', ');\r\n      }\r\n      return selections.value?.[0]?.text ?? '';\r\n    });\r\n\r\n    useRender(() => {\r\n      const fieldInputProps = chooseProps(props, YFieldInput.props);\r\n      return (\r\n        <YMenu\r\n          v-model={opened.value}\r\n          ref={menuRef}\r\n          offset={props.offset}\r\n          position={props.position}\r\n          origin={props.origin}\r\n          content-classes={['y-select__content']}\r\n          maxHeight={props.maxHeight}\r\n          open-on-click-base={false}\r\n          onAfterLeave={onAfterLeave}\r\n        >\r\n          {{\r\n            base: (...args: any[]) =>\r\n              slots.base ? (\r\n                slots.base?.(...args)\r\n              ) : (\r\n                <YFieldInput\r\n                  {...{\r\n                    ...fieldInputProps,\r\n                    ...mergeProps({ ...args[0].props }, { ref: fieldInputRef }),\r\n                  }}\r\n                  onMousedown:display={onMousedownDisplay}\r\n                  onBlur={onBlur}\r\n                  readonly\r\n                  class={['y-select', { 'y-select--opened': opened.value }]}\r\n                  v-model:focused={focused.value}\r\n                >\r\n                  {{\r\n                    default: () => {\r\n                      return (\r\n                        <div class={['y-select__selection']}>\r\n                          {slots.selection\r\n                            ? slots.selection?.()\r\n                            : displayText.value}\r\n                        </div>\r\n                      );\r\n                    },\r\n                    leading: slots.leading\r\n                      ? (...args: any[]) => slots.leading?.(...args)\r\n                      : undefined,\r\n                    trailing: (...args: any[]) => {\r\n                      return slots['expand-icon'] ? (\r\n                        slots['expand-icon']()\r\n                      ) : (\r\n                        <i class=\"y-select__icon\">\r\n                          <YIconDropdown></YIconDropdown>\r\n                        </i>\r\n                      );\r\n                    },\r\n                    'helper-text': slots['helper-text']\r\n                      ? slots['helper-text']?.()\r\n                      : undefined,\r\n                  }}\r\n                </YFieldInput>\r\n              ),\r\n            default: () =>\r\n              slots.menu ? (\r\n                slots.menu()\r\n              ) : (\r\n                <YCard>\r\n                  {items.value.length > 0 ? (\r\n                    <YList ref={listRef}>\r\n                      {items.value.map((item) => {\r\n                        return (\r\n                          <YListItem onClick={(e) => onClickItem(item)}>\r\n                            {item.text}\r\n                          </YListItem>\r\n                        );\r\n                      })}\r\n                    </YList>\r\n                  ) : (\r\n                    <div class=\"y-select__no-options\">항목이 없습니다.</div>\r\n                  )}\r\n                </YCard>\r\n              ),\r\n          }}\r\n        </YMenu>\r\n      );\r\n    });\r\n\r\n    return {\r\n      fieldInputRef,\r\n      model,\r\n      selections,\r\n    };\r\n  },\r\n});\r\n"],"mappings":"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"}

package/lib/components/table/YDataTable.mjs

@@ -1,6 +1,8 @@
 import { mergeProps as _mergeProps, createVNode as _createVNode, resolveDirective as _resolveDirective, Fragment as _Fragment } from "vue";
 import { computed, defineComponent, provide, toRef } from 'vue';
 import { useRender } from "../../composables/component.mjs";
+import { useResizeObserver } from "../../composables/resize-observer.mjs";
+import { toStyleSizeValue } from "../../util/index.mjs";
 import { chooseProps, propsFactory } from "../../util/vue-component.mjs";
 import { YDataTableBody } from "./YDataTableBody.mjs";
 import { YDataTableControl } from "./YDataTableControl.mjs";
@@ -97,6 +99,10 @@ export const YDataTable = defineComponent({
       allItems: items,
       pageItems: items
     });
+    const {
+      resizeObservedRef: headObserveRef,
+      contentRect: headRect
+    } = useResizeObserver();
     useOptions({
       page,
       pageSize,
@@ -105,7 +111,8 @@ export const YDataTable = defineComponent({
     }, emit);
     provide('y-data-table', {
       toggleSort,
-      sortBy
+      sortBy,
+      headRect
     });
     const slotProps = computed(() => {
       return {
@@ -137,10 +144,18 @@ export const YDataTable = defineComponent({
     useRender(() => {
       return _createVNode(YTable, _mergeProps({
         "class": ['y-data-table']
-      }, yTableProps), {
+      }, yTableProps, {
+        "style": {
+          '--y-table-head-height': toStyleSizeValue(headRect.value?.height)
+        }
+      }), {
         top: () => slots.top?.(slotProps.value),
-        leading: () => slots.leading ? slots.leading(slotProps.value) : _createVNode(_Fragment, null, [_createVNode(YDataTableLayer, null, slots)]),
-        default: () => slots.default ? slots.default(slotProps.value) : _createVNode(_Fragment, null, [_createVNode("thead", null, [_createVNode(YDataTableHead, yDataTableHeadProps, slots)]), slots.thead?.(slotProps.value), _createVNode("tbody", null, [_createVNode(YDataTableBody, _mergeProps(yDataTableBodyProps, {
+        leading: () => slots.leading ? slots.leading(slotProps.value) : _createVNode(_Fragment, null, [_createVNode(YDataTableLayer, {
+          "slot-props": slotProps.value
+        }, slots)]),
+        default: () => slots.default ? slots.default(slotProps.value) : _createVNode(_Fragment, null, [_createVNode("thead", {
+          "ref": headObserveRef
+        }, [_createVNode(YDataTableHead, yDataTableHeadProps, slots)]), slots.thead?.(slotProps.value), _createVNode("tbody", null, [_createVNode(YDataTableBody, _mergeProps(yDataTableBodyProps, {
           "items": paginatedItems.value
         }), slots)]), slots.tbody?.(slotProps.value), slots.tfoot?.(slotProps.value)]),
         trailing: () => slots.trailing?.(slotProps.value),

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

@@ -1 +1 @@
-{"version":3,"file":"YDataTable.mjs","names":["computed","defineComponent","provide","toRef","useRender","chooseProps","propsFactory","YDataTableBody","YDataTableControl","YDataTableHead","pressYDataTableHeadProps","YDataTableLayer","YTable","pressYTableProps","createHeader","pressDataTableHeader","pressDataTableItemsProps","useItems","useOptions","createPagination","pressDataTablePaginationProps","providePagination","usePaginatedItems","pressDataTableSelectionProps","provideSelection","createSorting","pressDataTableSortProps","provideSorting","pressDataTableProps","width","String","Number","search","YDataTable","name","props","emits","value","page","pageSize","sortBy","options","click:row","e","setup","_ref","slots","emit","multiSort","columns","headers","enableSelect","items","toggleSort","total","length","startIndex","endIndex","pageLength","setPageSize","setPage","paginatedItems","isSelected","select","selectAll","toggleSelect","someSelected","allSelected","allItems","pageItems","slotProps","yDataTableHeadProps","yDataTableBodyProps","yTableProps","_createVNode","_mergeProps","top","leading","_Fragment","default","thead","tbody","tfoot","trailing","bottom","prepend","append"],"sources":["../../../src/components/table/YDataTable.tsx"],"sourcesContent":["import { PropType, computed, defineComponent, provide, toRef } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { YDataTableBody } from './YDataTableBody';\nimport { YDataTableControl } from './YDataTableControl';\nimport { YDataTableHead, pressYDataTableHeadProps } from './YDataTableHead';\nimport { YDataTableLayer } from './YDataTableLayer';\nimport { YTable, pressYTableProps } from './YTable';\nimport { createHeader, pressDataTableHeader } from './composibles/header';\nimport { pressDataTableItemsProps, useItems } from './composibles/items';\nimport { useOptions } from './composibles/options';\nimport {\n  createPagination,\n  pressDataTablePaginationProps,\n  providePagination,\n  usePaginatedItems,\n} from './composibles/pagination';\nimport {\n  pressDataTableSelectionProps,\n  provideSelection,\n} from './composibles/selection';\nimport {\n  createSorting,\n  pressDataTableSortProps,\n  provideSorting,\n} from './composibles/sorting';\nimport { YDataTableSlotProps } from './types';\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': (page: number) => true,\n    'update:pageSize': (pageSize: number) => true,\n    'update:sortBy': (sortBy: any) => true,\n    'update:options': (options: any) => true,\n    'click:row': (e: Event, value: { row: any }) => true,\n  },\n  setup(props, { slots, emit }) {\n    const { page, pageSize } = createPagination(props);\n    const { sortBy, multiSort } = createSorting(props);\n    const { columns, headers } = createHeader(props, {\n      enableSelect: toRef(props, 'enableSelect'),\n    });\n    const { items } = useItems(props, columns);\n\n    const { toggleSort } = provideSorting({ sortBy, multiSort, page });\n    const total = computed(() => items.value.length);\n    const { startIndex, endIndex, pageLength, setPageSize, setPage } =\n      providePagination({\n        page,\n        pageSize,\n        total,\n      });\n    const { paginatedItems } = usePaginatedItems({\n      items,\n      startIndex,\n      endIndex,\n      pageSize,\n    });\n    const {\n      isSelected,\n      select,\n      selectAll,\n      toggleSelect,\n      someSelected,\n      allSelected,\n    } = provideSelection(props, { allItems: items, pageItems: items });\n\n    useOptions(\n      {\n        page,\n        pageSize,\n        search: toRef(props, 'search'),\n        sortBy,\n      },\n      emit,\n    );\n\n    provide('y-data-table', {\n      toggleSort,\n      sortBy,\n    });\n\n    const slotProps = computed<YDataTableSlotProps>(() => {\n      return {\n        // pagination\n        page: page.value,\n        pageSize: pageSize.value,\n        pageLength: pageLength.value,\n        setPageSize,\n        setPage,\n        // sorting\n        sortBy: sortBy.value,\n        toggleSort,\n        // selection\n        someSelected: someSelected.value,\n        allSelected: allSelected.value,\n        isSelected,\n        select,\n        selectAll,\n        toggleSelect,\n        //\n        items: items.value,\n        columns: columns.value,\n        headers: headers.value,\n      };\n    });\n    const yDataTableHeadProps = chooseProps(props, YDataTableHead.props);\n    const yDataTableBodyProps = chooseProps(props, YDataTableBody.props);\n    const yTableProps = chooseProps(props, YTable.props);\n    useRender(() => {\n      return (\n        <YTable class={['y-data-table']} {...yTableProps}>\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\n                      v-slots={slots}\n                      {...yDataTableHeadProps}\n                    ></YDataTableHead>\n                  </thead>\n                  {slots.thead?.(slotProps.value)}\n                  <tbody>\n                    <YDataTableBody\n                      v-slots={slots}\n                      {...yDataTableBodyProps}\n                      items={paginatedItems.value}\n                    ></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                    append: slots['control.append'],\n                  }}\n                ></YDataTableControl>\n              ),\n          }}\n        </YTable>\n      );\n    });\n    return {paginatedItems}\n  },\n});\n\nexport type YDataTable = InstanceType<typeof YDataTable>;\n"],"mappings":"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"}
+{"version":3,"file":"YDataTable.mjs","names":["computed","defineComponent","provide","toRef","useRender","useResizeObserver","toStyleSizeValue","chooseProps","propsFactory","YDataTableBody","YDataTableControl","YDataTableHead","pressYDataTableHeadProps","YDataTableLayer","YTable","pressYTableProps","createHeader","pressDataTableHeader","pressDataTableItemsProps","useItems","useOptions","createPagination","pressDataTablePaginationProps","providePagination","usePaginatedItems","pressDataTableSelectionProps","provideSelection","createSorting","pressDataTableSortProps","provideSorting","pressDataTableProps","width","String","Number","search","YDataTable","name","props","emits","value","page","pageSize","sortBy","options","click:row","e","setup","_ref","slots","emit","multiSort","columns","headers","enableSelect","items","toggleSort","total","length","startIndex","endIndex","pageLength","setPageSize","setPage","paginatedItems","isSelected","select","selectAll","toggleSelect","someSelected","allSelected","allItems","pageItems","resizeObservedRef","headObserveRef","contentRect","headRect","slotProps","yDataTableHeadProps","yDataTableBodyProps","yTableProps","_createVNode","_mergeProps","height","top","leading","_Fragment","default","thead","tbody","tfoot","trailing","bottom","prepend","append"],"sources":["../../../src/components/table/YDataTable.tsx"],"sourcesContent":["import { PropType, computed, defineComponent, provide, toRef } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { useResizeObserver } from '../../composables/resize-observer';\nimport { toStyleSizeValue } from '../../util';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { YDataTableBody } from './YDataTableBody';\nimport { YDataTableControl } from './YDataTableControl';\nimport { YDataTableHead, pressYDataTableHeadProps } from './YDataTableHead';\nimport { YDataTableLayer } from './YDataTableLayer';\nimport { YTable, pressYTableProps } from './YTable';\nimport { createHeader, pressDataTableHeader } from './composibles/header';\nimport { pressDataTableItemsProps, useItems } from './composibles/items';\nimport { useOptions } from './composibles/options';\nimport {\n  createPagination,\n  pressDataTablePaginationProps,\n  providePagination,\n  usePaginatedItems,\n} from './composibles/pagination';\nimport {\n  pressDataTableSelectionProps,\n  provideSelection,\n} from './composibles/selection';\nimport {\n  createSorting,\n  pressDataTableSortProps,\n  provideSorting,\n} from './composibles/sorting';\nimport { YDataTableSlotProps } from './types';\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': (page: number) => true,\n    'update:pageSize': (pageSize: number) => true,\n    'update:sortBy': (sortBy: any) => true,\n    'update:options': (options: any) => true,\n    'click:row': (e: Event, value: { row: any }) => true,\n  },\n  setup(props, { slots, emit }) {\n    const { page, pageSize } = createPagination(props);\n    const { sortBy, multiSort } = createSorting(props);\n    const { columns, headers } = createHeader(props, {\n      enableSelect: toRef(props, 'enableSelect'),\n    });\n    const { items } = useItems(props, columns);\n\n    const { toggleSort } = provideSorting({ sortBy, multiSort, page });\n    const total = computed(() => items.value.length);\n    const { startIndex, endIndex, pageLength, setPageSize, setPage } =\n      providePagination({\n        page,\n        pageSize,\n        total,\n      });\n    const { paginatedItems } = usePaginatedItems({\n      items,\n      startIndex,\n      endIndex,\n      pageSize,\n    });\n    const {\n      isSelected,\n      select,\n      selectAll,\n      toggleSelect,\n      someSelected,\n      allSelected,\n    } = provideSelection(props, { allItems: items, pageItems: items });\n\n    const { resizeObservedRef: headObserveRef, contentRect: headRect } = useResizeObserver();\n\n    useOptions(\n      {\n        page,\n        pageSize,\n        search: toRef(props, 'search'),\n        sortBy,\n      },\n      emit,\n    );\n\n    provide('y-data-table', {\n      toggleSort,\n      sortBy,\n      headRect,\n    });\n\n    const slotProps = computed<YDataTableSlotProps>(() => {\n      return {\n        // pagination\n        page: page.value,\n        pageSize: pageSize.value,\n        pageLength: pageLength.value,\n        setPageSize,\n        setPage,\n        // sorting\n        sortBy: sortBy.value,\n        toggleSort,\n        // selection\n        someSelected: someSelected.value,\n        allSelected: allSelected.value,\n        isSelected,\n        select,\n        selectAll,\n        toggleSelect,\n        //\n        items: items.value,\n        columns: columns.value,\n        headers: headers.value,\n      };\n    });\n    const yDataTableHeadProps = chooseProps(props, YDataTableHead.props);\n    const yDataTableBodyProps = chooseProps(props, YDataTableBody.props);\n    const yTableProps = chooseProps(props, YTable.props);\n    useRender(() => {\n      return (\n        <YTable\n          class={['y-data-table']}\n          {...yTableProps}\n          style={{\n            '--y-table-head-height': toStyleSizeValue(\n              headRect.value?.height,\n            ),\n          }}\n        >\n          {{\n            top: () => slots.top?.(slotProps.value),\n            leading: () =>\n              slots.leading ? (\n                slots.leading(slotProps.value)\n              ) : (\n                <>\n                  <YDataTableLayer\n                    v-slots={slots}\n                    slot-props={slotProps.value}\n                  ></YDataTableLayer>\n                </>\n              ),\n            default: () =>\n              slots.default ? (\n                slots.default(slotProps.value)\n              ) : (\n                <>\n                  <thead ref={headObserveRef}>\n                    <YDataTableHead\n                      v-slots={slots}\n                      {...yDataTableHeadProps}\n                    ></YDataTableHead>\n                  </thead>\n                  {slots.thead?.(slotProps.value)}\n                  <tbody>\n                    <YDataTableBody\n                      v-slots={slots}\n                      {...yDataTableBodyProps}\n                      items={paginatedItems.value}\n                    ></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                    append: slots['control.append'],\n                  }}\n                ></YDataTableControl>\n              ),\n          }}\n        </YTable>\n      );\n    });\n    return { paginatedItems };\n  },\n});\n\nexport type YDataTable = InstanceType<typeof YDataTable>;\n"],"mappings":"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"}

package/lib/components/table/YDataTableLayer.mjs

@@ -1,14 +1,28 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from 'vue';
+import { createVNode as _createVNode, Fragment as _Fragment } from "vue";
+import { defineComponent, inject } from 'vue';
 import { useRender } from "../../composables/component.mjs";
 export const YDataTableLayer = defineComponent({
   name: 'YDataTableLayer',
-  setup() {
+  props: {
+    slotProps: Object
+  },
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const YTableWire = inject('YTable');
     useRender(() => {
       return _createVNode("div", {
         "class": ['y-data-table-layer']
-      }, null);
+      }, [slots.layer ? slots.layer?.(props.slotProps) : _createVNode(_Fragment, null, [_createVNode("div", {
+        "class": ['y-data-table-layer__head']
+      }, [slots['layer-head']?.(props.slotProps)]), _createVNode("div", {
+        "class": ['y-data-table-layer__body']
+      }, [slots['layer-body']?.(props.slotProps)])])]);
     });
+    return {
+      YTableWire
+    };
   }
 });
 //# sourceMappingURL=YDataTableLayer.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"YDataTableLayer.mjs","names":["defineComponent","useRender","YDataTableLayer","name","setup","_createVNode"],"sources":["../../../src/components/table/YDataTableLayer.tsx"],"sourcesContent":["import { defineComponent } from 'vue';\r\n\r\nimport { useRender } from '../../composables/component';\r\n\r\nexport const YDataTableLayer = defineComponent({\r\n  name: 'YDataTableLayer',\r\n  setup() {\r\n    useRender(() => {\r\n      return <div class={['y-data-table-layer']}></div>;\r\n    });\r\n  },\r\n});\r\n\r\nexport type YDataTableLayer = InstanceType<typeof YDataTableLayer>;\r\n"],"mappings":";AAAA,SAASA,eAAe,QAAQ,KAAK;AAAC,SAE7BC,SAAS;AAElB,OAAO,MAAMC,eAAe,GAAGF,eAAe,CAAC;EAC7CG,IAAI,EAAE,iBAAiB;EACvBC,KAAKA,CAAA,EAAG;IACNH,SAAS,CAAC,MAAM;MACd,OAAAI,YAAA;QAAA,SAAmB,CAAC,oBAAoB;MAAC;IAC3C,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
+{"version":3,"file":"YDataTableLayer.mjs","names":["defineComponent","inject","useRender","YDataTableLayer","name","props","slotProps","Object","setup","_ref","slots","YTableWire","_createVNode","layer","_Fragment"],"sources":["../../../src/components/table/YDataTableLayer.tsx"],"sourcesContent":["import { defineComponent, inject } from 'vue';\nimport type { PropType, Ref } from 'vue';\n\nimport { useRender } from '../../composables/component';\n\nexport const YDataTableLayer = defineComponent({\n  name: 'YDataTableLayer',\n  props: {\n    slotProps: Object as PropType<any>,\n  },\n  setup(props, { slots }) {\n    const YTableWire = inject<{ containerRect: Ref<DOMRect> }>('YTable');\n\n    useRender(() => {\n      return (\n        <div class={['y-data-table-layer']}>\n          {slots.layer ? (\n            slots.layer?.(props.slotProps)\n          ) : (\n            <>\n              <div class={['y-data-table-layer__head']}>\n                {slots['layer-head']?.(props.slotProps)}\n              </div>\n              <div class={['y-data-table-layer__body']}>\n                {slots['layer-body']?.(props.slotProps)}\n              </div>\n            </>\n          )}\n        </div>\n      );\n    });\n\n    return {\n      YTableWire,\n    };\n  },\n});\n\nexport type YDataTableLayer = InstanceType<typeof YDataTableLayer>;\n"],"mappings":";AAAA,SAASA,eAAe,EAAEC,MAAM,QAAQ,KAAK;AAAC,SAGrCC,SAAS;AAElB,OAAO,MAAMC,eAAe,GAAGH,eAAe,CAAC;EAC7CI,IAAI,EAAE,iBAAiB;EACvBC,KAAK,EAAE;IACLC,SAAS,EAAEC;EACb,CAAC;EACDC,KAAKA,CAACH,KAAK,EAAAI,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACpB,MAAME,UAAU,GAAGV,MAAM,CAAkC,QAAQ,CAAC;IAEpEC,SAAS,CAAC,MAAM;MACd,OAAAU,YAAA;QAAA,SACc,CAAC,oBAAoB;MAAC,IAC/BF,KAAK,CAACG,KAAK,GACVH,KAAK,CAACG,KAAK,GAAGR,KAAK,CAACC,SAAS,CAAC,GAAAM,YAAA,CAAAE,SAAA,SAAAF,YAAA;QAAA,SAGhB,CAAC,0BAA0B;MAAC,IACrCF,KAAK,CAAC,YAAY,CAAC,GAAGL,KAAK,CAACC,SAAS,CAAC,IAAAM,YAAA;QAAA,SAE7B,CAAC,0BAA0B;MAAC,IACrCF,KAAK,CAAC,YAAY,CAAC,GAAGL,KAAK,CAACC,SAAS,CAAC,IAG5C;IAGP,CAAC,CAAC;IAEF,OAAO;MACLK;IACF,CAAC;EACH;AACF,CAAC,CAAC"}

package/lib/components/table/YDataTableServer.mjs

@@ -2,6 +2,8 @@ import { mergeProps as _mergeProps, createVNode as _createVNode, resolveDirectiv
 import { toRef } from '@vue/runtime-core';
 import { computed, defineComponent, provide } from 'vue';
 import { useRender } from "../../composables/component.mjs";
+import { useResizeObserver } from "../../composables/resize-observer.mjs";
+import { toStyleSizeValue } from "../../util/index.mjs";
 import { chooseProps, propsFactory } from "../../util/vue-component.mjs";
 import { pressDataTableProps } from "./YDataTable.mjs";
 import { YDataTableBody } from "./YDataTableBody.mjs";
@@ -10,11 +12,11 @@ import { YDataTableHead } from "./YDataTableHead.mjs";
 import { YDataTableLayer } from "./YDataTableLayer.mjs";
 import { YTable } from "./YTable.mjs";
 import { createHeader } from "./composibles/header.mjs";
+import { useItems } from "./composibles/items.mjs";
+import { useOptions } from "./composibles/options.mjs";
 import { createPagination, pressDataTablePaginationProps, providePagination } from "./composibles/pagination.mjs";
 import { provideSelection } from "./composibles/selection.mjs";
 import { createSorting, provideSorting } from "./composibles/sorting.mjs";
-import { useItems } from "./composibles/items.mjs";
-import { useOptions } from "./composibles/options.mjs";
 export const pressDataTableServerProps = propsFactory({
   total: {
     type: [Number, String],
@@ -93,6 +95,10 @@ export const YDataTableServer = defineComponent({
       allItems: items,
       pageItems: items
     });
+    const {
+      resizeObservedRef: headObserveRef,
+      contentRect: headRect
+    } = useResizeObserver();
     useOptions({
       page,
       pageSize,
@@ -101,7 +107,8 @@ export const YDataTableServer = defineComponent({
     }, emit);
     provide('y-data-table', {
       toggleSort,
-      sortBy
+      sortBy,
+      headRect
     });
     const slotProps = computed(() => {
       return {
@@ -133,10 +140,16 @@ export const YDataTableServer = defineComponent({
       const yTableProps = chooseProps(props, YTable.props);
       return _createVNode(YTable, _mergeProps({
         "class": ['y-data-table']
-      }, yTableProps), {
+      }, yTableProps, {
+        "style": {
+          '--y-table-head-height': toStyleSizeValue(headRect.value?.height)
+        }
+      }), {
         top: () => slots.top?.(slotProps.value),
         leading: () => slots.leading ? slots.leading(slotProps.value) : _createVNode(_Fragment, null, [_createVNode(YDataTableLayer, null, slots)]),
-        default: () => slots.default ? slots.default(slotProps.value) : _createVNode(_Fragment, null, [_createVNode("thead", null, [_createVNode(YDataTableHead, yDataTableHeadProps, slots)]), slots.thead?.(slotProps.value), _createVNode("tbody", null, [_createVNode(YDataTableBody, _mergeProps(yDataTableBodyProps, {
+        default: () => slots.default ? slots.default(slotProps.value) : _createVNode(_Fragment, null, [_createVNode("thead", {
+          "ref": headObserveRef
+        }, [_createVNode(YDataTableHead, yDataTableHeadProps, slots)]), slots.thead?.(slotProps.value), _createVNode("tbody", null, [_createVNode(YDataTableBody, _mergeProps(yDataTableBodyProps, {
           "items": items.value
         }), slots)]), slots.tbody?.(slotProps.value), slots.tfoot?.(slotProps.value)]),
         trailing: () => slots.trailing?.(slotProps.value),

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

@@ -1 +1 @@
-{"version":3,"file":"YDataTableServer.mjs","names":["toRef","computed","defineComponent","provide","useRender","chooseProps","propsFactory","pressDataTableProps","YDataTableBody","YDataTableControl","YDataTableHead","YDataTableLayer","YTable","createHeader","createPagination","pressDataTablePaginationProps","providePagination","provideSelection","createSorting","provideSorting","useItems","useOptions","pressDataTableServerProps","total","type","Number","String","required","YDataTableServer","name","components","props","emits","value","page","pageSize","sortBy","options","click:row","e","setup","_ref","slots","emit","multiSort","parseInt","columns","headers","enableSelect","items","toggleSort","pageLength","setPageSize","setPage","isSelected","select","selectAll","toggleSelect","someSelected","allSelected","allItems","pageItems","search","slotProps","yDataTableHeadProps","yDataTableBodyProps","yTableProps","_createVNode","_mergeProps","top","leading","_Fragment","default","thead","tbody","tfoot","trailing","bottom","prepend"],"sources":["../../../src/components/table/YDataTableServer.tsx"],"sourcesContent":["import { toRef } from '@vue/runtime-core';\nimport { PropType, computed, defineComponent, provide } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { pressDataTableProps } from './YDataTable';\nimport { YDataTableBody } from './YDataTableBody';\nimport { YDataTableControl } from './YDataTableControl';\nimport { YDataTableHead } from './YDataTableHead';\nimport { YDataTableLayer } from './YDataTableLayer';\nimport { YTable } from './YTable';\nimport { createHeader } from './composibles/header';\nimport {\n  createPagination,\n  pressDataTablePaginationProps,\n  providePagination,\n} from './composibles/pagination';\nimport { provideSelection } from './composibles/selection';\nimport { createSorting, provideSorting } from './composibles/sorting';\n\nimport { useItems } from './composibles/items';\nimport { useOptions } from './composibles/options';\nimport { YDataTableSlotProps } from './types';\n\nexport const pressDataTableServerProps = propsFactory(\n  {\n    total: {\n      type: [Number, String] as PropType<number | string>,\n      required: true,\n    },\n    ...pressDataTablePaginationProps(),\n    ...pressDataTableProps(),\n  },\n  'YDataTableServer',\n);\n\nexport const YDataTableServer = defineComponent({\n  name: 'YDataTableServer',\n  components: {\n    YTable,\n    YDataTableLayer,\n    YDataTableHead,\n    YDataTableBody,\n    YDataTableControl,\n  },\n  props: {\n    ...pressDataTableServerProps(),\n  },\n  emits: {\n    'update:modelValue': (value: any[]) => true,\n    'update:page': (page: number) => true,\n    'update:pageSize': (pageSize: number) => true,\n    'update:sortBy': (sortBy: any) => true,\n    'update:options': (options: any) => true,\n    'click:row': (e: Event, value: { row: any }) => true,\n  },\n  setup(props, { slots, emit }) {\n    const { page, pageSize } = createPagination(props);\n    const { sortBy, multiSort } = createSorting(props);\n    const total = computed(() => parseInt(props.total as string));\n    const { columns, headers } = createHeader(props, {\n      enableSelect: toRef(props, 'enableSelect'),\n    });\n    const { items } = useItems(props, columns);\n\n    const { toggleSort } = provideSorting({ sortBy, multiSort, page });\n    const { pageLength, setPageSize, setPage } = providePagination({\n      page,\n      pageSize,\n      total,\n    });\n    const {\n      isSelected,\n      select,\n      selectAll,\n      toggleSelect,\n      someSelected,\n      allSelected,\n    } = provideSelection(props, { allItems: items, pageItems: items });\n\n    useOptions(\n      {\n        page,\n        pageSize,\n        search: toRef(props, 'search'),\n        sortBy,\n      },\n      emit,\n    );\n\n    provide('y-data-table', {\n      toggleSort,\n      sortBy,\n    });\n\n    const slotProps = computed<YDataTableSlotProps>(() => {\n      return {\n        // pagination\n        page: page.value,\n        pageSize: pageSize.value,\n        pageLength: pageLength.value,\n        setPageSize,\n        setPage,\n        // sorting\n        sortBy: sortBy.value,\n        toggleSort,\n        // selection\n        someSelected: someSelected.value,\n        allSelected: allSelected.value,\n        isSelected,\n        select,\n        selectAll,\n        toggleSelect,\n        //\n        items: items.value,\n        columns: columns.value,\n        headers: headers.value,\n      };\n    });\n\n    useRender(() => {\n      const yDataTableHeadProps = chooseProps(props, YDataTableHead.props);\n      const yDataTableBodyProps = chooseProps(props, YDataTableBody.props);\n      const yTableProps = chooseProps(props, YTable.props);\n      return (\n        <YTable class={['y-data-table']} {...yTableProps}>\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\n                      v-slots={slots}\n                      {...yDataTableHeadProps}\n                    ></YDataTableHead>\n                  </thead>\n                  {slots.thead?.(slotProps.value)}\n                  <tbody>\n                    <YDataTableBody\n                      v-slots={slots}\n                      {...yDataTableBodyProps}\n                      items={items.value}\n                    ></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 YDataTableServer = InstanceType<typeof YDataTableServer>;\n"],"mappings":"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"}
+{"version":3,"file":"YDataTableServer.mjs","names":["toRef","computed","defineComponent","provide","useRender","useResizeObserver","toStyleSizeValue","chooseProps","propsFactory","pressDataTableProps","YDataTableBody","YDataTableControl","YDataTableHead","YDataTableLayer","YTable","createHeader","useItems","useOptions","createPagination","pressDataTablePaginationProps","providePagination","provideSelection","createSorting","provideSorting","pressDataTableServerProps","total","type","Number","String","required","YDataTableServer","name","components","props","emits","value","page","pageSize","sortBy","options","click:row","e","setup","_ref","slots","emit","multiSort","parseInt","columns","headers","enableSelect","items","toggleSort","pageLength","setPageSize","setPage","isSelected","select","selectAll","toggleSelect","someSelected","allSelected","allItems","pageItems","resizeObservedRef","headObserveRef","contentRect","headRect","search","slotProps","yDataTableHeadProps","yDataTableBodyProps","yTableProps","_createVNode","_mergeProps","height","top","leading","_Fragment","default","thead","tbody","tfoot","trailing","bottom","prepend"],"sources":["../../../src/components/table/YDataTableServer.tsx"],"sourcesContent":["import { toRef } from '@vue/runtime-core';\nimport { PropType, computed, defineComponent, provide } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { useResizeObserver } from '../../composables/resize-observer';\nimport { toStyleSizeValue } from '../../util';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { pressDataTableProps } from './YDataTable';\nimport { YDataTableBody } from './YDataTableBody';\nimport { YDataTableControl } from './YDataTableControl';\nimport { YDataTableHead } from './YDataTableHead';\nimport { YDataTableLayer } from './YDataTableLayer';\nimport { YTable } from './YTable';\nimport { createHeader } from './composibles/header';\nimport { useItems } from './composibles/items';\nimport { useOptions } from './composibles/options';\nimport {\n  createPagination,\n  pressDataTablePaginationProps,\n  providePagination,\n} from './composibles/pagination';\nimport { provideSelection } from './composibles/selection';\nimport { createSorting, provideSorting } from './composibles/sorting';\nimport { YDataTableSlotProps } from './types';\n\nexport const pressDataTableServerProps = propsFactory(\n  {\n    total: {\n      type: [Number, String] as PropType<number | string>,\n      required: true,\n    },\n    ...pressDataTablePaginationProps(),\n    ...pressDataTableProps(),\n  },\n  'YDataTableServer',\n);\n\nexport const YDataTableServer = defineComponent({\n  name: 'YDataTableServer',\n  components: {\n    YTable,\n    YDataTableLayer,\n    YDataTableHead,\n    YDataTableBody,\n    YDataTableControl,\n  },\n  props: {\n    ...pressDataTableServerProps(),\n  },\n  emits: {\n    'update:modelValue': (value: any[]) => true,\n    'update:page': (page: number) => true,\n    'update:pageSize': (pageSize: number) => true,\n    'update:sortBy': (sortBy: any) => true,\n    'update:options': (options: any) => true,\n    'click:row': (e: Event, value: { row: any }) => true,\n  },\n  setup(props, { slots, emit }) {\n    const { page, pageSize } = createPagination(props);\n    const { sortBy, multiSort } = createSorting(props);\n    const total = computed(() => parseInt(props.total as string));\n    const { columns, headers } = createHeader(props, {\n      enableSelect: toRef(props, 'enableSelect'),\n    });\n    const { items } = useItems(props, columns);\n\n    const { toggleSort } = provideSorting({ sortBy, multiSort, page });\n    const { pageLength, setPageSize, setPage } = providePagination({\n      page,\n      pageSize,\n      total,\n    });\n    const {\n      isSelected,\n      select,\n      selectAll,\n      toggleSelect,\n      someSelected,\n      allSelected,\n    } = provideSelection(props, { allItems: items, pageItems: items });\n\n    const { resizeObservedRef: headObserveRef, contentRect: headRect } =\n      useResizeObserver();\n\n    useOptions(\n      {\n        page,\n        pageSize,\n        search: toRef(props, 'search'),\n        sortBy,\n      },\n      emit,\n    );\n\n    provide('y-data-table', {\n      toggleSort,\n      sortBy,\n      headRect,\n    });\n\n    const slotProps = computed<YDataTableSlotProps>(() => {\n      return {\n        // pagination\n        page: page.value,\n        pageSize: pageSize.value,\n        pageLength: pageLength.value,\n        setPageSize,\n        setPage,\n        // sorting\n        sortBy: sortBy.value,\n        toggleSort,\n        // selection\n        someSelected: someSelected.value,\n        allSelected: allSelected.value,\n        isSelected,\n        select,\n        selectAll,\n        toggleSelect,\n        //\n        items: items.value,\n        columns: columns.value,\n        headers: headers.value,\n      };\n    });\n\n    useRender(() => {\n      const yDataTableHeadProps = chooseProps(props, YDataTableHead.props);\n      const yDataTableBodyProps = chooseProps(props, YDataTableBody.props);\n      const yTableProps = chooseProps(props, YTable.props);\n      return (\n        <YTable\n          class={['y-data-table']}\n          {...yTableProps}\n          style={{\n            '--y-table-head-height': toStyleSizeValue(headRect.value?.height),\n          }}\n        >\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 ref={headObserveRef}>\n                    <YDataTableHead\n                      v-slots={slots}\n                      {...yDataTableHeadProps}\n                    ></YDataTableHead>\n                  </thead>\n                  {slots.thead?.(slotProps.value)}\n                  <tbody>\n                    <YDataTableBody\n                      v-slots={slots}\n                      {...yDataTableBodyProps}\n                      items={items.value}\n                    ></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 YDataTableServer = InstanceType<typeof YDataTableServer>;\n"],"mappings":"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"}

package/lib/components/table/YTable.mjs

@@ -1,10 +1,10 @@
 import { createVNode as _createVNode } from "vue";
-import { defineComponent } from 'vue';
+import { defineComponent, provide } from 'vue';
 import { useRender } from "../../composables/component.mjs";
 import { useResizeObserver } from "../../composables/resize-observer.mjs";
 import { toStyleSizeValue } from "../../util/ui.mjs";
-import "./YTable.scss";
 import { propsFactory } from "../../util/vue-component.mjs";
+import "./YTable.scss";
 export const pressYTableProps = propsFactory({
   tag: {
     type: String,
@@ -33,6 +33,9 @@ export const YTable = defineComponent({
       resizeObservedRef,
       contentRect
     } = useResizeObserver();
+    provide('YTable', {
+      containerRect: contentRect
+    });
     useRender(() => {
       const ElTag = props.tag ?? 'div';
       const containerHeight = props.flexHeight ? contentRect.value?.height ?? props.height : props.height;

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

@@ -1 +1 @@
-{"version":3,"file":"YTable.mjs","names":["defineComponent","useRender","useResizeObserver","toStyleSizeValue","propsFactory","pressYTableProps","tag","type","String","default","fixedHead","Boolean","height","Number","flexHeight","YTable","name","props","setup","_ref","slots","resizeObservedRef","contentRect","ElTag","containerHeight","value","_createVNode","top","leading","trailing","container","bottom"],"sources":["../../../src/components/table/YTable.tsx"],"sourcesContent":["import { PropType, computed, defineComponent } from 'vue';\r\n\r\nimport { useRender } from '../../composables/component';\r\nimport { useResizeObserver } from '../../composables/resize-observer';\r\nimport { toStyleSizeValue } from '../../util/ui';\r\nimport './YTable.scss';\r\nimport { propsFactory } from \"../../util/vue-component\";\r\n\r\nexport const pressYTableProps = propsFactory({\r\n  tag: {\r\n    type: String as PropType<string>,\r\n    default: 'div',\r\n  },\r\n  fixedHead: {\r\n    type: Boolean as PropType<boolean>,\r\n  },\r\n  height: {\r\n    type: [Number, String] as PropType<number | string>,\r\n  },\r\n  flexHeight: {\r\n    type: Boolean as PropType<boolean>,\r\n  },\r\n}, 'YTable')\r\n\r\nexport const YTable = defineComponent({\r\n  name: 'YTable',\r\n  props: {\r\n    ...pressYTableProps(),\r\n  },\r\n  setup(props, { slots }) {\r\n    const { resizeObservedRef, contentRect } = useResizeObserver();\r\n    useRender(() => {\r\n      const ElTag = (props.tag as keyof HTMLElementTagNameMap) ?? 'div';\r\n      const containerHeight = props.flexHeight\r\n        ? (contentRect.value?.height ?? props.height)\r\n        : props.height;\r\n      return (\r\n        <ElTag\r\n          class={[\r\n            'y-table',\r\n            {\r\n              'y-table--fixed-head': props.fixedHead,\r\n              'y-table--fixed-height': props.flexHeight || props.height,\r\n              'y-table--flex-height': props.flexHeight,\r\n            },\r\n          ]}\r\n        >\r\n          {slots.top?.()}\r\n          {slots.default ? (\r\n            <div\r\n              class={['y-table__container']}\r\n              ref={resizeObservedRef}\r\n              style={{\r\n                height: toStyleSizeValue(containerHeight),\r\n              }}\r\n            >\r\n              {slots.leading?.()}\r\n              <table>{slots.default()}</table>\r\n              {slots.trailing?.()}\r\n            </div>\r\n          ) : (\r\n            slots.container?.(resizeObservedRef, contentRect)\r\n          )}\r\n          {slots.bottom?.()}\r\n        </ElTag>\r\n      );\r\n    });\r\n  },\r\n});\r\n"],"mappings":";AAAA,SAA6BA,eAAe,QAAQ,KAAK;AAAC,SAEjDC,SAAS;AAAA,SACTC,iBAAiB;AAAA,SACjBC,gBAAgB;AACzB;AAAuB,SACdC,YAAY;AAErB,OAAO,MAAMC,gBAAgB,GAAGD,YAAY,CAAC;EAC3CE,GAAG,EAAE;IACHC,IAAI,EAAEC,MAA0B;IAChCC,OAAO,EAAE;EACX,CAAC;EACDC,SAAS,EAAE;IACTH,IAAI,EAAEI;EACR,CAAC;EACDC,MAAM,EAAE;IACNL,IAAI,EAAE,CAACM,MAAM,EAAEL,MAAM;EACvB,CAAC;EACDM,UAAU,EAAE;IACVP,IAAI,EAAEI;EACR;AACF,CAAC,EAAE,QAAQ,CAAC;AAEZ,OAAO,MAAMI,MAAM,GAAGf,eAAe,CAAC;EACpCgB,IAAI,EAAE,QAAQ;EACdC,KAAK,EAAE;IACL,GAAGZ,gBAAgB,CAAC;EACtB,CAAC;EACDa,KAAKA,CAACD,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACpB,MAAM;MAAEE,iBAAiB;MAAEC;IAAY,CAAC,GAAGpB,iBAAiB,CAAC,CAAC;IAC9DD,SAAS,CAAC,MAAM;MACd,MAAMsB,KAAK,GAAIN,KAAK,CAACX,GAAG,IAAoC,KAAK;MACjE,MAAMkB,eAAe,GAAGP,KAAK,CAACH,UAAU,GACnCQ,WAAW,CAACG,KAAK,EAAEb,MAAM,IAAIK,KAAK,CAACL,MAAM,GAC1CK,KAAK,CAACL,MAAM;MAChB,OAAAc,YAAA,CAAAH,KAAA;QAAA,SAEW,CACL,SAAS,EACT;UACE,qBAAqB,EAAEN,KAAK,CAACP,SAAS;UACtC,uBAAuB,EAAEO,KAAK,CAACH,UAAU,IAAIG,KAAK,CAACL,MAAM;UACzD,sBAAsB,EAAEK,KAAK,CAACH;QAChC,CAAC;MACF;QAAAL,OAAA,EAAAA,CAAA,MAEAW,KAAK,CAACO,GAAG,GAAG,CAAC,EACbP,KAAK,CAACX,OAAO,GAAAiB,YAAA;UAAA,SAEH,CAAC,oBAAoB,CAAC;UAAA,OACxBL,iBAAiB;UAAA,SACf;YACLT,MAAM,EAAET,gBAAgB,CAACqB,eAAe;UAC1C;QAAC,IAEAJ,KAAK,CAACQ,OAAO,GAAG,CAAC,EAAAF,YAAA,iBACVN,KAAK,CAACX,OAAO,CAAC,CAAC,IACtBW,KAAK,CAACS,QAAQ,GAAG,CAAC,KAGrBT,KAAK,CAACU,SAAS,GAAGT,iBAAiB,EAAEC,WAAW,CACjD,EACAF,KAAK,CAACW,MAAM,GAAG,CAAC;MAAA;IAGvB,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
+{"version":3,"file":"YTable.mjs","names":["defineComponent","provide","useRender","useResizeObserver","toStyleSizeValue","propsFactory","pressYTableProps","tag","type","String","default","fixedHead","Boolean","height","Number","flexHeight","YTable","name","props","setup","_ref","slots","resizeObservedRef","contentRect","containerRect","ElTag","containerHeight","value","_createVNode","top","leading","trailing","container","bottom"],"sources":["../../../src/components/table/YTable.tsx"],"sourcesContent":["import { PropType, defineComponent, provide } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { useResizeObserver } from '../../composables/resize-observer';\nimport { toStyleSizeValue } from '../../util/ui';\nimport { propsFactory } from '../../util/vue-component';\n\nimport './YTable.scss';\n\nexport const pressYTableProps = propsFactory(\n  {\n    tag: {\n      type: String as PropType<string>,\n      default: 'div',\n    },\n    fixedHead: {\n      type: Boolean as PropType<boolean>,\n    },\n    height: {\n      type: [Number, String] as PropType<number | string>,\n    },\n    flexHeight: {\n      type: Boolean as PropType<boolean>,\n    },\n  },\n  'YTable',\n);\n\nexport const YTable = defineComponent({\n  name: 'YTable',\n  props: {\n    ...pressYTableProps(),\n  },\n  setup(props, { slots }) {\n    const { resizeObservedRef, contentRect } = useResizeObserver();\n    provide('YTable', { containerRect: contentRect });\n    useRender(() => {\n      const ElTag = (props.tag as keyof HTMLElementTagNameMap) ?? 'div';\n      const containerHeight = props.flexHeight\n        ? contentRect.value?.height ?? props.height\n        : props.height;\n      return (\n        <ElTag\n          class={[\n            'y-table',\n            {\n              'y-table--fixed-head': props.fixedHead,\n              'y-table--fixed-height': props.flexHeight || props.height,\n              'y-table--flex-height': props.flexHeight,\n            },\n          ]}\n        >\n          {slots.top?.()}\n          {slots.default ? (\n            <div\n              class={['y-table__container']}\n              ref={resizeObservedRef}\n              style={{\n                height: toStyleSizeValue(containerHeight),\n              }}\n            >\n              {slots.leading?.()}\n              <table>{slots.default()}</table>\n              {slots.trailing?.()}\n            </div>\n          ) : (\n            slots.container?.(resizeObservedRef, contentRect)\n          )}\n          {slots.bottom?.()}\n        </ElTag>\n      );\n    });\n  },\n});\n"],"mappings":";AAAA,SAAmBA,eAAe,EAAEC,OAAO,QAAQ,KAAK;AAAC,SAEhDC,SAAS;AAAA,SACTC,iBAAiB;AAAA,SACjBC,gBAAgB;AAAA,SAChBC,YAAY;AAErB;AAEA,OAAO,MAAMC,gBAAgB,GAAGD,YAAY,CAC1C;EACEE,GAAG,EAAE;IACHC,IAAI,EAAEC,MAA0B;IAChCC,OAAO,EAAE;EACX,CAAC;EACDC,SAAS,EAAE;IACTH,IAAI,EAAEI;EACR,CAAC;EACDC,MAAM,EAAE;IACNL,IAAI,EAAE,CAACM,MAAM,EAAEL,MAAM;EACvB,CAAC;EACDM,UAAU,EAAE;IACVP,IAAI,EAAEI;EACR;AACF,CAAC,EACD,QACF,CAAC;AAED,OAAO,MAAMI,MAAM,GAAGhB,eAAe,CAAC;EACpCiB,IAAI,EAAE,QAAQ;EACdC,KAAK,EAAE;IACL,GAAGZ,gBAAgB,CAAC;EACtB,CAAC;EACDa,KAAKA,CAACD,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACpB,MAAM;MAAEE,iBAAiB;MAAEC;IAAY,CAAC,GAAGpB,iBAAiB,CAAC,CAAC;IAC9DF,OAAO,CAAC,QAAQ,EAAE;MAAEuB,aAAa,EAAED;IAAY,CAAC,CAAC;IACjDrB,SAAS,CAAC,MAAM;MACd,MAAMuB,KAAK,GAAIP,KAAK,CAACX,GAAG,IAAoC,KAAK;MACjE,MAAMmB,eAAe,GAAGR,KAAK,CAACH,UAAU,GACpCQ,WAAW,CAACI,KAAK,EAAEd,MAAM,IAAIK,KAAK,CAACL,MAAM,GACzCK,KAAK,CAACL,MAAM;MAChB,OAAAe,YAAA,CAAAH,KAAA;QAAA,SAEW,CACL,SAAS,EACT;UACE,qBAAqB,EAAEP,KAAK,CAACP,SAAS;UACtC,uBAAuB,EAAEO,KAAK,CAACH,UAAU,IAAIG,KAAK,CAACL,MAAM;UACzD,sBAAsB,EAAEK,KAAK,CAACH;QAChC,CAAC;MACF;QAAAL,OAAA,EAAAA,CAAA,MAEAW,KAAK,CAACQ,GAAG,GAAG,CAAC,EACbR,KAAK,CAACX,OAAO,GAAAkB,YAAA;UAAA,SAEH,CAAC,oBAAoB,CAAC;UAAA,OACxBN,iBAAiB;UAAA,SACf;YACLT,MAAM,EAAET,gBAAgB,CAACsB,eAAe;UAC1C;QAAC,IAEAL,KAAK,CAACS,OAAO,GAAG,CAAC,EAAAF,YAAA,iBACVP,KAAK,CAACX,OAAO,CAAC,CAAC,IACtBW,KAAK,CAACU,QAAQ,GAAG,CAAC,KAGrBV,KAAK,CAACW,SAAS,GAAGV,iBAAiB,EAAEC,WAAW,CACjD,EACAF,KAAK,CAACY,MAAM,GAAG,CAAC;MAAA;IAGvB,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}

package/lib/components/table/YTable.scss

@@ -1,7 +1,10 @@
 $table-cell-padding: 0 16px !default;
 $table-head-background: var(--y-theme-surface-variant, #dfe3eb) !default;
+$table-cell-border-bottom-color: rgba(var(--y-theme-outline-rgb), var(--y-theme-outline-opacity)) !default;
 
 .y-table {
+  --y-table-border-bottom-color: #{$table-cell-border-bottom-color};
+
   display: flex;
   flex-direction: column;
 
@@ -51,7 +54,7 @@ $table-head-background: var(--y-theme-surface-variant, #dfe3eb) !default;
         > th {
           height: 56px;
           text-align: left;
-          border-bottom: thin solid rgba(var(--y-theme-outline), var(--y-theme-outline-opacity));
+          border-bottom: thin solid var(--y-table-border-bottom-color);
           user-select: none;
         }
       }
@@ -59,7 +62,7 @@ $table-head-background: var(--y-theme-surface-variant, #dfe3eb) !default;
       > tbody > tr {
         &:not(:last-child) {
           > td {
-            border-bottom: thin solid rgba(var(--y-theme-outline), var(--y-theme-outline-opacity));
+            border-bottom: thin solid var(--y-table-border-bottom-color);
           }
         }
         > td {
@@ -113,3 +116,31 @@ $table-head-background: var(--y-theme-surface-variant, #dfe3eb) !default;
     }
   }
 }
+
+.y-data-table-layer {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  pointer-events: none;
+  overflow-y: clip;
+  overflow-x: visible;
+  z-index: 50;
+
+  &__head {
+    position: absolute;
+    top: 0;
+    right: 0;
+    left: 0;
+    height: var(--y-table-head-height, 48px);
+  }
+
+  &__body {
+    position: absolute;
+    top: var(--y-table-head-height, 48px);
+    right: 0;
+    left: 0;
+    bottom: 0;
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yuyeon",
-  "version": "0.0.31",
+  "version": "0.0.33",
   "keywords": [
     "UI Library",
     "Vue"

package/types/components/select/YSelect.d.ts

@@ -13,6 +13,7 @@ export declare const pressSelectPropsOptions: <Defaults extends {
     multiple?: unknown;
     weakEquals?: unknown;
     valueEquals?: unknown;
+    defaultSelect?: unknown;
 } = {}>(defaults?: Defaults | undefined) => {
     returnItem: unknown extends Defaults["returnItem"] ? BooleanConstructor : {
         type: PropType<unknown extends Defaults["returnItem"] ? boolean : boolean | Defaults["returnItem"]>;
@@ -92,6 +93,10 @@ export declare const pressSelectPropsOptions: <Defaults extends {
         type: PropType<unknown extends Defaults["valueEquals"] ? SelectEquals : SelectEquals | Defaults["valueEquals"]>;
         default: unknown extends Defaults["valueEquals"] ? SelectEquals : SelectEquals | Defaults["valueEquals"];
     };
+    defaultSelect: unknown extends Defaults["defaultSelect"] ? BooleanConstructor : {
+        type: PropType<unknown extends Defaults["defaultSelect"] ? boolean : boolean | Defaults["defaultSelect"]>;
+        default: unknown extends Defaults["defaultSelect"] ? boolean : boolean | Defaults["defaultSelect"];
+    };
 };
 export declare const pressYSelectPropsOptions: <Defaults extends {
     position?: unknown;
@@ -136,6 +141,7 @@ export declare const pressYSelectPropsOptions: <Defaults extends {
     multiple?: unknown;
     weakEquals?: unknown;
     valueEquals?: unknown;
+    defaultSelect?: unknown;
     maxHeight?: unknown;
 } = {}>(defaults?: Defaults | undefined) => {
     position: unknown extends Defaults["position"] ? Omit<{
@@ -438,6 +444,10 @@ export declare const pressYSelectPropsOptions: <Defaults extends {
         type: PropType<unknown extends Defaults["valueEquals"] ? SelectEquals : SelectEquals | Defaults["valueEquals"]>;
         default: unknown extends Defaults["valueEquals"] ? SelectEquals : SelectEquals | Defaults["valueEquals"];
     };
+    defaultSelect: unknown extends Defaults["defaultSelect"] ? BooleanConstructor : {
+        type: PropType<unknown extends Defaults["defaultSelect"] ? boolean : boolean | Defaults["defaultSelect"]>;
+        default: unknown extends Defaults["defaultSelect"] ? boolean : boolean | Defaults["defaultSelect"];
+    };
     maxHeight: unknown extends Defaults["maxHeight"] ? {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
@@ -558,6 +568,7 @@ export declare const YSelect: import("vue").DefineComponent<{
         type: PropType<SelectEquals>;
         default: typeof deepEqual;
     };
+    defaultSelect: BooleanConstructor;
     maxHeight: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
@@ -678,6 +689,7 @@ export declare const YSelect: import("vue").DefineComponent<{
         type: PropType<SelectEquals>;
         default: typeof deepEqual;
     };
+    defaultSelect: BooleanConstructor;
     maxHeight: {
         type: (StringConstructor | NumberConstructor)[];
         default: number;
@@ -707,4 +719,5 @@ export declare const YSelect: import("vue").DefineComponent<{
     multiple: boolean;
     weakEquals: boolean;
     valueEquals: SelectEquals;
+    defaultSelect: boolean;
 }, {}>;

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

@@ -1,2 +1,11 @@
-export declare const YDataTableLayer: import("vue").DefineComponent<{}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+import type { PropType, Ref } from 'vue';
+export declare const YDataTableLayer: import("vue").DefineComponent<{
+    slotProps: PropType<any>;
+}, {
+    YTableWire: {
+        containerRect: Ref<DOMRect>;
+    } | undefined;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    slotProps: PropType<any>;
+}>>, {}, {}>;
 export type YDataTableLayer = InstanceType<typeof YDataTableLayer>;