asma-ui-core 3.44.0 → 3.45.0

package/dist/src/components/data-display/chip/StyledChip.d.ts

@@ -1,7 +1,76 @@
-import { ChipProps } from '@mui/material';
-import { default as React } from 'react';
-export type StyledChipProps = ChipProps & {
+import { MouseEvent, ReactElement, ReactNode } from 'react';
+interface ChipClasses {
+    root?: string;
+    label?: string;
+    avatar?: string;
+    icon?: string;
+    deleteIcon?: string;
+}
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#13248-31089
+ * Figma "Tag Chip" / `_BASE_Tag`. Figma **State** (Enabled/Hovered/Focused/Read only/Disabled) is
+ * driven by native hover/focus + `readOnly`/`disabled` (or forced via `data-hovered`/`data-focus`).
+ * Figma **Type** (Standard/User tag/Group tag/Checkbox/Radio) is expressed via slots (`avatar`/`icon`/
+ * `label` content) rather than an enum. **Selected** (on/off) is a checkbox/radio concern (see
+ * StyledInteractiveChip). Non-annotated props are behavioral / MUI `Chip` API-parity (DEC-003).
+ */
+export interface StyledChipProps {
+    /** @figmaProp none — test hook */
     dataTest: string;
+    /** @figmaProp Text (the chip label) */
+    label?: ReactNode;
+    /** @figmaProp none — cosmetically inert; the design always renders white body + delta border */
+    variant?: 'filled' | 'outlined';
+    /** @figmaProp none — cosmetically inert */
+    color?: string;
+    /** @figmaProp none — app size (Figma _BASE_Tag is a single 32px height; `small`=24 is app-specific) */
+    size?: 'small' | 'medium';
+    /** @figmaProp State = true→"Disabled" */
+    disabled?: boolean;
+    /** @figmaProp State = true→"Read only" */
     readOnly?: boolean;
-};
-export declare const StyledChip: React.ForwardRefExoticComponent<Omit<StyledChipProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    /** @figmaProp State = drives interactive Hovered/Focused/Pressed via native events */
+    clickable?: boolean;
+    /** @figmaProp Avatar/start icon slot (Type=User tag etc.) */
+    icon?: ReactElement;
+    /** @figmaProp Avatar slot (Type=User tag) */
+    avatar?: ReactElement;
+    /** @figmaProp Clear element */
+    deleteIcon?: ReactElement;
+    /** @figmaProp Clear element (present → chip shows the delete/Clear button) */
+    onDelete?: (event: MouseEvent<HTMLElement>) => void;
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
+    /** Forwarded to the chip root — e.g. `stopPropagation` so a chip click in a row doesn't select the row. */
+    onMouseDown?: (event: MouseEvent<HTMLDivElement>) => void;
+    onMouseUp?: (event: MouseEvent<HTMLDivElement>) => void;
+    className?: string;
+    classes?: ChipClasses;
+    sx?: unknown;
+    tabIndex?: number;
+    'aria-label'?: string;
+    /** Overrides the default `role="button"`/no-role logic — for `StyledInteractiveChip`'s
+     * checkbox/radio chip, whose inner control is `decorative`/`aria-hidden` (a real, even hidden,
+     * `<input>` nested inside this chip's own interactive root is an axe `nested-interactive`
+     * violation), so the chip root itself must carry the real checkbox/radio semantics. Unlike the
+     * `clickable`-driven `role="button"`, this is rendered **regardless of `readOnly`** — a read-only
+     * checkbox/radio still needs its role + checked state announced, just not `role="button"` (which
+     * implies operability). */
+    role?: 'checkbox' | 'radio';
+    /** Paired with `role` above — the checked state of a checkbox/radio chip. */
+    'aria-checked'?: boolean;
+    /** Paired with `role` above — mirrors `readOnly` for AT that specifically looks for `aria-readonly`
+     * on a checkbox/radio (unlike `role="button"`, `aria-readonly` doesn't imply the role disappears). */
+    'aria-readonly'?: boolean;
+    /** @figmaProp State = present→"Hovered" (forced for state tables) */
+    'data-hovered'?: string;
+    /** @figmaProp State = present→"Focused" (forced for state tables) */
+    'data-focus'?: string;
+}
+/**
+ * Native replacement for MUI `Chip` — a styled element with optional avatar/icon start slot, a
+ * label, and a delete button. Interactive hover/focus/active visuals also respond to the
+ * `data-hovered`/`data-focus` attributes MUI set (state tables rely on them). Public props +
+ * `classes`/`sx` slots preserved (DEC-003). TASK-101a.
+ */
+export declare const StyledChip: import('node_modules/@types/react').ForwardRefExoticComponent<StyledChipProps & import('node_modules/@types/react').RefAttributes<HTMLDivElement>>;
+export {};

