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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tedi-design-system/react",
-  "version": "19.0.0-rc.8",
+  "version": "19.0.0",
   "description": "TEDI Design System React component library — accessible, reusable UI components. Docs & live examples: https://storybook.tedi.ee/react/rc/",
   "type": "module",
   "sideEffects": false,
@@ -116,7 +116,7 @@
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.32.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-hooks": "^7.1.1",
     "eslint-plugin-simple-import-sort": "^14.0.0",
     "eslint-plugin-storybook": "^10.4.6",
     "eslint-plugin-unused-imports": "^4.1.4",
@@ -186,6 +186,7 @@
     "access": "public"
   },
   "overrides": {
-    "dayjs": "$dayjs"
+    "dayjs": "$dayjs",
+    "eslint-plugin-react-hooks": "$eslint-plugin-react-hooks"
   }
 }

package/src/community/components/card/card.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),C=require("../../../../external/classnames/index.cjs.js"),v=require("react"),r=require("./card.module.scss.cjs.js"),q=require("./card-context.cjs.js"),P=require("./utility.cjs.js"),x=require("../../helpers/hooks/use-breakpoint-props.cjs.js"),t=v.forwardRef((a,s)=>{const{getCurrentBreakpointProps:n}=x.useBreakpointProps(a.defaultServerBreakpoint),{children:c,className:u,padding:i,background:f="bg-default",borderRadius:e,borderless:b,border:m="border-default",...p}=n(a,{padding:1}),[o,d]=P.getCardBorderPlacementColor(m),g=C.default(r.default.card,u,{[r.default[`card--border-${o}`]]:o,[r.default["card--borderless"]]:b,[r.default["card--no-border-radius-top"]]:e===!1||(e==null?void 0:e.top)===!1,[r.default["card--no-border-radius-right"]]:e===!1||(e==null?void 0:e.right)===!1,[r.default["card--no-border-radius-bottom"]]:e===!1||(e==null?void 0:e.bottom)===!1,[r.default["card--no-border-radius-left"]]:e===!1||(e==null?void 0:e.left)===!1});return l.jsx(q.CardContext.Provider,{value:{padding:i,background:f},children:l.jsx("div",{"data-name":"card",...p,className:g,ref:s,style:d?{"--card-border-color":`var(--color-${d})`}:void 0,children:c})})});t.displayName="Card";exports.Card=t;exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),p=require("../../../../external/classnames/index.cjs.js"),q=require("react"),v=require("../color-tokens.cjs.js"),r=require("./card.module.scss.cjs.js"),P=require("./card-context.cjs.js"),k=require("./utility.cjs.js"),x=require("../../helpers/hooks/use-breakpoint-props.cjs.js"),t=q.forwardRef((o,s)=>{const{getCurrentBreakpointProps:n}=x.useBreakpointProps(o.defaultServerBreakpoint),{children:c,className:u,padding:i,background:f="bg-default",borderRadius:e,borderless:C,border:b="border-default",...g}=n(o,{padding:1}),[a,d]=k.getCardBorderPlacementColor(b),m=p.default(r.default.card,u,{[r.default[`card--border-${a}`]]:a,[r.default["card--borderless"]]:C,[r.default["card--no-border-radius-top"]]:e===!1||(e==null?void 0:e.top)===!1,[r.default["card--no-border-radius-right"]]:e===!1||(e==null?void 0:e.right)===!1,[r.default["card--no-border-radius-bottom"]]:e===!1||(e==null?void 0:e.bottom)===!1,[r.default["card--no-border-radius-left"]]:e===!1||(e==null?void 0:e.left)===!1});return l.jsx(P.CardContext.Provider,{value:{padding:i,background:f},children:l.jsx("div",{"data-name":"card",...g,className:m,ref:s,style:d?{"--card-border-color":v.legacyColorToCore(d)}:void 0,children:c})})});t.displayName="Card";exports.Card=t;exports.default=t;

package/src/community/components/card/card.es.js

@@ -1,23 +1,24 @@
 import { jsx as d } from "react/jsx-runtime";
-import C from "../../../../external/classnames/index.es.js";
+import g from "../../../../external/classnames/index.es.js";
 import { forwardRef as u } from "react";
+import { legacyColorToCore as v } from "../color-tokens.es.js";
 import o from "./card.module.scss.es.js";
