@epam/ai-dial-ui-kit 0.16.0-dev.54 → 0.16.0-dev.56

package/dist/src/components/New/LiveRegion/LiveRegion.d.ts

@@ -0,0 +1,58 @@
+import { FC, HTMLAttributes } from 'react';
+import { LiveRegionElement, LiveRegionPoliteness } from '../../../types/live-region';
+export interface LiveRegionProps extends Omit<HTMLAttributes<HTMLElement>, 'role' | 'aria-live' | 'aria-atomic'> {
+    /**
+     * How urgently the change is read. `Polite` (default) renders
+     * `role="status"` + `aria-live="polite"`; `Assertive` renders
+     * `role="alert"` + `aria-live="assertive"`.
+     */
+    politeness?: LiveRegionPoliteness;
+    /** Hide the region visually while keeping it readable by assistive tech (`sr-only`). */
+    visuallyHidden?: boolean;
+    /** Sets `aria-atomic`: read the whole region, not only the changed node, on each change. */
+    atomic?: boolean;
+    /** The wrapper element. Default `LiveRegionElement.Div`; use `Span` inside inline content. */
+    as?: LiveRegionElement;
+}
+/**
+ * A live region that is always in the DOM, so a screen reader announces the
+ * message put into it.
+ * aliases: AriaLive|Announcer|StatusMessage|ScreenReaderAnnouncement|SrOnlyStatus
+ * Design system 2.0
+ *
+ * Screen readers announce a live region reliably only when the region already
+ * exists before its content changes; a region mounted together with its text is
+ * often read late or not at all. `LiveRegion` always renders its wrapper, even
+ * when `children` is empty, `null` or `false` — only the content changes.
+ *
+ * Use it for a message that is not attached to one control and must be heard:
+ * a failed submit, an async status ("Saved", "3 results"), an empty search.
+ * Use something else when:
+ * - the message belongs to a form field — render `ErrorText` / `CaptionText`
+ *   with an `id` and point the control's `aria-describedby` at it (or pass
+ *   `announce` to them when the error must also be announced);
+ * - the message is a toast or a section message — `Notification` and its
+ *   wrappers are already live regions.
+ *
+ * An empty, visible region takes no layout space: while it has no child nodes
+ * it gets `sr-only` (through `empty:sr-only`) rather than `display: none`,
+ * because some screen readers drop a `display: none` node from the
+ * accessibility tree and would then miss the first message put into it.
+ *
+ * @example
+ * ```tsx
+ * <LiveRegion politeness={LiveRegionPoliteness.Assertive}>
+ *   {submitError && <ErrorText text={submitError} />}
+ * </LiveRegion>
+ *
+ * <LiveRegion visuallyHidden>{isEmpty ? 'No results' : ''}</LiveRegion>
+ * ```
+ *
+ * @param [politeness] - `LiveRegionPoliteness.Polite` (default) or `Assertive`.
+ * @param [visuallyHidden] - Hide the region visually (`sr-only`); it is still announced.
+ * @param [atomic] - Sets `aria-atomic`.
+ * @param [as] - The wrapper element, `LiveRegionElement.Div` by default.
+ * @param [className] - Additional CSS classes for the wrapper.
+ * @param [children] - The message. May be empty; the wrapper is rendered anyway.
+ */
+export declare const LiveRegion: FC<LiveRegionProps>;

package/dist/src/components/New/Notification/Notification.d.ts

@@ -1,8 +1,16 @@
 import { FC, HTMLAttributes, MouseEvent, ReactNode } from 'react';
-import { NotificationType, NotificationVariant } from '../../../types/notification';
+import { NotificationSurface, NotificationType, NotificationVariant } from '../../../types/notification';
 export interface NotificationProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
     variant?: NotificationVariant;
     type?: NotificationType;
+    /**
+     * Surface the notification draws on. `NotificationSurface.Neutral` keeps the
+     * variant's icon, icon colour and live-region role but draws the neutral
+     * sunken layer (`bg-layer-sunken`) with primary text instead of the
+     * variant's coloured surface.
+     * @default NotificationSurface.Variant
+     */
+    surface?: NotificationSurface;
     title?: ReactNode;
     message: ReactNode;
     action?: ReactNode;
@@ -18,7 +26,9 @@ export interface NotificationProps extends Omit<HTMLAttributes<HTMLDivElement>,
  * Design system 2.0
  *
  * Renders a colored container with an icon, message text, and an optional
