@iress-oss/ids-components 5.20.2 → 6.0.0-alpha.1

package/dist/src/enums.d.ts

@@ -0,0 +1,281 @@
+export declare enum GlobalCSSClass {
+    Group = "group",// https://panda-css.com/docs/concepts/conditional-styles#group-selectors
+    FormElement = "iress-form-element",
+    FormElementInner = "iress-form-element__inner",
+    FormElementInvalid = "iress-form-element--invalid",
+    FormLabel = "iress-form-label",
+    Alert = "ids-alert",
+    Autocomplete = "ids-autocomplete",
+    Badge = "ids-badge",
+    Button = "ids-button",
+    ButtonGroup = "ids-button-group",
+    Card = "ids-card",
+    Checkbox = "ids-checkbox",
+    CheckboxGroup = "ids-checkbox-group",
+    CheckboxMark = "ids-checkbox-mark",
+    CloseButton = "ids-button--close",
+    Col = "ids-col",
+    Container = "ids-container",
+    Divider = "ids-divider",
+    Expander = "ids-expander",
+    Field = "ids-field",
+    FieldGroup = "ids-field-group",
+    Form = "ids-form",
+    Filter = "ids-filter",
+    Icon = "ids-icon",
+    Image = "ids-image",
+    Inline = "ids-inline",
+    Input = "ids-input",
+    InputCurrency = "ids-input--currency",
+    InputPopover = "ids-popover--input",
+    Link = "ids-link",
+    Menu = "ids-menu",
+    MenuHeading = "ids-text--menu-heading",
+    MenuDivider = "ids-divider--menu",
+    MenuItem = "ids-menu-item",
+    MenuText = "ids-text--menu",
+    Modal = "ids-modal",
+    ModalBackdrop = "ids-modal__backdrop",
+    Panel = "ids-panel",
+    Placeholder = "ids-placeholder",
+    Popover = "ids-popover",
+    PopoverContent = "ids-popover__content",
+    Progress = "ids-progress",
+    Radio = "ids-radio",
+    RadioGroup = "ids-radio-group",
+    Readonly = "ids-input--readonly",
+    RichSelect = "ids-rich-select",
+    RichSelectTags = "ids-rich-select-tags",
+    RichSelectSearchInput = "ids-rich-select-search-input",
+    RichSelectSearch = "ids-rich-select-search",
+    RichSelectSearchContent = "ids-rich-select-search--content",
+    RichSelectMenu = "ids-rich-select-menu",
+    RichSelectMenuItem = "ids-rich-select-menu-item",
+    RichSelectLabel = "ids-rich-select-label",
+    RichSelectHeading = "ids-rich-select-heading",
+    RichSelectClearButton = "ids-rich-select-clear-button",
+    RichSelectBody = "ids-rich-select-body",
+    Row = "ids-row",
+    Select = "ids-select",
+    Skeleton = "ids-skeleton",
+    SkipLink = "ids-skip-link",
+    Slideout = "ids-slideout",
+    SlideoutPushElement = "ids-slideout-push-element",
+    SlideoutOpen = "ids-slideout--open",
+    Slider = "ids-slider",
+    Spinner = "ids-spinner",
+    Stack = "ids-stack",
+    Table = "ids-table",
+    Tab = "ids-tab",
+    TabSet = "ids-tabset",
+    Tag = "ids-tag",
+    TagInput = "ids-tag-input",
+    Text = "ids-text",
+    Toast = "ids-toast",
+    Toaster = "ids-toaster",
+    Toggle = "ids-toggle",
+    Tooltip = "ids-tooltip",
+    ValidationLink = "ids-validation-message--link",
+    ValidationMessage = "ids-validation-message",
+    ValidationSummary = "ids-validation-sumary"
+}
+/** @deprecated Breakpoint enum is now deprecated and will be removed in a future version. Please use the Breakpoints type instead. **/
+export declare enum Breakpoint {
+    Xs = "xs",
+    Sm = "sm",
+    Md = "md",
+    Lg = "lg",
+    Xl = "xl",
+    Xxl = "xxl"
+}
+/** @deprecated DisplayMode enum is now deprecated and will be removed in a future version. Please use the DisplayModes type instead. **/
+export declare enum DisplayMode {
+    Inline = "inline",
+    Overlay = "overlay"
+}
+/** @deprecated HeadingLevel enum is now deprecated and will be removed in a future version. Please use the HeadingLevels type instead. */
+export declare enum HeadingLevel {
+    H2 = "h2",
+    H3 = "h3",
+    H4 = "h4",
+    H5 = "h5",
+    H6 = "h6"
+}
+/** @deprecated LoggerLevels enum is now deprecated and will be removed in a future version. Please use the LoggerLevels type instead. **/
+export declare enum LoggerLevels {
+    Log = "log",
+    Warn = "warn",
+    Error = "error"
+}
+/** @deprecated TextFieldType enum is now deprecated and will be removed in a future version. Please use the value directly instead. **/
+export declare enum TextFieldType {
+    Date = "date",
+    Email = "email",
+    Number = "number",
+    Password = "password",
+    Search = "search",
+    Tel = "tel",
+    Text = "text",
+    Url = "url",
+    Time = "time",
+    Color = "color",
+    File = "file",
+    DateTimeLocal = "datetime-local"
+}
+/** @deprecated FormElementType enum is now deprecated and will be removed in a future version. Please use the FormElementTypes type instead. **/
+export declare enum FormElementType {
+    Date = "date",
+    Email = "email",
+    Number = "number",
+    Password = "password",
+    Search = "search",
+    Tel = "tel",
+    Text = "text",
+    Url = "url",
+    Time = "time",
+    File = "file",
+    Color = "color",
+    Checkbox = "checkbox",
+    Radio = "radio",
+    Select = "select",
+    CheckboxGroup = "checkbox-group",
+    RadioGroup = "radio-group",
+    Combobox = "combobox",
+    DateTimeLocal = "datetime-local"
+}
+/** @deprecated FormElementWidth enum is now deprecated and will be removed in a future version. Please use the FormElementWidths type instead. **/
+export declare enum FormElementWidth {
+    Two = "2",
+    Four = "4",
+    Six = "6",
+    Eight = "8",
+    Ten = "10",
+    Twelve = "12",
+    Sixteen = "16",
+    TwentyFivePercent = "25perc",
+    FiftyPercent = "50perc",
+    SeventyFivePercent = "75perc"
+}
+/** @deprecated FloatingUIAlign enum is now deprecated and will be removed in a future version. Please use the FloatingUIAligns type instead. **/
+export declare enum FloatingUIAlign {
+    Auto = "auto",
+    BottomStart = "bottom-start",
+    BottomCenter = "bottom",
+    BottomEnd = "bottom-end",
+    TopStart = "top-start",
+    TopCenter = "top",
+    TopEnd = "top-end",
+    LeftStart = "left-start",
+    LeftCenter = "left",
+    LeftEnd = "left-end",
+    RightStart = "right-start",
+    RightCenter = "right",
+    RightEnd = "right-end"
+}
+/** @deprecated SystemValidationStatus enum is now deprecated and will be removed in a future version. Please use the SystemValidationStatuses type instead. **/
+export declare enum SystemValidationStatus {
+    Danger = "danger",
+    Info = "info",
+    Success = "success",
+    Warning = "warning"
+}
+/** @deprecated TextAlign enum is now deprecated and will be removed in a future version. Please use the TextAligns type instead. **/
+export declare enum TextAlign {
+    Inherit = "inherit",
+    Left = "left",
+    Center = "center",
+    Right = "right",
+    Justify = "justify"
+}
+/** @deprecated TextElement enum is now deprecated and will be removed in a future version. Please use the TextElements type instead. **/
+export declare enum TextElement {
+    P = "p",
+    Div = "div",
+    Span = "span",
+    H1 = "h1",
+    H2 = "h2",
+    H3 = "h3",
+    H4 = "h4",
+    H5 = "h5",
+    H6 = "h6",
+    Code = "code",
+    Blockquote = "blockquote",
+    Caption = "caption",
+    Cite = "cite",
+    Small = "small"
+}
+/** @deprecated TextMode enum is now deprecated and will be removed in a future version. Please use the TextModes type instead. **/
+export declare enum TextMode {
+    /** @deprecated TextMode.Body enum is deprecated and will be removed in a future version. Please use the variant prop instead. **/
+    Body = "body",
+    Danger = "danger",
+    Info = "info",
+    Muted = "muted",
+    Primary = "primary",
+    Success = "success",
+    Warning = "warning",
+    Positive = "positive",
+    Negative = "negative"
+}
+/** @deprecated TextVariant enum is now deprecated and will be removed in a future version. Please use the TextVariants type instead. **/
+export declare enum TextVariant {
+    Blockquote = "blockquote",
+    Bold = "bold",
+    Body = "body",
+    Code = "code",
+    Display = "display",
+    Display1 = "display1",
+    Display2 = "display2",
+    Display3 = "display3",
+    Display4 = "display4",
+    Heading1 = "h1",
+    Heading2 = "h2",
+    Heading3 = "h3",
+    Heading4 = "h4",
+    Heading5 = "h5",
+    Heading6 = "h6",
+    Italic = "italic",
+    Lead = "lead",
+    Small = "small",
+    Cite = "cite",
+    Caption = "caption"
+}
+/** @deprecated PaddingSize enum is now deprecated and will be removed in a future version. Please use the PaddingSizes type instead. **/
+export declare enum PaddingSize {
+    None = "none",
+    Sm = "sm",
+    Md = "md",
+    Lg = "lg"
+}
+/** @deprecated ModalSize enum is now deprecated and will be removed in a future version. Please use the ModalSizes type instead. **/
+export declare enum ModalSize {
+    Sm = "sm",
+    Md = "md",
+    Lg = "lg",
+    FullPage = "fullpage"
+}
+/** @deprecated GutterSize enum is now deprecated and will be removed in a future version. Please use the GutterSizes type instead. **/
+export declare enum GutterSize {
+    None = "none",
+    Xs = "xs",
+    Sm = "sm",
+    Md = "md",
+    Lg = "lg",
+    Xl = "xl"
+}
+/** @deprecated HorizontalAlign is now deprecated and will be removed in a future version. Please use the HorizontalAligns type instead. */
+export declare enum HorizontalAlign {
+    Around = "around",
+    Between = "between",
+    Center = "center",
+    Evenly = "evenly",
+    Left = "left",
+    Right = "right"
+}
+/** @deprecated VerticalAlign is now deprecated and will be removed in a future version. Please use the VerticalAligns type instead. */
+export declare enum VerticalAlign {
+    Bottom = "bottom",
+    Middle = "middle",
+    Stretch = "stretch",
+    Top = "top"
+}

