@tedi-design-system/react 14.0.0-rc.1

package/src/community/components/form/text-editor/components/style-button.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),d=require("../../../../../../external/classnames/index.cjs.js"),b=require("../../../icon/icon.cjs.js"),t=require("../text-editor.module.scss.cjs.js"),n=o=>{const{active:l,style:u,label:s,onToggle:r}=o,c=d.default(t.default["style-button"],{[t.default["style-button--active"]]:l}),i=a=>{a.preventDefault(),r(u)};return e.jsx("button",{type:"button",className:c,onClick:i,children:e.jsx(b.Icon,{name:s,size:24})})};exports.StyleButton=n;exports.default=n;

package/src/community/components/form/text-editor/components/style-button.d.ts

@@ -0,0 +1,9 @@
+import { DraftBlockType, DraftInlineStyleType } from 'draft-js';
+export interface StyleButtonProps {
+    label: string;
+    style: DraftInlineStyleType | DraftBlockType;
+    onToggle: (style: DraftInlineStyleType | DraftBlockType) => void;
+    active?: boolean;
+}
+export declare const StyleButton: (props: StyleButtonProps) => JSX.Element;
+export default StyleButton;

package/src/community/components/form/text-editor/components/style-button.es.js

@@ -0,0 +1,14 @@
+import { jsx as t } from "react/jsx-runtime";
+import m from "../../../../../../external/classnames/index.es.js";
+import { Icon as i } from "../../../icon/icon.es.js";
+import o from "../text-editor.module.scss.es.js";
+const b = (e) => {
+  const { active: n, style: l, label: s, onToggle: r } = e, a = m(o["style-button"], { [o["style-button--active"]]: n });
+  return /* @__PURE__ */ t("button", { type: "button", className: a, onClick: (c) => {
+    c.preventDefault(), r(l);
+  }, children: /* @__PURE__ */ t(i, { name: s, size: 24 }) });
+};
+export {
+  b as StyleButton,
+  b as default
+};

package/src/community/components/form/text-editor/text-editor.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),O=require("../../../../../external/classnames/index.cjs.js"),n=require("../../../../../external/draft-js/lib/Draft.cjs.js"),C=require("../../../../../external/draftjs-md-converter/dist/index.esm.cjs.js"),s=require("react"),U=require("../../../../tedi/components/form/feedback-text/feedback-text.cjs.js"),V=require("../../../../tedi/components/form/form-label/form-label.cjs.js"),$=require("./components/block-style-controls.cjs.js"),A=require("./components/inline-style-controls.cjs.js"),l=require("./text-editor.module.scss.cjs.js");;/* empty css                                                   */const P=require("../../../../tedi/helpers/hooks/use-is-mounted.cjs.js"),g=v=>{const{inlineStyleControls:T=["BOLD","ITALIC"],blockStyleControls:b=["unordered-list-item"],label:j,id:u,required:q,helper:e,className:D,hideLabel:M,placeholder:h,defaultValue:f,onChange:i,onBlur:k,onFocus:I,invalid:d,..._}=v,x=e?(e==null?void 0:e.id)??`${u}-helper`:void 0,B=P.useIsMounted(),E=s.useMemo(()=>{const t=C.mdToDraftjs(f||""),c=n.Draft.convertFromRaw(t);return n.Draft.EditorState.createWithContent(c)},[f]),[r,a]=s.useState(E),[R,m]=s.useState(!1),S=s.useMemo(()=>{const t=r.getCurrentContent();return C.draftjsToMd(n.Draft.convertToRaw(t))},[r]),F=s.useMemo(()=>d||(e==null?void 0:e.type)==="error",[d,e]),w=s.useMemo(()=>!d&&(e==null?void 0:e.type)==="valid",[d,e]);s.useEffect(()=>{i==null||i(S)},[S,i]);const L=(t,c)=>{const y=n.Draft.RichUtils.handleKeyCommand(c,t);return y?(a(y),"handled"):"not-handled"},N=t=>{a(n.Draft.RichUtils.toggleInlineStyle(r,t))},p=t=>{a(n.Draft.RichUtils.toggleBlockType(r,t))},K=O.default(l.default["text-editor"],D,{[l.default["text-editor--invalid"]]:F},{[l.default["text-editor--valid"]]:w},{[l.default["text-editor--focused"]]:R});return o.jsxs("div",{"data-name":"text-editor",..._,className:K,children:[o.jsx(V.FormLabel,{id:u,label:j,required:q,hideLabel:M}),o.jsxs("div",{className:l.default["text-editor__inner"],onClick:()=>m(!0),onBlur:()=>m(!1),children:[o.jsxs("div",{className:l.default["text-editor__controls"],children:[o.jsx(A.InlineStyleControls,{inlineStyleControls:T,editorState:r,onToggle:N}),o.jsx($.BlockStyleControls,{blockStyleControls:b,editorState:r,onToggle:p})]}),o.jsx("div",{className:l.default["text-editor__content"],children:B&&o.jsx(n.Draft.Editor,{ariaDescribedBy:x,placeholder:h,editorState:r,onChange:a,handleKeyCommand:L,preserveSelectionOnBlur:!0,editorKey:"editor",onBlur:k,onFocus:I})})]}),e&&o.jsx(U.FeedbackText,{...e,id:x})]})};exports.TextEditor=g;exports.default=g;

