@tap-payments/os-micro-frontend-shared 0.3.165 → 0.3.167

package/build/components/primitives/Badge/type.d.ts

@@ -1,8 +1,12 @@
 import type { SxProps, Theme } from '@mui/material/styles';
-export type BadgeColor = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'inactive' | 'active' | 'dark' | 'neutral' | 'gray' | 'orange' | 'red';
+export type BadgeColor = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'inactive' | 'active' | 'highlight' | 'dark' | 'neutral' | 'gray' | 'orange' | 'red';
+/** Figma Tap DS states — subset of `BadgeColor`. */
+export type BadgeState = Extract<BadgeColor, 'active' | 'inactive' | 'highlight'>;
 export interface BadgeProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {
-    /** Visual colour style of the badge */
+    /** Visual colour / Figma state. `highlight` is Gradient/Brand. */
     color?: BadgeColor;
+    /** Figma state alias — used when `color` is omitted */
+    state?: BadgeState;
     /** Compact size — overrides round dimensions when both are set */
     compact?: boolean;
     /** Round shape with tighter horizontal padding */

package/build/components/primitives/Button/constants.d.ts

@@ -53,4 +53,3 @@ export declare const buttonIconOnlySizeStyles: {
     };
 };
 export declare const buttonSpinnerSizeBySize: Record<ButtonSize, number>;
-export declare const buttonIconSizePx = 16;

package/build/components/primitives/Chip/Chip.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import type { ChipProps } from './type';
-declare const _default: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<ChipProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
+declare const _default: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<Readonly<ChipProps>, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
 export default _default;

package/build/components/primitives/Chip/constants.d.ts

@@ -6,5 +6,29 @@ export declare const chipClassNames: {
     readonly icon: "os-shared-Chip-icon";
 };
 export type ChipClassNames = (typeof chipClassNames)[keyof typeof chipClassNames];
-export declare const chipCopyFeedbackMs = 2000;
-export declare const chipCopyTransitionMs = 150;
+/**
+ * Figma Data Chip Style → ChipVariant:
+ * `text` = Label, `circular` = Icon (24×24), `pill-icon` = Icon Wide (36×24).
+ * Padding / radius values are pixel tokens for `theme.v2.spacing` / `theme.v2.radius`.
+ */
+export declare const chipVariantStyles: {
+    readonly text: {
+        readonly height: 24;
+        readonly paddingBlock: 4;
+        readonly paddingInline: 8;
+        readonly borderRadius: 48;
+    };
+    readonly circular: {
+        readonly height: 24;
+        readonly width: 24;
+        readonly padding: 4;
+        readonly borderRadius: 12;
+    };
+    readonly 'pill-icon': {
+        readonly height: 24;
+        readonly width: 36;
+        readonly paddingBlock: 4;
+        readonly paddingInline: 6;
+        readonly borderRadius: 12;
+    };
+};

package/build/components/primitives/Chip/style.d.ts

@@ -1,21 +1,23 @@
 /// <reference types="react" />
+import { type Theme } from '@mui/material/styles';
 import type { ChipVariant } from './type';
-export declare const ChipStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const ChipStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+}, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
     $variant?: ChipVariant | undefined;
     $hasIcon?: boolean | undefined;
+    $hasCopy?: boolean | undefined;
     $isSelected?: boolean | undefined;
     $disableAnimation?: boolean | undefined;
 }, {}, {}>;
 /** Label text container — a Part, not the ref target. */
-export declare const ChipTextStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const ChipTextStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+}, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
 /** Copy icon Part — owned by Chip so this primitive stays independent of `CopyButton`. */
