@tedi-design-system/react 16.0.0-rc.2 → 16.0.0-rc.20

package/src/tedi/components/misc/separator/separator.d.ts

@@ -1,77 +1,103 @@
 import { BreakpointSupport } from '../../../helpers';
-export type SeparatorSpacing = 0 | 0.25 | 0.5 | 0.75 | 1 | 1.25 | 1.5 | 1.75 | 2 | 2.5 | 5;
+export type SeparatorVariant = 'dotted' | 'dot-only';
+export type DotSize = 'large' | 'medium' | 'small' | 'extra-small';
+export type DotStyle = 'filled' | 'outlined';
+export type DotPosition = 'start' | 'center' | 'end' | number;
+/**
+ * Margin/padding-like spacing around the separator
+ * - number → uniform spacing on main axis
+ * - object → fine-grained control (top/bottom/left/right)
+ */
+export type SeparatorSpacing = number | {
+    top?: number;
+    bottom?: number;
+    left?: number;
+    right?: number;
+};
 export interface SeparatorSharedProps {
     /**
-     * Additional class.
+     * Additional class names
      */
     className?: string;
     /**
-     * Rendered HTML element.
-     * @default div
+     * HTML element to render — most common are 'hr', 'div', 'span'
      */
     element?: 'hr' | 'div' | 'span';
     /**
-     * Whether the separator should stretch to fill the full spacing inside cardContent.
+     * When true, the separator stretches to fill available space (100%)
      */
     isStretched?: boolean;
+    /**
+     * Semantic color token
+     * @default primary
+     */
     color?: 'primary' | 'secondary' | 'accent';
-    variant?: 'dotted' | 'dotted-small' | 'dot-only';
-    dotSize?: 'large' | 'medium' | 'small' | 'extra-small';
+    /**
+     * Visual style — line with dots vs standalone centered dot(s)
+     */
+    variant?: SeparatorVariant;
+    /**
+     * Line thickness in pixels (1 or 2) — affects outlined & solid lines
+     */
     thickness?: 1 | 2;
     /**
-     * Spacing applied based on the axis:
-     * - For horizontal axis, spacing is applied to top and bottom of the separator.
-     * - For vertical axis, spacing is applied to left and right of the separator.
+     * Spacing (margin) around the separator
+     * @example
+     * spacing={16}        // 16px top & bottom (horizontal) or left & right (vertical)
+     * spacing={{ top: 24, bottom: 8 }}
      */
     spacing?: SeparatorSpacing;
 }
 export interface SeparatorVerticalProps extends SeparatorSharedProps {
     /**
-     * Height of separator. Use with vertical axis, when full-width separator is not needed.
-     * Height can be number in rem units. It's customizable to allow for more flexibility around X components.
+     * Must be set to 'vertical'
+     */
+    axis: 'vertical';
+    /**
+     * Height of the vertical separator in rem units
      */
     height?: number;
     /**
-     * Axis of separator, vertical and horizontal separators support different props
+     * CSS display value — usually 'block' or 'inline-block'
      */
-    axis: 'vertical';
-    topSpacing?: undefined;
-    bottomSpacing?: undefined;
-    display?: 'block' | 'inline';
+    display?: 'block' | 'inline' | 'inline-block';
 }
 export interface SeparatorHorizontalProps extends SeparatorSharedProps {
     /**
-     * Spacing on top of separator. Ignored when spacing is also used. Only for horizontal axis.
+     * Must be set to 'horizontal' or left undefined (defaults to horizontal)
      */
-    topSpacing?: SeparatorSpacing;
+    axis?: 'horizontal';
     /**
-     * Spacing on bottom of separator. Ignored when spacing is also used. Only for horizontal axis.
-     */
-    bottomSpacing?: SeparatorSpacing;
+    Vertical height is not used in horizontal mode
+    */
+    height?: undefined;
     /**
-     * Axis of separator, vertical and horizontal separators support different props
+     * Display is forced to 'block' in horizontal mode
      */
-    axis?: 'horizontal';
-    height?: undefined;
     display?: 'block';
 }
