@jobber/components 6.32.0 → 6.33.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4,23 +4,26 @@ import { BannerType } from "./Banner.types";
4
4
  import { ButtonProps } from "../Button";
5
5
  interface BannerProps {
6
6
  readonly children: ReactNode;
7
+ /**
8
+ * Sets the status-based theme of the Banner
9
+ */
7
10
  readonly type: BannerType;
8
11
  /**
9
- * The default cta variation should be a 'work' variation. If the banner
10
- * 'type' is set to 'notice' we change the cta variation to 'learning'
12
+ * Accepts props for Button. Default action uses a 'subtle' Button
11
13
  */
12
14
  readonly primaryAction?: ButtonProps;
13
15
  /**
16
+ * Set to false to hide the dismiss button
14
17
  * @default true
15
18
  */
16
19
  readonly dismissible?: boolean;
17
20
  /**
18
- * Adds an icon to the left of the banner content
21
+ * Use to override the default status Icon
19
22
  */
20
23
  readonly icon?: IconNames;
21
24
  onDismiss?(): void;
22
25
  /**
23
- * When provided, the banner's visibility is controlled by this value.
26
+ * When provided, Banner's visibility is controlled by this value
24
27
  * @default undefined
25
28
  */
26
29
  readonly controlledVisiblity?: boolean;
@@ -167,6 +167,14 @@ export interface DataListSearchProps {
167
167
  * absolutely have to.
168
168
  */
169
169
  readonly initialValue?: string;
170
+ /**
171
+ * The controlled value of the search input.
172
+ *
173
+ * Supply this field if you want to take control over the search input's
174
+ * value. You'll need to use `onSearch` to handle updating your state with
175
+ * the latest value.
176
+ */
177
+ readonly value?: string;
170
178
  readonly onSearch: (value: string) => void;
171
179
  }
172
180
  export interface DataListFiltersProps {
@@ -28,7 +28,7 @@ function InternalDataListSearch() {
28
28
  const debouncedSearch = React.useCallback(debounce.debounce((value) => { var _a; return (_a = searchComponent === null || searchComponent === void 0 ? void 0 : searchComponent.props) === null || _a === void 0 ? void 0 : _a.onSearch(value); }, DataList_const.SEARCH_DEBOUNCE_DELAY), [searchComponent === null || searchComponent === void 0 ? void 0 : searchComponent.props.onSearch]);
29
29
  if (!searchComponent)
30
30
  return null;
31
- const { placeholder, initialValue } = searchComponent.props;
31
+ const { placeholder, initialValue, value: controlledValue, } = searchComponent.props;
32
32
  return (React.createElement("div", { className: classnames(styles.wrapper, {
33
33
  [styles.withNoFilters]: !filterComponent && !sorting,
34
34
  }) },
@@ -39,7 +39,9 @@ function InternalDataListSearch() {
39
39
  // If the initial value changes, reset the input.
40
40
  , {
41
41
  // If the initial value changes, reset the input.
42
- key: initialValue, defaultValue: initialValue, ref: inputRef, placeholder: getPlaceholder(), onChange: debouncedSearch, prefix: { icon: "search" }, clearable: "always" })),
42
+ key: initialValue, defaultValue: initialValue, value: controlledValue, ref: inputRef, placeholder: getPlaceholder(), onChange: controlledValue !== undefined
43
+ ? searchComponent.props.onSearch
44
+ : debouncedSearch, prefix: { icon: "search" }, clearable: "always" })),
43
45
  React.createElement("div", { className: styles.searchButton },
44
46
  React.createElement(AnimatedSwitcher.AnimatedSwitcher, { switched: visible, initialChild: React.createElement(Button.Button, { variation: "subtle", icon: "search", ariaLabel: "Search", onClick: toggleSearch }), switchTo: React.createElement(Button.Button, { variation: "subtle", icon: "remove", ariaLabel: "Close search bar", onClick: toggleSearch }) }))));