-export declare const ChipCopyButtonStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+export declare const ChipCopyButtonStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme> & {
     $copied?: boolean | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const ChipCopyButtonIconStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+export declare const ChipCopyButtonIconStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme> & {
     $visible: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/build/components/primitives/Chip/type.d.ts

@@ -3,7 +3,7 @@ import type { SxProps, Theme } from '@mui/material/styles';
 import type { PropsWithChildren, ReactElement } from 'react';
 export type ChipVariant = 'text' | 'circular' | 'pill-icon';
 export interface ChipProps extends PropsWithChildren<Omit<BoxProps, 'variant'>> {
-    /** Visual shape — text (default), circular (avatar-style), or pill-icon */
+    /** Visual shape — text (default), circular, or pill-icon */
     variant?: ChipVariant;
     /** Icon element shown to the left of the chip label */
     icon?: ReactElement | null;

package/build/components/primitives/Collapse/constants.d.ts

@@ -3,5 +3,3 @@ export declare const collapseClassNames: {
     readonly root: "os-shared-Collapse-root";
 };
 export type CollapseClassNames = (typeof collapseClassNames)[keyof typeof collapseClassNames];
-export declare const collapseDefaultUnmountOnExit = true;
-export declare const collapseDefaultTimeoutMs = 300;

package/build/components/primitives/CopyButton/constants.d.ts

@@ -6,5 +6,3 @@ export declare const copyButtonClassNames: {
     readonly copiedIcon: "os-shared-CopyButton-copiedIcon";
 };
 export type CopyButtonClassNames = (typeof copyButtonClassNames)[keyof typeof copyButtonClassNames];
-export declare const copyButtonDefaultFeedbackMs = 2000;
-export declare const copyButtonTransitionMs = 200;

package/build/components/primitives/Dialog/constants.d.ts

@@ -2,6 +2,7 @@ export declare const dialogClassNamePrefix: "os-shared-Dialog";
 export declare const dialogClassNames: {
     readonly root: "os-shared-Dialog-root";
     readonly title: "os-shared-Dialog-title";
+    readonly divider: "os-shared-Dialog-divider";
     readonly content: "os-shared-Dialog-content";
     readonly actions: "os-shared-Dialog-actions";
 };

package/build/components/primitives/Dialog/style.d.ts

@@ -1,2 +1,10 @@
+/// <reference types="react" />
 export declare const DialogStyled: import("@emotion/styled").StyledComponent<import("@mui/material/Dialog").DialogProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
-export declare const DialogContentStyled: import("@emotion/styled").StyledComponent<import("@mui/material/DialogContent").DialogContentProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const DialogTitleStyled: import("@emotion/styled").StyledComponent<import("@mui/material/DialogTitle").DialogTitleOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+}, "width" | "minWidth" | "minHeight" | "height" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "classes" | "align" | "className" | "style" | "children" | "gutterBottom" | "noWrap" | "paragraph" | "sx" | "variant" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const DialogDividerStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>, {}>;
+export declare const DialogContentStyled: import("@emotion/styled").StyledComponent<import("@mui/material/DialogContent").DialogContentProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+    $hasHeading?: boolean | undefined;
+}, {}, {}>;
+export declare const DialogActionsStyled: import("@emotion/styled").StyledComponent<import("@mui/material/DialogActions").DialogActionsProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/primitives/Dialog/type.d.ts

@@ -1,8 +1,11 @@
 import type { ReactNode } from 'react';
 import type { DialogProps as MuiDialogProps } from '@mui/material/Dialog';
+import type { SxProps, Theme } from '@mui/material/styles';
 export interface DialogProps extends MuiDialogProps {
-    /** Dialog heading rendered in a DialogTitle */
+    /** Dialog heading rendered in the title slot. A divider follows when this is set. */
     heading?: ReactNode;
-    /** Rendered below the content area */
+    /** Rendered in the actions footer — typically Cancel (secondary) + Confirm (primary) */
     actions?: ReactNode;
+    /** MUI sx style overrides */
+    sx?: SxProps<Theme>;
 }

package/build/components/primitives/Divider/index.d.ts

@@ -1,4 +1,4 @@
 export { default } from './Divider';
-export type { DividerProps } from './type';
+export type { DividerProps, DividerType } from './type';
 export { dividerClassNames } from './constants';
 export type { DividerClassNames } from './constants';

package/build/components/primitives/Divider/style.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
+import { type Theme } from '@mui/material/styles';
+import type { DividerType } from './type';
 export declare const DividerStyled: import("@emotion/styled").StyledComponent<import("@mui/material/Divider").DividerOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>, "ref"> & {
     ref?: ((instance: HTMLHRElement | null) => void) | import("react").RefObject<HTMLHRElement> | null | undefined;
-}, "textAlign" | "light" | "classes" | "className" | "style" | "children" | "sx" | "variant" | "absolute" | "orientation" | "flexItem"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+}, "textAlign" | "light" | "classes" | "className" | "style" | "children" | "sx" | "variant" | "absolute" | "orientation" | "flexItem"> & import("@mui/system").MUIStyledCommonProps<Theme> & {
+    $type?: DividerType | undefined;
+}, {}, {}>;