-export type SeparatorBreakpointProps = {
+type DottedSeparatorProps = {
+    variant?: 'dotted';
+    dotSize?: DotSize;
+    dotStyle?: DotStyle;
     /**
-     * Spacing values based on breakpoints.
+     * Position of the single dot
+     * @example
+     * 'center' | 'start' | 'end' | 2.5  // 2.5rem from start
      */
-    spacing?: Omit<SeparatorHorizontalProps['spacing'], 'axis'>;
-    /**
-     * Height values based on breakpoints (for vertical separators).
-     */
-    height?: Omit<SeparatorVerticalProps['height'], 'axis'>;
-    axis?: 'horizontal' | 'vertical';
+    dotPosition?: DotPosition;
 };
-export type SeparatorProps = BreakpointSupport<(SeparatorHorizontalProps | (SeparatorVerticalProps & {
-    variant?: 'dotted' | 'dotted-small';
-    dotSize?: undefined;
-})) | (SeparatorHorizontalProps | (SeparatorVerticalProps & {
+type DotOnlySeparatorProps = {
     variant: 'dot-only';
-    dotSize: 'large' | 'medium' | 'small' | 'extra-small';
-}))> & SeparatorBreakpointProps;
+    dotSize: DotSize;
+    dotStyle?: DotStyle;
+    dotPosition?: never;
+};
+export type SeparatorBreakpointProps = {
+    spacing?: SeparatorSpacing;
+    height?: number;
+    axis?: 'horizontal' | 'vertical';
+};
+export type SeparatorProps = BreakpointSupport<(SeparatorHorizontalProps & (DottedSeparatorProps | DotOnlySeparatorProps)) | (SeparatorVerticalProps & (DottedSeparatorProps | DotOnlySeparatorProps))> & SeparatorBreakpointProps;
 export declare const Separator: (props: SeparatorProps) => JSX.Element;
 export default Separator;

package/src/tedi/components/misc/separator/separator.es.js

@@ -1,43 +1,51 @@
-import { jsx as k } from "react/jsx-runtime";
-import v from "../../../../../external/classnames/index.es.js";
+import { jsx as B } from "react/jsx-runtime";
+import N from "../../../../../external/classnames/index.es.js";
 import t from "./separator.module.scss.es.js";
-import { useBreakpointProps as B } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-const z = (a) => {
-  const { getCurrentBreakpointProps: $ } = B(a.defaultServerBreakpoint), {
-    className: g,
-    element: h = "div",
-    isStretched: f,
-    spacing: r,
-    topSpacing: s,
-    bottomSpacing: o,
-    axis: i = "horizontal",
-    color: p = "default",
-    variant: e,
-    thickness: c = 1,
-    height: n,
-    dotSize: d,
-    display: l = "block",
-    ...u
-  } = $(a), S = v(
+import { useBreakpointProps as z } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+const M = (m) => {
+  const { getCurrentBreakpointProps: u } = z(m.defaultServerBreakpoint), {
+    className: b,
+    element: k = "div",
+    isStretched: v,
+    spacing: e,
+    axis: c = "horizontal",
+    color: S = "primary",
+    variant: o,
+    thickness: r = 1,
+    height: f,
+    dotSize: $ = "large",
+    dotStyle: h = "filled",
+    dotPosition: n,
+    display: y = "block",
+    ...P
+  } = u(m), l = typeof n == "number", g = o !== "dot-only" && !l ? n : void 0;
+  let a = 0, s = 0, i = 0, p = 0;
+  typeof e == "number" && (c === "horizontal" ? a = s = e : i = p = e), typeof e == "object" && e !== null && (a = e.top ?? a, s = e.bottom ?? s, i = e.left ?? i, p = e.right ?? p);
+  const x = N(
     t["tedi-separator"],
-    g,
-    { [t[`tedi-separator--${p}`]]: p },
-    { [t[`tedi-separator--${i}`]]: i },
-    { [t[`tedi-separator--${e}`]]: e },
-    { [t[`tedi-separator--${l}`]]: l },
-    { [t[`tedi-separator--${e}-${d}`]]: e && d },
-    { [t[`tedi-separator--thickness-${c}`]]: c && !e },
-    { [t["tedi-separator--is-stretched"]]: f },
-    { [t[`tedi-separator--spacing-${r}`.replace(".", "-")]]: r },
-    { [t[`tedi-separator--top-${s}`.replace(".", "-")]]: !r && s },
-    { [t[`tedi-separator--bottom-${o}`.replace(".", "-")]]: !r && o }
-  );
-  return /* @__PURE__ */ k(h, { "data-name": "separator", ...u, style: (() => {
-    const m = {};
-    return n && (m["--vertical-separator-height"] = `${n}rem`), m;
-  })(), className: S });
+    b,
+    t[`tedi-separator--${c}`],
+    t[`tedi-separator--${S}`],
+    {
+      [t[`tedi-separator--${o}`]]: o,
+      [t[`tedi-separator--${y}`]]: y,
+      [t[`tedi-separator--dotted-${$}`]]: o === "dotted",
+      [t[`tedi-separator--dot-only-${$}`]]: o === "dot-only",
+      [t[`tedi-separator--dot-style-${h}`]]: o,
+      [t[`tedi-separator--dot-position-${g}`]]: typeof g == "string" && o !== "dot-only",
+      [t["tedi-separator--dot-position-custom"]]: l,
+      [t["tedi-separator--is-stretched"]]: v,
+      [t[`tedi-separator--thickness-${r}`]]: r || h === "outlined" ? r : void 0
+    }
+  ), d = {
+    "--separator-margin-top": `${a}rem`,
+    "--separator-margin-bottom": `${s}rem`,
+    "--separator-margin-left": `${i}rem`,
+    "--separator-margin-right": `${p}rem`
+  };
+  return f && (d["--vertical-separator-height"] = `${f}rem`), r && (d["--separator-thickness"] = `${r}px`), o === "dotted" && l && (d["--separator-dot-position"] = `${n}rem`), /* @__PURE__ */ B(k, { "data-name": "separator", ...P, style: d, className: x });
 };
 export {
-  z as Separator,
-  z as default
+  M as Separator,
+  M as default
 };

package/src/tedi/components/misc/separator/separator.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"tedi-separator":"tedi-separator-08861c00","tedi-separator--vertical":"tedi-separator--vertical-fee3a031","tedi-separator--secondary":"tedi-separator--secondary-bb0cc0a1","tedi-separator--accent":"tedi-separator--accent-17878389","tedi-separator--block":"tedi-separator--block-48f7fe7e","tedi-separator--inline":"tedi-separator--inline-9021c8fe","tedi-separator--dotted":"tedi-separator--dotted-e3766e9c","tedi-separator--dotted-small":"tedi-separator--dotted-small-71e3be2e","tedi-separator--is-stretched":"tedi-separator--is-stretched-dfd66f31","tedi-separator--horizontal":"tedi-separator--horizontal-47a3986e","tedi-separator--top-0":"tedi-separator--top-0-677363d3","tedi-separator--bottom-0":"tedi-separator--bottom-0-e8608c44","tedi-separator--spacing-0":"tedi-separator--spacing-0-d3de83fa","tedi-separator--dot-only":"tedi-separator--dot-only-3babc1e5","tedi-separator--top-0-25":"tedi-separator--top-0-25-e87283bc","tedi-separator--bottom-0-25":"tedi-separator--bottom-0-25-c79e8c15","tedi-separator--spacing-0-25":"tedi-separator--spacing-0-25-6773860d","tedi-separator--top-0-5":"tedi-separator--top-0-5-e324a36c","tedi-separator--bottom-0-5":"tedi-separator--bottom-0-5-33887212","tedi-separator--spacing-0-5":"tedi-separator--spacing-0-5-36726d06","tedi-separator--top-0-75":"tedi-separator--top-0-75-e74f255c","tedi-separator--bottom-0-75":"tedi-separator--bottom-0-75-48b41611","tedi-separator--spacing-0-75":"tedi-separator--spacing-0-75-9bb50a77","tedi-separator--top-1":"tedi-separator--top-1-655231b6","tedi-separator--bottom-1":"tedi-separator--bottom-1-7e9cb062","tedi-separator--spacing-1":"tedi-separator--spacing-1-a40c2177","tedi-separator--top-1-25":"tedi-separator--top-1-25-b2261ac9","tedi-separator--bottom-1-25":"tedi-separator--bottom-1-25-0f204938","tedi-separator--spacing-1-25":"tedi-separator--spacing-1-25-d53a5705","tedi-separator--top-1-5":"tedi-separator--top-1-5-a2896e5b","tedi-separator--bottom-1-5":"tedi-separator--bottom-1-5-521ea969","tedi-separator--spacing-1-5":"tedi-separator--spacing-1-5-eec3fd3a","tedi-separator--top-1-75":"tedi-separator--top-1-75-376bb3f5","tedi-separator--bottom-1-75":"tedi-separator--bottom-1-75-601de207","tedi-separator--spacing-1-75":"tedi-separator--spacing-1-75-2738dc67","tedi-separator--top-2":"tedi-separator--top-2-d45b7bb4","tedi-separator--bottom-2":"tedi-separator--bottom-2-e0846020","tedi-separator--spacing-2":"tedi-separator--spacing-2-2b1d21c5","tedi-separator--top-2-5":"tedi-separator--top-2-5-9b0adc94","tedi-separator--bottom-2-5":"tedi-separator--bottom-2-5-3b00b4c4","tedi-separator--spacing-2-5":"tedi-separator--spacing-2-5-28334f74","tedi-separator--top-5":"tedi-separator--top-5-06286d83","tedi-separator--bottom-5":"tedi-separator--bottom-5-44801c7a","tedi-separator--spacing-5":"tedi-separator--spacing-5-86a9da4b","tedi-separator--thickness-1":"tedi-separator--thickness-1-d3383a73","tedi-separator--thickness-2":"tedi-separator--thickness-2-c8739ef3","tedi-separator--dot-only-extra-small":"tedi-separator--dot-only-extra-small-2eed2366","tedi-separator--dot-only-small":"tedi-separator--dot-only-small-fc9bf9ea","tedi-separator--dot-only-medium":"tedi-separator--dot-only-medium-d8c48848","tedi-separator--dot-only-large":"tedi-separator--dot-only-large-37aaffff","tedi-separator--primary":"tedi-separator--primary-9aa696f5"};exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"tedi-separator":"tedi-separator-08861c00","tedi-separator--vertical":"tedi-separator--vertical-fee3a031","tedi-separator--horizontal":"tedi-separator--horizontal-47a3986e","tedi-separator--block":"tedi-separator--block-48f7fe7e","tedi-separator--inline":"tedi-separator--inline-9021c8fe","tedi-separator--secondary":"tedi-separator--secondary-bb0cc0a1","tedi-separator--accent":"tedi-separator--accent-17878389","tedi-separator--is-stretched":"tedi-separator--is-stretched-dfd66f31","tedi-separator--dotted":"tedi-separator--dotted-e3766e9c","tedi-separator--dot-only":"tedi-separator--dot-only-3babc1e5","tedi-separator--dot-style-outlined":"tedi-separator--dot-style-outlined-5301302a","tedi-separator--primary":"tedi-separator--primary-9aa696f5","tedi-separator--dot-only-extra-small":"tedi-separator--dot-only-extra-small-2eed2366","tedi-separator--dotted-extra-small":"tedi-separator--dotted-extra-small-04cdb637","tedi-separator--dot-only-small":"tedi-separator--dot-only-small-fc9bf9ea","tedi-separator--dotted-small":"tedi-separator--dotted-small-71e3be2e","tedi-separator--dot-only-medium":"tedi-separator--dot-only-medium-d8c48848","tedi-separator--dotted-medium":"tedi-separator--dotted-medium-dcac8ef1","tedi-separator--dot-only-large":"tedi-separator--dot-only-large-37aaffff","tedi-separator--dotted-large":"tedi-separator--dotted-large-fc504c80","tedi-separator--dot-position-start":"tedi-separator--dot-position-start-0ac40f9d","tedi-separator--dot-position-center":"tedi-separator--dot-position-center-fa7a5106","tedi-separator--dot-position-end":"tedi-separator--dot-position-end-5e4cadd7","tedi-separator--dot-position-custom":"tedi-separator--dot-position-custom-7d43112e","tedi-separator--thickness-1":"tedi-separator--thickness-1-d3383a73","tedi-separator--thickness-2":"tedi-separator--thickness-2-c8739ef3","tedi-separator--dotted-primary":"tedi-separator--dotted-primary-40602300","tedi-separator--dotted-secondary":"tedi-separator--dotted-secondary-c885ca72","tedi-separator--dotted-accent":"tedi-separator--dotted-accent-13a86572"};exports.default=t;