package/src/community/components/form/text-editor/text-editor.d.ts

@@ -0,0 +1,55 @@
+import { DraftBlockType, DraftInlineStyleType } from 'draft-js';
+import { FeedbackTextProps } from '../../../../tedi/components/form/feedback-text/feedback-text';
+import { FormLabelProps } from '../../../../tedi/components/form/form-label/form-label';
+import 'draft-js/dist/Draft.css';
+export interface TextEditorProps extends FormLabelProps {
+    /**
+     * ID attribute.
+     */
+    id: string;
+    name?: string;
+    /**
+     * Default value of input.
+     */
+    defaultValue?: string;
+    /**
+     * onChange callback handler.
+     */
+    onChange?: (value: string) => void;
+    /**
+     * Input field placeholder.
+     */
+    placeholder?: string;
+    /**
+     * Additional classes.
+     */
+    className?: string;
+    /**
+     * Select which inlineStyleControls should be visible.
+     * @default ['BOLD', 'ITALIC']
+     */
+    inlineStyleControls?: DraftInlineStyleType[];
+    /**
+     * Select which inlineStyleControls should be visible.
+     * @default unordered-list-item
+     */
+    blockStyleControls?: DraftBlockType[];
+    /**
+     * Textfield helper.
+     */
+    helper?: FeedbackTextProps;
+    /**
+     * onFocus callback handler.
+     */
+    onFocus?: () => void;
+    /**
+     * onBlur callback handler.
+     */
+    onBlur?: () => void;
+    /**
+     * If text-editor is invalid.
+     */
+    invalid?: boolean;
+}
+export declare const TextEditor: (props: TextEditorProps) => JSX.Element;
+export default TextEditor;

package/src/community/components/form/text-editor/text-editor.es.js

@@ -0,0 +1,104 @@
+import { jsxs as m, jsx as i } from "react/jsx-runtime";
+import U from "../../../../../external/classnames/index.es.js";
+import { D as r } from "../../../../../external/draft-js/lib/Draft.es.js";
+import { mdToDraftjs as V, draftjsToMd as O } from "../../../../../external/draftjs-md-converter/dist/index.esm.es.js";
+import n from "react";
+import { FeedbackText as q } from "../../../../tedi/components/form/feedback-text/feedback-text.es.js";
+import { FormLabel as A } from "../../../../tedi/components/form/form-label/form-label.es.js";
+import { BlockStyleControls as W } from "./components/block-style-controls.es.js";
+import { InlineStyleControls as $ } from "./components/inline-style-controls.es.js";
+import s from "./text-editor.module.scss.es.js";
+/* empty css                                                 */
+import { useIsMounted as z } from "../../../../tedi/helpers/hooks/use-is-mounted.es.js";
+const nt = (S) => {
+  const {
+    inlineStyleControls: v = ["BOLD", "ITALIC"],
+    blockStyleControls: C = ["unordered-list-item"],
+    label: h,
+    id: u,
+    required: T,
+    helper: t,
+    className: B,
+    hideLabel: I,
+    placeholder: M,
+    defaultValue: f,
+    onChange: l,
+    onBlur: _,
+    onFocus: k,
+    invalid: a,
+    ...D
+  } = S, p = t ? (t == null ? void 0 : t.id) ?? `${u}-helper` : void 0, E = z(), R = n.useMemo(() => {
+    const e = V(f || ""), c = r.convertFromRaw(e);
+    return r.EditorState.createWithContent(c);
+  }, [f]), [o, d] = n.useState(R), [b, g] = n.useState(!1), y = n.useMemo(() => {
+    const e = o.getCurrentContent();
+    return O(r.convertToRaw(e));
+  }, [o]), F = n.useMemo(() => a || (t == null ? void 0 : t.type) === "error", [a, t]), N = n.useMemo(() => !a && (t == null ? void 0 : t.type) === "valid", [a, t]);
+  n.useEffect(() => {
+    l == null || l(y);
+  }, [y, l]);
+  const w = (e, c) => {
+    const x = r.RichUtils.handleKeyCommand(c, e);
+    return x ? (d(x), "handled") : "not-handled";
+  }, j = (e) => {
+    d(r.RichUtils.toggleInlineStyle(o, e));
+  }, L = (e) => {
+    d(r.RichUtils.toggleBlockType(o, e));
+  }, K = U(
+    s["text-editor"],
+    B,
+    { [s["text-editor--invalid"]]: F },
+    { [s["text-editor--valid"]]: N },
+    { [s["text-editor--focused"]]: b }
+  );
+  return /* @__PURE__ */ m("div", { "data-name": "text-editor", ...D, className: K, children: [
+    /* @__PURE__ */ i(A, { id: u, label: h, required: T, hideLabel: I }),
+    /* @__PURE__ */ m(
+      "div",
+      {
+        className: s["text-editor__inner"],
+        onClick: () => g(!0),
+        onBlur: () => g(!1),
+        children: [
+          /* @__PURE__ */ m("div", { className: s["text-editor__controls"], children: [
+            /* @__PURE__ */ i(
+              $,
+              {
+                inlineStyleControls: v,
+                editorState: o,
+                onToggle: j
+              }
+            ),
+            /* @__PURE__ */ i(
+              W,
+              {
+                blockStyleControls: C,
+                editorState: o,
+                onToggle: L
+              }
+            )
+          ] }),
+          /* @__PURE__ */ i("div", { className: s["text-editor__content"], children: E && /* @__PURE__ */ i(
+            r.Editor,
+            {
+              ariaDescribedBy: p,
+              placeholder: M,
+              editorState: o,
+              onChange: d,
+              handleKeyCommand: w,
+              preserveSelectionOnBlur: !0,
+              editorKey: "editor",
+              onBlur: _,
+              onFocus: k
+            }
+          ) })
+        ]
+      }
+    ),
+    t && /* @__PURE__ */ i(q, { ...t, id: p })
+  ] });
+};
+export {
+  nt as TextEditor,
+  nt as default
+};