package/build/components/primitives/Divider/type.d.ts

@@ -1,6 +1,10 @@
 import type { DividerProps as MuiDividerProps } from '@mui/material/Divider';
 import type { SxProps, Theme } from '@mui/material/styles';
+/** Tap DS Type — Default (Gray/100) or Subtle (lighter break). */
+export type DividerType = 'default' | 'subtle';
 export interface DividerProps extends MuiDividerProps {
+    /** Visual weight. Figma Type: Default (Gray/100) or Subtle (border.subtle). */
+    type?: DividerType;
     /** MUI sx style overrides */
     sx?: SxProps<Theme>;
 }

package/build/components/primitives/FieldFeedback/constants.d.ts

@@ -5,3 +5,5 @@ export declare const fieldFeedbackClassNames: {
     readonly message: "os-shared-FieldFeedback-message";
 };
 export type FieldFeedbackClassNames = (typeof fieldFeedbackClassNames)[keyof typeof fieldFeedbackClassNames];
+/** v1 `custom[500]` — no equal v2 hex. */
+export declare const fieldFeedbackWarningColor = "#FF7A00";

package/build/components/primitives/Input/constants.d.ts

@@ -11,8 +11,3 @@ export declare const inputFieldHeights: {
     readonly md: 32;
     readonly labelled: 40;
 };
-/** Keys a `type="number"` field accepts natively but that produce values we never want. */
-export declare const inputBlockedNumberKeys: readonly ["e", "E", "+", "-"];
-/** Printable characters a `type="number"` field may receive under the Safari guard. */
-export declare const inputNumericCharacterPattern: RegExp;
-export declare const inputIsSafari: boolean;

package/build/components/primitives/LazyImage/constants.d.ts

@@ -4,11 +4,6 @@ export declare const lazyImageClassNames: {
     readonly root: "os-shared-LazyImage-root";
 };
 export type LazyImageClassNames = (typeof lazyImageClassNames)[keyof typeof lazyImageClassNames];
