@hitachivantara/uikit-react-core 6.8.2 → 6.9.0

package/dist/Table/hooks/useHvHeaderGroups.js

@@ -1,90 +1,81 @@
-const replaceHeaderPlaceholders = (headerGroups) => {
-  const [headerGroup] = headerGroups;
-  const hasPlaceholderHeaders = headerGroup.headers.some(
-    (h) => h.placeholderOf != null
-  );
-  if (!hasPlaceholderHeaders) {
-    return;
-  }
-  const maxDepth = headerGroups.length - 1;
-  const leafGroup = headerGroups[maxDepth];
-  headerGroup.headers.forEach((header, position) => {
-    const { placeholderOf } = header;
-    const isPlaceholderHeader = placeholderOf != null;
-    if (isPlaceholderHeader) {
-      const leafIndex = leafGroup.headers.slice(position).findIndex(({ id }) => id === placeholderOf.id) + position;
-      header.variant = placeholderOf.variant;
-      header.depth = maxDepth;
-      leafGroup.headers[leafIndex] = header;
-      placeholderOf.rowSpan = maxDepth + 1;
-      headerGroup.headers[position] = placeholderOf;
-    }
-  });
+//#region src/Table/hooks/useHvHeaderGroups.ts
+/**
+* Moving non grouped headers to the top level,
+* by placing them in the position of their top level placeholder.
+*
+* By default the header groups are built bottom top,
+* that results in non grouped headers to be placed
+* at the bottom row in the table head.
+*
+* @param {Array.<Object>} headerGroups - table header groups
+*/
+var replaceHeaderPlaceholders = (headerGroups) => {
+	const [headerGroup] = headerGroups;
+	if (!headerGroup.headers.some((h) => h.placeholderOf != null)) return;
+	const maxDepth = headerGroups.length - 1;
+	const leafGroup = headerGroups[maxDepth];
+	headerGroup.headers.forEach((header, position) => {
+		const { placeholderOf } = header;
+		if (placeholderOf != null) {
+			const leafIndex = leafGroup.headers.slice(position).findIndex(({ id }) => id === placeholderOf.id) + position;
+			header.variant = placeholderOf.variant;
+			header.depth = maxDepth;
+			leafGroup.headers[leafIndex] = header;
+			placeholderOf.rowSpan = maxDepth + 1;
+			headerGroup.headers[position] = placeholderOf;
+		}
+	});
 };
-const getCellProps = (column, isHeaderCell = false) => ({
-  groupColumnMostLeft: column.isGroupLeftColumn,
-  groupColumnMostRight: column.isGroupRightColumn,
-  rowSpan: isHeaderCell && column.rowSpan != null ? column.rowSpan : 1
+var getCellProps = (column, isHeaderCell = false) => ({
+	groupColumnMostLeft: column.isGroupLeftColumn,
+	groupColumnMostRight: column.isGroupRightColumn,
+	rowSpan: isHeaderCell && column.rowSpan != null ? column.rowSpan : 1
 });
-const getHeaderPropsHook = (props, { instance, column }) => {
-  const nextProps = instance.hasGroupedColumns ? getCellProps(column, true) : {};
-  if (instance.hasGroupedColumns) {
-    const isPlaceholder = column.placeholderOf != null;
-    nextProps.style = {
-      display: isPlaceholder ? "none" : props.style?.display
-    };
-    if (instance.hasStickyColumns) {
-      if (isPlaceholder) {
-        nextProps.style.display = "inline-flex";
-        nextProps.style.visibility = "hidden";
-      }
-      if (column.parent || isPlaceholder) {
-        nextProps.style.marginTop = `calc(var(--cell-height) * -1)`;
-      }
-      if (column.rowSpan > 1) {
-        nextProps.style.height = `calc(var(--first-row-cell-height) + var(--cell-height) * ${column.rowSpan - 1})`;
-      }
-    }
-  }
-  return [props, nextProps];
+var getHeaderPropsHook = (props, { instance, column }) => {
+	const nextProps = instance.hasGroupedColumns ? getCellProps(column, true) : {};
+	if (instance.hasGroupedColumns) {
+		const isPlaceholder = column.placeholderOf != null;
+		nextProps.style = { display: isPlaceholder ? "none" : props.style?.display };
+		if (instance.hasStickyColumns) {
+			if (isPlaceholder) {
+				nextProps.style.display = "inline-flex";
+				nextProps.style.visibility = "hidden";
+			}
+			if (column.parent || isPlaceholder) nextProps.style.marginTop = `calc(var(--cell-height) * -1)`;
+			if (column.rowSpan > 1) nextProps.style.height = `calc(var(--first-row-cell-height) + var(--cell-height) * ${column.rowSpan - 1})`;
+		}
+	}
+	return [props, nextProps];
 };
-const getCellPropsHook = (props, { instance, cell }) => {
-  const nextProps = instance.hasGroupedColumns ? getCellProps(cell.column) : {};
-  return [props, nextProps];
+var getCellPropsHook = (props, { instance, cell }) => {
+	return [props, instance.hasGroupedColumns ? getCellProps(cell.column) : {}];
 };
-const visibleColumnsHook = (visibleColumns, { instance }) => {
-  const parentList = /* @__PURE__ */ new Set();
-  visibleColumns.forEach(({ parent }) => {
-    if (parent != null && !parentList.has(parent)) {
-      parentList.add(parent);
-    }
-  });
-  const hasGroupedColumns = parentList.size > 0;
-  if (hasGroupedColumns) {
-    parentList.forEach((parent) => {
-      parent.align = "center";
-      parent.isGroupLeftColumn = true;
-      parent.isGroupRightColumn = true;
-      const { columns } = parent;
-      columns[0].isGroupLeftColumn = true;
-      columns[columns.length - 1].isGroupRightColumn = true;
-    });
-  }
-  Object.assign(instance, { hasGroupedColumns });
-  return visibleColumns;
+var visibleColumnsHook = (visibleColumns, { instance }) => {
+	const parentList = /* @__PURE__ */ new Set();
+	visibleColumns.forEach(({ parent }) => {
+		if (parent != null && !parentList.has(parent)) parentList.add(parent);
+	});
+	const hasGroupedColumns = parentList.size > 0;
+	if (hasGroupedColumns) parentList.forEach((parent) => {
+		parent.align = "center";
+		parent.isGroupLeftColumn = true;
+		parent.isGroupRightColumn = true;
+		const { columns } = parent;
+		columns[0].isGroupLeftColumn = true;
+		columns[columns.length - 1].isGroupRightColumn = true;
+	});
+	Object.assign(instance, { hasGroupedColumns });
+	return visibleColumns;
 };
-const useInstanceHook = (instance) => {
-  if (instance.hasGroupedColumns) {
-    replaceHeaderPlaceholders(instance.headerGroups);
-  }
+var useInstanceHook = (instance) => {
+	if (instance.hasGroupedColumns) replaceHeaderPlaceholders(instance.headerGroups);
 };
-const useHvHeaderGroups = (hooks) => {
-  hooks.visibleColumns.push(visibleColumnsHook);
-  hooks.useInstance.push(useInstanceHook);
-  hooks.getHeaderProps.push(getHeaderPropsHook);
-  hooks.getCellProps.push(getCellPropsHook);
+var useHvHeaderGroups = (hooks) => {
+	hooks.visibleColumns.push(visibleColumnsHook);
+	hooks.useInstance.push(useInstanceHook);
+	hooks.getHeaderProps.push(getHeaderPropsHook);
+	hooks.getCellProps.push(getCellPropsHook);
 };
 useHvHeaderGroups.pluginName = "useHvHeaderGroups";
-export {
-  useHvHeaderGroups
-};
+//#endregion
+export { useHvHeaderGroups };

package/dist/Table/hooks/useHvPagination.js

@@ -1,55 +1,35 @@
-import { ensurePluginOrder, useGetLatest, makePropGetter } from "react-table";
-const useInstanceHook = (instance) => {
-  ensurePluginOrder(
-    instance.plugins,
-    [
-      "usePagination",
-      "useHvGlobalFilter",
-      "useHvFilters",
-      "useGroupBy",
-      "useHvSortBy",
-      "useHvRowExpand"
-    ],
-    "useHvPagination"
-  );
-  const getInstance = useGetLatest(instance);
-  const getHvPaginationProps = makePropGetter(
-    instance.getHooks().getHvPaginationProps,
-    {
-      instance: getInstance()
-    }
-  );
-  Object.assign(instance, {
-    getHvPaginationProps
-  });
+import { ensurePluginOrder, makePropGetter, useGetLatest } from "react-table";
+//#region src/Table/hooks/useHvPagination.ts
+var useInstanceHook = (instance) => {
+	ensurePluginOrder(instance.plugins, [
+		"usePagination",
+		"useHvGlobalFilter",
+		"useHvFilters",
+		"useGroupBy",
+		"useHvSortBy",
+		"useHvRowExpand"
+	], "useHvPagination");
+	const getInstance = useGetLatest(instance);
+	const getHvPaginationProps = makePropGetter(instance.getHooks().getHvPaginationProps, { instance: getInstance() });
+	Object.assign(instance, { getHvPaginationProps });
 };
-const defaultGetHvPaginationProps = (props, { instance }) => {
-  const {
-    canPreviousPage,
-    canNextPage,
-    pageOptions,
-    gotoPage,
-    setPageSize,
-    state: { pageSize, pageIndex },
-    labels
-  } = instance;
-  const nextProps = {
-    canPrevious: canPreviousPage,
-    canNext: canNextPage,
-    pages: pageOptions.length,
-    page: pageIndex,
-    pageSize,
-    onPageChange: gotoPage,
-    onPageSizeChange: setPageSize,
-    labels
-  };
-  return [props, nextProps];
+var defaultGetHvPaginationProps = (props, { instance }) => {
+	const { canPreviousPage, canNextPage, pageOptions, gotoPage, setPageSize, state: { pageSize, pageIndex }, labels } = instance;
+	return [props, {
+		canPrevious: canPreviousPage,
+		canNext: canNextPage,
+		pages: pageOptions.length,
+		page: pageIndex,
+		pageSize,
+		onPageChange: gotoPage,
+		onPageSizeChange: setPageSize,
+		labels
+	}];
 };
-const useHvPagination = (hooks) => {
-  hooks.getHvPaginationProps = [defaultGetHvPaginationProps];
-  hooks.useInstance.push(useInstanceHook);
+var useHvPagination = (hooks) => {
+	hooks.getHvPaginationProps = [defaultGetHvPaginationProps];
+	hooks.useInstance.push(useInstanceHook);
 };
 useHvPagination.pluginName = "useHvPagination";
-export {
-  useHvPagination
-};
+//#endregion
+export { useHvPagination };

package/dist/Table/hooks/useHvResizeColumns.js

@@ -1,37 +1,31 @@
 import { ensurePluginOrder } from "react-table";
-const getHeaderPropsHook = (props, { column }) => {
-  const resizerProps = column.getResizerProps?.() || {};
-  resizerProps.onClick = (e) => {
-    e.preventDefault();
-    e.stopPropagation();
-  };
-  const nextProps = {
-    resizable: column.canResize,
-    resizing: column.isResizing,
-    resizerProps
-  };
-  return [props, nextProps];
+//#region src/Table/hooks/useHvResizeColumns.ts
+var getHeaderPropsHook = (props, { column }) => {
+	const resizerProps = column.getResizerProps?.() || {};
+	resizerProps.onClick = (e) => {
+		e.preventDefault();
+		e.stopPropagation();
+	};
+	return [props, {
+		resizable: column.canResize,
+		resizing: column.isResizing,
+		resizerProps
+	}];
 };
-const getCellPropsHook = (props, { cell }) => {
-  const nextProps = {
-    resizable: cell.column.canResize,
-    resizing: cell.column.isResizing
-  };
-  return [props, nextProps];
+var getCellPropsHook = (props, { cell }) => {
+	return [props, {
+		resizable: cell.column.canResize,
+		resizing: cell.column.isResizing
+	}];
 };
-const useInstanceHook = (instance) => {
-  ensurePluginOrder(
-    instance.plugins,
-    ["useResizeColumns"],
-    "useHvResizeColumns"
-  );
+var useInstanceHook = (instance) => {
+	ensurePluginOrder(instance.plugins, ["useResizeColumns"], "useHvResizeColumns");
 };
-const useHvResizeColumns = (hooks) => {
-  hooks.getHeaderProps.push(getHeaderPropsHook);
-  hooks.getCellProps.push(getCellPropsHook);
-  hooks.useInstance.push(useInstanceHook);
+var useHvResizeColumns = (hooks) => {
+	hooks.getHeaderProps.push(getHeaderPropsHook);
+	hooks.getCellProps.push(getCellPropsHook);
+	hooks.useInstance.push(useInstanceHook);
 };
 useHvResizeColumns.pluginName = "useHvResizeColumns";
-export {
-  useHvResizeColumns
-};
+//#endregion
+export { useHvResizeColumns };

package/dist/Table/hooks/useHvRowExpand.js

@@ -1,77 +1,62 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { useLabels } from "../../hooks/useLabels.js";
+import { HvTypography } from "../../Typography/Typography.js";
 import { HvIcon } from "../../icons.js";
 import { HvButton } from "../../Button/Button.js";
-import { HvTypography } from "../../Typography/Typography.js";
-const DEFAULT_LABELS = {
-  expandRowButtonAriaLabel: "Expand this row",
-  collapseRowButtonAriaLabel: "Collapse this row"
+import { useLabels } from "../../hooks/useLabels.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/Table/hooks/useHvRowExpand.tsx
+var DEFAULT_LABELS = {
+	expandRowButtonAriaLabel: "Expand this row",
+	collapseRowButtonAriaLabel: "Collapse this row"
 };
-const CellWithExpandButton = ({
-  row,
-  cell,
-  labels: labelsProp
-}) => {
-  const labels = useLabels(DEFAULT_LABELS, labelsProp);
-  const rowProps = row.getToggleRowExpandedProps?.();
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      HvButton,
-      {
-        icon: true,
-        "aria-label": row.isExpanded ? labels.collapseRowButtonAriaLabel : labels.expandRowButtonAriaLabel,
-        "aria-expanded": row.isExpanded,
-        onClick: rowProps?.onClick,
-        children: /* @__PURE__ */ jsx(HvIcon, { name: "CaretDown", size: "xs", rotate: row.isExpanded })
-      }
-    ),
-    cell?.value && /* @__PURE__ */ jsx(HvTypography, { variant: "label", component: "span", children: cell.value })
-  ] });
+var CellWithExpandButton = ({ row, cell, labels: labelsProp }) => {
+	const labels = useLabels(DEFAULT_LABELS, labelsProp);
+	const rowProps = row.getToggleRowExpandedProps?.();
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(HvButton, {
+		icon: true,
+		"aria-label": row.isExpanded ? labels.collapseRowButtonAriaLabel : labels.expandRowButtonAriaLabel,
+		"aria-expanded": row.isExpanded,
+		onClick: rowProps?.onClick,
+		children: /* @__PURE__ */ jsx(HvIcon, {
+			name: "CaretDown",
+			size: "xs",
+			rotate: row.isExpanded
+		})
+	}), cell?.value && /* @__PURE__ */ jsx(HvTypography, {
+		variant: "label",
+		component: "span",
+		children: cell.value
+	})] });
 };
-const visibleColumnsHook = (columns, { instance }) => {
-  if (instance.disableCreateExpandButton) {
-    return columns;
-  }
-  const firstDataColumnIndex = columns.findIndex(
-    (c) => !c.id?.startsWith("_hv_")
-  );
-  if (firstDataColumnIndex !== -1) {
-    const firstDataColumn = columns[firstDataColumnIndex];
-    if (firstDataColumn.Cell === CellWithExpandButton) return columns;
-    if (firstDataColumn.Cell == null) {
-      firstDataColumn.Cell = CellWithExpandButton;
-      firstDataColumn.variant = "expand";
-      return columns;
-    }
-  }
-  const expandColumn = {
-    id: "_hv_expand",
-    variant: "none",
-    width: 32,
-    // this will only work when using useHvTableSticky
-    // but ensures it stays left of any sticky column
-    sticky: "left",
-    Cell: CellWithExpandButton
-  };
-  const columnsCopy = [...columns];
-  columnsCopy.splice(
-    firstDataColumnIndex !== -1 ? firstDataColumnIndex : 0,
-    0,
-    expandColumn
-  );
-  return columnsCopy;
+var visibleColumnsHook = (columns, { instance }) => {
+	if (instance.disableCreateExpandButton) return columns;
+	const firstDataColumnIndex = columns.findIndex((c) => !c.id?.startsWith("_hv_"));
+	if (firstDataColumnIndex !== -1) {
+		const firstDataColumn = columns[firstDataColumnIndex];
+		if (firstDataColumn.Cell === CellWithExpandButton) return columns;
+		if (firstDataColumn.Cell == null) {
+			firstDataColumn.Cell = CellWithExpandButton;
+			firstDataColumn.variant = "expand";
+			return columns;
+		}
+	}
+	const expandColumn = {
+		id: "_hv_expand",
+		variant: "none",
+		width: 32,
+		sticky: "left",
+		Cell: CellWithExpandButton
+	};
+	const columnsCopy = [...columns];
+	columnsCopy.splice(firstDataColumnIndex !== -1 ? firstDataColumnIndex : 0, 0, expandColumn);
+	return columnsCopy;
 };
-const getRowPropsHook = (props, { row }) => {
-  const nextProps = {
-    expanded: row.isExpanded
-  };
-  return [props, nextProps];
+var getRowPropsHook = (props, { row }) => {
+	return [props, { expanded: row.isExpanded }];
 };
-const useHvRowExpand = (hooks) => {
-  hooks.visibleColumns.push(visibleColumnsHook);
-  hooks.getRowProps.push(getRowPropsHook);
+var useHvRowExpand = (hooks) => {
+	hooks.visibleColumns.push(visibleColumnsHook);
+	hooks.getRowProps.push(getRowPropsHook);
 };
 useHvRowExpand.pluginName = "useHvRowExpand";
-export {
-  useHvRowExpand
-};
+//#endregion
+export { useHvRowExpand };