package/src/tedi/components/misc/separator/separator.module.scss.es.js

@@ -1,55 +1,33 @@
 const t = {
   "tedi-separator": "tedi-separator-08861c00",
   "tedi-separator--vertical": "tedi-separator--vertical-fee3a031",
-  "tedi-separator--secondary": "tedi-separator--secondary-bb0cc0a1",
-  "tedi-separator--accent": "tedi-separator--accent-17878389",
+  "tedi-separator--horizontal": "tedi-separator--horizontal-47a3986e",
   "tedi-separator--block": "tedi-separator--block-48f7fe7e",
   "tedi-separator--inline": "tedi-separator--inline-9021c8fe",
-  "tedi-separator--dotted": "tedi-separator--dotted-e3766e9c",
-  "tedi-separator--dotted-small": "tedi-separator--dotted-small-71e3be2e",
+  "tedi-separator--secondary": "tedi-separator--secondary-bb0cc0a1",
+  "tedi-separator--accent": "tedi-separator--accent-17878389",
   "tedi-separator--is-stretched": "tedi-separator--is-stretched-dfd66f31",
-  "tedi-separator--horizontal": "tedi-separator--horizontal-47a3986e",
-  "tedi-separator--top-0": "tedi-separator--top-0-677363d3",
-  "tedi-separator--bottom-0": "tedi-separator--bottom-0-e8608c44",
-  "tedi-separator--spacing-0": "tedi-separator--spacing-0-d3de83fa",
+  "tedi-separator--dotted": "tedi-separator--dotted-e3766e9c",
   "tedi-separator--dot-only": "tedi-separator--dot-only-3babc1e5",
-  "tedi-separator--top-0-25": "tedi-separator--top-0-25-e87283bc",
-  "tedi-separator--bottom-0-25": "tedi-separator--bottom-0-25-c79e8c15",
-  "tedi-separator--spacing-0-25": "tedi-separator--spacing-0-25-6773860d",
-  "tedi-separator--top-0-5": "tedi-separator--top-0-5-e324a36c",
-  "tedi-separator--bottom-0-5": "tedi-separator--bottom-0-5-33887212",
-  "tedi-separator--spacing-0-5": "tedi-separator--spacing-0-5-36726d06",
-  "tedi-separator--top-0-75": "tedi-separator--top-0-75-e74f255c",
-  "tedi-separator--bottom-0-75": "tedi-separator--bottom-0-75-48b41611",
-  "tedi-separator--spacing-0-75": "tedi-separator--spacing-0-75-9bb50a77",
-  "tedi-separator--top-1": "tedi-separator--top-1-655231b6",
-  "tedi-separator--bottom-1": "tedi-separator--bottom-1-7e9cb062",
-  "tedi-separator--spacing-1": "tedi-separator--spacing-1-a40c2177",
-  "tedi-separator--top-1-25": "tedi-separator--top-1-25-b2261ac9",
-  "tedi-separator--bottom-1-25": "tedi-separator--bottom-1-25-0f204938",
-  "tedi-separator--spacing-1-25": "tedi-separator--spacing-1-25-d53a5705",
-  "tedi-separator--top-1-5": "tedi-separator--top-1-5-a2896e5b",
-  "tedi-separator--bottom-1-5": "tedi-separator--bottom-1-5-521ea969",
-  "tedi-separator--spacing-1-5": "tedi-separator--spacing-1-5-eec3fd3a",
-  "tedi-separator--top-1-75": "tedi-separator--top-1-75-376bb3f5",
-  "tedi-separator--bottom-1-75": "tedi-separator--bottom-1-75-601de207",
-  "tedi-separator--spacing-1-75": "tedi-separator--spacing-1-75-2738dc67",
-  "tedi-separator--top-2": "tedi-separator--top-2-d45b7bb4",
-  "tedi-separator--bottom-2": "tedi-separator--bottom-2-e0846020",
-  "tedi-separator--spacing-2": "tedi-separator--spacing-2-2b1d21c5",
-  "tedi-separator--top-2-5": "tedi-separator--top-2-5-9b0adc94",
-  "tedi-separator--bottom-2-5": "tedi-separator--bottom-2-5-3b00b4c4",
-  "tedi-separator--spacing-2-5": "tedi-separator--spacing-2-5-28334f74",
-  "tedi-separator--top-5": "tedi-separator--top-5-06286d83",
-  "tedi-separator--bottom-5": "tedi-separator--bottom-5-44801c7a",
-  "tedi-separator--spacing-5": "tedi-separator--spacing-5-86a9da4b",
-  "tedi-separator--thickness-1": "tedi-separator--thickness-1-d3383a73",
-  "tedi-separator--thickness-2": "tedi-separator--thickness-2-c8739ef3",
+  "tedi-separator--dot-style-outlined": "tedi-separator--dot-style-outlined-5301302a",
+  "tedi-separator--primary": "tedi-separator--primary-9aa696f5",
   "tedi-separator--dot-only-extra-small": "tedi-separator--dot-only-extra-small-2eed2366",
+  "tedi-separator--dotted-extra-small": "tedi-separator--dotted-extra-small-04cdb637",
   "tedi-separator--dot-only-small": "tedi-separator--dot-only-small-fc9bf9ea",
+  "tedi-separator--dotted-small": "tedi-separator--dotted-small-71e3be2e",
   "tedi-separator--dot-only-medium": "tedi-separator--dot-only-medium-d8c48848",
+  "tedi-separator--dotted-medium": "tedi-separator--dotted-medium-dcac8ef1",
   "tedi-separator--dot-only-large": "tedi-separator--dot-only-large-37aaffff",
-  "tedi-separator--primary": "tedi-separator--primary-9aa696f5"
+  "tedi-separator--dotted-large": "tedi-separator--dotted-large-fc504c80",
+  "tedi-separator--dot-position-start": "tedi-separator--dot-position-start-0ac40f9d",
+  "tedi-separator--dot-position-center": "tedi-separator--dot-position-center-fa7a5106",
+  "tedi-separator--dot-position-end": "tedi-separator--dot-position-end-5e4cadd7",
+  "tedi-separator--dot-position-custom": "tedi-separator--dot-position-custom-7d43112e",
+  "tedi-separator--thickness-1": "tedi-separator--thickness-1-d3383a73",
+  "tedi-separator--thickness-2": "tedi-separator--thickness-2-c8739ef3",
+  "tedi-separator--dotted-primary": "tedi-separator--dotted-primary-40602300",
+  "tedi-separator--dotted-secondary": "tedi-separator--dotted-secondary-c885ca72",
+  "tedi-separator--dotted-accent": "tedi-separator--dotted-accent-13a86572"
 };
 export {
   t as default

package/src/tedi/components/notifications/alert/alert.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),S=require("../../../../../external/classnames/index.cjs.js"),w=require("react"),C=require("../../base/icon/icon.cjs.js"),M=require("../../base/typography/heading/heading.cjs.js"),N=require("../../buttons/closing-button/closing-button.cjs.js"),t=require("./alert.module.scss.cjs.js"),P=require("../../../helpers/hooks/use-is-mounted.cjs.js"),k=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),y=require("../../layout/vertical-spacing/vertical-spacing.cjs.js"),z=require("../../layout/grid/row.cjs.js"),f=require("../../layout/grid/col.cjs.js"),p=a=>{const{getCurrentBreakpointProps:g}=k.useBreakpointProps(a.defaultServerBreakpoint),{children:s,role:i="alert",title:r,className:m,type:l="info",icon:o,onClose:c,isGlobal:h=!1,noSideBorders:j=!1,titleElement:q="h3",...x}=g(a),v=S.default(t.default["tedi-alert"],t.default[`tedi-alert--${l}`],{[t.default["tedi-alert--global"]]:h,[t.default["tedi-alert--no-side-borders"]]:j},m),_=P.useIsMounted(),b=n=>{const u={size:18},I=typeof n=="string"?{...u,name:n}:{...u,...n};return e.jsx(C.Icon,{...I,className:t.default["tedi-alert__icon"]})},B=i==="alert"?"assertive":i==="status"?"polite":"off",d=w.useId();return _?e.jsx("div",{role:i,"data-name":"alert","aria-label":`${l} alert`,"aria-live":B,"aria-labelledby":r?d:void 0,...x,className:v,children:e.jsxs(y.VerticalSpacing,{size:.25,children:[e.jsxs(z.Row,{gutterX:2,alignItems:r?"center":"start",children:[e.jsxs(f.Col,{grow:1,className:t.default["tedi-alert__content"],children:[o&&b(o),e.jsx("div",{className:"tedi-alert__content-wrapper",children:r?e.jsx(M.Heading,{element:q,id:d,modifiers:["h5"],children:r}):s})]}),c&&e.jsx(f.Col,{width:"auto",children:e.jsx(N.ClosingButton,{onClick:c,iconSize:18})})]}),r&&s&&e.jsx("div",{className:"tedi-alert__content-wrapper",children:s})]})}):null};exports.Alert=p;exports.default=p;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),w=require("../../../../../external/classnames/index.cjs.js"),C=require("react"),M=require("../../base/icon/icon.cjs.js"),N=require("../../base/typography/heading/heading.cjs.js"),P=require("../../buttons/closing-button/closing-button.cjs.js"),t=require("./alert.module.scss.cjs.js"),k=require("../../../helpers/hooks/use-is-mounted.cjs.js"),z=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),y=require("../../layout/vertical-spacing/vertical-spacing.cjs.js"),$=require("../../layout/grid/row.cjs.js"),f=require("../../layout/grid/col.cjs.js"),p=l=>{const{getCurrentBreakpointProps:g}=z.useBreakpointProps(l.defaultServerBreakpoint),{children:s,role:i="alert",title:r,className:m,type:n="info",icon:o,onClose:c,isGlobal:h=!1,noSideBorders:j=!1,titleElement:q="h3",size:x="default",...v}=g(l),_=w.default(t.default["tedi-alert"],t.default[`tedi-alert--${n}`],t.default[`tedi-alert--size-${x}`],{[t.default["tedi-alert--global"]]:h,[t.default["tedi-alert--no-side-borders"]]:j},m),b=k.useIsMounted(),B=a=>{const u={size:18},S=typeof a=="string"?{...u,name:a}:{...u,...a};return e.jsx(M.Icon,{...S,className:t.default["tedi-alert__icon"]})},I=i==="alert"?"assertive":i==="status"?"polite":"off",d=C.useId();return b?e.jsx("div",{role:i,"data-name":"alert","aria-label":`${n} alert`,"aria-live":I,"aria-labelledby":r?d:void 0,...v,className:_,children:e.jsxs(y.VerticalSpacing,{size:.25,children:[e.jsxs($.Row,{gutterX:2,alignItems:r?"center":"start",children:[e.jsxs(f.Col,{grow:1,className:t.default["tedi-alert__content"],children:[o&&B(o),e.jsx("div",{className:"tedi-alert__content-wrapper",children:r?e.jsx(N.Heading,{element:q,id:d,modifiers:["h5"],children:r}):s})]}),c&&e.jsx(f.Col,{width:"auto",children:e.jsx(P.ClosingButton,{onClick:c,iconSize:18})})]}),r&&s&&e.jsx("div",{className:"tedi-alert__content-wrapper",children:s})]})}):null};exports.Alert=p;exports.default=p;