package/dist/src/helpers/dom/closestCrossShadow.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Finds the closest ancestor element that matches the selector, traversing across shadow DOM boundaries.
+ * Similar to native Element.closest() but works across shadow DOM.
+ *
+ * @param element - The starting element
+ * @param selector - CSS selector to match against
+ * @returns The closest ancestor element matching the selector, or null if not found
+ */
+export declare const closestCrossShadow: (element: Element | null, selector: string) => Element | null;

package/dist/src/helpers/dom/domUtils.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Safely calls the closest method on an element, handling cases where the element
+ * might not have the closest method (e.g., in jsdom environments)
+ */
+export declare const safeClosest: (element: Element | null, selector: string) => Element | null;

package/dist/src/helpers/dom/focusableElements.d.ts

@@ -0,0 +1 @@
+export declare const focusableElements: (el: HTMLElement) => HTMLElement[];

package/dist/src/helpers/dom/getActiveElement.d.ts

@@ -0,0 +1 @@
+export declare const getActiveElement: () => HTMLElement;

package/dist/src/helpers/dom/hasShadowDom.d.ts

@@ -0,0 +1 @@
+export declare const hasShadowDom: (el: HTMLElement) => boolean;

package/dist/src/helpers/form/getFormControlValueAsString.d.ts

@@ -0,0 +1,2 @@
+import { FormControlValue } from '../../types';
+export declare const getFormControlValueAsString: <T = FormControlValue>(value?: T) => string;