package/dist/src/components/data-display/chip/chipPadding.d.ts

@@ -0,0 +1,3 @@
+import { PaddingSides } from '../../../helpers/applyImportantPadding';
+/** Figma _BASE_Tag (node 13248-31089) — medium h=32, radius=25, gap=4 */
+export declare const getChipPadding: (size: "small" | "medium", hasStart: boolean, hasDelete: boolean) => PaddingSides;

package/dist/src/components/data-display/form-label/types.d.ts

@@ -1,9 +1,20 @@
 import { MouseEventHandler, ReactNode } from 'react';
 export type IFormLabelSize = 'md' | 'base' | 'lg' | 'xl';
+/**
+ * @figmaNode none — no standalone Figma component; maps to DS **typography** styles (Design-System
+ * wXrXt5uKNNzV2DnQCgyYZH), colours from the delta token layer (delta-700/-800).
+ * md = Helper 14/20 Regular · base = Body Base Semibold 16/24 · lg = Section title 18/28 SemiBold ·
+ * xl = 20/28 SemiBold.
+ */
 export interface IStyledFormLabel {
+    /** @figmaProp none — the label text */
     title: ReactNode;
+    /** @figmaProp none — behavioral */
     onClick?: MouseEventHandler<HTMLDivElement>;
+    /** @figmaProp none — behavioral */
     className?: string;
+    /** @figmaProp none — test hook */
     dataTest?: string;
+    /** @figmaProp Size = md→Helper | base→Body Base Semibold | lg→Section title | xl→20/28 SemiBold */
     size?: IFormLabelSize;
 }

package/dist/src/components/data-display/interactive-chip/StyledInteractiveChip.d.ts

@@ -1,10 +1,28 @@
-import { ComponentProps, FC } from 'react';
+import { ComponentProps } from 'react';
 import { StyledChip } from '../chip';
-import { CheckboxProps, RadioProps } from '@mui/material';
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#13248-31089
+ * Figma "Tag Chip" **Type=Checkbox** (node 18832-25686 / selected 18869-29068) and **Type=Radio**
+ * (18832-25900 / selected 18869-29122). It is a `StyledChip` (h32, radius25, border delta-300, label
+ * Body Base 16 delta-700; hover gama-200 + gama-25, focus gama-400 — all inherited) whose start slot
+ * is a native checkbox/radio. Figma **State** (Enabled/Hovered/Focused/Read-only/Disabled) ← native
+ * + `readOnly`/`disabled`; **Selected** ← `checked`. A selected **radio** additionally gets the teal
+ * chip border/fill (gama-400 / gama-50); a selected **checkbox** only checks its box (matching Figma).
+ * Non-annotated props are behavioral / forwarded to `StyledChip`.
+ */
 export interface StyledInteractiveChipProps extends ComponentProps<typeof StyledChip> {
+    /** @figmaProp Type = "Checkbox" | "Radio" (the start-slot control) */
     type?: 'checkbox' | 'radio';
-    checked?: (CheckboxProps | RadioProps)['checked'];
+    /** @figmaProp Selected = true→"on" | false→"off" */
+    checked?: boolean;
+    /** @figmaProp none — app size (Figma Tag Chip is a single 32px height) */
     size?: 'small' | 'medium';
+    /** @figmaProp none — accessible name for the control */
     ariaLabel?: string;
 }
-export declare const StyledInteractiveChip: FC<StyledInteractiveChipProps>;
+/**
+ * A `StyledChip` whose avatar is a native checkbox or radio (base-ui controls now render their own
+ * checked/read-only colours, so the old nested `.MuiChip-avatar .Mui*` `sx` is gone). Public props
+ * preserved (DEC-003). TASK-101a.
+ */
+export declare const StyledInteractiveChip: import('node_modules/@types/react').ForwardRefExoticComponent<Omit<StyledInteractiveChipProps, "ref"> & import('node_modules/@types/react').RefAttributes<HTMLDivElement>>;

