@jobber/components 8.4.0 → 8.6.0

package/dist/Autocomplete/Autocomplete.d.ts

@@ -1,6 +1,8 @@
-import type { Ref, RefAttributes } from "react";
+import type { Ref } from "react";
 import React from "react";
-import { type AnyOption, type AutocompleteLegacyProps, type Option } from "./Autocomplete.types";
-declare function AutocompleteInternal<GenericOption extends AnyOption = AnyOption, GenericOptionValue extends Option = Option, GenericGetOptionsValue extends AnyOption = AnyOption>({ initialOptions, value, allowFreeForm, size, debounce: debounceRate, onChange, getOptions, placeholder, onBlur, onFocus, customRenderMenu, ...inputProps }: AutocompleteLegacyProps<GenericOption, GenericOptionValue, GenericGetOptionsValue>, ref: Ref<HTMLInputElement>): React.JSX.Element;
-export declare const Autocomplete: <GenericOption extends AnyOption = AnyOption, GenericOptionValue extends Option = Option, GenericGetOptionsValue extends AnyOption = AnyOption>(props: AutocompleteLegacyProps<GenericOption, GenericOptionValue, GenericGetOptionsValue> & RefAttributes<HTMLInputElement>) => ReturnType<typeof AutocompleteInternal>;
+import type { AutocompleteProps, OptionLike } from "./Autocomplete.types";
+export declare const Autocomplete: <Value extends OptionLike = OptionLike, Multiple extends boolean = false>(props: AutocompleteProps<Value, Multiple> & {
+    ref?: Ref<HTMLInputElement | HTMLTextAreaElement>;
+}) => ReturnType<typeof AutocompleteInternal>;
+declare function AutocompleteInternal<Value extends OptionLike, Multiple extends boolean = false>(props: AutocompleteProps<Value, Multiple>, forwardedRef: Ref<HTMLInputElement | HTMLTextAreaElement>): React.JSX.Element;
 export {};

package/dist/Autocomplete/Autocomplete.types.d.ts

@@ -1,8 +1,7 @@
-import type { CSSProperties, Key, Ref, RefObject } from "react";
+import type { CSSProperties, Key, Ref } from "react";
 import type { UseAutocompleteListNavReturn } from "./hooks/useAutocompleteListNav";
 import type { createInteractionPointerDownHandler } from "./utils/interactionUtils";
 import type { AriaInputProps, FocusEvents, HTMLInputBaseProps, RebuiltInputCommonProps } from "../sharedHelpers/types";