package/dist/src/helpers/form/getFormControlValueAsStringIfDefined.d.ts

@@ -0,0 +1,2 @@
+import { FormControlValue } from '../../types';
+export declare const getFormControlValueAsStringIfDefined: <T = FormControlValue>(value?: T) => string | undefined;

package/dist/src/helpers/form/getValueAsEvent.d.ts

@@ -0,0 +1,15 @@
+import { FormControlValue } from '../../types';
+/**
+ * This method wraps up a value in an event object, allowing it to work in React Hook Forms change handlers.
+ * See: https://github.com/react-hook-form/react-hook-form/blob/6deae49068dc8ac056977d4def168a78968d9e61/src/types/form.ts#L96
+ * @param value
+ * @returns { target: { value } }
+ */
+export declare const getValueAsEvent: <T = FormControlValue, EventType = {
+    currentTarget: {
+        value: T;
+    };
+    target: {
+        value: T;
+    };
+}>(value: T) => EventType;

package/dist/src/helpers/form/isValidFormInputElement.d.ts

@@ -0,0 +1 @@
+export declare const isValidFormInputElement: (ele: HTMLElement) => boolean;

package/dist/src/helpers/formatting/capitalizeFirstLetter.d.ts

@@ -0,0 +1 @@
+export declare const capitalizeFirstLetter: (str: string) => string;

