@box/blueprint-web 5.31.3

package/lib-esm/switch/types.d.ts

@@ -0,0 +1,32 @@
+import { type SwitchProps as RadixSwitchProps } from '@radix-ui/react-switch';
+import { type RequireAllOrNone } from 'type-fest';
+import { type StyledText } from '../utils/commonTypes';
+type DescriptionInfo = {
+    /** Additional text to aid in use. It will appear inside info icon tooltip in the description. */
+    descriptionInfoText?: StyledText;
+    /** aria-label for the description badge button. */
+    descriptionInfoBadgeAriaLabel?: string;
+};
+type LabelInfo = {
+    /** Additional text to aid in use. It will appear inside info icon tooltip in the label. */
+    labelInfoText?: StyledText;
+    /** aria-label for the label badge button. */
+    labelInfoBadgeAriaLabel?: string;
+};
+export type SwitchProps = RadixSwitchProps & {
+    /** The checked state of the switch. */
+    checked: boolean;
+    /** The value given as data when submitted with a name. */
+    value: string;
+    /** The label for the switch. */
+    label: string;
+    /** Additional text to aid in use. */
+    description?: StyledText;
+    /** When true, prevents the user from interacting with the switch. */
+    disabled?: boolean;
+    /** Whether the switch should be disabled to the right of the label. */
+    rightAligned?: boolean;
+    /** Event handler called when the checked state of the switch changes. */
+    onCheckedChange: (checked: boolean) => void;
+} & RequireAllOrNone<LabelInfo, keyof LabelInfo> & RequireAllOrNone<DescriptionInfo, keyof DescriptionInfo>;
+export {};

package/lib-esm/text/index.d.ts

@@ -0,0 +1,2 @@
+export { Text } from './text';
+export { type TextProps } from './types';

package/lib-esm/text/text.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { type ElementTypes, type TextProps } from './types';
+export declare const Text: import("react").ForwardRefExoticComponent<TextProps & import("react").RefAttributes<ElementTypes>>;
+export default Text;

package/lib-esm/text/text.js

@@ -0,0 +1,21 @@
+import clsx from 'clsx';
+import { forwardRef, createElement } from 'react';
+import styles from './text.module.js';
+
+const Text = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  const {
+    as = 'p',
+    variant = 'bodyDefault',
+    color = 'textOnLightDefault',
+    children,
+    className,
+    ...rest
+  } = props;
+  return /*#__PURE__*/createElement(as, {
+    ...rest,
+    ref: forwardedRef,
+    className: clsx(styles.textReset, styles.breakWord, styles[variant], styles[color], className)
+  }, children);
+});
+
+export { Text, Text as default };

package/lib-esm/text/text.module.js

@@ -0,0 +1,4 @@
+import '../index.css';
+var styles = {"textReset":"text-module_textReset__iWLc6","breakWord":"text-module_breakWord__xF12-","textOnLightDefault":"text-module_textOnLightDefault__fdokS","textOnLightSecondary":"text-module_textOnLightSecondary__2dHCd","textOnLightLink":"text-module_textOnLightLink__fWmMi","textOnDarkDefault":"text-module_textOnDarkDefault__EZjM5","titleMondo":"text-module_titleMondo__CujOX","titleXLarge":"text-module_titleXLarge__q3G4A","titleLarge":"text-module_titleLarge__XGV7U","titleMedium":"text-module_titleMedium__fyXXA","titleSmall":"text-module_titleSmall__22d6A","subtitle":"text-module_subtitle__qJtJk","bodyLargeBold":"text-module_bodyLargeBold__JCDyI","bodyLarge":"text-module_bodyLarge__Sxvog","bodyDefaultBold":"text-module_bodyDefaultBold__ypwTi","bodyDefaultSemibold":"text-module_bodyDefaultSemibold__Aiszl","bodyDefault":"text-module_bodyDefault__WfqKw","caption":"text-module_caption__Mutcw","labelBold":"text-module_labelBold__5pqpC","label":"text-module_label__ZkB-K"};
+
+export { styles as default };