-export declare const lazyImageInnerWrapperStyle: {
-    readonly display: "flex";
-    readonly justifyContent: "center";
-    readonly alignItems: "center";
-};
 /** CSS effect bundles loaded on demand when `effect` is set. */
 export declare const lazyImageEffectAssets: {
     readonly opacity: () => Promise<{

package/build/components/primitives/Menu/constants.d.ts

@@ -4,5 +4,3 @@ export declare const menuClassNames: {
     readonly panel: "os-shared-Menu-panel";
 };
 export type MenuClassNames = (typeof menuClassNames)[keyof typeof menuClassNames];
-/** Item count above which the bottom scroll shadow appears when scrolled. */
-export declare const menuScrollShadowItemThreshold = 12;

package/build/components/primitives/RadioButton/constants.d.ts

@@ -1,22 +1,7 @@
 export declare const radioButtonClassNamePrefix: "os-shared-RadioButton";
+/** Visual circle in px (Tap DS 12×12). */
+export declare const radioButtonIconSize = 12;
 export declare const radioButtonClassNames: {
     readonly root: "os-shared-RadioButton-root";
 };
 export type RadioButtonClassNames = (typeof radioButtonClassNames)[keyof typeof radioButtonClassNames];
-export declare const radioButtonSizeConfig: {
-    readonly sm: {
-        readonly iconSize: 15;
-        readonly maxWidth: "24px";
-        readonly muiSize: "small";
-    };
-    readonly md: {
-        readonly iconSize: 18;
-        readonly maxWidth: "28px";
-        readonly muiSize: "medium";
-    };
-    readonly lg: {
-        readonly iconSize: 20;
-        readonly maxWidth: "32px";
-        readonly muiSize: "medium";
-    };
-};

package/build/components/primitives/RadioButton/icons.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { type SvgIconProps } from '@mui/material/SvgIcon';
+export declare const CheckedIcon: ({ disabled, ...props }: import("@mui/material/SvgIcon").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
+}, "color" | "fontSize" | "shapeRendering" | "classes" | "className" | "style" | "children" | "sx" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & {
+    component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    disabled?: boolean | undefined;
+}) => import("react").JSX.Element;
+export declare const UncheckedIcon: ({ disabled, ...props }: import("@mui/material/SvgIcon").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
+}, "color" | "fontSize" | "shapeRendering" | "classes" | "className" | "style" | "children" | "sx" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & {
+    component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    disabled?: boolean | undefined;
+}) => import("react").JSX.Element;

package/build/components/primitives/RadioButton/index.d.ts

@@ -1,4 +1,4 @@
 export { default } from './RadioButton';
-export type { RadioButtonProps, RadioButtonSize } from './type';
+export type { RadioButtonProps } from './type';
 export { radioButtonClassNames } from './constants';
 export type { RadioButtonClassNames } from './constants';

package/build/components/primitives/RadioButton/style.d.ts

@@ -1,27 +1 @@
-/// <reference types="react" />
-import type { RadioButtonSize } from './type';
-export declare const IconWrapperStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const RadioButtonIconStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
-    $checked?: boolean | undefined;
-    $disabled?: boolean | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const RadioButtonStyled: import("@emotion/styled").StyledComponent<import("@mui/material/Radio").RadioProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
-    $iconSize?: number | undefined;
-    $checkedColor?: string | undefined;
-    $disabledColor?: string | undefined;
-    $hoverColor?: string | undefined;
-    $maxWidth?: string | undefined;
-}, {}, {}>;
-export declare function getRadioButtonSizeConfig(size?: RadioButtonSize): {
-    readonly iconSize: 15;
-    readonly maxWidth: "24px";
-    readonly muiSize: "small";
-} | {
-    readonly iconSize: 18;
-    readonly maxWidth: "28px";
-    readonly muiSize: "medium";
-} | {
-    readonly iconSize: 20;
-    readonly maxWidth: "32px";
-    readonly muiSize: "medium";
-};
+export declare const RadioButtonStyled: import("@emotion/styled").StyledComponent<import("@mui/material/Radio").RadioProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/primitives/RadioButton/type.d.ts

@@ -1,17 +1,6 @@
 import type { RadioProps } from '@mui/material/Radio';
 import type { SxProps, Theme } from '@mui/material/styles';
-export type RadioButtonSize = 'sm' | 'md' | 'lg';
 export interface RadioButtonProps extends Omit<RadioProps, 'color' | 'size'> {
-    /** Radio circle size — sm (default), md, or lg */
-    size?: RadioButtonSize;
-    /** Fill colour of the radio circle when checked */
-    checkedColor?: string;
-    /** Fill colour of the radio circle when disabled */
-    disabledColor?: string;
-    /** Fill colour of the radio circle on hover */
-    hoverColor?: string;
-    /** Width and height of the icon in pixels */
-    iconSize?: number;
     /** MUI sx style overrides */
     sx?: SxProps<Theme>;
 }