package/src/tedi/components/notifications/alert/alert.d.ts

@@ -20,6 +20,13 @@ type AlertBreakpointProps = {
      * @default false
      */
     noSideBorders?: boolean;
+    /**
+     * Alert size variant.
+     * - 'default': Standard alert size with padding and border radius.
+     * - 'small': More compact alert size with reduced padding.
+     * @default default
+     */
+    size?: 'default' | 'small';
 };
 export interface AlertProps extends BreakpointSupport<AlertBreakpointProps> {
     /**
@@ -69,7 +76,7 @@ export interface AlertProps extends BreakpointSupport<AlertBreakpointProps> {
      * // For secondary notifications
      * titleElement="h4"
      *
-     * @default 'h3'
+     * @default h3
      */
     titleElement?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 }

package/src/tedi/components/notifications/alert/alert.es.js

@@ -5,13 +5,13 @@ import { Icon as P } from "../../base/icon/icon.es.js";
 import { Heading as S } from "../../base/typography/heading/heading.es.js";
 import { ClosingButton as x } from "../../buttons/closing-button/closing-button.es.js";
 import t from "./alert.module.scss.es.js";
-import { useIsMounted as z } from "../../../helpers/hooks/use-is-mounted.es.js";
-import { useBreakpointProps as M } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+import { useIsMounted as M } from "../../../helpers/hooks/use-is-mounted.es.js";
+import { useBreakpointProps as $ } from "../../../helpers/hooks/use-breakpoint-props.es.js";
 import { VerticalSpacing as j } from "../../layout/vertical-spacing/vertical-spacing.es.js";
 import { Row as E } from "../../layout/grid/row.es.js";
 import { Col as f } from "../../layout/grid/col.es.js";
