@primer/react 38.30.1-rc.bce2a87c7 → 38.31.0-rc.2630f104b

package/dist/DataTable/Table.module.css.js

@@ -1,5 +1,26 @@
-import './Table-7f5cb3e4.css';
-
-var classes = {"TableContainer":"prc-DataTable-TableContainer-hn0p3","TableTitle":"prc-DataTable-TableTitle-nM43N","TableSubtitle":"prc-DataTable-TableSubtitle--L6Ho","TableActions":"prc-DataTable-TableActions-fkc2b","TableDivider":"prc-DataTable-TableDivider-TRc3b","TableOverflowWrapper":"prc-DataTable-TableOverflowWrapper-bSqT-","Table":"prc-DataTable-Table-7ux1n","TableCell":"prc-DataTable-TableCell-Fk4ve","TableHeader":"prc-DataTable-TableHeader-eyTab","TableSortButton":"prc-DataTable-TableSortButton--aq0y","TableHead":"prc-DataTable-TableHead-4FaBf","TableRow":"prc-DataTable-TableRow-Icc7F","TableBody":"prc-DataTable-TableBody-QKQy2","TableCellSkeletonItem":"prc-DataTable-TableCellSkeletonItem-bGhwZ","TableCellSkeleton":"prc-DataTable-TableCellSkeleton-DMdM5","TableSortIcon":"prc-DataTable-TableSortIcon-wHvJw","TableSortIcon--ascending":"prc-DataTable-TableSortIcon--ascending-Lpx6z","TableSortIcon--descending":"prc-DataTable-TableSortIcon--descending-hHJGo","TableCellSkeletonItems":"prc-DataTable-TableCellSkeletonItems-Ljhq5","PlaceholderText":"prc-DataTable-PlaceholderText-8bHo7"};
-
-export { classes as default };
+import "./Table-7f5cb3e4.css";
+//#region src/DataTable/Table.module.css.js
+var Table_module_css_default = {
+	"TableContainer": "prc-DataTable-TableContainer-hn0p3",
+	"TableTitle": "prc-DataTable-TableTitle-nM43N",
+	"TableSubtitle": "prc-DataTable-TableSubtitle--L6Ho",
+	"TableActions": "prc-DataTable-TableActions-fkc2b",
+	"TableDivider": "prc-DataTable-TableDivider-TRc3b",
+	"TableOverflowWrapper": "prc-DataTable-TableOverflowWrapper-bSqT-",
+	"Table": "prc-DataTable-Table-7ux1n",
+	"TableCell": "prc-DataTable-TableCell-Fk4ve",
+	"TableHeader": "prc-DataTable-TableHeader-eyTab",
+	"TableSortButton": "prc-DataTable-TableSortButton--aq0y",
+	"TableHead": "prc-DataTable-TableHead-4FaBf",
+	"TableRow": "prc-DataTable-TableRow-Icc7F",
+	"TableBody": "prc-DataTable-TableBody-QKQy2",
+	"TableCellSkeletonItem": "prc-DataTable-TableCellSkeletonItem-bGhwZ",
+	"TableCellSkeleton": "prc-DataTable-TableCellSkeleton-DMdM5",
+	"TableSortIcon": "prc-DataTable-TableSortIcon-wHvJw",
+	"TableSortIcon--ascending": "prc-DataTable-TableSortIcon--ascending-Lpx6z",
+	"TableSortIcon--descending": "prc-DataTable-TableSortIcon--descending-hHJGo",
+	"TableCellSkeletonItems": "prc-DataTable-TableCellSkeletonItems-Ljhq5",
+	"PlaceholderText": "prc-DataTable-PlaceholderText-8bHo7"
+};
+//#endregion
+export { Table_module_css_default as default };

package/dist/DataTable/column.d.ts