- * close button.
+ * close button. `surface={NotificationSurface.Neutral}` swaps the coloured
+ * container for the neutral sunken layer and keeps the variant's icon, icon
+ * colour and role.
  *
  * The container is a live region whose politeness follows the variant: `error`
  * and `warning` use `role="alert"` (assertive, interrupts the screen reader),
@@ -60,6 +70,14 @@ export interface NotificationProps extends Omit<HTMLAttributes<HTMLDivElement>,
  * />
  *
  * <Notification
+ *   variant={NotificationVariant.Warning}
+ *   type={NotificationType.SectionMessage}
+ *   surface={NotificationSurface.Neutral}
+ *   title="Log in required"
+ *   message="Scheduled tasks run while you are offline."
+ * />
+ *
+ * <Notification
  *   variant={NotificationVariant.Error}
  *   type={NotificationType.SectionMessage}
  *   title="Couldn't finish this response"
@@ -78,6 +96,7 @@ export interface NotificationProps extends Omit<HTMLAttributes<HTMLDivElement>,
  *
  * @param [variant=NotificationVariant.Info] - Defines the visual style and icon of the alert
  * @param [type=NotificationType.Toast] - Defines the type of notification, either a toast or a section message
+ * @param [surface=NotificationSurface.Variant] - `Neutral` draws the neutral sunken surface while keeping the variant's icon, icon colour and role
  * @param [title] - Optional heading displayed above the message in semibold
  * @param message - Message text to display inside the alert
  * @param [action] - Optional control (typically a small `Button`) rendered at the inline end, after the text and before the close button; the caller supplies its accessible name

package/dist/src/components/New/Notification/constants.d.ts

@@ -5,6 +5,17 @@ export declare const variantIcons: (props: {
     stroke: number;
 }) => Record<NotificationVariant, ReactNode>;
 export declare const notificationVariantClassNameMap: Record<NotificationVariant, string>;
+/** Surface classes for `NotificationSurface.Neutral`, whatever the variant. */
+export declare const notificationNeutralSurfaceClassName = "bg-layer-sunken text-primary";
+/**
+ * Icon colour per variant on `NotificationSurface.Neutral`.
+ *
+ * On the variant surface the icon inherits the container's text colour. The
+ * neutral surface sets primary text, so the icon names its status colour
+ * itself; `warning` uses the dedicated `text-warning-icon` token, as the design
+ * does for a warning triangle outside a warning surface.
+ */
+export declare const notificationNeutralSurfaceIconClassNameMap: Record<NotificationVariant, string>;
 /**
  * Live-region role per variant.
  *

package/dist/src/components/New/ToggleChip/ToggleChip.d.ts

@@ -0,0 +1,70 @@
+import { ButtonHTMLAttributes, FC, ReactNode } from 'react';
+type NativeToggleChipProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'type' | 'onToggle' | 'aria-pressed'>;
+export interface ToggleChipProps extends NativeToggleChipProps {
+    label: ReactNode;
+    icon?: ReactNode;
+    isSelected?: boolean;
+    onToggle?: (isSelected: boolean) => void;
+}
+/**
+ * A chip that switches one option on and off on its own, for a row of
+ * independent toggles — tools a model may call, filters that combine.
+ * aliases: ChipToggle|ToggleTag|PressableChip|SelectableChip|MultiSelectChip
+ * Design system 2.0
+ *
+ * Draws the `TagAppearance.Selectable` filter chip of the 2.0 design — no fill
+ * until it is on, one accent hover tint shared by both states, an accent-alpha
+ * fill and a semibold label once on — so a row of these sits beside a
+ * `FilterChips` row without a seam. Turning it on therefore widens it by the
+ * difference between the regular and semibold label; give it a width if that
+ * shift matters.
+ *
+ * Reach for it when each chip is its own yes/no. `FilterChips` picks one value
+ * out of several and `Tag` is a label that may be clicked or removed; neither
+ * keeps several independent states, and `Tag` renders a `<span>` with a string
+ * label. This is a native `<button aria-pressed>`: Enter and Space work, the
+ * state is announced as "pressed", and `disabled` takes it out of the tab order
+ * and greys it out.
+ *
+ * Keep one accessible name across both states — the state rides on
+ * `aria-pressed`, and a control that renames itself on click reads as a
+ * different control. Visible state text such as "ON" / "OFF" belongs inside
+ * `label`, wrapped in `aria-hidden` so it is not read on top of the pressed
+ * state. There is no remove control: a chip that toggles and also closes gives
+ * a screen reader two actions with no way to tell which one it landed on, so a
+ * removable value is a closable `Tag` instead.
+ *
+ * Group a row of these in a named `role="group"` so they are announced
+ * together. Labels are the caller's to translate — the component ships no
+ * English defaults.
+ *
+ * @example
+ * ```tsx
+ * <div role="group" aria-label={t('Tools')} className="flex flex-wrap gap-1">
+ *   {tools.map((tool) => (
+ *     <ToggleChip
+ *       key={tool.id}
+ *       icon={tool.icon}
+ *       label={
+ *         <>
+ *           {tool.label}
+ *           <span aria-hidden="true">: {tool.isOn ? t('ON') : t('OFF')}</span>
+ *         </>
+ *       }
+ *       isSelected={tool.isOn}
+ *       onToggle={(isOn) => setTool(tool.id, isOn)}
+ *     />
+ *   ))}
+ * </div>
+ * ```
+ *
+ * @param label - Content of the chip after the icon. Any node, so trailing state text can follow the name; it truncates on one line
+ * @param [icon] - Icon rendered before the label; hidden from assistive tech
+ * @param [isSelected=false] - Whether the chip is on; rendered as `aria-pressed`
+ * @param [onToggle] - Called with the next value when the chip is activated by click, Enter or Space
+ * @param [disabled=false] - Greys the chip out and stops it responding; it keeps showing its on/off state
+ * @param [onClick] - Native click handler, called before `onToggle`
+ * @param [className] - Additional classes on the button
+ */
+export declare const ToggleChip: FC<ToggleChipProps>;
+export {};