-const K = (s) => {
-  const { getCurrentBreakpointProps: u } = M(s.defaultServerBreakpoint), {
+const O = (s) => {
+  const { getCurrentBreakpointProps: u } = $(s.defaultServerBreakpoint), {
     children: o,
     role: i = "alert",
     title: r,
@@ -22,33 +22,35 @@ const K = (s) => {
     isGlobal: g = !1,
     noSideBorders: _ = !1,
     titleElement: v = "h3",
-    ...I
-  } = u(s), N = k(
+    size: I = "default",
+    ...N
+  } = u(s), b = k(
     t["tedi-alert"],
     t[`tedi-alert--${n}`],
+    t[`tedi-alert--size-${I}`],
     {
       [t["tedi-alert--global"]]: g,
       [t["tedi-alert--no-side-borders"]]: _
     },
     h
-  ), b = z(), B = (a) => {
+  ), B = M(), w = (a) => {
     const p = { size: 18 }, C = typeof a == "string" ? { ...p, name: a } : { ...p, ...a };
     return /* @__PURE__ */ e(P, { ...C, className: t["tedi-alert__icon"] });
-  }, w = i === "alert" ? "assertive" : i === "status" ? "polite" : "off", m = y.useId();
-  return b ? /* @__PURE__ */ e(
+  }, z = i === "alert" ? "assertive" : i === "status" ? "polite" : "off", m = y.useId();
+  return B ? /* @__PURE__ */ e(
     "div",
     {
       role: i,
       "data-name": "alert",
       "aria-label": `${n} alert`,
-      "aria-live": w,
+      "aria-live": z,
       "aria-labelledby": r ? m : void 0,
-      ...I,
-      className: N,
+      ...N,
+      className: b,
       children: /* @__PURE__ */ l(j, { size: 0.25, children: [
         /* @__PURE__ */ l(E, { gutterX: 2, alignItems: r ? "center" : "start", children: [
           /* @__PURE__ */ l(f, { grow: 1, className: t["tedi-alert__content"], children: [
-            d && B(d),
+            d && w(d),
             /* @__PURE__ */ e("div", { className: "tedi-alert__content-wrapper", children: r ? /* @__PURE__ */ e(S, { element: v, id: m, modifiers: ["h5"], children: r }) : o })
           ] }),
           c && /* @__PURE__ */ e(f, { width: "auto", children: /* @__PURE__ */ e(x, { onClick: c, iconSize: 18 }) })
@@ -59,6 +61,6 @@ const K = (s) => {
   ) : null;
 };
 export {
-  K as Alert,
-  K as default
+  O as Alert,
+  O as default
 };

package/src/tedi/components/notifications/alert/alert.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-alert":"tedi-alert-8ca3e7b9","tedi-alert__content":"tedi-alert__content-d480ed20","tedi-alert__icon":"tedi-alert__icon-f9ab1feb","tedi-alert--info":"tedi-alert--info-bcd40044","tedi-alert--success":"tedi-alert--success-e6d21f49","tedi-alert--warning":"tedi-alert--warning-88456526","tedi-alert--danger":"tedi-alert--danger-b9a2aa60","tedi-alert--global":"tedi-alert--global-14ff86d0","tedi-alert--no-side-borders":"tedi-alert--no-side-borders-a15a1df0"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-alert":"tedi-alert-8ca3e7b9","tedi-alert__content":"tedi-alert__content-d480ed20","tedi-alert__icon":"tedi-alert__icon-f9ab1feb","tedi-alert--size-default":"tedi-alert--size-default-6a9ebe2c","tedi-alert--size-small":"tedi-alert--size-small-4c763cad","tedi-alert--info":"tedi-alert--info-bcd40044","tedi-alert--success":"tedi-alert--success-e6d21f49","tedi-alert--warning":"tedi-alert--warning-88456526","tedi-alert--danger":"tedi-alert--danger-b9a2aa60","tedi-alert--global":"tedi-alert--global-14ff86d0","tedi-alert--no-side-borders":"tedi-alert--no-side-borders-a15a1df0"};exports.default=e;

package/src/tedi/components/notifications/alert/alert.module.scss.es.js

@@ -2,6 +2,8 @@ const e = {
   "tedi-alert": "tedi-alert-8ca3e7b9",
   "tedi-alert__content": "tedi-alert__content-d480ed20",
   "tedi-alert__icon": "tedi-alert__icon-f9ab1feb",
+  "tedi-alert--size-default": "tedi-alert--size-default-6a9ebe2c",
+  "tedi-alert--size-small": "tedi-alert--size-small-4c763cad",
   "tedi-alert--info": "tedi-alert--info-bcd40044",
   "tedi-alert--success": "tedi-alert--success-e6d21f49",
   "tedi-alert--warning": "tedi-alert--warning-88456526",

package/src/tedi/components/overlays/overlay/overlay-content.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),r=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),d=require("react"),p=require("./overlay.cjs.js"),j=s=>{const{children:u,classNames:e,labelledBy:y,describedBy:f}=s,{open:n,x:m,y:h,strategy:g,focusManager:o,floating:b,arrowRef:v,getFloatingProps:x,placement:w,context:i,arrow:t,scrollLock:a}=d.useContext(p.OverlayContext);return d.useEffect(()=>{a&&(n?(document.documentElement.style.overflow="hidden",document.documentElement.scrollHeight>window.innerHeight&&(document.body.style.overflow="scroll")):(document.documentElement.style.overflow="",document.body.style.overflow=""))},[n,a]),n?l.jsx(r.FloatingPortal,{children:l.jsx(r.FloatingFocusManager,{modal:(o==null?void 0:o.modal)||!1,...o,context:i,children:l.jsxs("div",{...x({ref:b,tabIndex:-1,"aria-labelledby":y,"aria-describedby":f,style:{position:g,left:m,top:h},className:e==null?void 0:e.content}),"data-placement":w,"data-testid":"overlay-content",children:[l.jsx(r.FloatingArrow,{ref:c=>v.current=c,context:i,className:e==null?void 0:e.arrow,height:t==null?void 0:t.height,width:t==null?void 0:t.width,"data-testid":"overlay-arrow"}),u]})})}):null};exports.OverlayContent=j;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),r=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),d=require("react"),j=require("./overlay.cjs.js"),F=s=>{const{children:u,classNames:e,labelledBy:y,describedBy:f}=s,{open:l,x:m,y:h,strategy:g,focusManager:o,floating:b,arrowRef:v,getFloatingProps:x,placement:w,context:i,arrow:t,scrollLock:c,contentId:p}=d.useContext(j.OverlayContext);return d.useEffect(()=>{c&&(l?(document.documentElement.style.overflow="hidden",document.documentElement.scrollHeight>window.innerHeight&&(document.body.style.overflow="scroll")):(document.documentElement.style.overflow="",document.body.style.overflow=""))},[l,c]),l?n.jsx(r.FloatingPortal,{children:n.jsx(r.FloatingFocusManager,{modal:(o==null?void 0:o.modal)||!1,...o,context:i,children:n.jsxs("div",{...x({ref:b,tabIndex:-1,id:p,"aria-labelledby":y,"aria-describedby":f,style:{position:g,left:m,top:h},className:e==null?void 0:e.content}),"data-placement":w,"data-testid":"overlay-content",children:[n.jsx(r.FloatingArrow,{ref:a=>v.current=a,context:i,className:e==null?void 0:e.arrow,height:t==null?void 0:t.height,width:t==null?void 0:t.width,"data-testid":"overlay-arrow"}),u]})})}):null};exports.OverlayContent=F;

package/src/tedi/components/overlays/overlay/overlay-content.es.js

@@ -1,7 +1,7 @@
-import { jsx as n, jsxs as v } from "react/jsx-runtime";
-import { FloatingPortal as w, FloatingFocusManager as x, FloatingArrow as F } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
-import { useContext as E, useEffect as C } from "react";
-import { OverlayContext as j } from "./overlay.es.js";
+import { jsx as n, jsxs as w } from "react/jsx-runtime";
+import { FloatingPortal as x, FloatingFocusManager as F, FloatingArrow as E } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
+import { useContext as C, useEffect as j } from "react";
+import { OverlayContext as B } from "./overlay.es.js";
 const S = (a) => {
   const { children: c, classNames: e, labelledBy: s, describedBy: m } = a, {
     open: l,
@@ -15,16 +15,18 @@ const S = (a) => {
     placement: p,
     context: r,
     arrow: t,
-    scrollLock: i
-  } = E(j);
-  return C(() => {
-    i && (l ? (document.documentElement.style.overflow = "hidden", document.documentElement.scrollHeight > window.innerHeight && (document.body.style.overflow = "scroll")) : (document.documentElement.style.overflow = "", document.body.style.overflow = ""));
-  }, [l, i]), l ? /* @__PURE__ */ n(w, { children: /* @__PURE__ */ n(x, { modal: (o == null ? void 0 : o.modal) || !1, ...o, context: r, children: /* @__PURE__ */ v(
+    scrollLock: d,
+    contentId: v
+  } = C(B);
+  return j(() => {
+    d && (l ? (document.documentElement.style.overflow = "hidden", document.documentElement.scrollHeight > window.innerHeight && (document.body.style.overflow = "scroll")) : (document.documentElement.style.overflow = "", document.body.style.overflow = ""));
+  }, [l, d]), l ? /* @__PURE__ */ n(x, { children: /* @__PURE__ */ n(F, { modal: (o == null ? void 0 : o.modal) || !1, ...o, context: r, children: /* @__PURE__ */ w(
     "div",
     {
       ...g({
         ref: u,
         tabIndex: -1,
+        id: v,
         "aria-labelledby": s,
         "aria-describedby": m,
         style: {
@@ -38,9 +40,9 @@ const S = (a) => {
       "data-testid": "overlay-content",
       children: [
         /* @__PURE__ */ n(
-          F,
+          E,
           {
-            ref: (d) => b.current = d,
+            ref: (i) => b.current = i,
             context: r,
             className: e == null ? void 0 : e.arrow,
             height: t == null ? void 0 : t.height,

package/src/tedi/components/overlays/overlay/overlay-trigger.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),g=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),d=require("../../../../../external/classnames/index.cjs.js"),r=require("react"),f=require("../../base/icon/icon.cjs.js"),v=require("./overlay.cjs.js"),t=require("./overlay.module.scss.cjs.js"),y=require("../../../providers/label-provider/use-labels.cjs.js"),b=n=>{const{children:e,className:l}=n,{getLabel:s}=y.useLabels(),{getReferenceProps:i,reference:c,openWith:a}=r.useContext(v.OverlayContext),o=g.useMergeRefs([c,e.ref]);return r.isValidElement(e)?r.cloneElement(e,i({ref:o,tabIndex:0,label:e.type===f.Icon?s("tooltip.icon-trigger"):void 0,...e.props})):u.jsx("div",{...i({ref:o,tabIndex:0,className:d.default(t.default["tedi-overlay__trigger"],t.default["tedi-overlay__trigger--text"],{[t.default["tedi-overlay__trigger--click"]]:a==="click"},l)}),children:e})};exports.OverlayTrigger=b;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("react/jsx-runtime"),y=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),b=require("../../../../../external/classnames/index.cjs.js"),r=require("react"),p=require("../../base/icon/icon.cjs.js"),x=require("./overlay.cjs.js"),t=require("./overlay.module.scss.cjs.js"),q=require("../../../providers/label-provider/use-labels.cjs.js"),_=s=>{const{children:e,className:l}=s,{getLabel:c}=q.useLabels(),{getReferenceProps:o,reference:a,openWith:u,open:d,role:g,contentId:f}=r.useContext(x.OverlayContext),i=y.useMergeRefs([a,e.ref]),n=g==="tooltip"?{"aria-describedby":d?f:void 0}:{};return r.isValidElement(e)?r.cloneElement(e,o({ref:i,tabIndex:0,...n,label:e.type===p.Icon?c("tooltip.icon-trigger"):void 0,...e.props})):v.jsx("div",{...o({ref:i,tabIndex:0,className:b.default(t.default["tedi-overlay__trigger"],t.default["tedi-overlay__trigger--text"],{[t.default["tedi-overlay__trigger--click"]]:u==="click"},l),...n}),children:e})};exports.OverlayTrigger=_;

package/src/tedi/components/overlays/overlay/overlay-trigger.es.js

@@ -1,40 +1,44 @@
-import { jsx as c } from "react/jsx-runtime";
-import { useMergeRefs as a } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
-import f from "../../../../../external/classnames/index.es.js";
-import { useContext as p, isValidElement as g, cloneElement as d } from "react";
-import { Icon as v } from "../../base/icon/icon.es.js";
-import { OverlayContext as x } from "./overlay.es.js";
+import { jsx as d } from "react/jsx-runtime";
+import { useMergeRefs as g } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
+import v from "../../../../../external/classnames/index.es.js";
+import { useContext as x, isValidElement as y, cloneElement as b } from "react";
+import { Icon as _ } from "../../base/icon/icon.es.js";
+import { OverlayContext as u } from "./overlay.es.js";
 import r from "./overlay.module.scss.es.js";
-import { useLabels as y } from "../../../providers/label-provider/use-labels.es.js";
-const E = (i) => {
-  const { children: e, className: s } = i, { getLabel: l } = y(), { getReferenceProps: t, reference: m, openWith: n } = p(x), o = a([m, e.ref]);
-  return g(e) ? d(
+import { useLabels as I } from "../../../providers/label-provider/use-labels.es.js";
+const R = (s) => {
+  const { children: e, className: n } = s, { getLabel: l } = I(), { getReferenceProps: t, reference: c, openWith: m, open: a, role: p, contentId: f } = x(u), o = g([c, e.ref]), i = p === "tooltip" ? {
+    "aria-describedby": a ? f : void 0
+  } : {};
+  return y(e) ? b(
     e,
     t({
       ref: o,
       tabIndex: 0,
-      label: e.type === v ? l("tooltip.icon-trigger") : void 0,
+      ...i,
+      label: e.type === _ ? l("tooltip.icon-trigger") : void 0,
       ...e.props
     })
-  ) : /* @__PURE__ */ c(
+  ) : /* @__PURE__ */ d(
     "div",
     {
       ...t({
         ref: o,
         tabIndex: 0,
-        className: f(
+        className: v(
           r["tedi-overlay__trigger"],
           r["tedi-overlay__trigger--text"],
           {
-            [r["tedi-overlay__trigger--click"]]: n === "click"
+            [r["tedi-overlay__trigger--click"]]: m === "click"
           },
-          s
-        )
+          n
+        ),
+        ...i
       }),
       children: e
     }
   );
 };
 export {
-  E as OverlayTrigger
+  R as OverlayTrigger
 };

package/src/tedi/components/overlays/overlay/overlay.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const A=require("react/jsx-runtime"),t=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),s=require("react"),G=require("./overlay-content.cjs.js"),H=require("./overlay-trigger.cjs.js"),z=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),a=require("../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),B=require("../../../helpers/hooks/use-is-touch-device.cjs.js"),J=require("../../../helpers/hooks/use-is-mounted.cjs.js"),K=3,M=s.createContext({open:!1,onOpenChange:()=>{},isMounted:!1,openWith:"hover",reference:()=>{},floating:()=>{},focusManager:{},arrowRef:{current:null},x:0,y:0,strategy:"absolute",getReferenceProps:()=>({}),getFloatingProps:()=>({}),arrow:{width:0,height:0,x:0,y:0,centerOffset:0},placement:"top",context:{},scrollLock:void 0}),c=x=>{const C=B.useIsTouchDevice(),{children:q,placement:w="top",openWith:i=C?"click":"hover",defaultOpen:F=!1,open:r,onToggle:o,role:P="tooltip",arrowDimensions:e,offset:R=K+((e==null?void 0:e.height)??0),focusManager:l,dismissible:u,scrollLock:b}=x,{order:k=["reference","content"],initialFocus:d,modal:f,...I}=l??{},T=d!==void 0?d:f?0:void 0,[g,p]=s.useState(F),h=s.useRef(null),_=J.useIsMounted(),v=s.useMemo(()=>o&&typeof r<"u"?r:g,[o,r,g]),y=s.useCallback(m=>{typeof r>"u"&&p(m),o==null||o(m)},[r,p,o]),{x:U,y:j,refs:O,strategy:S,context:n,middlewareData:D,placement:E}=t.useFloating({placement:w,open:v,onOpenChange:y,middleware:[a.offset(R),a.flip(),a.shift({padding:8}),a.arrow({element:h,padding:4})],whileElementsMounted:z.autoUpdate}),{getReferenceProps:L,getFloatingProps:W}=t.useInteractions([t.useHover(n,{enabled:i==="hover",handleClose:t.safePolygon()}),t.useClick(n,{toggle:u}),t.useFocus(n,{enabled:i==="hover"}),t.useRole(n,{role:P}),t.useDismiss(n,{enabled:u,outsidePressEvent:i==="click"?"mousedown":"pointerdown"})]);return A.jsx(M.Provider,{value:{open:v,onOpenChange:y,isMounted:_,openWith:i,reference:O.setReference,floating:O.setFloating,arrowRef:h,focusManager:l?{order:k,modal:f,initialFocus:T,...I}:void 0,x:U,y:j,strategy:S,getReferenceProps:L,getFloatingProps:W,arrow:{width:e==null?void 0:e.width,height:e==null?void 0:e.height,...D.arrow},context:n,placement:E,scrollLock:b},children:q})};c.Trigger=H.OverlayTrigger;c.Content=G.OverlayContent;exports.Overlay=c;exports.OverlayContext=M;exports.default=c;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const V=require("react/jsx-runtime"),t=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),n=require("react"),z=require("./overlay-content.cjs.js"),B=require("./overlay-trigger.cjs.js"),J=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),a=require("../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),K=require("../../../helpers/hooks/use-is-touch-device.cjs.js"),N=require("../../../helpers/hooks/use-is-mounted.cjs.js"),Q=3,j=n.createContext({open:!1,onOpenChange:()=>{},isMounted:!1,openWith:"hover",reference:()=>{},floating:()=>{},focusManager:{},arrowRef:{current:null},x:0,y:0,strategy:"absolute",getReferenceProps:()=>({}),getFloatingProps:()=>({}),arrow:{width:0,height:0,x:0,y:0,centerOffset:0},placement:"top",context:{},scrollLock:void 0,contentId:""}),i=S=>{const E=K.useIsTouchDevice(),{children:L,placement:W="top",openWith:s=E?"click":"hover",defaultOpen:A=!1,open:c,onToggle:r,role:u="tooltip",arrowDimensions:e,offset:G=Q+((e==null?void 0:e.height)??0),focusManager:d,dismissible:v,scrollLock:y}=S,{order:O=["reference","content"],initialFocus:M,modal:f,...x}=d??{},C=M!==void 0?M:f?0:void 0,[m,F]=n.useState(A),g=n.useRef(null),R=N.useIsMounted(),p=n.useMemo(()=>r&&typeof c<"u"?c:m,[r,c,m]),h=n.useCallback(U=>{typeof c>"u"&&F(U),r==null||r(U)},[c,F,r]),{x:q,y:I,refs:l,strategy:P,context:o,middlewareData:b,placement:w}=t.useFloating({placement:W,open:p,onOpenChange:h,middleware:[a.offset(G),a.flip(),a.shift({padding:8}),a.arrow({element:g,padding:4})],whileElementsMounted:J.autoUpdate}),{getReferenceProps:k,getFloatingProps:T}=t.useInteractions([t.useHover(o,{enabled:s==="hover",handleClose:t.safePolygon()}),t.useClick(o,{toggle:v}),t.useFocus(o,{enabled:s==="hover"}),t.useRole(o,{role:u}),t.useDismiss(o,{enabled:v,outsidePressEvent:s==="click"?"mousedown":"pointerdown"})]),_=n.useId(),H=n.useMemo(()=>({open:p,onOpenChange:h,isMounted:R,openWith:s,focusManager:d?{order:O,modal:f,initialFocus:C,...x}:void 0,reference:l.setReference,floating:l.setFloating,arrowRef:g,x:q,y:I,strategy:P,getReferenceProps:k,getFloatingProps:T,arrow:{width:e==null?void 0:e.width,height:e==null?void 0:e.height,...b.arrow},context:o,placement:w,scrollLock:y,role:u,contentId:_}),[p,h,R,s,d,l.setReference,l.setFloating,g,q,I,P,k,T,e==null?void 0:e.width,e==null?void 0:e.height,b.arrow,o,w,y,u,_,f,O,C,x]);return V.jsx(j.Provider,{value:H,children:L})};i.Trigger=B.OverlayTrigger;i.Content=z.OverlayContent;exports.Overlay=i;exports.OverlayContext=j;exports.default=i;