package/dist/src/components/data-display/tooltip/StyledTooltip.d.ts

@@ -1,2 +1,44 @@
-import { TooltipProps } from '@mui/material';
+import { CSSProperties, ReactElement, ReactNode } from 'react';
+import { Placement } from '@floating-ui/react';
+interface TooltipSlotProps {
+    tooltip?: {
+        sx?: unknown;
+        className?: string;
+        style?: CSSProperties;
+    };
+    popper?: unknown;
+    transition?: unknown;
+    arrow?: unknown;
+}
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#14680-25248
+ * Figma "Tooltip" (Theme=Day): delta-800 #363e4a body, px8/py4, radius 3, Helper 14px/lh20 white,
+ * max-width 320, optional arrow (9 placements). Float drop-shadow.
+ */
+export interface TooltipProps {
+    title: ReactNode;
+    children: ReactElement;
+    /** @figmaProp Arrow placement (Top/Bottom/Left/Right × start/middle/end) */
+    placement?: Placement;
+    /** @figmaProp Arrow = true→"Arrow" | false→"None" */
+    arrow?: boolean;
+    enterDelay?: number;
+    leaveDelay?: number;
+    open?: boolean;
+    onOpen?: () => void;
+    onClose?: () => void;
+    disableHoverListener?: boolean;
+    disableFocusListener?: boolean;
+    disableTouchListener?: boolean;
+    offsetDistance?: number;
+    className?: string;
+    slotProps?: TooltipSlotProps;
+}
+/**
+ * Tooltip built on `@floating-ui/react` (replaces MUI `Tooltip`) — hover(+`enterDelay`)/focus open,
+ * dismiss on blur/esc, `flip`/`shift` collision handling, optional arrow, portalled. Empty `title`
+ * renders the child alone (MUI parity). Preserves the `#363E4A` design and the `title`/`placement`/
+ * `arrow`/`enterDelay`/`open`/`slotProps` surface (DEC-003). TASK-301.
+ */
 export declare const StyledTooltip: (props: TooltipProps) => JSX.Element;
+export {};

package/dist/src/components/data-display/typography/StyledTypography.d.ts

@@ -1,2 +1,33 @@
-import { TypographyProps } from '@mui/material';
+import { CSSProperties, ElementType, HTMLAttributes, ReactNode } from 'react';
+export interface TypographyProps extends Omit<HTMLAttributes<HTMLElement>, 'color'> {
+    variant?: string;
+    variantMapping?: Record<string, string>;
+    align?: CSSProperties['textAlign'];
+    noWrap?: boolean;
+    gutterBottom?: boolean;
+    color?: string;
+    component?: ElementType;
+    sx?: unknown;
+    classes?: Record<string, string>;
+    children?: ReactNode;
+}
+/**
+ * Native, MUI-free reimplementation of the previous `Typography` passthrough. Reproduces MUI v9's
+ * default typography scale via Tailwind utilities, the variant→element mapping, and the
+ * `align`/`noWrap`/`gutterBottom`/`color` props. `sx` is honoured via `resolveSx` (DEC-007).
+ * Signature unchanged: still accepts `TypographyProps` (DEC-003).
+ *
+ * @figmaNode none — **MUI-compatibility shim, NOT a Design-System component.** Its `variant` scale
+ * (h1=6rem light, body1=1rem, MUI palette colours…) intentionally mirrors MUI v9 so pre-existing
+ * `<StyledTypography variant="…">` call-sites keep rendering identically. **Do not rescale it to the
+ * Figma type scale** — that would silently change every consumer.
+ *
+ * The authoritative ASMA Design-System type scale (Figma "Typography" `wXrXt5uKNNzV2DnQCgyYZH#23020-67726`)
+ * lives in the Tailwind text-* layer and is applied directly per component — it maps 1:1 onto the
+ * default Tailwind scale (Roboto, letter-spacing 0 unless noted):
+ *   Page title 24/32 → `text-2xl font-semibold` · Subtitle 20/28 → `text-xl font-semibold` ·
+ *   Section title 18/28 → `text-lg font-semibold` · Body Base 16/24 → `text-base` (+`font-semibold`) ·
+ *   Helper 14/20 → `text-sm` (+`font-semibold`) · Small 12/16 → `text-xs tracking-[0.24px]` ·
+ *   X-small uppercase 11/12 → `text-[11px] tracking-[0.55px] uppercase font-semibold`.
+ */
 export declare const StyledTypography: (props: TypographyProps) => JSX.Element;