package/dist/src/components/New/ToggleChip/constants.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Type scale per state, as the selectable `Tag` draws it: the regular label
+ * steps up to semibold once the chip is on.
+ */
+export declare const toggleChipLabelClassNames: Record<'default' | 'selected', string>;
+/**
+ * Colours of a disabled chip. The `Tag` design defines no disabled state, so
+ * these follow the kit's other 2.0 controls — the disabled text colour, and on
+ * a chip that is on, the disabled fill `SegmentedControl` gives its selected
+ * segment — keeping the on/off state visible while the chip cannot respond.
+ */
+export declare const toggleChipDisabledClassNames: Record<'default' | 'selected', string>;

package/dist/src/components/ProgressBar/ProgressBar.d.ts

@@ -1,19 +1,31 @@
 import { FC, HTMLAttributes, ReactNode } from 'react';
 import { LabelProps } from '../New/Label/Label';
+import { ProgressBarRole } from '../../types/progress-bar';
 import { ElementSize } from '../../types/size';
-type NativeProgressBarProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'>;
+type NativeProgressBarProps = Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'role'>;
 export interface ProgressBarProps extends NativeProgressBarProps {
     value: number;
     max?: number;
     size?: ElementSize;
     labelProps?: LabelProps;
     valueLabel?: ReactNode;
+    role?: ProgressBarRole;
 }
 /**
- * A horizontal bar indicating progress toward a goal.
- * aliases: Progress|LoadingBar|Meter
+ * A horizontal bar indicating progress toward a goal, or a level within a range.
+ * aliases: Progress|LoadingBar|Meter|Gauge|CapacityMeter|UsageBar
  * Design system 2.0
  *
+ * `role` picks what the bar means. The default, `ProgressBarRole.Progressbar`,
+ * is a task on its way to done — an upload, an import. `ProgressBarRole.Meter`
+ * renders `role="meter"`: a level inside a known range that never completes —
+ * capacity used, a quota, a budget. Both carry `aria-valuemin`,
+ * `aria-valuemax`, `aria-valuenow` and, when given, `aria-valuetext`, and draw
+ * the same track and accent fill; the role changes only what a screen reader
+ * announces. The bar has no low / optimum / high colouring, so a meter that
+ * must change colour near its limit is restyled by the caller through
+ * `className`.
+ *
  * Names itself from `labelProps.label` through `aria-labelledby`; without one it
  * falls back to `aria-label`, and finally to `Progress` so the bar is never
  * anonymous. Prefer a real label — several bars all announcing "Progress" tell a
@@ -33,6 +45,13 @@ export interface ProgressBarProps extends NativeProgressBarProps {
  * <ProgressBar value={40} labelProps={{ label: 'Uploading' }} />
  * <ProgressBar value={3} max={10} aria-valuetext="3 of 10 files" />
  * <ProgressBar value={80} size={ElementSize.Small} />
+ * <ProgressBar
+ *   role={ProgressBarRole.Meter}
+ *   value={usedBytes}
+ *   max={maxBytes}
+ *   aria-label="Project capacity"
+ *   aria-valuetext="42% used"
+ * />
  *
  * <ProgressBar
  *   value={3.313182}
@@ -48,6 +67,7 @@ export interface ProgressBarProps extends NativeProgressBarProps {
  * @param [size=ElementSize.Standard] - Bar height: standard is 8px, small is 4px.
  * @param [labelProps] - Props of the {@link Label} rendered above the bar, which also names it.
  * @param [valueLabel] - Readout rendered at the end of the label row.
+ * @param [role=ProgressBarRole.Progressbar] - ARIA role of the bar: `progressbar` for a task's progress, `meter` for a level within a range. Without a label the bar is named `Progress` or `Meter` respectively.
  * @param [className] - Additional classes on the track element.
  */
 export declare const ProgressBar: FC<ProgressBarProps>;

