yuyeon 0.3.2-rc.9 → 0.3.3

package/lib/components/table/YDataTable.js

@@ -1,5 +1,14 @@
 import { mergeProps as _mergeProps, createVNode as _createVNode, resolveDirective as _resolveDirective, Fragment as _Fragment } from "vue";
-import { computed, provide, ref, toRef } from 'vue';
+import { Fragment, computed, provide, ref, toRef } from 'vue';
+import { pressDataTableExpandProps, provideExpand } from "./composables/expand.js";
+import { createHeader, pressDataTableHeader } from "./composables/header.js";
+import { pressDataTableItemsProps, useItems } from "./composables/items.js";
+import { useOptions } from "./composables/options.js";
+import { createPagination, pressDataTablePaginationProps, providePagination, usePaginatedItems } from "./composables/pagination.js";
+import { YDataTableInjectionKey } from "./composables/provides.js";
+import { pressDataTableSelectionProps, provideSelection } from "./composables/selection.js";
+import { useSortedItems } from "./composables/sorted-items.js";
+import { createSorting, pressDataTableSortProps, provideSorting } from "./composables/sorting.js";
 import { useRender } from "../../composables/component.js";
 import { useResizeObserver } from "../../composables/resize-observer.js";
 import { chooseProps, defineComponent, propsFactory } from "../../util/component/index.js";
@@ -9,14 +18,6 @@ import { YDataTableControl } from "./YDataTableControl.js";
 import { YDataTableHead, pressYDataTableHeadProps } from "./YDataTableHead.js";
 import { YDataTableLayer } from "./YDataTableLayer.js";
 import { YTable, pressYTableProps } from "./YTable.js";
