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

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

@@ -0,0 +1,30 @@
+import { jsx as e } from "react/jsx-runtime";
+import m from "../../../../../../external/classnames/index.es.js";
+import t from "../accordion.module.scss.es.js";
+import { useAccordionItemContext as l } from "../accordion-item/accordion-item-context.es.js";
+const h = (n) => {
+  const { children: i, contentClass: c } = n, { headerId: d, contentId: r, expanded: o, showIconCard: a } = l("Accordion.Item.Content"), s = m(
+    t["tedi-accordion-item-content"],
+    {
+      [t["tedi-accordion-item-content--with-icon-card"]]: a
+    },
+    c
+  );
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      "data-name": "accordion-item-content",
+      id: r,
+      className: s,
+      role: o ? "region" : void 0,
+      "aria-labelledby": d,
+      "aria-hidden": !o,
+      inert: o ? void 0 : "",
+      children: /* @__PURE__ */ e("div", { className: t["tedi-accordion-item-content__inner"], children: i })
+    }
+  );
+};
+h.displayName = "AccordionItemContent";
+export {
+  h as AccordionItemContent
+};

package/src/tedi/components/content/accordion/accordion-item-header/accordion-item-header.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),i=require("../../../../../../external/classnames/index.cjs.js"),G=require("../../../base/icon/icon.cjs.js"),j=require("../../../base/typography/text/text.cjs.js"),J=require("../../../buttons/collapse-button/collapse-button.cjs.js"),e=require("../accordion.module.scss.cjs.js"),K=require("../accordion-item/accordion-item-context.cjs.js"),Q=require("../../../../providers/label-provider/use-labels.cjs.js"),v=I=>{const{headerClickable:o=!0,titleLayout:T="hug",openText:c,closeText:s,showExpandLabel:a=!0,showDefaultExpandAction:l=!0,expandActionPosition:u="end",expandActionArrowType:w="default",expandActionSize:C,expandActionInverted:N=!1,expandActionUnderline:q=!1,headerClass:y,title:r,beforeTitle:E,afterTitle:L,startAction:H,endAction:S,startDescription:h,endDescription:z,headingLevel:m}=I,{headerId:x,contentId:p,expanded:n,toggle:f,showIconCard:B,disabled:d}=K.useAccordionItemContext("Accordion.Item.Header"),{getLabel:_}=Q.useLabels(),D=c??_("open"),O=s??_("close"),k=n?O:D,P=l&&u==="start",F=l&&u==="end",M=C??(a?"default":"small"),R=i.default(e.default["tedi-accordion-item-header"],{[e.default["tedi-accordion-item-header--hoverable"]]:o&&!d,[e.default["tedi-accordion-item-header--expanded"]]:n,[e.default["tedi-accordion-item-header--with-icon-card"]]:B,[e.default["tedi-accordion-item-header--disabled"]]:d},y),U=()=>t.jsx(G.Icon,{name:"expand_more",color:"inherit",size:16,className:i.default(e.default["tedi-accordion-item-header__icon"],{[e.default["tedi-accordion-item-header__icon--expanded"]]:n,[e.default["tedi-accordion-item-header__icon--no-label"]]:!a})}),g=()=>o?t.jsxs("span",{className:i.default(e.default["tedi-accordion-item-header__expand-indicator"],{[e.default["tedi-accordion-item-header__expand-indicator--with-label"]]:a}),children:[t.jsx(j.Text,{element:"span",modifiers:"normal",children:a?k:null}),U()]}):t.jsx(J.CollapseButton,{open:n,onOpenChange:()=>f(),openText:c,closeText:s,hideText:!a,arrowType:w,size:M,inverted:N,underline:q,disabled:d,"aria-controls":p,"aria-disabled":d||void 0,tabIndex:d?-1:void 0}),b=t.jsxs(t.Fragment,{children:[t.jsxs("span",{className:e.default["tedi-accordion-item-header__start"],children:[H,E,t.jsxs("span",{className:i.default(e.default["tedi-accordion-item-header__title"],{[e.default["tedi-accordion-item-header__title--grow"]]:T==="fill",[e.default["tedi-accordion-item-header__title--with-description"]]:h}),children:[t.jsxs("span",{className:e.default["tedi-accordion-item-header__title-main"],children:[P&&g(),r!=null&&t.jsx(j.Text,{element:"span",color:"secondary",modifiers:"normal",children:r})]}),h]}),L]}),z,F&&g(),S]}),A=o?t.jsx("button",{type:"button",id:x,className:e.default["tedi-accordion-item-header__trigger"],onClick:f,disabled:d,"aria-expanded":n,"aria-controls":p,children:b}):t.jsx("div",{id:x,className:e.default["tedi-accordion-item-header__trigger"],children:b}),W=(()=>{if(!m)return A;const $=`h${m}`;return t.jsx($,{className:e.default["tedi-accordion-item-header__heading-wrapper"],children:A})})();return t.jsx("div",{"data-name":"accordion-item-header",className:R,children:W})};v.displayName="AccordionItemHeader";exports.AccordionItemHeader=v;

package/src/tedi/components/content/accordion/accordion-item-header/accordion-item-header.d.ts