package/dist/src/constants/public-class-names.d.ts

@@ -19,6 +19,11 @@ export declare const DIAL_KIT_CLASS: {
     readonly noDataContent: "dial-kit-no-data-content";
     /** The `section` root of a `StateScreen`. */
     readonly stateScreen: "dial-kit-state-screen";
+    /**
+     * The always-mounted wrapper of a `LiveRegion` — also the wrapper `CaptionText`
+     * and `ErrorText` render when given `announce`.
+     */
+    readonly liveRegion: "dial-kit-live-region";
     /** The `role="status"` panel of a `TransferQueue`: header, rows and aggregate bar. */
     readonly transferQueue: "dial-kit-transfer-queue";
     /** The text element of a `Highlight`, which renders the matched query. */
@@ -217,6 +222,8 @@ export declare const DIAL_KIT_CLASS: {
      * already carries.
      */
     readonly toggleIconButton: "dial-kit-toggle-icon-button";
+    /** The `<button aria-pressed>` of a `ToggleChip`. */
+    readonly toggleChip: "dial-kit-toggle-chip";
     /** A `CloseButton`, additive to `dial-kit-base-icon-button`. */
     readonly closeButton: "dial-kit-close-button";
     /** An `InfoButton`, additive to `dial-kit-base-icon-button`. */

package/dist/src/index.d.ts

@@ -8,6 +8,7 @@ export { Spinner } from './components/Spinner/Spinner';
 export type { SpinnerProps } from './components/Spinner/Spinner';
 export { ProgressBar } from './components/ProgressBar/ProgressBar';
 export type { ProgressBarProps } from './components/ProgressBar/ProgressBar';
+export { ProgressBarRole } from './types/progress-bar';
 export { DialNoDataContent } from './components/NoDataContent/NoDataContent';
 export type { DialNoDataContentProps } from './components/NoDataContent/NoDataContent';
 export { DialLabelledText } from './components/LabelledText/LabelledText';
@@ -42,7 +43,7 @@ export { ButtonVariant, ButtonAppearance } from './types/button';
 export { RadioGroupOrientation } from './types/radio-group';
 export { PopupSize } from './types/popup';
 export { ConfirmationPopupVariant } from './types/confirmation-popup';
-export { DropdownType, DropdownTrigger, DropdownItemType, } from './types/dropdown';
+export { DropdownType, DropdownTrigger, DropdownItemType, DropdownOverlayRole, } from './types/dropdown';
 export { MenuItemMark } from './types/menu-item';
 export { ElementSize } from './types/size';
 export { ScreenResolution, TabOrientation, TabStatus, TabView, } from './types/tab';
@@ -75,7 +76,7 @@ export { SchemaRendererVariant, SchemaDisplayMode, SchemaOrientation, JsonSchema
 export type { JsonSchema, JsonSchemaDef, ValidationError, SchemaRendererTexts, } from './models/json-schema';
 export { SchemaRenderer } from './components/New/SchemaRenderer/SchemaRenderer';
 export type { SchemaRendererProps, SchemaRenderField, } from './components/New/SchemaRenderer/types';
-export { NotificationVariant, NotificationType } from './types/notification.ts';
+export { NotificationVariant, NotificationType, NotificationSurface, } from './types/notification.ts';
 export { Notification } from './components/New/Notification/Notification';
 export { Highlight } from './components/New/Highlight/Highlight';
 export { CardShell } from './components/New/CardShell/CardShell';
@@ -165,6 +166,8 @@ export { CheckboxBox } from './components/New/Checkbox/CheckboxBox';
 export type { CheckboxBoxProps } from './components/New/Checkbox/CheckboxBox';
 export { ToggleIconButton } from './components/New/ToggleIconButton/ToggleIconButton';
 export type { ToggleIconButtonProps } from './components/New/ToggleIconButton/ToggleIconButton';
+export { ToggleChip } from './components/New/ToggleChip/ToggleChip';
+export type { ToggleChipProps } from './components/New/ToggleChip/ToggleChip';
 export { SegmentedControl } from './components/New/SegmentedControl/SegmentedControl';
 export type { SegmentedControlProps, SegmentedControlItem, } from './components/New/SegmentedControl/SegmentedControl';
 export { Tabs } from './components/New/Tabs/Tabs';
@@ -234,6 +237,9 @@ export { NoDataContent } from './components/New/NoDataContent/NoDataContent';
 export type { NoDataContentProps } from './components/New/NoDataContent/NoDataContent';
 export { StateScreen } from './components/New/StateScreen/StateScreen';
 export type { StateScreenProps } from './components/New/StateScreen/StateScreen';
+export { LiveRegion } from './components/New/LiveRegion/LiveRegion';
+export type { LiveRegionProps } from './components/New/LiveRegion/LiveRegion';
+export { LiveRegionElement, LiveRegionPoliteness } from './types/live-region';
 export { FormSection } from './components/New/FormSection/FormSection';
 export type { FormSectionProps, FormSectionHeadingLevel, } from './components/New/FormSection/FormSection';
 export { FormSectionVariant } from './types/form-section';

package/dist/src/types/dropdown.d.ts

@@ -12,3 +12,19 @@ export declare enum DropdownItemType {
     Divider = "divider",
     PlainText = "plainText"
 }
+/**
+ * Role of the 2.0 `Dropdown`'s floating overlay, and with it the
+ * `aria-haspopup` value its trigger announces.
+ */
+export declare enum DropdownOverlayRole {
+    /** `role="menu"`, trigger `aria-haspopup="menu"`; options are arrow-key navigated. */
+    Menu = "menu",
+    /** `role="dialog"`, trigger `aria-haspopup="dialog"`; for a panel of free-form content. */
+    Dialog = "dialog",
+    /**
+     * No role on the overlay and no `aria-haspopup` on the trigger, which keeps
+     * `aria-expanded`/`aria-controls` as a disclosure; for an overlay whose
+     * content supplies its own semantics (a `region`, its own `dialog`).
+     */
+    None = "none"
+}

package/dist/src/types/live-region.d.ts

@@ -0,0 +1,17 @@
+/**
+ * How urgently a `LiveRegion` asks a screen reader to read a change.
+ */
+export declare enum LiveRegionPoliteness {
+    /** `role="status"` + `aria-live="polite"`: read once the user is idle, queued behind other speech. */
+    Polite = "polite",
+    /** `role="alert"` + `aria-live="assertive"`: interrupts current speech. Reserve for failures the user must act on. */
+    Assertive = "assertive"
+}
+/**
+ * The element a `LiveRegion` renders as its always-mounted wrapper.
+ */
+export declare enum LiveRegionElement {
+    Div = "div",
+    Span = "span",
+    P = "p"
+}

package/dist/src/types/notification.d.ts

@@ -10,3 +10,14 @@ export declare enum NotificationType {
     Toast = "toast",
     SectionMessage = "section-message"
 }
+/**
+ * Which surface a `Notification` draws on.
+ *
+ * - `Variant` — the variant's own coloured surface (`bg-info`, `bg-warning` …).
+ * - `Neutral` — the neutral sunken layer (`bg-layer-sunken`) with primary text;
+ *   the variant still picks the icon, the icon colour and the live-region role.
+ */
+export declare enum NotificationSurface {
+    Variant = "variant",
+    Neutral = "neutral"
+}

package/dist/src/types/progress-bar.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The ARIA role a `ProgressBar` renders, which decides what its value means to
+ * a screen reader.
+ */
+export declare enum ProgressBarRole {
+    /** `role="progressbar"`: how far a task has got toward completion — an upload, an import. */
+    Progressbar = "progressbar",
+    /**
+     * `role="meter"`: a scalar inside a known range that is not a task's
+     * progress — capacity used, a quota, a score. It never "completes".
+     */
+    Meter = "meter"
+}

package/dist/types/dropdown.js

@@ -1,6 +1,7 @@
-var t = /* @__PURE__ */ ((e) => (e.Dropdown = "dropdown", e.Menu = "menu", e))(t || {}), n = /* @__PURE__ */ ((e) => (e.Click = "click", e.Hover = "hover", e.ContextMenu = "contextMenu", e))(n || {}), i = /* @__PURE__ */ ((e) => (e.Item = "item", e.Divider = "divider", e.PlainText = "plainText", e))(i || {});
+var n = /* @__PURE__ */ ((e) => (e.Dropdown = "dropdown", e.Menu = "menu", e))(n || {}), t = /* @__PURE__ */ ((e) => (e.Click = "click", e.Hover = "hover", e.ContextMenu = "contextMenu", e))(t || {}), u = /* @__PURE__ */ ((e) => (e.Item = "item", e.Divider = "divider", e.PlainText = "plainText", e))(u || {}), i = /* @__PURE__ */ ((e) => (e.Menu = "menu", e.Dialog = "dialog", e.None = "none", e))(i || {});
 export {
-  i as DropdownItemType,
-  n as DropdownTrigger,
-  t as DropdownType
+  u as DropdownItemType,
+  i as DropdownOverlayRole,
+  t as DropdownTrigger,
+  n as DropdownType
 };

package/dist/types/live-region.js

@@ -0,0 +1,5 @@
+var a = /* @__PURE__ */ ((r) => (r.Polite = "polite", r.Assertive = "assertive", r))(a || {}), p = /* @__PURE__ */ ((r) => (r.Div = "div", r.Span = "span", r.P = "p", r))(p || {});
+export {
+  p as LiveRegionElement,
+  a as LiveRegionPoliteness
+};

package/dist/types/notification.js

@@ -1,5 +1,6 @@
-var r = /* @__PURE__ */ ((e) => (e.Info = "info", e.Success = "success", e.Warning = "warning", e.Error = "error", e.Loading = "loading", e.General = "general", e))(r || {}), s = /* @__PURE__ */ ((e) => (e.Toast = "toast", e.SectionMessage = "section-message", e))(s || {});
+var e = /* @__PURE__ */ ((r) => (r.Info = "info", r.Success = "success", r.Warning = "warning", r.Error = "error", r.Loading = "loading", r.General = "general", r))(e || {}), s = /* @__PURE__ */ ((r) => (r.Toast = "toast", r.SectionMessage = "section-message", r))(s || {}), g = /* @__PURE__ */ ((r) => (r.Variant = "variant", r.Neutral = "neutral", r))(g || {});
 export {
+  g as NotificationSurface,
   s as NotificationType,
-  r as NotificationVariant
+  e as NotificationVariant
 };

package/dist/types/progress-bar.js

@@ -0,0 +1,4 @@
+var e = /* @__PURE__ */ ((r) => (r.Progressbar = "progressbar", r.Meter = "meter", r))(e || {});
+export {
+  e as ProgressBarRole
+};

package/dist/utils/merge-classes.js

@@ -1,6 +1,6 @@
-import i from "classnames";
+import a from "classnames";
 import { extendTailwindMerge as t } from "../node_modules/tailwind-merge/dist/bundle-mjs.js";
-const l = [
+const e = [
   "display1",
   "display2",
   "display3",
@@ -22,23 +22,26 @@ const l = [
   "caption",
   "caption-lead-semi",
   "code",
+  "code-semi",
+  "tiny-code",
+  "tiny-code-semi",
   "italic",
   "small-italic",
   "tiny-italic",
   "caption-italic"
-], e = t({
+], l = t({
   extend: {
     classGroups: {
       z: [{ z: ["popup", "floating", "interactive-tooltip", "tooltip"] }],
-      "dial-typography": l.map(
-        (a) => `dial-${a}-text`
+      "dial-typography": e.map(
+        (i) => `dial-${i}-text`
       )
     }
   }
 });
-function o(...a) {
-  return e(i(a));
+function p(...i) {
+  return l(a(i));
 }
 export {
-  o as mergeClasses
+  p as mergeClasses
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epam/ai-dial-ui-kit",
-  "version": "0.16.0-dev.54",
+  "version": "0.16.0-dev.56",
   "type": "module",
   "license": "Apache-2.0",
   "description": "A modern UI kit for building AI DIAL interfaces with React",