package/dist/src/helpers/formatting/formatCurrency.d.ts

@@ -0,0 +1,25 @@
+export interface CurrencyFormatterProps {
+    /**
+     * The currency code to use when formatting the value.
+     */
+    currencyCode?: string;
+    /**
+     * Additional options to pass to the `Intl.NumberFormat` constructor.
+     * [Learn more](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat)
+     */
+    formatOptions?: Omit<Intl.NumberFormatOptions, 'currency'>;
+    /**
+     * The locale to use when formatting the value.
+     * @default 'en-AU'
+     */
+    locale?: Intl.LocalesArgument;
+    /**
+     * The value to format.
+     */
+    value?: string | number | null;
+    /**
+     * Whether to include the currency symbol in the output.
+     */
+    withSymbol?: boolean;
+}
+export declare const formatCurrency: ({ value, locale, currencyCode, withSymbol, formatOptions, }: CurrencyFormatterProps) => string | number;

package/dist/src/helpers/formatting/formatDate.d.ts

@@ -0,0 +1,5 @@
+export declare const pad: (num: number) => string;
+export type DateValue = string | number | Date;
+export declare const getDateObj: (value: DateValue) => Date;
+export declare const formatDate: (dateVal: DateValue) => string;
+export declare const formatShortDate: (dateVal: DateValue) => string;

package/dist/src/helpers/formatting/formatDateTime.d.ts

@@ -0,0 +1,3 @@
+import { DateValue } from './formatDate';
+export declare const formatISODateTime: (dateVal: DateValue) => string;
+export declare const formatRelativeTime: (dateVal: DateValue, useShortDateAfter?: Intl.RelativeTimeFormatUnit | null) => string;

package/dist/src/helpers/formatting/formatObjectKey.d.ts

@@ -0,0 +1 @@
+export declare const formatObjectKey: (key: string) => string;

