@tedi-design-system/react 16.0.0-rc.8 → 16.0.0

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",