@kaizen/components 1.27.0 → 1.29.0

package/dist/cjs/dts/Select/Select.d.ts

@@ -0,0 +1,151 @@
+import React from "react";
+import { Props as ReactSelectProps } from "react-select";
+import { AsyncProps as ReactAsyncSelectProps } from "react-select/async";
+export type SelectProps = {
+    /**
+     * The secondary variant is a more subdued variant that takes up as little space as possible
+     * `variant="secondary" reversed="false" is not implemented and will throw a "not implemented" error
+     * @default "default"
+     */
+    variant?: "default" | "secondary" | "secondary-small";
+    status?: "default" | "error";
+    label?: React.ReactNode;
+    validationMessage?: React.ReactNode;
+    description?: React.ReactNode;
+    /**
+     * Use a reversed colour scheme
+     * @default false
+     */
+    reversed?: boolean;
+    /**
+     * Whether the "select control" (the button you click to open the menu) width fills the
+     * full width of  the container or is as wide as the selected option text.
+     * Note that the control text will ellipsize if it is wider than the parent container.
+     * @default false
+     */
+    fullWidth?: boolean;
+} & ReactSelectProps<any, boolean>;
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896474/Select Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-select--docs Storybook}
+ */
+export declare const Select: React.ForwardRefExoticComponent<{
+    /**
+     * The secondary variant is a more subdued variant that takes up as little space as possible
+     * `variant="secondary" reversed="false" is not implemented and will throw a "not implemented" error
+     * @default "default"
+     */
+    variant?: "default" | "secondary" | "secondary-small" | undefined;
+    status?: "error" | "default" | undefined;
+    label?: React.ReactNode;
+    validationMessage?: React.ReactNode;
+    description?: React.ReactNode;
+    /**
+     * Use a reversed colour scheme
+     * @default false
+     */
+    reversed?: boolean | undefined;
+    /**
+     * Whether the "select control" (the button you click to open the menu) width fills the
+     * full width of  the container or is as wide as the selected option text.
+     * Note that the control text will ellipsize if it is wider than the parent container.
+     * @default false
+     */
+    fullWidth?: boolean | undefined;
+} & Omit<Pick<import("react-select/dist/declarations/src/Select").Props<any, boolean, import("react-select").GroupBase<any>>, "className" | "id" | "name" | "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "form" | "autoFocus" | "value" | "required" | "inputValue" | "onInputChange" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme"> & {
+    tabIndex?: number | undefined;
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    placeholder?: React.ReactNode;
+    classNames?: import("react-select").ClassNamesConfig<any, boolean, import("react-select").GroupBase<any>> | undefined;
+    styles?: import("react-select").StylesConfig<any, boolean, import("react-select").GroupBase<any>> | undefined;
+    components?: Partial<import("react-select/dist/declarations/src/components").SelectComponents<any, boolean, import("react-select").GroupBase<any>>> | undefined;
+    options?: import("react-select").OptionsOrGroups<any, import("react-select").GroupBase<any>> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: import("react-select/dist/declarations/src/filters").FilterOptionOption<any>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: import("react-select").GroupBase<any>) => React.ReactNode) | undefined;
+    getOptionLabel?: import("react-select").GetOptionLabel<any> | undefined;
+    getOptionValue?: import("react-select").GetOptionValue<any> | undefined;
+    isOptionDisabled?: ((option: any, selectValue: import("react-select").Options<any>) => boolean) | undefined;
+    isMulti?: boolean | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: import("react-select").MenuPlacement | undefined;
+    menuPosition?: import("react-select").MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    pageSize?: number | undefined;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    tabSelectsValue?: boolean | undefined;
+    unstyled?: boolean | undefined;
+} & {}, "onChange" | "value" | "inputValue" | "onInputChange" | "menuIsOpen" | "onMenuOpen" | "onMenuClose"> & Partial<Pick<import("react-select/dist/declarations/src/Select").Props<any, boolean, import("react-select").GroupBase<any>>, "className" | "id" | "name" | "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "form" | "autoFocus" | "value" | "required" | "inputValue" | "onInputChange" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme"> & {
+    tabIndex?: number | undefined;
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    placeholder?: React.ReactNode;
+    classNames?: import("react-select").ClassNamesConfig<any, boolean, import("react-select").GroupBase<any>> | undefined;
+    styles?: import("react-select").StylesConfig<any, boolean, import("react-select").GroupBase<any>> | undefined;
+    components?: Partial<import("react-select/dist/declarations/src/components").SelectComponents<any, boolean, import("react-select").GroupBase<any>>> | undefined;
+    options?: import("react-select").OptionsOrGroups<any, import("react-select").GroupBase<any>> | undefined;
+    isDisabled?: boolean | undefined;
+    isLoading?: boolean | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: import("react-select/dist/declarations/src/filters").FilterOptionOption<any>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: import("react-select").GroupBase<any>) => React.ReactNode) | undefined;
+    getOptionLabel?: import("react-select").GetOptionLabel<any> | undefined;
+    getOptionValue?: import("react-select").GetOptionValue<any> | undefined;
+    isOptionDisabled?: ((option: any, selectValue: import("react-select").Options<any>) => boolean) | undefined;
+    isMulti?: boolean | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => React.ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: import("react-select").MenuPlacement | undefined;
+    menuPosition?: import("react-select").MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => React.ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    pageSize?: number | undefined;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    tabSelectsValue?: boolean | undefined;
+    unstyled?: boolean | undefined;
+} & {}> & import("react-select/dist/declarations/src/useStateManager").StateManagerAdditionalProps<any> & React.RefAttributes<any>>;
+interface AsyncProps extends ReactAsyncSelectProps<any, boolean, any>, ReactSelectProps<any, boolean, any> {
+}
+export declare const AsyncSelect: React.ForwardRefExoticComponent<AsyncProps & React.RefAttributes<any>>;
+export {};