45
47
  function getPlaceholder() {
@@ -26,7 +26,7 @@ function InternalDataListSearch() {
26
26
  const debouncedSearch = useCallback(debounce((value) => { var _a; return (_a = searchComponent === null || searchComponent === void 0 ? void 0 : searchComponent.props) === null || _a === void 0 ? void 0 : _a.onSearch(value); }, SEARCH_DEBOUNCE_DELAY), [searchComponent === null || searchComponent === void 0 ? void 0 : searchComponent.props.onSearch]);
27
27
  if (!searchComponent)
28
28
  return null;
29
- const { placeholder, initialValue } = searchComponent.props;
29
+ const { placeholder, initialValue, value: controlledValue, } = searchComponent.props;
30
30
  return (React__default.createElement("div", { className: classnames(styles.wrapper, {
31
31
  [styles.withNoFilters]: !filterComponent && !sorting,
32
32
  }) },
@@ -37,7 +37,9 @@ function InternalDataListSearch() {
37
37
  // If the initial value changes, reset the input.
38
38
  , {
39
39
  // If the initial value changes, reset the input.
40
- key: initialValue, defaultValue: initialValue, ref: inputRef, placeholder: getPlaceholder(), onChange: debouncedSearch, prefix: { icon: "search" }, clearable: "always" })),
40
+ key: initialValue, defaultValue: initialValue, value: controlledValue, ref: inputRef, placeholder: getPlaceholder(), onChange: controlledValue !== undefined
41
+ ? searchComponent.props.onSearch
42
+ : debouncedSearch, prefix: { icon: "search" }, clearable: "always" })),
41
43
  React__default.createElement("div", { className: styles.searchButton },
42
44
  React__default.createElement(AnimatedSwitcher, { switched: visible, initialChild: React__default.createElement(Button, { variation: "subtle", icon: "search", ariaLabel: "Search", onClick: toggleSearch }), switchTo: React__default.createElement(Button, { variation: "subtle", icon: "remove", ariaLabel: "Close search bar", onClick: toggleSearch }) }))));
43
45
  function getPlaceholder() {
@@ -19,7 +19,7 @@ function useDebounce(func, wait, options) {
19
19
  funcRef.current = func;
20
20
  }
21
21
  const debounced = React.useMemo(() => {
22
- return debounce.debounce(() => funcRef.current(), wait, options);
22
+ return debounce.debounce((...args) => funcRef.current(...args), wait, options);
23
23
  // Note: do not add any dependencies! There is currently no use case where we would change
24
24
  // the wait delay or options between renders. By not tracking as dependencies, this allows
25
25
  // consumers of useDebounce to provide a raw object for options rather than forcing them to
@@ -17,7 +17,7 @@ function useDebounce(func, wait, options) {
17
17
  funcRef.current = func;
18
18
  }
19
19
  const debounced = useMemo(() => {
20
- return debounce(() => funcRef.current(), wait, options);
20
+ return debounce((...args) => funcRef.current(...args), wait, options);
21
21
  // Note: do not add any dependencies! There is currently no use case where we would change
22
22
  // the wait delay or options between renders. By not tracking as dependencies, this allows
23
23
  // consumers of useDebounce to provide a raw object for options rather than forcing them to
@@ -7,5 +7,5 @@ type AnyFunction = (...args: any[]) => any;
7
7
  * @param options Optional debounce settings.
8
8
  * @returns The debounced function.
9
9
  */
10
- export declare function useDebounce<T extends AnyFunction>(func: T, wait: number, options?: Parameters<typeof debounce>[2]): import("lodash").DebouncedFunc<() => any>;
10
+ export declare function useDebounce<T extends AnyFunction>(func: T, wait: number, options?: Parameters<typeof debounce>[2]): import("lodash").DebouncedFunc<(...args: Parameters<T>) => any>;
11
11
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jobber/components",
3
- "version": "6.32.0",
3
+ "version": "6.33.1",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs",
@@ -490,5 +490,5 @@
490
490
  "> 1%",
491
491
  "IE 10"
492
492
  ],
493
- "gitHead": "8057aecd00ce2b6891b4b6e054d47f3b9125e8b1"
493
+ "gitHead": "5b2c31720c4de0974f637d8ab9df1705e3a3204b"
494
494
  }