@uniformdev/design-system 20.49.3 → 20.49.4-alpha.102

package/dist/index.d.mts

@@ -2,7 +2,7 @@ import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import { Decorator } from '@storybook/react-vite';
 import * as React$1 from 'react';
 import React__default, { RefObject, ReactElement, HTMLAttributes, ReactNode, ButtonHTMLAttributes, ImgHTMLAttributes, SVGProps, InputHTMLAttributes, CSSProperties, Ref, HtmlHTMLAttributes, PropsWithChildren, FocusEventHandler, ChangeEvent } from 'react';
-import { GroupBase, Props, MultiValue, SingleValue } from 'react-select';
+import { GroupBase, Props, MultiValue, SingleValue, StylesConfig } from 'react-select';
 export { ActionMeta, FormatOptionLabelContext, FormatOptionLabelMeta, GetOptionLabel, GetOptionValue, GroupBase, GroupHeadingProps, GroupProps, MenuListProps, MenuPlacement, MultiValue, MultiValueGenericProps, MultiValueProps, MultiValueRemoveProps, OnChangeValue, OptionContext, OptionProps, Options, OptionsOrGroups } from 'react-select';
 import * as _emotion_react from '@emotion/react';
 import { SerializedStyles } from '@emotion/react';
@@ -589,6 +589,19 @@ type ButtonWithVariantProps = Omit<ButtonProps, 'buttonType'> & {
  */
 declare const Button: React$1.ForwardRefExoticComponent<(Omit<ButtonProps, "ref"> | Omit<ButtonWithVariantProps, "ref">) & React$1.RefAttributes<HTMLButtonElement>>;
 
+type LinkButtonProps = ButtonProps$1 & {
+    /** React child node */
+    children?: React$1.ReactNode;
+    /** (optional) sets whether the link is truncated or not */
+    truncated?: boolean;
+};
+/**
+ * @deprecated - Beta - A button styled as a link with ghost-like appearance.
+ * Features no padding, left-aligned content, text truncation, and no background hover color.
+ * @example <LinkButton onClick={() => {}}>Click me</LinkButton>
+ */
+declare const LinkButton: React$1.ForwardRefExoticComponent<Omit<LinkButtonProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+
 declare const rectangleRoundedIcon: IconType$1;
 declare const cardIcon: IconType$1;
 declare const imageTextIcon: IconType$1;
@@ -2710,6 +2723,190 @@ type KeyValueInputProps<TValue extends string = string> = {
  */
 declare const KeyValueInput: <TValue extends string = string>({ value, onChange, label, newItemDefault, keyLabel, valueLabel, iconLabel, keyInfoPopover, valueInfoPopover, iconInfoPopover, disabled, errors, onFocusChange, showIconColumn, renderIconSelector, }: KeyValueInputProps<TValue>) => _emotion_react_jsx_runtime.JSX.Element;
 
+type SwatchSize = 'default' | 'small';
+type SwatchVariant = 'swatch-default' | 'swatch-red' | 'swatch-orange' | 'swatch-yellow' | 'swatch-green' | 'swatch-blue' | 'swatch-purple' | 'swatch-pink' | 'swatch-brown' | 'swatch-gray';
+type SwatchProps = {
+    /** sets the size of the swatch
+     * @default 'default'
+     */
+    size?: SwatchSize;
+    /** sets the color variant of the swatch
+     * @default 'swatch-default'
+     */
+    variant?: SwatchVariant;
+    /** sets the tooltip of the swatch
+     * @default undefined
+     */
+    tooltip?: string;
+    /** sets the test id of the swatch
+     * @default 'swatch'
+     */
+    testId?: string;
+};
+/** @example <Swatch variant="swatch-blue" size="default" /> */
+declare const Swatch: ({ size, variant, tooltip, testId, }: SwatchProps) => _emotion_react_jsx_runtime.JSX.Element;
+
+/** Swatch color CSS custom properties
+ * Exports CSS variables for all swatch variants that can be used in other components.
+ * Each variant has --swatch-{variant}-bg and --swatch-{variant}-border variables.
+ * @example <div css={swatchColors}></div>
+ * @example css-in-js my-component { ${swatchColors} }
+ */
+declare const swatchColors: _emotion_react.SerializedStyles;
+/**
+ * Swatch variant styles as plain objects.
+ * Works with both Emotion's css prop and react-select's styles API.
+ * @example <div css={swatchVariant['swatch-blue']}></div>
+ * @example styles={{ multiValue: (base, { data }) => ({ ...base, ...swatchVariant[data.color] }) }}
+ */
+declare const swatchVariant: {
+    readonly 'swatch-default': {
+        readonly '--variant-bg': "var(--swatch-default-bg)";
+        readonly '--variant-border': "var(--swatch-default-border)";
+    };
+    readonly 'swatch-gray': {
+        readonly '--variant-bg': "var(--swatch-gray-bg)";
+        readonly '--variant-border': "var(--swatch-gray-border)";
+    };
+    readonly 'swatch-brown': {
+        readonly '--variant-bg': "var(--swatch-brown-bg)";
+        readonly '--variant-border': "var(--swatch-brown-border)";
+    };
+    readonly 'swatch-orange': {
+        readonly '--variant-bg': "var(--swatch-orange-bg)";
+        readonly '--variant-border': "var(--swatch-orange-border)";
+    };
+    readonly 'swatch-yellow': {
+        readonly '--variant-bg': "var(--swatch-yellow-bg)";
+        readonly '--variant-border': "var(--swatch-yellow-border)";
+    };
+    readonly 'swatch-green': {
+        readonly '--variant-bg': "var(--swatch-green-bg)";
+        readonly '--variant-border': "var(--swatch-green-border)";
+    };
+    readonly 'swatch-blue': {
+        readonly '--variant-bg': "var(--swatch-blue-bg)";
+        readonly '--variant-border': "var(--swatch-blue-border)";
+    };
+    readonly 'swatch-purple': {
+        readonly '--variant-bg': "var(--swatch-purple-bg)";
+        readonly '--variant-border': "var(--swatch-purple-border)";
+    };
+    readonly 'swatch-pink': {
+        readonly '--variant-bg': "var(--swatch-pink-bg)";
+        readonly '--variant-border': "var(--swatch-pink-border)";
+    };
+    readonly 'swatch-red': {
+        readonly '--variant-bg': "var(--swatch-red-bg)";
+        readonly '--variant-border': "var(--swatch-red-border)";
+    };
+};
+
+/**
+ * SwatchComboBoxLabelStyles provides custom styles for react-select's multiValue and multiValueLabel.
+ * Dynamically applies color based on each option's color property.
+ * @returns A StylesConfig object with customized styles.
+ */
+declare const SwatchComboBoxLabelStyles: <TOption, IsMulti extends boolean = boolean, TGroup extends ComboBoxGroupBase<TOption> = ComboBoxGroupBase<TOption>>() => StylesConfig<TOption, IsMulti, TGroup>;
+declare function SwatchComboBox<TOption = InputComboBoxOption & {
+    color: SwatchVariant;
+}, IsMulti extends boolean = false, TGroup extends ComboBoxGroupBase<TOption> = ComboBoxGroupBase<TOption>>({ labelTitle, caption, isMulti, ...props }: InputComboBoxProps<TOption, IsMulti, TGroup> & {
+    labelTitle?: string;
+    caption?: string;
+    isMulti?: boolean;
+}): _emotion_react_jsx_runtime.JSX.Element;
+
+type SwatchLabelProps = {
+    /** Sets the color variant of the swatch label
+     * @default 'swatch-default'
+     */
+    variant?: SwatchVariant;
+    /** The text to display inside the swatch label */
+    label: string;
+    /** The size of the swatch label
+     * @default 'default'
+     */
+    size?: 'xs' | 'sm' | 'md';
+    /** The right slot to display inside the swatch label */
+    rightSlot?: React.ReactNode;
+    /** The tooltip to display inside the swatch label */
+    tooltip?: string | React.ReactElement;
+    /** The left slot to display inside the swatch label */
+    leftSlot?: React.ReactNode;
+};
+/**
+ * A colored label component that uses the same color variants as Swatch.
+ * @example <SwatchLabel variant="swatch-blue" label="Blue Label" />
+ */
+declare const SwatchLabel: ({ variant, size, label, rightSlot, tooltip, leftSlot, }: SwatchLabelProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const SwatchLabelRemoveButton: ({ onRemove, size, }: {
+    /** The function to call when the remove button is clicked */
+    onRemove: () => void;
+    /** The size of the remove button
+     * @default 'sm'
+     */
+    size?: SwatchLabelProps["size"];
+}) => _emotion_react_jsx_runtime.JSX.Element;
+/**
+ * A tooltip component that displays a swatch label with a parent title and a description.
+ * @example <SwatchLabelTooltip parentTitle="Parent Title" title="Title" description="Description" />
+ */
+declare const SwatchLabelTooltip: ({ parentTitle, title, description, }: {
+    parentTitle?: string | React.ReactElement;
+    title?: string | React.ReactElement;
+    description?: string | React.ReactElement;
+}) => _emotion_react_jsx_runtime.JSX.Element;
+
+/** Represents a label item that can be displayed in the quick filter */
+type LabelsQuickFilterItem = {
+    /** Unique identifier for the label */
+    id: string;
+    /** Display name for the label */
+    name: string;
+    /** Optional swatch variant color */
+    variant?: SwatchVariant;
+    /** Optional tooltip content */
+    tooltip?: string | React.ReactElement;
+    /** Whether this item represents a group header */
+    isGroup?: boolean;
+    /** The parent group ID if this label belongs to a group */
+    parent?: string;
+};
+type LabelsQuickFilterProps = {
+    /** The text to display on the filter button */
+    buttonText: string;
+    /** All available label items (including groups and children) */
+    items: LabelsQuickFilterItem[];
+    /** Set or array of currently selected item IDs */
+    selectedIds: Set<string> | string[];
+    /** Callback when a label is selected */
+    onSelect: (item: LabelsQuickFilterItem) => void;
+    /** Callback when a label is deselected */
+    onDeselect: (id: string) => void;
+    /** Whether the filter is disabled */
+    disabled?: boolean;
+    /** Test ID for the component */
+    testId?: string;
+    /** Override the total results count (defaults to items.length excluding groups) */
+    totalResults?: number;
+    /** handles creating a new label */
+    onCreateLabel?: (label: string) => void;
+    /** sets whether to use a React portal rendering or not. */
+    withoutPortal?: boolean;
+    /**
+     * The maximum width of the quick filter container.
+     * Useful for controlling the maximum width of the filter in different layouts (e.g., responsive sidebars).
+     * @default '4rem'
+     */
+    maxContainerSize?: string;
+};
+/**
+ * A reusable quick filter component for selecting labels with swatch colors.
+ * Supports flat labels and grouped labels with nested menus.
+ * @example <LabelsQuickFilter buttonText="Filter by label" items={labels} selectedIds={selectedSet} onSelect={handleSelect} onDeselect={handleDeselect} />
+ */
+declare const LabelsQuickFilter: ({ buttonText, items, selectedIds, onSelect, onDeselect, disabled, testId, totalResults, onCreateLabel, withoutPortal, maxContainerSize, }: LabelsQuickFilterProps) => _emotion_react_jsx_runtime.JSX.Element;
+
 type AsideAndSectionLayout = {
     /** sets child components in the aside / supporting column */
     sidebar?: ReactNode;
@@ -2962,6 +3159,8 @@ interface MenuProps extends MenuProps$1 {
      * @default 'base'
      */
     size?: 'small' | 'base';
+    /** (optional) disables the menu trigger so the menu cannot be opened */
+    disabled?: boolean;
 }
 /**
  * Component used for creating clickable menus
@@ -3100,9 +3299,18 @@ type SearchableMenuProps = {
 declare const SearchableMenu: (props: SearchableMenuProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 interface SelectableMenuItemProps extends PropsWithChildren<Omit<MenuItemProps, 'children'>> {
+    /** whether the menu item is selected */
     selected: boolean;
+    /** the styles to use for the selectable menu item
+     * @default 'default'
+     */
+    selectStyles?: 'default' | 'checkbox-select';
+    /** whether the menu item is selectable
+     * @default true
+     */
+    isSelectable?: boolean;
 }
-declare function SelectableMenuItem({ selected, children, ...menuItemProps }: SelectableMenuItemProps): _emotion_react_jsx_runtime.JSX.Element;
+declare function SelectableMenuItem({ selected, children, selectStyles, isSelectable, ...menuItemProps }: SelectableMenuItemProps): _emotion_react_jsx_runtime.JSX.Element;
 
 type ModalProps = {
     header?: React__default.ReactNode;
@@ -3380,6 +3588,7 @@ type BaseParameterActionButtonProps = {
      * If a React element is provided, it will be displayed as a tooltip.
      */
     tooltip?: string | React__default.ReactNode;
+    tooltipProps?: Partial<TooltipProps>;
     /**
      * The component to render the button as.
      * There maybe a scenario where we want to render the button as a div
@@ -3398,7 +3607,7 @@ interface FilledVariant extends BaseParameterActionButtonProps {
     inverted?: boolean;
 }
 type ParameterActionButtonProps = OutlineVariant | FilledVariant;
-declare const ParameterActionButton: ({ children, themeType, tooltip, renderAs, disabled, ...props }: ParameterActionButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ParameterActionButton: ({ children, themeType, tooltip, tooltipProps, renderAs, disabled, ...props }: ParameterActionButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type ParameterDrawerHeaderProps = {
     title: string;
@@ -3485,6 +3694,36 @@ type ParameterLabelProps = HTMLAttributes<HTMLLabelElement> & {
 /** @example <ParameterLabel id="my-label">my label</ParameterLabel> */
 declare const ParameterLabel: ({ id, asSpan, children, testId, ...props }: ParameterLabelProps) => _emotion_react_jsx_runtime.JSX.Element;
 
+/** Extended option type that supports label-specific properties */
+type LabelOption = InputComboBoxOption & {
+    /** The color variant for the label swatch */
+    color?: SwatchVariant;
+    /** Whether this option represents a group header */
+    isGroup?: boolean;
+    /** The parent group ID if this label belongs to a group */
+    parent?: string;
+    /** Tooltip content for the label */
+    tooltip?: string | React.ReactElement;
+};
+type ParameterLabelsInnerProps = Pick<InputComboBoxProps<LabelOption, true>, 'options' | 'value' | 'defaultValue' | 'onChange' | 'onBlur' | 'isClearable' | 'isDisabled'> & {
+    /** Callback when an item is removed from the selection */
+    onItemRemoved?: (id: string) => void;
+    /** Callback when a new label is created */
+    onCreateLabel?: (label: string) => void;
+    /** Override the text displayed on the filter button */
+    buttonText?: string;
+};
+type ParameterLabelsProps = CommonParameterInputProps & ParameterLabelsInnerProps & {
+    disabled?: boolean;
+};
+/**
+ * A parameter input component for selecting multiple labels with swatch colors.
+ * Supports grouped labels with nested menus.
+ * @example <ParameterLabels id="labels" label="Labels" options={[]} value={[]} onChange={() => {}} />
+ */
+declare const ParameterLabels: ({ disabled, ...props }: ParameterLabelsProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ParameterLabelsInner: (props: ParameterLabelsInnerProps) => _emotion_react_jsx_runtime.JSX.Element;
+
 type ParameterLinkProps = CommonParameterInputProps & React.InputHTMLAttributes<HTMLInputElement> & {
     /** (optional) sets the button text when value is empty
      * @default 'Configure link'
@@ -3880,7 +4119,9 @@ declare const ParameterShell: ({ label, labelLeadingIcon, labelTrailingIcon, hid
 declare const ParameterShellPlaceholder: ({ children }: {
     children?: ReactNode;
 }) => _emotion_react_jsx_runtime.JSX.Element;
-declare const ParameterOverrideMarker: (props: HTMLAttributes<HTMLButtonElement>) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ParameterOverrideMarker: (props: HTMLAttributes<HTMLButtonElement> & {
+    tooltipProps?: Partial<TooltipProps>;
+}) => _emotion_react_jsx_runtime.JSX.Element;
 
 type ParameterTextareaProps = CommonParameterInputProps & React.TextareaHTMLAttributes<HTMLTextAreaElement>;
 /** @example <ParameterTextarea label="label value" id="my-textarea" /> */
@@ -4028,6 +4269,90 @@ type ProgressListItem<IdType extends string = string> = {
 };
 declare const ProgressListItem: ({ children, status, error, errorLevel, autoEllipsis, }: ProgressListItemProps) => _emotion_react_jsx_runtime.JSX.Element;
 
+type QuickFilterSelectedItem = {
+    /** Unique identifier for the selected item */
+    id: string;
+    /** Display name for the selected item */
+    name: string;
+    /** Optional swatch variant color */
+    variant?: SwatchVariant | string;
+    /** The tooltip to display inside the selected item */
+    tooltip?: string | React.ReactElement;
+    /** Optional icon to display on the left of the selected item */
+    icon?: IconType;
+};
+type QuickFilterProps = {
+    /** the icon to display on the left of the quick filter */
+    iconLeft?: IconType;
+    /** the text to display on the quick filter */
+    buttonText: string;
+    /** the function to call when the quick filter is clicked */
+    /** the size of the quick filter
+     * @default 'sm'
+     */
+    size?: ButtonSizeProps;
+    /** the test id to use for the quick filter */
+    testId?: string;
+    /** the aria label to use for the quick filter */
+    ariaLabel?: string;
+    /** the children to display inside the quick filter */
+    children: ReactNode;
+    /** whether the quick filter is disabled */
+    disabled?: boolean;
+    /** the selected items to display inside the quick filter */
+    selectedItems?: QuickFilterSelectedItem[];
+    /** the function to call when the search term is changed */
+    onSearchTermChanged: (searchTerm: string) => void;
+    /** addButtonText to use for the add button
+     * @default 'Add'
+     */
+    addButtonText?: string;
+    /** the css to use for the swatch colors
+     * @default swatchColors from the Swatch component
+     */
+    swatchColorsCss?: SerializedStyles;
+    /** the function to call when an item is removed */
+    onItemRemoved?: (id: string) => void;
+    /** the total number of results */
+    totalResults: number;
+    /** the maximum height of the menu
+     * @default '320px'
+     */
+    maxMenuHeight?: string;
+    /** the maximum number of results to display
+     * @default 5
+     */
+    maxCount?: number;
+    /** the css to use for the container
+     * @default swatchColors from the Swatch component
+     */
+    containerCss?: SerializedStyles;
+    /** Render function for displaying selected items. Receives selectedItems and onItemRemoved.
+     * @default Renders SwatchLabel components
+     */
+    resultsComponent?: (props: {
+        selectedItems: QuickFilterSelectedItem[];
+        onItemRemoved?: (id: string) => void;
+    }) => ReactNode;
+    /** the message to display when there are no results
+     * @default ''
+     */
+    hasNoResultsMessage?: string;
+    /** the placeholder text to display in the search input
+     * @default 'Search...'
+     */
+    searchPlaceholderText?: string;
+    /**
+     * The maximum width of the quick filter container.
+     * Useful for controlling the maximum width of the filter in different layouts (e.g., responsive sidebars).
+     * @default '4rem'
+     */
+    maxContainerSize?: string;
+    /** the icon to display on the left of the quick filter when collapsed */
+    collapsedIcon?: IconType;
+};
+declare const QuickFilter: ({ iconLeft, collapsedIcon, buttonText, testId, ariaLabel, children, size, disabled, selectedItems, onSearchTermChanged, addButtonText, onItemRemoved, totalResults, maxMenuHeight, maxCount, containerCss, resultsComponent, hasNoResultsMessage, searchPlaceholderText, maxContainerSize, }: QuickFilterProps) => _emotion_react_jsx_runtime.JSX.Element;
+
 type SegmentedControlOption<TValue extends string = string> = {
     value: TValue;
     label?: string;
@@ -4097,6 +4422,114 @@ declare const Spinner: ({ width, label, isPaused, }: {
     isPaused?: boolean;
 }) => _emotion_react_jsx_runtime.JSX.Element;
 
+/** The direction of a step transition, determining which slide animation to play. */
+type StackedModalDirection = 'forward' | 'backward';
+/** The full navigation state exposed by the `useStackedModal` hook. */
+type StackedModalContextValue = {
+    /** The zero-indexed active step. */
+    currentStep: number;
+    /** The total number of steps. */
+    totalSteps: number;
+    /** The direction of the last navigation, used to drive slide animations. */
+    direction: StackedModalDirection;
+    /** The zero-indexed step that was active before the last navigation. Used internally for animation. */
+    previousStep: number;
+    /** Navigate to the next step. No-op if already on the last step. */
+    nextStep: () => void;
+    /** Navigate to the previous step. No-op if already on the first step. */
+    goBack: () => void;
+    /** Navigate to a specific step by index. */
+    goToStep: (index: number) => void;
+};
+/**
+ * Hook to access the stacked modal navigation context.
+ * Provides the current step, total steps, navigation direction, and functions to navigate between steps.
+ *
+ * @throws If used outside of a `<StackedModal>` component tree.
+ */
+declare function useStackedModal(): StackedModalContextValue;
+/** The semantic transition state for a single step, derived from the navigation context. */
+type StepTransitionState = {
+    /** Whether this step is the currently visible step. */
+    isActive: boolean;
+    /** Whether this step is animating out after being replaced by a new active step. */
+    isExiting: boolean;
+    /** Whether the modal is idle (no transition in progress). True on initial render and after animations complete. */
+    isIdle: boolean;
+    /** The direction of the current or most recent transition. */
+    direction: StackedModalDirection;
+};
+
+type StackedModalProps = {
+    /** The step content. Each child should be a `StackedModalStep` component. */
+    children: ReactNode;
+    /**
+     * Called when the close button is clicked, the Escape button is pressed, or when the modal's backdrop is clicked.
+     * If undefined is passed, the modal will not be closable by the user and the close button will not be rendered.
+     */
+    onRequestClose: ModalProps['onRequestClose'];
+    /**
+     * The size sets the modal width to one of three options sm = 400px, md = 600px and lg = 800px.
+     * If a width attribute is used the size will be overridden by the width attribute.
+     * @default 'lg'
+     */
+    modalSize?: ModalProps['modalSize'];
+    /** A valid CSS width. Overrides `modalSize` when provided. */
+    width?: string;
+    /** A valid CSS height. */
+    height?: string;
+    /**
+     * The zero-indexed step to display initially.
+     * @default 0
+     */
+    initialStep?: number;
+};
+/**
+ * A modal component that supports multi-step content with sliding transitions.
+ * Each child should be a `StackedModalStep` component that defines its own header,
+ * content, and button group.
+ *
+ * Use the `useStackedModal` hook inside step content to navigate between steps.
+ *
+ * @example
+ * <StackedModal onRequestClose={handleClose} modalSize="lg">
+ *   <StackedModalStep header="Step 1" buttonGroup={<Buttons />}>
+ *     <StepOneContent />
+ *   </StackedModalStep>
+ *   <StackedModalStep header="Step 2" buttonGroup={<Buttons />}>
+ *     <StepTwoContent />
+ *   </StackedModalStep>
+ * </StackedModal>
+ */
+declare const StackedModal: React__default.ForwardRefExoticComponent<StackedModalProps & React__default.RefAttributes<HTMLDialogElement>>;
+
+/** Props for a single step within a `StackedModal`. */
+type StackedModalStepProps = {
+    /**
+     * Header content displayed in the modal's header row, inline with the close icon.
+     * This prop is extracted by the parent `StackedModal` and rendered in the
+     * modal chrome -- it is **not** rendered by `StackedModalStep` itself.
+     */
+    header?: ReactNode;
+    /** Optional button group rendered at the bottom of the step, typically navigation or submit buttons. */
+    buttonGroup?: ReactNode;
+    /** The main body content of the step. */
+    children: ReactNode;
+};
+/**
+ * Defines a single step inside a `StackedModal`.
+ *
+ * Renders a scrollable content area and an optional bottom button group.
+ * The `header` prop is read by the parent `StackedModal` and displayed in the
+ * modal header row with a matching slide animation.
+ *
+ * @example
+ * <StackedModalStep header="Account details" buttonGroup={<Button>Next</Button>}>
+ *   <FormFields />
+ * </StackedModalStep>
+ */
+declare function StackedModalStep({ children, buttonGroup }: StackedModalStepProps): _emotion_react_jsx_runtime.JSX.Element;
+
 type SwitchProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type'> & {
     /** sets the label value */
     label: ReactNode;
@@ -4361,20 +4794,8 @@ type LinkManagerWithRefType = (props: Partial<LinkProps> & {
  * We recommend using this link `next/link`
  * @example <LinkWithRef linkManagerComponent={NextLink} href="some-url" text="my link" />
  */
-declare const LinkWithRef: React$1.ForwardRefExoticComponent<Omit<React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
-    /** sets the link text and title text */
-    text: string;
-    /** (optional) sets the link color
-     * @default 'currentColor'
-     */
-    linkColor?: LinkColorProps;
-    /** (optional) sets whether the link is external or not adding an icon to the link */
-    external?: boolean;
-    /** (optional) For supporting inside next/link component */
-    ref?: React$1.ForwardedRef<HTMLAnchorElement>;
-    /** (optional) sets react child elements */
-    children?: React$1.ReactNode;
-} & {
+declare const LinkWithRef: React$1.ForwardRefExoticComponent<Omit<Omit<LinkProps, "text"> & {
+    text?: string;
     href: string;
     as?: string;
     linkManagerComponent: LinkManagerWithRefType;
@@ -4524,4 +4945,4 @@ declare const StatusBullet: ({ status, hideText, size, message, compact, ...prop
 
 declare const actionBarVisibilityStyles: _emotion_react.SerializedStyles;
 
-export { type ActionButtonsProps, AddButton, type AddButtonProps, AddListButton, type AddListButtonProps, type AddListButtonThemeProps, AsideAndSectionLayout, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Banner, type BannerProps, type BannerType, BetaDecorator, type BoxHeightProps, type BreakpointSize, type BreakpointsMap, Button, type ButtonProps, type ButtonSizeProps, type ButtonSoftThemeProps, type ButtonThemeProps, ButtonWithMenu, type ButtonWithMenuProps, Calendar, type CalendarProps, Callout, type CalloutProps, type CalloutType, Caption, type CaptionProps, Card, CardContainer, type CardContainerBgColorProps, type CardContainerProps, type CardProps, CardTitle, type CardTitleProps, CheckboxWithInfo, type CheckboxWithInforProps, type ChildFunction, Chip, type ChipProps, type ChipTheme, type ComboBoxGroupBase, type ComboBoxSelectableGroup, type ComboBoxSelectableItem, type ComboBoxSelectableOption, Container, type ContainerProps, type ConvertComboBoxGroupsToSelectableGroupsOptions, Counter, type CounterBgColors, type CounterIconColors, type CounterProps, CreateTeamIntegrationTile, type CreateTeamIntegrationTileProps, CurrentDrawerContext, DashedBox, type DashedBoxProps, DateTimePicker, type DateTimePickerProps, DateTimePickerSummary, type DateTimePickerValue, DateTimePickerVariant, DebouncedInputKeywordSearch, type DebouncedInputKeywordSearchProps, DescriptionList, type DescriptionListProps, Details, type DetailsProps, DismissibleChipAction, DragHandle, type DraggableHandleProps, Drawer, DrawerContent, type DrawerContentProps, type DrawerContextValue, type DrawerItem, type DrawerProps, DrawerProvider, DrawerRenderer, type DrawerRendererItemProps, type DrawerRendererProps, type DrawersRegistryRecord, DropdownStyleMenuTrigger, type DropdownStyleMenuTriggerProps, EditTeamIntegrationTile, type EditTeamIntegrationTileProps, ErrorMessage, type ErrorMessageProps, FieldMessage, type FieldMessageProps, Fieldset, type FieldsetProps, FilterChip, FlexiCard, FlexiCardTitle, type GroupedOption, Heading, type HeadingProps, HexModalBackground, HorizontalRhythm, Icon, IconButton, type IconButtonProps, type IconColor, type IconName, type IconProps, type IconType, IconsProvider, Image, ImageBroken, type ImageProps, InfoMessage, type InfoMessageProps, Input, InputComboBox, type InputComboBoxOption, type InputComboBoxProps, InputCreatableComboBox, type InputCreatableComboBoxProps, InputInlineSelect, type InputInlineSelectOption, type InputInlineSelectProps, InputKeywordSearch, type InputKeywordSearchProps, type InputProps, InputSelect, type InputSelectProps, InputTime, type InputTimeProps, InputToggle, type InputToggleProps, IntegrationComingSoon, type IntegrationComingSoonProps, IntegrationLoadingTile, type IntegrationLoadingTileProps, IntegrationModalHeader, type IntegrationModalHeaderProps, IntegrationModalIcon, type IntegrationModalIconProps, IntegrationTile, type IntegrationTileProps, type IsoDateString, type IsoDateTimeString, type IsoTimeString, JsonEditor, type JsonEditorProps, KeyValueInput, type KeyValueInputProps, type KeyValueItem, Label, LabelLeadingIcon, type LabelLeadingIconProps, type LabelProps, Legend, type LegendProps, type LevelProps, LimitsBar, type LimitsBarProps, Link, type LinkColorProps, LinkList, type LinkListProps, type LinkManagerWithRefType, LinkNode, type LinkProps, LinkTile, type LinkTileWithRefProps, LinkWithRef, LoadingCardSkeleton, LoadingIcon, type LoadingIconProps, LoadingIndicator, LoadingOverlay, type LoadingOverlayProps, Menu, MenuButton, type MenuButtonProp, MenuGroup, type MenuGroupProps, MenuItem, MenuItemEmptyIcon, MenuItemIcon, MenuItemInner, type MenuItemProps, MenuItemSeparator, type MenuItemTextThemeProps, type MenuProps, MenuSelect, MenuThreeDots, type MenuThreeDotsProps, Modal, ModalDialog, type ModalDialogProps, type ModalProps, MultilineChip, type MultilineChipProps, ObjectGridContainer, type ObjectGridContainerProps, ObjectGridItem, ObjectGridItemCardCover, type ObjectGridItemCardCoverProps, ObjectGridItemCover, ObjectGridItemCoverButton, type ObjectGridItemCoverButtonProps, type ObjectGridItemCoverProps, ObjectGridItemHeading, ObjectGridItemIconWithTooltip, type ObjectGridItemIconWithTooltipProps, ObjectGridItemLoadingSkeleton, type ObjectGridItemProps, type ObjectGridItemTitleProps, ObjectItemLoadingSkeleton, type ObjectItemLoadingSkeletonProps, ObjectListItem, ObjectListItemContainer, ObjectListItemCover, type ObjectListItemCoverProps, ObjectListItemHeading, type ObjectListItemHeadingProps, type ObjectListItemProps, PageHeaderSection, type PageHeaderSectionProps, Pagination, Paragraph, type ParagraphProps, ParameterActionButton, type ParameterActionButtonProps, ParameterDrawerHeader, type ParameterDrawerHeaderProps, ParameterGroup, type ParameterGroupProps, ParameterImage, ParameterImageInner, ParameterImagePreview, type ParameterImageProps, ParameterInput, ParameterInputInner, type ParameterInputProps, ParameterLabel, type ParameterLabelProps, ParameterLink, ParameterLinkInner, type ParameterLinkProps, ParameterMenuButton, type ParameterMenuButtonProps, ParameterMultiSelect, ParameterMultiSelectInner, type ParameterMultiSelectOption, type ParameterMultiSelectProps, ParameterNameAndPublicIdInput, type ParameterNameAndPublicIdInputProps, ParameterNumberSlider, ParameterNumberSliderInner, type ParameterNumberSliderProps, ParameterOverrideMarker, ParameterRichText, ParameterRichTextInner, type ParameterRichTextInnerProps, type ParameterRichTextProps, ParameterSelect, ParameterSelectInner, type ParameterSelectProps, ParameterSelectSlider, ParameterSelectSliderInner, type ParameterSelectSliderProps, ParameterShell, ParameterShellContext, ParameterShellPlaceholder, type ParameterShellProps, ParameterTextarea, ParameterTextareaInner, type ParameterTextareaProps, ParameterToggle, ParameterToggleInner, type ParameterToggleProps, Popover, PopoverBody, type PopoverBodyProps, type PopoverProps, ProgressBar, type ProgressBarProps, ProgressList, ProgressListItem, type ProgressListItemProps, type ProgressListProps, type RegisterDrawerProps, ResolveIcon, type ResolveIconProps, ResponsiveTableContainer, type RhythmProps, type RichTextParamValue, RichTextToolbarIcon, type ScrollableItemProps, ScrollableList, type ScrollableListContainerProps, ScrollableListInputItem, ScrollableListItem, type ScrollableListItemProps, type ScrollableListProps, SearchableMenu, type SearchableMenuProps, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, SelectableMenuItem, type SelectableMenuItemProps, type SerializedLinkNode, type ShortcutReference, Skeleton, type SkeletonProps, Slider, SliderLabels, type SliderLabelsProps, type SliderOption, type SliderProps, Spinner, StatusBullet, type StatusBulletProps, type StatusTypeProps, SuccessMessage, type SuccessMessageProps, Switch, type SwitchProps, TAKEOVER_STACK_ID, TabButton, TabButtonGroup, type TabButtonProps, TabContent, type TabContentProps, Table, TableBody, type TableBodyProps, TableCellData, type TableCellDataProps, TableCellHead, type TableCellHeadProps, TableFoot, type TableFootProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tabs, type TabsProps, TakeoverDrawerRenderer, type TextAlignProps, Textarea, type TextareaProps, Theme, type ThemeProps, type TickMark, Tile, TileContainer, type TileContainerProps, type TileProps, TileText, type TileTitleProps, ToastContainer, type ToastContainerProps, Tooltip, type TooltipProps, TwoColumnLayout, type TwoColumnLayoutProps, UniformBadge, UniformLogo, UniformLogoLarge, type UniformLogoProps, type UseShortcutOptions, type UseShortcutResult, VerticalRhythm, WarningMessage, type WarningMessageProps, accessibleHidden, actionBarVisibilityStyles, addPathSegmentToPathname, borderTopIcon, breakpoints, button, buttonAccentAltDark, buttonAccentAltDarkOutline, buttonDestructive, buttonDisabled, buttonGhost, buttonGhostDestructive, buttonGhostUnimportant, buttonPrimary, buttonPrimaryInvert, buttonRippleEffect, buttonSecondary, buttonSecondaryInvert, buttonSoftAccentPrimary, buttonSoftAlt, buttonSoftDestructive, buttonSoftPrimary, buttonSoftTertiary, buttonTertiary, buttonTertiaryOutline, buttonUnimportant, canvasAlertIcon, cardIcon, chatIcon, convertComboBoxGroupsToSelectableGroups, cq, customIcons, debounce, extractParameterProps, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeInTop, fadeOutBottom, fullWidthScreenIcon, getButtonSize, getButtonStyles, getComboBoxSelectedSelectableGroups, getDrawerAttributes, getFormattedShortcut, getParentPath, getPathSegment, growSubtle, imageTextIcon, infoFilledIcon, input, inputError, inputSelect, isSecureURL, isValidUrl, jsonIcon, labelText, mq, numberInput, prefersReducedMotion, queryStringIcon, rectangleRoundedIcon, replaceUnderscoreInString, richTextToolbarButton, richTextToolbarButtonActive, ripple, scrollbarStyles, settings, settingsIcon, skeletonLoading, slideInRtl, slideInTtb, spin, structurePanelIcon, supports, textInput, uniformAiIcon, uniformComponentIcon, uniformComponentPatternIcon, uniformCompositionPatternIcon, uniformConditionalValuesIcon, uniformContentTypeIcon, uniformEntryIcon, uniformEntryPatternIcon, uniformLocaleDisabledIcon, uniformLocaleIcon, uniformStatusDraftIcon, uniformStatusModifiedIcon, uniformStatusPublishedIcon, uniformUsageStatusIcon, useBreakpoint, useButtonStyles, useCloseCurrentDrawer, useCurrentDrawer, useCurrentTab, useDateTimePickerContext, useDrawer, useIconContext, useImageLoadFallback, useOutsideClick, useParameterShell, usePopoverComponentContext, useRichTextToolbarState, useShortcut, functionalColors as utilityColors, warningIcon, yesNoIcon, zigZag, zigZagThick };
+export { type ActionButtonsProps, AddButton, type AddButtonProps, AddListButton, type AddListButtonProps, type AddListButtonThemeProps, AsideAndSectionLayout, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Banner, type BannerProps, type BannerType, BetaDecorator, type BoxHeightProps, type BreakpointSize, type BreakpointsMap, Button, type ButtonProps, type ButtonSizeProps, type ButtonSoftThemeProps, type ButtonThemeProps, ButtonWithMenu, type ButtonWithMenuProps, Calendar, type CalendarProps, Callout, type CalloutProps, type CalloutType, Caption, type CaptionProps, Card, CardContainer, type CardContainerBgColorProps, type CardContainerProps, type CardProps, CardTitle, type CardTitleProps, CheckboxWithInfo, type CheckboxWithInforProps, type ChildFunction, Chip, type ChipProps, type ChipTheme, type ComboBoxGroupBase, type ComboBoxSelectableGroup, type ComboBoxSelectableItem, type ComboBoxSelectableOption, Container, type ContainerProps, type ConvertComboBoxGroupsToSelectableGroupsOptions, Counter, type CounterBgColors, type CounterIconColors, type CounterProps, CreateTeamIntegrationTile, type CreateTeamIntegrationTileProps, CurrentDrawerContext, DashedBox, type DashedBoxProps, DateTimePicker, type DateTimePickerProps, DateTimePickerSummary, type DateTimePickerValue, DateTimePickerVariant, DebouncedInputKeywordSearch, type DebouncedInputKeywordSearchProps, DescriptionList, type DescriptionListProps, Details, type DetailsProps, DismissibleChipAction, DragHandle, type DraggableHandleProps, Drawer, DrawerContent, type DrawerContentProps, type DrawerContextValue, type DrawerItem, type DrawerProps, DrawerProvider, DrawerRenderer, type DrawerRendererItemProps, type DrawerRendererProps, type DrawersRegistryRecord, DropdownStyleMenuTrigger, type DropdownStyleMenuTriggerProps, EditTeamIntegrationTile, type EditTeamIntegrationTileProps, ErrorMessage, type ErrorMessageProps, FieldMessage, type FieldMessageProps, Fieldset, type FieldsetProps, FilterChip, FlexiCard, FlexiCardTitle, type GroupedOption, Heading, type HeadingProps, HexModalBackground, HorizontalRhythm, Icon, IconButton, type IconButtonProps, type IconColor, type IconName, type IconProps, type IconType, IconsProvider, Image, ImageBroken, type ImageProps, InfoMessage, type InfoMessageProps, Input, InputComboBox, type InputComboBoxOption, type InputComboBoxProps, InputCreatableComboBox, type InputCreatableComboBoxProps, InputInlineSelect, type InputInlineSelectOption, type InputInlineSelectProps, InputKeywordSearch, type InputKeywordSearchProps, type InputProps, InputSelect, type InputSelectProps, InputTime, type InputTimeProps, InputToggle, type InputToggleProps, IntegrationComingSoon, type IntegrationComingSoonProps, IntegrationLoadingTile, type IntegrationLoadingTileProps, IntegrationModalHeader, type IntegrationModalHeaderProps, IntegrationModalIcon, type IntegrationModalIconProps, IntegrationTile, type IntegrationTileProps, type IsoDateString, type IsoDateTimeString, type IsoTimeString, JsonEditor, type JsonEditorProps, KeyValueInput, type KeyValueInputProps, type KeyValueItem, Label, LabelLeadingIcon, type LabelLeadingIconProps, type LabelOption, type LabelProps, LabelsQuickFilter, type LabelsQuickFilterItem, type LabelsQuickFilterProps, Legend, type LegendProps, type LevelProps, LimitsBar, type LimitsBarProps, Link, LinkButton, type LinkButtonProps, type LinkColorProps, LinkList, type LinkListProps, type LinkManagerWithRefType, LinkNode, type LinkProps, LinkTile, type LinkTileWithRefProps, LinkWithRef, LoadingCardSkeleton, LoadingIcon, type LoadingIconProps, LoadingIndicator, LoadingOverlay, type LoadingOverlayProps, Menu, MenuButton, type MenuButtonProp, MenuGroup, type MenuGroupProps, MenuItem, MenuItemEmptyIcon, MenuItemIcon, MenuItemInner, type MenuItemProps, MenuItemSeparator, type MenuItemTextThemeProps, type MenuProps, MenuSelect, MenuThreeDots, type MenuThreeDotsProps, Modal, ModalDialog, type ModalDialogProps, type ModalProps, MultilineChip, type MultilineChipProps, ObjectGridContainer, type ObjectGridContainerProps, ObjectGridItem, ObjectGridItemCardCover, type ObjectGridItemCardCoverProps, ObjectGridItemCover, ObjectGridItemCoverButton, type ObjectGridItemCoverButtonProps, type ObjectGridItemCoverProps, ObjectGridItemHeading, ObjectGridItemIconWithTooltip, type ObjectGridItemIconWithTooltipProps, ObjectGridItemLoadingSkeleton, type ObjectGridItemProps, type ObjectGridItemTitleProps, ObjectItemLoadingSkeleton, type ObjectItemLoadingSkeletonProps, ObjectListItem, ObjectListItemContainer, ObjectListItemCover, type ObjectListItemCoverProps, ObjectListItemHeading, type ObjectListItemHeadingProps, type ObjectListItemProps, PageHeaderSection, type PageHeaderSectionProps, Pagination, Paragraph, type ParagraphProps, ParameterActionButton, type ParameterActionButtonProps, ParameterDrawerHeader, type ParameterDrawerHeaderProps, ParameterGroup, type ParameterGroupProps, ParameterImage, ParameterImageInner, ParameterImagePreview, type ParameterImageProps, ParameterInput, ParameterInputInner, type ParameterInputProps, ParameterLabel, type ParameterLabelProps, ParameterLabels, ParameterLabelsInner, ParameterLink, ParameterLinkInner, type ParameterLinkProps, ParameterMenuButton, type ParameterMenuButtonProps, ParameterMultiSelect, ParameterMultiSelectInner, type ParameterMultiSelectOption, type ParameterMultiSelectProps, ParameterNameAndPublicIdInput, type ParameterNameAndPublicIdInputProps, ParameterNumberSlider, ParameterNumberSliderInner, type ParameterNumberSliderProps, ParameterOverrideMarker, ParameterRichText, ParameterRichTextInner, type ParameterRichTextInnerProps, type ParameterRichTextProps, ParameterSelect, ParameterSelectInner, type ParameterSelectProps, ParameterSelectSlider, ParameterSelectSliderInner, type ParameterSelectSliderProps, ParameterShell, ParameterShellContext, ParameterShellPlaceholder, type ParameterShellProps, ParameterTextarea, ParameterTextareaInner, type ParameterTextareaProps, ParameterToggle, ParameterToggleInner, type ParameterToggleProps, Popover, PopoverBody, type PopoverBodyProps, type PopoverProps, ProgressBar, type ProgressBarProps, ProgressList, ProgressListItem, type ProgressListItemProps, type ProgressListProps, QuickFilter, type QuickFilterSelectedItem, type RegisterDrawerProps, ResolveIcon, type ResolveIconProps, ResponsiveTableContainer, type RhythmProps, type RichTextParamValue, RichTextToolbarIcon, type ScrollableItemProps, ScrollableList, type ScrollableListContainerProps, ScrollableListInputItem, ScrollableListItem, type ScrollableListItemProps, type ScrollableListProps, SearchableMenu, type SearchableMenuProps, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, SelectableMenuItem, type SelectableMenuItemProps, type SerializedLinkNode, type ShortcutReference, Skeleton, type SkeletonProps, Slider, SliderLabels, type SliderLabelsProps, type SliderOption, type SliderProps, Spinner, StackedModal, type StackedModalProps, StackedModalStep, type StackedModalStepProps, StatusBullet, type StatusBulletProps, type StatusTypeProps, type StepTransitionState, SuccessMessage, type SuccessMessageProps, Swatch, SwatchComboBox, SwatchComboBoxLabelStyles, SwatchLabel, type SwatchLabelProps, SwatchLabelRemoveButton, SwatchLabelTooltip, type SwatchProps, type SwatchSize, type SwatchVariant, Switch, type SwitchProps, TAKEOVER_STACK_ID, TabButton, TabButtonGroup, type TabButtonProps, TabContent, type TabContentProps, Table, TableBody, type TableBodyProps, TableCellData, type TableCellDataProps, TableCellHead, type TableCellHeadProps, TableFoot, type TableFootProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tabs, type TabsProps, TakeoverDrawerRenderer, type TextAlignProps, Textarea, type TextareaProps, Theme, type ThemeProps, type TickMark, Tile, TileContainer, type TileContainerProps, type TileProps, TileText, type TileTitleProps, ToastContainer, type ToastContainerProps, Tooltip, type TooltipProps, TwoColumnLayout, type TwoColumnLayoutProps, UniformBadge, UniformLogo, UniformLogoLarge, type UniformLogoProps, type UseShortcutOptions, type UseShortcutResult, VerticalRhythm, WarningMessage, type WarningMessageProps, accessibleHidden, actionBarVisibilityStyles, addPathSegmentToPathname, borderTopIcon, breakpoints, button, buttonAccentAltDark, buttonAccentAltDarkOutline, buttonDestructive, buttonDisabled, buttonGhost, buttonGhostDestructive, buttonGhostUnimportant, buttonPrimary, buttonPrimaryInvert, buttonRippleEffect, buttonSecondary, buttonSecondaryInvert, buttonSoftAccentPrimary, buttonSoftAlt, buttonSoftDestructive, buttonSoftPrimary, buttonSoftTertiary, buttonTertiary, buttonTertiaryOutline, buttonUnimportant, canvasAlertIcon, cardIcon, chatIcon, convertComboBoxGroupsToSelectableGroups, cq, customIcons, debounce, extractParameterProps, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeInTop, fadeOutBottom, fullWidthScreenIcon, getButtonSize, getButtonStyles, getComboBoxSelectedSelectableGroups, getDrawerAttributes, getFormattedShortcut, getParentPath, getPathSegment, growSubtle, imageTextIcon, infoFilledIcon, input, inputError, inputSelect, isSecureURL, isValidUrl, jsonIcon, labelText, mq, numberInput, prefersReducedMotion, queryStringIcon, rectangleRoundedIcon, replaceUnderscoreInString, richTextToolbarButton, richTextToolbarButtonActive, ripple, scrollbarStyles, settings, settingsIcon, skeletonLoading, slideInRtl, slideInTtb, spin, structurePanelIcon, supports, swatchColors, swatchVariant, textInput, uniformAiIcon, uniformComponentIcon, uniformComponentPatternIcon, uniformCompositionPatternIcon, uniformConditionalValuesIcon, uniformContentTypeIcon, uniformEntryIcon, uniformEntryPatternIcon, uniformLocaleDisabledIcon, uniformLocaleIcon, uniformStatusDraftIcon, uniformStatusModifiedIcon, uniformStatusPublishedIcon, uniformUsageStatusIcon, useBreakpoint, useButtonStyles, useCloseCurrentDrawer, useCurrentDrawer, useCurrentTab, useDateTimePickerContext, useDrawer, useIconContext, useImageLoadFallback, useOutsideClick, useParameterShell, usePopoverComponentContext, useRichTextToolbarState, useShortcut, useStackedModal, functionalColors as utilityColors, warningIcon, yesNoIcon, zigZag, zigZagThick };