boreal-ui 0.0.72 → 0.0.73

package/dist/core/DataTable-CCPWihcW.cjs

@@ -0,0 +1,313 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const classNames = require("./classNames-BcWMx052.cjs");
+const capitalize = require("./capitalize-DoV-nOmN.cjs");
+const borealStyleConfig = require("./boreal-style-config-C1UIwOFN.cjs");
+function DataTableBase({
+  columns,
+  data,
+  onRowClick,
+  classMap,
+  theme = borealStyleConfig.getDefaultTheme(),
+  rounding = borealStyleConfig.getDefaultRounding(),
+  shadow = borealStyleConfig.getDefaultShadow(),
+  state = "",
+  outline = false,
+  className = "",
+  striped = true,
+  defaultSortKey,
+  defaultSortOrder = "asc",
+  serverSort = false,
+  onSortChange,
+  rowKey,
+  caption = "Data table",
+  hideCaption = true,
+  getSortAriaLabel,
+  getSortAnnouncement,
+  getRowAriaLabel,
+  getRowAriaDescription,
+  emptyMessage = "No data available",
+  loading = false,
+  loadingMessage = "Loading data",
+  colCount,
+  rowCount,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "data-testid": testId = "data-table"
+}) {
+  const [sortKey, setSortKey] = React.useState(defaultSortKey);
+  const [sortOrder, setSortOrder] = React.useState(defaultSortOrder);
+  const [sortAnnouncement, setSortAnnouncement] = React.useState("");
+  const captionId = `${testId}-caption`;
+  const liveRegionId = `${testId}-live-region`;
+  const computedAriaDescribedBy = [
+    ariaDescribedBy,
+    caption ? captionId : void 0,
+    liveRegionId
+  ].filter(Boolean).join(" ");
+  const sortedData = React.useMemo(() => {
+    if (serverSort || !sortKey) return data;
+    return [...data].sort((a, b) => {
+      const valA = a[sortKey];
+      const valB = b[sortKey];
+      if (valA === valB) return 0;
+      if (valA == null) return 1;
+      if (valB == null) return -1;
+      const numA = Number(valA);
+      const numB = Number(valB);
+      const bothNumeric = !Number.isNaN(numA) && !Number.isNaN(numB);
+      if (bothNumeric) {
+        return sortOrder === "asc" ? numA - numB : numB - numA;
+      }
+      const cmp = String(valA).localeCompare(String(valB), void 0, {
+        numeric: true
+      });
+      return sortOrder === "asc" ? cmp : -cmp;
+    });
+  }, [data, sortKey, sortOrder, serverSort]);
+  const announceSortChange = (column, nextOrder) => {
+    const message = getSortAnnouncement ? getSortAnnouncement(column, nextOrder) : `${column.label} sorted ${nextOrder === "asc" ? "ascending" : "descending"}`;
+    setSortAnnouncement(message);
+  };
+  const handleSort = (column) => {
+    const nextOrder = column.key === sortKey && sortOrder === "asc" ? "desc" : "asc";
+    setSortKey(column.key);
+    setSortOrder(nextOrder);
+    announceSortChange(column, nextOrder);
+    if (serverSort && onSortChange) {
+      onSortChange(column.key, nextOrder);
+    }
+  };
+  const handleSortKeyDown = (column) => (e) => {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      handleSort(column);
+    }
+  };
+  const handleRowKeyDown = (row) => (e) => {
+    if (!onRowClick) return;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      onRowClick(row);
+    }
+  };
+  const getHeaderScope = (column) => column.scope ?? "col";
+  const getHeaderId = (column) => column.id ?? `${testId}-header-${String(column.key)}`;
+  const getColumnAriaLabel = (column, isActive) => {
+    if (!column.sortable) {
+      return column.srLabel;
+    }
+    if (getSortAriaLabel) {
+      return getSortAriaLabel(column, sortOrder, isActive);
+    }
+    const baseLabel = column.srLabel ?? column.label;
+    if (isActive) {
+      return `${baseLabel}, sorted ${sortOrder === "asc" ? "ascending" : "descending"}. Activate to sort ${sortOrder === "asc" ? "descending" : "ascending"}.`;
+    }
+    return `${baseLabel}. Activate to sort ascending.`;
+  };
+  const renderCellContent = (row, column) => {
+    const value = row[column.key];
+    if (column.render) {
+      return column.render(value, row);
+    }
+    if (typeof value === "object" && value !== null) {
+      return JSON.stringify(value);
+    }
+    return String(value ?? "");
+  };
+  React.useEffect(() => {
+    if (!sortKey) {
+      setSortAnnouncement("");
+      return;
+    }
+    const activeColumn = columns.find((column) => column.key === sortKey);
+    if (!activeColumn) return;
+    announceSortChange(activeColumn, sortOrder);
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: classNames.combineClassNames(
+        classMap.wrapper,
+        shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
+        rounding && classMap[`round${capitalize.capitalize(rounding)}`],
+        striped && classMap.striped,
+        className
+      ),
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            id: liveRegionId,
+            className: classMap.srOnly ?? "sr_only",
+            "aria-live": "polite",
+            "aria-atomic": "true",
+            children: loading ? loadingMessage : sortAnnouncement
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "table",
+          {
+            className: classNames.combineClassNames(
+              classMap.table,
+              classMap[theme],
+              classMap[state],
+              outline && classMap.outline
+            ),
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledBy,
+            "aria-describedby": computedAriaDescribedBy || void 0,
+            "aria-colcount": colCount,
+            "aria-rowcount": rowCount,
+            children: [
+              caption ? /* @__PURE__ */ jsxRuntime.jsx(
+                "caption",
+                {
+                  id: captionId,
+                  className: hideCaption ? classMap.srOnly ?? "sr_only" : void 0,
+                  children: caption
+                }
+              ) : null,
+              /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsx("tr", { children: columns.map((column) => {
+                const isActive = sortKey === column.key;
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  "th",
+                  {
+                    id: getHeaderId(column),
+                    scope: getHeaderScope(column),
+                    "aria-sort": column.sortable ? isActive ? sortOrder === "asc" ? "ascending" : "descending" : "none" : void 0,
+                    className: classNames.combineClassNames(
+                      column.sortable && classMap.sortable,
+                      classMap.headerCell
+                    ),
+                    children: column.sortable ? /* @__PURE__ */ jsxRuntime.jsxs(
+                      "button",
+                      {
+                        type: "button",
+                        className: classMap.sortButton,
+                        onClick: () => handleSort(column),
+                        onKeyDown: handleSortKeyDown(column),
+                        "aria-label": getColumnAriaLabel(column, isActive),
+                        "data-testid": `${testId}-sort-${String(column.key)}`,
+                        children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { children: column.label }),
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.sortIcon, "aria-hidden": "true", children: isActive ? sortOrder === "asc" ? "▲" : "▼" : "⇅" })
+                        ]
+                      }
+                    ) : /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-label": column.srLabel, children: column.label })
+                  },
+                  String(column.key)
+                );
+              }) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: loading ? /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx(
+                "td",
+                {
+                  className: classMap.emptyCell,
+                  colSpan: columns.length,
+                  "aria-live": "polite",
+                  children: loadingMessage
+                }
+              ) }) : sortedData.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx(
+                "td",
+                {
+                  className: classMap.emptyCell,
+                  colSpan: columns.length,
+                  "aria-live": "polite",
+                  children: emptyMessage
+                }
+              ) }) : sortedData.map((row, index) => {
+                const key = rowKey ? rowKey(row) : index;
+                const rowAriaLabel = getRowAriaLabel == null ? void 0 : getRowAriaLabel(row, index);
+                const rowAriaDescription = getRowAriaDescription == null ? void 0 : getRowAriaDescription(row, index);
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  "tr",
+                  {
+                    className: classNames.combineClassNames(
+                      onRowClick && classMap.clickable,
+                      striped && index % 2 === 1 && classMap.striped
+                    ),
+                    onClick: () => onRowClick == null ? void 0 : onRowClick(row),
+                    onKeyDown: handleRowKeyDown(row),
+                    tabIndex: onRowClick ? 0 : void 0,
+                    "aria-label": onRowClick ? rowAriaLabel : void 0,
+                    "aria-description": onRowClick ? rowAriaDescription : void 0,
+                    "data-testid": `${testId}-row-${key}`,
+                    children: columns.map((column) => {
+                      const cellKey = String(column.key);
+                      const content = renderCellContent(row, column);
+                      const headerId = getHeaderId(column);
+                      if (column.isRowHeader) {
+                        return /* @__PURE__ */ jsxRuntime.jsx(
+                          "th",
+                          {
+                            scope: "row",
+                            headers: headerId,
+                            "data-label": column.label,
+                            className: classMap.cell,
+                            children: content
+                          },
+                          cellKey
+                        );
+                      }
+                      return /* @__PURE__ */ jsxRuntime.jsx(
+                        "td",
+                        {
+                          headers: headerId,
+                          "data-label": column.label,
+                          className: classMap.cell,
+                          children: content
+                        },
+                        cellKey
+                      );
+                    })
+                  },
+                  key
+                );
+              }) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+DataTableBase.displayName = "DataTableBase";
+const classes = {
+  wrapper: "data_table_wrapper",
+  table: "data_table",
+  headerCell: "data_table_header_cell",
+  sortable: "data_table_header_sortable",
+  sortButton: "data_table_sort_button",
+  sortIcon: "data_table_sort_icon",
+  clickable: "data_table_row_clickable",
+  striped: "data_table_row_striped",
+  cell: "data_table_cell",
+  primary: "data_table_primary",
+  secondary: "data_table_secondary",
+  tertiary: "data_table_tertiary",
+  quaternary: "data_table_quaternary",
+  success: "data_table_success",
+  error: "data_table_error",
+  warning: "data_table_warning",
+  clear: "data_table_clear",
+  outline: "data_table_outline",
+  shadowNone: "data_table_shadow-None",
+  shadowLight: "data_table_shadow-Light",
+  shadowMedium: "data_table_shadow-Medium",
+  shadowStrong: "data_table_shadow-Strong",
+  shadowIntense: "data_table_shadow-Intense",
+  roundNone: "data_table_round-None",
+  roundSmall: "data_table_round-Small",
+  roundMedium: "data_table_round-Medium",
+  roundLarge: "data_table_round-Large"
+};
+function DataTable(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(DataTableBase, { ...props, classMap: classes });
+}
+DataTable.displayName = "DataTable";
+exports.DataTable = DataTable;
+//# sourceMappingURL=DataTable-CCPWihcW.cjs.map