@@ -0,0 +1,134 @@
+import { default as React } from 'react';
+import { CollapseButtonArrowType, CollapseButtonSize } from '../../../buttons/collapse-button/collapse-button';
+export type AccordionItemHeaderTitleLayout = 'hug' | 'fill';
+export type AccordionItemHeaderExpandActionPosition = 'start' | 'end';
+export type AccordionItemHeaderHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+export interface AccordionItemHeaderProps {
+    /**
+     * If false, disables header toggling and enables using interactive elements in the
+     * accordion header. The default expand action is still rendered alongside it unless
+     * `showDefaultExpandAction` is also set to `false`.
+     * @default true
+     */
+    headerClickable?: boolean;
+    /**
+     * Sets how the accordion title stretches horizontally.
+     *
+     * `hug` — wraps tightly around content.
+     *
+     * `fill` — expands to available space and pushes trailing elements to the end.
+     * @default hug
+     */
+    titleLayout?: AccordionItemHeaderTitleLayout;
+    /**
+     * Text shown when the accordion is collapsed. Rendered literally —
+     * translate at the call site if needed. When omitted, falls back to the
+     * `LabelProvider`'s translated `'open'` label.
+     */
+    openText?: string;
+    /**
+     * Text shown when the accordion is expanded. Rendered literally —
+     * translate at the call site if needed. When omitted, falls back to the
+     * `LabelProvider`'s translated `'close'` label.
+     */
+    closeText?: string;
+    /**
+     * Controls whether the expand/collapse label is shown.
+     * @default true
+     */
+    showExpandLabel?: boolean;
+    /**
+     * Controls whether the default expand/collapse action is shown.
+     * @default true
+     */
+    showDefaultExpandAction?: boolean;
+    /**
+     * Position of the expand action relative to the header content.
+     * @default end
+     */
+    expandActionPosition?: AccordionItemHeaderExpandActionPosition;
+    /**
+     * Chevron style of the default expand action.
+     * Only effective when `headerClickable` is `false` (otherwise the
+     * default expand action isn't a `CollapseButton`) and `showExpandLabel`
+     * is `false` (only icon-only mode honours `arrowType` — see the
+     * `CollapseButton` docs).
+     * @default 'default'
+     */
+    expandActionArrowType?: CollapseButtonArrowType;
+    /**
+     * Visual size of the default expand action. Only effective when
+     * `headerClickable` is `false`.
+     *
+     * When omitted, the size is derived from `showExpandLabel`:
+     * - `showExpandLabel === true`  → `'default'`
+     * - `showExpandLabel === false` → `'small'` (icon-only mode reads
+     *   better at the smaller chevron size).
+     *
+     * Pass an explicit value to override the derived default.
+     */
+    expandActionSize?: CollapseButtonSize;
+    /**
+     * Use the inverted (light-on-dark) palette for the default expand
+     * action, for placement on a dark or brand background. Only effective
+     * when `headerClickable` is `false`.
+     * @default false
+     */
+    expandActionInverted?: boolean;
+    /**
+     * Whether the default expand action's label is underlined. Defaults to
+     * `false` so the chevron stays the sole affordance — an underlined
+     * label inside the accordion header reads as a stray link. Set to
+     * `true` for contexts that want link-style styling. Only effective
+     * when `headerClickable` is `false` and the expand action is not in
+     * icon-only mode (i.e. `showExpandLabel` is `true`).
+     * @default false
+     */
+    expandActionUnderline?: boolean;
+    /**
+     * Custom CSS class for the accordion header.
+     */
+    headerClass?: string;
+    /**
+     * The accordion title content. Renders inside the header's title slot.
+     * Use a string for plain text, or a node for richer content.
+     */
+    title?: React.ReactNode;
+    /**
+     * Custom content rendered before the title.
+     */
+    beforeTitle?: React.ReactNode;
+    /**
+     * Custom content rendered after the title.
+     */
+    afterTitle?: React.ReactNode;
+    /**
+     * Custom action elements rendered at the start of the header.
+     */
+    startAction?: React.ReactNode;
+    /**
+     * Custom action elements rendered at the end of the header.
+     */
+    endAction?: React.ReactNode;
+    /**
+     * Custom description content rendered below the title (start of the header).
+     */
+    startDescription?: React.ReactNode;
+    /**
+     * Custom description content rendered at the end of the header.
+     */
+    endDescription?: React.ReactNode;
+    /**
+     * When set, wraps the header trigger in a semantic `<h1>`–`<h6>` element
+     * following the WAI-ARIA Accordion Pattern. Improves accessibility for
+     * documents with a heading hierarchy (FAQ pages, docs). The wrapper uses
+     * `display: contents` so it doesn't affect the visual layout — it only adds
+     * semantic information for assistive technologies and TOC tools.
+     */
+    headingLevel?: AccordionItemHeaderHeadingLevel;
+}
+export declare const AccordionItemHeader: {
+    (props: AccordionItemHeaderProps): JSX.Element;
+    displayName: string;
+};
+export default AccordionItemHeader;

package/src/tedi/components/content/accordion/accordion-item-header/accordion-item-header.es.js