package/dist/cjs/dts/Select/index.d.ts

@@ -0,0 +1,2 @@
+export type { OnChangeValue as SelectValueType } from "react-select";
+export * from "./Select";

package/dist/cjs/dts/Skirt/Skirt.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { ContentProps } from "../Content";
+type Variant = "default" | "education";
+export type SkirtProps = {
+    children: React.ReactNode;
+    variant?: Variant;
+    titleBlockHasNavigation?: boolean;
+} & ContentProps;
+export declare const Skirt: {
+    ({ children, variant, titleBlockHasNavigation, classNameOverride, ...restProps }: SkirtProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/cjs/dts/Skirt/index.d.ts

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

package/dist/cjs/dts/Skirt/subcomponents/SkirtCard/SkirtCard.d.ts

@@ -0,0 +1,6 @@
+import { CardProps } from "../../../Card";
+export type SkirtCardProps = CardProps;
+export declare const SkirtCard: {
+    (props: SkirtCardProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/Skirt/subcomponents/SkirtCard/index.d.ts

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

package/dist/cjs/dts/SplitButton/SplitButton.d.ts

@@ -0,0 +1,45 @@
+import React, { HTMLAttributes } from "react";
+import { DataAttributes } from "../types/DataAttributes";
+import { OverrideClassName } from "../types/OverrideClassName";
+import { ActionButtonProps } from "./subcomponents/ActionButton";
+import { DropdownButtonProps } from "./subcomponents/DropdownButton";
+export type SplitButtonProps = {
+    /**
+     * Props for primary action button (left).
+     * Allows all native button/anchor attributes.
+     */
+    actionButtonProps: ActionButtonProps & DataAttributes;
+    /**
+     * Props for dropdown menu button (right).
+     * Allows all native button/anchor attributes.
+     */
+    dropdownButtonProps?: DropdownButtonProps & DataAttributes;
+    /**
+     * Suggested components - MenuList > MenuItem
+     */
+    dropdownContent: React.ReactNode;
+    /**
+     * Sets the dropdown menu to be open on initial render.
+     */
+    isDropdownInitOpen?: boolean;
+    /**
+     * Disables both the primary action button and dropdown button.
+     */
+    disabled?: boolean;
+    /**
+     * Use the `reversed` styles.
+     */
+    isReversed?: boolean;
+    /**
+     * Text direction.
+     */
+    dir?: "ltr" | "rtl";
+} & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896196/Split+Button Guidance} |
+ * {@link https://cultureamp.design/storybook/?path=/docs/components-splitbutton--docs Storybook}
+ */
+export declare const SplitButton: {
+    ({ actionButtonProps, dropdownButtonProps, dropdownContent, isDropdownInitOpen, disabled, isReversed, dir, classNameOverride, ...restProps }: SplitButtonProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/SplitButton/index.d.ts

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

package/dist/cjs/dts/SplitButton/subcomponents/ActionButton/ActionButton.d.ts

@@ -0,0 +1,6 @@
+import { BaseButtonProps } from "../BaseButton";
+export type ActionButtonProps = Omit<BaseButtonProps, "icon">;
+export declare const ActionButton: {
+    ({ classNameOverride, ...restProps }: ActionButtonProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/SplitButton/subcomponents/ActionButton/index.d.ts

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

package/dist/cjs/dts/SplitButton/subcomponents/BaseButton/BaseButton.d.ts

@@ -0,0 +1,15 @@
+import React, { AnchorHTMLAttributes, ButtonHTMLAttributes } from "react";
+import { OverrideClassName } from "../../../types/OverrideClassName";
+type AnchorAttributes = AnchorHTMLAttributes<HTMLAnchorElement>;
+type ButtonAttributes = ButtonHTMLAttributes<HTMLButtonElement>;
+type AnchorButtonAttributes = AnchorAttributes & ButtonAttributes;
+export type BaseButtonProps = {
+    label: string;
+    icon?: React.SVGAttributes<SVGSymbolElement>;
+    isReversed?: boolean;
+} & OverrideClassName<AnchorButtonAttributes>;
+export declare const BaseButton: {
+    ({ label, icon, isReversed, classNameOverride, ...attributes }: BaseButtonProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/cjs/dts/SplitButton/subcomponents/BaseButton/index.d.ts

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

package/dist/cjs/dts/SplitButton/subcomponents/DropdownButton/DropdownButton.d.ts

@@ -0,0 +1,6 @@
+import { BaseButtonProps } from "../BaseButton";
+export type DropdownButtonProps = Omit<BaseButtonProps, "label" | "icon">;
+export declare const DropdownButton: {
+    ({ classNameOverride, "aria-label": ariaLabel, ...restProps }: DropdownButtonProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/SplitButton/subcomponents/DropdownButton/index.d.ts

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

package/dist/cjs/dts/Table/Table.d.ts

@@ -0,0 +1,100 @@
+import React, { HTMLAttributes, ReactElement } from "react";
+import { CheckedStatus } from "../Checkbox";
+import { OverrideClassName } from "../types/OverrideClassName";
+export type TableContainerProps = {
+    children?: React.ReactNode;
+    variant?: "compact" | "default" | "data";
+};
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081929256/Table Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-table--docs Storybook}
+ */
+export declare const TableContainer: ({ variant, children, ...otherProps }: TableContainerProps) => JSX.Element;
+export type TableHeaderProps = {
+    children?: React.ReactNode;
+};
+export declare const TableHeader: ({ children, ...otherProps }: TableHeaderProps) => JSX.Element;
+export type TableHeaderRowProps = {
+    children?: React.ReactNode;
+};
+/**
+ * @param width value between 1 and 0, to be calculated as a percentage
+ * @param flex CSS flex shorthand as a string. Be sure to specify the flex grow,
+ *        shrink, and basis, due to IE11 compatibility. eg. use "1 1 auto"
+ *        instead of just "1".
+ */
+export type TableHeaderRowCellProps = {
+    labelText: string;
+    onClick?: ((e: React.MouseEvent<HTMLButtonElement>) => any) | ((e: React.MouseEvent<HTMLAnchorElement>) => any);
+    width?: number;
+    flex?: string;
+    href?: string;
+    icon?: ReactElement;
+    checkable?: boolean;
+    checkedStatus?: CheckedStatus;
+    onCheck?: (event: React.ChangeEvent<HTMLInputElement>) => any;
+    reversed?: boolean;
+    /**
+     * Shows an up or down arrow, to show that the column is sorted.
+     */
+    sorting?: "ascending" | "descending";
+    wrapping?: "nowrap" | "wrap";
+    align?: "start" | "center" | "end";
+    tooltipInfo?: string;
+    isTooltipIconHidden?: boolean;
+    /**
+     * Specify where the tooltip should be rendered.
+     */
+    tooltipPortalSelector?: string | undefined;
+    sortingArrowsOnHover?: "ascending" | "descending" | undefined;
+} & OverrideClassName<HTMLAttributes<HTMLElement>>;
+export declare const TableHeaderRowCell: ({ labelText, onClick, href, width, flex, icon, checkable, checkedStatus, onCheck, reversed, sorting: sortingRaw, wrapping, align, tooltipInfo, isTooltipIconHidden, tooltipPortalSelector, sortingArrowsOnHover, classNameOverride, ...otherProps }: TableHeaderRowCellProps) => JSX.Element;
+type ButtonClickEvent = (e: React.MouseEvent<HTMLButtonElement>) => void;
+type AnchorClickEvent = (e: React.MouseEvent<HTMLAnchorElement>) => void;
+/**
+ * As the Card examples in Storybook take a TableRow,
+ * I opted to give the child the role="row" tag. That being
+ * said, while TableHeader has a role="rowgroup" as given
+ * in an example on the accessibility docs, I couldn't justify
+ * adding the same here as all rows look to be wrapped in the
+ * TableCard.
+ *
+ * It may mean that the consumer needs to add their own container
+ * around with the role="row". We could also just add it as a
+ * very simple component similar to TableHeader.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Table_Role
+ */
+export type TableCardProps = OverrideClassName<HTMLAttributes<HTMLElement>> & {
+    onClick?: ButtonClickEvent | AnchorClickEvent;
+    expanded?: boolean;
+    expandedStyle?: "well" | "popout";
+    href?: string;
+    forceHoverState?: boolean;
+    children?: React.ReactNode;
+};
+export declare const TableCard: ({ children, expanded, expandedStyle, onClick, href, forceHoverState, classNameOverride, ...otherProps }: TableCardProps) => JSX.Element;
+/**
+ * Aria roles like aria-rowindex can be added from
+ * the component consumer.
+ *
+ * @param {*} { children, classNameOverride, ...otherProps }
+ */
+export type TableRowProps = OverrideClassName<HTMLAttributes<HTMLElement>> & {
+    children?: React.ReactNode;
+};
+export declare const TableRow: ({ children, classNameOverride, ...otherProps }: TableRowProps) => JSX.Element;
+/**
+ * @param width value between 1 and 0, to be calculated as a percentage
+ * @param flex CSS flex shorthand as a string. Be sure to specify the flex grow,
+ *        shrink, and basis, due to IE11 compatibility. eg. use "1 1 auto"
+ *        instead of just "1".
+ */
+export type TableRowCellProps = OverrideClassName<HTMLAttributes<HTMLElement>> & {
+    children?: React.ReactNode;
+    width?: number;
+    flex?: string;
+    href?: string;
+};
+export declare const TableRowCell: ({ children, width, flex, href, classNameOverride, ...otherProps }: TableRowCellProps) => JSX.Element;
+export {};

package/dist/cjs/dts/Table/index.d.ts

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

package/dist/cjs/dts/Tile/InformationTile/InformationTile.d.ts

@@ -0,0 +1,10 @@
+import { GenericTileProps } from "../subcomponents/GenericTile";
+export type InformationTileProps = GenericTileProps;
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#InformationTile%3A Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-tiles-informationtile--docs Storybook}
+ */
+export declare const InformationTile: {
+    (props: InformationTileProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/Tile/InformationTile/index.d.ts

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

package/dist/cjs/dts/Tile/MultiActionTile/MultiActionTile.d.ts

@@ -0,0 +1,13 @@
+import { GenericTileProps, TileAction } from "../subcomponents/GenericTile";
+export type MultiActionTileProps = {
+    primaryAction: TileAction;
+    secondaryAction?: TileAction;
+} & Omit<GenericTileProps, "footer">;
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#MultiActionTile.1 Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-tiles-multiactiontile--docs Storybook}
+ */
+export declare const MultiActionTile: {
+    ({ children, primaryAction, secondaryAction, ...restProps }: MultiActionTileProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/Tile/MultiActionTile/index.d.ts

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

package/dist/cjs/dts/Tile/TileGrid/TileGrid.d.ts

@@ -0,0 +1,18 @@
+import { HTMLAttributes, ReactElement } from "react";
+import { OverrideClassName } from "../../types/OverrideClassName";
+import { InformationTileProps } from "../InformationTile";
+import { MultiActionTileProps } from "../MultiActionTile";
+type TileProps = InformationTileProps | MultiActionTileProps;
+export type TileElement = ReactElement<TileProps>;
+export interface TileGridProps extends OverrideClassName<HTMLAttributes<HTMLDivElement>> {
+    children: TileElement[] | TileElement;
+}
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#TileGrid Guidance} |
+ * {@link https://cultureamp.design/storybook/?path=/docs/components-tiles-tilegrid--docs Storybook}
+ */
+export declare const TileGrid: {
+    ({ children, classNameOverride, ...restProps }: TileGridProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/cjs/dts/Tile/TileGrid/index.d.ts

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

package/dist/cjs/dts/Tile/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./InformationTile";
+export * from "./MultiActionTile";
+export * from "./TileGrid";

package/dist/cjs/dts/Tile/subcomponents/GenericTile/Action.d.ts

@@ -0,0 +1,8 @@
+import { TileAction } from "./GenericTile";
+type ActionProps = {
+    action: TileAction;
+    secondary?: boolean;
+    disabled?: boolean;
+};
+declare const Action: ({ action, secondary, disabled, }: ActionProps) => JSX.Element;
+export default Action;

package/dist/cjs/dts/Tile/subcomponents/GenericTile/GenericTile.d.ts

@@ -0,0 +1,34 @@
+import React, { HTMLAttributes } from "react";
+import { GenericButtonProps } from "../../../Button/GenericButton";
+import { AllowedHeadingTags } from "../../../Heading";
+import { OverrideClassName } from "../../../types/OverrideClassName";
+import { Moods } from "./types";
+export type TileAction = {
+    label: string;
+    onClick?: GenericButtonProps["onClick"];
+    href?: string;
+    icon?: JSX.Element;
+    /**
+     * @deprecated use data-testid instead
+     */
+    automationId?: string;
+    newTabAndIUnderstandTheAccessibilityImplications?: boolean;
+} & HTMLAttributes<HTMLButtonElement>;
+export type TileInformation = {
+    text: string;
+    primaryAction?: TileAction;
+    secondaryAction?: TileAction;
+};
+export type GenericTileProps = {
+    children?: React.ReactNode;
+    title: React.ReactNode;
+    titleTag?: AllowedHeadingTags;
+    metadata?: string;
+    information?: TileInformation | React.ReactNode;
+    mood?: Moods;
+    footer: React.ReactNode;
+} & OverrideClassName<Omit<HTMLAttributes<HTMLDivElement>, "title">>;
+export declare const GenericTile: {
+    ({ children, title, titleTag, metadata, information, mood, footer, classNameOverride, ...restProps }: GenericTileProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/Tile/subcomponents/GenericTile/index.d.ts

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

package/dist/cjs/dts/Tile/subcomponents/GenericTile/types.d.ts

@@ -0,0 +1,2 @@
+export declare const moodsList: readonly ["positive", "informative", "cautionary", "assertive", "negative", "prominent"];
+export type Moods = (typeof moodsList)[number];

package/dist/cjs/dts/TimeField/TimeField.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+import { TimeFieldStateOptions } from "@react-stately/datepicker";
+import { OverrideClassName } from "../types/OverrideClassName";
+import { StatusType, ValueType } from "./types";
+type OmittedTimeFieldProps = "errorMessage" | "validationState" | "value" | "onChange" | "label" | "hideTimeZone";
+export type TimeFieldProps = {
+    id?: string;
+    /**
+     * Field label.
+     */
+    label: string;
+    /**
+     * Accepts any valid locale code (https://npm.io/package/locale-codes).
+     */
+    locale: string;
+    onChange: (value: ValueType | null) => void;
+    value: ValueType | null;
+    status?: StatusType;
+    validationMessage?: React.ReactNode;
+} & OverrideClassName<Omit<TimeFieldStateOptions, OmittedTimeFieldProps>>;
+export declare const TimeField: {
+    (props: TimeFieldProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/cjs/dts/TimeField/index.d.ts

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

package/dist/cjs/dts/TimeField/subcomponents/TimeSegment/TimeSegment.d.ts

@@ -0,0 +1,9 @@
+import { DateSegment, DateFieldState } from "@react-stately/datepicker";
+export type TimeSegmentProps = {
+    segment: DateSegment;
+    state: DateFieldState;
+};
+export declare const TimeSegment: {
+    ({ segment, state, }: TimeSegmentProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/TimeField/subcomponents/TimeSegment/index.d.ts

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

package/dist/cjs/dts/TimeField/subcomponents/TimeSegment/utils/generateSegmentDisplayText.d.ts

@@ -0,0 +1,2 @@
+import { DateSegment } from "@react-stately/datepicker";
+export declare const generateSegmentDisplayText: (segment: DateSegment) => string;

package/dist/cjs/dts/TimeField/types.d.ts

@@ -0,0 +1,15 @@
+import { CalendarDateTime, Time, ZonedDateTime } from "@internationalized/date";
+export type TimeValue = Time | CalendarDateTime | ZonedDateTime;
+export type TimeOption = {
+    label: string;
+    value: Time;
+};
+export type StatusType = "default" | "error";
+export type ValueType = {
+    /**
+     * Supply hour in 24 hour format
+     */
+    hour: number | undefined;
+    minutes: number | undefined;
+};
+export type IncrementValues = 5 | 10 | 15 | 30 | 60;

package/dist/cjs/dts/TitleBlockZen/TitleBlockZen.d.ts

@@ -0,0 +1,9 @@
+import { TitleBlockProps } from "./types";
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3075605782/Title+Block Guidance} |
+ * {@link https://cultureamp.design/?path=/story/components-titleblock--docs Storybook}
+ */
+export declare const TitleBlockZen: {
+    ({ title, variant, breadcrumb, avatar, subtitle, sectionTitle, sectionTitleDescription, renderSectionTitle, pageSwitcherSelect, handleHamburgerClick, primaryAction, defaultAction, secondaryActions, secondaryOverflowMenuItems, navigationTabs, collapseNavigationAreaWhenPossible, textDirection, surveyStatus, titleAutomationId, avatarAutomationId, subtitleAutomationId, sectionTitleAutomationId, sectionTitleDescriptionAutomationId, breadcrumbAutomationId, breadcrumbTextAutomationId, }: TitleBlockProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/TitleBlockZen/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./TitleBlockZen";
+export * from "./subcomponents/NavigationTabs";

package/dist/cjs/dts/TitleBlockZen/subcomponents/MainActions.d.ts

@@ -0,0 +1,14 @@
+import { DefaultActionProps, PrimaryActionProps } from "../types";
+import { TitleBlockMenuItemProps } from "./TitleBlockMenuItem";
+type MainActionsProps = {
+    primaryAction?: PrimaryActionProps;
+    defaultAction?: DefaultActionProps;
+    reversed?: boolean;
+    overflowMenuItems?: TitleBlockMenuItemProps[];
+    showOverflowMenu?: boolean;
+};
+export declare const MainActions: {
+    ({ primaryAction, defaultAction, reversed, overflowMenuItems, showOverflowMenu, }: MainActionsProps): JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/cjs/dts/TitleBlockZen/subcomponents/MobileActions.d.ts

@@ -0,0 +1,14 @@
+import { ButtonProps } from "../../Button";
+import { DefaultActionProps, PrimaryActionProps, SecondaryActionsProps } from "../types";
+import { TitleBlockMenuItemProps } from "./TitleBlockMenuItem";
+export type MobileActionsProps = {
+    primaryAction?: PrimaryActionProps;
+    defaultAction?: DefaultActionProps;
+    secondaryActions?: SecondaryActionsProps;
+    secondaryOverflowMenuItems?: TitleBlockMenuItemProps[];
+    drawerHandleLabelIconPosition?: ButtonProps["iconPosition"];
+};
+export declare const MobileActions: {
+    ({ primaryAction, defaultAction, secondaryActions, secondaryOverflowMenuItems, drawerHandleLabelIconPosition, }: MobileActionsProps): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/TitleBlockZen/subcomponents/NavigationTabs.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+import { TitleBlockVariant } from "../types";
+export type CustomNavigationTabProps = Omit<NavigationTabProps, "render"> & {
+    className: string;
+};
+export type NavigationTabProps = {
+    text: string;
+    href: string;
+    active?: boolean;
+    handleClick?: (event: React.MouseEvent) => void;
+    variant?: TitleBlockVariant;
+    id?: string;
+    automationId?: string;
+    /**
+     * Custom render for the tab. Commonly used to replace the link with a router link component.
+     * Props given to the NavigationTab component will be passed back, along with a decorated className.
+     * It is up to you to reapply them to your custom component.
+     */
+    render?: (props: CustomNavigationTabProps) => JSX.Element;
+};
+export declare const NavigationTab: {
+    (props: NavigationTabProps): JSX.Element;
+    displayName: string;
+};