@gradient-ui/core 0.6.0 → 1.0.0

package/dist/GTable.vue_vue_type_style_index_1_lang-BECleEMi.js

@@ -0,0 +1,828 @@
+import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, createCommentVNode, Fragment, renderList, normalizeStyle, normalizeClass, renderSlot, createTextVNode, toDisplayString, provide, inject, unref, normalizeProps, guardReactiveProps, createVNode, withModifiers, createBlock, createSlots, withCtx, mergeProps, withDirectives, vShow, useSlots, ref, watch } from "vue";
+import { m as makeDensityProps, u as useDensity } from "./density-Ci15Ek7T.js";
+import { m as makeMaterialSurfaceProps, u as useMaterialSurface } from "./materialSurface-DKWanYUC.js";
+import GGradient from "./components/GGradient.mjs";
+import { m as makeSurfaceTextureProps } from "./surface-i-1vm2j3.js";
+import { p as propsFactory } from "./propsFactory-FM5RGbLN.js";
+import { _ as _sfc_main$6 } from "./GButton.vue_vue_type_style_index_0_lang-D9qRus1m.js";
+import "./GTransition.vue_vue_type_script_setup_true_lang-CHGSgsZ0.js";
+import { _ as _sfc_main$7 } from "./GExpandTransition.vue_vue_type_script_setup_true_lang-ztMeJVQO.js";
+import "./GTransitionGroup.vue_vue_type_script_setup_true_lang-CDu6W6-X.js";
+const makeTableProps = propsFactory({
+  ...makeMaterialSurfaceProps(),
+  ...makeSurfaceTextureProps(),
+  ...makeDensityProps(),
+  headers: {
+    type: Array,
+    default: () => []
+  },
+  items: {
+    type: Array,
+    default: () => []
+  },
+  itemKey: {
+    type: [String, Function],
+    default: "id"
+  },
+  variant: {
+    type: String,
+    default: "tonal"
+  },
+  color: {
+    type: String,
+    default: "primary"
+  },
+  rounded: Boolean,
+  stickyHeader: Boolean,
+  fixedLayout: Boolean,
+  hover: Boolean,
+  clickableRows: Boolean,
+  striped: Boolean,
+  bordered: Boolean,
+  hideHeader: Boolean,
+  caption: String,
+  hideCaption: Boolean,
+  ariaLabel: String,
+  ariaLabelledby: String,
+  loading: Boolean,
+  loadingRows: {
+    type: Number,
+    default: 3
+  },
+  emptyText: {
+    type: String,
+    default: "No data"
+  },
+  elevation: Boolean,
+  showExpand: Boolean,
+  expanded: {
+    type: Array,
+    default: () => []
+  },
+  singleExpand: Boolean,
+  expandOnRowClick: Boolean,
+  spans: {
+    type: Array,
+    default: () => []
+  },
+  cellProps: Function,
+  rowProps: Function,
+  headerProps: Function
+}), _hoisted_1$5 = { class: "g-table__head" }, _hoisted_2$5 = { class: "g-table__row g-table__row_header" }, _hoisted_3$3 = {
+  key: 0,
+  class: "g-table__header g-table__header_expand",
+  scope: "col"
+}, _hoisted_4$3 = ["colspan", "rowspan"], _hoisted_5$2 = { class: "g-table__header-content" }, _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  name: "GTableHead",
+  __name: "GTableHead",
+  props: {
+    headers: {},
+    showExpand: { type: Boolean },
+    getHeaderStyle: { type: Function },
+    getHeaderAlign: { type: Function },
+    getHeaderAttrs: { type: Function },
+    getColumnFixedAttrs: { type: Function },
+    getHeaderSlotName: { type: Function }
+  },
+  setup(__props) {
+    const props = __props, headerCells = computed(
+      () => props.headers.map((header, index) => ({
+        header,
+        index,
+        attrs: props.getHeaderAttrs(header, index),
+        fixedAttrs: props.getColumnFixedAttrs(header, index)
+      }))
+    );
+    return (_ctx, _cache) => (openBlock(), createElementBlock("thead", _hoisted_1$5, [
+      createElementVNode("tr", _hoisted_2$5, [
+        __props.showExpand ? (openBlock(), createElementBlock("th", _hoisted_3$3)) : createCommentVNode("", !0),
+        (openBlock(!0), createElementBlock(Fragment, null, renderList(headerCells.value, (cell) => (openBlock(), createElementBlock(Fragment, {
+          key: String(cell.header.key)
+        }, [
+          cell.attrs.hidden ? createCommentVNode("", !0) : (openBlock(), createElementBlock("th", {
+            key: 0,
+            class: normalizeClass(["g-table__header", [
+              `g-table__header_align-${__props.getHeaderAlign(cell.header)}`,
+              {
+                "g-table__header_nowrap": cell.header.nowrap,
+                "g-table__header_shrink": cell.header.shrink,
+                [`g-table__header_state-${cell.attrs.state}`]: cell.attrs.state
+              },
+              cell.fixedAttrs.class,
+              cell.header.headerClass,
+              cell.attrs.class
+            ]]),
+            style: normalizeStyle([
+              __props.getHeaderStyle(cell.header),
+              cell.fixedAttrs.style,
+              cell.attrs.style
+            ]),
+            colspan: cell.attrs.colspan,
+            rowspan: cell.attrs.rowspan,
+            scope: "col"
+          }, [
+            createElementVNode("div", _hoisted_5$2, [
+              renderSlot(_ctx.$slots, __props.getHeaderSlotName(cell.header), {
+                header: cell.header,
+                index: cell.index
+              }, () => [
+                renderSlot(_ctx.$slots, "header", {
+                  header: cell.header,
+                  index: cell.index
+                }, () => [
+                  createTextVNode(toDisplayString(cell.header.title), 1)
+                ])
+              ])
+            ])
+          ], 14, _hoisted_4$3))
+        ], 64))), 128))
+      ])
+    ]));
+  }
+}), GTableSymbol = Symbol("GTable"), provideTableContext = (context) => {
+  provide(GTableSymbol, context);
+}, useTableContext = () => {
+  const context = inject(GTableSymbol);
+  if (!context)
+    throw new Error("GTable context is missing");
+  return context;
+}, _hoisted_1$4 = ["colspan", "rowspan"], _hoisted_2$4 = { class: "g-table__cell-content" }, _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  name: "GTableCell",
+  __name: "GTableCell",
+  props: {
+    item: {},
+    header: {},
+    rowIndex: {},
+    columnIndex: {}
+  },
+  setup(__props) {
+    const props = __props, table = useTableContext(), cellContext = computed(
+      () => table.getCellContext(
+        props.item,
+        props.header,
+        props.rowIndex,
+        props.columnIndex
+      )
+    ), cellAttrs = computed(() => table.getCellAttrs(cellContext.value)), fixedAttrs = computed(
+      () => table.getColumnFixedAttrs(props.header, props.columnIndex)
+    );
+    return (_ctx, _cache) => cellAttrs.value.hidden ? createCommentVNode("", !0) : (openBlock(), createElementBlock("td", {
+      key: 0,
+      class: normalizeClass(["g-table__cell", [
+        `g-table__cell_align-${unref(table).getAlign(__props.header)}`,
+        {
+          "g-table__cell_nowrap": __props.header.nowrap,
+          "g-table__cell_shrink": __props.header.shrink,
+          [`g-table__cell_state-${cellAttrs.value.state}`]: cellAttrs.value.state
+        },
+        fixedAttrs.value.class,
+        __props.header.cellClass,
+        cellAttrs.value.class
+      ]]),
+      style: normalizeStyle([fixedAttrs.value.style, cellAttrs.value.style]),
+      colspan: cellAttrs.value.colspan,
+      rowspan: cellAttrs.value.rowspan,
+      onClick: _cache[0] || (_cache[0] = ($event) => unref(table).onCellClick(cellContext.value, $event))
+    }, [
+      createElementVNode("div", _hoisted_2$4, [
+        renderSlot(_ctx.$slots, unref(table).getItemSlotName(__props.header), normalizeProps(guardReactiveProps(cellContext.value)), () => [
+          renderSlot(_ctx.$slots, "item", normalizeProps(guardReactiveProps(cellContext.value)), () => [
+            createTextVNode(toDisplayString(cellContext.value.value), 1)
+          ])
+        ])
+      ])
+    ], 14, _hoisted_1$4));
+  }
+}), _hoisted_1$3 = ["tabindex"], _hoisted_2$3 = {
+  key: 0,
+  class: "g-table__cell g-table__cell_expand"
+}, _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  name: "GTableRow",
+  __name: "GTableRow",
+  props: {
+    item: {},
+    rowIndex: {},
+    showExpand: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props, table = useTableContext(), rowContext = computed(
+      () => table.getRowContext(props.item, props.rowIndex)
+    ), rowAttrs = computed(
+      () => table.getRowAttrs(props.item, props.rowIndex)
+    ), onKeydown = (event) => {
+      table.rowInteractive.value && (event.key !== "Enter" && event.key !== " " || (event.preventDefault(), !(event.key === " " && event.repeat) && table.onRowClick(props.item, props.rowIndex, event)));
+    };
+    return (_ctx, _cache) => (openBlock(), createElementBlock("tr", {
+      class: normalizeClass(["g-table__row", [
+        {
+          "g-table__row_expanded": rowContext.value.expanded,
+          "g-table__row_interactive": unref(table).rowInteractive.value,
+          [`g-table__row_state-${rowAttrs.value.state}`]: rowAttrs.value.state
+        },
+        rowAttrs.value.class
+      ]]),
+      style: normalizeStyle(rowAttrs.value.style),
+      tabindex: unref(table).rowInteractive.value ? 0 : void 0,
+      onClick: _cache[1] || (_cache[1] = ($event) => unref(table).onRowClick(__props.item, __props.rowIndex, $event)),
+      onKeydown
+    }, [
+      __props.showExpand ? (openBlock(), createElementBlock("td", _hoisted_2$3, [
+        renderSlot(_ctx.$slots, "expand", normalizeProps(guardReactiveProps(unref(table).getRowContext(__props.item, __props.rowIndex))), () => [
+          createVNode(_sfc_main$6, {
+            "aria-expanded": unref(table).isRowExpanded(__props.item, __props.rowIndex),
+            "icon-button": unref(table).isRowExpanded(__props.item, __props.rowIndex) ? "chevron-up" : "chevron-down",
+            class: "g-table__expand-button",
+            ripple: !1,
+            size: "s",
+            variant: "text",
+            onClick: _cache[0] || (_cache[0] = withModifiers(($event) => unref(table).toggleExpanded(__props.item, __props.rowIndex), ["stop"]))
+          }, null, 8, ["aria-expanded", "icon-button"])
+        ])
+      ])) : createCommentVNode("", !0),
+      (openBlock(!0), createElementBlock(Fragment, null, renderList(unref(table).headers.value, (header, columnIndex) => (openBlock(), createBlock(_sfc_main$4, {
+        key: String(header.key),
+        "column-index": columnIndex,
+        header,
+        item: __props.item,
+        "row-index": __props.rowIndex
+      }, createSlots({
+        item: withCtx((slotProps) => [
+          renderSlot(_ctx.$slots, "item", mergeProps({ ref_for: !0 }, slotProps), () => [
+            createTextVNode(toDisplayString(slotProps.value), 1)
+          ])
+        ]),
+        _: 2
+      }, [
+        renderList(unref(table).headers.value, (headerSlot) => ({
+          name: unref(table).getItemSlotName(headerSlot),
+          fn: withCtx((slotProps) => [
+            renderSlot(_ctx.$slots, unref(table).getItemSlotName(headerSlot), mergeProps({ ref_for: !0 }, slotProps))
+          ])
+        }))
+      ]), 1032, ["column-index", "header", "item", "row-index"]))), 128))
+    ], 46, _hoisted_1$3));
+  }
+}), _hoisted_1$2 = { class: "g-table__row g-table__row_expanded-content" }, _hoisted_2$2 = ["colspan"], _hoisted_3$2 = {
+  key: 0,
+  class: "g-table__expanded-body"
+}, _hoisted_4$2 = { class: "g-table__expanded-content" }, _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  name: "GTableExpandedRow",
+  __name: "GTableExpandedRow",
+  props: {
+    item: {},
+    rowIndex: {}
+  },
+  setup(__props) {
+    const table = useTableContext();
+    return (_ctx, _cache) => (openBlock(), createElementBlock("tr", _hoisted_1$2, [
+      createElementVNode("td", {
+        class: "g-table__cell g-table__cell_expanded",
+        colspan: unref(table).columnCount.value
+      }, [
+        createVNode(unref(_sfc_main$7), {
+          duration: 240,
+          onAfterLeave: _cache[0] || (_cache[0] = ($event) => unref(table).onExpandedAfterLeave(__props.item, __props.rowIndex))
+        }, {
+          default: withCtx(() => [
+            unref(table).shouldRenderExpandedRow(__props.item, __props.rowIndex) ? withDirectives((openBlock(), createElementBlock("div", _hoisted_3$2, [
+              createElementVNode("div", _hoisted_4$2, [
+                renderSlot(_ctx.$slots, "expanded-row", normalizeProps(guardReactiveProps({
+                  ...unref(table).getRowContext(__props.item, __props.rowIndex),
+                  headers: unref(table).headers.value
+                })))
+              ])
+            ], 512)), [
+              [vShow, unref(table).isRowExpanded(__props.item, __props.rowIndex)]
+            ]) : createCommentVNode("", !0)
+          ]),
+          _: 3
+        })
+      ], 8, _hoisted_2$2)
+    ]));
+  }
+}), _hoisted_1$1 = { class: "g-table__body" }, _hoisted_2$1 = {
+  key: 1,
+  class: "g-table__row g-table__row_state"
+}, _hoisted_3$1 = ["colspan"], _hoisted_4$1 = {
+  "aria-hidden": "true",
+  class: "g-table__skeleton"
+}, _hoisted_5$1 = {
+  key: 2,
+  class: "g-table__row g-table__row_state"
+}, _hoisted_6 = ["colspan"], _hoisted_7 = { class: "g-table__empty" }, _hoisted_8 = { class: "g-table__empty-text" }, _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  name: "GTableBody",
+  __name: "GTableBody",
+  props: {
+    hasRows: { type: Boolean },
+    loading: { type: Boolean },
+    loadingRows: {},
+    emptyText: {},
+    showExpand: { type: Boolean },
+    hasExpandedRowSlot: { type: Boolean }
+  },
+  setup(__props) {
+    const slots = useSlots(), table = useTableContext();
+    return (_ctx, _cache) => (openBlock(), createElementBlock("tbody", _hoisted_1$1, [
+      unref(slots).body ? renderSlot(_ctx.$slots, "body", {
+        columnCount: unref(table).columnCount.value,
+        classes: unref(table).bodySlotClasses,
+        getCellContext: unref(table).getCellContext,
+        getRowContext: unref(table).getRowContext,
+        headers: unref(table).headers.value,
+        items: unref(table).items.value
+      }, void 0, void 0, 0) : __props.loading ? (openBlock(), createElementBlock("tr", _hoisted_2$1, [
+        createElementVNode("td", {
+          class: "g-table__cell g-table__cell_state",
+          colspan: unref(table).columnCount.value
+        }, [
+          renderSlot(_ctx.$slots, "loading", {}, () => [
+            createElementVNode("div", _hoisted_4$1, [
+              (openBlock(!0), createElementBlock(Fragment, null, renderList(__props.loadingRows, (row) => (openBlock(), createElementBlock("span", {
+                key: row,
+                class: "g-table__skeleton-row"
+              }))), 128))
+            ])
+          ])
+        ], 8, _hoisted_3$1)
+      ])) : __props.hasRows ? (openBlock(!0), createElementBlock(Fragment, { key: 3 }, renderList(unref(table).items.value, (item, rowIndex) => (openBlock(), createElementBlock(Fragment, {
+        key: unref(table).getItemKey(item, rowIndex)
+      }, [
+        unref(slots).row ? renderSlot(_ctx.$slots, "row", mergeProps({ ref_for: !0 }, {
+          ...unref(table).getRowContext(item, rowIndex),
+          headers: unref(table).headers.value
+        }), void 0, void 0, 0) : (openBlock(), createBlock(_sfc_main$3, {
+          key: 1,
+          item,
+          "row-index": rowIndex,
+          "show-expand": __props.showExpand
+        }, createSlots({
+          item: withCtx((slotProps) => [
+            renderSlot(_ctx.$slots, "item", mergeProps({ ref_for: !0 }, slotProps), () => [
+              createTextVNode(toDisplayString(slotProps.value), 1)
+            ])
+          ]),
+          _: 2
+        }, [
+          unref(slots).expand ? {
+            name: "expand",
+            fn: withCtx((slotProps) => [
+              renderSlot(_ctx.$slots, "expand", mergeProps({ ref_for: !0 }, slotProps))
+            ]),
+            key: "0"
+          } : void 0,
+          renderList(unref(table).headers.value, (header) => ({
+            name: unref(table).getItemSlotName(header),
+            fn: withCtx((slotProps) => [
+              renderSlot(_ctx.$slots, unref(table).getItemSlotName(header), mergeProps({ ref_for: !0 }, slotProps))
+            ])
+          }))
+        ]), 1032, ["item", "row-index", "show-expand"])),
+        __props.showExpand && __props.hasExpandedRowSlot ? (openBlock(), createBlock(_sfc_main$2, {
+          key: 2,
+          item,
+          "row-index": rowIndex
+        }, {
+          "expanded-row": withCtx((slotProps) => [
+            renderSlot(_ctx.$slots, "expanded-row", mergeProps({ ref_for: !0 }, slotProps))
+          ]),
+          _: 3
+        }, 8, ["item", "row-index"])) : createCommentVNode("", !0)
+      ], 64))), 128)) : (openBlock(), createElementBlock("tr", _hoisted_5$1, [
+        createElementVNode("td", {
+          class: "g-table__cell g-table__cell_state",
+          colspan: unref(table).columnCount.value
+        }, [
+          createElementVNode("div", _hoisted_7, [
+            renderSlot(_ctx.$slots, "empty", {}, () => [
+              createElementVNode("span", _hoisted_8, toDisplayString(__props.emptyText), 1)
+            ])
+          ])
+        ], 8, _hoisted_6)
+      ]))
+    ]));
+  }
+}), useTable = (props) => {
+  const resolvedHeaders = computed(() => props.headers ?? []), resolvedItems = computed(() => props.items ?? []), columnCount = computed(
+    () => resolvedHeaders.value.length + (props.showExpand ? 1 : 0)
+  ), hasRows = computed(() => resolvedItems.value.length > 0), bodySlotClasses = {
+    nativeRow: "g-table__native-row",
+    nativeCell: "g-table__native-cell",
+    nativeCellCenter: "g-table__native-cell g-table__native-cell_align-center",
+    nativeCellEnd: "g-table__native-cell g-table__native-cell_align-end",
+    groupCell: "g-table__native-cell g-table__native-cell_group"
+  }, toCssSize = (value) => typeof value == "number" ? `${value}px` : value, toCssOffset = (value) => toCssSize(value) ?? "0px", getColumnSize = (header) => header.width ?? header.minWidth, getFixedStartOffset = (index) => {
+    const headersOffset = resolvedHeaders.value.slice(0, index).filter((header) => header.fixed === "start").map((header) => toCssOffset(getColumnSize(header))), offsets = props.showExpand ? ["56px", ...headersOffset] : headersOffset;
+    return offsets.length > 0 ? `calc(${offsets.join(" + ")})` : "0px";
+  }, getFixedEndOffset = (index) => {
+    const offsets = resolvedHeaders.value.slice(index + 1).filter((header) => header.fixed === "end").map((header) => toCssOffset(getColumnSize(header)));
+    return offsets.length > 0 ? `calc(${offsets.join(" + ")})` : "0px";
+  }, getColumnFixedAttrs = (header, index) => header.fixed ? {
+    class: [
+      "g-table__column_fixed",
+      `g-table__column_fixed-${header.fixed}`
+    ],
+    style: {
+      [header.fixed === "start" ? "left" : "right"]: header.fixed === "start" ? getFixedStartOffset(index) : getFixedEndOffset(index)
+    }
+  } : {}, getHeaderStyle = (header) => ({
+    width: toCssSize(header.width),
+    minWidth: toCssSize(header.minWidth),
+    maxWidth: toCssSize(header.maxWidth)
+  }), getValueByPath = (item, key) => typeof key != "string" ? item[key] : key.split(".").reduce((value, pathKey) => {
+    if (!(value == null || typeof value != "object"))
+      return value[pathKey];
+  }, item), getItemKey = (item, index) => {
+    if (typeof props.itemKey == "function")
+      return props.itemKey(item, index);
+    const value = getValueByPath(item, props.itemKey ?? "id");
+    return typeof value == "string" || typeof value == "number" ? value : index;
+  }, getCellValue = (item, header, rowIndex) => {
+    const value = header.value ? header.value(item, rowIndex) : getValueByPath(item, header.key);
+    return header.format ? header.format(value, item, rowIndex) : value;
+  }, getCellContext = (item, header, rowIndex, columnIndex) => ({
+    item,
+    header,
+    value: getCellValue(item, header, rowIndex),
+    rowIndex,
+    columnIndex,
+    headers: resolvedHeaders.value
+  }), getHeaderAttrs = (header, index) => {
+    var _a;
+    return ((_a = props.headerProps) == null ? void 0 : _a.call(props, header, index)) ?? {};
+  }, getAlign = (header) => header.align ?? "start";
+  return {
+    resolvedHeaders,
+    resolvedItems,
+    columnCount,
+    hasRows,
+    bodySlotClasses,
+    getHeaderStyle,
+    getItemKey,
+    getCellContext,
+    getHeaderAttrs,
+    getColumnFixedAttrs,
+    getAlign,
+    getHeaderAlign: (header) => header.headerAlign ?? getAlign(header),
+    getHeaderSlotName: (header) => `header.${String(header.key)}`,
+    getItemSlotName: (header) => `item.${String(header.key)}`
+  };
+}, useTableExpansion = ({
+  props,
+  hasExpandedRowSlot,
+  getItemKey,
+  emitUpdateExpanded,
+  emitExpand
+}) => {
+  const expandedSet = computed(() => new Set(props.expanded ?? [])), mountedExpandedRows = ref(
+    new Set(props.expanded ?? [])
+  ), toggleExpanded = (item, index) => {
+    if (!props.showExpand) return;
+    const key = getItemKey(item, index), next = new Set(props.singleExpand ? [] : props.expanded), isExpanded = expandedSet.value.has(key);
+    isExpanded ? next.delete(key) : next.add(key);
+    const nextValue = Array.from(next);
+    emitUpdateExpanded(nextValue), emitExpand(item, !isExpanded);
+  }, isRowExpanded = (item, index) => expandedSet.value.has(getItemKey(item, index)), isExpandedRowMounted = (item, index) => mountedExpandedRows.value.has(getItemKey(item, index)), shouldRenderExpandedRow = (item, index) => !!(props.showExpand && hasExpandedRowSlot.value && isExpandedRowMounted(item, index)), onExpandedAfterLeave = (item, index) => {
+    const next = new Set(mountedExpandedRows.value);
+    next.delete(getItemKey(item, index)), mountedExpandedRows.value = next;
+  };
+  return watch(
+    () => props.expanded ?? [],
+    (value) => {
+      mountedExpandedRows.value = /* @__PURE__ */ new Set([
+        ...mountedExpandedRows.value,
+        ...value
+      ]);
+    },
+    { immediate: !0 }
+  ), {
+    expandedSet,
+    toggleExpanded,
+    isRowExpanded,
+    shouldRenderExpandedRow,
+    onExpandedAfterLeave
+  };
+}, mergeCellAttrs = (baseAttrs, nextAttrs) => ({
+  colspan: nextAttrs.colspan ?? baseAttrs.colspan,
+  rowspan: nextAttrs.rowspan ?? baseAttrs.rowspan,
+  hidden: !!(baseAttrs.hidden || nextAttrs.hidden),
+  class: [baseAttrs.class, nextAttrs.class],
+  style: [baseAttrs.style, nextAttrs.style]
+}), useTableSpans = ({
+  props,
+  resolvedHeaders,
+  resolvedItems,
+  getRowContext
+}) => {
+  const isSpanOriginRow = (span, item, rowIndex) => {
+    const rowContext = getRowContext(item, rowIndex);
+    return typeof span.row == "function" ? span.row(rowContext) : span.row === rowContext.key || span.row === rowIndex;
+  }, getSpanOriginRowIndex = (span) => resolvedItems.value.findIndex(
+    (item, rowIndex) => isSpanOriginRow(span, item, rowIndex)
+  ), getSpanOriginColumnIndex = (span) => resolvedHeaders.value.findIndex(
+    (header) => String(header.key) === String(span.column)
+  ), getSpanAttrs = (context) => {
+    const spans = props.spans ?? [];
+    for (const span of spans) {
+      const rowIndex = getSpanOriginRowIndex(span), columnIndex = getSpanOriginColumnIndex(span), colspan = span.colspan ?? 1, rowspan = span.rowspan ?? 1;
+      if (rowIndex < 0 || columnIndex < 0) continue;
+      const isOrigin = context.rowIndex === rowIndex && context.columnIndex === columnIndex, isCovered = context.rowIndex >= rowIndex && context.rowIndex < rowIndex + rowspan && context.columnIndex >= columnIndex && context.columnIndex < columnIndex + colspan;
+      if (isOrigin) return span;
+      if (isCovered) return { hidden: !0 };
+    }
+    return {};
+  };
+  return { getCellAttrs: (context) => {
+    var _a;
+    const spanAttrs = getSpanAttrs(context), customAttrs = ((_a = props.cellProps) == null ? void 0 : _a.call(props, context)) ?? {};
+    return mergeCellAttrs(spanAttrs, customAttrs);
+  } };
+}, _hoisted_1 = {
+  key: 0,
+  class: "g-table__top"
+}, _hoisted_2 = { class: "g-table__scroller" }, _hoisted_3 = ["aria-label", "aria-labelledby"], _hoisted_4 = {
+  key: 0,
+  class: "g-table__col g-table__col_expand"
+}, _hoisted_5 = {
+  key: 1,
+  class: "g-table__bottom"
+}, _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "GTable",
+  props: makeTableProps(),
+  emits: ["update:expanded", "expand", "row-click", "cell-click"],
+  setup(__props, { emit: __emit }) {
+    const props = __props, tableProps = props, densityClass = useDensity(props, "g-table"), emit = __emit, slots = useSlots(), {
+      getMorphBlobStyle,
+      morphBlobs,
+      morphEnabled,
+      materialFrameProps,
+      surfaceStyles,
+      surfaceMaterialMorphBlobClasses,
+      surfaceMaterialMorphClasses,
+      surfaceOverlayClasses,
+      surfaceUnderlayClasses,
+      surfaceTextureClasses,
+      surfaceContentClasses
+    } = useMaterialSurface(props, "g-table"), tableFrameProps = computed(() => ({
+      ...materialFrameProps.value,
+      borderRadius: props.borderRadius ?? (props.rounded ? 20 : 12)
+    })), hasExpandedRowSlot = computed(
+      () => !!slots.expandedRow || !!slots["expanded-row"]
+    ), table = useTable(tableProps), {
+      resolvedHeaders,
+      resolvedItems,
+      columnCount,
+      hasRows,
+      bodySlotClasses,
+      getHeaderStyle,
+      getItemKey,
+      getCellContext,
+      getHeaderAttrs,
+      getColumnFixedAttrs,
+      getAlign,
+      getHeaderAlign,
+      getHeaderSlotName,
+      getItemSlotName
+    } = table, headerSlotHeaders = computed(
+      () => resolvedHeaders.value.filter(
+        (header) => slots[getHeaderSlotName(header)]
+      )
+    ), itemSlotHeaders = computed(
+      () => resolvedHeaders.value.filter((header) => slots[getItemSlotName(header)])
+    ), rowInteractive = computed(
+      () => props.clickableRows || props.expandOnRowClick
+    ), hasFixedStart = computed(
+      () => resolvedHeaders.value.some((header) => header.fixed === "start")
+    ), hasFixedEnd = computed(
+      () => resolvedHeaders.value.some((header) => header.fixed === "end")
+    ), expansion = useTableExpansion({
+      props: tableProps,
+      hasExpandedRowSlot,
+      getItemKey,
+      emitUpdateExpanded: (value) => emit("update:expanded", value),
+      emitExpand: (item, expanded) => emit("expand", item, expanded)
+    }), {
+      toggleExpanded,
+      isRowExpanded,
+      shouldRenderExpandedRow,
+      onExpandedAfterLeave
+    } = expansion, getRowContext = (item, index) => {
+      const key = getItemKey(item, index);
+      return {
+        item,
+        index,
+        key,
+        expanded: isRowExpanded(item, index),
+        toggleExpanded: () => toggleExpanded(item, index)
+      };
+    }, getRowAttrs = (item, index) => {
+      var _a;
+      return ((_a = tableProps.rowProps) == null ? void 0 : _a.call(tableProps, getRowContext(item, index))) ?? {};
+    }, { getCellAttrs } = useTableSpans({
+      props: tableProps,
+      resolvedHeaders,
+      resolvedItems,
+      getRowContext
+    });
+    return provideTableContext({
+      headers: resolvedHeaders,
+      items: resolvedItems,
+      columnCount,
+      bodySlotClasses,
+      rowInteractive,
+      getItemKey,
+      getRowContext,
+      getRowAttrs,
+      getCellContext,
+      getCellAttrs,
+      getColumnFixedAttrs,
+      getAlign,
+      getItemSlotName,
+      isRowExpanded,
+      shouldRenderExpandedRow,
+      onExpandedAfterLeave,
+      toggleExpanded,
+      onRowClick: (item, index, event) => {
+        props.expandOnRowClick && toggleExpanded(item, index), emit("row-click", item, event);
+      },
+      onCellClick: (context, event) => {
+        emit("cell-click", context, event);
+      }
+    }), (_ctx, _cache) => (openBlock(), createBlock(GGradient, mergeProps({ class: "g-table__frame" }, tableFrameProps.value), {
+      default: withCtx(() => [
+        createElementVNode("div", {
+          class: normalizeClass(["g-table", [
+            `g-table_${props.variant}`,
+            unref(densityClass),
+            {
+              "g-table_rounded": props.rounded,
+              "g-table_sticky-header": props.stickyHeader,
+              "g-table_fixed-layout": props.fixedLayout,
+              "g-table_hover": props.hover,
+              "g-table_clickable-rows": rowInteractive.value,
+              "g-table_striped": props.striped,
+              "g-table_bordered": props.bordered,
+              "g-table_loading": props.loading,
+              "g-table_elevation": props.elevation,
+              [`g-table_texture-${props.texture}`]: props.texture !== "none",
+              "g-table_has-fixed-start": hasFixedStart.value,
+              "g-table_has-fixed-end": hasFixedEnd.value,
+              "g-table_expand-on-row-click": props.expandOnRowClick
+            }
+          ]]),
+          style: normalizeStyle(unref(surfaceStyles))
+        }, [
+          createElementVNode("span", {
+            class: normalizeClass(unref(surfaceUnderlayClasses))
+          }, null, 2),
+          unref(morphEnabled) ? (openBlock(), createElementBlock("span", {
+            key: 0,
+            class: normalizeClass(unref(surfaceMaterialMorphClasses)),
+            "aria-hidden": "true"
+          }, [
+            (openBlock(!0), createElementBlock(Fragment, null, renderList(unref(morphBlobs), (blob, index) => (openBlock(), createElementBlock("span", {
+              key: index,
+              class: normalizeClass(unref(surfaceMaterialMorphBlobClasses)),
+              style: normalizeStyle(unref(getMorphBlobStyle)(blob))
+            }, null, 6))), 128))
+          ], 2)) : createCommentVNode("", !0),
+          createElementVNode("span", {
+            class: normalizeClass(unref(surfaceOverlayClasses))
+          }, null, 2),
+          createElementVNode("span", {
+            class: normalizeClass(unref(surfaceTextureClasses))
+          }, null, 2),
+          createElementVNode("div", {
+            class: normalizeClass(["g-table__content", unref(surfaceContentClasses)])
+          }, [
+            unref(slots).top ? (openBlock(), createElementBlock("div", _hoisted_1, [
+              renderSlot(_ctx.$slots, "top")
+            ])) : createCommentVNode("", !0),
+            createElementVNode("div", _hoisted_2, [
+              createElementVNode("table", {
+                class: "g-table__table",
+                "aria-label": props.ariaLabel,
+                "aria-labelledby": props.ariaLabelledby
+              }, [
+                props.caption || unref(slots).caption ? (openBlock(), createElementBlock("caption", {
+                  key: 0,
+                  class: normalizeClass(["g-table__caption", {
+                    "g-table__caption_hidden": props.hideCaption
+                  }])
+                }, [
+                  renderSlot(_ctx.$slots, "caption", {}, () => [
+                    createTextVNode(toDisplayString(props.caption), 1)
+                  ])
+                ], 2)) : createCommentVNode("", !0),
+                createElementVNode("colgroup", null, [
+                  props.showExpand ? (openBlock(), createElementBlock("col", _hoisted_4)) : createCommentVNode("", !0),
+                  (openBlock(!0), createElementBlock(Fragment, null, renderList(unref(resolvedHeaders), (header) => (openBlock(), createElementBlock("col", {
+                    key: String(header.key),
+                    class: normalizeClass(["g-table__col", {
+                      "g-table__col_shrink": header.shrink
+                    }]),
+                    style: normalizeStyle(unref(getHeaderStyle)(header))
+                  }, null, 6))), 128))
+                ]),
+                props.hideHeader ? createCommentVNode("", !0) : (openBlock(), createBlock(_sfc_main$5, {
+                  key: 1,
+                  "get-column-fixed-attrs": unref(getColumnFixedAttrs),
+                  "get-header-align": unref(getHeaderAlign),
+                  "get-header-attrs": unref(getHeaderAttrs),
+                  "get-header-slot-name": unref(getHeaderSlotName),
+                  "get-header-style": unref(getHeaderStyle),
+                  headers: unref(resolvedHeaders),
+                  "show-expand": props.showExpand
+                }, createSlots({
+                  header: withCtx((slotProps) => [
+                    renderSlot(_ctx.$slots, "header", normalizeProps(guardReactiveProps(slotProps)), () => [
+                      createTextVNode(toDisplayString(slotProps.header.title), 1)
+                    ])
+                  ]),
+                  _: 2
+                }, [
+                  renderList(headerSlotHeaders.value, (header) => ({
+                    name: unref(getHeaderSlotName)(header),
+                    fn: withCtx((slotProps) => [
+                      renderSlot(_ctx.$slots, unref(getHeaderSlotName)(header), normalizeProps(guardReactiveProps(slotProps)), () => [
+                        renderSlot(_ctx.$slots, "header", normalizeProps(guardReactiveProps(slotProps)), () => [
+                          createTextVNode(toDisplayString(slotProps.header.title), 1)
+                        ])
+                      ])
+                    ])
+                  }))
+                ]), 1032, ["get-column-fixed-attrs", "get-header-align", "get-header-attrs", "get-header-slot-name", "get-header-style", "headers", "show-expand"])),
+                createVNode(_sfc_main$1, {
+                  "empty-text": props.emptyText,
+                  "has-expanded-row-slot": hasExpandedRowSlot.value,
+                  "has-rows": unref(hasRows),
+                  loading: props.loading,
+                  "loading-rows": props.loadingRows,
+                  "show-expand": props.showExpand
+                }, createSlots({
+                  loading: withCtx(() => [
+                    renderSlot(_ctx.$slots, "loading", {}, () => [
+                      _cache[0] || (_cache[0] = createTextVNode("Loading...", -1))
+                    ])
+                  ]),
+                  empty: withCtx(() => [
+                    renderSlot(_ctx.$slots, "empty", {}, () => [
+                      createTextVNode(toDisplayString(props.emptyText), 1)
+                    ])
+                  ]),
+                  item: withCtx((slotProps) => [
+                    renderSlot(_ctx.$slots, "item", normalizeProps(guardReactiveProps(slotProps)), () => [
+                      createTextVNode(toDisplayString(slotProps.value), 1)
+                    ])
+                  ]),
+                  _: 2
+                }, [
+                  unref(slots).body ? {
+                    name: "body",
+                    fn: withCtx((slotProps) => [
+                      renderSlot(_ctx.$slots, "body", normalizeProps(guardReactiveProps(slotProps)))
+                    ]),
+                    key: "0"
+                  } : void 0,
+                  unref(slots).row ? {
+                    name: "row",
+                    fn: withCtx((slotProps) => [
+                      renderSlot(_ctx.$slots, "row", normalizeProps(guardReactiveProps(slotProps)))
+                    ]),
+                    key: "1"
+                  } : void 0,
+                  unref(slots).expand ? {
+                    name: "expand",
+                    fn: withCtx((slotProps) => [
+                      renderSlot(_ctx.$slots, "expand", normalizeProps(guardReactiveProps(slotProps)))
+                    ]),
+                    key: "2"
+                  } : void 0,
+                  renderList(itemSlotHeaders.value, (header) => ({
+                    name: unref(getItemSlotName)(header),
+                    fn: withCtx((slotProps) => [
+                      renderSlot(_ctx.$slots, unref(getItemSlotName)(header), normalizeProps(guardReactiveProps(slotProps)))
+                    ])
+                  })),
+                  hasExpandedRowSlot.value ? {
+                    name: "expanded-row",
+                    fn: withCtx((slotProps) => [
+                      renderSlot(_ctx.$slots, "expanded-row", normalizeProps(guardReactiveProps(slotProps)))
+                    ]),
+                    key: "3"
+                  } : void 0
+                ]), 1032, ["empty-text", "has-expanded-row-slot", "has-rows", "loading", "loading-rows", "show-expand"])
+              ], 8, _hoisted_3)
+            ]),
+            unref(slots).bottom ? (openBlock(), createElementBlock("div", _hoisted_5, [
+              renderSlot(_ctx.$slots, "bottom")
+            ])) : createCommentVNode("", !0)
+          ], 2)
+        ], 6)
+      ]),
+      _: 3
+    }, 16));
+  }
+});
+export {
+  _sfc_main as _
+};