@@ -0,0 +1,126 @@
+import { jsxs as a, Fragment as K, jsx as t } from "react/jsx-runtime";
+import d from "../../../../../../external/classnames/index.es.js";
+import { Icon as M } from "../../../base/icon/icon.es.js";
+import { Text as w } from "../../../base/typography/text/text.es.js";
+import { CollapseButton as Q } from "../../../buttons/collapse-button/collapse-button.es.js";
+import e from "../accordion.module.scss.es.js";
+import { useAccordionItemContext as R } from "../accordion-item/accordion-item-context.es.js";
+import { useLabels as V } from "../../../../providers/label-provider/use-labels.es.js";
+const X = (C) => {
+  const {
+    headerClickable: r = !0,
+    titleLayout: I = "hug",
+    openText: s,
+    closeText: l,
+    showExpandLabel: o = !0,
+    showDefaultExpandAction: m = !0,
+    expandActionPosition: h = "end",
+    expandActionArrowType: N = "default",
+    expandActionSize: T,
+    expandActionInverted: y = !1,
+    expandActionUnderline: E = !1,
+    headerClass: L,
+    title: c,
+    beforeTitle: H,
+    afterTitle: z,
+    startAction: D,
+    endAction: S,
+    startDescription: p,
+    endDescription: j,
+    headingLevel: x
+  } = C, { headerId: _, contentId: u, expanded: n, toggle: f, showIconCard: k, disabled: i } = R("Accordion.Item.Header"), { getLabel: g } = V(), B = s ?? g("open"), O = l ?? g("close"), F = n ? O : B, P = m && h === "start", U = m && h === "end", W = T ?? (o ? "default" : "small"), $ = d(
+    e["tedi-accordion-item-header"],
+    {
+      [e["tedi-accordion-item-header--hoverable"]]: r && !i,
+      [e["tedi-accordion-item-header--expanded"]]: n,
+      [e["tedi-accordion-item-header--with-icon-card"]]: k,
+      [e["tedi-accordion-item-header--disabled"]]: i
+    },
+    L
+  ), q = () => /* @__PURE__ */ t(
+    M,
+    {
+      name: "expand_more",
+      color: "inherit",
+      size: 16,
+      className: d(e["tedi-accordion-item-header__icon"], {
+        [e["tedi-accordion-item-header__icon--expanded"]]: n,
+        [e["tedi-accordion-item-header__icon--no-label"]]: !o
+      })
+    }
+  ), A = () => r ? /* @__PURE__ */ a(
+    "span",
+    {
+      className: d(e["tedi-accordion-item-header__expand-indicator"], {
+        [e["tedi-accordion-item-header__expand-indicator--with-label"]]: o
+      }),
+      children: [
+        /* @__PURE__ */ t(w, { element: "span", modifiers: "normal", children: o ? F : null }),
+        q()
+      ]
+    }
+  ) : /* @__PURE__ */ t(
+    Q,
+    {
+      open: n,
+      onOpenChange: () => f(),
+      openText: s,
+      closeText: l,
+      hideText: !o,
+      arrowType: N,
+      size: W,
+      inverted: y,
+      underline: E,
+      disabled: i,
+      "aria-controls": u,
+      "aria-disabled": i || void 0,
+      tabIndex: i ? -1 : void 0
+    }
+  ), b = /* @__PURE__ */ a(K, { children: [
+    /* @__PURE__ */ a("span", { className: e["tedi-accordion-item-header__start"], children: [
+      D,
+      H,
+      /* @__PURE__ */ a(
+        "span",
+        {
+          className: d(e["tedi-accordion-item-header__title"], {
+            [e["tedi-accordion-item-header__title--grow"]]: I === "fill",
+            [e["tedi-accordion-item-header__title--with-description"]]: p
+          }),
+          children: [
+            /* @__PURE__ */ a("span", { className: e["tedi-accordion-item-header__title-main"], children: [
+              P && A(),
+              c != null && /* @__PURE__ */ t(w, { element: "span", color: "secondary", modifiers: "normal", children: c })
+            ] }),
+            p
+          ]
+        }
+      ),
+      z
+    ] }),
+    j,
+    U && A(),
+    S
+  ] }), v = r ? /* @__PURE__ */ t(
+    "button",
+    {
+      type: "button",
+      id: _,
+      className: e["tedi-accordion-item-header__trigger"],
+      onClick: f,
+      disabled: i,
+      "aria-expanded": n,
+      "aria-controls": u,
+      children: b
+    }
+  ) : /* @__PURE__ */ t("div", { id: _, className: e["tedi-accordion-item-header__trigger"], children: b }), G = (() => {
+    if (!x) return v;
+    const J = `h${x}`;
+    return /* @__PURE__ */ t(J, { className: e["tedi-accordion-item-header__heading-wrapper"], children: v });
+  })();
+  return /* @__PURE__ */ t("div", { "data-name": "accordion-item-header", className: $, children: G });
+};
+X.displayName = "AccordionItemHeader";
+export {
+  X as AccordionItemHeader
+};

package/src/tedi/components/content/accordion/accordion.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),y=require("../../../../../external/classnames/index.cjs.js"),e=require("react"),A=require("./accordion.module.scss.cjs.js"),C=require("./accordion-context.cjs.js"),R=require("./accordion-item/accordion-item.cjs.js"),b=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),f=c=>{const{getCurrentBreakpointProps:m}=b.useBreakpointProps(c.defaultServerBreakpoint),{children:p,className:x,allowMultiple:t=!1,defaultExpanded:i=!1,itemGap:a,...q}=m(c),v=a!==void 0?{"--tedi-accordion-item-gap":`${a}rem`}:void 0,r=e.useRef(new Map),s=e.useRef(t);s.current=t;const d=e.useCallback((o,n)=>(r.current.set(o,n),()=>{r.current.delete(o)}),[]),u=e.useCallback(o=>{s.current||r.current.forEach((n,k)=>{k!==o&&n(!1)})},[]),g=e.useMemo(()=>({allowMultiple:t,defaultExpanded:i,notifyExpanded:u,register:d}),[t,i,u,d]);return l.jsx(C.AccordionContext.Provider,{value:g,children:l.jsx("div",{"data-name":"accordion","data-testid":"tedi-accordion",...q,className:y.default(A.default["tedi-accordion"],x),style:v,children:p})})};f.displayName="Accordion";const j=Object.assign(f,{Item:R.AccordionItem});exports.Accordion=j;

