@kaizen/components 1.26.0 → 1.28.0

package/dist/esm/dts/DatePicker/types.d.ts

@@ -0,0 +1,11 @@
+import { FieldMessageStatus } from "../FieldMessage";
+export type ValidationResponse = {
+    date: Date | undefined;
+    inputValue: string | undefined;
+    status: FieldMessageStatus | undefined;
+    validationMessage: string | undefined;
+    isDisabled: boolean;
+    isInvalid: boolean;
+    isEmpty: boolean;
+    isValidDate: boolean;
+};

package/dist/esm/dts/DatePicker/utils/getLocale.d.ts

@@ -0,0 +1,3 @@
+import { StringSuggestions } from "../../types/StringSuggestions";
+export type DatePickerSupportedLocales = StringSuggestions<"en-US" | "en-AU">;
+export declare const getLocale: (locale: DatePickerSupportedLocales) => Locale;

package/dist/esm/dts/DatePicker/utils/validateDate.d.ts

@@ -0,0 +1,12 @@
+import { DisabledDays } from "../../Calendar";
+import { ValidationResponse } from "../types";
+export type ValidateDateArgs = {
+    date: Date | undefined;
+    inputValue: string | undefined;
+    disabledDays?: DisabledDays;
+};
+export type ValidateDateResponse = {
+    validationResponse: ValidationResponse;
+    newDate: Date | undefined;
+};
+export declare const validateDate: ({ date, inputValue, disabledDays, }: ValidateDateArgs) => ValidateDateResponse;

package/dist/esm/dts/DateRangePicker/DateRangePicker.d.ts