package/src/community/components/form/text-editor/text-editor.module.scss.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"text-editor__inner":"text-editor__inner-553376dc","text-editor--invalid":"text-editor--invalid-d83415ec","text-editor--focused":"text-editor--focused-56e4081b","text-editor__controls":"text-editor__controls-f5bc145b","text-editor__control-block":"text-editor__control-block-1a0ea451","text-editor__content":"text-editor__content-a7acd929","style-button":"style-button-5cc3d6ca","style-button--active":"style-button--active-e3d1e29f"};exports.default=t;

package/src/community/components/form/text-editor/text-editor.module.scss.es.js

@@ -0,0 +1,13 @@
+const t = {
+  "text-editor__inner": "text-editor__inner-553376dc",
+  "text-editor--invalid": "text-editor--invalid-d83415ec",
+  "text-editor--focused": "text-editor--focused-56e4081b",
+  "text-editor__controls": "text-editor__controls-f5bc145b",
+  "text-editor__control-block": "text-editor__control-block-1a0ea451",
+  "text-editor__content": "text-editor__content-a7acd929",
+  "style-button": "style-button-5cc3d6ca",
+  "style-button--active": "style-button--active-e3d1e29f"
+};
+export {
+  t as default
+};

package/src/community/components/form/toggle/toggle.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),k=require("../../../../../external/classnames/index.cjs.js"),i=require("react"),$=require("../../../../tedi/components/loaders/spinner/spinner.cjs.js"),j=require("../../button/button.cjs.js"),w=require("../../icon/icon.cjs.js"),e=require("./toggle.module.scss.cjs.js"),c=i.forwardRef((r,C)=>{const{ariaLabel:N,className:q,checked:n,defaultChecked:y,onChange:a,size:u=r.icon?"large":"medium",color:v="default",type:g,icon:S,disabled:f=!1,isLoading:d=!1,extraContent:m,label:_,...l}=r,[h,T]=i.useState(y||!1),o=i.useMemo(()=>a&&typeof n<"u"?n:h,[a,h,n]),M=k.default(e.default.toggle,e.default[`toggle--${u}`],e.default[`toggle--${v}`],{[e.default["toggle--active"]]:o,[e.default["toggle--disabled"]]:f,[e.default[`toggle--${g}`]]:g},q),b=()=>{if(d)return;const s=!o;typeof n>"u"&&T(s),a==null||a(s)},p={noStyle:!0,type:"button","aria-label":N,"aria-pressed":o,disabled:f,"aria-disabled":d,...l,onClick:b};return t.jsxs("div",{className:e.default["toggle-wrapper"],children:[t.jsx(j.Button,{...p,onClick:s=>{var x;(x=l==null?void 0:l.onClick)==null||x.call(l,s),b()},ref:C,"data-name":"toggle",className:M,children:t.jsx("span",{className:e.default.toggle__dot,children:d?t.jsx($.Spinner,{size:u==="large"?16:10,className:k.default(e.default.toggle__icon,e.default.toggle__spinner)}):S?t.jsx(w.Icon,{className:e.default.toggle__icon,name:o?"lock_open_right":"lock",size:16}):null})}),_&&t.jsx(j.Button,{...p,className:e.default.toggle__label,"aria-hidden":!0,tabIndex:-1,children:_}),m&&t.jsx("div",{className:e.default["toggle__extra-content"],children:m})]})});c.displayName="Toggle";exports.Toggle=c;exports.default=c;