-import type { FormFieldProps } from "../FormField";
 import type { InputTextProps } from "../InputText";
 /**
  * ARIA attributes for Autocomplete with managed/orchestrated behavior.
@@ -12,139 +11,6 @@ import type { InputTextProps } from "../InputText";
 interface AriaInputPropsManaged extends Omit<AriaInputProps, "aria-controls" | "aria-expanded" | "aria-activedescendant" | "aria-autocomplete"> {
 }
 export type ExtraProps = Record<string, unknown>;
-type OptionValue = string | number;
-export interface BaseOption {
-    label: string;
-}
-export interface Option extends BaseOption {
-    value?: OptionValue;
-    description?: string;
-    details?: string;
-}
-export interface GroupOption extends BaseOption {
-    options: Option[];
-}
-export type OptionCollection = AnyOption[];
-export type AnyOption<GenericOption extends Option | GroupOption = Option | GroupOption> = GenericOption;
-export type OptionInGroup<T extends AnyOption> = T extends GroupOption ? T["options"][number] : T;
-export interface AutocompleteBaseProps<GenericOption extends AnyOption = AnyOption, GenericOptionValue extends Option = Option, GenericGetOptionsValue extends AnyOption = AnyOption> extends Pick<FormFieldProps, "clearable" | "description" | "invalid" | "name" | "onBlur" | "onFocus" | "prefix" | "size" | "suffix"> {
-    /**
-     * @deprecated
-     * Use `ref` instead.
-     */
-    readonly inputRef?: FormFieldProps["inputRef"];
-    readonly initialOptions?: GenericOption[];
-    /**
-     * Set Autocomplete value.
-     */
-    readonly value: GenericOptionValue | undefined;
-    /**
-     * Allow the autocomplete to use values not from the drop down menu.
-     *
-     * @default true
-     */
-    readonly allowFreeForm?: boolean;
-    /**
-     * Debounce in milliseconds for getOptions
-     *
-     * @default 300
-     */
-    readonly debounce?: number;
-    /**
-     * Simplified onChange handler that only provides the new value.
-     * @param newValue
-     */
-    onChange(newValue?: GenericOptionValue): void;
-    /**
-     * Called as the user types in the input. The autocomplete will display what
-     * is returned from this method to the user as available options.
-     * @param newInputText
-     */
-    getOptions(newInputText: string): Array<GenericGetOptionsValue | GenericOption> | Promise<Array<GenericGetOptionsValue | GenericOption>>;
-    /**
-     * Hint text that goes above the value once the form is filled out.
-     */
-    readonly placeholder: string;
-    /**
-     * Override the content rendered in the menu.
-     */
-    readonly customRenderMenu?: (props: CustomOptionsMenuProp<GenericOption | GenericGetOptionsValue, GenericOptionValue>) => React.ReactElement;
-}
-/**
- * @deprecated Use the v2 Autocomplete component instead (version={2}).
- */
-export interface AutocompleteLegacyProps<GenericOption extends AnyOption = AnyOption, GenericOptionValue extends Option = Option, GenericGetOptionsValue extends AnyOption = AnyOption> extends AutocompleteBaseProps<GenericOption, GenericOptionValue, GenericGetOptionsValue> {
-    /**
-     * Version of the component to use.
-     * @default 1
-     */
-    readonly version?: 1;
-    /**
-     * @deprecated
-     * Use `ref` instead.
-     */
-    readonly inputRef?: FormFieldProps["inputRef"];
-    /**
-     * Initial options to display in the autocomplete.
-     */
-    readonly initialOptions?: GenericOption[];
-    /**
-     * Called as the user types in the input. The autocomplete will display what
-     * is returned from this method to the user as available options.
-     * @param newInputText
-     */
-    readonly getOptions: (newInputText: string) => Array<GenericGetOptionsValue | GenericOption> | Promise<Array<GenericGetOptionsValue | GenericOption>>;
-}
-export type AutocompleteProps<GenericOption extends AnyOption = AnyOption, GenericOptionValue extends Option = Option, GenericGetOptionsValue extends AnyOption = AnyOption> = AutocompleteLegacyProps<GenericOption, GenericOptionValue, GenericGetOptionsValue>;
-export type CustomOptionsMenuType<GenericOption extends AnyOption = AnyOption> = (props: CustomOptionsMenuProp<GenericOption>) => React.ReactElement;
-export interface MenuProps<GenericOption extends AnyOption = AnyOption, GenericOptionValue extends Option = Option> {
-    readonly options: GenericOption[];
-    readonly selectedOption?: GenericOptionValue;
-    readonly inputFocused: boolean;
-    /**
-     * Element that the menu is attached to when the menu opens.
-     */
-    readonly attachTo: HTMLDivElement | null;
-    /**
-     * Ref to the TextInput element.
-     */
-    readonly inputRef: RefObject<HTMLInputElement | null>;
-    onOptionSelect(chosenOption?: GenericOptionValue): void;
-    readonly customRenderMenu?: (props: CustomOptionsMenuProp<GenericOption, GenericOptionValue>) => React.ReactElement;
-}
-export interface CustomOptionsMenuProp<GenericOption extends AnyOption = AnyOption, GenericOptionValue extends Option = Option> {
-    /**
-     * The options to display in the menu
-     */
-    options: Array<OptionInGroup<GenericOption> | GenericOption>;
-    /**
-     * The currently selected option
-     */
-    selectedOption?: GenericOptionValue;
-    /**
-     * The HTML element that wraps the menu content. Used for handling keyboard scroll behavior.
-     */
-    readonly menuRef: HTMLElement | null | undefined;
-    /**
-     * Callback to select an option
-     */
-    readonly onOptionSelect: (chosenOption?: GenericOptionValue) => void;
-    /**
-     * Determine if the input is focused. Can be used to conditionally render the menu.
-     */
-    readonly inputFocused: boolean;
-    /**
-     * Ref to the TextInput element.
-     */
-    readonly inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement | null>;
-    /**
-     * Component that wraps the menu content. Used for handling keyboard scroll behavior.
-     */
-    readonly MenuWrapper: (props: {
-        children: React.ReactNode;
-        visible: boolean;
-    }) => React.ReactElement;
-}
 export interface OptionLike {
     label: string;
     /**
@@ -230,7 +96,7 @@ export type MenuFooter<Extra extends object = ExtraProps> = Extra & {
 };
 export type MenuItem<T extends OptionLike, SectionExtra extends object = ExtraProps, ActionExtra extends object = ExtraProps> = MenuSection<T, SectionExtra, ActionExtra> | MenuOptions<T, ActionExtra> | MenuHeader<ActionExtra> | MenuFooter<ActionExtra>;
 export type AutocompleteValue<Value extends OptionLike, Multiple extends boolean> = Multiple extends true ? Value[] : Value | undefined;
-interface AutocompleteRebuiltBaseProps<Value extends OptionLike, Multiple extends boolean, SectionExtra extends object, ActionExtra extends object> extends AriaInputPropsManaged, Pick<HTMLInputBaseProps, "name" | "disabled" | "readOnly" | "autoFocus">, Pick<RebuiltInputCommonProps, "placeholder" | "error" | "invalid" | "loading" | "clearable" | "description" | "size" | "prefix" | "suffix" | "version">, FocusEvents<HTMLInputElement | HTMLTextAreaElement> {
+interface AutocompleteBaseProps<Value extends OptionLike, Multiple extends boolean, SectionExtra extends object, ActionExtra extends object> extends AriaInputPropsManaged, Pick<HTMLInputBaseProps, "name" | "disabled" | "readOnly" | "autoFocus">, Pick<RebuiltInputCommonProps, "placeholder" | "error" | "invalid" | "loading" | "clearable" | "description" | "size" | "prefix" | "suffix">, FocusEvents<HTMLInputElement | HTMLTextAreaElement> {
     /**
      * Whether the autocomplete allows multiple selections.
      * When true, selected values are displayed as dismissible chips above the input.
@@ -486,7 +352,7 @@ interface FreeFormOn<Value extends OptionLike, Multiple extends boolean> {
     readonly onChange: (value: AutocompleteValue<Value, Multiple>) => void;
 }
 export type ActionOrigin = "menu" | "empty";
-export type AutocompleteRebuiltProps<Value extends OptionLike = OptionLike, Multiple extends boolean = false, SectionExtra extends object = ExtraProps, ActionExtra extends object = ExtraProps> = AutocompleteRebuiltBaseProps<Value, Multiple, SectionExtra, ActionExtra> & (FreeFormOn<Value, Multiple> | FreeFormOff<Value, Multiple>);
+export type AutocompleteProps<Value extends OptionLike = OptionLike, Multiple extends boolean = false, SectionExtra extends object = ExtraProps, ActionExtra extends object = ExtraProps> = AutocompleteBaseProps<Value, Multiple, SectionExtra, ActionExtra> & (FreeFormOn<Value, Multiple> | FreeFormOff<Value, Multiple>);
 export declare const menuOptions: <T extends OptionLike, ActionExtra extends object = ExtraProps>(options: T[], actions?: MenuAction<ActionExtra>[]) => MenuOptions<T, ActionExtra>;
 export declare const menuSection: <T extends OptionLike, SectionExtra extends object = ExtraProps, ActionExtra extends object = ExtraProps>(label: string, options: T[], actions?: MenuAction<ActionExtra>[], extra?: SectionExtra) => MenuSection<T, SectionExtra, ActionExtra>;
 export declare function defineMenu<T extends OptionLike, S extends object = ExtraProps, A extends object = ExtraProps>(menu: MenuItem<T, S, A>[]): MenuItem<T, S, A>[];

package/dist/Autocomplete/components/FloatingMenu.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import type { UseFloatingReturn, UseInteractionsReturn } from "@floating-ui/react";
-import type { ActionConfig, AutocompleteRebuiltProps, MenuFooter, MenuHeader, OptionLike, RenderItem } from "../Autocomplete.types";
+import type { ActionConfig, AutocompleteProps, MenuFooter, MenuHeader, OptionLike, RenderItem } from "../Autocomplete.types";
 interface FloatingMenuProps<Value extends OptionLike> {
     readonly context: UseFloatingReturn["context"];
     readonly getFloatingProps: UseInteractionsReturn["getFloatingProps"];
@@ -27,11 +27,11 @@ interface FloatingMenuProps<Value extends OptionLike> {
     readonly showEmptyStateMessage: boolean;
     readonly emptyStateMessage?: React.ReactNode;
     readonly customRenderLoading?: React.ReactNode;
-    readonly customRenderOption?: AutocompleteRebuiltProps<Value, false>["customRenderOption"];
-    readonly customRenderSection?: AutocompleteRebuiltProps<Value, false>["customRenderSection"];
-    readonly customRenderAction?: AutocompleteRebuiltProps<Value, false>["customRenderAction"];
-    readonly customRenderHeader?: AutocompleteRebuiltProps<Value, false>["customRenderHeader"];
-    readonly customRenderFooter?: AutocompleteRebuiltProps<Value, false>["customRenderFooter"];
+    readonly customRenderOption?: AutocompleteProps<Value, false>["customRenderOption"];
+    readonly customRenderSection?: AutocompleteProps<Value, false>["customRenderSection"];
+    readonly customRenderAction?: AutocompleteProps<Value, false>["customRenderAction"];
+    readonly customRenderHeader?: AutocompleteProps<Value, false>["customRenderHeader"];
+    readonly customRenderFooter?: AutocompleteProps<Value, false>["customRenderFooter"];
     readonly slotOverrides?: {
         option?: {
             className?: string;

package/dist/Autocomplete/components/MenuList.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { ActionConfig, AutocompleteRebuiltProps, OptionLike, RenderItem } from "../Autocomplete.types";
+import type { ActionConfig, AutocompleteProps, OptionLike, RenderItem } from "../Autocomplete.types";
 interface MenuListProps<T extends OptionLike> {
     readonly items: Array<RenderItem<T>>;
     readonly activeIndex: number | null;
@@ -7,9 +7,9 @@ interface MenuListProps<T extends OptionLike> {
     readonly getItemProps: (userProps?: Record<string, unknown>) => Record<string, unknown>;
     readonly listRef: React.RefObject<Array<HTMLElement | null>>;
     readonly listboxId: string;
-    readonly customRenderOption?: AutocompleteRebuiltProps<T, false>["customRenderOption"];
-    readonly customRenderSection?: AutocompleteRebuiltProps<T, false>["customRenderSection"];
-    readonly customRenderAction?: AutocompleteRebuiltProps<T, false>["customRenderAction"];
+    readonly customRenderOption?: AutocompleteProps<T, false>["customRenderOption"];
+    readonly customRenderSection?: AutocompleteProps<T, false>["customRenderSection"];
+    readonly customRenderAction?: AutocompleteProps<T, false>["customRenderAction"];
     readonly getOptionLabel: (option: T) => string;
     readonly onSelect: (option: T) => void;
     readonly onAction: (action: ActionConfig) => void;

package/dist/Autocomplete/components/PersistentRegion.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { ActionConfig, AutocompleteRebuiltProps, MenuFooter, MenuHeader, OptionLike } from "../Autocomplete.types";
+import type { ActionConfig, AutocompleteProps, MenuFooter, MenuHeader, OptionLike } from "../Autocomplete.types";
 interface PersistentRegionProps<T extends OptionLike> {
     readonly items: Array<MenuHeader<Record<string, unknown>> | MenuFooter<Record<string, unknown>>>;
     readonly position: "header" | "footer";
@@ -8,8 +8,8 @@ interface PersistentRegionProps<T extends OptionLike> {
     readonly listboxId?: string;
     readonly getItemProps: (args?: Record<string, unknown>) => Record<string, unknown>;
     readonly listRef: React.RefObject<Array<HTMLElement | null>>;
-    readonly customRenderHeader?: AutocompleteRebuiltProps<T, false>["customRenderHeader"];
-    readonly customRenderFooter?: AutocompleteRebuiltProps<T, false>["customRenderFooter"];
+    readonly customRenderHeader?: AutocompleteProps<T, false>["customRenderHeader"];
+    readonly customRenderFooter?: AutocompleteProps<T, false>["customRenderFooter"];
     readonly className?: string;
     readonly style?: React.CSSProperties;
     readonly onAction: (action: ActionConfig) => void;