@@ -0,0 +1,44 @@
+import { RefObject } from "react";
+import { DateRange } from "react-day-picker";
+import { DisabledDayMatchers } from "../Calendar";
+import { LegacyCalendarRangeProps } from "../Calendar/LegacyCalendarRange";
+export type DateRangePickerProps = {
+    id?: string;
+    classNameOverride?: string;
+    labelText: string;
+    isDisabled?: boolean;
+    buttonRef?: RefObject<HTMLButtonElement>;
+    description?: string;
+    /**
+     * Selected date range which is being updated in handleDayClick and checked
+     * if within range/not disabled and then passed back to the client to update
+     * the state.
+     */
+    selectedDateRange?: DateRange;
+    /**
+     * String that is formatted by the client with our helper formatDateRangeValue
+     * and then passed into the button to display the readable range.
+     */
+    value?: string;
+    /**
+     * Accepts a DayOfWeek value to start the week on that day. By default,
+     * it's set to Monday.
+     */
+    weekStartsOn?: LegacyCalendarRangeProps["weekStartsOn"];
+    /**
+     * Accepts a date to display that month on first render.
+     */
+    defaultMonth?: LegacyCalendarRangeProps["defaultMonth"];
+    /**
+     * Event passed from consumer to handle the date on change.
+     */
+    onChange: (dateRange: DateRange) => void;
+} & DisabledDayMatchers;
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082094237/Date+Range+Picker Guidance} |
+ * {@link https://cultureamp.design/storybook/?path=/docs/components-date-controls-daterangepicker--docs Storybook}
+ */
+export declare const DateRangePicker: {
+    ({ id: propsId, buttonRef, description: _description, labelText, isDisabled, classNameOverride, disabledDates, disabledDaysOfWeek, disabledRange, disabledBeforeAfter, disabledBefore, disabledAfter, weekStartsOn, defaultMonth, selectedDateRange, value, onChange, ...inputProps }: DateRangePickerProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/DateRangePicker/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./DateRangePicker";
+export * from "./utils/formatDateRangeValue";

package/dist/esm/dts/DateRangePicker/utils/formatDateRangeValue.d.ts

@@ -0,0 +1,2 @@
+import { DateRange } from "../../Calendar";
+export declare const formatDateRangeValue: (dateRange: DateRange) => string;

package/dist/esm/dts/FilterDatePicker/hooks/useDateInputHandlers.d.ts

@@ -1,5 +1,5 @@
-import { DateInputProps } from "@kaizen/date-picker";
-import { DisabledDays } from "../../types/DatePicker";
+import { DisabledDays } from "../../Calendar";
+import { DateInputProps } from "../../DateInput";
 type UseDateInputHandlersArgs = {
     locale: Locale;
     disabledDays?: DisabledDays;

package/dist/esm/dts/FilterDatePicker/hooks/useDateValidation.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { DisabledDays } from "../../types/DatePicker";
+import { DisabledDays } from "../../Calendar";
 import { ValidationMessage, DateValidationResponse } from "../types";
 import { validateDate } from "../utils/validateDate";
 export type UseDateValidationArgs = {

package/dist/esm/dts/FilterDatePicker/subcomponents/DateInputField/DateInputField.d.ts

@@ -1,6 +1,5 @@
 import React from "react";
-import { DateInputProps } from "@kaizen/date-picker";
-import { DateInputDescriptionProps } from "../../../FilterDateRangePicker/subcomponents/DateInputDescription";
+import { DateInputProps, DateInputDescriptionProps } from "../../../DateInput";
 import { ValidationMessage } from "../../types";
 export type DateInputFieldProps = {
     id: string;

package/dist/esm/dts/FilterDatePicker/subcomponents/FilterDatePickerField/FilterDatePickerField.d.ts

@@ -1,16 +1,16 @@
 import { HTMLAttributes } from "react";
-import { CalendarSingleProps } from "@kaizen/date-picker";
+import { CalendarSingleProps, DisabledDays } from "../../../Calendar";
+import { DateInputDescriptionProps } from "../../../DateInput";
+import { DatePickerSupportedLocales } from "../../../DatePicker/utils/getLocale";
 import { FilterProps } from "../../../Filter";
-import { DateInputDescriptionProps } from "../../../FilterDateRangePicker/subcomponents/DateInputDescription";
 import { DataAttributes } from "../../../types/DataAttributes";
-import { DisabledDays, FilterDateSupportedLocales } from "../../../types/DatePicker";
 import { OverrideClassName } from "../../../types/OverrideClassName";
 import { DateValidationResponse, ValidationMessage } from "../../types";
 import { DateInputFieldProps } from "../DateInputField";
 type FilterInputProps<InputProps> = Omit<Partial<InputProps>, "value"> & DataAttributes;
 export type FilterDatePickerFieldProps = {
     id?: string;
-    locale: FilterDateSupportedLocales;
+    locale: DatePickerSupportedLocales;
     /**
      * Sets first displayed month to month of provided date if there isn't a date set.
      */

package/dist/esm/dts/FilterDatePicker/types.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { FieldMessageStatus } from "@kaizen/draft-form";
+import { FieldMessageStatus } from "../FieldMessage";
 export type DateValidationResponse = {
     date: Date | undefined;
     inputValue: string | undefined;

package/dist/esm/dts/FilterDatePicker/utils/transformDateToInputValue.d.ts

@@ -1,2 +1,2 @@
-import { DisabledDays } from "@kaizen/date-picker";
+import { DisabledDays } from "../../Calendar";
 export declare const transformDateToInputValue: (date: Date | undefined, disabledDays: DisabledDays, locale: Locale) => string;

package/dist/esm/dts/FilterDatePicker/utils/validateDate.d.ts

@@ -1,4 +1,4 @@
-import { ValidateDateArgs } from "@kaizen/date-picker/src/utils/validateDate";
+import { ValidateDateArgs } from "../../DatePicker/utils/validateDate";
 import { DateValidationResponse } from "../types";
 export type ValidateDateResponse = {
     validationResponse: DateValidationResponse;

package/dist/esm/dts/FilterDateRangePicker/subcomponents/DateRangeInputField/DateRangeInputField.d.ts

@@ -1,7 +1,6 @@
 import React, { HTMLAttributes } from "react";
-import { DateInputProps } from "@kaizen/date-picker/src/_subcomponents/DateInput";
+import { DateInputDescriptionProps, DateInputProps } from "../../../DateInput";
 import { OverrideClassName } from "../../../types/OverrideClassName";
-import { DateInputDescriptionProps } from "../DateInputDescription";
 import { DateRangeValidationMessageProps } from "../DateRangeValidationMessage";
 export type DateRangeInputFieldProps = {
     id: string;

package/dist/esm/dts/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/FilterDateRangePickerField.d.ts

@@ -1,8 +1,8 @@
 import { HTMLAttributes } from "react";
-import { CalendarRangeProps } from "@kaizen/date-picker/src/_subcomponents/Calendar";
+import { CalendarRangeProps, DateRange, DisabledDays } from "../../../Calendar";
+import { DatePickerSupportedLocales } from "../../../DatePicker/utils/getLocale";
 import { DateValidationResponse } from "../../../FilterDatePicker";
 import { DataAttributes } from "../../../types/DataAttributes";
-import { DateRange, DisabledDays, FilterDateSupportedLocales } from "../../../types/DatePicker";
 import { OverrideClassName } from "../../../types/OverrideClassName";
 import { DateRangeInputFieldProps } from "../DateRangeInputField";
 import { DateRangeFieldValidationMessage } from "./types";
@@ -12,7 +12,7 @@ type FilterInputProps<InputProps> = Omit<Partial<InputProps>, "value"> & DataAtt
 export type FilterDateRangePickerFieldProps = {
     id: string;
     label: string;
-    locale: FilterDateSupportedLocales;
+    locale: DatePickerSupportedLocales;
     /**
      * Sets first displayed month to month of provided date if there isn't a date set.
      */

package/dist/esm/dts/FilterDateRangePicker/utils/isCompleteDateRange.d.ts

@@ -1,4 +1,4 @@
-import { DateRange } from "../../types/DatePicker";
+import { DateRange } from "../../Calendar";
 export declare const isCompleteDateRange: (dateRange: DateRange | undefined) => dateRange is {
     from: Date;
     to: Date;

package/dist/esm/dts/Modal/ConfirmationModal/ConfirmationModal.d.ts

@@ -0,0 +1,38 @@
+import React, { HTMLAttributes } from "react";
+export type ConfirmationModalProps = {
+    isOpen: boolean;
+    unpadded?: boolean;
+    /**
+     * To display the Prominent variation of the modal types
+     */
+    isProminent?: boolean;
+    /**
+     * Defines the modal type or mood
+     */
+    mood: Mood;
+    title: string;
+    onConfirm?: () => void;
+    onDismiss: () => void;
+    onAfterLeave?: () => void;
+    confirmLabel?: string;
+    dismissLabel?: string;
+    confirmWorking?: {
+        label: string;
+        labelHidden?: boolean;
+    };
+    /**
+     * @deprecated Please use data-testid
+     */
+    automationId?: string;
+    children: React.ReactNode;
+} & HTMLAttributes<HTMLDivElement>;
+type Mood = "positive" | "informative" | "negative" | "cautionary" | "assertive";
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082093114/Modal Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-modals-confirmationmodal--docs Storybook}
+ */
+export declare const ConfirmationModal: {
+    ({ isOpen, isProminent, unpadded, mood, title, onConfirm, onAfterLeave, confirmLabel, dismissLabel, confirmWorking, onDismiss: propsOnDismiss, children, ...props }: ConfirmationModalProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/esm/dts/Modal/ConfirmationModal/index.d.ts

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

package/dist/esm/dts/Modal/ContextModal/ContextModal.d.ts

@@ -0,0 +1,40 @@
+import React, { HTMLAttributes } from "react";
+export type ContextModalSecondaryActionProps = {
+    secondaryLabel: string;
+    onSecondaryAction: () => void;
+} | {
+    secondaryLabel?: undefined;
+};
+export type ContextModalProps = Readonly<{
+    isOpen: boolean;
+    unpadded?: boolean;
+    /**
+     * Defines the orientation layout of the image and content
+     */
+    layout?: "portrait" | "landscape";
+    title: string;
+    onConfirm?: () => void;
+    onDismiss: () => void;
+    onAfterLeave?: () => void;
+    confirmLabel?: string;
+    confirmWorking?: {
+        label: string;
+        labelHidden?: boolean;
+    };
+    /**
+     * @deprecated use data-testid instead
+     */
+    automationId?: string;
+    renderBackground?: () => React.ReactNode;
+    image?: React.ReactNode;
+    children: React.ReactNode;
+    contentHeader?: React.ReactNode;
+} & ContextModalSecondaryActionProps & HTMLAttributes<HTMLDivElement>>;
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082093114/Modal Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-modals--contextmodal--docs Storybook}
+ */
+export declare const ContextModal: {
+    ({ isOpen, unpadded, layout, title, onConfirm, onAfterLeave, confirmLabel, confirmWorking, renderBackground, children, contentHeader, image, ...props }: ContextModalProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/Modal/ContextModal/index.d.ts

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

package/dist/esm/dts/Modal/GenericModal/GenericModal.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+export type GenericModalProps = {
+    id?: string;
+    isOpen: boolean;
+    children: React.ReactNode;
+    focusLockDisabled?: boolean;
+    onEscapeKeyup?: (event: KeyboardEvent) => void;
+    onOutsideModalClick?: (event: React.MouseEvent) => void;
+    onAfterLeave?: () => void;
+};
+export declare const GenericModal: {
+    ({ id: propsId, children, isOpen, focusLockDisabled, onEscapeKeyup, onOutsideModalClick, onAfterLeave: propsOnAfterLeave, }: GenericModalProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/Modal/GenericModal/context/ModalContext.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export type ModalContextType = {
+    labelledByID: string;
+    describedByID: string;
+};
+export declare const ModalContext: import("react").Context<ModalContextType>;

package/dist/esm/dts/Modal/GenericModal/index.d.ts

@@ -0,0 +1,7 @@
+export * from "./GenericModal";
+export * from "./context/ModalContext";
+export * from "./subcomponents/ModalAccessibleDescription";
+export * from "./subcomponents/ModalFooter";
+export * from "./subcomponents/ModalHeader";
+export * from "./subcomponents/ModalAccessibleLabel";
+export * from "./subcomponents/ModalBody";

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalAccessibleDescription/ModalAccessibleDescription.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+export type ModalAccessibleDescriptionProps = {
+    children: React.ReactNode;
+};
+export declare const ModalAccessibleDescription: {
+    ({ children, }: ModalAccessibleDescriptionProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalAccessibleDescription/index.d.ts

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

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalAccessibleLabel/ModalAccessibleLabel.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export type ModalAccessibleLabelProps = {
+    children: React.ReactNode;
+    isProminent?: boolean;
+};
+export declare const ModalAccessibleLabel: {
+    ({ children, isProminent, }: ModalAccessibleLabelProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalAccessibleLabel/index.d.ts

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

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalBody/ModalBody.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export type ModalBodyProps = {
+    inputEdit?: boolean;
+    children: React.ReactNode;
+};
+export declare const ModalBody: {
+    ({ inputEdit, children, }: ModalBodyProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalBody/index.d.ts

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

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.d.ts

@@ -0,0 +1,26 @@
+import { HTMLAttributes } from "react";
+import { ButtonProps } from "../../../../Button";
+type ActionsVariantProps = "context" | "inputEdit";
+export type ModalFooterProps = {
+    /**
+     * We have a special case for the InformationModal when it has an image.
+     * Since this modal may have an image on the right side the actions might look disconected from the content.
+     * So for this instance we need to flip the order of the actions so that the primary
+     * action is anchored to the left edge of the modal.
+     * For this rare instance added the variant prop as optional to update the order of action buttons.
+     */
+    variant?: ActionsVariantProps;
+    unpadded?: boolean;
+    actions: ButtonProps[];
+    appearance?: "primary" | "destructive";
+    /**
+     * @deprecated Please use data-testid
+     */
+    automationId?: string;
+    alignStart?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const ModalFooter: {
+    ({ unpadded, actions, appearance, alignStart, variant, ...props }: ModalFooterProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalFooter/index.d.ts

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

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalHeader/ModalHeader.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+export type ModalHeaderProps = {
+    unpadded?: boolean;
+    reversed?: boolean;
+    onDismiss?: (evt: React.MouseEvent) => void;
+    children: React.ReactNode;
+};
+export declare const ModalHeader: {
+    ({ reversed, onDismiss, children, }: ModalHeaderProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/Modal/GenericModal/subcomponents/ModalHeader/index.d.ts

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

package/dist/esm/dts/Modal/InputEditModal/InputEditModal.d.ts

@@ -0,0 +1,32 @@
+import React, { HTMLAttributes } from "react";
+export type InputEditModalProps = {
+    isOpen: boolean;
+    unpadded?: boolean;
+    mood: "positive" | "destructive";
+    title: string;
+    onSubmit: () => void;
+    onSecondaryAction?: () => void;
+    onDismiss: () => void;
+    onAfterLeave?: () => void;
+    localeDirection?: "rtl" | "ltr";
+    submitLabel?: string;
+    dismissLabel?: string;
+    secondaryLabel?: string;
+    /**
+     * @deprecated Please use data-testid
+     */
+    automationId?: string;
+    children: React.ReactNode;
+    submitWorking?: {
+        label: string;
+        labelHidden?: boolean;
+    };
+} & HTMLAttributes<HTMLDivElement>;
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082093114/Modal#Input-Edit-Modal Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-modals-inputeditmodal--docs Storybook}
+ */
+export declare const InputEditModal: {
+    ({ isOpen, mood, title, onSubmit, onSecondaryAction, onAfterLeave, localeDirection, submitLabel, dismissLabel, secondaryLabel, submitWorking, children, unpadded, onDismiss: propsOnDismiss, ...props }: InputEditModalProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/Modal/InputEditModal/index.d.ts

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

package/dist/esm/dts/Modal/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./ConfirmationModal";
+export * from "./ContextModal";
+export * from "./GenericModal";
+export * from "./InputEditModal";

package/dist/esm/dts/Modal/util/console.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @deprecated Do not use ever again
+ */
+export declare const warn: (message: string) => void;
+export declare const singleLine: (message: string) => string;

package/dist/esm/dts/Radio/Radio/Radio.d.ts

@@ -1,12 +1,12 @@
 import { InputHTMLAttributes } from "react";
 import { OverrideClassName } from "../../types/OverrideClassName";
-export type RadioProps = OverrideClassName<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "checked">> & {
-    /**
-     * This needs to be enforced to ensure the Radio always gets an id to match a label when composed.
-     */
+export type RadioProps = OverrideClassName<Omit<InputHTMLAttributes<HTMLInputElement>, "id" | "name" | "value" | "checked" | "type">> & {
+    /** Required to ensure the Radio always gets an ID to match a label when composed. */
     id: string;
+    /** Unique identifier for the group this Radio belongs to. Required for keyboard navigation of the group. See also [Defining a radio group](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio#defining_a_radio_group) on MDN. E.g. the question ID for which this is one possible answer to. */
     name: string;
-    value: string;
+    /** The value for this form field when this radio button is selected. */
+    value?: string | readonly string[] | number;
     selectedStatus?: boolean;
     reversed?: boolean;
 };

package/dist/esm/dts/TextArea/TextArea.d.ts

@@ -0,0 +1,12 @@
+import React, { TextareaHTMLAttributes } from "react";
+import { OverrideClassName } from "../types/OverrideClassName";
+export type TextAreaProps = {
+    textAreaRef?: React.RefObject<HTMLTextAreaElement>;
+    status?: "default" | "error" | "caution";
+    autogrow?: boolean;
+    reversed?: boolean;
+} & OverrideClassName<TextareaHTMLAttributes<HTMLTextAreaElement>>;
+export declare const TextArea: {
+    ({ textAreaRef: propsTextAreaRef, status, autogrow, reversed, rows, defaultValue, value, disabled, onChange: propsOnChange, ...restProps }: TextAreaProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/TextArea/index.d.ts

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

package/dist/esm/dts/TextAreaField/TextAreaField.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import { TextAreaProps } from "../TextArea";
+export type TextAreaFieldProps = {
+    labelText: string | React.ReactNode;
+    inline?: boolean;
+    validationMessage?: string | React.ReactNode;
+    description?: string | React.ReactNode;
+    variant?: "default" | "prominent";
+} & TextAreaProps;
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081895966/Text+Area+Field Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-text-area-field--docs Storybook}
+ */
+export declare const TextAreaField: {
+    ({ labelText, inline, validationMessage, description, variant, id: propsId, reversed, status, disabled, ...restProps }: TextAreaFieldProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/TextAreaField/index.d.ts

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

package/dist/esm/dts/TextField/TextField.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+import { InputProps } from "../Input";
+type OmittedInputProps = "startIconAdornment" | "endIconAdornment" | "ariaDescribedBy" | "ariaLabel";
+export interface TextFieldProps extends Omit<InputProps, OmittedInputProps> {
+    /**
+     * A short example of input text. For context or additional information use the `description` prop
+     */
+    labelText: React.ReactNode;
+    inline?: boolean;
+    icon?: JSX.Element;
+    /**
+     * A descriptive message for `error` or `caution` states
+     */
+    validationMessage?: string | React.ReactNode;
+    /**
+     * A description that provides context for the text field
+     */
+    description?: string | React.ReactNode;
+}
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081928705/Text+Field Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-text-field--docs Storybook}
+ */
+export declare const TextField: {
+    ({ id: propsId, labelText, inline, icon, validationMessage, description, status, reversed, disabled, ...restProps }: TextFieldProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/esm/dts/TextField/index.d.ts

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

package/dist/esm/dts/VisuallyHidden/VisuallyHidden.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode, HTMLAttributes } from "react";
+import { OverrideClassName } from "../types/OverrideClassName";
+export type VisuallyHiddenProps = {
+    children: ReactNode;
+} & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
+export declare const VisuallyHidden: {
+    ({ children, classNameOverride, ...restProps }: VisuallyHiddenProps): JSX.Element;
+    displayName: string;
+};

package/dist/esm/dts/VisuallyHidden/index.d.ts

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

package/dist/esm/dts/index.d.ts

@@ -1,4 +1,3 @@
-export * from "./types/DatePicker";
 export * from "./Avatar";
 export * from "./AvatarGroup";
 export * from "./Badge";
@@ -6,10 +5,14 @@ export * from "./Brand";
 export * from "./BrandMoment";
 export * from "./Button";
 export * from "./ButtonGroup";
+export * from "./Calendar";
 export * from "./Card";
 export * from "./Checkbox";
 export * from "./ClearButton";
 export * from "./Collapsible";
+export * from "./DateInput";
+export * from "./DatePicker";
+export * from "./DateRangePicker";
 export * from "./Divider";
 export * from "./EmptyState";
 export * from "./ErrorPage";
@@ -28,9 +31,13 @@ export * from "./Input";
 export * from "./KaizenProvider";
 export * from "./Label";
 export * from "./LabelledMessage";
+export * from "./Modal";
 export * from "./Notification";
 export * from "./Radio";
 export * from "./SearchField";
 export * from "./Slider";
 export * from "./Text";
 export * from "./Workflow";
+export * from "./TextField";
+export * from "./TextArea";
+export * from "./TextAreaField";

package/dist/esm/dts/utils/useMediaQueries.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode } from "react";
+type Props = {
+    [key: string]: string;
+};
+type GenericChildrenType = {
+    children?: ReactNode;
+};
+export declare const subtractOnePixel: (breakpoint: string) => string;
+export declare const useMediaQueries: (propQueries?: Props) => {
+    queries: {
+        [key: string]: boolean;
+        isSmall: boolean;
+        isMedium: boolean;
+        isLarge: boolean;
+        isMediumOrSmaller: boolean;
+        isMediumOrLarger: boolean;
+    };
+    components: {
+        [key: string]: (props: GenericChildrenType) => JSX.Element;
+        SmallOnly: (props: GenericChildrenType) => JSX.Element;
+        MediumOnly: (props: GenericChildrenType) => JSX.Element;
+        LargeOnly: (props: GenericChildrenType) => JSX.Element;
+        MediumOrSmaller: (props: GenericChildrenType) => JSX.Element;
+        MediumOrLarger: (props: GenericChildrenType) => JSX.Element;
+    };
+};
+export {};