package/src/community/components/form/toggle/toggle.d.ts

@@ -0,0 +1,66 @@
+import React from 'react';
+export interface ToggleProps {
+    /**
+     * Aria Label
+     */
+    ariaLabel: string;
+    /**
+     * Label text rendered next to toggle
+     * ariaLabel should still be provided, because it is used for the screen readers.
+     * Label is used for the visual label and hidden for screen-readers
+     * Click on the label triggers the toggle
+     */
+    label?: React.ReactNode;
+    /**
+     * Possibility to add extra content after label. ExtraContent is not clickable like label
+     */
+    extraContent?: React.ReactNode;
+    /**
+     * Wrapper Classname
+     */
+    className?: string;
+    /**
+     * If the check is controlled from outside the components, use with onChange
+     */
+    checked?: boolean;
+    /**
+     * If the check is checked by default.
+     * Ignored if checked is set
+     */
+    defaultChecked?: boolean;
+    /**
+     *  On change handler, value is the new value of the toggle
+     */
+    onChange?(value: boolean): void;
+    /**
+     * Size of the toggle
+     * @default medium
+     */
+    size?: 'medium' | 'large';
+    /**
+     * Color of the toggle
+     * @default default
+     */
+    color?: 'default' | 'alternative';
+    /**
+     * Type of the toggle
+     */
+    type?: 'ghost';
+    /**
+     * Should the toggle show lock icon.
+     * Can be only used as large toggle
+     */
+    icon?: boolean;
+    /**
+     * If the toggle is disabled
+     */
+    disabled?: boolean;
+    /**
+     * If toggle is in loading state and should show spinner.
+     * When isLoading is true, toggle does not trigger onChange event.
+     * @default false
+     */
+    isLoading?: boolean;
+}
+export declare const Toggle: React.ForwardRefExoticComponent<ToggleProps & React.RefAttributes<HTMLButtonElement>>;
+export default Toggle;

package/src/community/components/form/toggle/toggle.es.js

@@ -0,0 +1,78 @@
+import { jsxs as T, jsx as t } from "react/jsx-runtime";
+import k from "../../../../../external/classnames/index.es.js";
+import b, { forwardRef as $ } from "react";
+import { Spinner as j } from "../../../../tedi/components/loaders/spinner/spinner.es.js";
+import { Button as N } from "../../button/button.es.js";
+import { Icon as B } from "../../icon/icon.es.js";
+import e from "./toggle.module.scss.es.js";
+const L = $((r, C) => {
+  const {
+    ariaLabel: y,
+    className: x,
+    checked: l,
+    defaultChecked: v,
+    onChange: a,
+    size: c = r.icon ? "large" : "medium",
+    color: w = "default",
+    type: g,
+    icon: z,
+    disabled: d = !1,
+    isLoading: i = !1,
+    extraContent: m,
+    label: f,
+    ...o
+  } = r, [p, I] = b.useState(v || !1), n = b.useMemo(() => a && typeof l < "u" ? l : p, [a, p, l]), S = k(
+    e.toggle,
+    e[`toggle--${c}`],
+    e[`toggle--${w}`],
+    {
+      [e["toggle--active"]]: n,
+      [e["toggle--disabled"]]: d,
+      [e[`toggle--${g}`]]: g
+    },
+    x
+  ), u = () => {
+    if (i)
+      return;
+    const s = !n;
+    typeof l > "u" && I(s), a == null || a(s);
+  }, _ = {
+    noStyle: !0,
+    type: "button",
+    "aria-label": y,
+    "aria-pressed": n,
+    disabled: d,
+    "aria-disabled": i,
+    ...o,
+    onClick: u
+  };
+  return /* @__PURE__ */ T("div", { className: e["toggle-wrapper"], children: [
+    /* @__PURE__ */ t(
+      N,
+      {
+        ..._,
+        onClick: (s) => {
+          var h;
+          (h = o == null ? void 0 : o.onClick) == null || h.call(o, s), u();
+        },
+        ref: C,
+        "data-name": "toggle",
+        className: S,
+        children: /* @__PURE__ */ t("span", { className: e.toggle__dot, children: i ? /* @__PURE__ */ t(
+          j,
+          {
+            size: c === "large" ? 16 : 10,
+            className: k(e.toggle__icon, e.toggle__spinner)
+          }
+        ) : z ? /* @__PURE__ */ t(B, { className: e.toggle__icon, name: n ? "lock_open_right" : "lock", size: 16 }) : null })
+      }
+    ),
+    f && /* @__PURE__ */ t(N, { ..._, className: e.toggle__label, "aria-hidden": !0, tabIndex: -1, children: f }),
+    m && /* @__PURE__ */ t("div", { className: e["toggle__extra-content"], children: m })
+  ] });
+});
+L.displayName = "Toggle";
+export {
+  L as Toggle,
+  L as default
+};