package/dist/core/DataTable-CCPWihcW.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable-CCPWihcW.cjs","sources":["../../src/components/DataTable/DataTableBase.tsx","../../src/components/DataTable/core/DataTable.tsx"],"sourcesContent":["import { useEffect, useMemo, useState, KeyboardEvent } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { DataTableBaseProps, Column } from \"./DataTable.types\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nfunction DataTableBase<T extends object>({\r\n  columns,\r\n  data,\r\n  onRowClick,\r\n  classMap,\r\n  theme = getDefaultTheme(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  state = \"\",\r\n  outline = false,\r\n  className = \"\",\r\n  striped = true,\r\n  defaultSortKey,\r\n  defaultSortOrder = \"asc\",\r\n  serverSort = false,\r\n  onSortChange,\r\n  rowKey,\r\n  caption = \"Data table\",\r\n  hideCaption = true,\r\n  getSortAriaLabel,\r\n  getSortAnnouncement,\r\n  getRowAriaLabel,\r\n  getRowAriaDescription,\r\n  emptyMessage = \"No data available\",\r\n  loading = false,\r\n  loadingMessage = \"Loading data\",\r\n  colCount,\r\n  rowCount,\r\n  \"aria-label\": ariaLabel,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  \"data-testid\": testId = \"data-table\",\r\n}: DataTableBaseProps<T>) {\r\n  const [sortKey, setSortKey] = useState<keyof T | undefined>(defaultSortKey);\r\n  const [sortOrder, setSortOrder] = useState<\"asc\" | \"desc\">(defaultSortOrder);\r\n  const [sortAnnouncement, setSortAnnouncement] = useState(\"\");\r\n\r\n  const captionId = `${testId}-caption`;\r\n  const liveRegionId = `${testId}-live-region`;\r\n\r\n  const computedAriaDescribedBy = [\r\n    ariaDescribedBy,\r\n    caption ? captionId : undefined,\r\n    liveRegionId,\r\n  ]\r\n    .filter(Boolean)\r\n    .join(\" \");\r\n\r\n  const sortedData = useMemo(() => {\r\n    if (serverSort || !sortKey) return data;\r\n\r\n    return [...data].sort((a, b) => {\r\n      const valA = a[sortKey];\r\n      const valB = b[sortKey];\r\n\r\n      if (valA === valB) return 0;\r\n      if (valA == null) return 1;\r\n      if (valB == null) return -1;\r\n\r\n      const numA = Number(valA);\r\n      const numB = Number(valB);\r\n      const bothNumeric = !Number.isNaN(numA) && !Number.isNaN(numB);\r\n\r\n      if (bothNumeric) {\r\n        return sortOrder === \"asc\" ? numA - numB : numB - numA;\r\n      }\r\n\r\n      const cmp = String(valA).localeCompare(String(valB), undefined, {\r\n        numeric: true,\r\n      });\r\n\r\n      return sortOrder === \"asc\" ? cmp : -cmp;\r\n    });\r\n  }, [data, sortKey, sortOrder, serverSort]);\r\n\r\n  const announceSortChange = (\r\n    column: Column<T>,\r\n    nextOrder: \"asc\" | \"desc\",\r\n  ): void => {\r\n    const message = getSortAnnouncement\r\n      ? getSortAnnouncement(column, nextOrder)\r\n      : `${column.label} sorted ${nextOrder === \"asc\" ? \"ascending\" : \"descending\"}`;\r\n\r\n    setSortAnnouncement(message);\r\n  };\r\n\r\n  const handleSort = (column: Column<T>): void => {\r\n    const nextOrder =\r\n      column.key === sortKey && sortOrder === \"asc\" ? \"desc\" : \"asc\";\r\n\r\n    setSortKey(column.key);\r\n    setSortOrder(nextOrder);\r\n    announceSortChange(column, nextOrder);\r\n\r\n    if (serverSort && onSortChange) {\r\n      onSortChange(column.key, nextOrder);\r\n    }\r\n  };\r\n\r\n  const handleSortKeyDown =\r\n    (column: Column<T>) =>\r\n    (e: KeyboardEvent<HTMLButtonElement>): void => {\r\n      if (e.key === \"Enter\" || e.key === \" \") {\r\n        e.preventDefault();\r\n        handleSort(column);\r\n      }\r\n    };\r\n\r\n  const handleRowKeyDown =\r\n    (row: T) =>\r\n    (e: KeyboardEvent<HTMLTableRowElement>): void => {\r\n      if (!onRowClick) return;\r\n\r\n      if (e.key === \"Enter\" || e.key === \" \") {\r\n        e.preventDefault();\r\n        onRowClick(row);\r\n      }\r\n    };\r\n\r\n  const getHeaderScope = (column: Column<T>): \"col\" | \"colgroup\" =>\r\n    column.scope ?? \"col\";\r\n\r\n  const getHeaderId = (column: Column<T>): string =>\r\n    column.id ?? `${testId}-header-${String(column.key)}`;\r\n\r\n  const getColumnAriaLabel = (\r\n    column: Column<T>,\r\n    isActive: boolean,\r\n  ): string | undefined => {\r\n    if (!column.sortable) {\r\n      return column.srLabel;\r\n    }\r\n\r\n    if (getSortAriaLabel) {\r\n      return getSortAriaLabel(column, sortOrder, isActive);\r\n    }\r\n\r\n    const baseLabel = column.srLabel ?? column.label;\r\n\r\n    if (isActive) {\r\n      return `${baseLabel}, sorted ${sortOrder === \"asc\" ? \"ascending\" : \"descending\"}. Activate to sort ${sortOrder === \"asc\" ? \"descending\" : \"ascending\"}.`;\r\n    }\r\n\r\n    return `${baseLabel}. Activate to sort ascending.`;\r\n  };\r\n\r\n  const renderCellContent = (row: T, column: Column<T>): React.ReactNode => {\r\n    const value = row[column.key];\r\n\r\n    if (column.render) {\r\n      return column.render(value, row);\r\n    }\r\n\r\n    if (typeof value === \"object\" && value !== null) {\r\n      return JSON.stringify(value);\r\n    }\r\n\r\n    return String(value ?? \"\");\r\n  };\r\n\r\n  useEffect(() => {\r\n    if (!sortKey) {\r\n      setSortAnnouncement(\"\");\r\n      return;\r\n    }\r\n\r\n    const activeColumn = columns.find((column) => column.key === sortKey);\r\n    if (!activeColumn) return;\r\n\r\n    announceSortChange(activeColumn, sortOrder);\r\n  }, []);\r\n\r\n  return (\r\n    <div\r\n      className={combineClassNames(\r\n        classMap.wrapper,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        striped && classMap.striped,\r\n        className,\r\n      )}\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        id={liveRegionId}\r\n        className={classMap.srOnly ?? \"sr_only\"}\r\n        aria-live=\"polite\"\r\n        aria-atomic=\"true\"\r\n      >\r\n        {loading ? loadingMessage : sortAnnouncement}\r\n      </div>\r\n\r\n      <table\r\n        className={combineClassNames(\r\n          classMap.table,\r\n          classMap[theme],\r\n          classMap[state],\r\n          outline && classMap.outline,\r\n        )}\r\n        aria-label={ariaLabel}\r\n        aria-labelledby={ariaLabelledBy}\r\n        aria-describedby={computedAriaDescribedBy || undefined}\r\n        aria-colcount={colCount}\r\n        aria-rowcount={rowCount}\r\n      >\r\n        {caption ? (\r\n          <caption\r\n            id={captionId}\r\n            className={hideCaption ? (classMap.srOnly ?? \"sr_only\") : undefined}\r\n          >\r\n            {caption}\r\n          </caption>\r\n        ) : null}\r\n\r\n        <thead>\r\n          <tr>\r\n            {columns.map((column) => {\r\n              const isActive = sortKey === column.key;\r\n\r\n              return (\r\n                <th\r\n                  key={String(column.key)}\r\n                  id={getHeaderId(column)}\r\n                  scope={getHeaderScope(column)}\r\n                  aria-sort={\r\n                    column.sortable\r\n                      ? isActive\r\n                        ? sortOrder === \"asc\"\r\n                          ? \"ascending\"\r\n                          : \"descending\"\r\n                        : \"none\"\r\n                      : undefined\r\n                  }\r\n                  className={combineClassNames(\r\n                    column.sortable && classMap.sortable,\r\n                    classMap.headerCell,\r\n                  )}\r\n                >\r\n                  {column.sortable ? (\r\n                    <button\r\n                      type=\"button\"\r\n                      className={classMap.sortButton}\r\n                      onClick={() => handleSort(column)}\r\n                      onKeyDown={handleSortKeyDown(column)}\r\n                      aria-label={getColumnAriaLabel(column, isActive)}\r\n                      data-testid={`${testId}-sort-${String(column.key)}`}\r\n                    >\r\n                      <span>{column.label}</span>\r\n                      <span className={classMap.sortIcon} aria-hidden=\"true\">\r\n                        {isActive ? (sortOrder === \"asc\" ? \"▲\" : \"▼\") : \"⇅\"}\r\n                      </span>\r\n                    </button>\r\n                  ) : (\r\n                    <span aria-label={column.srLabel}>{column.label}</span>\r\n                  )}\r\n                </th>\r\n              );\r\n            })}\r\n          </tr>\r\n        </thead>\r\n\r\n        <tbody>\r\n          {loading ? (\r\n            <tr>\r\n              <td\r\n                className={classMap.emptyCell}\r\n                colSpan={columns.length}\r\n                aria-live=\"polite\"\r\n              >\r\n                {loadingMessage}\r\n              </td>\r\n            </tr>\r\n          ) : sortedData.length === 0 ? (\r\n            <tr>\r\n              <td\r\n                className={classMap.emptyCell}\r\n                colSpan={columns.length}\r\n                aria-live=\"polite\"\r\n              >\r\n                {emptyMessage}\r\n              </td>\r\n            </tr>\r\n          ) : (\r\n            sortedData.map((row, index) => {\r\n              const key = rowKey ? rowKey(row) : index;\r\n              const rowAriaLabel = getRowAriaLabel?.(row, index);\r\n              const rowAriaDescription = getRowAriaDescription?.(row, index);\r\n\r\n              return (\r\n                <tr\r\n                  key={key}\r\n                  className={combineClassNames(\r\n                    onRowClick && classMap.clickable,\r\n                    striped && index % 2 === 1 && classMap.striped,\r\n                  )}\r\n                  onClick={() => onRowClick?.(row)}\r\n                  onKeyDown={handleRowKeyDown(row)}\r\n                  tabIndex={onRowClick ? 0 : undefined}\r\n                  aria-label={onRowClick ? rowAriaLabel : undefined}\r\n                  aria-description={onRowClick ? rowAriaDescription : undefined}\r\n                  data-testid={`${testId}-row-${key}`}\r\n                >\r\n                  {columns.map((column) => {\r\n                    const cellKey = String(column.key);\r\n                    const content = renderCellContent(row, column);\r\n                    const headerId = getHeaderId(column);\r\n\r\n                    if (column.isRowHeader) {\r\n                      return (\r\n                        <th\r\n                          key={cellKey}\r\n                          scope=\"row\"\r\n                          headers={headerId}\r\n                          data-label={column.label}\r\n                          className={classMap.cell}\r\n                        >\r\n                          {content}\r\n                        </th>\r\n                      );\r\n                    }\r\n\r\n                    return (\r\n                      <td\r\n                        key={cellKey}\r\n                        headers={headerId}\r\n                        data-label={column.label}\r\n                        className={classMap.cell}\r\n                      >\r\n                        {content}\r\n                      </td>\r\n                    );\r\n                  })}\r\n                </tr>\r\n              );\r\n            })\r\n          )}\r\n        </tbody>\r\n      </table>\r\n    </div>\r\n  );\r\n}\r\n\r\nDataTableBase.displayName = \"DataTableBase\";\r\nexport default DataTableBase;\r\n","import \"./DataTable.scss\";\r\nimport DataTableBase from \"../DataTableBase\";\r\nimport { DataTableProps } from \"../DataTable.types\";\r\n\r\nconst classes = {\r\n  wrapper: \"data_table_wrapper\",\r\n  table: \"data_table\",\r\n  headerCell: \"data_table_header_cell\",\r\n  sortable: \"data_table_header_sortable\",\r\n  sortButton: \"data_table_sort_button\",\r\n  sortIcon: \"data_table_sort_icon\",\r\n  clickable: \"data_table_row_clickable\",\r\n  striped: \"data_table_row_striped\",\r\n  cell: \"data_table_cell\",\r\n\r\n  primary: \"data_table_primary\",\r\n  secondary: \"data_table_secondary\",\r\n  tertiary: \"data_table_tertiary\",\r\n  quaternary: \"data_table_quaternary\",\r\n\r\n  success: \"data_table_success\",\r\n  error: \"data_table_error\",\r\n  warning: \"data_table_warning\",\r\n\r\n  clear: \"data_table_clear\",\r\n\r\n  outline: \"data_table_outline\",\r\n\r\n  shadowNone: \"data_table_shadow-None\",\r\n  shadowLight: \"data_table_shadow-Light\",\r\n  shadowMedium: \"data_table_shadow-Medium\",\r\n  shadowStrong: \"data_table_shadow-Strong\",\r\n  shadowIntense: \"data_table_shadow-Intense\",\r\n\r\n  roundNone: \"data_table_round-None\",\r\n  roundSmall: \"data_table_round-Small\",\r\n  roundMedium: \"data_table_round-Medium\",\r\n  roundLarge: \"data_table_round-Large\",\r\n};\r\n\r\nfunction DataTable<T extends object>(props: DataTableProps<T>) {\r\n  return <DataTableBase {...props} classMap={classes} />;\r\n}\r\nDataTable.displayName = \"DataTable\";\r\nexport default DataTable;\r\n"],"names":["getDefaultTheme","getDefaultRounding","getDefaultShadow","useState","useMemo","useEffect","jsxs","combineClassNames","capitalize","jsx"],"mappings":"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"}