package/src/tedi/components/content/accordion/accordion.d.ts

@@ -0,0 +1,61 @@
+import { default as React } from 'react';
+import { BreakpointSupport } from '../../../helpers';
+type AccordionBreakpointProps = {
+    /**
+     * Additional class.
+     */
+    className?: string;
+    /**
+     * Whether the accordion allows multiple items to be expanded at the same time.
+     * If false, opening one item will collapse the others automatically.
+     * @default false
+     */
+    allowMultiple?: boolean;
+    /**
+     * Group-level default for items' initial expanded state. Sets the initial
+     * `defaultExpanded` for every child `Accordion.Item` that doesn't specify
+     * its own. Per-item `defaultExpanded` (including an explicit `false`)
+     * takes precedence.
+     *
+     * Typically combined with `allowMultiple` to start with all items open.
+     * @default false
+     */
+    defaultExpanded?: boolean;
+    /**
+     * Vertical gap between sibling `Accordion.Item` components in rem
+     * Accepts any number, not limited to a fixed scale.
+     *
+     * Forwarded as the `--tedi-accordion-item-gap` CSS variable, so consumers
+     * can also override it from any ancestor class — or set a px value there
+     * directly when an exact-pixel override is needed.
+     *
+     * When omitted, falls back to the design-token default
+     * (`var(--layout-grid-gutters-08)` = 0.5rem).
+     */
+    itemGap?: number;
+};
+export interface AccordionProps extends BreakpointSupport<AccordionBreakpointProps> {
+    /**
+     * Accordion content. Should be one or more `AccordionItem` components.
+     */
+    children?: React.ReactNode;
+}
+export declare const Accordion: {
+    (props: AccordionProps): JSX.Element;
+    displayName: string;
+} & {
+    Item: {
+        (props: import('.').AccordionItemProps): JSX.Element;
+        displayName: string;
+    } & {
+        Header: {
+            (props: import('.').AccordionItemHeaderProps): JSX.Element;
+            displayName: string;
+        };
+        Content: {
+            (props: import('.').AccordionItemContentProps): JSX.Element;
+            displayName: string;
+        };
+    };
+};
+export default Accordion;

package/src/tedi/components/content/accordion/accordion.es.js

@@ -0,0 +1,51 @@
+import { jsx as m } from "react/jsx-runtime";
+import C from "../../../../../external/classnames/index.es.js";
+import e from "react";
+import R from "./accordion.module.scss.es.js";
+import { AccordionContext as g } from "./accordion-context.es.js";
+import { AccordionItem as M } from "./accordion-item/accordion-item.es.js";
+import { useBreakpointProps as N } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+const u = (c) => {
+  const { getCurrentBreakpointProps: f } = N(c.defaultServerBreakpoint), {
+    children: p,
+    className: v,
+    allowMultiple: t = !1,
+    defaultExpanded: a = !1,
+    itemGap: i,
+    ...x
+  } = f(c), k = i !== void 0 ? { "--tedi-accordion-item-gap": `${i}rem` } : void 0, r = e.useRef(/* @__PURE__ */ new Map()), s = e.useRef(t);
+  s.current = t;
+  const l = e.useCallback((o, n) => (r.current.set(o, n), () => {
+    r.current.delete(o);
+  }), []), d = e.useCallback((o) => {
+    s.current || r.current.forEach((n, A) => {
+      A !== o && n(!1);
+    });
+  }, []), y = e.useMemo(
+    () => ({
+      allowMultiple: t,
+      defaultExpanded: a,
+      notifyExpanded: d,
+      register: l
+    }),
+    [t, a, d, l]
+  );
+  return /* @__PURE__ */ m(g.Provider, { value: y, children: /* @__PURE__ */ m(
+    "div",
+    {
+      "data-name": "accordion",
+      "data-testid": "tedi-accordion",
+      ...x,
+      className: C(R["tedi-accordion"], v),
+      style: k,
+      children: p
+    }
+  ) });
+};
+u.displayName = "Accordion";
+const I = Object.assign(u, {
+  Item: M
+});
+export {
+  I as Accordion
+};

package/src/tedi/components/content/accordion/accordion.module.scss.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-accordion":"tedi-accordion-3008127b","tedi-accordion__item":"tedi-accordion__item-c42537a8","tedi-accordion__item--selected":"tedi-accordion__item--selected-39cde887","tedi-accordion-item-header":"tedi-accordion-item-header-4a087734","tedi-accordion__item--expanded":"tedi-accordion__item--expanded-ce6f4283","tedi-accordion-item-content":"tedi-accordion-item-content-64aa3ef4","tedi-accordion__icon-card":"tedi-accordion__icon-card-9281697b","tedi-accordion-item-header--with-icon-card":"tedi-accordion-item-header--with-icon-card-7faff869","tedi-accordion-item-content--with-icon-card":"tedi-accordion-item-content--with-icon-card-1d759b0e","tedi-accordion-item-header--expanded":"tedi-accordion-item-header--expanded-449f0882","tedi-accordion-item-header--hoverable":"tedi-accordion-item-header--hoverable-5a372e7b","tedi-accordion-item-header__trigger":"tedi-accordion-item-header__trigger-6164d1c8","tedi-accordion-item-header--disabled":"tedi-accordion-item-header--disabled-5532ac3a","tedi-accordion-item-header__title-main":"tedi-accordion-item-header__title-main-2222462a","tedi-accordion-item-header__expand-indicator":"tedi-accordion-item-header__expand-indicator-b9c89257","tedi-accordion-item-header__heading-wrapper":"tedi-accordion-item-header__heading-wrapper-d419d1f0","tedi-accordion-item-header__start":"tedi-accordion-item-header__start-5c55e3cc","tedi-accordion-item-header__title":"tedi-accordion-item-header__title-678c469e","tedi-accordion-item-header__title--with-description":"tedi-accordion-item-header__title--with-description-3f5a3f28","tedi-accordion-item-header__title--grow":"tedi-accordion-item-header__title--grow-30e8c5c7","tedi-accordion-item-header__icon":"tedi-accordion-item-header__icon-4ca47f34","tedi-accordion-item-header__expand-indicator--with-label":"tedi-accordion-item-header__expand-indicator--with-label-c274165b","tedi-accordion-item-header__icon--expanded":"tedi-accordion-item-header__icon--expanded-6e63d6cf","tedi-accordion-item-header__icon--no-label":"tedi-accordion-item-header__icon--no-label-95a984be","tedi-accordion-item-content__inner":"tedi-accordion-item-content__inner-cbfa362f","tedi-accordion__item--with-icon-card":"tedi-accordion__item--with-icon-card-9af46a70"};exports.default=e;