package/src/community/components/form/toggle/toggle.module.scss.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="toggle-b7a0206b",g="toggle__dot-6c85a2a2",t="toggle__icon-4a0f4e6c",o="toggle__spinner-d4f2ba79",l="toggle__label-cdb29c78",_={"toggle-wrapper":"toggle-wrapper-35cb3798",toggle:e,"toggle--disabled":"toggle--disabled-086a40c0","toggle--active":"toggle--active-f8d436cc","toggle--ghost":"toggle--ghost-b8136f68",toggle__dot:g,toggle__icon:t,toggle__spinner:o,"toggle--medium":"toggle--medium-ce9bfb2e","toggle--large":"toggle--large-acae3dd1","toggle--alternative":"toggle--alternative-07ba3fde",toggle__label:l,"toggle__extra-content":"toggle__extra-content-4f8dda6c"};exports.default=_;exports.toggle=e;exports.toggle__dot=g;exports.toggle__icon=t;exports.toggle__label=l;exports.toggle__spinner=o;

package/src/community/components/form/toggle/toggle.module.scss.es.js

@@ -0,0 +1,23 @@
+const g = "toggle-b7a0206b", e = "toggle__dot-6c85a2a2", t = "toggle__icon-4a0f4e6c", o = "toggle__spinner-d4f2ba79", l = "toggle__label-cdb29c78", a = {
+  "toggle-wrapper": "toggle-wrapper-35cb3798",
+  toggle: g,
+  "toggle--disabled": "toggle--disabled-086a40c0",
+  "toggle--active": "toggle--active-f8d436cc",
+  "toggle--ghost": "toggle--ghost-b8136f68",
+  toggle__dot: e,
+  toggle__icon: t,
+  toggle__spinner: o,
+  "toggle--medium": "toggle--medium-ce9bfb2e",
+  "toggle--large": "toggle--large-acae3dd1",
+  "toggle--alternative": "toggle--alternative-07ba3fde",
+  toggle__label: l,
+  "toggle__extra-content": "toggle__extra-content-4f8dda6c"
+};
+export {
+  a as default,
+  g as toggle,
+  e as toggle__dot,
+  t as toggle__icon,
+  l as toggle__label,
+  o as toggle__spinner
+};

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y=require("react/jsx-runtime"),p=require("../../../../external/classnames/index.cjs.js"),q=require("react"),l=require("./icon.module.scss.cjs.js"),e=q.forwardRef((o,r)=>{const{className:s,name:c,filled:d=!1,label:a,type:i="outlined",size:n=24,display:u="block",color:t,...m}=o,f=p.default("notranslate","material-symbols",l.default.icon,l.default[`icon--${u}`],{[`material-symbols--${i}`]:i,[`text-${t}`]:t},s),b={...n?{"--icon-internal-variation-size":`${n/16}rem`}:{},...d?{"--icon-internal-variation-fill":1}:{}};return y.jsx("span",{"data-name":"icon",role:"img","aria-hidden":!a,...m,className:f,style:b,ref:r,"aria-label":a,children:c})});e.displayName="Icon";exports.Icon=e;exports.default=e;

package/src/community/components/icon/icon.d.ts

