@tedi-design-system/react 18.1.0-rc.11 → 18.1.0-rc.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_virtual/index.cjs10.js +1 -1
- package/_virtual/index.cjs11.js +1 -1
- package/_virtual/index.cjs12.js +1 -1
- package/_virtual/index.cjs13.js +1 -1
- package/_virtual/index.cjs5.js +1 -1
- package/_virtual/index.cjs6.js +1 -1
- package/_virtual/index.cjs7.js +1 -1
- package/_virtual/index.cjs8.js +1 -1
- package/_virtual/index.cjs9.js +1 -1
- package/_virtual/index.es10.js +1 -1
- package/_virtual/index.es11.js +1 -1
- package/_virtual/index.es12.js +1 -1
- package/_virtual/index.es13.js +4 -2
- package/_virtual/index.es14.js +2 -2
- package/_virtual/index.es5.js +2 -4
- package/_virtual/index.es6.js +1 -1
- package/_virtual/index.es7.js +1 -1
- package/_virtual/index.es8.js +1 -1
- package/_virtual/index.es9.js +1 -1
- package/bundle-stats.html +1 -1
- package/external/@mui/system/colorManipulator.cjs.js +1 -1
- package/external/@mui/system/colorManipulator.es.js +2 -2
- package/external/@mui/system/createStyled.cjs.js +1 -1
- package/external/@mui/system/createStyled.es.js +6 -6
- package/external/@mui/system/useThemeWithoutDefault.cjs.js +1 -1
- package/external/@mui/system/useThemeWithoutDefault.es.js +1 -1
- package/external/hoist-non-react-statics/external/react-is/cjs/react-is.development.cjs.js +1 -1
- package/external/hoist-non-react-statics/external/react-is/cjs/react-is.development.es.js +1 -1
- package/external/hoist-non-react-statics/external/react-is/cjs/react-is.production.min.cjs.js +1 -1
- package/external/hoist-non-react-statics/external/react-is/cjs/react-is.production.min.es.js +1 -1
- package/external/hoist-non-react-statics/external/react-is/index.cjs.js +1 -1
- package/external/hoist-non-react-statics/external/react-is/index.es.js +1 -1
- package/external/prop-types/external/react-is/cjs/react-is.development.cjs.js +1 -1
- package/external/prop-types/external/react-is/cjs/react-is.development.es.js +1 -1
- package/external/prop-types/external/react-is/cjs/react-is.production.min.cjs.js +1 -1
- package/external/prop-types/external/react-is/cjs/react-is.production.min.es.js +1 -1
- package/external/prop-types/external/react-is/index.cjs.js +1 -1
- package/external/prop-types/external/react-is/index.es.js +1 -1
- package/external/react-is/index.cjs.js +1 -1
- package/external/react-is/index.es.js +1 -1
- package/external/toposort/index.cjs.js +1 -1
- package/external/toposort/index.es.js +1 -1
- package/index.css +1 -1
- package/package.json +1 -1
- package/src/tedi/components/buttons/collapse-button/collapse-button.cjs.js +1 -1
- package/src/tedi/components/buttons/collapse-button/collapse-button.es.js +2 -1
- package/src/tedi/components/content/table/table.cjs.js +1 -1
- package/src/tedi/components/content/table/table.es.js +296 -283
- package/src/tedi/components/layout/header/components/header-language/header-language.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-language/header-language.es.js +105 -0
- package/src/tedi/components/layout/header/components/header-language/header-language.module.scss.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-language/header-language.module.scss.es.js +12 -0
- package/src/tedi/components/layout/header/components/header-login/header-login.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-login/header-login.es.js +36 -0
- package/src/tedi/components/layout/header/components/header-login/header-login.module.scss.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-login/header-login.module.scss.es.js +8 -0
- package/src/tedi/components/layout/header/components/header-logout/header-logout.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-logout/header-logout.es.js +33 -0
- package/src/tedi/components/layout/header/components/header-logout/header-logout.module.scss.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-logout/header-logout.module.scss.es.js +7 -0
- package/src/tedi/components/layout/header/components/header-mobile-button/header-mobile-button.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-mobile-button/header-mobile-button.es.js +25 -0
- package/src/tedi/components/layout/header/components/header-mobile-button/header-mobile-button.module.scss.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-mobile-button/header-mobile-button.module.scss.es.js +10 -0
- package/src/tedi/components/layout/header/components/header-profile/header-profile.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-profile/header-profile.es.js +136 -0
- package/src/tedi/components/layout/header/components/header-profile/header-profile.module.scss.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-profile/header-profile.module.scss.es.js +14 -0
- package/src/tedi/components/layout/header/components/header-role/header-role-representatives.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-role/header-role-representatives.es.js +89 -0
- package/src/tedi/components/layout/header/components/header-role/header-role.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-role/header-role.es.js +162 -0
- package/src/tedi/components/layout/header/components/header-role/header-role.module.scss.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-role/header-role.module.scss.es.js +25 -0
- package/src/tedi/components/layout/header/components/header-search/header-search.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-search/header-search.es.js +60 -0
- package/src/tedi/components/layout/header/components/header-search/header-search.module.scss.cjs.js +1 -0
- package/src/tedi/components/layout/header/components/header-search/header-search.module.scss.es.js +9 -0
- package/src/tedi/components/layout/header/header.cjs.js +1 -0
- package/src/tedi/components/layout/header/header.es.js +63 -0
- package/src/tedi/components/layout/header/header.module.scss.cjs.js +1 -0
- package/src/tedi/components/layout/header/header.module.scss.es.js +13 -0
- package/src/tedi/index.d.ts +1 -0
- package/tedi.cjs.js +1 -1
- package/tedi.es.js +227 -209
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),o=require("../../../../../../../external/classnames/index.cjs.js"),p=require("react"),P=require("../../../../base/typography/text/text.cjs.js"),T=require("../../../../base/icon/icon.cjs.js"),b=require("../../../../buttons/button/button.cjs.js"),S=require("../../../../navigation/link/link.cjs.js"),u=require("../../../../overlays/popover/popover.cjs.js"),l=require("./header-language.module.scss.cjs.js"),C=require("../../../../../providers/label-provider/use-labels.cjs.js"),N=require("../../../../../helpers/hooks/use-breakpoint-props.cjs.js"),m=require("../../../../../helpers/hooks/use-breakpoint.cjs.js"),d=x=>{const{languages:r,currentLanguage:i,selectLabel:c,labelPosition:L="top"}=x,[n,t]=p.useState(!1),{getLabel:g,setLocale:k,locale:s}=C.useLabels(),{getCurrentBreakpointProps:_}=N.useBreakpointProps(),j=m.default(),v=m.isBreakpointBelow(j,"md"),{hideLabel:q}=_({hideLabel:!0,lg:{hideLabel:!1}}),f=p.useMemo(()=>{var e;if(s){const h=r.find(y=>y.locale===s);if(h)return h.label}return i||(((e=r[0])==null?void 0:e.label)??"")},[r,s,i]),B=e=>{if(e.onClick){e.onClick({onToggle:t});return}t(!1),e.locale&&k(e.locale)};return a.jsxs("div",{className:o.default(l.default["tedi-header-language"],l.default[`tedi-header-language--label-${L}`],{[l.default["tedi-header-language__mobile"]]:v}),children:[a.jsx(P.Text,{modifiers:"small",color:"secondary",className:o.default({"visually-hidden":q}),children:c??g("header.select-lang")}),a.jsxs(u.Popover,{placement:"bottom",open:n,onToggle:()=>t(e=>!e),withBorder:!0,children:[a.jsx(u.Popover.Trigger,{children:a.jsx(b.Button,{visualType:"link",underline:!1,"aria-label":`${c??g("header.select-lang")} ${f}`,"aria-expanded":n,children:a.jsxs("div",{className:l.default["tedi-header-language__selected"],children:[f,a.jsx(T.Icon,{name:"expand_more",size:18,className:o.default(l.default["tedi-header-language__icon"],{[l.default["tedi-header-language__icon--open"]]:n})})]})})}),a.jsx(u.Popover.Content,{width:"none",children:a.jsx("div",{className:l.default["tedi-header-language__list"],children:r.map(e=>e.href&&!e.onClick?a.jsx(S.Link,{visualType:"link","aria-current":e.isSelected,"aria-label":e["aria-label"],underline:!1,href:e.href,children:e.label},e.label):a.jsx(b.Button,{visualType:"link","aria-current":e.isSelected,"aria-label":e["aria-label"],underline:!1,onClick:()=>B(e),children:e.label},e.label))})})]})]})};d.displayName="HeaderLanguage";exports.HeaderLanguage=d;exports.default=d;
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import { jsxs as s, jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import d from "../../../../../../../external/classnames/index.es.js";
|
|
3
|
+
import { useState as T, useMemo as x } from "react";
|
|
4
|
+
import { Text as C } from "../../../../base/typography/text/text.es.js";
|
|
5
|
+
import { Icon as S } from "../../../../base/icon/icon.es.js";
|
|
6
|
+
import { Button as h } from "../../../../buttons/button/button.es.js";
|
|
7
|
+
import { Link as w } from "../../../../navigation/link/link.es.js";
|
|
8
|
+
import { Popover as c } from "../../../../overlays/popover/popover.es.js";
|
|
9
|
+
import l from "./header-language.module.scss.es.js";
|
|
10
|
+
import { useLabels as P } from "../../../../../providers/label-provider/use-labels.es.js";
|
|
11
|
+
import { useBreakpointProps as $ } from "../../../../../helpers/hooks/use-breakpoint-props.es.js";
|
|
12
|
+
import j, { isBreakpointBelow as H } from "../../../../../helpers/hooks/use-breakpoint.es.js";
|
|
13
|
+
const M = (g) => {
|
|
14
|
+
const { languages: r, currentLanguage: i, selectLabel: m, labelPosition: b = "top" } = g, [o, n] = T(!1), { getLabel: u, setLocale: L, locale: t } = P(), { getCurrentBreakpointProps: k } = $(), _ = j(), v = H(_, "md"), { hideLabel: y } = k({
|
|
15
|
+
hideLabel: !0,
|
|
16
|
+
lg: { hideLabel: !1 }
|
|
17
|
+
}), p = x(() => {
|
|
18
|
+
var e;
|
|
19
|
+
if (t) {
|
|
20
|
+
const f = r.find((N) => N.locale === t);
|
|
21
|
+
if (f) return f.label;
|
|
22
|
+
}
|
|
23
|
+
return i || (((e = r[0]) == null ? void 0 : e.label) ?? "");
|
|
24
|
+
}, [r, t, i]), B = (e) => {
|
|
25
|
+
if (e.onClick) {
|
|
26
|
+
e.onClick({ onToggle: n });
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
n(!1), e.locale && L(e.locale);
|
|
30
|
+
};
|
|
31
|
+
return /* @__PURE__ */ s(
|
|
32
|
+
"div",
|
|
33
|
+
{
|
|
34
|
+
className: d(l["tedi-header-language"], l[`tedi-header-language--label-${b}`], {
|
|
35
|
+
[l["tedi-header-language__mobile"]]: v
|
|
36
|
+
}),
|
|
37
|
+
children: [
|
|
38
|
+
/* @__PURE__ */ a(C, { modifiers: "small", color: "secondary", className: d({ "visually-hidden": y }), children: m ?? u("header.select-lang") }),
|
|
39
|
+
/* @__PURE__ */ s(
|
|
40
|
+
c,
|
|
41
|
+
{
|
|
42
|
+
placement: "bottom",
|
|
43
|
+
open: o,
|
|
44
|
+
onToggle: () => n((e) => !e),
|
|
45
|
+
withBorder: !0,
|
|
46
|
+
children: [
|
|
47
|
+
/* @__PURE__ */ a(c.Trigger, { children: /* @__PURE__ */ a(
|
|
48
|
+
h,
|
|
49
|
+
{
|
|
50
|
+
visualType: "link",
|
|
51
|
+
underline: !1,
|
|
52
|
+
"aria-label": `${m ?? u("header.select-lang")} ${p}`,
|
|
53
|
+
"aria-expanded": o,
|
|
54
|
+
children: /* @__PURE__ */ s("div", { className: l["tedi-header-language__selected"], children: [
|
|
55
|
+
p,
|
|
56
|
+
/* @__PURE__ */ a(
|
|
57
|
+
S,
|
|
58
|
+
{
|
|
59
|
+
name: "expand_more",
|
|
60
|
+
size: 18,
|
|
61
|
+
className: d(l["tedi-header-language__icon"], {
|
|
62
|
+
[l["tedi-header-language__icon--open"]]: o
|
|
63
|
+
})
|
|
64
|
+
}
|
|
65
|
+
)
|
|
66
|
+
] })
|
|
67
|
+
}
|
|
68
|
+
) }),
|
|
69
|
+
/* @__PURE__ */ a(c.Content, { width: "none", children: /* @__PURE__ */ a("div", { className: l["tedi-header-language__list"], children: r.map(
|
|
70
|
+
(e) => e.href && !e.onClick ? /* @__PURE__ */ a(
|
|
71
|
+
w,
|
|
72
|
+
{
|
|
73
|
+
visualType: "link",
|
|
74
|
+
"aria-current": e.isSelected,
|
|
75
|
+
"aria-label": e["aria-label"],
|
|
76
|
+
underline: !1,
|
|
77
|
+
href: e.href,
|
|
78
|
+
children: e.label
|
|
79
|
+
},
|
|
80
|
+
e.label
|
|
81
|
+
) : /* @__PURE__ */ a(
|
|
82
|
+
h,
|
|
83
|
+
{
|
|
84
|
+
visualType: "link",
|
|
85
|
+
"aria-current": e.isSelected,
|
|
86
|
+
"aria-label": e["aria-label"],
|
|
87
|
+
underline: !1,
|
|
88
|
+
onClick: () => B(e),
|
|
89
|
+
children: e.label
|
|
90
|
+
},
|
|
91
|
+
e.label
|
|
92
|
+
)
|
|
93
|
+
) }) })
|
|
94
|
+
]
|
|
95
|
+
}
|
|
96
|
+
)
|
|
97
|
+
]
|
|
98
|
+
}
|
|
99
|
+
);
|
|
100
|
+
};
|
|
101
|
+
M.displayName = "HeaderLanguage";
|
|
102
|
+
export {
|
|
103
|
+
M as HeaderLanguage,
|
|
104
|
+
M as default
|
|
105
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-header-language":"tedi-header-language-a837abad","tedi-header-language--label-left":"tedi-header-language--label-left-5e0282da","tedi-header-language__icon":"tedi-header-language__icon-0eda6084","tedi-header-language__icon--open":"tedi-header-language__icon--open-f3ab5bd4","tedi-header-language__mobile":"tedi-header-language__mobile-e3625dc5","tedi-header-language__selected":"tedi-header-language__selected-c08d15e5","tedi-header-language__list":"tedi-header-language__list-eea73437"};exports.default=e;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
const e = {
|
|
2
|
+
"tedi-header-language": "tedi-header-language-a837abad",
|
|
3
|
+
"tedi-header-language--label-left": "tedi-header-language--label-left-5e0282da",
|
|
4
|
+
"tedi-header-language__icon": "tedi-header-language__icon-0eda6084",
|
|
5
|
+
"tedi-header-language__icon--open": "tedi-header-language__icon--open-f3ab5bd4",
|
|
6
|
+
"tedi-header-language__mobile": "tedi-header-language__mobile-e3625dc5",
|
|
7
|
+
"tedi-header-language__selected": "tedi-header-language__selected-c08d15e5",
|
|
8
|
+
"tedi-header-language__list": "tedi-header-language__list-eea73437"
|
|
9
|
+
};
|
|
10
|
+
export {
|
|
11
|
+
e as default
|
|
12
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),d=require("../../../../base/typography/text/text.cjs.js"),f=require("../../../../buttons/button/button.cjs.js"),_=require("../../../../navigation/link/link.cjs.js"),x=require("../header-mobile-button/header-mobile-button.cjs.js"),t=require("./header-login.module.scss.cjs.js"),p=require("../../../../../helpers/hooks/use-breakpoint-props.cjs.js"),j=require("../../../../../providers/label-provider/use-labels.cjs.js"),u=require("../../../../../helpers/hooks/use-breakpoint.cjs.js"),s=i=>{const{onClick:n,href:r}=i,{getCurrentBreakpointProps:c}=p.useBreakpointProps(i.defaultServerBreakpoint),{size:m,label:b}=c(i),{getLabel:l}=j.useLabels(),h=u.default(),g=u.isBreakpointBelow(h,"md"),a=(m??(g?"small":"default"))==="small",o=b??l(a?"header.login.mobile":"header.login");return e.jsx(e.Fragment,{children:a?e.jsx(x.default,{onClick:n,href:r,icon:{name:"login",size:24,color:"inherit"},label:o}):r?e.jsx(_.Link,{onClick:n,href:r,underline:!1,visualType:"primary",className:t.default["tedi-header-login__button"],children:e.jsx("div",{className:t.default["tedi-header-login__button--inner"],children:e.jsx(d.Text,{modifiers:"normal",className:t.default["tedi-header-login__button--text"],children:o})})}):e.jsx(f.Button,{onClick:n,visualType:"primary",className:t.default["tedi-header-login__button"],children:e.jsx("div",{className:t.default["tedi-header-login__button--inner"],children:e.jsx(d.Text,{modifiers:"normal",className:t.default["tedi-header-login__button--text"],children:o})})})})};s.displayName="Header.Login";exports.HeaderLogin=s;exports.default=s;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { jsx as e, Fragment as h } from "react/jsx-runtime";
|
|
2
|
+
import { Text as s } from "../../../../base/typography/text/text.es.js";
|
|
3
|
+
import { Button as f } from "../../../../buttons/button/button.es.js";
|
|
4
|
+
import { Link as b } from "../../../../navigation/link/link.es.js";
|
|
5
|
+
import g from "../header-mobile-button/header-mobile-button.es.js";
|
|
6
|
+
import i from "./header-login.module.scss.es.js";
|
|
7
|
+
import { useBreakpointProps as _ } from "../../../../../helpers/hooks/use-breakpoint-props.es.js";
|
|
8
|
+
import { useLabels as k } from "../../../../../providers/label-provider/use-labels.es.js";
|
|
9
|
+
import B, { isBreakpointBelow as N } from "../../../../../helpers/hooks/use-breakpoint.es.js";
|
|
10
|
+
const v = (o) => {
|
|
11
|
+
const { onClick: r, href: t } = o, { getCurrentBreakpointProps: m } = _(o.defaultServerBreakpoint), { size: d, label: c } = m(o), { getLabel: l } = k(), p = B(), u = N(p, "md"), a = (d ?? (u ? "small" : "default")) === "small", n = c ?? l(a ? "header.login.mobile" : "header.login");
|
|
12
|
+
return /* @__PURE__ */ e(h, { children: a ? /* @__PURE__ */ e(
|
|
13
|
+
g,
|
|
14
|
+
{
|
|
15
|
+
onClick: r,
|
|
16
|
+
href: t,
|
|
17
|
+
icon: { name: "login", size: 24, color: "inherit" },
|
|
18
|
+
label: n
|
|
19
|
+
}
|
|
20
|
+
) : t ? /* @__PURE__ */ e(
|
|
21
|
+
b,
|
|
22
|
+
{
|
|
23
|
+
onClick: r,
|
|
24
|
+
href: t,
|
|
25
|
+
underline: !1,
|
|
26
|
+
visualType: "primary",
|
|
27
|
+
className: i["tedi-header-login__button"],
|
|
28
|
+
children: /* @__PURE__ */ e("div", { className: i["tedi-header-login__button--inner"], children: /* @__PURE__ */ e(s, { modifiers: "normal", className: i["tedi-header-login__button--text"], children: n }) })
|
|
29
|
+
}
|
|
30
|
+
) : /* @__PURE__ */ e(f, { onClick: r, visualType: "primary", className: i["tedi-header-login__button"], children: /* @__PURE__ */ e("div", { className: i["tedi-header-login__button--inner"], children: /* @__PURE__ */ e(s, { modifiers: "normal", className: i["tedi-header-login__button--text"], children: n }) }) }) });
|
|
31
|
+
};
|
|
32
|
+
v.displayName = "Header.Login";
|
|
33
|
+
export {
|
|
34
|
+
v as HeaderLogin,
|
|
35
|
+
v as default
|
|
36
|
+
};
|
package/src/tedi/components/layout/header/components/header-login/header-login.module.scss.cjs.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-header-login__button":"tedi-header-login__button-591eac27","tedi-header-login__button--inner":"tedi-header-login__button--inner-731701d1","tedi-header-login__button--text":"tedi-header-login__button--text-f12ac18f"};exports.default=e;
|
package/src/tedi/components/layout/header/components/header-login/header-login.module.scss.es.js
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
const e = {
|
|
2
|
+
"tedi-header-login__button": "tedi-header-login__button-591eac27",
|
|
3
|
+
"tedi-header-login__button--inner": "tedi-header-login__button--inner-731701d1",
|
|
4
|
+
"tedi-header-login__button--text": "tedi-header-login__button--text-f12ac18f"
|
|
5
|
+
};
|
|
6
|
+
export {
|
|
7
|
+
e as default
|
|
8
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),u=require("../../../../base/typography/text/text.cjs.js"),d=require("../../../../base/icon/icon.cjs.js"),b=require("../../../../buttons/button/button.cjs.js"),j=require("../../../../navigation/link/link.cjs.js"),k=require("../header-mobile-button/header-mobile-button.cjs.js"),o=require("./header-logout.module.scss.cjs.js"),q=require("../../../../../helpers/hooks/use-breakpoint-props.cjs.js"),B=require("../../../../../providers/label-provider/use-labels.cjs.js"),c=require("../../../../../helpers/hooks/use-breakpoint.cjs.js"),l=t=>{const{onClick:r,href:s}=t,{getCurrentBreakpointProps:m}=q.useBreakpointProps(t.defaultServerBreakpoint),{size:h,label:g}=m(t),{getLabel:n}=B.useLabels(),x=c.default(t.defaultServerBreakpoint),f=c.isBreakpointBelow(x,"md"),a=(h??(f?"small":"default"))==="small",i=g??n(a?"header.logout.mobile":"header.logout");return e.jsx(e.Fragment,{children:a?e.jsx(k.default,{onClick:r,href:s,icon:{name:"logout",size:24,color:"inherit"},label:i}):s?e.jsx(j.Link,{onClick:r,href:s,underline:!1,children:e.jsxs("div",{className:o.default["tedi-header-logout"],children:[e.jsx(d.Icon,{name:"logout",size:18,color:"inherit"}),e.jsx(u.Text,{modifiers:"normal",className:o.default["tedi-header-logout__text"],children:i})]})}):e.jsx(b.Button,{onClick:r,noStyle:!0,children:e.jsxs("div",{className:o.default["tedi-header-logout"],children:[e.jsx(d.Icon,{name:"logout",size:18,color:"inherit"}),e.jsx(u.Text,{modifiers:"normal",className:o.default["tedi-header-logout__text"],children:i})]})})})};l.displayName="HeaderLogout";exports.HeaderLogout=l;exports.default=l;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { jsx as e, Fragment as g, jsxs as s } from "react/jsx-runtime";
|
|
2
|
+
import { Text as m } from "../../../../base/typography/text/text.es.js";
|
|
3
|
+
import { Icon as d } from "../../../../base/icon/icon.es.js";
|
|
4
|
+
import { Button as b } from "../../../../buttons/button/button.es.js";
|
|
5
|
+
import { Link as k } from "../../../../navigation/link/link.es.js";
|
|
6
|
+
import B from "../header-mobile-button/header-mobile-button.es.js";
|
|
7
|
+
import r from "./header-logout.module.scss.es.js";
|
|
8
|
+
import { useBreakpointProps as z } from "../../../../../helpers/hooks/use-breakpoint-props.es.js";
|
|
9
|
+
import { useLabels as x } from "../../../../../providers/label-provider/use-labels.es.js";
|
|
10
|
+
import L, { isBreakpointBelow as v } from "../../../../../helpers/hooks/use-breakpoint.es.js";
|
|
11
|
+
const N = (o) => {
|
|
12
|
+
const { onClick: t, href: i } = o, { getCurrentBreakpointProps: c } = z(o.defaultServerBreakpoint), { size: u, label: f } = c(o), { getLabel: a } = x(), h = L(o.defaultServerBreakpoint), p = v(h, "md"), n = (u ?? (p ? "small" : "default")) === "small", l = f ?? a(n ? "header.logout.mobile" : "header.logout");
|
|
13
|
+
return /* @__PURE__ */ e(g, { children: n ? /* @__PURE__ */ e(
|
|
14
|
+
B,
|
|
15
|
+
{
|
|
16
|
+
onClick: t,
|
|
17
|
+
href: i,
|
|
18
|
+
icon: { name: "logout", size: 24, color: "inherit" },
|
|
19
|
+
label: l
|
|
20
|
+
}
|
|
21
|
+
) : i ? /* @__PURE__ */ e(k, { onClick: t, href: i, underline: !1, children: /* @__PURE__ */ s("div", { className: r["tedi-header-logout"], children: [
|
|
22
|
+
/* @__PURE__ */ e(d, { name: "logout", size: 18, color: "inherit" }),
|
|
23
|
+
/* @__PURE__ */ e(m, { modifiers: "normal", className: r["tedi-header-logout__text"], children: l })
|
|
24
|
+
] }) }) : /* @__PURE__ */ e(b, { onClick: t, noStyle: !0, children: /* @__PURE__ */ s("div", { className: r["tedi-header-logout"], children: [
|
|
25
|
+
/* @__PURE__ */ e(d, { name: "logout", size: 18, color: "inherit" }),
|
|
26
|
+
/* @__PURE__ */ e(m, { modifiers: "normal", className: r["tedi-header-logout__text"], children: l })
|
|
27
|
+
] }) }) });
|
|
28
|
+
};
|
|
29
|
+
N.displayName = "HeaderLogout";
|
|
30
|
+
export {
|
|
31
|
+
N as HeaderLogout,
|
|
32
|
+
N as default
|
|
33
|
+
};
|
package/src/tedi/components/layout/header/components/header-logout/header-logout.module.scss.cjs.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-header-logout":"tedi-header-logout-ab7a73b2","tedi-header-logout__text":"tedi-header-logout__text-a150b1fe"};exports.default=e;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),d=require("../../../../../../../external/classnames/index.cjs.js"),q=require("react"),j=require("../../../../base/typography/text/text.cjs.js"),_=require("../../../../base/icon/icon.cjs.js"),N=require("../../../../buttons/button/button.cjs.js"),y=require("../../../../navigation/link/link.cjs.js"),r=require("./header-mobile-button.module.scss.cjs.js"),a=q.forwardRef((u,c)=>{const{onClick:l,href:o,icon:b,label:m,selected:f,disabled:n}=u,h=e=>{const x=typeof e=="string"?{name:e}:{...e,className:d.default(e==null?void 0:e.className)};return t.jsx(_.Icon,{...x})},s=t.jsxs("div",{className:r.default["tedi-header-mobile-button__inner"],children:[h(b),t.jsx(j.Text,{modifiers:"extra-small",className:r.default["tedi-header-mobile-button__text"],children:m})]}),i=d.default(r.default["tedi-header-mobile-button"],{[r.default["tedi-header-mobile-button--selected"]]:f,[r.default["tedi-header-mobile-button--disabled"]]:n});return n||!o?t.jsx(N.Button,{onClick:l,disabled:n,className:i,ref:c,noStyle:!0,children:s}):t.jsx(y.Link,{onClick:l,href:o,noStyle:!0,underline:!1,className:i,children:s})});a.displayName="HeaderMobileButton";exports.default=a;
|
package/src/tedi/components/layout/header/components/header-mobile-button/header-mobile-button.es.js
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { jsxs as h, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import n from "../../../../../../../external/classnames/index.es.js";
|
|
3
|
+
import N from "react";
|
|
4
|
+
import { Text as x } from "../../../../base/typography/text/text.es.js";
|
|
5
|
+
import { Icon as _ } from "../../../../base/icon/icon.es.js";
|
|
6
|
+
import { Button as y } from "../../../../buttons/button/button.es.js";
|
|
7
|
+
import { Link as B } from "../../../../navigation/link/link.es.js";
|
|
8
|
+
import t from "./header-mobile-button.module.scss.es.js";
|
|
9
|
+
const g = N.forwardRef((m, d) => {
|
|
10
|
+
const { onClick: s, href: l, icon: c, label: f, selected: u, disabled: o } = m, b = (e) => {
|
|
11
|
+
const p = typeof e == "string" ? { name: e } : { ...e, className: n(e == null ? void 0 : e.className) };
|
|
12
|
+
return /* @__PURE__ */ r(_, { ...p });
|
|
13
|
+
}, a = /* @__PURE__ */ h("div", { className: t["tedi-header-mobile-button__inner"], children: [
|
|
14
|
+
b(c),
|
|
15
|
+
/* @__PURE__ */ r(x, { modifiers: "extra-small", className: t["tedi-header-mobile-button__text"], children: f })
|
|
16
|
+
] }), i = n(t["tedi-header-mobile-button"], {
|
|
17
|
+
[t["tedi-header-mobile-button--selected"]]: u,
|
|
18
|
+
[t["tedi-header-mobile-button--disabled"]]: o
|
|
19
|
+
});
|
|
20
|
+
return o || !l ? /* @__PURE__ */ r(y, { onClick: s, disabled: o, className: i, ref: d, noStyle: !0, children: a }) : /* @__PURE__ */ r(B, { onClick: s, href: l, noStyle: !0, underline: !1, className: i, children: a });
|
|
21
|
+
});
|
|
22
|
+
g.displayName = "HeaderMobileButton";
|
|
23
|
+
export {
|
|
24
|
+
g as default
|
|
25
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-header-mobile-button":"tedi-header-mobile-button-06191367","tedi-header-mobile-button__inner":"tedi-header-mobile-button__inner-364582ec","tedi-header-mobile-button__text":"tedi-header-mobile-button__text-e081a46b","tedi-header-mobile-button--disabled":"tedi-header-mobile-button--disabled-451a06b1","tedi-header-mobile-button--selected":"tedi-header-mobile-button--selected-8edeeaf6"};exports.default=e;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
const e = {
|
|
2
|
+
"tedi-header-mobile-button": "tedi-header-mobile-button-06191367",
|
|
3
|
+
"tedi-header-mobile-button__inner": "tedi-header-mobile-button__inner-364582ec",
|
|
4
|
+
"tedi-header-mobile-button__text": "tedi-header-mobile-button__text-e081a46b",
|
|
5
|
+
"tedi-header-mobile-button--disabled": "tedi-header-mobile-button--disabled-451a06b1",
|
|
6
|
+
"tedi-header-mobile-button--selected": "tedi-header-mobile-button--selected-8edeeaf6"
|
|
7
|
+
};
|
|
8
|
+
export {
|
|
9
|
+
e as default
|
|
10
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),B=require("../../../../../../../external/classnames/index.cjs.js"),o=require("react"),F=require("../../../../base/icon/icon.cjs.js"),L=require("../../../../buttons/button/button.cjs.js"),m=require("../../../../overlays/popover/popover.cjs.js"),A=require("../header-mobile-button/header-mobile-button.cjs.js"),r=require("./header-profile.module.scss.cjs.js"),V=require("../../../../../providers/label-provider/use-labels.cjs.js"),$=require("../../../../../helpers/hooks/use-breakpoint-props.cjs.js"),v=require("../../../../../helpers/hooks/use-breakpoint.cjs.js"),C=o.createContext(null),D=()=>o.useContext(C),_=c=>{const{children:x,showLabel:q=!1,disabled:u=!1,noStyle:E=!1}=c,{getLabel:b}=V.useLabels(),{getCurrentBreakpointProps:O}=$.useBreakpointProps(c.defaultServerBreakpoint),{showPopover:S="lg",label:N}=O(c),[g,R]=o.useState(!1),[s,f]=o.useState(!1),[H,I]=o.useState(null),[j,M]=o.useState(null),l=o.useRef(null),T=o.useId(),z={activeRoleId:H,setActiveRoleId:o.useCallback(t=>I(t),[])},P=v.default(),w=v.isBreakpointBelow(P,"md"),i=!v.isBreakpointBelow(P,S),d=N??b(w?"header.profile.mobile":"header.profile");o.useEffect(()=>{if(!s)return;const t=n=>{var a;n.key==="Escape"&&(f(!1),(a=l.current)==null||a.focus())};return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[s]),o.useLayoutEffect(()=>{var a;if(!s||i)return;const t=(a=l.current)==null?void 0:a.closest("header");if(!t)return;const n=()=>M(t.getBoundingClientRect().bottom);return n(),window.addEventListener("resize",n),window.addEventListener("scroll",n,!0),()=>{window.removeEventListener("resize",n),window.removeEventListener("scroll",n,!0)}},[s,i]);const k=j!==null?{"--header-profile-offset":`${j}px`}:void 0,p=()=>{f(t=>!t)},h=i?g:s,y=w?e.jsx(A.default,{onClick:p,icon:{name:h?"close":"account_circle",size:24,color:"inherit"},label:d,selected:h,disabled:u,ref:l}):q?e.jsx(L.Button,{visualType:"secondary",iconLeft:"account_circle",onClick:p,ref:l,disabled:u,className:r.default["tedi-header-profile__button"],children:e.jsxs("div",{className:r.default["tedi-header-profile__button-inner"],children:[d,e.jsx(F.Icon,{name:"expand_more",size:18,className:B.default(r.default["tedi-header-profile__icon"],{[r.default["tedi-header-profile__icon--open"]]:h})})]})}):e.jsx(L.Button,{icon:{name:"account_circle",size:36},visualType:"neutral","aria-label":d,onClick:p,ref:l,disabled:u,children:e.jsx(e.Fragment,{})});return e.jsx(C.Provider,{value:z,children:i?e.jsxs(m.Popover,{placement:"bottom-end",withBorder:!0,open:g,onToggle:()=>R(t=>!t),children:[e.jsx(m.Popover.Trigger,{children:y}),e.jsx(m.Popover.Content,{children:e.jsx("div",{className:r.default["tedi-header-profile__list"],children:x})})]}):e.jsxs(e.Fragment,{children:[y,s&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:r.default["tedi-header-profile__overlay"],style:k,onClick:()=>{var t;f(!1),(t=l.current)==null||t.focus()},"aria-hidden":"true"}),e.jsx("div",{className:r.default["tedi-header-profile__modal"],style:k,role:"dialog","aria-modal":"true","aria-label":d,id:T,children:e.jsx("div",{className:B.default(r.default["tedi-header-profile__modal--content"],{[r.default["tedi-header-profile__modal--content-styled"]]:!E}),children:x})})]})]})})};_.displayName="Header.Profile";exports.HeaderProfile=_;exports.default=_;exports.useHeaderProfile=D;
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import { jsx as o, jsxs as d, Fragment as v } from "react/jsx-runtime";
|
|
2
|
+
import B from "../../../../../../../external/classnames/index.es.js";
|
|
3
|
+
import { useState as c, useRef as D, useId as F, useCallback as K, useEffect as $, useLayoutEffect as q, useContext as G, createContext as J } from "react";
|
|
4
|
+
import { Icon as Q } from "../../../../base/icon/icon.es.js";
|
|
5
|
+
import { Button as E } from "../../../../buttons/button/button.es.js";
|
|
6
|
+
import { Popover as _ } from "../../../../overlays/popover/popover.es.js";
|
|
7
|
+
import U from "../header-mobile-button/header-mobile-button.es.js";
|
|
8
|
+
import t from "./header-profile.module.scss.es.js";
|
|
9
|
+
import { useLabels as W } from "../../../../../providers/label-provider/use-labels.es.js";
|
|
10
|
+
import { useBreakpointProps as X } from "../../../../../helpers/hooks/use-breakpoint-props.es.js";
|
|
11
|
+
import Y, { isBreakpointBelow as x } from "../../../../../helpers/hooks/use-breakpoint.es.js";
|
|
12
|
+
const N = J(null), fe = () => G(N), Z = (f) => {
|
|
13
|
+
const { children: b, showLabel: O = !1, disabled: u = !1, noStyle: H = !1 } = f, { getLabel: w } = W(), { getCurrentBreakpointProps: I } = X(f.defaultServerBreakpoint), { showPopover: R = "lg", label: z } = I(f), [y, T] = c(!1), [n, m] = c(!1), [M, S] = c(null), [g, j] = c(null), l = D(null), A = F(), V = {
|
|
14
|
+
activeRoleId: M,
|
|
15
|
+
setActiveRoleId: K((e) => S(e), [])
|
|
16
|
+
}, k = Y(), C = x(k, "md"), s = !x(k, R), a = z ?? w(C ? "header.profile.mobile" : "header.profile");
|
|
17
|
+
$(() => {
|
|
18
|
+
if (!n) return;
|
|
19
|
+
const e = (r) => {
|
|
20
|
+
var i;
|
|
21
|
+
r.key === "Escape" && (m(!1), (i = l.current) == null || i.focus());
|
|
22
|
+
};
|
|
23
|
+
return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
|
|
24
|
+
}, [n]), q(() => {
|
|
25
|
+
var i;
|
|
26
|
+
if (!n || s) return;
|
|
27
|
+
const e = (i = l.current) == null ? void 0 : i.closest("header");
|
|
28
|
+
if (!e) return;
|
|
29
|
+
const r = () => j(e.getBoundingClientRect().bottom);
|
|
30
|
+
return r(), window.addEventListener("resize", r), window.addEventListener("scroll", r, !0), () => {
|
|
31
|
+
window.removeEventListener("resize", r), window.removeEventListener("scroll", r, !0);
|
|
32
|
+
};
|
|
33
|
+
}, [n, s]);
|
|
34
|
+
const L = g !== null ? { "--header-profile-offset": `${g}px` } : void 0, p = () => {
|
|
35
|
+
m((e) => !e);
|
|
36
|
+
}, h = s ? y : n, P = C ? /* @__PURE__ */ o(
|
|
37
|
+
U,
|
|
38
|
+
{
|
|
39
|
+
onClick: p,
|
|
40
|
+
icon: { name: h ? "close" : "account_circle", size: 24, color: "inherit" },
|
|
41
|
+
label: a,
|
|
42
|
+
selected: h,
|
|
43
|
+
disabled: u,
|
|
44
|
+
ref: l
|
|
45
|
+
}
|
|
46
|
+
) : O ? /* @__PURE__ */ o(
|
|
47
|
+
E,
|
|
48
|
+
{
|
|
49
|
+
visualType: "secondary",
|
|
50
|
+
iconLeft: "account_circle",
|
|
51
|
+
onClick: p,
|
|
52
|
+
ref: l,
|
|
53
|
+
disabled: u,
|
|
54
|
+
className: t["tedi-header-profile__button"],
|
|
55
|
+
children: /* @__PURE__ */ d("div", { className: t["tedi-header-profile__button-inner"], children: [
|
|
56
|
+
a,
|
|
57
|
+
/* @__PURE__ */ o(
|
|
58
|
+
Q,
|
|
59
|
+
{
|
|
60
|
+
name: "expand_more",
|
|
61
|
+
size: 18,
|
|
62
|
+
className: B(t["tedi-header-profile__icon"], {
|
|
63
|
+
[t["tedi-header-profile__icon--open"]]: h
|
|
64
|
+
})
|
|
65
|
+
}
|
|
66
|
+
)
|
|
67
|
+
] })
|
|
68
|
+
}
|
|
69
|
+
) : /* @__PURE__ */ o(
|
|
70
|
+
E,
|
|
71
|
+
{
|
|
72
|
+
icon: { name: "account_circle", size: 36 },
|
|
73
|
+
visualType: "neutral",
|
|
74
|
+
"aria-label": a,
|
|
75
|
+
onClick: p,
|
|
76
|
+
ref: l,
|
|
77
|
+
disabled: u,
|
|
78
|
+
children: /* @__PURE__ */ o(v, {})
|
|
79
|
+
}
|
|
80
|
+
);
|
|
81
|
+
return /* @__PURE__ */ o(N.Provider, { value: V, children: s ? /* @__PURE__ */ d(
|
|
82
|
+
_,
|
|
83
|
+
{
|
|
84
|
+
placement: "bottom-end",
|
|
85
|
+
withBorder: !0,
|
|
86
|
+
open: y,
|
|
87
|
+
onToggle: () => T((e) => !e),
|
|
88
|
+
children: [
|
|
89
|
+
/* @__PURE__ */ o(_.Trigger, { children: P }),
|
|
90
|
+
/* @__PURE__ */ o(_.Content, { children: /* @__PURE__ */ o("div", { className: t["tedi-header-profile__list"], children: b }) })
|
|
91
|
+
]
|
|
92
|
+
}
|
|
93
|
+
) : /* @__PURE__ */ d(v, { children: [
|
|
94
|
+
P,
|
|
95
|
+
n && /* @__PURE__ */ d(v, { children: [
|
|
96
|
+
/* @__PURE__ */ o(
|
|
97
|
+
"div",
|
|
98
|
+
{
|
|
99
|
+
className: t["tedi-header-profile__overlay"],
|
|
100
|
+
style: L,
|
|
101
|
+
onClick: () => {
|
|
102
|
+
var e;
|
|
103
|
+
m(!1), (e = l.current) == null || e.focus();
|
|
104
|
+
},
|
|
105
|
+
"aria-hidden": "true"
|
|
106
|
+
}
|
|
107
|
+
),
|
|
108
|
+
/* @__PURE__ */ o(
|
|
109
|
+
"div",
|
|
110
|
+
{
|
|
111
|
+
className: t["tedi-header-profile__modal"],
|
|
112
|
+
style: L,
|
|
113
|
+
role: "dialog",
|
|
114
|
+
"aria-modal": "true",
|
|
115
|
+
"aria-label": a,
|
|
116
|
+
id: A,
|
|
117
|
+
children: /* @__PURE__ */ o(
|
|
118
|
+
"div",
|
|
119
|
+
{
|
|
120
|
+
className: B(t["tedi-header-profile__modal--content"], {
|
|
121
|
+
[t["tedi-header-profile__modal--content-styled"]]: !H
|
|
122
|
+
}),
|
|
123
|
+
children: b
|
|
124
|
+
}
|
|
125
|
+
)
|
|
126
|
+
}
|
|
127
|
+
)
|
|
128
|
+
] })
|
|
129
|
+
] }) });
|
|
130
|
+
};
|
|
131
|
+
Z.displayName = "Header.Profile";
|
|
132
|
+
export {
|
|
133
|
+
Z as HeaderProfile,
|
|
134
|
+
Z as default,
|
|
135
|
+
fe as useHeaderProfile
|
|
136
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-header-profile__button":"tedi-header-profile__button-5f71397b","tedi-header-profile__button-inner":"tedi-header-profile__button-inner-3efab97a","tedi-header-profile__list":"tedi-header-profile__list-3923fd3e","tedi-header-profile__modal":"tedi-header-profile__modal-71010392","tedi-header-profile__modal--content":"tedi-header-profile__modal--content-7f6b54ca","tedi-header-profile__modal--content-styled":"tedi-header-profile__modal--content-styled-7269de2a","tedi-header-profile__overlay":"tedi-header-profile__overlay-d54b0082","tedi-header-profile__icon":"tedi-header-profile__icon-85b7b81c","tedi-header-profile__icon--open":"tedi-header-profile__icon--open-bb67ddf9"};exports.default=e;
|
package/src/tedi/components/layout/header/components/header-profile/header-profile.module.scss.es.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
const e = {
|
|
2
|
+
"tedi-header-profile__button": "tedi-header-profile__button-5f71397b",
|
|
3
|
+
"tedi-header-profile__button-inner": "tedi-header-profile__button-inner-3efab97a",
|
|
4
|
+
"tedi-header-profile__list": "tedi-header-profile__list-3923fd3e",
|
|
5
|
+
"tedi-header-profile__modal": "tedi-header-profile__modal-71010392",
|
|
6
|
+
"tedi-header-profile__modal--content": "tedi-header-profile__modal--content-7f6b54ca",
|
|
7
|
+
"tedi-header-profile__modal--content-styled": "tedi-header-profile__modal--content-styled-7269de2a",
|
|
8
|
+
"tedi-header-profile__overlay": "tedi-header-profile__overlay-d54b0082",
|
|
9
|
+
"tedi-header-profile__icon": "tedi-header-profile__icon-85b7b81c",
|
|
10
|
+
"tedi-header-profile__icon--open": "tedi-header-profile__icon--open-bb67ddf9"
|
|
11
|
+
};
|
|
12
|
+
export {
|
|
13
|
+
e as default
|
|
14
|
+
};
|
package/src/tedi/components/layout/header/components/header-role/header-role-representatives.cjs.js
ADDED
|
@@ -0,0 +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"),f=require("react"),H=require("../../../../base/icon/icon.cjs.js"),_=require("../../../../base/typography/text/text.cjs.js"),M=require("../../../../buttons/button/button.cjs.js"),V=require("../../../../form/search/search.cjs.js"),w=require("../../../../misc/separator/separator.cjs.js"),r=require("./header-role.module.scss.cjs.js"),B=require("../../../../../providers/label-provider/use-labels.cjs.js"),F=t=>t?typeof t=="string"?{name:t}:t:null,x=t=>{const{id:p,toggleId:S,representatives:d,inputValue:b,setInputValue:c,setRepresentative:g,setIsRoleSelectionOpen:v,onRoleSelectionToggle:u,isRoleSelectionOpen:a,representative:s,isOrganization:j,searchLabel:R,organizationSearchLabel:q,searchId:y,keepOpenOnSelect:I,showSearch:h=!1,searchClearable:N=!1,clearSearchOnSelect:L=!0,noResultsContent:O}=t,{getLabel:i}=B.useLabels(),z=j?q??i("header.role-selection.search.organizationLabel"):R??i("header.role-selection.search.label"),C=l=>{g(l),L&&c(""),I||(a&&u?u():v(!1))},T=f.useId();return e.jsx("div",{id:p,role:"region","aria-labelledby":S,className:m.default(r.default["tedi-header-role__collapse"],{[r.default["tedi-header-role__collapse--open"]]:a}),...!a&&{inert:""},children:e.jsx("div",{className:r.default["tedi-header-role__collapse--items"],children:e.jsxs("div",{className:r.default["tedi-header-role__list"],children:[h&&e.jsx(V.Search,{id:y??T,value:b,onChange:l=>c(l),label:z,isClearable:N}),d.length===0&&(O??e.jsx(_.Text,{className:r.default["tedi-header-role__no-results"],color:"secondary",children:i("header.role-selection.no-results")})),d.map((l,k)=>{const n=(s==null?void 0:s.id)===l.id,o=F(l.icon);return e.jsxs(f.Fragment,{children:[(h||k!==0)&&e.jsx(w.Separator,{}),e.jsx(M.Button,{onClick:()=>C(l),visualType:n?"primary":"neutral","aria-current":n||void 0,className:m.default(r.default["tedi-header-role__item"],{[r.default["tedi-header-role__item--selected"]]:n}),noStyle:!0,children:e.jsxs("div",{className:r.default["tedi-header-role__item-inner"],children:[o&&e.jsx(H.Icon,{name:o.name,size:o.size,color:"inherit"}),e.jsxs("div",{className:r.default["tedi-header-role__item-text"],children:[l.name,e.jsx(_.Text,{modifiers:"small",children:l.description})]})]})})]},l.id)})]})})})};x.displayName="HeaderRoleRepresentatives";exports.default=x;
|
package/src/tedi/components/layout/header/components/header-role/header-role-representatives.es.js
ADDED
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import { jsx as l, jsxs as t } from "react/jsx-runtime";
|
|
2
|
+
import u from "../../../../../../../external/classnames/index.es.js";
|
|
3
|
+
import H, { useId as V } from "react";
|
|
4
|
+
import { Icon as w } from "../../../../base/icon/icon.es.js";
|
|
5
|
+
import { Text as f } from "../../../../base/typography/text/text.es.js";
|
|
6
|
+
import { Button as B } from "../../../../buttons/button/button.es.js";
|
|
7
|
+
import { Search as F } from "../../../../form/search/search.es.js";
|
|
8
|
+
import { Separator as q } from "../../../../misc/separator/separator.es.js";
|
|
9
|
+
import r from "./header-role.module.scss.es.js";
|
|
10
|
+
import { useLabels as A } from "../../../../../providers/label-provider/use-labels.es.js";
|
|
11
|
+
const D = (a) => a ? typeof a == "string" ? { name: a } : a : null, E = (a) => {
|
|
12
|
+
const {
|
|
13
|
+
id: _,
|
|
14
|
+
toggleId: S,
|
|
15
|
+
representatives: d,
|
|
16
|
+
inputValue: g,
|
|
17
|
+
setInputValue: m,
|
|
18
|
+
setRepresentative: v,
|
|
19
|
+
setIsRoleSelectionOpen: b,
|
|
20
|
+
onRoleSelectionToggle: h,
|
|
21
|
+
isRoleSelectionOpen: o,
|
|
22
|
+
representative: i,
|
|
23
|
+
isOrganization: R,
|
|
24
|
+
searchLabel: N,
|
|
25
|
+
organizationSearchLabel: y,
|
|
26
|
+
searchId: I,
|
|
27
|
+
keepOpenOnSelect: L,
|
|
28
|
+
showSearch: p = !1,
|
|
29
|
+
searchClearable: O = !1,
|
|
30
|
+
clearSearchOnSelect: x = !0,
|
|
31
|
+
noResultsContent: z
|
|
32
|
+
} = a, { getLabel: s } = A(), C = R ? y ?? s("header.role-selection.search.organizationLabel") : N ?? s("header.role-selection.search.label"), T = (e) => {
|
|
33
|
+
v(e), x && m(""), L || (o && h ? h() : b(!1));
|
|
34
|
+
}, j = V();
|
|
35
|
+
return /* @__PURE__ */ l(
|
|
36
|
+
"div",
|
|
37
|
+
{
|
|
38
|
+
id: _,
|
|
39
|
+
role: "region",
|
|
40
|
+
"aria-labelledby": S,
|
|
41
|
+
className: u(r["tedi-header-role__collapse"], {
|
|
42
|
+
[r["tedi-header-role__collapse--open"]]: o
|
|
43
|
+
}),
|
|
44
|
+
...!o && { inert: "" },
|
|
45
|
+
children: /* @__PURE__ */ l("div", { className: r["tedi-header-role__collapse--items"], children: /* @__PURE__ */ t("div", { className: r["tedi-header-role__list"], children: [
|
|
46
|
+
p && /* @__PURE__ */ l(
|
|
47
|
+
F,
|
|
48
|
+
{
|
|
49
|
+
id: I ?? j,
|
|
50
|
+
value: g,
|
|
51
|
+
onChange: (e) => m(e),
|
|
52
|
+
label: C,
|
|
53
|
+
isClearable: O
|
|
54
|
+
}
|
|
55
|
+
),
|
|
56
|
+
d.length === 0 && (z ?? /* @__PURE__ */ l(f, { className: r["tedi-header-role__no-results"], color: "secondary", children: s("header.role-selection.no-results") })),
|
|
57
|
+
d.map((e, k) => {
|
|
58
|
+
const n = (i == null ? void 0 : i.id) === e.id, c = D(e.icon);
|
|
59
|
+
return /* @__PURE__ */ t(H.Fragment, { children: [
|
|
60
|
+
(p || k !== 0) && /* @__PURE__ */ l(q, {}),
|
|
61
|
+
/* @__PURE__ */ l(
|
|
62
|
+
B,
|
|
63
|
+
{
|
|
64
|
+
onClick: () => T(e),
|
|
65
|
+
visualType: n ? "primary" : "neutral",
|
|
66
|
+
"aria-current": n || void 0,
|
|
67
|
+
className: u(r["tedi-header-role__item"], {
|
|
68
|
+
[r["tedi-header-role__item--selected"]]: n
|
|
69
|
+
}),
|
|
70
|
+
noStyle: !0,
|
|
71
|
+
children: /* @__PURE__ */ t("div", { className: r["tedi-header-role__item-inner"], children: [
|
|
72
|
+
c && /* @__PURE__ */ l(w, { name: c.name, size: c.size, color: "inherit" }),
|
|
73
|
+
/* @__PURE__ */ t("div", { className: r["tedi-header-role__item-text"], children: [
|
|
74
|
+
e.name,
|
|
75
|
+
/* @__PURE__ */ l(f, { modifiers: "small", children: e.description })
|
|
76
|
+
] })
|
|
77
|
+
] })
|
|
78
|
+
}
|
|
79
|
+
)
|
|
80
|
+
] }, e.id);
|
|
81
|
+
})
|
|
82
|
+
] }) })
|
|
83
|
+
}
|
|
84
|
+
);
|
|
85
|
+
};
|
|
86
|
+
E.displayName = "HeaderRoleRepresentatives";
|
|
87
|
+
export {
|
|
88
|
+
E as default
|
|
89
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),f=require("../../../../../../../external/classnames/index.cjs.js"),a=require("react"),x=require("../../../../base/typography/text/text.cjs.js"),K=require("../../../../base/icon/icon.cjs.js"),Q=require("../../../../buttons/button/button.cjs.js"),U=require("../../../../buttons/collapse-button/collapse-button.cjs.js"),W=require("../../../../misc/separator/separator.cjs.js"),I=require("../../../../overlays/popover/popover.cjs.js"),X=require("../header-profile/header-profile.cjs.js"),t=require("./header-role.module.scss.cjs.js"),B=require("./header-role-representatives.cjs.js"),Y=require("../../../../../providers/label-provider/use-labels.cjs.js"),L=require("../../../../../helpers/hooks/use-breakpoint.cjs.js"),N=P=>{const{label:T,showDescription:p=!0,representatives:o,isOrganization:v,accordionLabels:i,searchLabel:k,organizationSearchLabel:E,searchId:H,onRoleSelectionToggle:_,onRepresentativeChange:m,showSearch:z,searchClearable:M,clearSearchOnSelect:V,children:j,showRoleSwitch:A,noResultsContent:D}=P,{getLabel:w}=Y.useLabels(),u=a.useId(),[e,g]=a.useState(o==null?void 0:o[0]),[n,R]=a.useState(!1),[h,y]=a.useState(""),r=X.useHeaderProfile();a.useEffect(()=>{if(!(o!=null&&o.length)){g(void 0);return}e&&o.some(c=>c.id===e.id)||g(o[0])},[o]),a.useEffect(()=>{r&&r.activeRoleId!==null&&r.activeRoleId!==u&&n&&(R(!1),y(""))},[r==null?void 0:r.activeRoleId]);const F=L.default(),$=L.isBreakpointBelow(F,"lg"),d=A??((o==null?void 0:o.length)??0)>1,G=a.useMemo(()=>{if(!o)return[];if(!h)return o;const s=h.toLowerCase();return o.filter(c=>{var O;return c.name.toLowerCase().includes(s)||((O=c.description)==null?void 0:O.toLowerCase().includes(s))})},[o,h]),b=()=>{const s=!n;R(s),_==null||_(s),s&&r&&r.setActiveRoleId(u)},J=s=>{g(s),m==null||m(s)},S=`${u}-toggle`,q=`${u}-panel`,C={id:q,toggleId:S,representatives:G,representative:e,inputValue:h,setInputValue:y,setRepresentative:J,setIsRoleSelectionOpen:R,onRoleSelectionToggle:b,isRoleSelectionOpen:n,isOrganization:v,searchLabel:k,organizationSearchLabel:E,searchId:H,showSearch:z,searchClearable:M,clearSearchOnSelect:V,noResultsContent:D};if($){const s=(i==null?void 0:i.open)??w("header.role-selection"),c=(i==null?void 0:i.close)??w("header.role-selection.close");return l.jsxs("div",{className:t.default["tedi-header-role__container"],children:[l.jsxs("div",{className:f.default(t.default["tedi-header-role__content"],{[t.default["tedi-header-role__content--has-representatives"]]:d}),children:[l.jsxs("div",{className:f.default(t.default["tedi-header-role__content--body"],{[t.default["tedi-header-role__content--body-inline"]]:!d&&p&&(e==null?void 0:e.description)}),children:[l.jsxs("div",{className:t.default["tedi-header-role__content--title"],children:[T,l.jsx(x.Text,{modifiers:"bold",color:"secondary",children:e==null?void 0:e.name})]}),p&&(e==null?void 0:e.description)&&l.jsxs(l.Fragment,{children:[!d&&l.jsx(W.Separator,{axis:"vertical"}),l.jsx(x.Text,{color:"secondary",children:e==null?void 0:e.description})]})]}),d&&l.jsx(U.CollapseButton,{id:S,open:n,onOpenChange:()=>b(),openText:s,closeText:c,underline:!1,"aria-controls":q})]}),d&&(j?l.jsx("div",{id:q,role:"region","aria-labelledby":S,className:f.default(t.default["tedi-header-role__collapse"],{[t.default["tedi-header-role__collapse--open"]]:n}),...!n&&{inert:""},children:l.jsx("div",{className:t.default["tedi-header-role__collapse--items"],children:j})}):l.jsx(B.default,{...C,keepOpenOnSelect:!0}))]})}return l.jsxs("div",{className:t.default["tedi-header-role"],children:[l.jsxs("div",{className:t.default["tedi-header-role__label"],children:[T,p&&!v&&(e==null?void 0:e.description)&&l.jsx(x.Text,{modifiers:"small",color:"secondary",children:e==null?void 0:e.description})]}),d?l.jsxs(I.Popover,{placement:"bottom",open:n,onToggle:b,withBorder:!0,children:[l.jsx(I.Popover.Trigger,{children:l.jsx(Q.Button,{visualType:"link",underline:!1,children:l.jsxs("span",{className:t.default["tedi-header-role__value"],children:[e==null?void 0:e.name,l.jsx(K.Icon,{name:"expand_more",size:16,color:"primary",className:f.default(t.default["tedi-header-role__icon"],{[t.default["tedi-header-role__icon--open"]]:n})})]})})}),l.jsx(I.Popover.Content,{children:j??l.jsx(B.default,{...C})})]}):l.jsx("div",{className:t.default["tedi-header-role__value"],children:l.jsx(x.Text,{children:e==null?void 0:e.name})})]})};N.displayName="Header.Role";exports.HeaderRole=N;exports.default=N;
|