package/src/tedi/components/content/accordion/accordion.module.scss.es.js

@@ -0,0 +1,31 @@
+const e = {
+  "tedi-accordion": "tedi-accordion-3008127b",
+  "tedi-accordion__item": "tedi-accordion__item-c42537a8",
+  "tedi-accordion__item--selected": "tedi-accordion__item--selected-39cde887",
+  "tedi-accordion-item-header": "tedi-accordion-item-header-4a087734",
+  "tedi-accordion__item--expanded": "tedi-accordion__item--expanded-ce6f4283",
+  "tedi-accordion-item-content": "tedi-accordion-item-content-64aa3ef4",
+  "tedi-accordion__icon-card": "tedi-accordion__icon-card-9281697b",
+  "tedi-accordion-item-header--with-icon-card": "tedi-accordion-item-header--with-icon-card-7faff869",
+  "tedi-accordion-item-content--with-icon-card": "tedi-accordion-item-content--with-icon-card-1d759b0e",
+  "tedi-accordion-item-header--expanded": "tedi-accordion-item-header--expanded-449f0882",
+  "tedi-accordion-item-header--hoverable": "tedi-accordion-item-header--hoverable-5a372e7b",
+  "tedi-accordion-item-header__trigger": "tedi-accordion-item-header__trigger-6164d1c8",
+  "tedi-accordion-item-header--disabled": "tedi-accordion-item-header--disabled-5532ac3a",
+  "tedi-accordion-item-header__title-main": "tedi-accordion-item-header__title-main-2222462a",
+  "tedi-accordion-item-header__expand-indicator": "tedi-accordion-item-header__expand-indicator-b9c89257",
+  "tedi-accordion-item-header__heading-wrapper": "tedi-accordion-item-header__heading-wrapper-d419d1f0",
+  "tedi-accordion-item-header__start": "tedi-accordion-item-header__start-5c55e3cc",
+  "tedi-accordion-item-header__title": "tedi-accordion-item-header__title-678c469e",
+  "tedi-accordion-item-header__title--with-description": "tedi-accordion-item-header__title--with-description-3f5a3f28",
+  "tedi-accordion-item-header__title--grow": "tedi-accordion-item-header__title--grow-30e8c5c7",
+  "tedi-accordion-item-header__icon": "tedi-accordion-item-header__icon-4ca47f34",
+  "tedi-accordion-item-header__expand-indicator--with-label": "tedi-accordion-item-header__expand-indicator--with-label-c274165b",
+  "tedi-accordion-item-header__icon--expanded": "tedi-accordion-item-header__icon--expanded-6e63d6cf",
+  "tedi-accordion-item-header__icon--no-label": "tedi-accordion-item-header__icon--no-label-95a984be",
+  "tedi-accordion-item-content__inner": "tedi-accordion-item-content__inner-cbfa362f",
+  "tedi-accordion__item--with-icon-card": "tedi-accordion__item--with-icon-card-9af46a70"
+};
+export {
+  e as default
+};

package/src/tedi/components/content/accordion/index.d.ts

@@ -0,0 +1,6 @@
+export * from './accordion';
+export * from './accordion-context';
+export * from './accordion-item/accordion-item';
+export * from './accordion-item/accordion-item-context';
+export * from './accordion-item-header/accordion-item-header';
+export * from './accordion-item-content/accordion-item-content';