-import { createHeader, pressDataTableHeader } from "./composables/header.js";
-import { pressDataTableItemsProps, useItems } from "./composables/items.js";
-import { useOptions } from "./composables/options.js";
-import { createPagination, pressDataTablePaginationProps, providePagination, usePaginatedItems } from "./composables/pagination.js";
-import { pressDataTableSelectionProps, provideSelection } from "./composables/selection.js";
-import { useSortedItems } from "./composables/sorted-items.js";
-import { createSorting, pressDataTableSortProps, provideSorting } from "./composables/sorting.js";
-import { YDataTableInjectionKey } from "./composables/provides.js";
 export const pressDataTableProps = propsFactory({
   ...pressYDataTableBodyProps(),
   width: [String, Number],
@@ -26,6 +27,7 @@ export const pressDataTableProps = propsFactory({
   ...pressDataTableItemsProps(),
   ...pressDataTableSortProps(),
   ...pressDataTableSelectionProps(),
+  ...pressDataTableExpandProps(),
   ...pressYDataTableHeadProps(),
   ...pressYTableProps()
 }, 'DataTable');
@@ -41,6 +43,7 @@ export const YDataTable = defineComponent({
     'update:pageSize': pageSize => true,
     'update:sortBy': sortBy => true,
     'update:options': options => true,
+    'update:expanded': expanded => true,
     'click:row': (e, value) => true,
     scroll: e => true
   },
@@ -108,6 +111,10 @@ export const YDataTable = defineComponent({
       allItems: items,
       pageItems: items
     });
+    const {
+      isExpanded,
+      toggleExpand
+    } = provideExpand(props);
     const {
       resizeObservedRef: headObserveRef,
       contentRect: headRect
@@ -129,6 +136,9 @@ export const YDataTable = defineComponent({
         // sorting
         sortBy: sortBy.value,
         toggleSort,
+        // expand
+        isExpanded,
+        toggleExpand,
         // selection
         someSelected: someSelected.value,
         allSelected: allSelected.value,
@@ -136,7 +146,7 @@ export const YDataTable = defineComponent({
         select,
         selectAll,
         toggleSelect,
-        //
+        // matrix
         items: paginatedItems.value,
         columns: columns.value,
         headers: headers.value,

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

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

package/lib/components/table/YDataTableBody.js

@@ -1,10 +1,11 @@
 import { mergeProps as _mergeProps, resolveDirective as _resolveDirective, Fragment as _Fragment, createVNode as _createVNode } from "vue";
-import { mergeProps, ref } from 'vue';
+import { Fragment, mergeProps } from 'vue';
+import { useExpand } from "./composables/expand.js";
+import { useHeader } from "./composables/header.js";
+import { useSelection } from "./composables/selection.js";
 import { useRender } from "../../composables/component.js";
 import { defineComponent, propsFactory } from "../../util/component/index.js";
 import { YDataTableRow } from "./YDataTableRow.js";
-import { useHeader } from "./composables/header.js";
-import { useSelection } from "./composables/selection.js";
 export const pressYDataTableBodyProps = propsFactory({
   items: {
     type: Array,
@@ -33,10 +34,8 @@ export const YDataTableBody = defineComponent({
   emits: ['click:row', 'dblclick:row', 'contextmenu:row', 'mousedown:row'],
   setup(props, _ref) {
     let {
-      slots,
-      expose
+      slots
     } = _ref;
-    const rowRefs = ref([]);
     const {
       columns
     } = useHeader();
@@ -44,6 +43,10 @@ export const YDataTableBody = defineComponent({
       isSelected,
       toggleSelect
     } = useSelection();
+    const {
+      isExpanded,
+      toggleExpand
+    } = useExpand();
     useRender(() => {
       if (props.loading) {
         return _createVNode("tr", null, [_createVNode("td", {
@@ -66,7 +69,9 @@ export const YDataTableBody = defineComponent({
           internalItem: item,
           columns: columns.value,
           isSelected,
-          toggleSelect
+          toggleSelect,
+          isExpanded,
+          toggleExpand
         };
         function onClick(event, el) {
           props['onClick:row']?.(event, {
@@ -117,8 +122,7 @@ export const YDataTableBody = defineComponent({
         };
         return _createVNode(_Fragment, null, [slots.item ? slots.item(slotProps) : _createVNode(YDataTableRow, _mergeProps({
           "ref": el => {
-            rowRefs.value.push(el);
-            item.rowRef = el;
+            item._bindRowRef(el);
           }
         }, slotProps.props, {
           "onClick": props['onClick:row'] && onClick,
@@ -126,17 +130,9 @@ export const YDataTableBody = defineComponent({
           "onDblclick": props['onDblclick:row'] && onDblclick,
           "onMousedown": props['onMousedown:row'] && onMousedown,
           "onKeydown": props['onKeydown:row'] && onKeydown
-        }), slots)]);
+        }), slots), isExpanded(item) && slots['expanded-row']?.(slotProps)]);
       })]);
     });
-    expose({
-      rowRefs
-    });
-
-    // end
-    return {
-      rowRefs
-    };
   }
 });
 //# sourceMappingURL=YDataTableBody.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"YDataTableBody.js","names":["mergeProps","ref","useRender","defineComponent","propsFactory","YDataTableRow","useHeader","useSelection","pressYDataTableBodyProps","items","type","Array","default","loading","Boolean","String","loadingText","hideNoData","noDataText","rowProps","Function","Object","rowHeight","Number","YDataTableBody","name","props","emits","setup","_ref","slots","expose","rowRefs","columns","isSelected","toggleSelect","_createVNode","value","length","_Fragment","body","map","item","index","stateProps","raw","internalItem","onClick","event","el","onDblclick","onContextmenu","onMousedown","onKeydown","slotProps","key","_mergeProps","push","rowRef"],"sources":["../../../src/components/table/YDataTableBody.tsx"],"sourcesContent":["import { type PropType, mergeProps, ref } from 'vue';\n\nimport { useRender } from '@/composables/component';\nimport { defineComponent, propsFactory } from '@/util/component';\n\nimport { YDataTableRow } from './YDataTableRow';\nimport { useHeader } from '@/components/table/composables/header';\nimport { useSelection } from '@/components/table/composables/selection';\nimport { DataTableItem, RowProps } from './types';\n\nexport const pressYDataTableBodyProps = propsFactory(\n  {\n    items: {\n      type: Array as PropType<readonly DataTableItem[]>,\n      default: () => [],\n    },\n    loading: [Boolean, String],\n    loadingText: String,\n    hideNoData: Boolean,\n    noDataText: {\n      type: String,\n      default: '',\n    },\n    rowProps: [Function, Object] as PropType<RowProps<any>>,\n    rowHeight: Number,\n    'onClick:row': Function as PropType<(e: Event, value: any) => void>,\n    'onDblclick:row': Function as PropType<(e: Event, value: any) => void>,\n    'onContextmenu:row': Function as PropType<(e: Event, value: any) => void>,\n    'onMousedown:row': Function as PropType<(e: Event, value: any) => void>,\n    'onKeydown:row': Function as PropType<(e: Event, value: any) => void>,\n  },\n  'YDataTableBody',\n);\n\nexport const YDataTableBody = defineComponent({\n  name: 'YDataTableBody',\n  props: {\n    ...pressYDataTableBodyProps(),\n  },\n  emits: ['click:row', 'dblclick:row', 'contextmenu:row', 'mousedown:row'],\n  setup(props, { slots, expose }) {\n    const rowRefs = ref<any[]>([]);\n    const { columns } = useHeader();\n    const { isSelected, toggleSelect } = useSelection();\n\n    useRender(() => {\n      if (props.loading) {\n        return (\n          <tr>\n            <td colspan={columns.value.length} class={'y-data-table__loading'}>\n              {slots.loading ? slots.loading() : <div>{props.loadingText}</div>}\n            </td>\n          </tr>\n        );\n      }\n      if (!props.loading && props.items.length < 1 && !props.hideNoData) {\n        return (\n          <tr key=\"no-data\" class=\"y-data-table__no-data\">\n            <td colspan={columns.value.length}>\n              {slots['no-data']?.() ?? props.noDataText}\n            </td>\n          </tr>\n        );\n      }\n      return (\n        <>\n          {slots.body\n            ? slots.body?.(props)\n            : props.items.map((item, index) => {\n                const stateProps = {\n                  index,\n                  item: item.raw,\n                  internalItem: item,\n                  columns: columns.value,\n                  isSelected,\n                  toggleSelect,\n                };\n\n                function onClick(event: Event, el: null | Element) {\n                  props['onClick:row']?.(event, { ...stateProps, el });\n                }\n\n                function onDblclick(event: Event, el: null | Element) {\n                  props['onDblclick:row']?.(event, { ...stateProps, el });\n                }\n\n                function onContextmenu(event: Event, el: null | Element) {\n                  props['onContextmenu:row']?.(event, {\n                    ...stateProps,\n                    el,\n                  });\n                }\n\n                function onMousedown(event: Event, el: null | Element) {\n                  props['onMousedown:row']?.(event, { ...stateProps, el });\n                }\n\n                function onKeydown(event: Event, el: null | Element) {\n                  props['onKeydown:row']?.(event, { ...stateProps, el });\n                }\n\n                const slotProps = {\n                  ...stateProps,\n                  props: mergeProps(\n                    {\n                      key: `item__${item.key ?? item.index}`,\n                      item,\n                      index,\n                    },\n                    typeof props.rowProps === 'function'\n                      ? props.rowProps({\n                          item: stateProps.item,\n                          index: stateProps.index,\n                          internalItem: stateProps.internalItem,\n                        })\n                      : props.rowProps,\n                  ),\n                  onClick,\n                  onContextmenu,\n                  onDblclick,\n                  onMousedown,\n                  onKeydown,\n                };\n\n                return (\n                  <>\n                    {slots.item ? (\n                      slots.item(slotProps)\n                    ) : (\n                      <YDataTableRow\n                        ref={(el) => {\n                          rowRefs.value.push(el);\n                          item.rowRef = el;\n                        }}\n                        v-slots={slots}\n                        {...slotProps.props}\n                        onClick={props['onClick:row'] && onClick}\n                        onContextmenu={\n                          props['onContextmenu:row'] && onContextmenu\n                        }\n                        onDblclick={props['onDblclick:row'] && onDblclick}\n                        onMousedown={props['onMousedown:row'] && onMousedown}\n                        onKeydown={props['onKeydown:row'] && onKeydown}\n                      ></YDataTableRow>\n                    )}\n                  </>\n                );\n              })}\n        </>\n      );\n    });\n\n    expose({\n      rowRefs,\n    });\n\n    // end\n    return {\n      rowRefs,\n    };\n  },\n});\n\nexport type YDataTableBody = InstanceType<typeof YDataTableBody>;\n"],"mappings":"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"}
+{"version":3,"file":"YDataTableBody.js","names":["Fragment","mergeProps","useExpand","useHeader","useSelection","useRender","defineComponent","propsFactory","YDataTableRow","pressYDataTableBodyProps","items","type","Array","default","loading","Boolean","String","loadingText","hideNoData","noDataText","rowProps","Function","Object","rowHeight","Number","YDataTableBody","name","props","emits","setup","_ref","slots","columns","isSelected","toggleSelect","isExpanded","toggleExpand","_createVNode","value","length","_Fragment","body","map","item","index","stateProps","raw","internalItem","onClick","event","el","onDblclick","onContextmenu","onMousedown","onKeydown","slotProps","key","_mergeProps","_bindRowRef"],"sources":["../../../src/components/table/YDataTableBody.tsx"],"sourcesContent":["import { Fragment, type PropType, mergeProps, ref } from 'vue';\n\nimport { useExpand } from '@/components/table/composables/expand';\nimport { useHeader } from '@/components/table/composables/header';\nimport { useSelection } from '@/components/table/composables/selection';\nimport { useRender } from '@/composables/component';\nimport { defineComponent, propsFactory } from '@/util/component';\n\nimport { YDataTableRow } from './YDataTableRow';\nimport { DataTableItem, RowProps } from './types';\n\nexport const pressYDataTableBodyProps = propsFactory(\n  {\n    items: {\n      type: Array as PropType<readonly DataTableItem[]>,\n      default: () => [],\n    },\n    loading: [Boolean, String],\n    loadingText: String,\n    hideNoData: Boolean,\n    noDataText: {\n      type: String,\n      default: '',\n    },\n    rowProps: [Function, Object] as PropType<RowProps<any>>,\n    rowHeight: Number,\n    'onClick:row': Function as PropType<(e: Event, value: any) => void>,\n    'onDblclick:row': Function as PropType<(e: Event, value: any) => void>,\n    'onContextmenu:row': Function as PropType<(e: Event, value: any) => void>,\n    'onMousedown:row': Function as PropType<(e: Event, value: any) => void>,\n    'onKeydown:row': Function as PropType<(e: Event, value: any) => void>,\n  },\n  'YDataTableBody',\n);\n\nexport const YDataTableBody = defineComponent({\n  name: 'YDataTableBody',\n  props: {\n    ...pressYDataTableBodyProps(),\n  },\n  emits: ['click:row', 'dblclick:row', 'contextmenu:row', 'mousedown:row'],\n  setup(props, { slots }) {\n    const { columns } = useHeader();\n    const { isSelected, toggleSelect } = useSelection();\n    const { isExpanded, toggleExpand } = useExpand();\n\n    useRender(() => {\n      if (props.loading) {\n        return (\n          <tr>\n            <td colspan={columns.value.length} class={'y-data-table__loading'}>\n              {slots.loading ? slots.loading() : <div>{props.loadingText}</div>}\n            </td>\n          </tr>\n        );\n      }\n      if (!props.loading && props.items.length < 1 && !props.hideNoData) {\n        return (\n          <tr key=\"no-data\" class=\"y-data-table__no-data\">\n            <td colspan={columns.value.length}>\n              {slots['no-data']?.() ?? props.noDataText}\n            </td>\n          </tr>\n        );\n      }\n      return (\n        <>\n          {slots.body\n            ? slots.body?.(props)\n            : props.items.map((item, index) => {\n                const stateProps = {\n                  index,\n                  item: item.raw,\n                  internalItem: item,\n                  columns: columns.value,\n                  isSelected,\n                  toggleSelect,\n                  isExpanded,\n                  toggleExpand,\n                };\n\n                function onClick(event: Event, el: null | Element) {\n                  props['onClick:row']?.(event, { ...stateProps, el });\n                }\n\n                function onDblclick(event: Event, el: null | Element) {\n                  props['onDblclick:row']?.(event, { ...stateProps, el });\n                }\n\n                function onContextmenu(event: Event, el: null | Element) {\n                  props['onContextmenu:row']?.(event, {\n                    ...stateProps,\n                    el,\n                  });\n                }\n\n                function onMousedown(event: Event, el: null | Element) {\n                  props['onMousedown:row']?.(event, { ...stateProps, el });\n                }\n\n                function onKeydown(event: Event, el: null | Element) {\n                  props['onKeydown:row']?.(event, { ...stateProps, el });\n                }\n\n                const slotProps = {\n                  ...stateProps,\n                  props: mergeProps(\n                    {\n                      key: `item__${item.key ?? item.index}`,\n                      item,\n                      index,\n                    },\n                    typeof props.rowProps === 'function'\n                      ? props.rowProps({\n                          item: stateProps.item,\n                          index: stateProps.index,\n                          internalItem: stateProps.internalItem,\n                        })\n                      : props.rowProps,\n                  ),\n                  onClick,\n                  onContextmenu,\n                  onDblclick,\n                  onMousedown,\n                  onKeydown,\n                };\n\n                return (\n                  <Fragment>\n                    {slots.item ? (\n                      slots.item(slotProps)\n                    ) : (\n                      <YDataTableRow\n                        ref={(el) => {\n                          item._bindRowRef(el);\n                        }}\n                        v-slots={slots}\n                        {...slotProps.props}\n                        onClick={props['onClick:row'] && onClick}\n                        onContextmenu={\n                          props['onContextmenu:row'] && onContextmenu\n                        }\n                        onDblclick={props['onDblclick:row'] && onDblclick}\n                        onMousedown={props['onMousedown:row'] && onMousedown}\n                        onKeydown={props['onKeydown:row'] && onKeydown}\n                      ></YDataTableRow>\n                    )}\n                    {isExpanded(item) && slots['expanded-row']?.(slotProps)}\n                  </Fragment>\n                );\n              })}\n        </>\n      );\n    });\n  },\n});\n\nexport type YDataTableBody = InstanceType<typeof YDataTableBody>;\n"],"mappings":"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"}

package/lib/components/table/YDataTableLayerRow.js

@@ -0,0 +1,87 @@
+import { withDirectives as _withDirectives, createVNode as _createVNode, vShow as _vShow } from "vue";
+import { computed, onBeforeUnmount, ref, shallowRef, useTemplateRef, watch } from 'vue';
+import { useRender } from "../../composables/component.js";
+import { defineComponent } from "../../util/component/index.js";
+import { toStyleSizeValue } from "../../util/ui.js";
+export const YDataTableLayerRow = defineComponent({
+  name: 'YDataTableLayerRow',
+  props: {
+    layerProps: Object,
+    item: Object,
+    width: {
+      type: Number
+    },
+    scrollTop: {
+      type: Number,
+      default: 0
+    },
+    headRect: Object,
+    classes: Function,
+    styles: Object
+  },
+  slots: Object,
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const observer = shallowRef(null);
+    const layerRowRef = useTemplateRef('layerRowRef');
+    const rect = shallowRef(null);
+    const show = shallowRef(false);
+    const rowEl = ref();
+    const computedStyles = computed(() => {
+      const propStyles = props.styles?.(props.item, {
+        width: props.width,
+        height: rect.value?.[0]?.height
+      }) ?? {};
+      return {
+        transform: `translateY(${props.scrollTop * -1 + (rowEl.value?.offsetTop ?? 0) - (props.headRect?.height ?? 40)}px)`,
+        width: toStyleSizeValue(propStyles?.width ?? props.width),
+        height: toStyleSizeValue(propStyles?.height ?? rect.value?.[0]?.height)
+      };
+    });
+    const computedClasses = computed(() => {
+      const propClassResult = props.classes?.(props.item);
+      return Array.isArray(propClassResult) ? propClassResult : [propClassResult];
+    });
+    watch(() => props.item?.rowRef.value, () => {
+      rowEl.value = props.item?.rowRef.value?.$el;
+    }, {
+      immediate: true
+    });
+    watch(rowEl, (neo, old) => {
+      if (neo) {
+        observer.value?.unobserve(neo);
+        observer.value = new ResizeObserver(() => {
+          rect.value = neo.getClientRects();
+        });
+        observer.value.observe(neo);
+        show.value = true;
+      } else {
+        show.value = false;
+        if (old && neo !== old) {
+          observer.value?.unobserve(old);
+        }
+      }
+    }, {
+      immediate: true
+    });
+    onBeforeUnmount(() => {
+      if (observer.value) {
+        observer.value.disconnect();
+        observer.value = null;
+      }
+    });
+    useRender(() => _withDirectives(_createVNode("div", {
+      "ref": layerRowRef,
+      "class": ['y-data-table-layer-row', ...computedClasses.value],
+      "style": computedStyles.value
+    }, [slots.default && slots.default({
+      item: props.item,
+      width: props.width,
+      height: rect.value?.[0]?.height,
+      scrollTop: props.scrollTop
+    })]), [[_vShow, show.value]]));
+  }
+});
+//# sourceMappingURL=YDataTableLayerRow.js.map

package/lib/components/table/YDataTableLayerRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"YDataTableLayerRow.js","names":["computed","onBeforeUnmount","ref","shallowRef","useTemplateRef","watch","useRender","defineComponent","toStyleSizeValue","YDataTableLayerRow","name","props","layerProps","Object","item","width","type","Number","scrollTop","default","headRect","classes","Function","styles","slots","setup","_ref","observer","layerRowRef","rect","show","rowEl","computedStyles","propStyles","height","value","transform","offsetTop","computedClasses","propClassResult","Array","isArray","rowRef","$el","immediate","neo","old","unobserve","ResizeObserver","getClientRects","observe","disconnect","_withDirectives","_createVNode","_vShow"],"sources":["../../../src/components/table/YDataTableLayerRow.tsx"],"sourcesContent":["import {\n  type PropType,\n  SlotsType,\n  computed,\n  onBeforeUnmount,\n  ref,\n  shallowRef,\n  useTemplateRef,\n  watch,\n} from 'vue';\n\nimport { useRender } from '@/composables/component';\nimport { defineComponent } from '@/util/component';\nimport { toStyleSizeValue } from '@/util/ui';\n\nexport type YDataTableLayerRowDefaultSlotProps = {\n  item: any;\n  width: number | undefined;\n  height: number | undefined;\n  scrollTop: number;\n};\n\nexport const YDataTableLayerRow = defineComponent({\n  name: 'YDataTableLayerRow',\n  props: {\n    layerProps: Object as PropType<any>,\n    item: Object as PropType<any>,\n    width: {\n      type: Number as PropType<number>,\n    },\n    scrollTop: {\n      type: Number as PropType<number>,\n      default: 0,\n    },\n    headRect: Object as PropType<DOMRect>,\n    classes: Function as PropType<(item: any) => string[] | string>,\n    styles: Object as PropType<(item: any, originStyle: any) => any>,\n  },\n  slots: Object as SlotsType<{\n    default: (slotProps: YDataTableLayerRowDefaultSlotProps) => any;\n  }>,\n  setup(props, { slots }) {\n    const observer = shallowRef<ResizeObserver | null>(null);\n\n    const layerRowRef = useTemplateRef<HTMLElement>('layerRowRef');\n    const rect = shallowRef<DOMRectList | null>(null);\n    const show = shallowRef(false);\n\n    const rowEl = ref();\n\n    const computedStyles = computed(() => {\n      const propStyles =\n        props.styles?.(props.item, {\n          width: props.width,\n          height: rect.value?.[0]?.height,\n        }) ?? {};\n\n      return {\n        transform: `translateY(${props.scrollTop * -1 + (rowEl.value?.offsetTop ?? 0) - (props.headRect?.height ?? 40)}px)`,\n        width: toStyleSizeValue(propStyles?.width ?? props.width),\n        height: toStyleSizeValue(propStyles?.height ?? rect.value?.[0]?.height),\n      };\n    });\n\n    const computedClasses = computed(() => {\n      const propClassResult = props.classes?.(props.item);\n      return Array.isArray(propClassResult)\n        ? propClassResult\n        : [propClassResult];\n    });\n\n    watch(\n      () => props.item?.rowRef.value,\n      () => {\n        rowEl.value = props.item?.rowRef.value?.$el;\n      },\n      {\n        immediate: true,\n      },\n    );\n\n    watch(\n      rowEl,\n      (neo, old) => {\n        if (neo) {\n          observer.value?.unobserve(neo);\n          observer.value = new ResizeObserver(() => {\n            rect.value = neo.getClientRects();\n          });\n          observer.value.observe(neo);\n          show.value = true;\n        } else {\n          show.value = false;\n          if (old && neo !== old) {\n            observer.value?.unobserve(old);\n          }\n        }\n      },\n      { immediate: true },\n    );\n\n    onBeforeUnmount(() => {\n      if (observer.value) {\n        observer.value.disconnect();\n        observer.value = null;\n      }\n    });\n\n    useRender(() => (\n      <div\n        ref={layerRowRef}\n        v-show={show.value}\n        class={['y-data-table-layer-row', ...computedClasses.value]}\n        style={computedStyles.value}\n      >\n        {slots.default &&\n          slots.default({\n            item: props.item,\n            width: props.width,\n            height: rect.value?.[0]?.height,\n            scrollTop: props.scrollTop,\n          })}\n      </div>\n    ));\n  },\n});\n"],"mappings":"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"}

package/lib/components/table/YDataTableLayerRow.vue

@@ -66,11 +66,10 @@ watch(
       if (activeRowRef.value) {
         activeRowRef.value.classList.add('y-data-table-layer-row--change');
       }
-      requestAnimationFrame(() => {
-        setTimeout(() => {
-          show.value = true;
-        }, 300);
-      });
+      // for wrapper transition end
+      setTimeout(() => {
+        show.value = true;
+      }, 300);
     } else {
       show.value = false;
       if (observer.value) {
@@ -90,7 +89,9 @@ watch(activeRowRef, (neo) => {
 });
 
 function onScrollWrapper() {
-  scrollTop.value = wrapperEl.value?.scrollTop ?? 0;
+  requestAnimationFrame(() => {
+    scrollTop.value = wrapperEl.value?.scrollTop ?? 0;
+  });
 }
 
 function disconnectObserver() {

package/lib/components/table/YDataTableLayerRows.js

@@ -0,0 +1,60 @@
+import { withDirectives as _withDirectives, createVNode as _createVNode, resolveDirective as _resolveDirective } from "vue";
+import { computed, shallowRef, watch } from 'vue';
+import { useRender } from "../../composables/index.js";
+import { defineComponent } from "../../util/component/index.js";
+import { YDataTableLayerRow } from "./YDataTableLayerRow.js";
+import "./YDataTableLayerRows.scss";
+export const YDataTableLayerRows = defineComponent({
+  name: 'YDataTableLayerRows',
+  props: {
+    layerProps: Object,
+    items: Array,
+    classes: Function,
+    styles: Object,
+    single: Boolean
+  },
+  slots: Object,
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    // wrapper
+    const wrapperObserver = shallowRef(null);
+    const wrapperOffsetTop = shallowRef(0);
+    const scrollTop = shallowRef(0);
+    const rowWidth = shallowRef(0);
+    const wrapperEl = computed(() => props.layerProps?.YTable?.wrapperRef.value);
+    const headRect = computed(() => props.layerProps?.YDataTable?.headRect.value);
+    watch(wrapperEl, neo => {
+      if (neo) {
+        onScrollWrapper();
+        neo.addEventListener('scroll', onScrollWrapper);
+        wrapperObserver.value = new ResizeObserver(() => {
+          wrapperOffsetTop.value = neo.offsetTop ?? 0;
+          rowWidth.value = neo?.clientWidth ?? 0;
+        });
+        wrapperObserver.value.observe(neo);
+      }
+    }, {
+      immediate: true
+    });
+    function onScrollWrapper() {
+      requestAnimationFrame(() => {
+        scrollTop.value = wrapperEl.value?.scrollTop ?? 0;
+      });
+    }
+    useRender(() => _createVNode("div", {
+      "class": "y-data-table-layer-rows"
+    }, [props.items?.map(item => {
+      return _withDirectives(_createVNode(YDataTableLayerRow, {
+        "item": item,
+        "head-rect": headRect,
+        "scroll-top": scrollTop.value,
+        "width": rowWidth.value,
+        "classes": props.classes,
+        "styles": props.styles
+      }, null), [[_resolveDirective("slot"), slots]]);
+    })]));
+  }
+});
+//# sourceMappingURL=YDataTableLayerRows.js.map

package/lib/components/table/YDataTableLayerRows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"YDataTableLayerRows.js","names":["computed","shallowRef","watch","useRender","defineComponent","YDataTableLayerRow","YDataTableLayerRows","name","props","layerProps","Object","items","Array","classes","Function","styles","single","Boolean","slots","setup","_ref","wrapperObserver","wrapperOffsetTop","scrollTop","rowWidth","wrapperEl","YTable","wrapperRef","value","headRect","YDataTable","neo","onScrollWrapper","addEventListener","ResizeObserver","offsetTop","clientWidth","observe","immediate","requestAnimationFrame","_createVNode","map","item","_withDirectives","_resolveDirective"],"sources":["../../../src/components/table/YDataTableLayerRows.tsx"],"sourcesContent":["import { type PropType, SlotsType, computed, shallowRef, watch } from 'vue';\n\nimport { useRender } from '@/composables';\nimport { defineComponent } from '@/util/component';\n\nimport {\n  YDataTableLayerRow,\n  type YDataTableLayerRowDefaultSlotProps,\n} from './YDataTableLayerRow';\n\nimport './YDataTableLayerRows.scss';\n\nexport const YDataTableLayerRows = defineComponent({\n  name: 'YDataTableLayerRows',\n  props: {\n    layerProps: Object as PropType<any>,\n    items: Array as PropType<any[]>,\n    classes: Function as PropType<(item: any) => string[] | string>,\n    styles: Object as PropType<(item: any, originStyle: any) => any>,\n    single: Boolean as PropType<boolean>,\n  },\n  slots: Object as SlotsType<{\n    default: (slotProps: YDataTableLayerRowDefaultSlotProps) => any;\n  }>,\n  setup(props, { slots }) {\n    // wrapper\n    const wrapperObserver = shallowRef<ResizeObserver | null>(null);\n    const wrapperOffsetTop = shallowRef(0);\n    const scrollTop = shallowRef(0);\n    const rowWidth = shallowRef(0);\n\n    const wrapperEl = computed(\n      () => props.layerProps?.YTable?.wrapperRef.value,\n    );\n\n    const headRect = computed(\n      () => props.layerProps?.YDataTable?.headRect.value,\n    );\n\n    watch(\n      wrapperEl,\n      (neo) => {\n        if (neo) {\n          onScrollWrapper();\n          neo.addEventListener('scroll', onScrollWrapper);\n          wrapperObserver.value = new ResizeObserver(() => {\n            wrapperOffsetTop.value = neo.offsetTop ?? 0;\n            rowWidth.value = neo?.clientWidth ?? 0;\n          });\n          wrapperObserver.value.observe(neo);\n        }\n      },\n      { immediate: true },\n    );\n\n    function onScrollWrapper() {\n      requestAnimationFrame(() => {\n        scrollTop.value = wrapperEl.value?.scrollTop ?? 0;\n      });\n    }\n\n    useRender(() => (\n      <div class=\"y-data-table-layer-rows\">\n        {props.items?.map((item) => {\n          return (\n            <YDataTableLayerRow\n              item={item}\n              head-rect={headRect}\n              scroll-top={scrollTop.value}\n              width={rowWidth.value}\n              classes={props.classes}\n              styles={props.styles}\n              v-slot={slots}\n            ></YDataTableLayerRow>\n          );\n        })}\n      </div>\n    ));\n  },\n});\n"],"mappings":";AAAA,SAAmCA,QAAQ,EAAEC,UAAU,EAAEC,KAAK,QAAQ,KAAK;AAAC,SAEnEC,SAAS;AAAA,SACTC,eAAe;AAAA,SAGtBC,kBAAkB;AAIpB;AAEA,OAAO,MAAMC,mBAAmB,GAAGF,eAAe,CAAC;EACjDG,IAAI,EAAE,qBAAqB;EAC3BC,KAAK,EAAE;IACLC,UAAU,EAAEC,MAAuB;IACnCC,KAAK,EAAEC,KAAwB;IAC/BC,OAAO,EAAEC,QAAsD;IAC/DC,MAAM,EAAEL,MAAwD;IAChEM,MAAM,EAAEC;EACV,CAAC;EACDC,KAAK,EAAER,MAEL;EACFS,KAAKA,CAACX,KAAK,EAAAY,IAAA,EAAa;IAAA,IAAX;MAAEF;IAAM,CAAC,GAAAE,IAAA;IACpB;IACA,MAAMC,eAAe,GAAGpB,UAAU,CAAwB,IAAI,CAAC;IAC/D,MAAMqB,gBAAgB,GAAGrB,UAAU,CAAC,CAAC,CAAC;IACtC,MAAMsB,SAAS,GAAGtB,UAAU,CAAC,CAAC,CAAC;IAC/B,MAAMuB,QAAQ,GAAGvB,UAAU,CAAC,CAAC,CAAC;IAE9B,MAAMwB,SAAS,GAAGzB,QAAQ,CACxB,MAAMQ,KAAK,CAACC,UAAU,EAAEiB,MAAM,EAAEC,UAAU,CAACC,KAC7C,CAAC;IAED,MAAMC,QAAQ,GAAG7B,QAAQ,CACvB,MAAMQ,KAAK,CAACC,UAAU,EAAEqB,UAAU,EAAED,QAAQ,CAACD,KAC/C,CAAC;IAED1B,KAAK,CACHuB,SAAS,EACRM,GAAG,IAAK;MACP,IAAIA,GAAG,EAAE;QACPC,eAAe,CAAC,CAAC;QACjBD,GAAG,CAACE,gBAAgB,CAAC,QAAQ,EAAED,eAAe,CAAC;QAC/CX,eAAe,CAACO,KAAK,GAAG,IAAIM,cAAc,CAAC,MAAM;UAC/CZ,gBAAgB,CAACM,KAAK,GAAGG,GAAG,CAACI,SAAS,IAAI,CAAC;UAC3CX,QAAQ,CAACI,KAAK,GAAGG,GAAG,EAAEK,WAAW,IAAI,CAAC;QACxC,CAAC,CAAC;QACFf,eAAe,CAACO,KAAK,CAACS,OAAO,CAACN,GAAG,CAAC;MACpC;IACF,CAAC,EACD;MAAEO,SAAS,EAAE;IAAK,CACpB,CAAC;IAED,SAASN,eAAeA,CAAA,EAAG;MACzBO,qBAAqB,CAAC,MAAM;QAC1BhB,SAAS,CAACK,KAAK,GAAGH,SAAS,CAACG,KAAK,EAAEL,SAAS,IAAI,CAAC;MACnD,CAAC,CAAC;IACJ;IAEApB,SAAS,CAAC,MAAAqC,YAAA;MAAA;IAAA,IAELhC,KAAK,CAACG,KAAK,EAAE8B,GAAG,CAAEC,IAAI,IAAK;MAC1B,OAAAC,eAAA,CAAAH,YAAA,CAAAnC,kBAAA;QAAA,QAEUqC,IAAI;QAAA,aACCb,QAAQ;QAAA,cACPN,SAAS,CAACK,KAAK;QAAA,SACpBJ,QAAQ,CAACI,KAAK;QAAA,WACZpB,KAAK,CAACK,OAAO;QAAA,UACdL,KAAK,CAACO;MAAM,YAAA6B,iBAAA,UACZ1B,KAAK;IAGnB,CAAC,CAAC,EAEL,CAAC;EACJ;AACF,CAAC,CAAC"}

package/lib/components/table/YDataTableLayerRows.scss

@@ -0,0 +1,14 @@
+.y-data-table-layer-rows {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  clip-path: inset(0 -20px 0 -20px);
+}
+
+.y-data-table-layer-row {
+  pointer-events: none;
+  position: absolute;
+  left: 0;
+}

package/lib/components/table/YDataTableRow.js

@@ -1,14 +1,15 @@
 import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import { computed, getCurrentInstance } from 'vue';
 import { YButton } from "../button/YButton.js";
+import { useExpand } from "./composables/expand.js";
+import { useHeader } from "./composables/header.js";
+import { useSelection } from "./composables/selection.js";
 import { useRender } from "../../composables/component.js";
 import { getPropertyFromItem } from "../../util/common.js";
 import { defineComponent } from "../../util/component/index.js";
 import { propsFactory } from "../../util/component/index.js";
 import { YIconCheckbox } from "../icons/index.js";
 import { YDataTableCell } from "./YDataTableCell.js";
-import { useHeader } from "./composables/header.js";
-import { useSelection } from "./composables/selection.js";
 export const pressYDataTableRowProps = propsFactory({
   index: Number,
   onHover: Function,
@@ -32,13 +33,17 @@ export const YDataTableRow = defineComponent({
       slots
     } = _ref;
     const vm = getCurrentInstance();
+    const {
+      columns
+    } = useHeader();
     const {
       isSelected,
       toggleSelect
     } = useSelection();
     const {
-      columns
-    } = useHeader();
+      isExpanded,
+      toggleExpand
+    } = useExpand();
     const selected = computed(() => props.item && isSelected(props.item));
     function arrayClasses(classes) {
       const ret = [];
@@ -70,7 +75,8 @@ export const YDataTableRow = defineComponent({
     useRender(() => {
       return _createVNode("tr", {
         "class": ['y-data-table__row', {
-          'y-data-table__row--selected': selected.value
+          'y-data-table__row--selected': selected.value,
+          'y-data-table__row--expanded': isExpanded(props.item)
         }],
         "onClick": props.onClick && onClick,
         "onContextmenu": props.onContextmenu && onContextmenu,
@@ -87,6 +93,8 @@ export const YDataTableRow = defineComponent({
           value: getPropertyFromItem(item.columns, column.key),
           selected: selected.value,
           toggleSelect,
+          isExpanded,
+          toggleExpand,
           el: vm?.proxy?.$el
         };
         const classes = computed(() => {

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

@@ -1 +1 @@
-{"version":3,"file":"YDataTableRow.js","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';\r\n\r\nimport { YButton } from '@/components/button/YButton';\r\nimport { useRender } from '@/composables/component';\r\nimport { getPropertyFromItem } from '@/util/common';\r\nimport { defineComponent } from '@/util/component';\r\nimport { propsFactory } from '@/util/component';\r\n\r\nimport { YIconCheckbox } from '../icons';\r\nimport { YDataTableCell } from './YDataTableCell';\r\nimport { useHeader } from '@/components/table/composables/header';\r\nimport { useSelection } from '@/components/table/composables/selection';\r\nimport { CellProps, DataTableItem, type FixedPropType } from './types';\r\n\r\nexport const pressYDataTableRowProps = propsFactory(\r\n  {\r\n    index: Number as PropType<number>,\r\n    onHover: Function as PropType<(...args: any[]) => void>,\r\n    onMousedown: Function as PropType<(...args: any[]) => void>,\r\n    onClick: Function as PropType<(...args: any[]) => void>,\r\n    onDblclick: Function as PropType<(...args: any[]) => void>,\r\n    onContextmenu: Function as PropType<(...args: any[]) => void>,\r\n    onKeydown: Function as PropType<(...args: any[]) => void>,\r\n  },\r\n  'YDataTableRow',\r\n);\r\n\r\nexport const YDataTableRow = defineComponent({\r\n  name: 'YDataTableRow',\r\n  props: {\r\n    item: Object as PropType<DataTableItem>,\r\n    cellProps: [Object, Function] as PropType<CellProps>,\r\n    ...pressYDataTableRowProps(),\r\n  },\r\n  emits: ['hover', 'mousedown', 'click', 'dblclick', 'contextmenu'],\r\n  setup(props, { emit, slots }) {\r\n    const vm = getCurrentInstance();\r\n    const { isSelected, toggleSelect } = useSelection();\r\n    const { columns } = useHeader();\r\n\r\n    const selected = computed(() => props.item && isSelected(props.item));\r\n\r\n    function arrayClasses(classes: string | string[]) {\r\n      const ret: string[] = [];\r\n      if (typeof classes === 'string') {\r\n        ret.push(classes);\r\n      }\r\n      if (Array.isArray(classes)) {\r\n        classes.forEach((c) => {\r\n          if (typeof c === 'string') ret.push(c);\r\n        });\r\n      }\r\n      return ret;\r\n    }\r\n\r\n    function onMousedown(event: MouseEvent) {\r\n      props.onMousedown?.(event, vm?.proxy?.$el);\r\n    }\r\n\r\n    function onClick(event: MouseEvent) {\r\n      props.onClick?.(event, vm?.proxy?.$el);\r\n    }\r\n\r\n    function onContextmenu(event: MouseEvent) {\r\n      props.onContextmenu?.(event, vm?.proxy?.$el);\r\n    }\r\n\r\n    function onDblclick(event: MouseEvent) {\r\n      props.onDblclick?.(event, vm?.proxy?.$el);\r\n    }\r\n\r\n    function onKeydown(event: KeyboardEvent) {\r\n      props.onKeydown?.(event, vm?.proxy?.$el);\r\n    }\r\n\r\n    useRender(() => {\r\n      return (\r\n        <tr\r\n          class={[\r\n            'y-data-table__row',\r\n            { 'y-data-table__row--selected': selected.value },\r\n          ]}\r\n          onClick={props.onClick && onClick}\r\n          onContextmenu={props.onContextmenu && onContextmenu}\r\n          onDblclick={props.onDblclick && onDblclick}\r\n          onMousedown={props.onMousedown && onMousedown}\r\n          onKeydown={props.onKeydown && onKeydown}\r\n        >\r\n          {props.item &&\r\n            columns.value.map((column, colIndex) => {\r\n              const item = props.item!;\r\n              const slotProps = {\r\n                index: props.index!,\r\n                item: props.item!.raw,\r\n                internalItem: props.item!,\r\n                columns: columns.value,\r\n                value: getPropertyFromItem(item.columns, column.key),\r\n                selected: selected.value,\r\n                toggleSelect,\r\n                el: vm?.proxy?.$el,\r\n              };\r\n\r\n              const classes = computed(() => {\r\n                const ret: string[] = [];\r\n                if (typeof column.classes === 'function') {\r\n                  const result = column.classes.call(\r\n                    null,\r\n                    slotProps.item,\r\n                    slotProps.index,\r\n                    column,\r\n                  );\r\n                  if (result) {\r\n                    ret.push(...arrayClasses(result));\r\n                  }\r\n                } else if (column.classes) {\r\n                  ret.push(...arrayClasses(column.classes));\r\n                }\r\n\r\n                return ret;\r\n              });\r\n\r\n              const cellProps =\r\n                typeof props.cellProps === 'function'\r\n                  ? props.cellProps({\r\n                      index: slotProps.index,\r\n                      column,\r\n                      internalItem: slotProps.internalItem,\r\n                      item: slotProps.item,\r\n                      value: slotProps.value,\r\n                      selected: slotProps.selected,\r\n                    })\r\n                  : props.cellProps;\r\n\r\n              return (\r\n                <YDataTableCell\r\n                  align={column.align}\r\n                  fixed={\r\n                    column.fixed\r\n                      ? (((column.fixed === 'right' ? 'trail' : 'lead') +\r\n                          (column.lastFixed ? '-last' : '')) as FixedPropType)\r\n                      : undefined\r\n                  }\r\n                  fixedOffset={column.fixedOffset}\r\n                  rightOffset={column.rightOffset}\r\n                  width={column.width}\r\n                  maxWidth={column.maxWidth}\r\n                  class={[\r\n                    'y-data-table-data',\r\n                    {\r\n                      'y-data-table-data--select':\r\n                        column.key === 'data-table-select',\r\n                    },\r\n                    ...classes.value,\r\n                  ]}\r\n                  {...cellProps}\r\n                >\r\n                  {{\r\n                    default: () => {\r\n                      const slotName = `item.${column.key}`;\r\n\r\n                      if (slots[slotName]) {\r\n                        return slots[slotName]?.(slotProps);\r\n                      }\r\n\r\n                      if (column.key === 'data-table-select') {\r\n                        return (\r\n                          slots['item.data-table-select']?.(slotProps) ?? (\r\n                            <YButton\r\n                              variation={'text,small'}\r\n                              disabled={!item.selectable}\r\n                              onClick={(e: MouseEvent) => {\r\n                                e.stopPropagation();\r\n                                if (item.selectable) toggleSelect(item);\r\n                              }}\r\n                            >\r\n                              <YIconCheckbox\r\n                                checked={isSelected(item)}\r\n                                disabled={!item.selectable}\r\n                              ></YIconCheckbox>\r\n                            </YButton>\r\n                          )\r\n                        );\r\n                      }\r\n\r\n                      return slotProps.value;\r\n                    },\r\n                  }}\r\n                </YDataTableCell>\r\n              );\r\n            })}\r\n        </tr>\r\n      );\r\n    });\r\n  },\r\n});\r\n\r\nexport type YDataTableRow = InstanceType<typeof YDataTableRow>;\r\n"],"mappings":"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"}
+{"version":3,"file":"YDataTableRow.js","names":["computed","getCurrentInstance","YButton","useExpand","useHeader","useSelection","useRender","getPropertyFromItem","defineComponent","propsFactory","YIconCheckbox","YDataTableCell","pressYDataTableRowProps","index","Number","onHover","Function","onMousedown","onClick","onDblclick","onContextmenu","onKeydown","YDataTableRow","name","props","item","Object","cellProps","emits","setup","_ref","emit","slots","vm","columns","isSelected","toggleSelect","isExpanded","toggleExpand","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/button/YButton';\nimport { useExpand } from '@/components/table/composables/expand';\nimport { useHeader } from '@/components/table/composables/header';\nimport { useSelection } from '@/components/table/composables/selection';\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 { 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 { columns } = useHeader();\n    const { isSelected, toggleSelect } = useSelection();\n    const { isExpanded, toggleExpand } = useExpand();\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            {\n              'y-data-table__row--selected': selected.value,\n              'y-data-table__row--expanded': isExpanded(props.item!),\n            },\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                isExpanded,\n                toggleExpand,\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":";AAAA,SAAwBA,QAAQ,EAAEC,kBAAkB,QAAQ,KAAK;AAAC,SAEzDC,OAAO;AAAA,SACPC,SAAS;AAAA,SACTC,SAAS;AAAA,SACTC,YAAY;AAAA,SACZC,SAAS;AAAA,SACTC,mBAAmB;AAAA,SACnBC,eAAe;AAAA,SACfC,YAAY;AAAA,SAEZC,aAAa;AAAA,SACbC,cAAc;AAGvB,OAAO,MAAMC,uBAAuB,GAAGH,YAAY,CACjD;EACEI,KAAK,EAAEC,MAA0B;EACjCC,OAAO,EAAEC,QAA8C;EACvDC,WAAW,EAAED,QAA8C;EAC3DE,OAAO,EAAEF,QAA8C;EACvDG,UAAU,EAAEH,QAA8C;EAC1DI,aAAa,EAAEJ,QAA8C;EAC7DK,SAAS,EAAEL;AACb,CAAC,EACD,eACF,CAAC;AAED,OAAO,MAAMM,aAAa,GAAGd,eAAe,CAAC;EAC3Ce,IAAI,EAAE,eAAe;EACrBC,KAAK,EAAE;IACLC,IAAI,EAAEC,MAAiC;IACvCC,SAAS,EAAE,CAACD,MAAM,EAAEV,QAAQ,CAAwB;IACpD,GAAGJ,uBAAuB,CAAC;EAC7B,CAAC;EACDgB,KAAK,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,UAAU,EAAE,aAAa,CAAC;EACjEC,KAAKA,CAACL,KAAK,EAAAM,IAAA,EAAmB;IAAA,IAAjB;MAAEC,IAAI;MAAEC;IAAM,CAAC,GAAAF,IAAA;IAC1B,MAAMG,EAAE,GAAGhC,kBAAkB,CAAC,CAAC;IAC/B,MAAM;MAAEiC;IAAQ,CAAC,GAAG9B,SAAS,CAAC,CAAC;IAC/B,MAAM;MAAE+B,UAAU;MAAEC;IAAa,CAAC,GAAG/B,YAAY,CAAC,CAAC;IACnD,MAAM;MAAEgC,UAAU;MAAEC;IAAa,CAAC,GAAGnC,SAAS,CAAC,CAAC;IAEhD,MAAMoC,QAAQ,GAAGvC,QAAQ,CAAC,MAAMwB,KAAK,CAACC,IAAI,IAAIU,UAAU,CAACX,KAAK,CAACC,IAAI,CAAC,CAAC;IAErE,SAASe,YAAYA,CAACC,OAA0B,EAAE;MAChD,MAAMC,GAAa,GAAG,EAAE;MACxB,IAAI,OAAOD,OAAO,KAAK,QAAQ,EAAE;QAC/BC,GAAG,CAACC,IAAI,CAACF,OAAO,CAAC;MACnB;MACA,IAAIG,KAAK,CAACC,OAAO,CAACJ,OAAO,CAAC,EAAE;QAC1BA,OAAO,CAACK,OAAO,CAAEC,CAAC,IAAK;UACrB,IAAI,OAAOA,CAAC,KAAK,QAAQ,EAAEL,GAAG,CAACC,IAAI,CAACI,CAAC,CAAC;QACxC,CAAC,CAAC;MACJ;MACA,OAAOL,GAAG;IACZ;IAEA,SAASzB,WAAWA,CAAC+B,KAAiB,EAAE;MACtCxB,KAAK,CAACP,WAAW,GAAG+B,KAAK,EAAEf,EAAE,EAAEgB,KAAK,EAAEC,GAAG,CAAC;IAC5C;IAEA,SAAShC,OAAOA,CAAC8B,KAAiB,EAAE;MAClCxB,KAAK,CAACN,OAAO,GAAG8B,KAAK,EAAEf,EAAE,EAAEgB,KAAK,EAAEC,GAAG,CAAC;IACxC;IAEA,SAAS9B,aAAaA,CAAC4B,KAAiB,EAAE;MACxCxB,KAAK,CAACJ,aAAa,GAAG4B,KAAK,EAAEf,EAAE,EAAEgB,KAAK,EAAEC,GAAG,CAAC;IAC9C;IAEA,SAAS/B,UAAUA,CAAC6B,KAAiB,EAAE;MACrCxB,KAAK,CAACL,UAAU,GAAG6B,KAAK,EAAEf,EAAE,EAAEgB,KAAK,EAAEC,GAAG,CAAC;IAC3C;IAEA,SAAS7B,SAASA,CAAC2B,KAAoB,EAAE;MACvCxB,KAAK,CAACH,SAAS,GAAG2B,KAAK,EAAEf,EAAE,EAAEgB,KAAK,EAAEC,GAAG,CAAC;IAC1C;IAEA5C,SAAS,CAAC,MAAM;MACd,OAAA6C,YAAA;QAAA,SAEW,CACL,mBAAmB,EACnB;UACE,6BAA6B,EAAEZ,QAAQ,CAACa,KAAK;UAC7C,6BAA6B,EAAEf,UAAU,CAACb,KAAK,CAACC,IAAK;QACvD,CAAC,CACF;QAAA,WACQD,KAAK,CAACN,OAAO,IAAIA,OAAO;QAAA,iBAClBM,KAAK,CAACJ,aAAa,IAAIA,aAAa;QAAA,cACvCI,KAAK,CAACL,UAAU,IAAIA,UAAU;QAAA,eAC7BK,KAAK,CAACP,WAAW,IAAIA,WAAW;QAAA,aAClCO,KAAK,CAACH,SAAS,IAAIA;MAAS,IAEtCG,KAAK,CAACC,IAAI,IACTS,OAAO,CAACkB,KAAK,CAACC,GAAG,CAAC,CAACC,MAAM,EAAEC,QAAQ,KAAK;QACtC,MAAM9B,IAAI,GAAGD,KAAK,CAACC,IAAK;QACxB,MAAM+B,SAAS,GAAG;UAChB3C,KAAK,EAAEW,KAAK,CAACX,KAAM;UACnBY,IAAI,EAAED,KAAK,CAACC,IAAI,CAAEgC,GAAG;UACrBC,YAAY,EAAElC,KAAK,CAACC,IAAK;UACzBS,OAAO,EAAEA,OAAO,CAACkB,KAAK;UACtBA,KAAK,EAAE7C,mBAAmB,CAACkB,IAAI,CAACS,OAAO,EAAEoB,MAAM,CAACK,GAAG,CAAC;UACpDpB,QAAQ,EAAEA,QAAQ,CAACa,KAAK;UACxBhB,YAAY;UACZC,UAAU;UACVC,YAAY;UACZsB,EAAE,EAAE3B,EAAE,EAAEgB,KAAK,EAAEC;QACjB,CAAC;QAED,MAAMT,OAAO,GAAGzC,QAAQ,CAAC,MAAM;UAC7B,MAAM0C,GAAa,GAAG,EAAE;UACxB,IAAI,OAAOY,MAAM,CAACb,OAAO,KAAK,UAAU,EAAE;YACxC,MAAMoB,MAAM,GAAGP,MAAM,CAACb,OAAO,CAACqB,IAAI,CAChC,IAAI,EACJN,SAAS,CAAC/B,IAAI,EACd+B,SAAS,CAAC3C,KAAK,EACfyC,MACF,CAAC;YACD,IAAIO,MAAM,EAAE;cACVnB,GAAG,CAACC,IAAI,CAAC,GAAGH,YAAY,CAACqB,MAAM,CAAC,CAAC;YACnC;UACF,CAAC,MAAM,IAAIP,MAAM,CAACb,OAAO,EAAE;YACzBC,GAAG,CAACC,IAAI,CAAC,GAAGH,YAAY,CAACc,MAAM,CAACb,OAAO,CAAC,CAAC;UAC3C;UAEA,OAAOC,GAAG;QACZ,CAAC,CAAC;QAEF,MAAMf,SAAS,GACb,OAAOH,KAAK,CAACG,SAAS,KAAK,UAAU,GACjCH,KAAK,CAACG,SAAS,CAAC;UACdd,KAAK,EAAE2C,SAAS,CAAC3C,KAAK;UACtByC,MAAM;UACNI,YAAY,EAAEF,SAAS,CAACE,YAAY;UACpCjC,IAAI,EAAE+B,SAAS,CAAC/B,IAAI;UACpB2B,KAAK,EAAEI,SAAS,CAACJ,KAAK;UACtBb,QAAQ,EAAEiB,SAAS,CAACjB;QACtB,CAAC,CAAC,GACFf,KAAK,CAACG,SAAS;QAErB,OAAAwB,YAAA,CAAAxC,cAAA,EAAAoD,WAAA;UAAA,SAEWT,MAAM,CAACU,KAAK;UAAA,SAEjBV,MAAM,CAACW,KAAK,GACN,CAACX,MAAM,CAACW,KAAK,KAAK,OAAO,GAAG,OAAO,GAAG,MAAM,KAC3CX,MAAM,CAACY,SAAS,GAAG,OAAO,GAAG,EAAE,CAAC,GACnCC,SAAS;UAAA,eAEFb,MAAM,CAACc,WAAW;UAAA,eAClBd,MAAM,CAACe,WAAW;UAAA,SACxBf,MAAM,CAACgB,KAAK;UAAA,YACThB,MAAM,CAACiB,QAAQ;UAAA,SAClB,CACL,mBAAmB,EACnB;YACE,2BAA2B,EACzBjB,MAAM,CAACK,GAAG,KAAK;UACnB,CAAC,EACD,GAAGlB,OAAO,CAACW,KAAK;QACjB,GACGzB,SAAS;UAGX6C,OAAO,EAAEA,CAAA,KAAM;YACb,MAAMC,QAAQ,GAAI,QAAOnB,MAAM,CAACK,GAAI,EAAC;YAErC,IAAI3B,KAAK,CAACyC,QAAQ,CAAC,EAAE;cACnB,OAAOzC,KAAK,CAACyC,QAAQ,CAAC,GAAGjB,SAAS,CAAC;YACrC;YAEA,IAAIF,MAAM,CAACK,GAAG,KAAK,mBAAmB,EAAE;cACtC,OACE3B,KAAK,CAAC,wBAAwB,CAAC,GAAGwB,SAAS,CAAC,IAAAL,YAAA,CAAAjD,OAAA;gBAAA,aAE7B,YAAY;gBAAA,YACb,CAACuB,IAAI,CAACiD,UAAU;gBAAA,WAChBC,CAAa,IAAK;kBAC1BA,CAAC,CAACC,eAAe,CAAC,CAAC;kBACnB,IAAInD,IAAI,CAACiD,UAAU,EAAEtC,YAAY,CAACX,IAAI,CAAC;gBACzC;cAAC;gBAAA+C,OAAA,EAAAA,CAAA,MAAArB,YAAA,CAAAzC,aAAA;kBAAA,WAGUyB,UAAU,CAACV,IAAI,CAAC;kBAAA,YACf,CAACA,IAAI,CAACiD;gBAAU;cAAA,EAG/B;YAEL;YAEA,OAAOlB,SAAS,CAACJ,KAAK;UACxB;QAAC;MAIT,CAAC,CAAC;IAGV,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}