package/build/components/primitives/ScrollLoader/constants.d.ts

@@ -3,5 +3,3 @@ export declare const scrollLoaderClassNames: {
     readonly root: "os-shared-ScrollLoader-root";
 };
 export type ScrollLoaderClassNames = (typeof scrollLoaderClassNames)[keyof typeof scrollLoaderClassNames];
-/** Distance from the bottom edge (px) before triggering the next load. */
-export declare const scrollLoaderBottomOffsetPx = 50;

package/build/components/primitives/Skeleton/constants.d.ts

@@ -3,5 +3,3 @@ export declare const skeletonClassNames: {
     readonly root: "os-shared-Skeleton-root";
 };
 export type SkeletonClassNames = (typeof skeletonClassNames)[keyof typeof skeletonClassNames];
-export declare const skeletonDefaultVariant: "rounded";
-export declare const skeletonDefaultHeightPx = 16;

package/build/components/primitives/Slider/constants.d.ts

@@ -5,4 +5,3 @@ export declare const sliderClassNames: {
     readonly thumbIcon: "os-shared-Slider-thumbIcon";
 };
 export type SliderClassNames = (typeof sliderClassNames)[keyof typeof sliderClassNames];
-export declare const sliderThumbShadow: string;

package/build/components/primitives/Textarea/constants.d.ts

@@ -5,5 +5,4 @@ export declare const textareaClassNames: {
     readonly textarea: "os-shared-Textarea-textarea";
 };
 export type TextareaClassNames = (typeof textareaClassNames)[keyof typeof textareaClassNames];
-/** Approximate row height used for labelled layout min-height hints. */
-export declare const textareaRowHeightPx = 20;
+export declare const textareaDefaultMinRows = 3;

package/build/components/primitives/Textarea/style.d.ts

@@ -4,7 +4,7 @@ export declare const TextareaStyled: import("@emotion/styled").StyledComponent<i
     $hasLabel?: boolean | undefined;
     $minRows?: number | undefined;
 }, {}, {}>;
-/** Floating label — positioned by `TextareaFieldStyled`, not part of the public restyling surface. */
+/** In-field label — positioned by `TextareaFieldStyled`, not part of the public restyling surface. */
 export declare const TextareaLabelStyled: import("@emotion/styled").StyledComponent<import("@mui/material/InputLabel").InputLabelOwnProps & Pick<import("@mui/material").FormLabelOwnProps, "color" | "filled"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
     ref?: ((instance: HTMLLabelElement | null) => void) | import("react").RefObject<HTMLLabelElement> | null | undefined;
 }, "color" | "margin" | "disabled" | "error" | "classes" | "className" | "style" | "children" | "sx" | "variant" | "size" | "filled" | "required" | "disableAnimation" | "focused" | "shrink"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/primitives/Textarea/type.d.ts