package/dist/src/components/feedback/dialog/StyledDialog.d.ts

@@ -1,11 +1,67 @@
-import { DialogProps } from '@mui/material/Dialog';
-import { ReactNode } from 'react';
-export interface IStyledDialogProps extends DialogProps {
+import { CSSProperties, ReactNode, SyntheticEvent } from 'react';
+export type DialogCloseReason = 'escapeKeyDown' | 'backdropClick';
+export type DialogMaxWidth = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false;
+interface DialogPaperProps {
+    className?: string;
+    style?: CSSProperties;
+    sx?: unknown;
+    ref?: React.Ref<HTMLDialogElement>;
+}
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#15820-18954
+ * Figma "Dialog": white paper radius 8 with the Dialogue-popup shadow (#22213366, 0 4 40) over a
+ * bg/modal #626e7eb2 overlay. Header = optional label (Helper, delta-600) + title (Page title 24
+ * SemiBold, delta-800) + close button. `fullScreen`/mobile drops the radius and fills the viewport.
+ */
+export interface IStyledDialogProps {
+    open: boolean;
+    onClose?: (event: SyntheticEvent | Event, reason: DialogCloseReason) => void;
+    children?: ReactNode;
+    dataTest: string;
+    maxWidth?: DialogMaxWidth;
+    fullWidth?: boolean;
+    fullScreen?: boolean;
+    scroll?: 'paper' | 'body';
+    disableEscapeKeyDown?: boolean;
+    /**
+     * Accepted for MUI `Dialog` parity (DEC-003). Focus is trapped by the native `<dialog>`
+     * `showModal()`, so this MUI `Modal` prop is a typed no-op.
+     */
+    disableEnforceFocus?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    sx?: unknown;
+    /**
+     * MUI `Dialog` `classes` parity (DEC-003). The native `<dialog>` is the paper, so `classes.paper`
+     * is merged onto it; `classes.root` is accepted as a typed no-op (no separate root element).
+     */
+    classes?: {
+        paper?: string;
+        root?: string;
+    };
+    PaperProps?: DialogPaperProps;
+    slotProps?: {
+        paper?: DialogPaperProps;
+        backdrop?: Record<string, unknown>;
+    };
     onCloseText?: ReactNode;
+    /** @figmaProp none — behavioral */
     showCloseIcon?: boolean;
-    dataTest: string;
+    /** @figmaProp header Label (Helper 14, delta-600) */
     dialogLabel?: ReactNode;
+    /** @figmaProp header Title (Page title 24 SemiBold, delta-800) */
     dialogTitle?: ReactNode;
     dialogHeaderNode?: ReactNode;
 }
+/**
+ * Modal dialog built on the native `<dialog>` element (replaces MUI `Dialog`) — backdrop, focus
+ * trap and ESC handling come from `showModal()` for free. The `<dialog>` element is the "paper",
+ * so `PaperProps`/`slotProps.paper` and `className` style it directly; `::backdrop` is the overlay.
+ * Public props preserved (DEC-003). TASK-205.
+ *
+ * ponytail: open/close is instant (no MUI fade) and body-scroll behind the modal isn't locked —
+ * both known ceilings; Chromatic in CI is the visual gate. Upgrade path: add `@starting-style`
+ * transitions and a scroll-lock effect if a diff calls for it.
+ */
 export declare const StyledDialog: React.FC<IStyledDialogProps>;
+export {};

package/dist/src/components/feedback/dialog/StyledDialogActions.d.ts

@@ -1,2 +1,12 @@
-import { DialogActionsProps } from '@mui/material';
-export declare const StyledDialogActions: (props: DialogActionsProps) => JSX.Element;
+import { HTMLAttributes } from 'react';
+interface DialogActionsProps extends HTMLAttributes<HTMLDivElement> {
+    sx?: unknown;
+    classes?: Record<string, string>;
+    disableSpacing?: boolean;
+}
+/**
+ * MUI-free dialog actions: a right-aligned flex row of buttons; on mobile each button wrapper
+ * stretches full width (was a SCSS media query, now Tailwind `max-md:` arbitrary variant). TASK-101.
+ */
+export declare const StyledDialogActions: ({ children, className, sx, style, classes: _classes, disableSpacing: _disableSpacing, ...rest }: DialogActionsProps) => JSX.Element;
+export {};

package/dist/src/components/feedback/dialog/StyledDialogContent.d.ts

@@ -1,2 +1,12 @@
-import { DialogContentProps } from '@mui/material';
-export declare const StyledDialogContent: ({ children, classes, className, ...rest }: DialogContentProps) => JSX.Element;
+import { HTMLAttributes } from 'react';
+interface DialogContentProps extends HTMLAttributes<HTMLDivElement> {
+    sx?: unknown;
+    classes?: Record<string, string>;
+    dividers?: boolean;
+}
+/**
+ * MUI-free dialog content: a scrollable `<div>` with the previous SCSS metrics as Tailwind,
+ * plus MUI's optional `dividers` borders. TASK-101.
+ */
+export declare const StyledDialogContent: ({ children, className, sx, style, dividers, classes: _classes, ...rest }: DialogContentProps) => JSX.Element;
+export {};

package/dist/src/components/feedback/dialog/StyledDialogTitle.d.ts

@@ -1,2 +1,10 @@
-import { DialogTitleProps } from '@mui/material/DialogTitle';
-export declare const StyledDialogTitle: ({ children, ...rest }: DialogTitleProps) => JSX.Element | null;
+import { HTMLAttributes } from 'react';
+interface DialogTitleProps extends HTMLAttributes<HTMLHeadingElement> {
+    sx?: unknown;
+    classes?: Record<string, string>;
+}
+/**
+ * MUI-free dialog title: a semantic `<h2>` with the previous SCSS metrics as Tailwind. TASK-101.
+ */
+export declare const StyledDialogTitle: ({ children, className, sx, style, classes: _classes, ...rest }: DialogTitleProps) => JSX.Element | null;
+export {};

package/dist/src/components/feedback/empty-page/StyledEmptyPage.d.ts

@@ -1,4 +1,10 @@
 import { FC } from 'react';
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#22878-67600 (Design-System · "Empty state")
+ *
+ * Inline empty placeholder: icon 24 + Helper text (14/20 Regular), both in the placeholder grey
+ * `text-icon/placeholder` (= `delta-500`), gap 8, centered.
+ */
 export declare const StyledEmptyPage: FC<{
     emptyText: string;
     isEmpty?: boolean;

package/dist/src/components/feedback/filtered-empty-state/StyledFilteredEmptyState.d.ts

@@ -1,5 +1,12 @@
 import { FC, ReactNode } from 'react';
 type FilteredEmptyStateLocale = 'en' | 'no';
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#37513-171511 (Design-System · "Filters empty state")
+ *
+ * Composes `StyledEmptyPage` (delta-500 placeholder) + a reset block: title = Helper Semibold 14/20
+ * `delta-800`, description = Helper 14/20 `delta-600`, reset = **medium** Tertiary button (label
+ * Body Base Semibold 16/24 `gama-500` + 24px filter-off icon). Container gap 16, reset block gap 8.
+ */
 export interface StyledFilteredEmptyStateProps {
     dataTest: string;
     emptyText?: string;

package/dist/src/components/feedback/loading/StyledLoading.d.ts

@@ -1,7 +1,16 @@
 import { FC } from 'react';
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#21335-39606 (Design-System · "Loading spinner")
+ *
+ * Centered loading spinner in the primary accent (`gama-500` — teal/jade), matching the DS spinner
+ * used in buttons/inline. Already conformant: primary colour + 16/24/32 sizes.
+ */
 interface StyledLoadingProps {
+    /** @figmaProp none — visibility toggle */
     isLoading: boolean;
+    /** @figmaProp none — behavioral */
     className?: string;
+    /** @figmaProp Size = small→16 | medium→24 | large→32 (spinner px) */
     size?: 'small' | 'medium' | 'large';
 }
 export declare const StyledLoading: FC<StyledLoadingProps>;

package/dist/src/components/feedback/minimizable-dialog/v2/types.d.ts

@@ -1,5 +1,18 @@
 import { ReactNode } from 'react';
 export type ILocale = 'en' | 'no';
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#20049-111828 (Design-System · "Dialog minimized")
+ *
+ * Bespoke bottom-right minimizable dialog (no single DS component). It reuses the DS **modal family**
+ * conventions from `StyledDialog`: paper white radius 8 + **Dialogue-popup** shadow (#22213366, 0 4 40),
+ * fullscreen overlay `bg/modal` #626e7e @70%, header title Page title 24/32 SemiBold `delta-800` +
+ * optional Helper `delta-700` label over a `delta-200` divider. The **minimized bar** matches the DS
+ * "Dialog minimized" node: radius 8, Dialogue-popup shadow, Section title 18/28 SemiBold `delta-800`.
+ * (Minimized expand/close are compact icon-only buttons — deliberately terser than the labelled Figma
+ * variant to keep the bar narrow for the multi-dialog Stack.) Token-clean; no visual change this pass.
+ *
+ * Positioning (`--dialog-right`/width/`bottom-4`) is owned by `createDialogStack`; do not restyle it.
+ */
 export interface IMinimizableDialogV2Props {
     open: boolean;
     onClose: () => void;

package/dist/src/components/feedback/minimizable-dialog/v2/useControlledProps.d.ts

@@ -1,7 +1,9 @@
 import { IMinimizableDialogV2Props } from './types';
-export declare const useControlledProps: ({ fullScreenState, handleFullScreenState, minimizedState, handleMinimizedState, }: IMinimizableDialogV2Props) => {
+interface ControlledProps {
     fullScreen: boolean;
     setFullScreen: (fullScreen: boolean) => void;
     minimized: boolean;
     setMinimized: (minimized: boolean) => void;
-};
+}
+export declare const useControlledProps: ({ fullScreenState, handleFullScreenState, minimizedState, handleMinimizedState, }: IMinimizableDialogV2Props) => ControlledProps;
+export {};

package/dist/src/components/feedback/minimizable-dialog/v2/useTranslations.d.ts

@@ -1,14 +1,19 @@
 import { ILocale } from './types';
-export declare function useTranslations(locale?: ILocale): {
-    close: string;
-    expand: string;
-    minimize: string;
-    fullscreen: string;
-    exitFullscreen: string;
-} | {
-    close: string;
-    expand: string;
-    minimize: string;
-    fullscreen: string;
-    exitFullscreen: string;
+declare const translations: {
+    en: {
+        close: string;
+        expand: string;
+        minimize: string;
+        fullscreen: string;
+        exitFullscreen: string;
+    };
+    no: {
+        close: string;
+        expand: string;
+        minimize: string;
+        fullscreen: string;
+        exitFullscreen: string;
+    };
 };
+export declare function useTranslations(locale?: ILocale): typeof translations.en;
+export {};

package/dist/src/components/feedback/snack-bar/SnackbarProvider.d.ts

@@ -1,4 +1,4 @@
-import { AlertColor } from '@mui/material';
+import { AlertColor } from './StyledAlert';
 import { SnackbarProviderProps } from 'notistack';
 export declare const SnackbarProvider: (props: SnackbarProviderProps) => JSX.Element;
 declare module 'notistack' {

package/dist/src/components/feedback/snack-bar/StyledAlert.d.ts

@@ -1,2 +1,41 @@
-import { AlertProps } from '@mui/material';
-export declare const StyledAlert: (props: AlertProps) => JSX.Element;
+import { MouseEvent, ReactNode } from 'react';
+export type AlertColor = 'success' | 'info' | 'warning' | 'error';
+export type AlertVariant = 'standard' | 'filled' | 'outlined';
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#22249-56917 (Design-System · "Inline notification")
+ *
+ * The DS defines a single "Default" inline-notification style: `alerts/{sev}-50` fill +
+ * `alerts/{sev}-300` border, a severity-`700` accent (icon + optional bold label) and a
+ * neutral `delta/800` body. `filled`/`outlined` have no DS counterpart (MUI-compat only).
+ */
+export interface AlertProps {
+    /** @figmaProp none — severity is applied in Figma by swapping the `alerts/{success|info|warning|error}` token set (no discrete component property); each value maps to that family's -50/-300/-700 shades */
+    severity?: AlertColor;
+    /** @figmaProp Property1 = standard→"Default"; filled/outlined = none (no DS variant — MUI-compat) */
+    variant?: AlertVariant;
+    /** @figmaProp none — maps the Figma "Icon" slot (severity glyph, 20px) */
+    icon?: ReactNode | false;
+    /** @figmaProp none — behavioral override of the severity glyph */
+    iconMapping?: Partial<Record<AlertColor, ReactNode>>;
+    /** @figmaProp none — behavioral (replaces the trailing Close slot) */
+    action?: ReactNode;
+    /** @figmaProp showClose = onClose defined → Close slot visible */
+    onClose?: (event: MouseEvent<HTMLButtonElement>) => void;
+    /** @figmaProp none — the "Text" body slot (Helper 14/lh20, delta/800) */
+    children?: ReactNode;
+    /** @figmaProp none — behavioral */
+    className?: string;
+    /** @figmaProp none — behavioral (inline style escape hatch) */
+    sx?: unknown;
+    /** @figmaProp none — a11y */
+    role?: string;
+}
+/**
+ * Alert banner (replaces MUI `Alert`). Native `role="alert"` with a leading severity icon, message
+ * and optional action/close button; `standard`/`filled`/`outlined` variants. Public props preserved
+ * (DEC-003). TASK-402.
+ *
+ * ponytail: severity uses the semantic `success`/`info`/`warning`/`error` token families —
+ * Chromatic in CI is the visual gate for exact shades.
+ */
+export declare const StyledAlert: ({ severity, variant, icon, iconMapping, action, onClose, children, className, sx, role, }: AlertProps) => JSX.Element;

package/dist/src/components/feedback/snack-bar/StyledAlertSnackbar.d.ts

@@ -1,4 +1,4 @@
-import { AlertColor } from '@mui/material';
+import { AlertColor } from './StyledAlert';
 import { CustomContentProps } from 'notistack';
 interface StyledAlertSnackbarProps extends CustomContentProps {
     severity?: AlertColor;

package/dist/src/components/feedback/snack-bar/StyledSnackbar.d.ts

@@ -1,2 +1,25 @@
-import { SnackbarProps } from '@mui/material';
-export declare const StyledSnackbar: ({ children, ...props }: SnackbarProps) => JSX.Element;
+import { ReactNode } from 'react';
+export interface SnackbarOrigin {
+    vertical: 'top' | 'bottom';
+    horizontal: 'left' | 'center' | 'right';
+}
+export interface SnackbarProps {
+    open?: boolean;
+    autoHideDuration?: number | null;
+    onClose?: (event: Event | null, reason: 'timeout' | 'clickaway') => void;
+    anchorOrigin?: SnackbarOrigin;
+    message?: ReactNode;
+    action?: ReactNode;
+    children?: ReactNode;
+    className?: string;
+}
+/**
+ * Positioned auto-hiding toast (replaces MUI `Snackbar`). Portalled, fixed to the `anchorOrigin`
+ * corner; auto-hides after `autoHideDuration` (null disables). Public props preserved (DEC-003).
+ * TASK-402.
+ *
+ * Positioning primitive — no standalone Figma node. The DS severity toast is
+ * `StyledDefaultSnackbar` (Figma "System notification-toast"); consumers pass it via `children`.
+ * The built-in dark pill is only a bare MUI-compat fallback; radius aligned to the DS 4px token.
+ */
+export declare const StyledSnackbar: ({ open, autoHideDuration, onClose, anchorOrigin, message, action, children, className, }: SnackbarProps) => JSX.Element | null;

package/dist/src/components/feedback/snack-bar/components/StyledDefaultSnackbar.d.ts

@@ -1,7 +1,16 @@
-import { AlertColor } from '@mui/material';
+import { AlertColor } from '../StyledAlert';
 import { CustomContentProps, SnackbarMessage } from 'notistack';
+/**
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#22249-56927 (Design-System · "System notification-toast")
+ *
+ * Toast card: `alerts/{sev}-50` fill + `alerts/{sev}-300` border (warning → -500), Dialogue-popup
+ * elevation, radius 4, w400, pl16/pr8/py12. Label = Body Base Semibold 16/24 in the severity accent
+ * (title -700, error -600); body = Body Base 16/24 in the per-severity dark shade (-800, error -700).
+ */
 export interface StyledDefaultSnackbarProps extends CustomContentProps {
+    /** @figmaProp Type = success|info|warning|error → the `alerts/{sev}` token set (fill/border/title/message) */
     severity: AlertColor;
+    /** @figmaProp Label = the bold severity title (falls back to the severity name) */
     title?: SnackbarMessage;
 }
 export declare const StyledDefaultSnackbar: import('node_modules/@types/react').ForwardRefExoticComponent<StyledDefaultSnackbarProps & import('node_modules/@types/react').RefAttributes<HTMLDivElement>>;

package/dist/src/components/feedback/snack-bar/components/StyledInfoSnackbar.d.ts

@@ -1,4 +1,4 @@
-import { AlertColor } from '@mui/material';
+import { AlertColor } from '../StyledAlert';
 import { CustomContentProps } from 'notistack';
 interface StyledInfoSnackbarProps extends CustomContentProps {
     severity?: AlertColor;

package/dist/src/components/feedback/snack-bar/components/types.d.ts

@@ -1,4 +1,4 @@
-import { AlertColor } from '@mui/material';
+import { AlertColor } from '../StyledAlert';
 import { SnackbarProviderProps } from 'notistack';
 export type MessageProps = SnackbarProviderProps & {
     severity?: AlertColor;

package/dist/src/components/inputs/button/StyledButton.d.ts

@@ -1,22 +1,31 @@
 import { default as React, ReactNode } from 'react';
 export type StyledButtonType = 'contained' | 'outlined' | 'text' | 'textGray';
 interface commonProps {
+    /** @figmaProp none — ref */
     refLink?: React.Ref<HTMLButtonElement>;
+    /** @figmaProp Size = medium→"Medium" (h40, text16/24) | small→"Small" (h32, text14/20) | large→"Medium" (no distinct Figma size) */
     size?: 'large' | 'small' | 'medium';
+    /** @figmaProp none — behavioral (renders inside the button; Figma "Icon left" 24/20px slot) */
     startIcon?: ReactNode;
+    /** @figmaProp none — behavioral (renders inside the button; Figma "Icon right" 24/20px slot) */
     endIcon?: ReactNode;
+    /** @figmaProp none — test hook */
     dataTest: string;
 }
 interface variantTextGrayProps {
+    /** @figmaProp Type = textGray→"Quaternary" (transparent bg, text-icon/body #49525f) */
     variant?: 'textGray';
     error?: never;
 }
 interface variantTextWhiteProps {
+    /** @figmaProp none — app-specific variant, no Figma counterpart */
     variant?: 'textWhite';
     error?: never;
 }
 interface buttonStandartVariantsProps {
+    /** @figmaProp Type = contained→"Primary (Contained)" | outlined→"Secondary (Outlined)" | text→"Tertiary" (teal text) | textGray→"Quaternary" (gray text) | textWhite→none */
     variant?: 'contained' | 'outlined' | 'text' | 'textGray' | 'textWhite' | 'large' | 'small' | 'medium' | 'error' | 'common';
+    /** @figmaProp Danger = true→"on" | false→"off" */
     error?: boolean;
 }
 type conditionalProps = variantTextGrayProps | variantTextWhiteProps | buttonStandartVariantsProps;
@@ -24,6 +33,11 @@ export type StyledButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> &
 /**
  * Developer: daria.bogatiriov@carasent.com
  *
+ * @figmaNode wXrXt5uKNNzV2DnQCgyYZH#13431-18852
+ * @remarks Figma "Button" component. Figma property → React prop mapping is annotated
+ * per-prop with `@figmaProp` (Type→variant, Size→size, Danger→error). The Figma "State"
+ * property (Enabled/Hovered/Focused/Pressed/Disabled) is derived at runtime from the
+ * native button pseudo-states + the `disabled` attribute, not a prop.
  * @remarks for icon button add only startIcon prop
  * @remarks for error button no textGray variant
  *
@@ -36,5 +50,5 @@ export type StyledButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> &
  * @param refLink -  ref to component
  * @param dataTest -  data-test tag
  */
-export declare const StyledButton: ({ variant, className, size, children, refLink, startIcon, endIcon, dataTest, error, ...otherProps }: StyledButtonProps) => JSX.Element;
+export declare const StyledButton: ({ variant, className, size, children, refLink, startIcon, endIcon, dataTest, error, style: styleProp, ...otherProps }: StyledButtonProps) => JSX.Element;
 export {};