@jobber/components 4.26.3 → 4.26.4

package/dist/DataList/DataList.const.d.ts

@@ -0,0 +1,2 @@
+export declare const EMPTY_FILTER_RESULTS_MESSAGE = "No Results for Selected Filters";
+export declare const EMPTY_FILTER_RESULTS_ACTION_LABEL = "Clear Filters";

package/dist/DataList/DataList.d.ts

@@ -1,21 +1,8 @@
-import React from "react";
-export interface DataListProps {
-    /**
-     * Tell the DataList if the data loading
-     * @default false
-     */
-    loading?: boolean;
-    items: any[];
-    /**
-     * Temporary prop for setting default state for if filters are applied
-     * @default false
-     */
-    filterApplied?: boolean;
-    children?: React.ReactElement | React.ReactElement[];
-}
-export declare const EMPTY_FILTER_RESULTS_MESSAGE = "No Results for Selected Filters";
-export declare const EMPTY_FILTER_RESULTS_ACTION_LABEL = "Clear Filters";
-export declare function DataList({ loading, items, filterApplied, children, }: DataListProps): JSX.Element;
+/// <reference types="react" />
+import { DataListLayout } from "./components/DataListLayout";
+import { DataListObject, DataListProps } from "./DataList.types";
+export declare function DataList<T extends DataListObject>({ data, headers, loading, filterApplied, children, }: DataListProps<T>): JSX.Element;
 export declare namespace DataList {
+    var Layout: typeof DataListLayout;
     var EmptyState: typeof import("./components/EmptyState").EmptyState;
 }

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

@@ -0,0 +1,22 @@
+import { ReactElement, ReactNode } from "react";
+export type DataListItemType<T extends DataListObject[]> = Record<keyof T[number], ReactElement>;
+export type DataListItemTypeFromHeader<T extends DataListHeader<T>> = Record<keyof T, ReactElement>;
+export type DataListObject = Record<string, ReactNode | Date>;
+export type DataListHeader<T extends DataListObject> = {
+    readonly [K in keyof T]?: string;
+};
+export interface DataListProps<T extends DataListObject> {
+    readonly data: T[];
+    readonly headers: DataListHeader<T>;
+    /**
+     * Tell the DataList if the data loading
+     * @default false
+     */
+    readonly loading?: boolean;
+    /**
+     * Temporary prop for setting default state for if filters are applied
+     * @default false
+     */
+    readonly filterApplied?: boolean;
+    readonly children: ReactElement | ReactElement[];
+}

package/dist/DataList/DataList.utils.d.ts

@@ -0,0 +1,25 @@
+import React, { ReactElement } from "react";
+import { DataListHeader, DataListItemType, DataListItemTypeFromHeader, DataListObject } from "./DataList.types";
+import { EmptyStateProps } from "./components/EmptyState";
+/**
+ * Return the child component that matches the `type` provided
+ */
+export declare function getCompoundComponent<T>(children: ReactElement | ReactElement[], type: ReactElement<T>["type"]): ReactElement<T> | undefined;
+/**
+ * Generate the default elements the DataList would use on the data provided.
+ */
+export declare function generateListItemElements<T extends DataListObject>(data: T[]): DataListItemType<T[]>[];
+/**
+ * Generate the header elements with the default styling
+ */
+export declare function generateHeaderElements<T extends DataListObject>(headers: DataListHeader<T>): DataListItemTypeFromHeader<DataListHeader<T>> | undefined;
+interface UseDataListEmptyStateProps {
+    readonly children?: ReactElement | ReactElement[];
+    readonly isFilterApplied: boolean;
+    readonly setIsFilterApplied: (isFilterApplied: boolean) => void;
+}
+/**
+ * Modify EmptyState to include an empty filter results when filtering happens
+ */
+export declare function generateDataListEmptyState({ children, isFilterApplied, setIsFilterApplied, }: UseDataListEmptyStateProps): React.ReactElement<EmptyStateProps> | undefined;
+export {};

package/dist/DataList/components/DataListLayout/DataListLayout.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { DataListItemType, DataListObject } from "../../DataList.types";
+export interface DataListLayoutProps<T extends DataListObject> {
+    children: (item: DataListItemType<T[]>) => JSX.Element;
+}
+export declare function DataListLayout<T extends DataListObject>(_: DataListLayoutProps<T>): JSX.Element;

package/dist/DataList/components/DataListLayout/index.d.ts

@@ -0,0 +1 @@
+export * from "./DataListLayout";

package/dist/DataList/storyUtils.d.ts

@@ -0,0 +1,38 @@
+import { ApolloClient } from "@apollo/client";
+export interface ListQueryType {
+    allPeople: {
+        __typename?: "PeopleConnection";
+        pageInfo: {
+            hasNextPage: boolean;
+            endCursor: string;
+        };
+        edges: Array<{
+            __typename?: "PeopleEdge";
+            node: {
+                created: string;
+                id: string;
+                name: string;
+                gender: string;
+                hairColor: string;
+                skinColor: string;
+                homeworld: {
+                    name: string;
+                    id: string;
+                    population: number;
+                };
+            };
+            cursor: string;
+        }>;
+        totalCount?: number;
+    };
+}
+export type ListEdges = ListQueryType["allPeople"]["edges"];
+export type ListNode = ListEdges[number]["node"];
+export declare const LIST_QUERY: import("@apollo/client").DocumentNode;
+export declare const apolloClient: ApolloClient<import("@apollo/client").NormalizedCacheObject>;
+interface LoadingState {
+    loadingStatus: string;
+    loading: boolean;
+}
+export declare function getLoadingState(loadingInitialContent: boolean, loadingRefresh: boolean, loadingNextPage: boolean): LoadingState;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "4.26.3",
+  "version": "4.26.4",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -83,5 +83,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "4af41f0d6352d5c2fcf5ad4ab90c73e20063bdcb"
+  "gitHead": "bf27bb2276b747f43c4f7ba7be282d08c0b036b3"
 }