@@ -0,0 +1,49 @@
+import React from 'react';
+import { TextColor } from '../typography/text/text';
+export type IconSize = 12 | 14 | 16 | 18 | 24 | 36 | 48;
+export interface IconProps {
+    /**
+     * Name of material symbols icon.
+     * https://fonts.google.com/icons?icon.set=Material+Symbols
+     */
+    name: string;
+    /**
+     * Additional classes.
+     */
+    className?: string;
+    /**
+     * Type of icon.
+     * It is recommended to only use one type throughout your app.
+     * This ensures that only one icon font is downloaded.
+     * @default outlined
+     */
+    type?: 'outlined' | 'rounded' | 'sharp';
+    /**
+     * Render a filled variant of the icon.
+     * @default false
+     */
+    filled?: boolean;
+    /**
+     * Size of the icon.
+     * @default 24
+     */
+    size?: IconSize;
+    /**
+     * Which color Icon should be.
+     * Use 'positive', 'important' or 'warning' with caution, usually they should not be in application UI.
+     * @default default
+     */
+    color?: TextColor;
+    /**
+     * Type of display. block by default.
+     * @default block
+     */
+    display?: 'block' | 'inline';
+    /**
+     * Icons label for screen-readers.
+     * If omitted then the icon is hidden for screen-readers.
+     */
+    label?: string;
+}
+export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<HTMLDivElement>>;
+export default Icon;

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

@@ -0,0 +1,47 @@
+import { jsx as y } from "react/jsx-runtime";
+import b from "../../../../external/classnames/index.es.js";
+import { forwardRef as N } from "react";
+import l from "./icon.module.scss.es.js";
+const $ = N((n, r) => {
+  const {
+    className: s,
+    name: t,
+    filled: m = !1,
+    label: a,
+    type: o = "outlined",
+    size: i = 24,
+    display: c = "block",
+    color: e,
+    ...d
+  } = n, f = b(
+    "notranslate",
+    // Added to prevent Google Translate from translating the icon
+    "material-symbols",
+    l.icon,
+    l[`icon--${c}`],
+    { [`material-symbols--${o}`]: o, [`text-${e}`]: e },
+    s
+  ), p = {
+    ...i ? { "--icon-internal-variation-size": `${i / 16}rem` } : {},
+    ...m ? { "--icon-internal-variation-fill": 1 } : {}
+  };
+  return /* @__PURE__ */ y(
+    "span",
+    {
+      "data-name": "icon",
+      role: "img",
+      "aria-hidden": !a,
+      ...d,
+      className: f,
+      style: p,
+      ref: r,
+      "aria-label": a,
+      children: t
+    }
+  );
+});
+$.displayName = "Icon";
+export {
+  $ as Icon,
+  $ as default
+};

package/src/community/components/icon/icon.module.scss.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="icon-8081be27",o={icon:e,"icon--block":"icon--block-4aa6379d","icon--inline":"icon--inline-5d045b85"};exports.default=o;exports.icon=e;

package/src/community/components/icon/icon.module.scss.es.js

@@ -0,0 +1,9 @@
+const n = "icon-8081be27", o = {
+  icon: n,
+  "icon--block": "icon--block-4aa6379d",
+  "icon--inline": "icon--inline-5d045b85"
+};
+export {
+  o as default,
+  n as icon
+};

package/src/community/components/layout/breadcrumbs/breadcrumbs.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),q=require("../../../../../external/classnames/index.cjs.js"),L=require("../../../../tedi/components/misc/print/print.cjs.js"),h=require("../../../helpers/hooks/use-layout.cjs.js"),l=require("./breadcrumbs.module.scss.cjs.js"),j=require("./crumb/crumb.cjs.js"),x=require("../../../../tedi/providers/label-provider/use-labels.cjs.js"),i=n=>{const{getLabel:c}=x.useLabels(),{className:b,crumbs:u,linkAs:o,showMinimalCrumbs:r=["mobile","tablet"],...m}=n,d=h.useLayout(r===!0?["mobile","tablet","desktop"]:r||[]),a=!!r&&d,e=a?u.filter(t=>!t.isLast).slice(-1):u;return e!=null&&e.length?s.jsx(L.Print,{visibility:"hide",children:s.jsx("nav",{"data-name":"breadcrumbs","aria-label":c("breadcrumbs"),...m,className:q.default(b,l.default.breadcrumbs),children:s.jsx("ol",{className:l.default.breadcrumbs__list,children:e.map((t,f)=>s.jsx(j.default,{as:o,singleCrumb:a,...t},f))})})}):null};exports.Breadcrumbs=i;exports.default=i;

