@tedi-design-system/react 14.2.0-rc.6 → 14.2.0-rc.7
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/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),a=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),a=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),m=require("../../../../../external/classnames/index.cjs.js"),r=require("react"),U=require("../../../../tedi/components/content/section/section.cjs.js"),$=require("../../../../tedi/helpers/hooks/use-element-size.cjs.js"),k=require("../../../../tedi/providers/accessibility-provider/accessibility-provider.cjs.js"),H=require("../breadcrumbs/breadcrumbs.cjs.js"),z=require("../footer/footer.cjs.js"),A=require("../layout-context.cjs.js"),D=require("../sidenav/sidenav.cjs.js"),G=require("../sidenav/utility.cjs.js"),t=require("./layout.module.scss.cjs.js"),J=require("../header/header/header.cjs.js"),K=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),q=j=>{var y;const{children:_,header:E,sideNav:s,breadcrumbsProps:f,footer:g,mainContentId:P="main-content",mainContentClassName:R,mainLogo:i,growMainContent:S,headerType:h="system",onHeaderSidenavToggle:c,...C}=j,N=r.useRef(null),p=r.useRef(null),[n,b]=r.useState(!1),v=r.useRef(n),{hasSidenav:M}=G.useSidenavRendered(h,s),l=!!((y=s==null?void 0:s.navItems)!=null&&y.length),{y:w,refs:x,context:u}=a.useFloating({placement:"bottom-start",open:n,onOpenChange:l?b:void 0,whileElementsMounted:(...d)=>K.autoUpdate(...d,{ancestorScroll:!1})}),o=$.useElementSize(p),F=a.useClick(u,{enabled:l}),I=a.useRole(u,{role:"dialog",enabled:l}),O=a.useDismiss(u,{enabled:l}),{getReferenceProps:L,getFloatingProps:B}=a.useInteractions([F,I,O]),T=m.default(t.default.main,{[t.default["main--with-sidenav"]]:M,[t.default["main--grow"]]:S});return r.useEffect(()=>(document&&o&&document.documentElement.style.setProperty("--header-bottom-height",`${(o==null?void 0:o.height)??0}px`),()=>{document.documentElement.style.removeProperty("--header-bottom-height")}),[o]),r.useEffect(()=>{v.current!==n&&c&&c(n),v.current=n},[n,c]),e.jsx(A.LayoutContext.Provider,{value:{y:w,menuOpen:n,toggleMenu:()=>b(d=>!d),headerType:h,reference:x.setReference,floating:x.setFloating,context:u,getReferenceProps:L,getFloatingProps:B,sideNavProps:s,headerElement:N,headerBottomElement:p,headerBottomSize:o,onHeaderSidenavToggle:c},children:e.jsx(k.AccessibilityProvider,{children:e.jsxs("div",{"data-name":"layout",...C,className:t.default["container-wrapper"],children:[e.jsx(J.Header,{...E}),e.jsxs("div",{className:m.default(t.default.container,{[t.default["container--menu-open"]]:n}),children:[s&&e.jsx(D.SideNav,{...s}),e.jsxs("div",{className:T,children:[i&&e.jsx("img",{className:t.default.main__logos,src:i.src,alt:i.alt,style:i.style}),e.jsxs("main",{className:m.default(t.default.main__content,R),id:P,tabIndex:-1,children:[f&&e.jsx(U.Section,{children:e.jsx(H.Breadcrumbs,{className:t.default.main__breadcrumbs,...f})}),_]})]})]}),g&&e.jsx(z.Footer,{...g})]})})})};exports.Layout=q;exports.default=q;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as n, jsxs as l } from "react/jsx-runtime";
|
|
2
2
|
import { useFloating as H, useClick as T, useRole as A, useDismiss as D, useInteractions as U } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
|
|
3
|
-
import
|
|
3
|
+
import u from "../../../../../external/classnames/index.es.js";
|
|
4
4
|
import s from "react";
|
|
5
5
|
import { Section as $ } from "../../../../tedi/components/content/section/section.es.js";
|
|
6
6
|
import { useElementSize as q } from "../../../../tedi/helpers/hooks/use-element-size.es.js";
|
|
@@ -13,68 +13,66 @@ import { useSidenavRendered as V } from "../sidenav/utility.es.js";
|
|
|
13
13
|
import e from "./layout.module.scss.es.js";
|
|
14
14
|
import { Header as W } from "../header/header/header.es.js";
|
|
15
15
|
import { autoUpdate as X } from "../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
|
|
16
|
-
const fe = (
|
|
17
|
-
var
|
|
16
|
+
const fe = (N) => {
|
|
17
|
+
var E;
|
|
18
18
|
const {
|
|
19
|
-
children:
|
|
19
|
+
children: R,
|
|
20
20
|
header: P,
|
|
21
|
-
sideNav:
|
|
22
|
-
breadcrumbsProps:
|
|
23
|
-
footer:
|
|
21
|
+
sideNav: o,
|
|
22
|
+
breadcrumbsProps: f,
|
|
23
|
+
footer: p,
|
|
24
24
|
mainContentId: _ = "main-content",
|
|
25
25
|
mainContentClassName: x,
|
|
26
26
|
mainLogo: a,
|
|
27
27
|
growMainContent: C,
|
|
28
|
-
headerType:
|
|
28
|
+
headerType: h = "system",
|
|
29
29
|
onHeaderSidenavToggle: m,
|
|
30
30
|
...S
|
|
31
|
-
} =
|
|
31
|
+
} = N, w = s.useRef(null), g = s.useRef(null), [t, v] = s.useState(!1), b = s.useRef(t), { hasSidenav: F } = V(h, o), i = !!((E = o == null ? void 0 : o.navItems) != null && E.length), { y: I, refs: y, context: c } = H({
|
|
32
32
|
placement: "bottom-start",
|
|
33
33
|
open: t,
|
|
34
|
-
onOpenChange:
|
|
35
|
-
whileElementsMounted: (...
|
|
36
|
-
}), r = q(
|
|
37
|
-
y ? [M, O, B] : []
|
|
38
|
-
), k = d(e.main, {
|
|
34
|
+
onOpenChange: i ? v : void 0,
|
|
35
|
+
whileElementsMounted: (...d) => X(...d, { ancestorScroll: !1 })
|
|
36
|
+
}), r = q(g), M = T(c, { enabled: i }), O = A(c, { role: "dialog", enabled: i }), B = D(c, { enabled: i }), { getReferenceProps: L, getFloatingProps: j } = U([M, O, B]), k = u(e.main, {
|
|
39
37
|
[e["main--with-sidenav"]]: F,
|
|
40
38
|
[e["main--grow"]]: C
|
|
41
39
|
});
|
|
42
40
|
return s.useEffect(() => (document && r && document.documentElement.style.setProperty("--header-bottom-height", `${(r == null ? void 0 : r.height) ?? 0}px`), () => {
|
|
43
41
|
document.documentElement.style.removeProperty("--header-bottom-height");
|
|
44
42
|
}), [r]), s.useEffect(() => {
|
|
45
|
-
|
|
46
|
-
}, [t, m]), /* @__PURE__ */
|
|
43
|
+
b.current !== t && m && m(t), b.current = t;
|
|
44
|
+
}, [t, m]), /* @__PURE__ */ n(
|
|
47
45
|
K.Provider,
|
|
48
46
|
{
|
|
49
47
|
value: {
|
|
50
48
|
y: I,
|
|
51
49
|
menuOpen: t,
|
|
52
|
-
toggleMenu: () =>
|
|
53
|
-
headerType:
|
|
54
|
-
reference:
|
|
55
|
-
floating:
|
|
56
|
-
context:
|
|
50
|
+
toggleMenu: () => v((d) => !d),
|
|
51
|
+
headerType: h,
|
|
52
|
+
reference: y.setReference,
|
|
53
|
+
floating: y.setFloating,
|
|
54
|
+
context: c,
|
|
57
55
|
getReferenceProps: L,
|
|
58
56
|
getFloatingProps: j,
|
|
59
|
-
sideNavProps:
|
|
57
|
+
sideNavProps: o,
|
|
60
58
|
headerElement: w,
|
|
61
|
-
headerBottomElement:
|
|
59
|
+
headerBottomElement: g,
|
|
62
60
|
headerBottomSize: r,
|
|
63
61
|
onHeaderSidenavToggle: m
|
|
64
62
|
},
|
|
65
|
-
children: /* @__PURE__ */
|
|
66
|
-
/* @__PURE__ */
|
|
67
|
-
/* @__PURE__ */
|
|
68
|
-
|
|
69
|
-
/* @__PURE__ */
|
|
70
|
-
a && /* @__PURE__ */
|
|
71
|
-
/* @__PURE__ */
|
|
72
|
-
|
|
73
|
-
|
|
63
|
+
children: /* @__PURE__ */ n(z, { children: /* @__PURE__ */ l("div", { "data-name": "layout", ...S, className: e["container-wrapper"], children: [
|
|
64
|
+
/* @__PURE__ */ n(W, { ...P }),
|
|
65
|
+
/* @__PURE__ */ l("div", { className: u(e.container, { [e["container--menu-open"]]: t }), children: [
|
|
66
|
+
o && /* @__PURE__ */ n(Q, { ...o }),
|
|
67
|
+
/* @__PURE__ */ l("div", { className: k, children: [
|
|
68
|
+
a && /* @__PURE__ */ n("img", { className: e.main__logos, src: a.src, alt: a.alt, style: a.style }),
|
|
69
|
+
/* @__PURE__ */ l("main", { className: u(e.main__content, x), id: _, tabIndex: -1, children: [
|
|
70
|
+
f && /* @__PURE__ */ n($, { children: /* @__PURE__ */ n(G, { className: e.main__breadcrumbs, ...f }) }),
|
|
71
|
+
R
|
|
74
72
|
] })
|
|
75
73
|
] })
|
|
76
74
|
] }),
|
|
77
|
-
|
|
75
|
+
p && /* @__PURE__ */ n(J, { ...p })
|
|
78
76
|
] }) })
|
|
79
77
|
}
|
|
80
78
|
);
|