package/dist/src/helpers/formatting/formatPercentage.d.ts

@@ -0,0 +1 @@
+export declare const formatPercentage: (value: number | string) => string;

package/dist/src/helpers/formatting/stringReplacer.d.ts

@@ -0,0 +1,2 @@
+import { NameValue } from '../../interfaces';
+export declare const stringReplacer: (str: string, replaceArr?: NameValue[]) => string;

package/dist/src/helpers/formatting/toArray.d.ts

@@ -0,0 +1 @@
+export declare const toArray: <T>(item?: T | T[]) => T[];

package/dist/src/helpers/formatting/toCSSLengthValue.d.ts

@@ -0,0 +1 @@
+export declare const toCSSLengthValue: (val: string | number) => string;

package/dist/src/helpers/label-value/composeLabelValueDescriptor.d.ts

@@ -0,0 +1,9 @@
+import { LabelValueMeta } from '../../interfaces';
+/**
+ * Converts the selected options into a human-readable string.
+ *
+ * @param selected the selected state, usually a single or array of LabelValueMeta
+ * @param selectedOptionsText when multiple options are selected, this text will be used to describe the selection. {{numOptions}} is replaced with the number of options selected.
+ * @returns
+ */
+export declare const composeLabelValueDescriptor: (selected?: LabelValueMeta | LabelValueMeta[], selectedOptionsText?: string) => string;

package/dist/src/helpers/label-value/getQueryRangeExclusive.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Get the range of label where the query is not found.
+ * This is useful for highlighting the area of the label that does not match the query.
+ * @param query
+ * @param label
+ * @returns [start: number, end: number] | undefined
+ */
+export declare const getQueryRangeExclusive: (query: string, label: string) => [start: number, end: number] | undefined;

package/dist/src/helpers/label-value/getValueFromLabelValues.d.ts

@@ -0,0 +1,2 @@
+import { LabelValue } from '../../interfaces';
+export declare const getValueFromLabelValues: <T extends LabelValue = LabelValue>(items?: T[] | T, array?: boolean) => string | number | boolean | (string | number | boolean)[];

package/dist/src/helpers/label-value/highlightQueryInLabel.d.ts

@@ -0,0 +1,2 @@
+import { ElementType, ReactNode } from 'react';
+export declare const highlightQueryInLabel: (label: string, query: string, Tag?: ElementType) => ReactNode;

package/dist/src/helpers/label-value/highlightQueryInLabelValue.d.ts

@@ -0,0 +1,3 @@
+import { ElementType } from 'react';
+import { FormattedLabelValueMeta, LabelValueMeta } from '../../interfaces';
+export declare const highlightQueryInLabelValue: (labelValueMeta: LabelValueMeta, query: string, Tag?: ElementType) => FormattedLabelValueMeta;

package/dist/src/helpers/label-value/searchLabelValues.d.ts

@@ -0,0 +1,2 @@
+import { FormattedLabelValueMeta, LabelValue } from '../../interfaces';
+export declare const searchLabelValues: (query: string, optionsData: LabelValue[], resultLimit?: number) => FormattedLabelValueMeta[];

package/dist/src/helpers/responsive/getResponsiveLayoutModifiers.d.ts

@@ -0,0 +1,2 @@
+import { ResponsiveSizing } from '../../interfaces';
+export declare const getResponsiveLayoutModifiers: <T = string>(modifier: string, values?: ResponsiveSizing<T> | T, fallback?: T) => string[];

package/dist/src/helpers/responsive/getResponsivePaddingClasses.d.ts

@@ -0,0 +1,2 @@
+import { ResponsiveSizing } from '../../interfaces';
+export declare const getResponsivePaddingClasses: <T = string>(padding: ResponsiveSizing<T> | T) => string[];

package/dist/src/helpers/styling/getVariablePadding.d.ts