package/src/community/components/layout/breadcrumbs/breadcrumbs.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Layouts } from '../../../helpers/hooks/use-layout';
+import { AllowedHTMLTags } from '../../../helpers/polymorphic/types';
+import { IntentionalAny } from '../../../types';
+import { CrumbProps } from './crumb/crumb';
+type ConditionalTypes<C extends React.ElementType> = {
+    /**
+     * Render all anchors (except logoLink and skipLink) as this component<br />
+     * See [Anchor/CustomComponent](/?path=/docs/components-anchor--custom-component) for an example
+     */
+    linkAs: AllowedHTMLTags<C, 'a' | React.ComponentType<IntentionalAny>>;
+    /**
+     * Crumbs array
+     */
+    crumbs: CrumbProps<C>[];
+} | {
+    linkAs?: never;
+    crumbs: CrumbProps<IntentionalAny>[];
+};
+export type BreadcrumbsProps<C extends React.ElementType = 'a'> = ConditionalTypes<C> & {
+    /**
+     * Additional custom class.
+     */
+    className?: string;
+    /**
+     * Show only last interactive crumb.
+     * Can be defined as an array of layouts/breakpoints or boolean
+     * @default ['mobile', 'tablet']
+     */
+    showMinimalCrumbs?: boolean | Layouts;
+};
+export declare const Breadcrumbs: <C extends React.ElementType = "a">(props: BreadcrumbsProps<C>) => JSX.Element | null;
+export default Breadcrumbs;

package/src/community/components/layout/breadcrumbs/breadcrumbs.es.js

@@ -0,0 +1,26 @@
+import { jsx as s } from "react/jsx-runtime";
+import p from "../../../../../external/classnames/index.es.js";
+import { Print as f } from "../../../../tedi/components/misc/print/print.es.js";
+import { useLayout as h } from "../../../helpers/hooks/use-layout.es.js";
+import i from "./breadcrumbs.module.scss.es.js";
+import L from "./crumb/crumb.es.js";
+import { useLabels as y } from "../../../../tedi/providers/label-provider/use-labels.es.js";
+const j = (l) => {
+  const { getLabel: o } = y(), { className: b, crumbs: t, linkAs: n, showMinimalCrumbs: e = ["mobile", "tablet"], ...c } = l, u = h(
+    e === !0 ? ["mobile", "tablet", "desktop"] : e || []
+  ), a = !!e && u, r = a ? t.filter((m) => !m.isLast).slice(-1) : t;
+  return r != null && r.length ? /* @__PURE__ */ s(f, { visibility: "hide", children: /* @__PURE__ */ s(
+    "nav",
+    {
+      "data-name": "breadcrumbs",
+      "aria-label": o("breadcrumbs"),
+      ...c,
+      className: p(b, i.breadcrumbs),
+      children: /* @__PURE__ */ s("ol", { className: i.breadcrumbs__list, children: r.map((m, d) => /* @__PURE__ */ s(L, { as: n, singleCrumb: a, ...m }, d)) })
+    }
+  ) }) : null;
+};
+export {
+  j as Breadcrumbs,
+  j as default
+};

package/src/community/components/layout/breadcrumbs/breadcrumbs.module.scss.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r="breadcrumbs__list-3f0a0544",e="breadcrumbs__separator-75fe8d97",s="breadcrumbs__item-ac7c90e5",a={breadcrumbs__list:r,breadcrumbs__separator:e,breadcrumbs__item:s};exports.breadcrumbs__item=s;exports.breadcrumbs__list=r;exports.breadcrumbs__separator=e;exports.default=a;

package/src/community/components/layout/breadcrumbs/breadcrumbs.module.scss.es.js

@@ -0,0 +1,11 @@
+const r = "breadcrumbs__list-3f0a0544", s = "breadcrumbs__separator-75fe8d97", e = "breadcrumbs__item-ac7c90e5", a = {
+  breadcrumbs__list: r,
+  breadcrumbs__separator: s,
+  breadcrumbs__item: e
+};
+export {
+  e as breadcrumbs__item,
+  r as breadcrumbs__list,
+  s as breadcrumbs__separator,
+  a as default
+};

package/src/community/components/layout/breadcrumbs/crumb/crumb.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),a=require("../../../../../../external/classnames/index.cjs.js"),c=require("../../../../../tedi/components/misc/print/print.cjs.js"),l=require("../../../anchor/anchor.cjs.js"),d=require("../../../icon/icon.cjs.js"),m=require("../../../typography/text/text.cjs.js"),i=require("../breadcrumbs.module.scss.cjs.js"),b=o=>{const{isLast:r=!1,children:t,singleCrumb:s,...n}=o,u=a.default(i.default.breadcrumbs__item);return e.jsxs("li",{"data-name":"crumb",className:u,children:[e.jsx(c.Print,{visibility:"show",children:r?e.jsx(m.Text,{color:"muted",children:t}):e.jsx(l.Anchor,{iconLeft:s?"keyboard_arrow_left":void 0,...n,children:t})}),!s&&!r?e.jsx(d.Icon,{className:i.default.breadcrumbs__separator,size:16,name:"keyboard_arrow_right"}):null]})};exports.default=b;

