@tedi-design-system/react 18.2.0-rc.4 → 19.0.0-rc.10
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/README.md +27 -1
- package/_virtual/index.es13.js +2 -2
- package/_virtual/index.es14.js +2 -2
- package/bundle-stats.html +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/fonts/material-symbols-outlined.woff2 +0 -0
- package/fonts/material-symbols-rounded.woff2 +0 -0
- package/fonts/material-symbols-sharp.woff2 +0 -0
- package/index.css +1 -1
- package/package.json +6 -4
- package/src/tedi/components/content/calendar/calendar.cjs.js +1 -1
- package/src/tedi/components/content/calendar/calendar.d.ts +12 -0
- package/src/tedi/components/content/calendar/calendar.es.js +39 -35
- package/src/tedi/components/content/calendar/components/calendar-header/calendar-header.cjs.js +1 -1
- package/src/tedi/components/content/calendar/components/calendar-header/calendar-header.d.ts +13 -1
- package/src/tedi/components/content/calendar/components/calendar-header/calendar-header.es.js +40 -35
- package/src/tedi/components/content/table/table.cjs.js +1 -1
- package/src/tedi/components/content/table/table.d.ts +6 -0
- package/src/tedi/components/content/table/table.es.js +431 -413
- package/src/tedi/components/content/table/table.module.scss.cjs.js +1 -1
- package/src/tedi/components/content/table/table.module.scss.es.js +3 -0
- package/src/tedi/components/form/date-field/date-field.cjs.js +1 -1
- package/src/tedi/components/form/date-field/date-field.d.ts +10 -0
- package/src/tedi/components/form/date-field/date-field.es.js +176 -170
- package/src/tedi/components/form/date-field/date-picker-modal/date-picker-modal.cjs.js +1 -1
- package/src/tedi/components/form/date-field/date-picker-modal/date-picker-modal.d.ts +4 -0
- package/src/tedi/components/form/date-field/date-picker-modal/date-picker-modal.es.js +47 -43
- package/src/tedi/components/form/date-time-field/date-time-field.cjs.js +1 -1
- package/src/tedi/components/form/date-time-field/date-time-field.d.ts +10 -0
- package/src/tedi/components/form/date-time-field/date-time-field.es.js +92 -88
- package/src/tedi/components/form/file-upload/file-upload.cjs.js +1 -1
- package/src/tedi/components/form/file-upload/file-upload.es.js +11 -11
- package/src/tedi/components/form/select/components/select-multi-option.cjs.js +1 -1
- package/src/tedi/components/form/select/components/select-multi-option.es.js +24 -23
- package/src/tedi/components/form/select/components/select-single-option.cjs.js +1 -1
- package/src/tedi/components/form/select/components/select-single-option.es.js +11 -10
- package/src/tedi/components/form/select/select.module.scss.cjs.js +1 -1
- package/src/tedi/components/form/select/select.module.scss.es.js +2 -1
- package/src/tedi/components/form/textarea/textarea.cjs.js +1 -1
- package/src/tedi/components/form/textarea/textarea.d.ts +3 -3
- package/src/tedi/components/form/textarea/textarea.es.js +12 -12
- package/src/tedi/components/misc/ellipsis/ellipsis.cjs.js +1 -1
- package/src/tedi/components/misc/ellipsis/ellipsis.es.js +20 -19
- package/src/tedi/components/misc/timeline/components/timeline-description/timeline-description.cjs.js +1 -0
- package/src/tedi/components/misc/timeline/components/timeline-description/timeline-description.d.ts +23 -0
- package/src/tedi/components/misc/timeline/components/timeline-description/timeline-description.es.js +12 -0
- package/src/tedi/components/misc/timeline/components/timeline-item/timeline-item.cjs.js +1 -0
- package/src/tedi/components/misc/timeline/components/timeline-item/timeline-item.d.ts +34 -0
- package/src/tedi/components/misc/timeline/components/timeline-item/timeline-item.es.js +63 -0
- package/src/tedi/components/misc/timeline/components/timeline-title/timeline-title.cjs.js +1 -0
- package/src/tedi/components/misc/timeline/components/timeline-title/timeline-title.d.ts +24 -0
- package/src/tedi/components/misc/timeline/components/timeline-title/timeline-title.es.js +8 -0
- package/src/tedi/components/misc/timeline/index.d.ts +4 -0
- package/src/tedi/components/misc/timeline/timeline.cjs.js +1 -0
- package/src/tedi/components/misc/timeline/timeline.d.ts +48 -0
- package/src/tedi/components/misc/timeline/timeline.es.js +38 -0
- package/src/tedi/components/misc/timeline/timeline.module.scss.cjs.js +1 -0
- package/src/tedi/components/misc/timeline/timeline.module.scss.es.js +18 -0
- package/src/tedi/components/navigation/breadcrumbs/breadcrumbs.cjs.js +1 -1
- package/src/tedi/components/navigation/breadcrumbs/breadcrumbs.es.js +35 -32
- package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-collapsible/table-of-contents-collapsible.cjs.js +1 -1
- package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-collapsible/table-of-contents-collapsible.d.ts +1 -1
- package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-collapsible/table-of-contents-collapsible.es.js +33 -33
- package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-item/table-of-contents-item.d.ts +0 -10
- package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-list/table-of-contents-list.cjs.js +1 -1
- package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-list/table-of-contents-list.es.js +27 -18
- package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-row/table-of-contents-row.cjs.js +1 -1
- package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-row/table-of-contents-row.es.js +21 -35
- package/src/tedi/components/navigation/table-of-contents/table-of-contents.cjs.js +1 -1
- package/src/tedi/components/navigation/table-of-contents/table-of-contents.d.ts +17 -10
- package/src/tedi/components/navigation/table-of-contents/table-of-contents.es.js +51 -52
- package/src/tedi/components/navigation/table-of-contents/table-of-contents.module.scss.cjs.js +1 -1
- package/src/tedi/components/navigation/table-of-contents/table-of-contents.module.scss.es.js +0 -1
- package/src/tedi/components/overlays/dropdown/dropdown-item/dropdown-item.cjs.js +1 -1
- package/src/tedi/components/overlays/dropdown/dropdown-item/dropdown-item.d.ts +8 -4
- package/src/tedi/components/overlays/dropdown/dropdown-item/dropdown-item.es.js +85 -54
- package/src/tedi/components/overlays/overlay/overlay-content.cjs.js +1 -1
- package/src/tedi/components/overlays/overlay/overlay-content.d.ts +6 -1
- package/src/tedi/components/overlays/overlay/overlay-content.es.js +28 -27
- package/src/tedi/components/overlays/popover/popover-content.cjs.js +1 -1
- package/src/tedi/components/overlays/popover/popover-content.d.ts +7 -0
- package/src/tedi/components/overlays/popover/popover-content.es.js +47 -36
- package/src/tedi/index.d.ts +1 -0
- package/src/tedi/providers/label-provider/labels-map.cjs.js +1 -1
- package/src/tedi/providers/label-provider/labels-map.d.ts +0 -21
- package/src/tedi/providers/label-provider/labels-map.es.js +2 -23
- package/tedi.cjs.js +1 -1
- package/tedi.es.js +90 -82
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { TextColor } from '../../../../base/typography/text/text';
|
|
3
|
+
export interface TimelineTitleProps {
|
|
4
|
+
/**
|
|
5
|
+
* Title content. Wrap it in a heading element if you need heading semantics —
|
|
6
|
+
* nested typography inherits the title's size / weight.
|
|
7
|
+
*/
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
/**
|
|
10
|
+
* Text color, using the shared typography colors. Defaults to `secondary`.
|
|
11
|
+
* Pass `'inherit'` to inherit the surrounding color instead.
|
|
12
|
+
* @default secondary
|
|
13
|
+
*/
|
|
14
|
+
color?: TextColor | 'inherit';
|
|
15
|
+
/**
|
|
16
|
+
* Additional class name.
|
|
17
|
+
*/
|
|
18
|
+
className?: string;
|
|
19
|
+
}
|
|
20
|
+
export declare const TimelineTitle: {
|
|
21
|
+
({ children, color, className }: TimelineTitleProps): JSX.Element;
|
|
22
|
+
displayName: string;
|
|
23
|
+
};
|
|
24
|
+
export default TimelineTitle;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { jsx as m } from "react/jsx-runtime";
|
|
2
|
+
import s from "../../../../../../../external/classnames/index.es.js";
|
|
3
|
+
import l from "../../timeline.module.scss.es.js";
|
|
4
|
+
const r = ({ children: i, color: e = "secondary", className: t }) => /* @__PURE__ */ m("div", { className: s(l["tedi-timeline-title"], { [`tedi-text--${e}`]: e !== "inherit" }, t), children: i });
|
|
5
|
+
r.displayName = "TimelineTitle";
|
|
6
|
+
export {
|
|
7
|
+
r as TimelineTitle
|
|
8
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("react/jsx-runtime"),y=require("../../../../../external/classnames/index.cjs.js"),n=require("react"),I=require("./components/timeline-description/timeline-description.cjs.js"),d=require("./components/timeline-item/timeline-item.cjs.js"),g=require("./components/timeline-title/timeline-title.cjs.js"),u=require("./timeline.module.scss.cjs.js"),c=e=>n.isValidElement(e)&&e.type===d.TimelineItem,j=(e,t)=>t===void 0?"future":e===t?"current":e<t?"past":"future",i=({children:e,activeIndex:t,variant:l="default",cardPadding:s,className:a})=>{const f=n.Children.toArray(e).filter(c).length;let m=-1;const T=n.Children.map(e,r=>{if(!c(r))return r;m+=1;const o=m;return n.cloneElement(r,{state:j(o,t),isLast:o===f-1})}),p=l==="card"&&s!==void 0?{"--tedi-timeline-card-padding":`${s}rem`}:void 0;return q.jsx("div",{className:y.default(u.default["tedi-timeline"],{[u.default["tedi-timeline--card"]]:l==="card"},a),style:p,children:T})};i.displayName="Timeline";i.Item=d.TimelineItem;i.Title=g.TimelineTitle;i.Description=I.TimelineDescription;exports.Timeline=i;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { TimelineItemProps } from './components/timeline-item/timeline-item';
|
|
3
|
+
export type TimelineVariant = 'default' | 'card';
|
|
4
|
+
export type TimelineItemState = 'current' | 'past' | 'future';
|
|
5
|
+
export interface TimelineProps {
|
|
6
|
+
/**
|
|
7
|
+
* `Timeline.Item` elements.
|
|
8
|
+
*/
|
|
9
|
+
children: ReactNode;
|
|
10
|
+
/**
|
|
11
|
+
* Index of the active (current) item. Items before it render as completed (past),
|
|
12
|
+
* items after it as upcoming (future). When omitted, all items are future.
|
|
13
|
+
*/
|
|
14
|
+
activeIndex?: number;
|
|
15
|
+
/**
|
|
16
|
+
* Visual variant. `card` wraps the timeline in card borders and padding.
|
|
17
|
+
* @default default
|
|
18
|
+
*/
|
|
19
|
+
variant?: TimelineVariant;
|
|
20
|
+
/**
|
|
21
|
+
* Vertical padding of each item in the `card` variant, in rem (same scale as
|
|
22
|
+
* `Card`). Both the gaps between items and the card's top/bottom edges resolve
|
|
23
|
+
* to twice this value. Horizontal item padding is fixed at the card default.
|
|
24
|
+
* @default 0.5
|
|
25
|
+
*/
|
|
26
|
+
cardPadding?: number;
|
|
27
|
+
/**
|
|
28
|
+
* Additional class name.
|
|
29
|
+
*/
|
|
30
|
+
className?: string;
|
|
31
|
+
}
|
|
32
|
+
export declare const Timeline: {
|
|
33
|
+
({ children, activeIndex, variant, cardPadding, className, }: TimelineProps): JSX.Element;
|
|
34
|
+
displayName: string;
|
|
35
|
+
Item: {
|
|
36
|
+
({ children, timings, timingsBottom, state, isLast, }: TimelineItemProps): JSX.Element;
|
|
37
|
+
displayName: string;
|
|
38
|
+
};
|
|
39
|
+
Title: {
|
|
40
|
+
({ children, color, className }: import('.').TimelineTitleProps): JSX.Element;
|
|
41
|
+
displayName: string;
|
|
42
|
+
};
|
|
43
|
+
Description: {
|
|
44
|
+
({ children, color, className, }: import('.').TimelineDescriptionProps): JSX.Element;
|
|
45
|
+
displayName: string;
|
|
46
|
+
};
|
|
47
|
+
};
|
|
48
|
+
export default Timeline;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { jsx as y } from "react/jsx-runtime";
|
|
2
|
+
import E from "../../../../../external/classnames/index.es.js";
|
|
3
|
+
import { Children as l, cloneElement as N, isValidElement as v } from "react";
|
|
4
|
+
import { TimelineDescription as C } from "./components/timeline-description/timeline-description.es.js";
|
|
5
|
+
import { TimelineItem as a } from "./components/timeline-item/timeline-item.es.js";
|
|
6
|
+
import { TimelineTitle as D } from "./components/timeline-title/timeline-title.es.js";
|
|
7
|
+
import p from "./timeline.module.scss.es.js";
|
|
8
|
+
const f = (e) => v(e) && e.type === a, I = (e, t) => t === void 0 ? "future" : e === t ? "current" : e < t ? "past" : "future", i = ({
|
|
9
|
+
children: e,
|
|
10
|
+
activeIndex: t,
|
|
11
|
+
variant: m = "default",
|
|
12
|
+
cardPadding: o,
|
|
13
|
+
className: u
|
|
14
|
+
}) => {
|
|
15
|
+
const c = l.toArray(e).filter(f).length;
|
|
16
|
+
let n = -1;
|
|
17
|
+
const d = l.map(e, (r) => {
|
|
18
|
+
if (!f(r)) return r;
|
|
19
|
+
n += 1;
|
|
20
|
+
const s = n;
|
|
21
|
+
return N(r, { state: I(s, t), isLast: s === c - 1 });
|
|
22
|
+
}), T = m === "card" && o !== void 0 ? { "--tedi-timeline-card-padding": `${o}rem` } : void 0;
|
|
23
|
+
return /* @__PURE__ */ y(
|
|
24
|
+
"div",
|
|
25
|
+
{
|
|
26
|
+
className: E(p["tedi-timeline"], { [p["tedi-timeline--card"]]: m === "card" }, u),
|
|
27
|
+
style: T,
|
|
28
|
+
children: d
|
|
29
|
+
}
|
|
30
|
+
);
|
|
31
|
+
};
|
|
32
|
+
i.displayName = "Timeline";
|
|
33
|
+
i.Item = a;
|
|
34
|
+
i.Title = D;
|
|
35
|
+
i.Description = C;
|
|
36
|
+
export {
|
|
37
|
+
i as Timeline
|
|
38
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-timeline":"tedi-timeline-9ae74ae2","tedi-timeline--card":"tedi-timeline--card-a2e3bd66","tedi-timeline-item":"tedi-timeline-item-e902dd23","tedi-timeline__timings":"tedi-timeline__timings-546bfe94","tedi-timeline__info":"tedi-timeline__info-32fd4662","tedi-timeline__timings-bottom":"tedi-timeline__timings-bottom-3f346e9e","tedi-timeline__marker":"tedi-timeline__marker-38b5128b","tedi-timeline__item--has-bottom":"tedi-timeline__item--has-bottom-02d25709","tedi-timeline__time":"tedi-timeline__time-402ebe78","tedi-timeline__marker--large":"tedi-timeline__marker--large-c0c1e1b6","tedi-timeline__content":"tedi-timeline__content-a273bf25","tedi-timeline-title":"tedi-timeline-title-9c5618a5","tedi-timeline-description":"tedi-timeline-description-108c70de"};exports.default=e;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
const e = {
|
|
2
|
+
"tedi-timeline": "tedi-timeline-9ae74ae2",
|
|
3
|
+
"tedi-timeline--card": "tedi-timeline--card-a2e3bd66",
|
|
4
|
+
"tedi-timeline-item": "tedi-timeline-item-e902dd23",
|
|
5
|
+
"tedi-timeline__timings": "tedi-timeline__timings-546bfe94",
|
|
6
|
+
"tedi-timeline__info": "tedi-timeline__info-32fd4662",
|
|
7
|
+
"tedi-timeline__timings-bottom": "tedi-timeline__timings-bottom-3f346e9e",
|
|
8
|
+
"tedi-timeline__marker": "tedi-timeline__marker-38b5128b",
|
|
9
|
+
"tedi-timeline__item--has-bottom": "tedi-timeline__item--has-bottom-02d25709",
|
|
10
|
+
"tedi-timeline__time": "tedi-timeline__time-402ebe78",
|
|
11
|
+
"tedi-timeline__marker--large": "tedi-timeline__marker--large-c0c1e1b6",
|
|
12
|
+
"tedi-timeline__content": "tedi-timeline__content-a273bf25",
|
|
13
|
+
"tedi-timeline-title": "tedi-timeline-title-9c5618a5",
|
|
14
|
+
"tedi-timeline-description": "tedi-timeline-description-108c70de"
|
|
15
|
+
};
|
|
16
|
+
export {
|
|
17
|
+
e as default
|
|
18
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("../../../../../external/classnames/index.cjs.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("../../../../../external/classnames/index.cjs.js"),l=require("react"),S=require("../../base/icon/icon.cjs.js"),M=require("../../buttons/button/button.cjs.js"),t=require("./breadcrumbs.module.scss.cjs.js"),P=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),D=require("../../../providers/label-provider/use-labels.cjs.js"),d=require("../../overlays/dropdown/dropdown.cjs.js"),y=i=>{const o=[];return l.Children.forEach(i,a=>{if(l.isValidElement(a)){if(a.type===l.Fragment){o.push(...y(a.props.children));return}o.push(a)}}),o},E=e.jsx(S.Icon,{name:"chevron_right",size:16,color:"brand"}),N=i=>{const{children:o,ariaLabel:a,showMoreLabel:k,separator:w=E,className:p}=i,{getCurrentBreakpointProps:B}=P.useBreakpointProps(i.defaultServerBreakpoint),{variant:q="long",maxItems:h,itemsBeforeCollapse:v=1,itemsAfterCollapse:C=1}=B(i),{getLabel:f}=D.useLabels(),x=a??f("breadcrumbs"),L=k??f("breadcrumbs.show-more"),s=y(o);if(s.length===0)return null;if(q==="short"){if(s.length<2)return null;const r=s[s.length-2],c=r.props,n=typeof r.type!="string"&&c.iconLeft===void 0?l.cloneElement(r,{iconLeft:"arrow_back"}):r;return e.jsx("nav",{"aria-label":x,className:b.default(t.default["tedi-breadcrumbs"],p),children:e.jsx("ol",{className:t.default["tedi-breadcrumbs__list"],children:e.jsx("li",{className:t.default["tedi-breadcrumbs__item"],children:n})})})}const u=Math.max(0,v),m=Math.max(1,C),g=h!==void 0&&s.length>h&&s.length>u+m?[...s.slice(0,u).map(r=>({kind:"item",element:r})),{kind:"ellipsis",hidden:s.slice(u,s.length-m)},...s.slice(s.length-m).map(r=>({kind:"item",element:r}))]:s.map(r=>({kind:"item",element:r})),j=g.length-1;return e.jsx("nav",{"aria-label":x,className:b.default(t.default["tedi-breadcrumbs"],p),children:e.jsx("ol",{className:t.default["tedi-breadcrumbs__list"],children:g.map((r,c)=>e.jsxs(l.Fragment,{children:[r.kind==="item"?e.jsx("li",{className:b.default(t.default["tedi-breadcrumbs__item"],{[t.default["tedi-breadcrumbs__current"]]:c===j}),children:r.element}):e.jsx("li",{className:t.default["tedi-breadcrumbs__item"],children:e.jsxs(d.Dropdown,{children:[e.jsx(d.Dropdown.Trigger,{children:e.jsxs(M.Button,{noStyle:!0,className:t.default["tedi-breadcrumbs__ellipsis"],children:[e.jsx("span",{"aria-hidden":"true",children:"…"}),e.jsx("span",{className:"sr-only",children:L})]})}),e.jsx(d.Dropdown.Content,{children:r.hidden.map((n,_)=>{const I=typeof n.type!="string"?l.cloneElement(n,{noStyle:!0}):n;return e.jsx(d.Dropdown.Item,{index:_,asChild:!0,children:I},n.key??_)})})]})}),c<j&&e.jsx("li",{className:t.default["tedi-breadcrumbs__separator"],"aria-hidden":"true",children:w})]},c))})})};N.displayName="Breadcrumbs";exports.Breadcrumbs=N;
|
|
@@ -1,37 +1,37 @@
|
|
|
1
1
|
import { jsx as r, jsxs as p } from "react/jsx-runtime";
|
|
2
|
-
import
|
|
3
|
-
import { cloneElement as
|
|
4
|
-
import { Icon as
|
|
5
|
-
import { Button as
|
|
2
|
+
import u from "../../../../../external/classnames/index.es.js";
|
|
3
|
+
import { cloneElement as k, Fragment as C, Children as P, isValidElement as j } from "react";
|
|
4
|
+
import { Icon as A } from "../../base/icon/icon.es.js";
|
|
5
|
+
import { Button as T } from "../../buttons/button/button.es.js";
|
|
6
6
|
import s from "./breadcrumbs.module.scss.es.js";
|
|
7
|
-
import { useBreakpointProps as
|
|
8
|
-
import { useLabels as
|
|
7
|
+
import { useBreakpointProps as z } from "../../../helpers/hooks/use-breakpoint-props.es.js";
|
|
8
|
+
import { useLabels as D } from "../../../providers/label-provider/use-labels.es.js";
|
|
9
9
|
import { Dropdown as c } from "../../overlays/dropdown/dropdown.es.js";
|
|
10
10
|
const v = (l) => {
|
|
11
|
-
const
|
|
11
|
+
const i = [];
|
|
12
12
|
return P.forEach(l, (a) => {
|
|
13
|
-
if (
|
|
14
|
-
if (a.type ===
|
|
15
|
-
|
|
13
|
+
if (j(a)) {
|
|
14
|
+
if (a.type === C) {
|
|
15
|
+
i.push(...v(a.props.children));
|
|
16
16
|
return;
|
|
17
17
|
}
|
|
18
|
-
|
|
18
|
+
i.push(a);
|
|
19
19
|
}
|
|
20
|
-
}),
|
|
21
|
-
},
|
|
22
|
-
const { children:
|
|
23
|
-
variant:
|
|
20
|
+
}), i;
|
|
21
|
+
}, F = /* @__PURE__ */ r(A, { name: "chevron_right", size: 16, color: "brand" }), V = (l) => {
|
|
22
|
+
const { children: i, ariaLabel: a, showMoreLabel: B, separator: L = F, className: h } = l, { getCurrentBreakpointProps: w } = z(l.defaultServerBreakpoint), {
|
|
23
|
+
variant: x = "long",
|
|
24
24
|
maxItems: b,
|
|
25
|
-
itemsBeforeCollapse:
|
|
26
|
-
itemsAfterCollapse:
|
|
27
|
-
} =
|
|
25
|
+
itemsBeforeCollapse: I = 1,
|
|
26
|
+
itemsAfterCollapse: M = 1
|
|
27
|
+
} = w(l), { getLabel: f } = D(), _ = a ?? f("breadcrumbs"), S = B ?? f("breadcrumbs.show-more"), t = v(i);
|
|
28
28
|
if (t.length === 0) return null;
|
|
29
|
-
if (
|
|
29
|
+
if (x === "short") {
|
|
30
30
|
if (t.length < 2) return null;
|
|
31
|
-
const e = t[t.length - 2],
|
|
32
|
-
return /* @__PURE__ */ r("nav", { "aria-label": _, className:
|
|
31
|
+
const e = t[t.length - 2], o = e.props, n = typeof e.type != "string" && o.iconLeft === void 0 ? k(e, { iconLeft: "arrow_back" }) : e;
|
|
32
|
+
return /* @__PURE__ */ r("nav", { "aria-label": _, className: u(s["tedi-breadcrumbs"], h), children: /* @__PURE__ */ r("ol", { className: s["tedi-breadcrumbs__list"], children: /* @__PURE__ */ r("li", { className: s["tedi-breadcrumbs__item"], children: n }) }) });
|
|
33
33
|
}
|
|
34
|
-
const m = Math.max(0,
|
|
34
|
+
const m = Math.max(0, I), d = Math.max(1, M), g = b !== void 0 && t.length > b && t.length > m + d ? [
|
|
35
35
|
...t.slice(0, m).map((e) => ({ kind: "item", element: e })),
|
|
36
36
|
{
|
|
37
37
|
kind: "ellipsis",
|
|
@@ -39,26 +39,29 @@ const v = (l) => {
|
|
|
39
39
|
},
|
|
40
40
|
...t.slice(t.length - d).map((e) => ({ kind: "item", element: e }))
|
|
41
41
|
] : t.map((e) => ({ kind: "item", element: e })), N = g.length - 1;
|
|
42
|
-
return /* @__PURE__ */ r("nav", { "aria-label": _, className:
|
|
42
|
+
return /* @__PURE__ */ r("nav", { "aria-label": _, className: u(s["tedi-breadcrumbs"], h), children: /* @__PURE__ */ r("ol", { className: s["tedi-breadcrumbs__list"], children: g.map((e, o) => /* @__PURE__ */ p(C, { children: [
|
|
43
43
|
e.kind === "item" ? /* @__PURE__ */ r(
|
|
44
44
|
"li",
|
|
45
45
|
{
|
|
46
|
-
className:
|
|
47
|
-
[s["tedi-breadcrumbs__current"]]:
|
|
46
|
+
className: u(s["tedi-breadcrumbs__item"], {
|
|
47
|
+
[s["tedi-breadcrumbs__current"]]: o === N
|
|
48
48
|
}),
|
|
49
49
|
children: e.element
|
|
50
50
|
}
|
|
51
51
|
) : /* @__PURE__ */ r("li", { className: s["tedi-breadcrumbs__item"], children: /* @__PURE__ */ p(c, { children: [
|
|
52
|
-
/* @__PURE__ */ r(c.Trigger, { children: /* @__PURE__ */ p(
|
|
52
|
+
/* @__PURE__ */ r(c.Trigger, { children: /* @__PURE__ */ p(T, { noStyle: !0, className: s["tedi-breadcrumbs__ellipsis"], children: [
|
|
53
53
|
/* @__PURE__ */ r("span", { "aria-hidden": "true", children: "…" }),
|
|
54
|
-
/* @__PURE__ */ r("span", { className: "sr-only", children:
|
|
54
|
+
/* @__PURE__ */ r("span", { className: "sr-only", children: S })
|
|
55
55
|
] }) }),
|
|
56
|
-
/* @__PURE__ */ r(c.Content, { children: e.hidden.map((
|
|
56
|
+
/* @__PURE__ */ r(c.Content, { children: e.hidden.map((n, y) => {
|
|
57
|
+
const E = typeof n.type != "string" ? k(n, { noStyle: !0 }) : n;
|
|
58
|
+
return /* @__PURE__ */ r(c.Item, { index: y, asChild: !0, children: E }, n.key ?? y);
|
|
59
|
+
}) })
|
|
57
60
|
] }) }),
|
|
58
|
-
|
|
59
|
-
] },
|
|
61
|
+
o < N && /* @__PURE__ */ r("li", { className: s["tedi-breadcrumbs__separator"], "aria-hidden": "true", children: L })
|
|
62
|
+
] }, o)) }) });
|
|
60
63
|
};
|
|
61
|
-
|
|
64
|
+
V.displayName = "Breadcrumbs";
|
|
62
65
|
export {
|
|
63
|
-
|
|
66
|
+
V as Breadcrumbs
|
|
64
67
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),M=require("../../../../../../../external/classnames/index.cjs.js"),n=require("react"),C=require("../../../../base/typography/text/text.cjs.js"),T=require("../../../../buttons/collapse-button/collapse-button.cjs.js"),u=require("../../table-of-contents.cjs.js"),t=require("../../table-of-contents.module.scss.cjs.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),M=require("../../../../../../../external/classnames/index.cjs.js"),n=require("react"),C=require("../../../../base/typography/text/text.cjs.js"),T=require("../../../../buttons/collapse-button/collapse-button.cjs.js"),u=require("../../table-of-contents.cjs.js"),t=require("../../table-of-contents.module.scss.cjs.js"),y=require("../table-of-contents-list/table-of-contents-list.cjs.js"),B=require("../../../../../providers/label-provider/use-labels.cjs.js"),c=require("../../../../overlays/modal/modal.cjs.js"),g=j=>{const{children:f,heading:b,ariaLabel:_,activeId:o,numbered:x=!1,sticky:O=!0,className:q}=j,{getLabel:s}=B.useLabels(),[l,a]=n.useState(!1),h=n.useRef(null);n.useEffect(()=>{const d=h.current;if(!l||!d)return;const v=N=>{N.target.closest("a, button")&&a(!1)};return d.addEventListener("click",v),()=>d.removeEventListener("click",v)},[l]);const i=(b===void 0?s("table-of-contents.title"):b)??s("table-of-contents.title"),m=_||i,r=n.useMemo(()=>u.childrenToNodes(f),[f]),p=n.useMemo(()=>u.buildActiveTrail(r,o),[r,o]),L=n.useMemo(()=>({activeId:o,numbered:x,ariaLabel:m,activeTrail:p}),[o,x,m,p]);return e.jsxs(u.TableOfContentsContext.Provider,{value:L,children:[e.jsxs("div",{className:M.default(t.default["tedi-table-of-contents__bar"],{[t.default["tedi-table-of-contents__bar--static"]]:!O},q),children:[e.jsx(C.Text,{modifiers:"bold",className:t.default["tedi-table-of-contents__bar-title"],children:i}),e.jsx(T.CollapseButton,{open:l,onOpenChange:a,openText:s("open"),closeText:s("close"),underline:!1,"aria-haspopup":"dialog"})]}),e.jsx(c.Modal,{open:l,onToggle:a,children:e.jsxs(c.Modal.Content,{position:"bottom",fullscreen:"edge","aria-label":i,className:t.default["tedi-table-of-contents__sheet"],children:[e.jsx(c.Modal.Header,{closeButton:!1,children:e.jsxs("div",{className:t.default["tedi-table-of-contents__sheet-header"],children:[e.jsx(C.Text,{modifiers:"bold",className:t.default["tedi-table-of-contents__bar-title"],children:i}),e.jsx(T.CollapseButton,{open:l,onOpenChange:a,openText:s("open"),closeText:s("close"),underline:!1})]})}),e.jsx(c.Modal.Body,{children:e.jsx("div",{ref:h,className:t.default["tedi-table-of-contents"],children:e.jsx(y.TableOfContentsList,{nodes:r,heading:null})})})]})})]})};g.displayName="TableOfContentsCollapsible";exports.TableOfContentsCollapsible=g;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TableOfContentsProps } from '../../table-of-contents';
|
|
2
|
-
export interface TableOfContentsCollapsibleProps extends Pick<TableOfContentsProps, 'children' | 'heading' | '
|
|
2
|
+
export interface TableOfContentsCollapsibleProps extends Pick<TableOfContentsProps, 'children' | 'heading' | 'ariaLabel' | 'activeId' | 'numbered' | 'className'> {
|
|
3
3
|
/**
|
|
4
4
|
* Pin the bar to the bottom of the viewport. Set `false` to render it inline.
|
|
5
5
|
* @default true
|
|
@@ -1,43 +1,43 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import
|
|
3
|
-
import { useState as
|
|
1
|
+
import { jsxs as i, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import k from "../../../../../../../external/classnames/index.es.js";
|
|
3
|
+
import { useState as B, useRef as E, useEffect as H, useMemo as f } from "react";
|
|
4
4
|
import { Text as T } from "../../../../base/typography/text/text.es.js";
|
|
5
5
|
import { CollapseButton as _ } from "../../../../buttons/collapse-button/collapse-button.es.js";
|
|
6
|
-
import { childrenToNodes as
|
|
6
|
+
import { childrenToNodes as j, buildActiveTrail as M, TableOfContentsContext as R } from "../../table-of-contents.es.js";
|
|
7
7
|
import t from "../../table-of-contents.module.scss.es.js";
|
|
8
|
-
import { TableOfContentsList as
|
|
9
|
-
import { useLabels as
|
|
10
|
-
import { Modal as
|
|
11
|
-
const
|
|
12
|
-
const { children: m, heading: b,
|
|
13
|
-
|
|
14
|
-
const d =
|
|
8
|
+
import { TableOfContentsList as A } from "../table-of-contents-list/table-of-contents-list.es.js";
|
|
9
|
+
import { useLabels as I } from "../../../../../providers/label-provider/use-labels.es.js";
|
|
10
|
+
import { Modal as r } from "../../../../overlays/modal/modal.es.js";
|
|
11
|
+
const P = (C) => {
|
|
12
|
+
const { children: m, heading: b, ariaLabel: N, activeId: l, numbered: p = !1, sticky: x = !0, className: L } = C, { getLabel: o } = I(), [n, s] = B(!1), u = E(null);
|
|
13
|
+
H(() => {
|
|
14
|
+
const d = u.current;
|
|
15
15
|
if (!n || !d) return;
|
|
16
|
-
const g = (
|
|
17
|
-
|
|
16
|
+
const g = (y) => {
|
|
17
|
+
y.target.closest("a, button") && s(!1);
|
|
18
18
|
};
|
|
19
19
|
return d.addEventListener("click", g), () => d.removeEventListener("click", g);
|
|
20
20
|
}, [n]);
|
|
21
|
-
const
|
|
22
|
-
() => ({ activeId:
|
|
23
|
-
[
|
|
24
|
-
)
|
|
25
|
-
return /* @__PURE__ */
|
|
26
|
-
/* @__PURE__ */
|
|
21
|
+
const a = (b === void 0 ? o("table-of-contents.title") : b) ?? o("table-of-contents.title"), h = N || a, c = f(() => j(m), [m]), v = f(() => M(c, l), [c, l]), O = f(
|
|
22
|
+
() => ({ activeId: l, numbered: p, ariaLabel: h, activeTrail: v }),
|
|
23
|
+
[l, p, h, v]
|
|
24
|
+
);
|
|
25
|
+
return /* @__PURE__ */ i(R.Provider, { value: O, children: [
|
|
26
|
+
/* @__PURE__ */ i(
|
|
27
27
|
"div",
|
|
28
28
|
{
|
|
29
|
-
className:
|
|
29
|
+
className: k(
|
|
30
30
|
t["tedi-table-of-contents__bar"],
|
|
31
|
-
{ [t["tedi-table-of-contents__bar--static"]]: !
|
|
32
|
-
|
|
31
|
+
{ [t["tedi-table-of-contents__bar--static"]]: !x },
|
|
32
|
+
L
|
|
33
33
|
),
|
|
34
34
|
children: [
|
|
35
|
-
/* @__PURE__ */ e(T, { modifiers: "bold", className: t["tedi-table-of-contents__bar-title"], children:
|
|
35
|
+
/* @__PURE__ */ e(T, { modifiers: "bold", className: t["tedi-table-of-contents__bar-title"], children: a }),
|
|
36
36
|
/* @__PURE__ */ e(
|
|
37
37
|
_,
|
|
38
38
|
{
|
|
39
39
|
open: n,
|
|
40
|
-
onOpenChange:
|
|
40
|
+
onOpenChange: s,
|
|
41
41
|
openText: o("open"),
|
|
42
42
|
closeText: o("close"),
|
|
43
43
|
underline: !1,
|
|
@@ -47,34 +47,34 @@ const w = (C) => {
|
|
|
47
47
|
]
|
|
48
48
|
}
|
|
49
49
|
),
|
|
50
|
-
/* @__PURE__ */ e(
|
|
51
|
-
|
|
50
|
+
/* @__PURE__ */ e(r, { open: n, onToggle: s, children: /* @__PURE__ */ i(
|
|
51
|
+
r.Content,
|
|
52
52
|
{
|
|
53
53
|
position: "bottom",
|
|
54
54
|
fullscreen: "edge",
|
|
55
|
-
"aria-label":
|
|
55
|
+
"aria-label": a,
|
|
56
56
|
className: t["tedi-table-of-contents__sheet"],
|
|
57
57
|
children: [
|
|
58
|
-
/* @__PURE__ */ e(
|
|
59
|
-
/* @__PURE__ */ e(T, { modifiers: "bold", className: t["tedi-table-of-contents__bar-title"], children:
|
|
58
|
+
/* @__PURE__ */ e(r.Header, { closeButton: !1, children: /* @__PURE__ */ i("div", { className: t["tedi-table-of-contents__sheet-header"], children: [
|
|
59
|
+
/* @__PURE__ */ e(T, { modifiers: "bold", className: t["tedi-table-of-contents__bar-title"], children: a }),
|
|
60
60
|
/* @__PURE__ */ e(
|
|
61
61
|
_,
|
|
62
62
|
{
|
|
63
63
|
open: n,
|
|
64
|
-
onOpenChange:
|
|
64
|
+
onOpenChange: s,
|
|
65
65
|
openText: o("open"),
|
|
66
66
|
closeText: o("close"),
|
|
67
67
|
underline: !1
|
|
68
68
|
}
|
|
69
69
|
)
|
|
70
70
|
] }) }),
|
|
71
|
-
/* @__PURE__ */ e(
|
|
71
|
+
/* @__PURE__ */ e(r.Body, { children: /* @__PURE__ */ e("div", { ref: u, className: t["tedi-table-of-contents"], children: /* @__PURE__ */ e(A, { nodes: c, heading: null }) }) })
|
|
72
72
|
]
|
|
73
73
|
}
|
|
74
74
|
) })
|
|
75
75
|
] });
|
|
76
76
|
};
|
|
77
|
-
|
|
77
|
+
P.displayName = "TableOfContentsCollapsible";
|
|
78
78
|
export {
|
|
79
|
-
|
|
79
|
+
P as TableOfContentsCollapsible
|
|
80
80
|
};
|
|
@@ -11,20 +11,10 @@ export interface TableOfContentsItemProps {
|
|
|
11
11
|
* `TableOfContents.Item` children, which become this item's sub-items.
|
|
12
12
|
*/
|
|
13
13
|
children?: React.ReactNode;
|
|
14
|
-
/**
|
|
15
|
-
* Validation state for multistep-form usage (only rendered with `showIcons`
|
|
16
|
-
* on the parent): `true` = valid, `false` = invalid, `undefined` = not yet
|
|
17
|
-
* validated.
|
|
18
|
-
*/
|
|
19
|
-
isValid?: boolean;
|
|
20
14
|
/**
|
|
21
15
|
* Render a separator below the item.
|
|
22
16
|
*/
|
|
23
17
|
separator?: boolean;
|
|
24
|
-
/**
|
|
25
|
-
* Hide the validation glyph for this item even when `showIcons` is on.
|
|
26
|
-
*/
|
|
27
|
-
hideIcon?: boolean;
|
|
28
18
|
}
|
|
29
19
|
export declare const TableOfContentsItem: {
|
|
30
20
|
(_props: TableOfContentsItemProps): JSX.Element | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("../../../../../../../external/classnames/index.cjs.js"),i=require("react"),C=require("../../../../base/typography/heading/heading.cjs.js"),h=require("../../table-of-contents.cjs.js"),s=require("../../table-of-contents.module.scss.cjs.js"),L=require("../table-of-contents-row/table-of-contents-row.cjs.js"),O=require("../../../../../providers/label-provider/use-labels.cjs.js"),r=({nodes:d,heading:t})=>{const{numbered:c,headingLevel:u="h3",ariaLabel:n}=i.useContext(h.TableOfContentsContext),{getLabel:b}=O.useLabels(),l=i.useId(),f=c?"ol":"ul";return e.jsxs(e.Fragment,{children:[t&&e.jsx(C.Heading,{element:u,modifiers:"h4",id:l,className:s.default["tedi-table-of-contents__heading"],children:t}),e.jsx("nav",{"aria-labelledby":!n&&t?l:void 0,"aria-label":n||(t?void 0:b("table-of-contents.title")),children:e.jsx(f,{className:m.default(s.default["tedi-table-of-contents__list"],{[s.default["tedi-table-of-contents__list--headless"]]:!t}),children:d.map((a,o)=>e.jsx(L.TableOfContentsRow,{node:a,depth:1,index:o},a.id??o))})})]})};r.displayName="TableOfContentsList";exports.TableOfContentsList=r;
|
|
@@ -1,34 +1,43 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import
|
|
3
|
-
import { useContext as
|
|
4
|
-
import { Heading as
|
|
5
|
-
import { TableOfContentsContext as
|
|
1
|
+
import { jsxs as c, Fragment as b, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import p from "../../../../../../../external/classnames/index.es.js";
|
|
3
|
+
import { useContext as h, useId as L } from "react";
|
|
4
|
+
import { Heading as u } from "../../../../base/typography/heading/heading.es.js";
|
|
5
|
+
import { TableOfContentsContext as C } from "../../table-of-contents.es.js";
|
|
6
6
|
import o from "../../table-of-contents.module.scss.es.js";
|
|
7
|
-
import { TableOfContentsRow as
|
|
8
|
-
import { useLabels as
|
|
9
|
-
const
|
|
10
|
-
const { numbered: r } =
|
|
11
|
-
return /* @__PURE__ */
|
|
12
|
-
t && /* @__PURE__ */ e(
|
|
7
|
+
import { TableOfContentsRow as _ } from "../table-of-contents-row/table-of-contents-row.es.js";
|
|
8
|
+
import { useLabels as v } from "../../../../../providers/label-provider/use-labels.es.js";
|
|
9
|
+
const x = ({ nodes: n, heading: t }) => {
|
|
10
|
+
const { numbered: r, headingLevel: m = "h3", ariaLabel: s } = h(C), { getLabel: d } = v(), l = L(), f = r ? "ol" : "ul";
|
|
11
|
+
return /* @__PURE__ */ c(b, { children: [
|
|
12
|
+
t && /* @__PURE__ */ e(
|
|
13
|
+
u,
|
|
14
|
+
{
|
|
15
|
+
element: m,
|
|
16
|
+
modifiers: "h4",
|
|
17
|
+
id: l,
|
|
18
|
+
className: o["tedi-table-of-contents__heading"],
|
|
19
|
+
children: t
|
|
20
|
+
}
|
|
21
|
+
),
|
|
13
22
|
/* @__PURE__ */ e(
|
|
14
23
|
"nav",
|
|
15
24
|
{
|
|
16
|
-
"aria-labelledby": t ?
|
|
17
|
-
"aria-label": t ? void 0 :
|
|
25
|
+
"aria-labelledby": !s && t ? l : void 0,
|
|
26
|
+
"aria-label": s || (t ? void 0 : d("table-of-contents.title")),
|
|
18
27
|
children: /* @__PURE__ */ e(
|
|
19
|
-
|
|
28
|
+
f,
|
|
20
29
|
{
|
|
21
|
-
className:
|
|
30
|
+
className: p(o["tedi-table-of-contents__list"], {
|
|
22
31
|
[o["tedi-table-of-contents__list--headless"]]: !t
|
|
23
32
|
}),
|
|
24
|
-
children:
|
|
33
|
+
children: n.map((a, i) => /* @__PURE__ */ e(_, { node: a, depth: 1, index: i }, a.id ?? i))
|
|
25
34
|
}
|
|
26
35
|
)
|
|
27
36
|
}
|
|
28
37
|
)
|
|
29
38
|
] });
|
|
30
39
|
};
|
|
31
|
-
|
|
40
|
+
x.displayName = "TableOfContentsList";
|
|
32
41
|
export {
|
|
33
|
-
|
|
42
|
+
x as TableOfContentsList
|
|
34
43
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("../../../../../../../external/classnames/index.cjs.js"),N=require("react"),T=require("../../../../misc/separator/separator.cjs.js"),w=require("../../table-of-contents.cjs.js"),t=require("../../table-of-contents.module.scss.cjs.js"),r=({node:m,depth:c,index:i,numberPrefix:a})=>{const{activeId:_,numbered:o,activeTrail:p}=N.useContext(w.TableOfContentsContext),{id:n,content:x,children:s,separator:j}=m,C=!!(s!=null&&s.length),d=!!n&&n===_,h=C&&!!n&&p.has(n),O=Math.min(c,2),l=a?`${a}.${i+1}`:`${i+1}`,v=a?l:`${l}.`,q=o?"ol":"ul";return e.jsxs("li",{"aria-current":d?"true":void 0,className:b.default(t.default["tedi-table-of-contents__item"],{[t.default["tedi-table-of-contents__item--selected"]]:d}),children:[e.jsxs("span",{className:b.default(t.default["tedi-table-of-contents__row"],t.default[`tedi-table-of-contents__row--level-${O}`]),children:[o&&e.jsx("span",{className:t.default["tedi-table-of-contents__number"],"aria-hidden":"true",children:v}),e.jsx("span",{className:t.default["tedi-table-of-contents__content"],children:x})]}),h&&e.jsx(q,{className:t.default["tedi-table-of-contents__group"],children:s.map((u,f)=>e.jsx(r,{node:u,depth:c+1,index:f,numberPrefix:o?l:void 0},u.id??f))}),j&&e.jsx(T.Separator,{})]})};r.displayName="TableOfContentsRow";exports.TableOfContentsRow=r;
|
|
@@ -1,54 +1,40 @@
|
|
|
1
|
-
import { jsxs as p, jsx as
|
|
2
|
-
import
|
|
3
|
-
import { useContext as
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
const _ = ({ node: u, depth: r, index: i, numberPrefix: a }) => {
|
|
10
|
-
const { activeId: h, showIcons: v, numbered: l, activeTrail: N } = j(S), { getLabel: w } = k(), { id: n, content: C, children: s, isValid: t, separator: g, hideIcon: $ } = u, O = !!(s != null && s.length), m = !!n && n === h, T = O && !!n && N.has(n), x = Math.min(r, 2), c = a ? `${a}.${i + 1}` : `${i + 1}`, y = a ? c : `${c}.`, I = l ? "ol" : "ul";
|
|
1
|
+
import { jsxs as p, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import f from "../../../../../../../external/classnames/index.es.js";
|
|
3
|
+
import { useContext as x } from "react";
|
|
4
|
+
import { Separator as g } from "../../../../misc/separator/separator.es.js";
|
|
5
|
+
import { TableOfContentsContext as j } from "../../table-of-contents.es.js";
|
|
6
|
+
import t from "../../table-of-contents.module.scss.es.js";
|
|
7
|
+
const _ = ({ node: b, depth: i, index: l, numberPrefix: s }) => {
|
|
8
|
+
const { activeId: u, numbered: a, activeTrail: h } = x(j), { id: o, content: N, children: n, separator: v } = b, C = !!(n != null && n.length), c = !!o && o === u, $ = C && !!o && h.has(o), w = Math.min(i, 2), r = s ? `${s}.${l + 1}` : `${l + 1}`, O = s ? r : `${r}.`, T = a ? "ol" : "ul";
|
|
11
9
|
return /* @__PURE__ */ p(
|
|
12
10
|
"li",
|
|
13
11
|
{
|
|
14
|
-
"aria-current":
|
|
15
|
-
className:
|
|
16
|
-
[
|
|
12
|
+
"aria-current": c ? "true" : void 0,
|
|
13
|
+
className: f(t["tedi-table-of-contents__item"], {
|
|
14
|
+
[t["tedi-table-of-contents__item--selected"]]: c
|
|
17
15
|
}),
|
|
18
16
|
children: [
|
|
19
17
|
/* @__PURE__ */ p(
|
|
20
18
|
"span",
|
|
21
19
|
{
|
|
22
|
-
className:
|
|
20
|
+
className: f(t["tedi-table-of-contents__row"], t[`tedi-table-of-contents__row--level-${w}`]),
|
|
23
21
|
children: [
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
{
|
|
27
|
-
className: e["tedi-table-of-contents__icon"],
|
|
28
|
-
name: t === !1 ? "warning" : t === !0 ? "check" : "circle",
|
|
29
|
-
color: t === !1 ? "danger" : t === !0 ? "success" : "tertiary",
|
|
30
|
-
label: w(
|
|
31
|
-
t === !1 ? "table-of-contents.step-invalid" : t === !0 ? "table-of-contents.step-valid" : "table-of-contents.step-incomplete"
|
|
32
|
-
),
|
|
33
|
-
size: 18
|
|
34
|
-
}
|
|
35
|
-
),
|
|
36
|
-
l && /* @__PURE__ */ o("span", { className: e["tedi-table-of-contents__number"], "aria-hidden": "true", children: y }),
|
|
37
|
-
/* @__PURE__ */ o("span", { className: e["tedi-table-of-contents__content"], children: C })
|
|
22
|
+
a && /* @__PURE__ */ e("span", { className: t["tedi-table-of-contents__number"], "aria-hidden": "true", children: O }),
|
|
23
|
+
/* @__PURE__ */ e("span", { className: t["tedi-table-of-contents__content"], children: N })
|
|
38
24
|
]
|
|
39
25
|
}
|
|
40
26
|
),
|
|
41
|
-
|
|
27
|
+
$ && /* @__PURE__ */ e(T, { className: t["tedi-table-of-contents__group"], children: n.map((m, d) => /* @__PURE__ */ e(
|
|
42
28
|
_,
|
|
43
29
|
{
|
|
44
|
-
node:
|
|
45
|
-
depth:
|
|
46
|
-
index:
|
|
47
|
-
numberPrefix:
|
|
30
|
+
node: m,
|
|
31
|
+
depth: i + 1,
|
|
32
|
+
index: d,
|
|
33
|
+
numberPrefix: a ? r : void 0
|
|
48
34
|
},
|
|
49
|
-
|
|
35
|
+
m.id ?? d
|
|
50
36
|
)) }),
|
|
51
|
-
|
|
37
|
+
v && /* @__PURE__ */ e(g, {})
|
|
52
38
|
]
|
|
53
39
|
}
|
|
54
40
|
);
|