@@ -0,0 +1,6 @@
+import { MixedPaddingSize, PaddingSizes } from '../../types';
+import { VariablePaddingSize, ResponsiveSizing } from '../../interfaces';
+import { SpacingToken } from '../../styled-system/tokens';
+import { PaddingSize } from '../../enums';
+export type PanelPadding = PaddingSize | PaddingSizes | VariablePaddingSize | ResponsiveSizing<MixedPaddingSize> | SpacingToken;
+export declare const getVariablePaddingValue: (padding: PanelPadding, breakpoint: string, key?: keyof VariablePaddingSize) => SpacingToken | undefined;

package/dist/src/helpers/styling/iressCss.d.ts

@@ -0,0 +1,22 @@
+import { IressCSSProps } from '../../interfaces';
+import { ComponentProps, ElementType, FC } from 'react';
+/**
+ * This creates a combination of utility classes you can use to style native HTML elements using IDS.
+ *
+ * @see https://design.wm.iress.com/?path=/docs/styling-props-reference--docs
+ *
+ * @param stylingProps Supporting properties for styling.
+ * @returns {string} A string of classes that can be applied to an element.
+ */
+export declare const iressCss: (stylingProps: IressCSSProps) => string;
+type StyledProps<C extends ElementType> = ComponentProps<C> & IressCSSProps;
+/**
+ * This creates a component (similar to a styled component) that can be used to apply styling to native HTML elements using IDS.
+ *
+ * @see https://design.wm.iress.com/?path=/docs/styling-props-reference--docs
+ *
+ * @param element The native HTML element to be styled, e.g. 'div', 'span', etc. Can also be a custom component, e.g. 'Link'.
+ * @returns {FC<StyledProps<T>>} A functional component that accepts styling props and renders the specified element with the applied styles.
+ */
+export declare const iressStyled: <T extends ElementType>(element: T) => FC<StyledProps<T>>;
+export {};

package/dist/src/helpers/styling/mapGutterToGap.d.ts

@@ -0,0 +1,3 @@
+import { IressCSSProps, ResponsiveSizing } from '../../interfaces';
+import { PaddingSizes } from '../../types';
+export declare const mapGutterToGap: (gutter?: ResponsiveSizing<PaddingSizes> | PaddingSizes) => IressCSSProps["p"];

package/dist/src/helpers/transition/getTransitionDuration.d.ts

@@ -0,0 +1 @@
+export declare const getTransitionDuration: (element?: HTMLElement | null, multiplier?: number, fallback?: number) => number;

package/dist/src/helpers/transition/timeStringToNumber.d.ts

@@ -0,0 +1 @@
+export declare const timeStringToNumber: (timeStr: string) => number;

package/dist/src/helpers/utility/idsLogger.d.ts

@@ -0,0 +1,3 @@
+import { LoggerLevels } from '../../enums';
+import { LoggerLevelsUnion } from '../../types';
+export declare const idsLogger: (msg: string, level?: LoggerLevels | LoggerLevelsUnion) => void;

package/dist/src/helpers/utility/propagateTestid.d.ts

@@ -0,0 +1 @@
+export declare const propagateTestid: (dataTestid: string | undefined, id: string, separator?: string) => string | undefined;

package/dist/src/helpers/utility/spreadUnlessUndefined.d.ts

@@ -0,0 +1,3 @@
+export declare const spreadUnlessUndefined: <T extends object>(defaults: T, overrides: Partial<T>) => T & {
+    [k: string]: unknown;
+};

package/dist/src/hooks/index.d.ts

@@ -0,0 +1,4 @@
+export * from './useBreakpoint';
+export * from './useControlledState';
+export * from './useIdIfNeeded';
+export * from './useResponsiveProps';

package/dist/src/hooks/useAriaRelationship.d.ts

