@spscommerce/ds-react 6.0.0 → 6.2.0

package/lib/table/SpsTable.d.ts

@@ -1,4 +1,4 @@
-import type { SortChangeHandler, SortedColumn } from "@spscommerce/ds-shared";
+import type { SortChangeHandler, SortedColumn, ResizeState, ResizeStateChangeHandler } from "@spscommerce/ds-shared";
 import * as PropTypes from "../prop-types";
 declare const propTypes: {
     onSortChange: PropTypes.Requireable<SortChangeHandler>;
@@ -6,11 +6,14 @@ declare const propTypes: {
     selectable: PropTypes.Requireable<boolean>;
     maxHeightPx: PropTypes.Requireable<number>;
     maxHeightRem: PropTypes.Requireable<number>;
+    resizeable: PropTypes.Requireable<boolean>;
+    resizeState: PropTypes.Requireable<ResizeState>;
+    onResizeStateChange: PropTypes.Requireable<ResizeStateChangeHandler>;
     children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
     className: PropTypes.Requireable<string>;
     "data-testid": PropTypes.Requireable<string>;
     unsafelyReplaceClassName: PropTypes.Requireable<string>;
 };
 export declare type SpsTableProps = PropTypes.InferTS<typeof propTypes, HTMLTableElement>;
-export declare function SpsTable(props: SpsTableProps): JSX.Element;
+export declare function SpsTable({ children, className, onSortChange, sort, "data-testid": testId, unsafelyReplaceClassName, maxHeightPx, maxHeightRem, resizeable, resizeState, onResizeStateChange, ...rest }: SpsTableProps): JSX.Element;
 export {};

package/lib/table/SpsTableContext.d.ts

@@ -0,0 +1,20 @@
+import * as React from "react";
+import type { SortChangeHandler, SortedColumn, ResizeState, ResizeStateChangeHandler } from "@spscommerce/ds-shared";
+interface SpsTableContextValue {
+    resizeable: boolean;
+    resizeState: ResizeState;
+    setResizeState: ResizeStateChangeHandler;
+    setSingleResizeState: (resizeKey: string, columnWidth: number | null) => void;
+    sort: SortedColumn[];
+    setSort: SortChangeHandler;
+}
+declare const SpsTableContext: React.Context<SpsTableContextValue>;
+interface SpsTableContextProviderProps {
+    resizeable?: boolean;
+    sort?: SortedColumn[];
+    onSortChange?: SortChangeHandler;
+    resizeState?: ResizeState;
+    onResizeStateChange?: ResizeStateChangeHandler;
+}
+declare const SpsTableContextProvider: React.FC<SpsTableContextProviderProps>;
+export { SpsTableContext, SpsTableContextProvider };

package/lib/table/SpsTableHead.d.ts

@@ -1,8 +1,5 @@
-import type { SortChangeHandler, SortedColumn } from "@spscommerce/ds-shared";
 import * as PropTypes from "../prop-types";
 declare const propTypes: {
-    onSortChange: PropTypes.Requireable<SortChangeHandler>;
-    currentSort: PropTypes.Requireable<SortedColumn[]>;
     pinned: PropTypes.Requireable<boolean>;
     children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
     className: PropTypes.Requireable<string>;
@@ -10,6 +7,6 @@ declare const propTypes: {
     unsafelyReplaceClassName: PropTypes.Requireable<string>;
 };
 export declare type SpsTableHeadProps = PropTypes.InferTS<typeof propTypes, HTMLTableSectionElement>;
-export declare function SpsTableHead(props: SpsTableHeadProps): JSX.Element;
+export declare function SpsTableHead({ children, className, "data-testid": testId, unsafelyReplaceClassName, pinned, ...rest }: SpsTableHeadProps): JSX.Element;
 export declare function SpsThead(props: SpsTableHeadProps): JSX.Element;
 export {};

package/lib/table/SpsTableHeader.d.ts

@@ -1,17 +1,15 @@
-import type { SortChangeHandler, SortedColumn } from "@spscommerce/ds-shared";
 import * as PropTypes from "../prop-types";
 declare const propTypes: {
     controlCell: PropTypes.Requireable<boolean>;
-    currentSort: PropTypes.Requireable<SortedColumn[]>;
-    onSortChange: PropTypes.Requireable<SortChangeHandler>;
     sortKey: PropTypes.Requireable<string>;
+    resizeKey: PropTypes.Requireable<string>;
     pinned: PropTypes.Requireable<boolean>;
     children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
     className: PropTypes.Requireable<string>;
     "data-testid": PropTypes.Requireable<string>;
     unsafelyReplaceClassName: PropTypes.Requireable<string>;
 };
-export declare type SpsTableHeaderProps = PropTypes.InferTS<typeof propTypes, HTMLTableHeaderCellElement>;
-export declare function SpsTableHeader(props: SpsTableHeaderProps): JSX.Element;
+export declare type SpsTableHeaderProps = PropTypes.InferTS<typeof propTypes, HTMLTableCellElement>;
+export declare function SpsTableHeader({ children, className, controlCell, sortKey, resizeKey, "data-testid": testId, unsafelyReplaceClassName, pinned, ...rest }: SpsTableHeaderProps): JSX.Element;
 export declare function SpsTh(props: SpsTableHeaderProps): JSX.Element;
 export {};

package/lib/table/SpsTableRow.d.ts

@@ -1,14 +1,11 @@
-import type { SortChangeHandler, SortedColumn } from "@spscommerce/ds-shared";
 import * as PropTypes from "../prop-types";
 declare const propTypes: {
-    currentSort: PropTypes.Requireable<SortedColumn[]>;
-    onSortChange: PropTypes.Requireable<SortChangeHandler>;
     children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
     className: PropTypes.Requireable<string>;
     "data-testid": PropTypes.Requireable<string>;
     unsafelyReplaceClassName: PropTypes.Requireable<string>;
 };
 export declare type SpsTableRowProps = PropTypes.InferTS<typeof propTypes, HTMLTableRowElement>;
-export declare function SpsTableRow(props: SpsTableRowProps): JSX.Element;
+export declare function SpsTableRow({ children, className, "data-testid": testId, unsafelyReplaceClassName, ...rest }: SpsTableRowProps): JSX.Element;
 export declare function SpsTr(props: SpsTableRowProps): JSX.Element;
 export {};

package/lib/table/index.d.ts

@@ -5,3 +5,4 @@ export * from "./SpsTableRow";
 export * from "./SpsTableBody";
 export * from "./SpsTableCell";
 export * from "./SpsTable.examples";
+export * from "./useColumnResizer";

package/lib/table/useColumnResizer.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+export declare const useColumnResizer: ({ tableHeaderRef, resizerRef, resizeKey, }: {
+    tableHeaderRef: React.MutableRefObject<HTMLTableCellElement>;
+    resizerRef: React.MutableRefObject<HTMLSpanElement>;
+    resizeKey: string;
+}) => {
+    isResizeable: boolean;
+};

package/lib/table/usePinnedStyles.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-export declare const usePinnedCellStyle: (isPinned: boolean, elementRef: React.MutableRefObject<HTMLTableHeaderCellElement | HTMLTableCellElement>) => void;
+export declare const usePinnedCellStyle: (isPinned: boolean, elementRef: React.MutableRefObject<HTMLTableCellElement>) => void;
 export declare const usePinnedTableBackgroundStyle: (containerRef: React.MutableRefObject<HTMLDivElement>) => void;
 export declare const usePinnedTableHeadStyle: (containerRef: React.MutableRefObject<HTMLDivElement>, maxHeight: number) => void;
 export declare const useMaxHeightTableStyle: (containerRef: React.MutableRefObject<HTMLDivElement>, maxHeight: number) => void;

package/lib/tile-list/SpsTile.d.ts

@@ -4,8 +4,10 @@ declare const propTypes: {
     target: PropTypes.Requireable<string>;
     icon: PropTypes.Validator<PropTypes.ReactNodeOrRenderFn>;
     error: PropTypes.Requireable<boolean>;
+    errorIcon: PropTypes.Requireable<PropTypes.ReactNodeOrRenderFn>;
     title: PropTypes.Validator<string>;
     warning: PropTypes.Requireable<boolean>;
+    warningIcon: PropTypes.Requireable<PropTypes.ReactNodeOrRenderFn>;
     disabled: PropTypes.Requireable<boolean>;
     children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
     className: PropTypes.Requireable<string>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@spscommerce/ds-react",
   "description": "SPS Design System React components",
-  "version": "6.0.0",
+  "version": "6.2.0",
   "author": "SPS Commerce",
   "license": "UNLICENSED",
   "repository": "https://github.com/spscommerce/design-system/tree/main/packages/@spscommerce/ds-react",
@@ -28,11 +28,11 @@
   },
   "peerDependencies": {
     "@react-stately/collections": "^3.3.3",
-    "@spscommerce/ds-colors": "6.0.0",
-    "@spscommerce/ds-illustrations": "6.0.0",
-    "@spscommerce/ds-shared": "6.0.0",
-    "@spscommerce/positioning": "6.0.0",
-    "@spscommerce/utils": "6.0.0",
+    "@spscommerce/ds-colors": "6.2.0",
+    "@spscommerce/ds-illustrations": "6.2.0",
+    "@spscommerce/ds-shared": "6.2.0",
+    "@spscommerce/positioning": "6.2.0",
+    "@spscommerce/utils": "6.2.0",
     "moment": "^2.25.3",
     "moment-timezone": "^0.5.28",
     "react": "^16.9.0",
@@ -40,11 +40,11 @@
   },
   "devDependencies": {
     "@react-stately/collections": "^3.3.3",
-    "@spscommerce/ds-colors": "6.0.0",
-    "@spscommerce/ds-illustrations": "6.0.0",
-    "@spscommerce/ds-shared": "6.0.0",
-    "@spscommerce/positioning": "6.0.0",
-    "@spscommerce/utils": "6.0.0",
+    "@spscommerce/ds-colors": "6.2.0",
+    "@spscommerce/ds-illustrations": "6.2.0",
+    "@spscommerce/ds-shared": "6.2.0",
+    "@spscommerce/positioning": "6.2.0",
+    "@spscommerce/utils": "6.2.0",
     "@testing-library/react": "^9.3.2",
     "@types/prop-types": "^15.7.1",
     "@types/react": "^16.9.0",