@@ -2,8 +2,8 @@ import type { InputBaseProps } from '@mui/material/InputBase';
 import type { SxProps, Theme } from '@mui/material/styles';
 export interface TextareaProps extends Omit<InputBaseProps, 'multiline' | 'inputRef' | 'error' | 'placeholder'> {
     /**
-     * Floating label rendered inside the field. Supplying it switches to the labelled layout whose
-     * label animates to the top edge on focus / fill.
+     * In-field label at the top-left inside the border. Supplying it switches to the labelled layout
+     * (96px min-height at 3 rows, 32px top padding). The label does not shrink on focus or fill.
      */
     label?: string;
     /** Show red error border */
@@ -12,7 +12,7 @@ export interface TextareaProps extends Omit<InputBaseProps, 'multiline' | 'input
     minRows?: number;
     /** Maximum rows before scroll kicks in */
     maxRows?: number;
-    /** Placeholder text shown when the field is empty. In labelled mode it only appears on focus. */
+    /** Placeholder text shown when the field is empty — visible in Default even when `label` is set. */
     placeholder?: string | null;
     /** MUI sx style overrides */
     sx?: SxProps<Theme>;

package/build/components/primitives/ToggleButtons/constants.d.ts

@@ -4,3 +4,44 @@ export declare const toggleButtonsClassNames: {
     readonly button: "os-shared-ToggleButtons-button";
 };
 export type ToggleButtonsClassNames = (typeof toggleButtonsClassNames)[keyof typeof toggleButtonsClassNames];
+/** Figma Segment Control Type — Text hugs the label; Icon is a square cell with a centered slot. */
+export declare const toggleButtonsType: {
+    readonly text: "text";
+    readonly icon: "icon";
+};
+export declare const toggleButtonsDefaultType: "text";
+/** Figma Segment Control Size — `md` is Default (32px); `sm` is Small (24px). */
+export declare const toggleButtonsSize: {
+    readonly sm: "sm";
+    readonly md: "md";
+};
+export declare const toggleButtonsDefaultSize: "md";
+/**
+ * Per-size metrics. Container height is buttonHeight + Space/2 padding on each side
+ * (`md` 28+4 = 32, `sm` 20+4 = 24). Icon cell matches buttonHeight; iconSlot is the inner glyph.
+ */
+export declare const toggleButtonsSizeLayout: {
+    readonly md: {
+        readonly buttonHeight: 28;
+        readonly fontSize: 11;
+        readonly containerRadius: 4;
+        readonly iconCell: 28;
+        readonly iconSlot: 14;
+    };
+    readonly sm: {
+        readonly buttonHeight: 20;
+        readonly fontSize: 9;
+        readonly containerRadius: 3;
+        readonly iconCell: 20;
+        readonly iconSlot: 11;
+    };
+};
+/** Type-only layout. Icon cell size comes from `toggleButtonsSizeLayout.iconCell`. */
+export declare const toggleButtonsTypeLayout: {
+    readonly text: {
+        readonly paddingX: 8;
+    };
+    readonly icon: {
+        readonly paddingX: 0;
+    };
+};

package/build/components/primitives/ToggleButtons/index.d.ts

@@ -1,4 +1,4 @@
 export { default } from './ToggleButtons';
-export type { ToggleButtonsProps, ToggleButtonsOption, ToggleButtonsOptionKey } from './type';
-export { toggleButtonsClassNames } from './constants';
+export type { ToggleButtonsProps, ToggleButtonsOption, ToggleButtonsOptionKey, ToggleButtonsType, ToggleButtonsSize } from './type';
+export { toggleButtonsClassNames, toggleButtonsType, toggleButtonsSize } from './constants';
 export type { ToggleButtonsClassNames } from './constants';

package/build/components/primitives/ToggleButtons/style.d.ts

@@ -1,10 +1,15 @@
 /// <reference types="react" />
 import { type Theme } from '@mui/material/styles';
+import type { ToggleButtonsSize, ToggleButtonsType } from './type';
 export declare const ToggleButtonsStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+}, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
+    $size?: ToggleButtonsSize | undefined;
+}, {}, {}>;
 export declare const ToggleButtonsButtonStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
     $isActive?: boolean | undefined;
+    $type?: ToggleButtonsType | undefined;
+    $size?: ToggleButtonsSize | undefined;
 }, {}, {}>;

package/build/components/primitives/ToggleButtons/type.d.ts

@@ -2,6 +2,10 @@ import type { ReactNode } from 'react';
 import type { BoxProps } from '@mui/material/Box';
 import type { SxProps, Theme } from '@mui/material/styles';
 export type ToggleButtonsOptionKey = string | number;