package/lib-esm/text/types.d.ts

@@ -0,0 +1,34 @@
+import { type HTMLAttributes } from 'react';
+import { type StyledText } from '../utils/commonTypes';
+type TypographyVariant = 'titleMondo' | 'titleXLarge' | 'titleLarge' | 'titleMedium' | 'titleSmall' | 'subtitle' | 'bodyLargeBold' | 'bodyLarge' | 'bodyDefaultBold' | 'bodyDefaultSemibold' | 'bodyDefault' | 'caption' | 'labelBold' | 'label';
+type TypographyColors = 'textOnLightDefault' | 'textOnLightSecondary' | 'textOnLightLink' | 'textOnDarkDefault';
+type Element = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'legend';
+interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
+    as: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+}
+interface ParagraphProps extends HTMLAttributes<HTMLParagraphElement> {
+    as: 'p';
+}
+interface SpanProps extends HTMLAttributes<HTMLSpanElement> {
+    as: 'span';
+}
+interface LegendProps extends HTMLAttributes<HTMLLegendElement> {
+    as: 'legend';
+}
+/** Supported HTML elements for text */
+export type ElementTypes = HeadingProps | ParagraphProps | LegendProps | SpanProps;
+export type TextProps = {
+    /** The HTML element type which will render */
+    as: Element;
+    /** Typographic style of text
+     * @default body-default
+     */
+    variant?: TypographyVariant;
+    /** Content of the component */
+    children?: StyledText;
+    /** Adjust color of text
+     * @default text-on-light-default
+     */
+    color?: TypographyColors;
+} & ElementTypes;
+export {};

package/lib-esm/text-area/index.d.ts

@@ -0,0 +1,2 @@
+export { TextArea } from './text-area';
+export { type TextAreaProps } from './types';