@@ -1,62 +1,65 @@
-import type { ObjectPaths } from './utils';
-import type { UniqueRow } from './row';
-import type { SortStrategy, CustomSortStrategy } from './sorting';
-export type ColumnWidth = 'grow' | 'growCollapse' | 'auto' | React.CSSProperties['width'];
-export type CellAlignment = 'start' | 'end' | undefined;
-export interface Column<Data extends UniqueRow> {
-    id?: string;
-    /**
-     * The horizontal alignment of the column's content
-     */
-    align?: CellAlignment;
-    /**
-     * Provide the name of the column. This will be rendered as a table header
-     * within the table itself
-     */
-    header: string | (() => React.ReactNode);
-    /**
-     * Optionally provide a field to render for this column. This may be the key
-     * of the object or a string that accesses nested objects through `.`. For
-     * example: `field: a.b.c`
-     *
-     * Alternatively, you may provide a `renderCell` for this column to render the
-     * field in a row
-     */
-    field?: ObjectPaths<Data>;
-    /**
-     * The maximum width the column can grow to
-     */
-    maxWidth?: React.CSSProperties['maxWidth'];
-    /**
-     * The minimum width the column can shrink to
-     */
-    minWidth?: React.CSSProperties['minWidth'];
-    /**
-     * Provide a custom component or render prop to render the data for this
-     * column in a row
-     */
-    renderCell?: (data: Data) => React.ReactNode;
-    /**
-     * Specify if the value of this column for a row should be treated as a row
-     * header
-     */
-    rowHeader?: boolean;
-    /**
-     * Specify if the table should sort by this column and, if applicable, a
-     * specific sort strategy or custom sort strategy
-     */
-    sortBy?: boolean | SortStrategy | CustomSortStrategy<Data>;
-    /**
-     * Controls the width of the column.
-     * - 'grow': Stretch to fill available space, and min width is the width of the widest cell in the column
-     * - 'growCollapse': Stretch to fill available space or shrink to fit in the available space. Allows the column to shrink smaller than the cell content's width.
-     * - 'auto': The column is the width of it’s widest cell. Not intended for use with columns who’s content length varies a lot because a layout shift will occur when the content changes
-     * - explicit width: Will be exactly that width and will not grow or shrink to fill the parent
-     * @default 'grow'
-     */
-    width?: ColumnWidth;
+import { ObjectPaths } from "./utils.js";
+import { UniqueRow } from "./row.js";
+import { CustomSortStrategy, SortStrategy } from "./sorting.js";
+
+//#region src/DataTable/column.d.ts
+type ColumnWidth = 'grow' | 'growCollapse' | 'auto' | React.CSSProperties['width'];
+type CellAlignment = 'start' | 'end' | undefined;
+interface Column<Data extends UniqueRow> {
+  id?: string;
+  /**
+   * The horizontal alignment of the column's content
+   */
+  align?: CellAlignment;
+  /**
+   * Provide the name of the column. This will be rendered as a table header
+   * within the table itself
+   */
+  header: string | (() => React.ReactNode);
+  /**
+   * Optionally provide a field to render for this column. This may be the key
+   * of the object or a string that accesses nested objects through `.`. For
+   * example: `field: a.b.c`
+   *
+   * Alternatively, you may provide a `renderCell` for this column to render the
+   * field in a row
+   */
+  field?: ObjectPaths<Data>;
+  /**
+   * The maximum width the column can grow to
+   */
+  maxWidth?: React.CSSProperties['maxWidth'];
+  /**
+   * The minimum width the column can shrink to
+   */
+  minWidth?: React.CSSProperties['minWidth'];
+  /**
+   * Provide a custom component or render prop to render the data for this
+   * column in a row
+   */
+  renderCell?: (data: Data) => React.ReactNode;
+  /**
+   * Specify if the value of this column for a row should be treated as a row
+   * header
+   */
+  rowHeader?: boolean;
+  /**
+   * Specify if the table should sort by this column and, if applicable, a
+   * specific sort strategy or custom sort strategy
+   */
+  sortBy?: boolean | SortStrategy | CustomSortStrategy<Data>;
+  /**
+   * Controls the width of the column.
+   * - 'grow': Stretch to fill available space, and min width is the width of the widest cell in the column
+   * - 'growCollapse': Stretch to fill available space or shrink to fit in the available space. Allows the column to shrink smaller than the cell content's width.
+   * - 'auto': The column is the width of it’s widest cell. Not intended for use with columns who’s content length varies a lot because a layout shift will occur when the content changes
+   * - explicit width: Will be exactly that width and will not grow or shrink to fill the parent
+   * @default 'grow'
+   */
+  width?: ColumnWidth;
 }
-export declare function createColumnHelper<T extends UniqueRow>(): {
-    column: (column: Column<T>) => Column<T>;
+declare function createColumnHelper<T extends UniqueRow>(): {
+  column: (column: Column<T>) => Column<T>;
 };
-//# sourceMappingURL=column.d.ts.map
+//#endregion
+export { CellAlignment, Column, ColumnWidth, createColumnHelper };

package/dist/DataTable/column.js

@@ -1,14 +1,13 @@
+//#region src/DataTable/column.ts
 function createColumnHelper() {
-  function column(column) {
-    var _column$id;
-    return {
-      ...column,
-      id: (_column$id = column.id) !== null && _column$id !== void 0 ? _column$id : column.field
-    };
-  }
-  return {
-    column
-  };
+	function column(column) {
+		var _column$id;
+		return {
+			...column,
+			id: (_column$id = column.id) !== null && _column$id !== void 0 ? _column$id : column.field
+		};
+	}
+	return { column };
 }
-
+//#endregion
 export { createColumnHelper };

package/dist/DataTable/index.d.ts

@@ -1,29 +1,28 @@
-import { DataTable } from './DataTable';
-import { ErrorDialog } from './ErrorDialog';
-import { Table as TableImpl, TableHead, TableBody, TableRow, TableHeader, TableCell, TableCellPlaceholder, TableContainer, TableTitle, TableSubtitle, TableActions, TableDivider, TableSkeleton } from './Table';
-import { Pagination } from './Pagination';
-import type { SlotMarker } from '../utils/types/Slots';
-declare const Table: typeof TableImpl & SlotMarker & {
-    Container: typeof TableContainer;
-    Title: typeof TableTitle;
-    Subtitle: typeof TableSubtitle;
-    Actions: typeof TableActions;
-    Divider: typeof TableDivider;
-    Skeleton: typeof TableSkeleton;
-    Head: typeof TableHead;
-    Body: typeof TableBody;
-    Header: typeof TableHeader;
-    Row: typeof TableRow;
-    Cell: typeof TableCell;
-    CellPlaceholder: typeof TableCellPlaceholder;
-    Pagination: typeof Pagination;
-    ErrorDialog: typeof ErrorDialog;
+import { SlotMarker } from "../utils/types/Slots.js";
+import { ObjectPaths } from "./utils.js";
+import { UniqueRow } from "./row.js";
+import { CellAlignment, Column, ColumnWidth, createColumnHelper } from "./column.js";
+import { DataTable, DataTableProps } from "./DataTable.js";
+import { ErrorDialog } from "./ErrorDialog.js";
+import { Table as Table$1, TableActions, TableActionsProps, TableBody, TableBodyProps, TableCell, TableCellPlaceholder, TableCellProps, TableContainer, TableContainerProps, TableDivider, TableHead, TableHeadProps, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps, TableSkeleton, TableSkeletonProps, TableSubtitle, TableSubtitleProps, TableTitle, TableTitleProps } from "./Table.js";
+import { Pagination } from "./Pagination.js";
+
+//#region src/DataTable/index.d.ts
+declare const Table: typeof Table$1 & SlotMarker & {
+  Container: typeof TableContainer;
+  Title: typeof TableTitle;
+  Subtitle: typeof TableSubtitle;
+  Actions: typeof TableActions;
+  Divider: typeof TableDivider;
+  Skeleton: typeof TableSkeleton;
+  Head: typeof TableHead;
+  Body: typeof TableBody;
+  Header: typeof TableHeader;
+  Row: typeof TableRow;
+  Cell: typeof TableCell;
+  CellPlaceholder: typeof TableCellPlaceholder;
+  Pagination: typeof Pagination;
+  ErrorDialog: typeof ErrorDialog;
 };
-export { DataTable, Table };
-export type { DataTableProps } from './DataTable';
-export type { TableProps, TableHeadProps, TableBodyProps, TableRowProps, TableHeaderProps, TableCellProps, TableContainerProps, TableTitleProps, TableSubtitleProps, TableActionsProps, TableSkeletonProps, } from './Table';
-export { createColumnHelper } from './column';
-export type { Column, CellAlignment, ColumnWidth } from './column';
-export type { UniqueRow } from './row';
-export type { ObjectPaths } from './utils';
-//# sourceMappingURL=index.d.ts.map
+//#endregion
+export { type CellAlignment, type Column, type ColumnWidth, DataTable, type DataTableProps, type ObjectPaths, Table, type TableActionsProps, type TableBodyProps, type TableCellProps, type TableContainerProps, type TableHeadProps, type TableHeaderProps, type TableProps, type TableRowProps, type TableSubtitleProps, type TableTitleProps, type UniqueRow, createColumnHelper };

package/dist/DataTable/index.js

@@ -1,22 +1,24 @@
-import { ErrorDialog } from './ErrorDialog.js';
-import { Table as Table$1, TableCellPlaceholder, TableCell, TableRow, TableHeader, TableBody, TableHead, TableSkeleton, TableDivider, TableActions, TableSubtitle, TableTitle, TableContainer } from './Table.js';
-import { Pagination } from './Pagination.js';
-
+import { Table as Table$1, TableActions, TableBody, TableCell, TableCellPlaceholder, TableContainer, TableDivider, TableHead, TableHeader, TableRow, TableSkeleton, TableSubtitle, TableTitle } from "./Table.js";
+import { DataTable } from "./DataTable.js";
+import { ErrorDialog } from "./ErrorDialog.js";
+import { Pagination } from "./Pagination.js";
+import { createColumnHelper } from "./column.js";
+//#region src/DataTable/index.ts
 const Table = Object.assign(Table$1, {
-  Container: TableContainer,
-  Title: TableTitle,
-  Subtitle: TableSubtitle,
-  Actions: TableActions,
-  Divider: TableDivider,
-  Skeleton: TableSkeleton,
-  Head: TableHead,
-  Body: TableBody,
-  Header: TableHeader,
-  Row: TableRow,
-  Cell: TableCell,
-  CellPlaceholder: TableCellPlaceholder,
-  Pagination,
-  ErrorDialog
+	Container: TableContainer,
+	Title: TableTitle,
+	Subtitle: TableSubtitle,
+	Actions: TableActions,
+	Divider: TableDivider,
+	Skeleton: TableSkeleton,
+	Head: TableHead,
+	Body: TableBody,
+	Header: TableHeader,
+	Row: TableRow,
+	Cell: TableCell,
+	CellPlaceholder: TableCellPlaceholder,
+	Pagination,
+	ErrorDialog
 });
-
-export { Table };
+//#endregion
+export { DataTable, Table, createColumnHelper };

package/dist/DataTable/row.d.ts

@@ -1,4 +1,6 @@
-export interface UniqueRow {
-    id: string | number;
+//#region src/DataTable/row.d.ts
+interface UniqueRow {
+  id: string | number;
 }
-//# sourceMappingURL=row.d.ts.map
+//#endregion
+export { UniqueRow };

package/dist/DataTable/sorting.d.ts

@@ -1,18 +1,15 @@
-export type SortDirection = 'ASC' | 'DESC' | 'NONE';
-export declare const SortDirection: {
-    [Key in SortDirection]: `${Key}`;
-};
-export declare const DEFAULT_SORT_DIRECTION: "ASC";
-export declare function transition(direction: Exclude<SortDirection, 'NONE'>): Exclude<SortDirection, 'NONE'>;
+//#region src/DataTable/sorting.d.ts
+type SortDirection = 'ASC' | 'DESC' | 'NONE';
+declare const SortDirection: { [Key in SortDirection]: `${Key}` };
 /**
  * A sort strategy for comparing any two values
  */
-export declare function basic<T>(a: T, b: T): -1 | 0 | 1;
+declare function basic<T>(a: T, b: T): -1 | 0 | 1;
 /**
  * A sort strategy for comparing two `Date` values. Also includes support for
  * values from `Date.now()`
  */
-export declare function datetime(a: Date | number, b: Date | number): number;
+declare function datetime(a: Date | number, b: Date | number): number;
 /**
  * Compare two numbers using alphanumeric, or natural order, sorting. This
  * sorting function breaks up the inputs into groups of text and numbers and
@@ -21,12 +18,13 @@ export declare function datetime(a: Date | number, b: Date | number): number;
  *
  * @see https://en.wikipedia.org/wiki/Natural_sort_order
  */
-export declare function alphanumeric(inputA: string, inputB: string): number;
-export declare const strategies: {
-    alphanumeric: typeof alphanumeric;
-    basic: typeof basic;
-    datetime: typeof datetime;
+declare function alphanumeric(inputA: string, inputB: string): number;
+declare const strategies: {
+  alphanumeric: typeof alphanumeric;
+  basic: typeof basic;
+  datetime: typeof datetime;
 };
-export type SortStrategy = keyof typeof strategies;
-export type CustomSortStrategy<T> = (a: T, b: T) => number;
-//# sourceMappingURL=sorting.d.ts.map
+type SortStrategy = keyof typeof strategies;
+type CustomSortStrategy<T> = (a: T, b: T) => number;
+//#endregion
+export { CustomSortStrategy, SortDirection, SortStrategy, alphanumeric, basic, datetime, strategies };

package/dist/DataTable/sorting.js

@@ -1,125 +1,87 @@
-// The directions in which a column can be sorted
-// Note: if a table is sorted, one column _must_ have a direction other than
-// NONE
-
-// A mapping of names to SortDirection
+//#region src/DataTable/sorting.ts
 const SortDirection = {
-  ASC: 'ASC',
-  DESC: 'DESC',
-  NONE: 'NONE'
+	ASC: "ASC",
+	DESC: "DESC",
+	NONE: "NONE"
 };
-
-// The default sort direction for a column going from NONE to sorted
 const DEFAULT_SORT_DIRECTION = SortDirection.ASC;
-
-// Transition the given sort direction to the next direction
-// Note: we can only cycle between ASC <-> DESC, NONE is not supported
 function transition(direction) {
-  if (direction === SortDirection.ASC) {
-    return SortDirection.DESC;
-  }
-  return SortDirection.ASC;
+	if (direction === SortDirection.ASC) return SortDirection.DESC;
+	return SortDirection.ASC;
 }
-
-// ----------------------------------------------------------------------------
-// Sort strategies
-// ----------------------------------------------------------------------------
-
 /**
- * A sort strategy for comparing any two values
- */
+* A sort strategy for comparing any two values
+*/
 function basic(a, b) {
-  return a === b ? 0 : a < b ? -1 : 1;
+	return a === b ? 0 : a < b ? -1 : 1;
 }
-
 /**
- * A sort strategy for comparing two `Date` values. Also includes support for
- * values from `Date.now()`
- */
+* A sort strategy for comparing two `Date` values. Also includes support for
+* values from `Date.now()`
+*/
 function datetime(a, b) {
-  const timeA = a instanceof Date ? a.getTime() : a;
-  const timeB = b instanceof Date ? b.getTime() : b;
-  return timeA > timeB ? 1 : timeA < timeB ? -1 : 0;
+	const timeA = a instanceof Date ? a.getTime() : a;
+	const timeB = b instanceof Date ? b.getTime() : b;
+	return timeA > timeB ? 1 : timeA < timeB ? -1 : 0;
 }
-
 /**
- * Compare two numbers using alphanumeric, or natural order, sorting. This
- * sorting function breaks up the inputs into groups of text and numbers and
- * compares the different sub-groups of each to determine the order of a set of
- * strings
- *
- * @see https://en.wikipedia.org/wiki/Natural_sort_order
- */
+* Compare two numbers using alphanumeric, or natural order, sorting. This
+* sorting function breaks up the inputs into groups of text and numbers and
+* compares the different sub-groups of each to determine the order of a set of
+* strings
+*
+* @see https://en.wikipedia.org/wiki/Natural_sort_order
+*/
 function alphanumeric(inputA, inputB) {
-  const groupsA = getAlphaNumericGroups(inputA);
-  const groupsB = getAlphaNumericGroups(inputB);
-  while (groupsA.length !== 0 && groupsB.length !== 0) {
-    const a = groupsA.shift();
-    const b = groupsB.shift();
-
-    // If the two groups are equal, move on to the next set of groups
-    if (a === b) {
-      continue;
-    } else if (typeof a === 'string' && typeof b === 'string') {
-      // If both groups are strings, compare them using the current locale
-      return a.localeCompare(b);
-    } else if (typeof a === 'number' && typeof b === 'number') {
-      // If both groups are numbers, compare them numerically
-      return a > b ? 1 : -1;
-    } else if (typeof a === 'number' && typeof b === 'string') {
-      // Sort numbers before strings
-      return -1;
-    } else if (typeof a === 'string' && typeof b === 'number') {
-      // Sort numbers before strings
-      return 1;
-    } else if (a === undefined || b === undefined) {
-      // If either group is undefined, break out of the loop. The input with the
-      // fewest number of groups will be ordered first
-      break;
-    }
-  }
-
-  // If all else is equal, the string with the fewest number of "groups" is
-  // ordered before the other string
-  return groupsA.length > groupsB.length ? 1 : -1;
+	const groupsA = getAlphaNumericGroups(inputA);
+	const groupsB = getAlphaNumericGroups(inputB);
+	while (groupsA.length !== 0 && groupsB.length !== 0) {
+		const a = groupsA.shift();
+		const b = groupsB.shift();
+		if (a === b) continue;
+		else if (typeof a === "string" && typeof b === "string") return a.localeCompare(b);
+		else if (typeof a === "number" && typeof b === "number") return a > b ? 1 : -1;
+		else if (typeof a === "number" && typeof b === "string") return -1;
+		else if (typeof a === "string" && typeof b === "number") return 1;
+		else if (a === void 0 || b === void 0) break;
+	}
+	return groupsA.length > groupsB.length ? 1 : -1;
 }
-
 /**
- * Break up the given input string into groups of text and numbers
- */
+* Break up the given input string into groups of text and numbers
+*/
 function getAlphaNumericGroups(input) {
-  const groups = [];
-  let i = 0;
-  while (i < input.length) {
-    let group = input[i];
-    if (isNumeric(group)) {
-      while (i + 1 < input.length && isNumeric(input[i + 1])) {
-        group = group + input[i + 1];
-        i++;
-      }
-      groups.push(parseInt(group, 10));
-    } else {
-      while (i + 1 < input.length && !isNumeric(input[i + 1])) {
-        group = group + input[i + 1];
-        i++;
-      }
-      groups.push(group);
-    }
-    i++;
-  }
-  return groups;
+	const groups = [];
+	let i = 0;
+	while (i < input.length) {
+		let group = input[i];
+		if (isNumeric(group)) {
+			while (i + 1 < input.length && isNumeric(input[i + 1])) {
+				group = group + input[i + 1];
+				i++;
+			}
+			groups.push(parseInt(group, 10));
+		} else {
+			while (i + 1 < input.length && !isNumeric(input[i + 1])) {
+				group = group + input[i + 1];
+				i++;
+			}
+			groups.push(group);
+		}
+		i++;
+	}
+	return groups;
 }
-
 /**
- * Determine if the given value is a number
- */
+* Determine if the given value is a number
+*/
 function isNumeric(value) {
-  return !Number.isNaN(parseInt(value, 10));
+	return !Number.isNaN(parseInt(value, 10));
 }
 const strategies = {
-  alphanumeric,
-  basic,
-  datetime
+	alphanumeric,
+	basic,
+	datetime
 };
-
+//#endregion
 export { DEFAULT_SORT_DIRECTION, SortDirection, alphanumeric, basic, datetime, strategies, transition };