+/** Figma Segment Control Type — Text hugs the label; Icon is a square cell. */
+export type ToggleButtonsType = 'text' | 'icon';
+/** Figma Segment Control Size — `md` is Default (32px); `sm` is Small (24px). */
+export type ToggleButtonsSize = 'sm' | 'md';
 export interface ToggleButtonsOption<T extends ToggleButtonsOptionKey = ToggleButtonsOptionKey> {
     key: T;
     content: ReactNode;
@@ -13,6 +17,13 @@ export interface ToggleButtonsProps<T extends ToggleButtonsOptionKey = ToggleBut
     activeKey: T;
     /** Called with the key of the newly selected option */
     onChange: (key: T) => void;
+    /** Figma Type — Text hugs the label; Icon is a fixed square cell. Defaults to `text`. */
+    type?: ToggleButtonsType;
+    /**
+     * Figma Size — `md` (Default, 32px) is the standard size; `sm` (Small, 24px) is the compact
+     * variant for widget headers and space-constrained contexts. Defaults to `md`.
+     */
+    size?: ToggleButtonsSize;
     /** Props forwarded to ToggleButtonsStyled (merged with top-level `className` / `sx`) */
     containerProps?: BoxProps;
     /** Props forwarded to each ToggleButtonsButtonStyled */

package/build/components/primitives/Tooltip/Tooltip.d.ts

@@ -1,15 +1,16 @@
 /// <reference types="react" />
 import type { TooltipProps } from './type';
 /**
- * Hover tooltip that wraps any child element in a Box. Shows `title` on hover with an arrow pointer.
- * Defaults to `top` placement. Use `wrapperProps` to customise the Box that wraps children.
+ * Hover tooltip that wraps any child element in a Box. Shows `title` on hover with an arrow
+ * pointer. Optional `supportingText` switches to the two-line (semibold title + description)
+ * variant. Defaults to `top` placement. Use `wrapperProps` to customise the Box that wraps children.
  *
  * Restyling note: MUI Tooltip clones its child and manages positioning internally — there is no
  * owned interactive DOM node to forward `ref` to. Consumer `className` is routed to the popper
- * bubble via the styled Tooltip's `className` prop (mapped to `classes.popper`), not to a root
+ * via the styled Tooltip's `className` prop (mapped to `classes.popper`), not to a root
  * element directly.
  */
-declare function Tooltip({ className, title, placement, children, wrapperProps, sx, ...rest }: TooltipProps): import("react").JSX.Element;
+declare function Tooltip({ className, title, supportingText, placement, children, wrapperProps, sx, ...rest }: TooltipProps): import("react").JSX.Element;
 declare namespace Tooltip {
     var displayName: string;
 }

package/build/components/primitives/Tooltip/constants.d.ts

@@ -1,5 +1,11 @@
 export declare const tooltipClassNamePrefix: "os-shared-Tooltip";
 export declare const tooltipClassNames: {
+    readonly popper: "os-shared-Tooltip-popper";
+    readonly tooltip: "os-shared-Tooltip-tooltip";
+    readonly arrow: "os-shared-Tooltip-arrow";
+    readonly content: "os-shared-Tooltip-content";
+    readonly title: "os-shared-Tooltip-title";
+    readonly supportingText: "os-shared-Tooltip-supportingText";
     readonly wrapper: "os-shared-Tooltip-wrapper";
 };
 export type TooltipClassNames = (typeof tooltipClassNames)[keyof typeof tooltipClassNames];

package/build/components/primitives/Tooltip/style.d.ts

@@ -1,2 +1,8 @@
+/// <reference types="react" />
 import { type TooltipProps as MuiTooltipProps } from '@mui/material/Tooltip';
 export declare const TooltipStyled: import("@emotion/styled").StyledComponent<MuiTooltipProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const TooltipContentStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TooltipTitleStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+    $hasSupportingText: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TooltipSupportingTextStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/build/components/primitives/Tooltip/type.d.ts

@@ -2,15 +2,20 @@ import type { ReactElement, ReactNode } from 'react';
 import type { BoxProps } from '@mui/material/Box';
 import type { TooltipProps as MuiTooltipProps } from '@mui/material/Tooltip';
 import type { SxProps, Theme } from '@mui/material/styles';
-export interface TooltipProps extends Omit<MuiTooltipProps, 'children'> {
-    /** Content displayed inside the tooltip bubble */
+export interface TooltipProps extends Omit<MuiTooltipProps, 'children' | 'title'> {
+    /** Primary label displayed inside the tooltip bubble */
     title: ReactNode;
+    /**
+     * Secondary description under the title. Presence switches the bubble to the
+     * supporting-text variant (semibold title + 11px body).
+     */
+    supportingText?: ReactNode;
     /** Position of the tooltip relative to its anchor */
     placement?: MuiTooltipProps['placement'];
     /** Element that triggers the tooltip on hover */
     children?: ReactElement;
     /** Props forwarded to the Box wrapper around children */
     wrapperProps?: BoxProps;
-    /** MUI sx style overrides */
+    /** MUI sx style overrides — land on the popper */
     sx?: SxProps<Theme>;
 }

package/build/components/primitives/index.d.ts

@@ -14,7 +14,7 @@ export { default as Typography } from './Typography';
 export type { TypographyProps, TypographyVariant, TypographyAlign, TypographyColor, TypographyWeight, TypographyClassNames } from './Typography';
 export { typographyClassNames } from './Typography';
 export { default as RadioButton } from './RadioButton';
-export type { RadioButtonProps, RadioButtonSize, RadioButtonClassNames } from './RadioButton';
+export type { RadioButtonProps, RadioButtonClassNames } from './RadioButton';
 export { radioButtonClassNames } from './RadioButton';
 export { default as CircularProgress } from './CircularProgress';
 export type { CircularProgressProps, CircularProgressClassNames } from './CircularProgress';
@@ -26,16 +26,16 @@ export { default as Skeleton } from './Skeleton';
 export type { SkeletonProps, SkeletonClassNames } from './Skeleton';
 export { skeletonClassNames } from './Skeleton';
 export { default as Avatar } from './Avatar';
-export type { AvatarProps, AvatarSize, AvatarClassNames } from './Avatar';
+export type { AvatarProps, AvatarSize, AvatarColor, AvatarClassNames } from './Avatar';
 export { avatarClassNames } from './Avatar';
 export { default as Divider } from './Divider';
-export type { DividerProps, DividerClassNames } from './Divider';
+export type { DividerProps, DividerType, DividerClassNames } from './Divider';
 export { dividerClassNames } from './Divider';
 export { default as Collapse } from './Collapse';
 export type { CollapseProps, CollapseClassNames } from './Collapse';
 export { collapseClassNames } from './Collapse';
 export { default as Badge } from './Badge';
-export type { BadgeProps, BadgeColor, BadgeClassNames } from './Badge';
+export type { BadgeProps, BadgeColor, BadgeState, BadgeClassNames } from './Badge';
 export { badgeClassNames } from './Badge';
 export { default as Backdrop } from './Backdrop';
 export type { BackdropProps, BackdropClassNames } from './Backdrop';
@@ -71,8 +71,8 @@ export { default as MenuItem } from './MenuItem';
 export type { MenuItemProps, MenuItemCheckboxVariant, MenuItemClassNames } from './MenuItem';
 export { menuItemClassNames } from './MenuItem';
 export { default as ToggleButtons } from './ToggleButtons';
-export type { ToggleButtonsProps, ToggleButtonsOption, ToggleButtonsOptionKey, ToggleButtonsClassNames } from './ToggleButtons';
-export { toggleButtonsClassNames } from './ToggleButtons';
+export type { ToggleButtonsProps, ToggleButtonsOption, ToggleButtonsOptionKey, ToggleButtonsType, ToggleButtonsSize, ToggleButtonsClassNames, } from './ToggleButtons';
+export { toggleButtonsClassNames, toggleButtonsType, toggleButtonsSize } from './ToggleButtons';
 export { default as LazyImage } from './LazyImage';
 export type { LazyImageProps, LazyImageEffect, LazyImageClassNames } from './LazyImage';
 export { lazyImageClassNames } from './LazyImage';