package/src/community/components/layout/breadcrumbs/crumb/crumb.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { AnchorProps } from '../../../anchor/anchor';
+export type CrumbProps<C extends React.ElementType = 'a'> = {
+    /**
+     * If crumb is last/current page;
+     * @default false
+     */
+    isLast?: boolean;
+} & AnchorProps<C>;
+declare const Crumb: <C extends React.ElementType = "a">(props: CrumbProps<C> & {
+    singleCrumb?: boolean;
+}) => JSX.Element;
+export default Crumb;

package/src/community/components/layout/breadcrumbs/crumb/crumb.es.js

@@ -0,0 +1,22 @@
+import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import l from "../../../../../../external/classnames/index.es.js";
+import { Print as n } from "../../../../../tedi/components/misc/print/print.es.js";
+import { Anchor as d } from "../../../anchor/anchor.es.js";
+import { Icon as f } from "../../../icon/icon.es.js";
+import { Text as b } from "../../../typography/text/text.es.js";
+import m from "../breadcrumbs.module.scss.es.js";
+const N = (t) => {
+  const { isLast: o = !1, children: s, singleCrumb: e, ...i } = t, a = l(m.breadcrumbs__item);
+  return /* @__PURE__ */ c("li", { "data-name": "crumb", className: a, children: [
+    /* @__PURE__ */ r(n, { visibility: "show", children: o ? /* @__PURE__ */ r(b, { color: "muted", children: s }) : (
+      // TODO: Remove ts-ignore
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      /* @__PURE__ */ r(d, { iconLeft: e ? "keyboard_arrow_left" : void 0, ...i, children: s })
+    ) }),
+    !e && !o ? /* @__PURE__ */ r(f, { className: m.breadcrumbs__separator, size: 16, name: "keyboard_arrow_right" }) : null
+  ] });
+};
+export {
+  N as default
+};

package/src/community/components/layout/footer/footer.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),c=require("../../../../../external/classnames/index.cjs.js"),g=require("../../../../tedi/components/misc/print/print.cjs.js"),_=require("../../../../tedi/components/misc/stretch-content/stretch-content.cjs.js"),v=require("../../icon/icon.cjs.js"),a=require("../../typography/text/text.cjs.js"),o=require("./footer.module.scss.cjs.js"),f=require("../../../../tedi/components/layout/vertical-spacing/vertical-spacing.cjs.js"),p=require("../../../../tedi/providers/label-provider/use-labels.cjs.js"),q=require("../../../../tedi/components/layout/grid/row.cjs.js"),m=require("../../../../tedi/components/layout/grid/col.cjs.js"),x=d=>{const{logo:r,categories:i,className:l,bottomElement:n,...t}=d,{getLabel:s}=p.useLabels(),u=c.default(o.default.footer,l);return e.jsx(g.Print,{visibility:"hide",children:e.jsxs("footer",{"data-name":"footer",...t,className:u,children:[e.jsx(a.Text,{className:"visually-hidden",element:"h2",children:s("footer.title")}),e.jsxs("div",{className:o.default.footer__inner,children:[i.map((h,j)=>e.jsx(_.StretchContent,{direction:"vertical",children:e.jsx(b,{...h})},j)),r&&e.jsx("img",{className:o.default.footer__logo,src:r.src,alt:r.alt,style:r.style})]}),n&&e.jsx(a.Text,{color:"inverted",element:"div",className:o.default.footer__bottom,children:n})]})})},b=d=>{const{heading:r,icon:i,elements:l}=d,n=t=>{const s={size:16},u=typeof t=="string"?{...s,name:t}:{...s,...t};return e.jsx(v.Icon,{...u})};return e.jsxs(q.Row,{children:[i&&e.jsx(m.Col,{width:"auto",className:c.default("text-inverted",o.default["footer__category-icon"]),children:n(i)}),e.jsx(m.Col,{width:"auto",children:e.jsxs(f.VerticalSpacing,{className:c.default("text-small",o.default.footer__category),size:.5,children:[e.jsx(a.Text,{color:"inverted",modifiers:["bold","normal"],element:"h3",children:r}),e.jsx(f.VerticalSpacing,{element:"ul",size:.5,className:c.default(o.default["footer__category-list"]),children:l==null?void 0:l.map((t,s)=>e.jsx("li",{children:e.jsx(a.Text,{color:"inverted",element:"span",modifiers:"break-all",children:t})},s))})]})})]})};exports.Footer=x;exports.default=x;