package/dist/core/DataTable-FIxUWKG4.js

@@ -0,0 +1,314 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useMemo, useEffect } from "react";
+import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
+import { c as capitalize } from "./capitalize-C0TSQSPh.js";
+import { d as getDefaultTheme, a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-DsaRlxmw.js";
+function DataTableBase({
+  columns,
+  data,
+  onRowClick,
+  classMap,
+  theme = getDefaultTheme(),
+  rounding = getDefaultRounding(),
+  shadow = getDefaultShadow(),
+  state = "",
+  outline = false,
+  className = "",
+  striped = true,
+  defaultSortKey,
+  defaultSortOrder = "asc",
+  serverSort = false,
+  onSortChange,
+  rowKey,
+  caption = "Data table",
+  hideCaption = true,
+  getSortAriaLabel,
+  getSortAnnouncement,
+  getRowAriaLabel,
+  getRowAriaDescription,
+  emptyMessage = "No data available",
+  loading = false,
+  loadingMessage = "Loading data",
+  colCount,
+  rowCount,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "data-testid": testId = "data-table"
+}) {
+  const [sortKey, setSortKey] = useState(defaultSortKey);
+  const [sortOrder, setSortOrder] = useState(defaultSortOrder);
+  const [sortAnnouncement, setSortAnnouncement] = useState("");
+  const captionId = `${testId}-caption`;
+  const liveRegionId = `${testId}-live-region`;
+  const computedAriaDescribedBy = [
+    ariaDescribedBy,
+    caption ? captionId : void 0,
+    liveRegionId
+  ].filter(Boolean).join(" ");
+  const sortedData = useMemo(() => {
+    if (serverSort || !sortKey) return data;
+    return [...data].sort((a, b) => {
+      const valA = a[sortKey];
+      const valB = b[sortKey];
+      if (valA === valB) return 0;
+      if (valA == null) return 1;
+      if (valB == null) return -1;
+      const numA = Number(valA);
+      const numB = Number(valB);
+      const bothNumeric = !Number.isNaN(numA) && !Number.isNaN(numB);
+      if (bothNumeric) {
+        return sortOrder === "asc" ? numA - numB : numB - numA;
+      }
+      const cmp = String(valA).localeCompare(String(valB), void 0, {
+        numeric: true
+      });
+      return sortOrder === "asc" ? cmp : -cmp;
+    });
+  }, [data, sortKey, sortOrder, serverSort]);
+  const announceSortChange = (column, nextOrder) => {
+    const message = getSortAnnouncement ? getSortAnnouncement(column, nextOrder) : `${column.label} sorted ${nextOrder === "asc" ? "ascending" : "descending"}`;
+    setSortAnnouncement(message);
+  };
+  const handleSort = (column) => {
+    const nextOrder = column.key === sortKey && sortOrder === "asc" ? "desc" : "asc";
+    setSortKey(column.key);
+    setSortOrder(nextOrder);
+    announceSortChange(column, nextOrder);
+    if (serverSort && onSortChange) {
+      onSortChange(column.key, nextOrder);
+    }
+  };
+  const handleSortKeyDown = (column) => (e) => {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      handleSort(column);
+    }
+  };
+  const handleRowKeyDown = (row) => (e) => {
+    if (!onRowClick) return;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      onRowClick(row);
+    }
+  };
+  const getHeaderScope = (column) => column.scope ?? "col";
+  const getHeaderId = (column) => column.id ?? `${testId}-header-${String(column.key)}`;
+  const getColumnAriaLabel = (column, isActive) => {
+    if (!column.sortable) {
+      return column.srLabel;
+    }
+    if (getSortAriaLabel) {
+      return getSortAriaLabel(column, sortOrder, isActive);
+    }
+    const baseLabel = column.srLabel ?? column.label;
+    if (isActive) {
+      return `${baseLabel}, sorted ${sortOrder === "asc" ? "ascending" : "descending"}. Activate to sort ${sortOrder === "asc" ? "descending" : "ascending"}.`;
+    }
+    return `${baseLabel}. Activate to sort ascending.`;
+  };
+  const renderCellContent = (row, column) => {
+    const value = row[column.key];
+    if (column.render) {
+      return column.render(value, row);
+    }
+    if (typeof value === "object" && value !== null) {
+      return JSON.stringify(value);
+    }
+    return String(value ?? "");
+  };
+  useEffect(() => {
+    if (!sortKey) {
+      setSortAnnouncement("");
+      return;
+    }
+    const activeColumn = columns.find((column) => column.key === sortKey);
+    if (!activeColumn) return;
+    announceSortChange(activeColumn, sortOrder);
+  }, []);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: combineClassNames(
+        classMap.wrapper,
+        shadow && classMap[`shadow${capitalize(shadow)}`],
+        rounding && classMap[`round${capitalize(rounding)}`],
+        striped && classMap.striped,
+        className
+      ),
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            id: liveRegionId,
+            className: classMap.srOnly ?? "sr_only",
+            "aria-live": "polite",
+            "aria-atomic": "true",
+            children: loading ? loadingMessage : sortAnnouncement
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "table",
+          {
+            className: combineClassNames(
+              classMap.table,
+              classMap[theme],
+              classMap[state],
+              outline && classMap.outline
+            ),
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledBy,
+            "aria-describedby": computedAriaDescribedBy || void 0,
+            "aria-colcount": colCount,
+            "aria-rowcount": rowCount,
+            children: [
+              caption ? /* @__PURE__ */ jsx(
+                "caption",
+                {
+                  id: captionId,
+                  className: hideCaption ? classMap.srOnly ?? "sr_only" : void 0,
+                  children: caption
+                }
+              ) : null,
+              /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: columns.map((column) => {
+                const isActive = sortKey === column.key;
+                return /* @__PURE__ */ jsx(
+                  "th",
+                  {
+                    id: getHeaderId(column),
+                    scope: getHeaderScope(column),
+                    "aria-sort": column.sortable ? isActive ? sortOrder === "asc" ? "ascending" : "descending" : "none" : void 0,
+                    className: combineClassNames(
+                      column.sortable && classMap.sortable,
+                      classMap.headerCell
+                    ),
+                    children: column.sortable ? /* @__PURE__ */ jsxs(
+                      "button",
+                      {
+                        type: "button",
+                        className: classMap.sortButton,
+                        onClick: () => handleSort(column),
+                        onKeyDown: handleSortKeyDown(column),
+                        "aria-label": getColumnAriaLabel(column, isActive),
+                        "data-testid": `${testId}-sort-${String(column.key)}`,
+                        children: [
+                          /* @__PURE__ */ jsx("span", { children: column.label }),
+                          /* @__PURE__ */ jsx("span", { className: classMap.sortIcon, "aria-hidden": "true", children: isActive ? sortOrder === "asc" ? "▲" : "▼" : "⇅" })
+                        ]
+                      }
+                    ) : /* @__PURE__ */ jsx("span", { "aria-label": column.srLabel, children: column.label })
+                  },
+                  String(column.key)
+                );
+              }) }) }),
+              /* @__PURE__ */ jsx("tbody", { children: loading ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx(
+                "td",
+                {
+                  className: classMap.emptyCell,
+                  colSpan: columns.length,
+                  "aria-live": "polite",
+                  children: loadingMessage
+                }
+              ) }) : sortedData.length === 0 ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx(
+                "td",
+                {
+                  className: classMap.emptyCell,
+                  colSpan: columns.length,
+                  "aria-live": "polite",
+                  children: emptyMessage
+                }
+              ) }) : sortedData.map((row, index) => {
+                const key = rowKey ? rowKey(row) : index;
+                const rowAriaLabel = getRowAriaLabel == null ? void 0 : getRowAriaLabel(row, index);
+                const rowAriaDescription = getRowAriaDescription == null ? void 0 : getRowAriaDescription(row, index);
+                return /* @__PURE__ */ jsx(
+                  "tr",
+                  {
+                    className: combineClassNames(
+                      onRowClick && classMap.clickable,
+                      striped && index % 2 === 1 && classMap.striped
+                    ),
+                    onClick: () => onRowClick == null ? void 0 : onRowClick(row),
+                    onKeyDown: handleRowKeyDown(row),
+                    tabIndex: onRowClick ? 0 : void 0,
+                    "aria-label": onRowClick ? rowAriaLabel : void 0,
+                    "aria-description": onRowClick ? rowAriaDescription : void 0,
+                    "data-testid": `${testId}-row-${key}`,
+                    children: columns.map((column) => {
+                      const cellKey = String(column.key);
+                      const content = renderCellContent(row, column);
+                      const headerId = getHeaderId(column);
+                      if (column.isRowHeader) {
+                        return /* @__PURE__ */ jsx(
+                          "th",
+                          {
+                            scope: "row",
+                            headers: headerId,
+                            "data-label": column.label,
+                            className: classMap.cell,
+                            children: content
+                          },
+                          cellKey
+                        );
+                      }
+                      return /* @__PURE__ */ jsx(
+                        "td",
+                        {
+                          headers: headerId,
+                          "data-label": column.label,
+                          className: classMap.cell,
+                          children: content
+                        },
+                        cellKey
+                      );
+                    })
+                  },
+                  key
+                );
+              }) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+DataTableBase.displayName = "DataTableBase";
+const classes = {
+  wrapper: "data_table_wrapper",
+  table: "data_table",
+  headerCell: "data_table_header_cell",
+  sortable: "data_table_header_sortable",
+  sortButton: "data_table_sort_button",
+  sortIcon: "data_table_sort_icon",
+  clickable: "data_table_row_clickable",
+  striped: "data_table_row_striped",
+  cell: "data_table_cell",
+  primary: "data_table_primary",
+  secondary: "data_table_secondary",
+  tertiary: "data_table_tertiary",
+  quaternary: "data_table_quaternary",
+  success: "data_table_success",
+  error: "data_table_error",
+  warning: "data_table_warning",
+  clear: "data_table_clear",
+  outline: "data_table_outline",
+  shadowNone: "data_table_shadow-None",
+  shadowLight: "data_table_shadow-Light",
+  shadowMedium: "data_table_shadow-Medium",
+  shadowStrong: "data_table_shadow-Strong",
+  shadowIntense: "data_table_shadow-Intense",
+  roundNone: "data_table_round-None",
+  roundSmall: "data_table_round-Small",
+  roundMedium: "data_table_round-Medium",
+  roundLarge: "data_table_round-Large"
+};
+function DataTable(props) {
+  return /* @__PURE__ */ jsx(DataTableBase, { ...props, classMap: classes });
+}
+DataTable.displayName = "DataTable";
+export {
+  DataTable as D
+};
+//# sourceMappingURL=DataTable-FIxUWKG4.js.map