package/lib-esm/text-area/text-area-autosize/text-area-autosize.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+declare const TextAreaAutosize: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, "children" | "rows"> & {
+    ref?: import("react").Ref<HTMLTextAreaElement> | undefined;
+    maxRows?: number | undefined;
+    minRows?: number | undefined;
+    hasError?: boolean | undefined;
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, "ref"> & import("react").RefAttributes<Element>>;
+export default TextAreaAutosize;

package/lib-esm/text-area/text-area-autosize/text-area-autosize.js

@@ -0,0 +1,322 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { forwardRef, useRef, useState, useCallback, useEffect } from 'react';
+import { flushSync } from 'react-dom';
+import { BorderInputBorderHover, Border1, BorderInputBorderFocus, Border2, BorderInputBorderError } from '@box/blueprint-web-assets/tokens/tokens';
+import { LoadingIndicator } from '../../loading-indicator/loading-indicator.js';
+import { debounce } from '../../utils/debounce.js';
+import { ownerWindow } from '../../utils/ownerWindow.js';
+import { useEnhancedEffect } from '../../utils/useEnhancedEffect.js';
+import { useForkRef } from '../../utils/useForkRef.js';
+import styles from './text-area-autosize.module.js';
+
+function convertToDecimalNumber(value) {
+  return parseInt(value, 10) || 0;
+}
+function getBoxShadowStyle(width, color) {
+  return `0px 0px 0px ${width} ${color}`;
+}
+const getScrollbarWidth = () => {
+  const outer = document.createElement('div');
+  outer.style.visibility = 'hidden';
+  outer.style.width = '100px';
+  document.body.appendChild(outer);
+  const widthNoScroll = outer.offsetWidth;
+  outer.style.overflow = 'scroll';
+  const inner = document.createElement('div');
+  inner.style.width = '100%';
+  outer.appendChild(inner);
+  const widthWithScroll = inner.offsetWidth;
+  outer?.parentNode?.removeChild(outer);
+  return widthNoScroll - widthWithScroll;
+};
+const hiddenTextAreaStyle = {
+  shadow: {
+    // hide from user
+    visibility: 'hidden',
+    // Remove from the content flow
+    position: 'absolute',
+    // Ignore the scrollbar width
+    overflow: 'hidden',
+    height: 0,
+    top: 0,
+    left: 0,
+    // Create a new layer, increase the isolation of the computed values
+    transform: 'translateZ(0)'
+  }
+};
+function isEmpty(obj) {
+  return obj === undefined || obj === null || Object.keys(obj).length === 0 || obj.outerHeightStyle === 0 && !obj.overflow;
+}
+const TextAreaAutosize = /*#__PURE__*/forwardRef(function TextAreaAutosize(props, ref) {
+  const {
+    onChange,
+    maxRows,
+    minRows = 1,
+    style: inlineStyle,
+    value,
+    hasError,
+    loading = false,
+    loadingAriaLabel,
+    onFocus,
+    onBlur,
+    ...rest
+  } = props;
+  const {
+    current: isControlled
+  } = useRef(value != null);
+  const inputRef = useRef(null);
+  const handleRef = useForkRef(ref, inputRef);
+  const shadowRef = useRef(null);
+  const renders = useRef(0);
+  const [state, setState] = useState({
+    outerHeightStyle: 0
+  });
+  const [isFocused, setIsFocused] = useState(false);
+  const [isScrollbarVisible, setIsScrollbarVisible] = useState(false);
+  const isLoading = !props.disabled && loading && loadingAriaLabel;
+  const focusTextArea = useCallback(() => {
+    inputRef.current?.focus();
+  }, []);
+  const getUpdatedState = useCallback(() => {
+    const fallbackHeight = {
+      outerHeightStyle: 0
+    };
+    if (!inputRef.current) {
+      return fallbackHeight;
+    }
+    const input = inputRef.current;
+    const containerWindow = ownerWindow(input);
+    const computedStyle = containerWindow.getComputedStyle(input);
+    // If input's width is shrunk and it's not visible, don't sync height.
+    if (computedStyle.width === '0px') {
+      return fallbackHeight;
+    }
+    if (!shadowRef.current) {
+      return fallbackHeight;
+    }
+    const inputShallow = shadowRef.current;
+    inputShallow.style.width = computedStyle.width;
+    inputShallow.value = input.value || props.placeholder || 'x';
+    if (inputShallow.value.slice(-1) === '\n') {
+      // Certain fonts which overflow the line height will cause the textarea
+      // to report a different scrollHeight depending on whether the last line
+      // is empty. Make it non-empty to avoid this issue.
+      inputShallow.value += ' ';
+    }
+    const {
+      boxSizing
+    } = computedStyle;
+    const padding = convertToDecimalNumber(computedStyle.paddingBottom) + convertToDecimalNumber(computedStyle.paddingTop);
+    const border = convertToDecimalNumber(computedStyle.borderBottomWidth) + convertToDecimalNumber(computedStyle.borderTopWidth);
+    // The height of the inner content
+    const innerHeight = inputShallow.scrollHeight;
+    // Measure height of a textarea with a single row
+    inputShallow.value = 'x';
+    const singleRowHeight = inputShallow.scrollHeight;
+    // The height of the outer content
+    let outerHeight = innerHeight;
+    if (minRows) {
+      outerHeight = Math.max(Number(minRows) * singleRowHeight, outerHeight);
+    }
+    if (maxRows) {
+      outerHeight = Math.min(Number(maxRows) * singleRowHeight, outerHeight);
+    }
+    outerHeight = Math.max(outerHeight, singleRowHeight);
+    // Take the box sizing into account for applying this value as a style.
+    const outerHeightStyle = outerHeight + (boxSizing === 'border-box' ? padding + border : 0);
+    const overflow = Math.abs(outerHeight - innerHeight) <= 1;
+    return {
+      outerHeightStyle,
+      overflow
+    };
+  }, [maxRows, minRows, props.placeholder]);
+  const updateState = (prevState, newState) => {
+    const {
+      outerHeightStyle,
+      overflow
+    } = newState;
+    // Need a large enough difference to update the height.
+    // This prevents infinite rendering loop.
+    if (renders.current < 20 && (outerHeightStyle > 0 && Math.abs((prevState.outerHeightStyle || 0) - outerHeightStyle) > 1 || prevState.overflow !== overflow)) {
+      renders.current += 1;
+      return {
+        overflow,
+        outerHeightStyle
+      };
+    }
+    if (process.env.NODE_ENV !== 'production') {
+      if (renders.current === 20) {
+        /* eslint-disable-next-line no-console */
+        console.error(['Too many re-renders. The layout is unstable.', 'TextAreaAutosize limits the number of renders to prevent an infinite loop.'].join('\n'));
+      }
+    }
+    return prevState;
+  };
+  const syncHeight = useCallback(() => {
+    const newState = getUpdatedState();
+    if (isEmpty(newState)) {
+      return;
+    }
+    setState(prevState => {
+      return updateState(prevState, newState);
+    });
+  }, [getUpdatedState]);
+  const syncHeightWithFlushSync = () => {
+    const newState = getUpdatedState();
+    if (isEmpty(newState)) {
+      return;
+    }
+    // In React 18, state updates in a ResizeObserver's callback are happening after the paint which causes flickering
+    // when doing some visual updates in it. Using flushSync ensures that the dom will be painted after the states updates happen
+    // Related issue - https://github.com/facebook/react/issues/24331
+    flushSync(() => {
+      setState(prevState => {
+        return updateState(prevState, newState);
+      });
+    });
+  };
+  useEffect(() => {
+    const handleResize = debounce(() => {
+      renders.current = 0;
+      // If the TextAreaAutosize component is replaced by Suspense with a fallback, the last
+      // ResizeObserver's handler that runs because of the change in the layout is trying to
+      // access a dom node that is no longer there (as the fallback component is being shown instead).
+      // See https://github.com/mui/material-ui/issues/32640
+      if (inputRef.current) {
+        syncHeightWithFlushSync();
+      }
+    }, 200);
+    const input = inputRef.current;
+    let containerWindow;
+    let resizeObserver;
+    if (input) {
+      containerWindow = ownerWindow(input);
+      containerWindow.addEventListener('resize', handleResize);
+      if (typeof ResizeObserver !== 'undefined') {
+        resizeObserver = new ResizeObserver(handleResize);
+        resizeObserver.observe(input);
+      }
+    }
+    return () => {
+      if (!containerWindow) {
+        return;
+      }
+      handleResize.clear();
+      containerWindow.removeEventListener('resize', handleResize);
+      if (resizeObserver) {
+        resizeObserver.disconnect();
+      }
+    };
+  });
+  useEnhancedEffect(() => {
+    syncHeight();
+  });
+  useEffect(() => {
+    renders.current = 0;
+  }, [value]);
+  const handleChange = event => {
+    renders.current = 0;
+    if (!isControlled) {
+      syncHeight();
+    }
+    if (onChange) {
+      onChange(event);
+    }
+  };
+  /**
+   * MacOs has system specific setting for scroll visibility
+   * detect if it's always visible or not to adjust
+   * relevant styling
+   */
+  useEffect(() => {
+    setIsScrollbarVisible(getScrollbarWidth() > 0);
+  }, []);
+  // border management
+  const handleBlur = e => {
+    setIsFocused(false);
+    if (onBlur) {
+      onBlur(e);
+    }
+  };
+  const handleFocus = e => {
+    setIsFocused(true);
+    if (onFocus) {
+      onFocus(e);
+    }
+  };
+  const handleHover = e => {
+    if (isFocused || rest.disabled || hasError) {
+      return;
+    }
+    e.currentTarget.style.boxShadow = getBoxShadowStyle(Border1, BorderInputBorderHover);
+  };
+  const handleOnMouseOut = e => {
+    if (isFocused || rest.disabled || hasError) {
+      return;
+    }
+    e.currentTarget.style.boxShadow = '';
+  };
+  let borderInlineStyle = {};
+  if (isFocused) {
+    borderInlineStyle = {
+      boxShadow: getBoxShadowStyle(Border2, BorderInputBorderFocus)
+    };
+  } else if (hasError) {
+    borderInlineStyle = {
+      boxShadow: getBoxShadowStyle(Border2, BorderInputBorderError)
+    };
+  }
+  const classNames = clsx([styles.textArea], {
+    [styles.error]: hasError,
+    [styles.loading]: isLoading
+  });
+  const shouldCompensateScrollbar = !state.overflow && !isScrollbarVisible && (hasError || isLoading);
+  return jsxs("div", {
+    className: styles.border,
+    onMouseEnter: handleHover,
+    onMouseLeave: handleOnMouseOut,
+    style: borderInlineStyle,
+    children: [jsx("textarea", {
+      ...rest,
+      ref: handleRef,
+      className: classNames,
+      onBlur: handleBlur,
+      onChange: handleChange,
+      onFocus: handleFocus,
+      // Apply the rows prop to get a "correct" first SSR paint
+      rows: minRows,
+      style: {
+        height: state.outerHeightStyle,
+        // Need a large enough difference to allow scrolling.
+        // This prevents infinite rendering loop.
+        overflow: state.overflow ? 'hidden' : undefined,
+        ...(shouldCompensateScrollbar ? {
+          paddingInlineEnd: '3rem'
+        } : {}),
+        ...inlineStyle
+      },
+      value: value
+    }), jsx("textarea", {
+      ref: shadowRef,
+      "aria-hidden": true,
+      className: classNames,
+      readOnly: true,
+      style: {
+        ...hiddenTextAreaStyle.shadow,
+        ...inlineStyle,
+        padding: 0
+      },
+      tabIndex: -1
+    }), isLoading && jsx(LoadingIndicator, {
+      "aria-label": loadingAriaLabel,
+      className: styles.loadingIndicator,
+      onClick: focusTextArea,
+      style: !state.overflow ? {
+        right: '0.75rem'
+      } : {}
+    })]
+  });
+});
+
+export { TextAreaAutosize as default };

package/lib-esm/text-area/text-area-autosize/text-area-autosize.module.js

@@ -0,0 +1,4 @@
+import '../../index.css';
+var styles = {"textArea":"text-area-autosize-module_textArea__o-VaJ","error":"text-area-autosize-module_error__EK-A-","loading":"text-area-autosize-module_loading__Ta3eU","loadingIndicator":"text-area-autosize-module_loadingIndicator__a2x4B","border":"text-area-autosize-module_border__EhP4k"};
+
+export { styles as default };

package/lib-esm/text-area/text-area-autosize/types.d.ts

@@ -0,0 +1,21 @@
+import { type Ref, type TextareaHTMLAttributes } from 'react';
+export type TextareaAutosizeProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'children' | 'rows'> & {
+    ref?: Ref<HTMLTextAreaElement>;
+    /**
+     * Maximum number of rows to display.
+     */
+    maxRows?: number;
+    /**
+     * Minimum number of rows to display.
+     * @default 1
+     */
+    minRows?: number;
+    /**
+     * control error state of TextArea
+     */
+    hasError?: boolean;
+    /** When `true` TextArea is rendered with loading indicator. When this is true `loadingAriaLabel` must also be provided. */
+    loading?: boolean;
+    /** The aria-label for the loading indicator. */
+    loadingAriaLabel?: string;
+};

package/lib-esm/text-area/text-area.d.ts

@@ -0,0 +1,36 @@
+/// <reference types="react" />
+export declare const TextArea: import("react").ForwardRefExoticComponent<(Omit<Omit<import("./text-area-autosize/types").TextareaAutosizeProps, "hasError"> & {
+    label: string;
+    hideLabel?: boolean | undefined;
+    disabled?: boolean | undefined;
+    required?: boolean | undefined;
+    error?: import("react").ReactNode;
+} & Required<Pick<{
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, keyof {
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}>> & Omit<{
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, keyof {
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}>, "ref"> | Omit<Omit<import("./text-area-autosize/types").TextareaAutosizeProps, "hasError"> & {
+    label: string;
+    hideLabel?: boolean | undefined;
+    disabled?: boolean | undefined;
+    required?: boolean | undefined;
+    error?: import("react").ReactNode;
+} & Partial<Record<keyof {
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, never>> & Omit<{
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, keyof {
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}>, "ref">) & import("react").RefAttributes<HTMLTextAreaElement>>;
+export default TextArea;

package/lib-esm/text-area/text-area.js

@@ -0,0 +1,57 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { InlineError } from '../primitives/inline-error/inline-error.js';
+import { useUniqueId } from '../utils/useUniqueId.js';
+import TextAreaAutosize from './text-area-autosize/text-area-autosize.js';
+import styles from './text-area.module.js';
+
+const TextArea = /*#__PURE__*/forwardRef((props, forwardedRef) => {
+  const {
+    className,
+    label,
+    disabled,
+    hideLabel,
+    error,
+    loading = false,
+    loadingAriaLabel,
+    required = false,
+    maxRows,
+    ...rest
+  } = props;
+  const textAreaId = useUniqueId('text-area-');
+  const hasError = !!error && !disabled;
+  return jsxs("div", {
+    className: clsx([styles.textAreaContainer], {
+      [styles.disabled]: disabled,
+      [styles.error]: hasError
+    }, className),
+    children: [jsx("label", {
+      className: clsx([styles.label], {
+        [styles.hidden]: hideLabel
+      }),
+      htmlFor: textAreaId,
+      children: hideLabel ? jsx(VisuallyHidden, {
+        children: label
+      }) : label
+    }), jsx(TextAreaAutosize, {
+      ...rest,
+      ref: forwardedRef,
+      "aria-invalid": hasError,
+      "aria-required": required,
+      disabled: disabled,
+      hasError: hasError,
+      id: textAreaId,
+      loading: loading,
+      loadingAriaLabel: loadingAriaLabel,
+      maxRows: maxRows,
+      required: required
+    }), jsx(InlineError, {
+      className: styles.inlineError,
+      children: error
+    })]
+  });
+});
+
+export { TextArea, TextArea as default };

package/lib-esm/text-area/text-area.module.js

@@ -0,0 +1,4 @@
+import '../index.css';
+var styles = {"textAreaContainer":"text-area-module_textAreaContainer__zCiZe","label":"text-area-module_label__Vqw6s","hidden":"text-area-module_hidden__bdSxq","disabled":"text-area-module_disabled__7TavF","inlineError":"text-area-module_inlineError__-8PXm"};
+
+export { styles as default };

package/lib-esm/text-area/types.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { type RequireAllOrNone } from 'type-fest';
+import { type TextareaAutosizeProps } from './text-area-autosize/types';
+type Loading = {
+    /** When `true` TextArea is rendered with loading indicator. When this is true `loadingAriaLabel` must also be provided. */
+    loading?: boolean;
+    /** The aria-label for the loading indicator. */
+    loadingAriaLabel?: string;
+};
+export type TextAreaProps = Omit<TextareaAutosizeProps, 'hasError'> & {
+    /** The label for text area */
+    label: string;
+    /** When true label text is hidden */
+    hideLabel?: boolean;
+    /** When true prevents user interaction with text area */
+    disabled?: boolean;
+    /** When true it indicates text area field must be filled out */
+    required?: boolean;
+    /** Content of error message */
+    error?: React.ReactNode;
+} & RequireAllOrNone<Loading, keyof Loading>;
+export {};

package/lib-esm/text-button/index.d.ts

@@ -0,0 +1,2 @@
+export { TextButton } from './text-button';
+export { type TextButtonProps } from './types';

package/lib-esm/text-button/text-button.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+export declare const TextButton: import("react").ForwardRefExoticComponent<(Omit<import("./types").TextButtonBase & Required<Pick<{
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, keyof {
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}>> & Omit<{
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, keyof {
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}>, "ref"> | Omit<import("./types").TextButtonBase & Partial<Record<keyof {
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, never>> & Omit<{
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}, keyof {
+    loading?: boolean | undefined;
+    loadingAriaLabel?: string | undefined;
+}>, "ref">) & import("react").RefAttributes<HTMLButtonElement>>;
+export default TextButton;