@@ -0,0 +1,11 @@
+export interface AriaRelationshipProps<TController extends HTMLElement = HTMLElement> {
+    setController: (ref: TController | null) => void;
+    setControlViaRef: <TControl extends HTMLElement = HTMLElement>(controlId: string) => (element: TControl | null) => void;
+}
+/**
+ * Adjusts the aria attribute of an element,
+ * to help screen readers understand the relationship between elements and their controller.
+ *
+ * @param attribute - The aria attribute to adjust.
+ */
+export declare const useAriaRelationship: <TController extends HTMLElement = HTMLElement>(attribute: "aria-controls" | "aria-owns") => AriaRelationshipProps<TController>;

package/dist/src/hooks/useBreakpoint.d.ts

@@ -0,0 +1,11 @@
+import { BreakpointDetail } from '../interfaces';
+import { Breakpoints } from '../types';
+interface BreakpointResult {
+    breakpoint: Breakpoints;
+    detail: BreakpointDetail;
+}
+/**
+ * Retrieve the current breakpoint and its detail based on the window size
+ */
+export declare const useBreakpoint: () => BreakpointResult;
+export {};

package/dist/src/hooks/useControlledState.d.ts

@@ -0,0 +1,25 @@
+import { FormControlValue } from '../types';
+export interface ControlledStateProps<T = FormControlValue, TMultiple extends boolean = false> {
+    component: string;
+    defaultValue?: ControlledValue<T, TMultiple>;
+    multiple?: TMultiple;
+    onChange?: (selected?: ControlledValue<T, TMultiple>) => void;
+    propName?: string;
+    value?: ControlledValue<T, TMultiple>;
+}
+export interface ControlledStateHook<T = FormControlValue, TMultiple extends boolean = false> {
+    value: ControlledValue<T, TMultiple> | undefined;
+    setValue: (value?: ControlledValue<T, TMultiple>) => void;
+    toggleValue: (value?: T, flag?: boolean) => void;
+    isControlled: boolean;
+}
+export type ControlledValue<T = FormControlValue, TMultiple extends boolean = false> = TMultiple extends true ? T[] : T;
+/**
+ * Allows you to return a controlled state or uncontrolled state, depending on the props passed.
+ * It can also deal with the cases when an array of values is required.
+ *
+ * If `TMultiple` is set to `true`, the value will be an array of values.
+ *
+ * @param {ControlledValueProps<T>} props Allows you to set the initial selected value, the onChange callback, and whether multiple values are allowed (array).
+ */
+export declare const useControlledState: <T = FormControlValue, TMultiple extends boolean = false>({ component, defaultValue, multiple, onChange, propName, value, }: ControlledStateProps<T, TMultiple>) => ControlledStateHook<T, TMultiple>;

package/dist/src/hooks/useIdIfNeeded.d.ts

@@ -0,0 +1,2 @@
+import { IressUnstyledProps } from '../types';
+export declare const useIdIfNeeded: <T extends IressUnstyledProps>({ id: propId }?: T, prefix?: string) => string;

package/dist/src/hooks/useResponsiveProps.d.ts

@@ -0,0 +1,12 @@
+import { Breakpoints, ResponsiveProp } from '../types';
+/**
+ * Allows you to pluck a value from an object with breakpoint keys.
+ * Note: Where possible, we recommend using media queries in CSS instead of JS, as that will reduce the load for the user. However, sometimes it's necessary to change a prop based on the user's breakpoint, hence why this hook is provided.
+ * @param {ResponsiveProp<T>} values A set of values, separated by breakpoint and ready for plucking.
+ * @param {boolean} inheritPrevious Whether to inherit the previous breakpoint value, if none was found for the current one.
+ * @returns { breakpoint: Breakpoints; value?: T | null } The current user's breakpoint, along with a matching value if one was found.
+ */
+export declare const useResponsiveProps: <T>(prop?: ResponsiveProp<T>, inheritPrevious?: boolean) => {
+    breakpoint: Breakpoints;
+    value?: T;
+};