package/src/tedi/components/content/calendar/calendar-grid.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../../../../external/classnames/index.cjs.js"),a=require("../../base/typography/text/text.cjs.js"),l=require("../../buttons/button/button.cjs.js"),r=require("./calendar.module.scss.cjs.js"),j=require("../../layout/grid/row.cjs.js"),h=require("../../layout/grid/col.cjs.js"),s=({headerLabel:u,prevAriaLabel:n,nextAriaLabel:c,onPrev:o,onNext:f,items:x,onSelect:p,showNavigation:d,className:_})=>e.jsxs("div",{className:t.default(r.default["tedi-calendar__picker-grid-container"],_),"data-testid":"tedi-picker-grid-container",children:[e.jsxs("div",{className:t.default(r.default["tedi-calendar__picker-grid-header"],{[r.default["tedi-calendar__picker--no-navigation"]]:!d}),children:[d&&e.jsx(l.Button,{type:"button",onClick:o,"aria-label":n,icon:"arrow_back",visualType:"neutral",children:e.jsx(a.Text,{modifiers:"capitalize-first",children:n})}),e.jsx(a.Text,{modifiers:"capitalize-first",children:u}),d&&e.jsx(l.Button,{type:"button",onClick:f,"aria-label":c,icon:"arrow_forward",visualType:"neutral",children:e.jsx(a.Text,{modifiers:"capitalize-first",children:c})})]}),e.jsx("div",{className:t.default(r.default["tedi-calendar__picker-grid"]),children:e.jsx(j.Row,{gutter:2,children:x.map(i=>e.jsx(h.Col,{width:4,children:e.jsx(l.Button,{onClick:()=>p(i.value),className:t.default(r.default["tedi-calendar__grid-button"],{[r.default["tedi-calendar__grid-button--selected"]]:i.isSelected}),"aria-pressed":i.isSelected,noStyle:!0,children:i.label})},i.key))})})]});s.displayName="CalendarGrid";exports.CalendarGrid=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),a=require("../../base/typography/text/text.cjs.js"),l=require("../../buttons/button/button.cjs.js"),r=require("./calendar.module.scss.cjs.js"),j=require("../../layout/grid/row.cjs.js"),h=require("../../layout/grid/col.cjs.js"),s=({headerLabel:u,prevAriaLabel:n,nextAriaLabel:c,onPrev:o,onNext:f,items:x,onSelect:p,showNavigation:d,className:_})=>e.jsxs("div",{className:i.default(r.default["tedi-calendar__picker-grid-container"],_),"data-testid":"tedi-picker-grid-container",children:[e.jsxs("div",{className:i.default(r.default["tedi-calendar__picker-grid-header"],{[r.default["tedi-calendar__picker--no-navigation"]]:!d}),children:[d&&e.jsx(l.Button,{type:"button",onClick:o,"aria-label":n,icon:"arrow_back",visualType:"neutral",children:e.jsx(a.Text,{modifiers:"capitalize-first",children:n})}),e.jsx(a.Text,{modifiers:"capitalize-first",children:u}),d&&e.jsx(l.Button,{type:"button",onClick:f,"aria-label":c,icon:"arrow_forward",visualType:"neutral",children:e.jsx(a.Text,{modifiers:"capitalize-first",children:c})})]}),e.jsx("div",{className:i.default(r.default["tedi-calendar__picker-grid"]),children:e.jsx(j.Row,{gutter:2,children:x.map(t=>e.jsx(h.Col,{width:4,children:e.jsx(l.Button,{onClick:()=>p(t.value),className:i.default(r.default["tedi-calendar__grid-button"],{[r.default["tedi-calendar__grid-button--selected"]]:t.isSelected}),"aria-pressed":t.isSelected,"data-testid":"tedi-calendar-grid-cell",noStyle:!0,children:t.label})},t.key))})})]});s.displayName="CalendarGrid";exports.CalendarGrid=s;

package/src/tedi/components/content/calendar/calendar-grid.es.js

@@ -1,7 +1,7 @@
 import { jsxs as o, jsx as e } from "react/jsx-runtime";
 import a from "../../../../../external/classnames/index.es.js";
-import { Text as l } from "../../base/typography/text/text.es.js";
-import { Button as t } from "../../buttons/button/button.es.js";
+import { Text as t } from "../../base/typography/text/text.es.js";
+import { Button as l } from "../../buttons/button/button.es.js";
 import r from "./calendar.module.scss.es.js";
 import { Row as h } from "../../layout/grid/row.es.js";
 import { Col as k } from "../../layout/grid/col.es.js";
