@jobber/components 4.77.2-fixdatali.1 → 4.77.3

package/dist/DataList/DataList.types.d.ts

@@ -31,13 +31,13 @@ export interface DataListObject {
 export type DataListHeader<T extends DataListObject> = {
     readonly [K in keyof T]?: string;
 };
-export interface DataListSorting extends SortableOptions {
+export interface DataListSorting extends Partial<SortableOptions> {
     readonly key: string;
 }
 export interface SortableOptions {
-    readonly id?: string;
-    readonly label?: string;
-    readonly order?: "asc" | "desc";
+    readonly id: string;
+    readonly label: string;
+    readonly order: "asc" | "desc";
 }
 export interface DataListProps<T extends DataListObject> {
     /**

package/dist/DataList/components/DataListHeaderTile/components/DataListSortingOptions.d.ts

@@ -1,8 +1,8 @@
 import React from "react";
-import { SortableOptions } from "../../../DataList.types";
+import { DataListSorting, SortableOptions } from "../../../DataList.types";
 interface DataListSortingOptionsProps {
     readonly options: SortableOptions[];
-    readonly selectedOption: SortableOptions | null;
+    readonly selectedOption: DataListSorting | null;
     readonly onSelectChange: (selectedOption: SortableOptions) => void;
     readonly onClose: () => void;
     readonly optionsListRef: React.RefObject<HTMLUListElement>;

package/dist/DataList/index.js

@@ -339,28 +339,28 @@ function DataListHeaderTile({ headers, headerKey, visible = false, }) {
     const isSortable = Boolean(sortableItem);
     const sortingState = sorting === null || sorting === void 0 ? void 0 : sorting.state;
     const Tag = isSortable ? "button" : "div";
-    const selectedOption = (sorting === null || sorting === void 0 ? void 0 : sorting.state) || null;
     return (React__default["default"].createElement(Tag, { className: classnames__default["default"](styles$a.headerLabel, {
             [styles$a.sortable]: isSortable,
         }), onClick: handleOnClick, ref: dataListHeaderTileRef },
         React__default["default"].createElement(Text.Text, { maxLines: "single" }, headers[headerKey]),
-        isSortable && (sortableItem === null || sortableItem === void 0 ? void 0 : sortableItem.options) && isDropDownOpen && (React__default["default"].createElement(DataListSortingOptions, { options: sortableItem.options, selectedOption: selectedOption, onSelectChange: handleSelectChange, onClose: () => setIsDropDownOpen(false), optionsListRef: optionsListRef, dataListHeaderTileRef: dataListHeaderTileRef })),
+        isSortable && (sortableItem === null || sortableItem === void 0 ? void 0 : sortableItem.options) && isDropDownOpen && (React__default["default"].createElement(DataListSortingOptions, { options: sortableItem.options, selectedOption: (sorting === null || sorting === void 0 ? void 0 : sorting.state) || null, onSelectChange: handleSelectChange, onClose: () => setIsDropDownOpen(false), optionsListRef: optionsListRef, dataListHeaderTileRef: dataListHeaderTileRef })),
         (sortingState === null || sortingState === void 0 ? void 0 : sortingState.key) === headerKey ? (React__default["default"].createElement(DataListSortingArrows, { order: sortingState.order })) : (sortingState === null || sortingState === void 0 ? void 0 : sortingState.key) !== headerKey && isSortable ? (React__default["default"].createElement(DataListSortingArrows, { order: "none" })) : null));
-    function toggleSorting(sortingKey, id, label, order) {
-        const isSameKey = (sortingState === null || sortingState === void 0 ? void 0 : sortingState.label) === label && sortingKey === (sortingState === null || sortingState === void 0 ? void 0 : sortingState.key);
+    function toggleSorting(newSortingKey, newId, newLabel, newOrder) {
+        const isSameKey = newSortingKey === (sortingState === null || sortingState === void 0 ? void 0 : sortingState.key);
         const isDescending = (sortingState === null || sortingState === void 0 ? void 0 : sortingState.order) === "desc";
-        if (isSameKey && isDescending && order !== "asc") {
-            if (order === "desc")
-                return;
+        if (isSameKey && isDescending && newOrder === undefined) {
             sorting === null || sorting === void 0 ? void 0 : sorting.onSort(undefined);
             return;
         }
-        const sortingOrder = order || (isSameKey && !isDescending ? "desc" : "asc");
+        const sortingOrder = newOrder || (isSameKey && !isDescending ? "desc" : "asc");
+        setSorting(newSortingKey, newId, newLabel, sortingOrder);
+    }
+    function setSorting(newSortingKey, newId, newLabel, newOrder) {
         sorting === null || sorting === void 0 ? void 0 : sorting.onSort({
-            key: sortingKey,
-            id,
-            label,
-            order: sortingOrder,
+            key: newSortingKey,
+            id: newId,
+            label: newLabel,
+            order: newOrder,
         });
     }
     function handleOnClick() {
@@ -380,7 +380,7 @@ function DataListHeaderTile({ headers, headerKey, visible = false, }) {
     }
     function handleSelectChange(newSortOption) {
         if (sortableItem) {
-            toggleSorting(sortableItem.key, newSortOption.id, newSortOption.label, newSortOption.order);
+            setSorting(sortableItem.key, newSortOption.id, newSortOption.label, newSortOption.order);
         }
         setIsDropDownOpen(true);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "4.77.2-fixdatali.1+f6f79546",
+  "version": "4.77.3",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -20,7 +20,7 @@
   ],
   "dependencies": {
     "@jobber/design": "^0.53.0",
-    "@jobber/formatters": "^0.2.2",
+    "@jobber/formatters": "*",
     "@jobber/hooks": "^2.8.1",
     "@popperjs/core": "^2.0.6",
     "@std-proposal/temporal": "0.0.1",
@@ -84,5 +84,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "f6f795462fdda0164727e5c9491f0da40fad04f1"
+  "gitHead": "0691129f73092a3143495c15965874d7956c91c1"
 }