-import { CardContext as v } from "./card-context.es.js";
-import { getCardBorderPlacementColor as B } from "./utility.es.js";
-import { useBreakpointProps as P } from "../../helpers/hooks/use-breakpoint-props.es.js";
-const h = u((e, l) => {
-  const { getCurrentBreakpointProps: s } = P(e.defaultServerBreakpoint), {
-    children: c,
-    className: f,
-    padding: m,
+import { CardContext as B } from "./card-context.es.js";
+import { getCardBorderPlacementColor as P } from "./utility.es.js";
+import { useBreakpointProps as h } from "../../helpers/hooks/use-breakpoint-props.es.js";
+const k = u((e, l) => {
+  const { getCurrentBreakpointProps: s } = h(e.defaultServerBreakpoint), {
+    children: m,
+    className: c,
+    padding: f,
     background: n = "bg-default",
     borderRadius: r,
     borderless: i,
     border: p = "border-default",
-    ...b
+    ...C
   } = s(e, {
     padding: 1
-  }), [a, t] = B(p), g = C(o.card, f, {
+  }), [a, t] = P(p), b = g(o.card, c, {
     [o[`card--border-${a}`]]: a,
     [o["card--borderless"]]: i,
     [o["card--no-border-radius-top"]]: r === !1 || (r == null ? void 0 : r.top) === !1,
@@ -25,20 +26,20 @@ const h = u((e, l) => {
     [o["card--no-border-radius-bottom"]]: r === !1 || (r == null ? void 0 : r.bottom) === !1,
     [o["card--no-border-radius-left"]]: r === !1 || (r == null ? void 0 : r.left) === !1
   });
-  return /* @__PURE__ */ d(v.Provider, { value: { padding: m, background: n }, children: /* @__PURE__ */ d(
+  return /* @__PURE__ */ d(B.Provider, { value: { padding: f, background: n }, children: /* @__PURE__ */ d(
     "div",
     {
       "data-name": "card",
-      ...b,
-      className: g,
+      ...C,
+      className: b,
       ref: l,
-      style: t ? { "--card-border-color": `var(--color-${t})` } : void 0,
-      children: c
+      style: t ? { "--card-border-color": v(t) } : void 0,
+      children: m
     }
   ) });
 });
-h.displayName = "Card";
+k.displayName = "Card";
 export {
-  h as Card,
-  h as default
+  k as Card,
+  k as default
 };

package/src/community/components/color-tokens.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r={"primary-main":"var(--general-surface-brand-primary)","primary-active":"var(--general-surface-brand-secondary)","primary-active-subtle":"var(--tedi-primary-400)","primary-highlight":"var(--general-surface-brand-tertiary)","primary-highlight-subtle":"var(--general-surface-brand-quaternary)","accent-main":"var(--tedi-accent-600)","accent-highlight":"var(--tedi-accent-200)","bg-default":"var(--general-surface-primary)","bg-muted":"var(--general-surface-secondary)","bg-subtle":"var(--general-surface-tertiary)","bg-disabled":"var(--general-surface-disabled)","bg-inverted":"var(--general-surface-inverted-primary)","bg-inverted-contrast":"var(--general-surface-inverted-secondary)",black:"var(--tedi-neutral-900)",white:"var(--general-surface-primary)","positive-main":"var(--tedi-green-600)","positive-active":"var(--tedi-green-700)","positive-highlight":"var(--tedi-green-100)","important-main":"var(--tedi-red-600)","important-active":"var(--tedi-red-700)","important-highlight":"var(--tedi-red-100)","info-main":"var(--tedi-primary-600)","info-active":"var(--tedi-primary-700)","info-highlight":"var(--tedi-primary-100)","warning-main":"var(--tedi-yellow-700)","warning-highlight":"var(--tedi-yellow-200)",transparent:"transparent","border-default":"var(--general-border-primary)","border-contrast":"var(--general-border-secondary)"},a=e=>r[e];exports.LEGACY_COLOR_TO_CORE=r;exports.legacyColorToCore=a;

package/src/community/components/color-tokens.d.ts

@@ -0,0 +1,14 @@
+import { TColorsBackground, TColorsBorder } from './commonTypes';
+/**
+ * Maps a legacy community colour name to its TEDI-Ready (core) CSS value.
+ *
+ * Used where a colour is chosen dynamically from a prop (e.g. `Card`'s
+ * `border` / `background`, and `Tooltip`'s arrow) instead of a static class.
+ * Strong fills use the core primitive scale (there is no semantic "strong
+ * status fill" token — the `--general-status-*-background-*` tokens are pale
+ * surfaces), matching the legacy appearance. Community is deprecated; do not
+ * use this in new code.
+ */
+export declare const LEGACY_COLOR_TO_CORE: Record<TColorsBackground | TColorsBorder, string>;
+/** Returns the core CSS value for a legacy colour name. */
+export declare const legacyColorToCore: (name: TColorsBackground | TColorsBorder) => string;

package/src/community/components/color-tokens.es.js

@@ -0,0 +1,35 @@
+const a = {
+  "primary-main": "var(--general-surface-brand-primary)",
+  "primary-active": "var(--general-surface-brand-secondary)",
+  "primary-active-subtle": "var(--tedi-primary-400)",
+  "primary-highlight": "var(--general-surface-brand-tertiary)",
+  "primary-highlight-subtle": "var(--general-surface-brand-quaternary)",
+  "accent-main": "var(--tedi-accent-600)",
+  "accent-highlight": "var(--tedi-accent-200)",
+  "bg-default": "var(--general-surface-primary)",
+  "bg-muted": "var(--general-surface-secondary)",
+  "bg-subtle": "var(--general-surface-tertiary)",
+  "bg-disabled": "var(--general-surface-disabled)",
+  "bg-inverted": "var(--general-surface-inverted-primary)",
+  "bg-inverted-contrast": "var(--general-surface-inverted-secondary)",
+  black: "var(--tedi-neutral-900)",
+  white: "var(--general-surface-primary)",
+  "positive-main": "var(--tedi-green-600)",
+  "positive-active": "var(--tedi-green-700)",
+  "positive-highlight": "var(--tedi-green-100)",
+  "important-main": "var(--tedi-red-600)",
+  "important-active": "var(--tedi-red-700)",
+  "important-highlight": "var(--tedi-red-100)",
+  "info-main": "var(--tedi-primary-600)",
+  "info-active": "var(--tedi-primary-700)",
+  "info-highlight": "var(--tedi-primary-100)",
+  "warning-main": "var(--tedi-yellow-700)",
+  "warning-highlight": "var(--tedi-yellow-200)",
+  transparent: "transparent",
+  "border-default": "var(--general-border-primary)",
+  "border-contrast": "var(--general-border-secondary)"
+}, e = (r) => a[r];
+export {
+  a as LEGACY_COLOR_TO_CORE,
+  e as legacyColorToCore
+};

package/src/community/components/layout/header/components/header-role/header-role.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),g=require("react"),h=require("../../../../../../tedi/components/base/typography/text/text.cjs.js"),j=require("../../../../../../tedi/components/content/collapse/collapse.cjs.js"),m=require("../../../../../../tedi/components/misc/scroll-fade/scroll-fade.cjs.js"),b=require("../../../../tag/tag.cjs.js"),y=require("../header-dropdown/header-dropdown.cjs.js"),d=require("./header-role.module.scss.cjs.js"),x=require("../../../../../../tedi/providers/label-provider/use-labels.cjs.js"),T=require("../../../../card/card.cjs.js"),q=require("../../../../card/card-content/card-content.cjs.js"),p=t=>{const{renderModal:o=!1,...r}=t,[s,l]=g.useState(!1);return o?e.jsx(R,{...r,open:s,onToggle:l}):e.jsx(v,{...r,open:s,onToggle:l})};p.displayName="HeaderRole";const v=t=>{const{getLabel:o}=x.useLabels(),{children:r,open:s,onToggle:l,primaryInfo:i,secondaryInfo:n,label:a=o("header.role-label")}=t,u=()=>a===o("header.role-label")?e.jsx("div",{children:e.jsx(b.Tag,{color:"primary",type:"secondary",children:a})}):e.jsxs(h.Text,{color:"secondary",modifiers:["bold","small"],children:[a,!!n&&e.jsxs(e.Fragment,{children:[" ",e.jsxs(h.Text,{element:"span",modifiers:["small","normal"],children:[e.jsx("span",{style:{color:"var(--color-border-default)"},children:"|"})," ",n]})]})]}),c=typeof r=="function"?r({onToggle:l}):r,f=e.jsx(y.HeaderDropdown,{shouldAnimate:!0,open:s,onToggle:l,tooltipProps:{cardProps:{padding:0},maxWidth:"medium"},triggerProps:{children:i,"aria-label":`${a??""} ${n??""} ${i??""}`,visualType:"link",iconRight:{name:"expand_more",color:"primary",size:24}},children:e.jsx("div",{className:d.default["header-role-wrapper"],children:e.jsx(m.ScrollFade,{fadeSize:0,children:e.jsx("div",{className:d.default["header-role-children"],children:c})})})});return e.jsxs("div",{children:[u(),c?f:i]})},R=t=>{const{getLabel:o}=x.useLabels(),{children:r,open:s,onToggle:l,primaryInfo:i,secondaryInfo:n,label:a=o("header.role-label")}=t,u=e.jsxs(h.Text,{element:"span",color:"secondary",modifiers:"bold",children:[a," ",i,n&&e.jsx(h.Text,{element:"span",modifiers:"normal",children:` | ${n}`})]}),c=typeof r=="function"?r({onToggle:l}):r;return e.jsx(T.Card,{background:"bg-muted",borderRadius:!1,borderless:!0,children:e.jsx(q.CardContent,{padding:0,children:c?e.jsx(j.Collapse,{id:"role-collapse",open:s,onToggle:l,className:d.default["header-role-collapse"],hideCollapseText:!0,title:u,children:e.jsx("div",{className:d.default["header-role-wrapper"],children:e.jsx(m.ScrollFade,{fadeSize:0,children:e.jsx("div",{className:d.default["header-role-children"],children:c})})})}):e.jsx("div",{className:d.default["header-role-children"],children:u})})})};exports.HeaderRole=p;exports.default=p;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),g=require("react"),h=require("../../../../../../tedi/components/base/typography/text/text.cjs.js"),j=require("../../../../../../tedi/components/content/collapse/collapse.cjs.js"),m=require("../../../../../../tedi/components/misc/scroll-fade/scroll-fade.cjs.js"),b=require("../../../../tag/tag.cjs.js"),y=require("../header-dropdown/header-dropdown.cjs.js"),o=require("./header-role.module.scss.cjs.js"),x=require("../../../../../../tedi/providers/label-provider/use-labels.cjs.js"),T=require("../../../../card/card.cjs.js"),q=require("../../../../card/card-content/card-content.cjs.js"),p=t=>{const{renderModal:s=!1,...r}=t,[a,l]=g.useState(!1);return s?e.jsx(R,{...r,open:a,onToggle:l}):e.jsx(v,{...r,open:a,onToggle:l})};p.displayName="HeaderRole";const v=t=>{const{getLabel:s}=x.useLabels(),{children:r,open:a,onToggle:l,primaryInfo:i,secondaryInfo:n,label:d=s("header.role-label")}=t,u=()=>d===s("header.role-label")?e.jsx("div",{children:e.jsx(b.Tag,{color:"primary",type:"secondary",children:d})}):e.jsxs(h.Text,{color:"secondary",modifiers:["bold","small"],children:[d,!!n&&e.jsxs(e.Fragment,{children:[" ",e.jsxs(h.Text,{element:"span",modifiers:["small","normal"],children:[e.jsx("span",{className:o.default["header-role-separator"],children:"|"})," ",n]})]})]}),c=typeof r=="function"?r({onToggle:l}):r,f=e.jsx(y.HeaderDropdown,{shouldAnimate:!0,open:a,onToggle:l,tooltipProps:{cardProps:{padding:0},maxWidth:"medium"},triggerProps:{children:i,"aria-label":`${d??""} ${n??""} ${i??""}`,visualType:"link",iconRight:{name:"expand_more",color:"primary",size:24}},children:e.jsx("div",{className:o.default["header-role-wrapper"],children:e.jsx(m.ScrollFade,{fadeSize:0,children:e.jsx("div",{className:o.default["header-role-children"],children:c})})})});return e.jsxs("div",{children:[u(),c?f:i]})},R=t=>{const{getLabel:s}=x.useLabels(),{children:r,open:a,onToggle:l,primaryInfo:i,secondaryInfo:n,label:d=s("header.role-label")}=t,u=e.jsxs(h.Text,{element:"span",color:"secondary",modifiers:"bold",children:[d," ",i,n&&e.jsx(h.Text,{element:"span",modifiers:"normal",children:` | ${n}`})]}),c=typeof r=="function"?r({onToggle:l}):r;return e.jsx(T.Card,{background:"bg-muted",borderRadius:!1,borderless:!0,children:e.jsx(q.CardContent,{padding:0,children:c?e.jsx(j.Collapse,{id:"role-collapse",open:a,onToggle:l,className:o.default["header-role-collapse"],hideCollapseText:!0,title:u,children:e.jsx("div",{className:o.default["header-role-wrapper"],children:e.jsx(m.ScrollFade,{fadeSize:0,children:e.jsx("div",{className:o.default["header-role-children"],children:c})})})}):e.jsx("div",{className:o.default["header-role-children"],children:u})})})};exports.HeaderRole=p;exports.default=p;

package/src/community/components/layout/header/components/header-role/header-role.es.js

@@ -1,26 +1,26 @@
 import { jsx as e, jsxs as m, Fragment as b } from "react/jsx-runtime";
 import y from "react";
 import { Text as h } from "../../../../../../tedi/components/base/typography/text/text.es.js";
-import { Collapse as v } from "../../../../../../tedi/components/content/collapse/collapse.es.js";
+import { Collapse as T } from "../../../../../../tedi/components/content/collapse/collapse.es.js";
 import { ScrollFade as f } from "../../../../../../tedi/components/misc/scroll-fade/scroll-fade.es.js";
-import { Tag as T } from "../../../../tag/tag.es.js";
+import { Tag as v } from "../../../../tag/tag.es.js";
 import { HeaderDropdown as x } from "../header-dropdown/header-dropdown.es.js";
-import i from "./header-role.module.scss.es.js";
+import l from "./header-role.module.scss.es.js";
 import { useLabels as g } from "../../../../../../tedi/providers/label-provider/use-labels.es.js";
-import { Card as C } from "../../../../card/card.es.js";
-import { CardContent as N } from "../../../../card/card-content/card-content.es.js";
+import { Card as N } from "../../../../card/card.es.js";
+import { CardContent as C } from "../../../../card/card-content/card-content.es.js";
 const R = (s) => {
-  const { renderModal: l = !1, ...r } = s, [n, o] = y.useState(!1);
-  return l ? /* @__PURE__ */ e(H, { ...r, open: n, onToggle: o }) : /* @__PURE__ */ e(w, { ...r, open: n, onToggle: o });
+  const { renderModal: a = !1, ...r } = s, [n, o] = y.useState(!1);
+  return a ? /* @__PURE__ */ e(H, { ...r, open: n, onToggle: o }) : /* @__PURE__ */ e(w, { ...r, open: n, onToggle: o });
 };
 R.displayName = "HeaderRole";
 const w = (s) => {
-  const { getLabel: l } = g(), { children: r, open: n, onToggle: o, primaryInfo: t, secondaryInfo: d, label: a = l("header.role-label") } = s, p = () => a === l("header.role-label") ? /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(T, { color: "primary", type: "secondary", children: a }) }) : /* @__PURE__ */ m(h, { color: "secondary", modifiers: ["bold", "small"], children: [
-    a,
+  const { getLabel: a } = g(), { children: r, open: n, onToggle: o, primaryInfo: t, secondaryInfo: d, label: i = a("header.role-label") } = s, p = () => i === a("header.role-label") ? /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(v, { color: "primary", type: "secondary", children: i }) }) : /* @__PURE__ */ m(h, { color: "secondary", modifiers: ["bold", "small"], children: [
+    i,
     !!d && /* @__PURE__ */ m(b, { children: [
       " ",
       /* @__PURE__ */ m(h, { element: "span", modifiers: ["small", "normal"], children: [
-        /* @__PURE__ */ e("span", { style: { color: "var(--color-border-default)" }, children: "|" }),
+        /* @__PURE__ */ e("span", { className: l["header-role-separator"], children: "|" }),
         " ",
         d
       ] })
@@ -34,11 +34,11 @@ const w = (s) => {
       tooltipProps: { cardProps: { padding: 0 }, maxWidth: "medium" },
       triggerProps: {
         children: t,
-        "aria-label": `${a ?? ""} ${d ?? ""} ${t ?? ""}`,
+        "aria-label": `${i ?? ""} ${d ?? ""} ${t ?? ""}`,
         visualType: "link",
         iconRight: { name: "expand_more", color: "primary", size: 24 }
       },
-      children: /* @__PURE__ */ e("div", { className: i["header-role-wrapper"], children: /* @__PURE__ */ e(f, { fadeSize: 0, children: /* @__PURE__ */ e("div", { className: i["header-role-children"], children: c }) }) })
+      children: /* @__PURE__ */ e("div", { className: l["header-role-wrapper"], children: /* @__PURE__ */ e(f, { fadeSize: 0, children: /* @__PURE__ */ e("div", { className: l["header-role-children"], children: c }) }) })
     }
   );
   return /* @__PURE__ */ m("div", { children: [
@@ -46,24 +46,24 @@ const w = (s) => {
     c ? u : t
   ] });
 }, H = (s) => {
-  const { getLabel: l } = g(), { children: r, open: n, onToggle: o, primaryInfo: t, secondaryInfo: d, label: a = l("header.role-label") } = s, p = /* @__PURE__ */ m(h, { element: "span", color: "secondary", modifiers: "bold", children: [
-    a,
+  const { getLabel: a } = g(), { children: r, open: n, onToggle: o, primaryInfo: t, secondaryInfo: d, label: i = a("header.role-label") } = s, p = /* @__PURE__ */ m(h, { element: "span", color: "secondary", modifiers: "bold", children: [
+    i,
     " ",
     t,
     d && /* @__PURE__ */ e(h, { element: "span", modifiers: "normal", children: ` | ${d}` })
   ] }), c = typeof r == "function" ? r({ onToggle: o }) : r;
-  return /* @__PURE__ */ e(C, { background: "bg-muted", borderRadius: !1, borderless: !0, children: /* @__PURE__ */ e(N, { padding: 0, children: c ? /* @__PURE__ */ e(
-    v,
+  return /* @__PURE__ */ e(N, { background: "bg-muted", borderRadius: !1, borderless: !0, children: /* @__PURE__ */ e(C, { padding: 0, children: c ? /* @__PURE__ */ e(
+    T,
     {
       id: "role-collapse",
       open: n,
       onToggle: o,
-      className: i["header-role-collapse"],
+      className: l["header-role-collapse"],
       hideCollapseText: !0,
       title: p,
-      children: /* @__PURE__ */ e("div", { className: i["header-role-wrapper"], children: /* @__PURE__ */ e(f, { fadeSize: 0, children: /* @__PURE__ */ e("div", { className: i["header-role-children"], children: c }) }) })
+      children: /* @__PURE__ */ e("div", { className: l["header-role-wrapper"], children: /* @__PURE__ */ e(f, { fadeSize: 0, children: /* @__PURE__ */ e("div", { className: l["header-role-children"], children: c }) }) })
     }
-  ) : /* @__PURE__ */ e("div", { className: i["header-role-children"], children: p }) }) });
+  ) : /* @__PURE__ */ e("div", { className: l["header-role-children"], children: p }) }) });
 };
 export {
   R as HeaderRole,

package/src/community/components/layout/header/components/header-role/header-role.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"header-role-collapse":"header-role-collapse-7664165f","header-role-wrapper":"header-role-wrapper-c65bcd63","header-role-children":"header-role-children-3fdd2c2c"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"header-role-collapse":"header-role-collapse-7664165f","header-role-wrapper":"header-role-wrapper-c65bcd63","header-role-children":"header-role-children-3fdd2c2c","header-role-separator":"header-role-separator-14bcefed"};exports.default=e;

package/src/community/components/layout/header/components/header-role/header-role.module.scss.es.js

@@ -1,7 +1,8 @@
 const e = {
   "header-role-collapse": "header-role-collapse-7664165f",
   "header-role-wrapper": "header-role-wrapper-c65bcd63",
-  "header-role-children": "header-role-children-3fdd2c2c"
+  "header-role-children": "header-role-children-3fdd2c2c",
+  "header-role-separator": "header-role-separator-14bcefed"
 };
 export {
   e as default

package/src/community/components/map-components/button-group/button-group.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),o=require("react"),j=require("../map-button/map-button.cjs.js"),e=require("./button-group.module.scss.cjs.js"),N=p=>{const{children:c,className:f,direction:m="horizontal",onSelectionChange:s,stretch:b=!1,ariaLabel:x,prefix:a,suffix:d,prefixClassName:_,suffixClassName:g}=p;return r.jsxs("div",{className:i.default(e.default["tedi-button-group"],e.default[`tedi-button-group--${m}`],{[e.default["tedi-button-group--stretch"]]:b},f),role:"group","aria-label":x,children:[a&&r.jsx("div",{className:i.default(e.default["tedi-button-group__prefix"],_),children:r.jsx("span",{children:a})}),o.Children.map(c,u=>{if(o.isValidElement(u)&&u.type===j.MapButton){const t=u;return o.cloneElement(t,{className:i.default(e.default["tedi-button-group__item"],{[e.default["tedi-button-group__item--active"]]:t.props.isActive,[e.default["tedi-button-group__item--disabled"]]:t.props.disabled}),onClick:h=>{var l,n;t.props.disabled||((n=(l=t.props).onClick)==null||n.call(l,h),s==null||s(t.props.id))}})}return u}),d&&r.jsx("div",{className:i.default(e.default["tedi-button-group__suffix"],g),children:r.jsx("span",{children:d})})]})};exports.ButtonGroup=N;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),o=require("react"),h=require("../map-button/map-button.cjs.js"),e=require("./button-group.module.scss.cjs.js"),j=p=>{const{children:c,className:f,direction:m="horizontal",onSelectionChange:s,stretch:b=!1,ariaLabel:x,prefix:a,suffix:l,prefixClassName:_,suffixClassName:g}=p;return r.jsxs("div",{className:i.default(e.default["tedi-button-group"],e.default[`tedi-button-group--${m}`],{[e.default["tedi-button-group--stretch"]]:b},f),role:"group","aria-label":x,children:[a&&r.jsx("div",{className:i.default(e.default["tedi-button-group__prefix"],_),children:r.jsx("span",{children:a})}),o.Children.map(c,u=>{if(o.isValidElement(u)&&u.type===h.MapButton){const t=u;return o.cloneElement(t,{className:i.default(e.default["tedi-button-group__item"],{[e.default["tedi-button-group__item--active"]]:t.props.isActive,[e.default["tedi-button-group__item--disabled"]]:t.props.disabled},t.props.className),onClick:N=>{var d,n;t.props.disabled||((n=(d=t.props).onClick)==null||n.call(d,N),s==null||s(t.props.id))}})}return u}),l&&r.jsx("div",{className:i.default(e.default["tedi-button-group__suffix"],g),children:r.jsx("span",{children:l})})]})};exports.ButtonGroup=j;

package/src/community/components/map-components/button-group/button-group.es.js

@@ -1,5 +1,5 @@
-import { jsxs as N, jsx as i } from "react/jsx-runtime";
-import o from "../../../../../external/classnames/index.es.js";
+import { jsxs as g, jsx as i } from "react/jsx-runtime";
+import s from "../../../../../external/classnames/index.es.js";
 import { Children as h, isValidElement as v, cloneElement as C } from "react";
 import { MapButton as y } from "../map-button/map-button.es.js";
 import t from "./button-group.module.scss.es.js";
@@ -8,7 +8,7 @@ const A = (d) => {
     children: u,
     className: m,
     direction: c = "horizontal",
-    onSelectionChange: s,
+    onSelectionChange: o,
     stretch: f = !1,
     ariaLabel: b,
     prefix: p,
@@ -16,10 +16,10 @@ const A = (d) => {
     prefixClassName: _,
     suffixClassName: x
   } = d;
-  return /* @__PURE__ */ N(
+  return /* @__PURE__ */ g(
     "div",
     {
-      className: o(
+      className: s(
         t["tedi-button-group"],
         t[`tedi-button-group--${c}`],
         {
@@ -30,24 +30,28 @@ const A = (d) => {
       role: "group",
       "aria-label": b,
       children: [
-        p && /* @__PURE__ */ i("div", { className: o(t["tedi-button-group__prefix"], _), children: /* @__PURE__ */ i("span", { children: p }) }),
+        p && /* @__PURE__ */ i("div", { className: s(t["tedi-button-group__prefix"], _), children: /* @__PURE__ */ i("span", { children: p }) }),
         h.map(u, (r) => {
           if (v(r) && r.type === y) {
             const e = r;
             return C(e, {
-              className: o(t["tedi-button-group__item"], {
-                [t["tedi-button-group__item--active"]]: e.props.isActive,
-                [t["tedi-button-group__item--disabled"]]: e.props.disabled
-              }),
-              onClick: (g) => {
-                var n, l;
-                e.props.disabled || ((l = (n = e.props).onClick) == null || l.call(n, g), s == null || s(e.props.id));
+              className: s(
+                t["tedi-button-group__item"],
+                {
+                  [t["tedi-button-group__item--active"]]: e.props.isActive,
+                  [t["tedi-button-group__item--disabled"]]: e.props.disabled
+                },
+                e.props.className
+              ),
+              onClick: (N) => {
+                var l, n;
+                e.props.disabled || ((n = (l = e.props).onClick) == null || n.call(l, N), o == null || o(e.props.id));
               }
             });
           }
           return r;
         }),
-        a && /* @__PURE__ */ i("div", { className: o(t["tedi-button-group__suffix"], x), children: /* @__PURE__ */ i("span", { children: a }) })
+        a && /* @__PURE__ */ i("div", { className: s(t["tedi-button-group__suffix"], x), children: /* @__PURE__ */ i("span", { children: a }) })
       ]
     }
   );

package/src/community/components/map-components/map-button/map-button.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),m=require("../../../../../external/classnames/index.cjs.js"),B=require("react"),S=require("../../../../tedi/components/base/icon/icon.cjs.js"),N=require("../../../../tedi/components/loaders/spinner/spinner.cjs.js"),O=require("../../../../tedi/components/buttons/button/button.cjs.js"),d=require("../map-dropdown/map-dropdown.cjs.js"),t=require("./map-button.module.scss.cjs.js"),l=require("../../../../tedi/components/overlays/tooltip/tooltip.cjs.js"),b=f=>{const{size:n="default",icon:r,selected:h=!1,className:x,children:u,hideLabel:c=!1,tooltipContent:p=u,dropdownItems:o,isActive:j,isHovered:g,underline:q,isLoading:i,..._}=f,[w,D]=B.useState(!1),M=h||w,v=m.default(t.default["tedi-map-button"],t.default[`tedi-map-button--${n}`],M&&t.default["tedi-map-button--selected"],o&&t.default["tedi-map-button--dropdown"],j&&t.default["tedi-map-button--is-active"],g&&t.default["tedi-map-button--is-hovered"],q&&t.default["tedi-map-button--underline"],i&&t.default["tedi-map-button--loading"],x),C=e.jsxs(e.Fragment,{children:[i?e.jsx(N.Spinner,{size:n==="small"?16:18,className:t.default["tedi-map-button__icon"]}):r&&e.jsx(S.Icon,{name:r,className:t.default["tedi-map-button__icon"],size:n==="small"?24:18}),!c&&e.jsx("div",{className:m.default(t.default["tedi-map-button__text"]),children:u})]}),s=e.jsx(O.Button,{noStyle:!0,isLoading:i,className:v,size:n,..._,children:C}),T=c&&p?e.jsxs(l.Tooltip,{placement:"right",children:[e.jsx(l.Tooltip.Trigger,{children:s}),e.jsx(l.Tooltip.Content,{children:p})]}):s;return o?e.jsxs(d.MapDropdown,{onOpenChange:D,placement:"right-start",children:[e.jsx(d.MapDropdown.Trigger,{children:s}),e.jsx(d.MapDropdown.Content,{items:o.map(a=>({children:a.children,onClick:a.onClick,isDisabled:a.isDisabled}))})]}):T};exports.MapButton=b;exports.default=b;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),m=require("../../../../../external/classnames/index.cjs.js"),B=require("react"),S=require("../../../../tedi/components/base/icon/icon.cjs.js"),N=require("../../../../tedi/components/loaders/spinner/spinner.cjs.js"),O=require("../../../../tedi/components/buttons/button/button.cjs.js"),d=require("../map-dropdown/map-dropdown.cjs.js"),t=require("./map-button.module.scss.cjs.js"),l=require("../../../../tedi/components/overlays/tooltip/tooltip.cjs.js"),b=f=>{const{size:n="default",icon:r,selected:h=!1,className:x,children:u,hideLabel:c=!1,tooltipContent:p=u,dropdownItems:i,isActive:j,isHovered:g,underline:q,isLoading:s,...v}=f,[_,w]=B.useState(!1),D=h||_,M=m.default(t.default["tedi-map-button"],t.default[`tedi-map-button--${n}`],D&&t.default["tedi-map-button--selected"],i&&t.default["tedi-map-button--dropdown"],j&&t.default["tedi-map-button--is-active"],g&&t.default["tedi-map-button--is-hovered"],q&&t.default["tedi-map-button--underline"],s&&t.default["tedi-map-button--loading"],x),C=e.jsxs(e.Fragment,{children:[s?e.jsx(N.Spinner,{size:n==="small"?16:18,className:t.default["tedi-map-button__icon"]}):r&&e.jsx(S.Icon,{name:r,className:t.default["tedi-map-button__icon"],size:n==="small"?24:18}),!c&&e.jsx("div",{className:m.default(t.default["tedi-map-button__text"]),children:u})]}),a=e.jsx(O.Button,{noStyle:!0,isLoading:s,className:M,size:n,...v,children:C}),T=c&&p?e.jsxs(l.Tooltip,{placement:"right",children:[e.jsx(l.Tooltip.Trigger,{children:a}),e.jsx(l.Tooltip.Content,{children:p})]}):a;return i?e.jsxs(d.MapDropdown,{onOpenChange:w,placement:"right-start",children:[e.jsx(d.MapDropdown.Trigger,{children:a}),e.jsx(d.MapDropdown.Content,{items:i.map(o=>({children:o.children,onClick:o.onClick,isActive:o.isActive,isDisabled:o.isDisabled}))})]}):T};exports.MapButton=b;exports.default=b;

package/src/community/components/map-components/map-button/map-button.es.js

@@ -1,53 +1,54 @@
 import { jsxs as a, Fragment as z, jsx as e } from "react/jsx-runtime";
 import b from "../../../../../external/classnames/index.es.js";
-import { useState as I } from "react";
-import { Icon as M } from "../../../../tedi/components/base/icon/icon.es.js";
-import { Spinner as O } from "../../../../tedi/components/loaders/spinner/spinner.es.js";
-import { Button as j } from "../../../../tedi/components/buttons/button/button.es.js";
+import { useState as A } from "react";
+import { Icon as I } from "../../../../tedi/components/base/icon/icon.es.js";
+import { Spinner as M } from "../../../../tedi/components/loaders/spinner/spinner.es.js";
+import { Button as O } from "../../../../tedi/components/buttons/button/button.es.js";
 import { MapDropdown as l } from "../map-dropdown/map-dropdown.es.js";
 import t from "./map-button.module.scss.es.js";
-import { Tooltip as m } from "../../../../tedi/components/overlays/tooltip/tooltip.es.js";
+import { Tooltip as d } from "../../../../tedi/components/overlays/tooltip/tooltip.es.js";
 const q = (h) => {
   const {
     size: o = "default",
-    icon: d,
+    icon: m,
     selected: f = !1,
     className: g,
-    children: p,
-    hideLabel: c = !1,
-    tooltipContent: u = p,
-    dropdownItems: n,
-    isActive: C,
-    isHovered: N,
-    underline: _,
-    isLoading: i,
-    ...v
-  } = h, [w, D] = I(!1), x = f || w, B = b(
+    children: c,
+    hideLabel: p = !1,
+    tooltipContent: u = c,
+    dropdownItems: i,
+    isActive: v,
+    isHovered: C,
+    underline: N,
+    isLoading: s,
+    ..._
+  } = h, [w, D] = A(!1), x = f || w, B = b(
     t["tedi-map-button"],
     t[`tedi-map-button--${o}`],
     x && t["tedi-map-button--selected"],
-    n && t["tedi-map-button--dropdown"],
-    C && t["tedi-map-button--is-active"],
-    N && t["tedi-map-button--is-hovered"],
-    _ && t["tedi-map-button--underline"],
-    i && t["tedi-map-button--loading"],
+    i && t["tedi-map-button--dropdown"],
+    v && t["tedi-map-button--is-active"],
+    C && t["tedi-map-button--is-hovered"],
+    N && t["tedi-map-button--underline"],
+    s && t["tedi-map-button--loading"],
     g
   ), S = /* @__PURE__ */ a(z, { children: [
-    i ? /* @__PURE__ */ e(O, { size: o === "small" ? 16 : 18, className: t["tedi-map-button__icon"] }) : d && /* @__PURE__ */ e(M, { name: d, className: t["tedi-map-button__icon"], size: o === "small" ? 24 : 18 }),
-    !c && /* @__PURE__ */ e("div", { className: b(t["tedi-map-button__text"]), children: p })
-  ] }), s = /* @__PURE__ */ e(j, { noStyle: !0, isLoading: i, className: B, size: o, ...v, children: S }), T = c && u ? /* @__PURE__ */ a(m, { placement: "right", children: [
-    /* @__PURE__ */ e(m.Trigger, { children: s }),
-    /* @__PURE__ */ e(m.Content, { children: u })
-  ] }) : s;
-  return n ? /* @__PURE__ */ a(l, { onOpenChange: D, placement: "right-start", children: [
-    /* @__PURE__ */ e(l.Trigger, { children: s }),
+    s ? /* @__PURE__ */ e(M, { size: o === "small" ? 16 : 18, className: t["tedi-map-button__icon"] }) : m && /* @__PURE__ */ e(I, { name: m, className: t["tedi-map-button__icon"], size: o === "small" ? 24 : 18 }),
+    !p && /* @__PURE__ */ e("div", { className: b(t["tedi-map-button__text"]), children: c })
+  ] }), r = /* @__PURE__ */ e(O, { noStyle: !0, isLoading: s, className: B, size: o, ..._, children: S }), T = p && u ? /* @__PURE__ */ a(d, { placement: "right", children: [
+    /* @__PURE__ */ e(d.Trigger, { children: r }),
+    /* @__PURE__ */ e(d.Content, { children: u })
+  ] }) : r;
+  return i ? /* @__PURE__ */ a(l, { onOpenChange: D, placement: "right-start", children: [
+    /* @__PURE__ */ e(l.Trigger, { children: r }),
     /* @__PURE__ */ e(
       l.Content,
       {
-        items: n.map((r) => ({
-          children: r.children,
-          onClick: r.onClick,
-          isDisabled: r.isDisabled
+        items: i.map((n) => ({
+          children: n.children,
+          onClick: n.onClick,
+          isActive: n.isActive,
+          isDisabled: n.isDisabled
         }))
       }
     )

package/src/community/components/tooltip/tooltip.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),u=require("../../../../external/classnames/index.cjs.js"),y=require("react"),A=require("../card/utility.cjs.js"),o=require("./tooltip.module.scss.cjs.js"),n=require("./tooltip-provider.cjs.js"),F=require("../card/card.cjs.js"),W=require("../card/card-content/card-content.cjs.js"),S=d=>{const{children:g,maxWidth:l="medium",cardProps:t,className:f}=d,{open:m,x:p,y:x,strategy:h,focusManager:C,floating:q,arrowRef:j,getFloatingProps:w,placement:_,context:i}=y.useContext(n.TooltipContext),[b,a]=A.getCardBorderPlacementColor(t==null?void 0:t.border),c=()=>b&&a?`var(--color-${a})`:"none",s=c()!=="none",k=()=>t!=null&&t.background?`var(--color-${t==null?void 0:t.background})`:"var(--color-bg-default)",R=()=>{const T=e.jsx(r.FloatingFocusManager,{...C,context:i,children:e.jsxs("div",{...w({ref:q,style:{position:h,left:p??0,top:x??0},className:u.default(o.default.tooltip,f,{[o.default[`tooltip--${l}`]]:l})}),"data-placement":_,children:[e.jsx(r.FloatingArrow,{ref:v=>j.current=v,context:i,fill:k(),stroke:c(),strokeWidth:s?4:0,className:u.default(o.default.tooltip__arrow,{[o.default["tooltip__arrow--stroke"]]:s}),height:n.ARROW_HEIGHT,width:n.ARROW_WIDTH}),e.jsx(F.Card,{padding:.5,borderless:!0,...t,children:e.jsx(W.CardContent,{children:g})})]})});return m?T:null};return e.jsx(r.FloatingPortal,{"data-name":"tooltip",children:R()})};exports.Tooltip=S;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),r=require("../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),u=require("../../../../external/classnames/index.cjs.js"),F=require("react"),W=require("../card/utility.cjs.js"),d=require("../color-tokens.cjs.js"),o=require("./tooltip.module.scss.cjs.js"),n=require("./tooltip-provider.cjs.js"),v=require("../card/card.cjs.js"),S=require("../card/card-content/card-content.cjs.js"),B=g=>{const{children:f,maxWidth:l="medium",cardProps:e,className:p}=g,{open:m,x:C,y:x,strategy:h,focusManager:q,floating:T,arrowRef:y,getFloatingProps:j,placement:k,context:a}=F.useContext(n.TooltipContext),[w,i]=W.getCardBorderPlacementColor(e==null?void 0:e.border),c=()=>w&&i?d.legacyColorToCore(i):"none",s=c()!=="none",_=()=>e!=null&&e.background?d.legacyColorToCore(e.background):"var(--general-surface-primary)",R=()=>{const b=t.jsx(r.FloatingFocusManager,{...q,context:a,children:t.jsxs("div",{...j({ref:T,style:{position:h,left:C??0,top:x??0},className:u.default(o.default.tooltip,p,{[o.default[`tooltip--${l}`]]:l})}),"data-placement":k,children:[t.jsx(r.FloatingArrow,{ref:A=>y.current=A,context:a,fill:_(),stroke:c(),strokeWidth:s?4:0,className:u.default(o.default.tooltip__arrow,{[o.default["tooltip__arrow--stroke"]]:s}),height:n.ARROW_HEIGHT,width:n.ARROW_WIDTH}),t.jsx(v.Card,{padding:.5,borderless:!0,...e,children:t.jsx(S.CardContent,{children:f})})]})});return m?b:null};return t.jsx(r.FloatingPortal,{"data-name":"tooltip",children:R()})};exports.Tooltip=B;

package/src/community/components/tooltip/tooltip.es.js

@@ -1,49 +1,50 @@
-import { jsx as t, jsxs as T } from "react/jsx-runtime";
-import { FloatingPortal as b, FloatingFocusManager as W, FloatingArrow as v } from "../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
+import { jsx as r, jsxs as R } from "react/jsx-runtime";
+import { FloatingPortal as W, FloatingFocusManager as b, FloatingArrow as N } from "../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
 import s from "../../../../external/classnames/index.es.js";
-import y from "react";
-import { getCardBorderPlacementColor as N } from "../card/utility.es.js";
-import r from "./tooltip.module.scss.es.js";
-import { TooltipContext as B, ARROW_WIDTH as H, ARROW_HEIGHT as $ } from "./tooltip-provider.es.js";
-import { Card as j } from "../card/card.es.js";
-import { CardContent as I } from "../card/card-content/card-content.es.js";
-const L = (c) => {
-  const { children: m, maxWidth: e = "medium", cardProps: o, className: d } = c, { open: p, x: f, y: g, strategy: u, focusManager: h, floating: C, arrowRef: w, getFloatingProps: x, placement: _, context: n } = y.useContext(B), [k, l] = N(o == null ? void 0 : o.border), a = () => k && l ? `var(--color-${l})` : "none", i = a() !== "none", A = () => o != null && o.background ? `var(--color-${o == null ? void 0 : o.background})` : "var(--color-bg-default)";
-  return /* @__PURE__ */ t(b, { "data-name": "tooltip", children: (() => {
-    const F = /* @__PURE__ */ t(W, { ...h, context: n, children: /* @__PURE__ */ T(
+import B from "react";
+import { getCardBorderPlacementColor as H } from "../card/utility.es.js";
+import { legacyColorToCore as m } from "../color-tokens.es.js";
+import t from "./tooltip.module.scss.es.js";
+import { TooltipContext as j, ARROW_WIDTH as v, ARROW_HEIGHT as I } from "./tooltip-provider.es.js";
+import { Card as M } from "../card/card.es.js";
+import { CardContent as O } from "../card/card-content/card-content.es.js";
+const Q = (c) => {
+  const { children: d, maxWidth: e = "medium", cardProps: o, className: p } = c, { open: f, x: g, y: u, strategy: h, focusManager: C, floating: w, arrowRef: x, getFloatingProps: _, placement: k, context: n } = B.useContext(j), [T, a] = H(o == null ? void 0 : o.border), l = () => T && a ? m(a) : "none", i = l() !== "none", y = () => o != null && o.background ? m(o.background) : "var(--general-surface-primary)";
+  return /* @__PURE__ */ r(W, { "data-name": "tooltip", children: (() => {
+    const A = /* @__PURE__ */ r(b, { ...C, context: n, children: /* @__PURE__ */ R(
       "div",
       {
-        ...x({
-          ref: C,
+        ..._({
+          ref: w,
           style: {
-            position: u,
-            left: f ?? 0,
-            top: g ?? 0
+            position: h,
+            left: g ?? 0,
+            top: u ?? 0
           },
-          className: s(r.tooltip, d, { [r[`tooltip--${e}`]]: e })
+          className: s(t.tooltip, p, { [t[`tooltip--${e}`]]: e })
         }),
-        "data-placement": _,
+        "data-placement": k,
         children: [
-          /* @__PURE__ */ t(
-            v,
+          /* @__PURE__ */ r(
+            N,
             {
-              ref: (R) => w.current = R,
+              ref: (F) => x.current = F,
               context: n,
-              fill: A(),
-              stroke: a(),
+              fill: y(),
+              stroke: l(),
               strokeWidth: i ? 4 : 0,
-              className: s(r.tooltip__arrow, { [r["tooltip__arrow--stroke"]]: i }),
-              height: $,
-              width: H
+              className: s(t.tooltip__arrow, { [t["tooltip__arrow--stroke"]]: i }),
+              height: I,
+              width: v
             }
           ),
-          /* @__PURE__ */ t(j, { padding: 0.5, borderless: !0, ...o, children: /* @__PURE__ */ t(I, { children: m }) })
+          /* @__PURE__ */ r(M, { padding: 0.5, borderless: !0, ...o, children: /* @__PURE__ */ r(O, { children: d }) })
         ]
       }
     ) });
-    return p ? F : null;
+    return f ? A : null;
   })() });
 };
 export {
-  L as Tooltip
+  Q as Tooltip
 };

package/src/tedi/components/content/list/list-item.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),c=require("../../../../../external/classnames/index.cjs.js"),u=require("./list.module.scss.cjs.js"),o=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),m=require("../../layout/vertical-spacing/vertical-spacing-item.cjs.js"),a=t=>{const{getCurrentBreakpointProps:n}=o.useBreakpointProps(t.defaultServerBreakpoint),{children:i,verticalSpacingItem:e,className:l}=n(t),r=c.default(u.default["tedi-list__item"],e==null?void 0:e.className,l);return t.verticalSpacingItem?s.jsx(m.VerticalSpacingItem,{...e,element:"li",className:r,children:i}):s.jsx("li",{className:r,children:i})};exports.ListItem=a;exports.default=a;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),o=require("../../../../../external/classnames/index.cjs.js"),m=require("./list.module.scss.cjs.js"),d=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),p=require("../../layout/vertical-spacing/vertical-spacing-item.cjs.js"),a=r=>{const{getCurrentBreakpointProps:u}=d.useBreakpointProps(r.defaultServerBreakpoint),{children:s,verticalSpacingItem:e,className:c,...t}=u(r),i=o.default(m.default["tedi-list__item"],e==null?void 0:e.className,c),n=typeof t.value=="number"?{counterIncrement:"none",counterSet:`item ${t.value}`}:void 0;return r.verticalSpacingItem?l.jsx(p.VerticalSpacingItem,{...e,...t,element:"li",className:i,style:n,children:s}):l.jsx("li",{className:i,...t,style:n,children:s})};exports.ListItem=a;exports.default=a;

package/src/tedi/components/content/list/list-item.d.ts

@@ -7,7 +7,7 @@ type ListItemBreakpointProps = {
      */
     verticalSpacingItem?: Omit<VerticalSpacingItemProps, 'element' | 'children'>;
 };
-export interface ListItemProps extends BreakpointSupport<ListItemBreakpointProps> {
+export interface ListItemProps extends BreakpointSupport<ListItemBreakpointProps>, Omit<React.LiHTMLAttributes<HTMLLIElement>, 'style' | 'children'> {
     /**
      * List children should be ListItem components
      */

package/src/tedi/components/content/list/list-item.es.js

@@ -1,11 +1,11 @@
-import { jsx as m } from "react/jsx-runtime";
-import o from "../../../../../external/classnames/index.es.js";
-import l from "./list.module.scss.es.js";
-import { useBreakpointProps as n } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-import { VerticalSpacingItem as c } from "../../layout/vertical-spacing/vertical-spacing-item.es.js";
-const B = (e) => {
-  const { getCurrentBreakpointProps: i } = n(e.defaultServerBreakpoint), { children: r, verticalSpacingItem: t, className: a } = i(e), s = o(l["tedi-list__item"], t == null ? void 0 : t.className, a);
-  return e.verticalSpacingItem ? /* @__PURE__ */ m(c, { ...t, element: "li", className: s, children: r }) : /* @__PURE__ */ m("li", { className: s, children: r });
+import { jsx as i } from "react/jsx-runtime";
+import l from "../../../../../external/classnames/index.es.js";
+import c from "./list.module.scss.es.js";
+import { useBreakpointProps as u } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+import { VerticalSpacingItem as f } from "../../layout/vertical-spacing/vertical-spacing-item.es.js";
+const B = (r) => {
+  const { getCurrentBreakpointProps: n } = u(r.defaultServerBreakpoint), { children: s, verticalSpacingItem: e, className: a, ...t } = n(r), m = l(c["tedi-list__item"], e == null ? void 0 : e.className, a), o = typeof t.value == "number" ? { counterIncrement: "none", counterSet: `item ${t.value}` } : void 0;
+  return r.verticalSpacingItem ? /* @__PURE__ */ i(f, { ...e, ...t, element: "li", className: m, style: o, children: s }) : /* @__PURE__ */ i("li", { className: m, ...t, style: o, children: s });
 };
 export {
   B as ListItem,