@@ -28,20 +28,21 @@ const y = ({
             [r["tedi-calendar__picker--no-navigation"]]: !d
           }),
           children: [
-            d && /* @__PURE__ */ e(t, { type: "button", onClick: p, "aria-label": c, icon: "arrow_back", visualType: "neutral", children: /* @__PURE__ */ e(l, { modifiers: "capitalize-first", children: c }) }),
-            /* @__PURE__ */ e(l, { modifiers: "capitalize-first", children: s }),
-            d && /* @__PURE__ */ e(t, { type: "button", onClick: m, "aria-label": n, icon: "arrow_forward", visualType: "neutral", children: /* @__PURE__ */ e(l, { modifiers: "capitalize-first", children: n }) })
+            d && /* @__PURE__ */ e(l, { type: "button", onClick: p, "aria-label": c, icon: "arrow_back", visualType: "neutral", children: /* @__PURE__ */ e(t, { modifiers: "capitalize-first", children: c }) }),
+            /* @__PURE__ */ e(t, { modifiers: "capitalize-first", children: s }),
+            d && /* @__PURE__ */ e(l, { type: "button", onClick: m, "aria-label": n, icon: "arrow_forward", visualType: "neutral", children: /* @__PURE__ */ e(t, { modifiers: "capitalize-first", children: n }) })
           ]
         }
       ),
       /* @__PURE__ */ e("div", { className: a(r["tedi-calendar__picker-grid"]), children: /* @__PURE__ */ e(h, { gutter: 2, children: f.map((i) => /* @__PURE__ */ e(k, { width: 4, children: /* @__PURE__ */ e(
-        t,
+        l,
         {
           onClick: () => _(i.value),
           className: a(r["tedi-calendar__grid-button"], {
             [r["tedi-calendar__grid-button--selected"]]: i.isSelected
           }),
           "aria-pressed": i.isSelected,
+          "data-testid": "tedi-calendar-grid-cell",
           noStyle: !0,
           children: i.label
         }

package/src/tedi/components/content/calendar/calendar.d.ts

@@ -109,9 +109,10 @@ export interface CalendarProps extends Omit<DayPickerProps, 'mode' | 'selected'
     className?: string;
     /**
      * Whether to render the surrounding card (border, background, radius).
-     * Set to `false` when embedding inside a parent that already provides
-     * its own surface — e.g. alongside a calendar inside `DateTimeField`.
-     * The inner gradient masks and column separators are preserved either way.
+     * Set to `false` when embedding inside a parent that already provides its
+     * own surface — e.g. inside `DatePickerModal`, or alongside a calendar in
+     * `DateTimeField`. The inner gradient masks and column separators are
+     * preserved either way.
      * @default true
      */
     bordered?: boolean;

package/src/tedi/components/content/calendar/components/calendar-header/calendar-header.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),y=require("../../../../../../../external/classnames/index.cjs.js"),x=require("react"),w=require("../../../../base/icon/icon.cjs.js"),i=require("../../../../buttons/button/button.cjs.js"),r=require("./calendar-header.module.scss.cjs.js"),T=require("../../../../../../../external/react-day-picker/dist/esm/types/deprecated.cjs.js"),I=require("../../../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.cjs.js"),l=require("../../../../overlays/dropdown/dropdown.cjs.js"),L=require("../../../../../providers/label-provider/use-labels.cjs.js");function H({calendarMonth:S,monthYearSelectType:q="dropdown",onOpenMonthGrid:N,onOpenYearGrid:v,showNavigation:p=!0,localeCode:m,disabledMatchers:o}){const f=q==="grid",{getLabel:s}=L.useLabels(),{goToMonth:u,nextMonth:j,previousMonth:D}=T.useNavigation(),d=S.date,c=d.getFullYear(),k=d.getMonth(),C=Array.from({length:12},(n,t)=>new Date(c,t,1).toLocaleString(m,{month:"long"})),F=new Date().getFullYear(),h=Array.from({length:21},(n,t)=>F-10+t),_=x.useCallback((n,t)=>{if(!(o!=null&&o.length))return!1;const a=new Date(n);for(;a<=t;){if(!I.dateMatchModifiers(a,o))return!1;a.setDate(a.getDate()+1)}return!0},[o]),Y=x.useMemo(()=>{if(!(o!=null&&o.length))return new Set;const n=new Set;for(let t=0;t<12;t++){const a=new Date(c,t,1),g=new Date(c,t+1,0);_(a,g)&&n.add(t)}return n},[o,c,_]),B=x.useMemo(()=>{if(!(o!=null&&o.length))return new Set;const n=new Set;for(const t of h){const a=new Date(t,0,1),g=new Date(t,11,31);_(a,g)&&n.add(t)}return n},[o,h,_]);return e.jsxs("div",{className:y.default(r.default["tedi-calendar__header"],{[r.default["tedi-calendar__no-navigation"]]:!p}),children:[p&&e.jsx(i.Button,{type:"button",onClick:()=>D&&u(D),"aria-label":s("pickers.previousMonth"),icon:"arrow_back",visualType:"neutral",children:s("pickers.previousMonth")}),f?e.jsxs(e.Fragment,{children:[e.jsxs(i.Button,{noStyle:!0,className:r.default["tedi-calendar__month-year-selector"],onClick:N,children:[d.toLocaleString(m,{month:"long"}),e.jsx(w.Icon,{name:"arrow_drop_down",color:"tertiary",className:r.default["tedi-calendar__month-year-caret"]})]}),e.jsxs(i.Button,{noStyle:!0,className:r.default["tedi-calendar__month-year-selector"],onClick:v,children:[d.getFullYear(),e.jsx(w.Icon,{name:"arrow_drop_down",color:"tertiary",className:r.default["tedi-calendar__month-year-caret"]})]})]}):e.jsxs(e.Fragment,{children:[e.jsxs(l.Dropdown,{className:y.default(r.default["tedi-calendar__month-year-dropdown"],{[r.default["tedi-calendar__picker-grid-dropdown"]]:f}),width:"auto",children:[e.jsx(l.Dropdown.Trigger,{children:e.jsxs(i.Button,{noStyle:!0,className:r.default["tedi-calendar__month-year-selector"],children:[d.toLocaleString(m,{month:"long"}),e.jsx(w.Icon,{name:"arrow_drop_down",color:"tertiary",className:r.default["tedi-calendar__month-year-caret"],"data-testid":"tedi-icon-arrow_drop_down"})]})}),e.jsx(l.Dropdown.Content,{children:C.map((n,t)=>e.jsx(l.Dropdown.Item,{index:t,active:k===t,disabled:Y.has(t),onClick:()=>u(new Date(c,t)),children:n},n))})]}),e.jsxs(l.Dropdown,{className:y.default(r.default["tedi-calendar__month-year-dropdown"],{[r.default["tedi-calendar__picker-grid-dropdown"]]:f}),width:"auto",children:[e.jsx(l.Dropdown.Trigger,{children:e.jsxs(i.Button,{noStyle:!0,className:r.default["tedi-calendar__month-year-selector"],children:[d.getFullYear(),e.jsx(w.Icon,{name:"arrow_drop_down",color:"tertiary",className:r.default["tedi-calendar__month-year-caret"],"data-testid":"tedi-icon-arrow_drop_down"})]})}),e.jsx(l.Dropdown.Content,{children:h.map((n,t)=>e.jsx(l.Dropdown.Item,{index:t,active:c===n,disabled:B.has(n),onClick:()=>u(new Date(n,k)),children:n},n))})]})]}),p&&e.jsx(i.Button,{type:"button",onClick:()=>j&&u(j),visualType:"neutral","aria-label":s("pickers.nextMonth"),icon:"arrow_forward",children:s("pickers.nextMonth")})]})}exports.CalendarHeader=H;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),y=require("../../../../../../../external/classnames/index.cjs.js"),j=require("react"),p=require("../../../../base/icon/icon.cjs.js"),k=require("../../../../base/typography/text/text.cjs.js"),c=require("../../../../buttons/button/button.cjs.js"),r=require("./calendar-header.module.scss.cjs.js"),B=require("../../../../../providers/label-provider/use-labels.cjs.js"),L=require("../../../../../../../external/react-day-picker/dist/esm/types/deprecated.cjs.js"),A=require("../../../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.cjs.js"),l=require("../../../../overlays/dropdown/dropdown.cjs.js");function H({calendarMonth:v,monthYearSelectType:q="dropdown",onOpenMonthGrid:N,onOpenYearGrid:C,showNavigation:u=!0,localeCode:_,disabledMatchers:o}){const h=q==="grid",{getLabel:m}=B.useLabels(),{goToMonth:w,nextMonth:D,previousMonth:S}=L.useNavigation(),i=v.date,a=i.getFullYear(),x=i.getMonth(),T=Array.from({length:12},(n,t)=>new Date(a,t,1).toLocaleString(_,{month:"long"})),F=new Date().getFullYear(),s=Array.from({length:21},(n,t)=>F-10+t),f=j.useCallback((n,t)=>{if(!(o!=null&&o.length))return!1;const d=new Date(n);for(;d<=t;){if(!A.dateMatchModifiers(d,o))return!1;d.setDate(d.getDate()+1)}return!0},[o]),I=j.useMemo(()=>{if(!(o!=null&&o.length))return new Set;const n=new Set;for(let t=0;t<12;t++){const d=new Date(a,t,1),g=new Date(a,t+1,0);f(d,g)&&n.add(t)}return n},[o,a,f]),Y=j.useMemo(()=>{if(!(o!=null&&o.length))return new Set;const n=new Set;for(const t of s){const d=new Date(t,0,1),g=new Date(t,11,31);f(d,g)&&n.add(t)}return n},[o,s,f]);return e.jsxs("div",{className:y.default(r.default["tedi-calendar__header"],{[r.default["tedi-calendar__no-navigation"]]:!u}),children:[u&&e.jsx(c.Button,{type:"button",onClick:()=>S&&w(S),"aria-label":m("pickers.previousMonth"),icon:"arrow_back",visualType:"neutral",children:m("pickers.previousMonth")}),u?h?e.jsxs(e.Fragment,{children:[e.jsxs(c.Button,{noStyle:!0,className:r.default["tedi-calendar__month-year-selector"],onClick:N,"data-testid":"tedi-calendar-month-trigger",children:[i.toLocaleString(_,{month:"long"}),e.jsx(p.Icon,{name:"arrow_drop_down",color:"tertiary",className:r.default["tedi-calendar__month-year-caret"]})]}),e.jsxs(c.Button,{noStyle:!0,className:r.default["tedi-calendar__month-year-selector"],onClick:C,"data-testid":"tedi-calendar-year-trigger",children:[i.getFullYear(),e.jsx(p.Icon,{name:"arrow_drop_down",color:"tertiary",className:r.default["tedi-calendar__month-year-caret"]})]})]}):e.jsxs(e.Fragment,{children:[e.jsxs(l.Dropdown,{className:y.default(r.default["tedi-calendar__month-year-dropdown"],{[r.default["tedi-calendar__picker-grid-dropdown"]]:h}),width:"auto",defaultActiveIndex:x,children:[e.jsx(l.Dropdown.Trigger,{children:e.jsxs(c.Button,{noStyle:!0,className:r.default["tedi-calendar__month-year-selector"],children:[i.toLocaleString(_,{month:"long"}),e.jsx(p.Icon,{name:"arrow_drop_down",color:"tertiary",className:r.default["tedi-calendar__month-year-caret"],"data-testid":"tedi-icon-arrow_drop_down"})]})}),e.jsx(l.Dropdown.Content,{children:T.map((n,t)=>e.jsx(l.Dropdown.Item,{index:t,active:x===t,disabled:I.has(t),onClick:()=>w(new Date(a,t)),children:n},n))})]}),e.jsxs(l.Dropdown,{className:y.default(r.default["tedi-calendar__month-year-dropdown"],{[r.default["tedi-calendar__picker-grid-dropdown"]]:h}),width:"auto",defaultActiveIndex:s.indexOf(a)===-1?void 0:s.indexOf(a),children:[e.jsx(l.Dropdown.Trigger,{children:e.jsxs(c.Button,{noStyle:!0,className:r.default["tedi-calendar__month-year-selector"],children:[i.getFullYear(),e.jsx(p.Icon,{name:"arrow_drop_down",color:"tertiary",className:r.default["tedi-calendar__month-year-caret"],"data-testid":"tedi-icon-arrow_drop_down"})]})}),e.jsx(l.Dropdown.Content,{children:s.map((n,t)=>e.jsx(l.Dropdown.Item,{index:t,active:a===n,disabled:Y.has(n),onClick:()=>w(new Date(n,x)),children:n},n))})]})]}):e.jsxs("div",{className:r.default["tedi-calendar__month-year-label"],children:[e.jsx(k.Text,{children:i.toLocaleString(_,{month:"long"})}),e.jsx(k.Text,{children:a})]}),u&&e.jsx(c.Button,{type:"button",onClick:()=>D&&w(D),visualType:"neutral","aria-label":m("pickers.nextMonth"),icon:"arrow_forward",children:m("pickers.nextMonth")})]})}exports.CalendarHeader=H;