@agregio-solutions/design-system 2.2.0 → 2.3.1

package/dist/components/TimeField/TimeField.js

@@ -0,0 +1,58 @@
+"use client";
+import e from "../../internal-components/FormGroupWrapper/FormGroupWrapper.js";
+import t from "../../internal/getNatureFromMessages/getNatureFromMessages.js";
+import { DateInput as n, TimeField as r } from "./TimeField.styled.js";
+import i from "react";
+import { DateSegment as a } from "react-aria-components";
+import { jsx as o } from "react/jsx-runtime";
+import { parseTime as s } from "@internationalized/date";
+//#region packages/components/TimeField/TimeField.tsx
+var c = i.forwardRef(({ wrapperProps: i, id: c, label: l, labelIconRight: u, labelIconRightTooltip: d, helperTextIcon: f, helperText: p, errorHelperText: m, errorHelperTextIcon: h, successHelperText: g, successHelperTextIcon: _, warningHelperText: v, warningHelperTextIcon: y, required: b, nature: x, fullWidth: S, isDisabled: C, defaultValue: w, onChange: T, value: E, ampm: D, orientation: O, ...k }, A) => {
+	let j = k["aria-label"] ?? String(l), M = t({
+		nature: x,
+		successHelperText: g,
+		errorHelperText: m,
+		warningHelperText: v
+	}), N = {
+		...i,
+		htmlForId: c,
+		label: l,
+		labelIconRight: u,
+		labelIconRightTooltip: d,
+		helperTextIcon: f,
+		helperText: p,
+		errorHelperText: m,
+		errorHelperTextIcon: h,
+		successHelperText: g,
+		successHelperTextIcon: _,
+		warningHelperText: v,
+		warningHelperTextIcon: y,
+		required: b,
+		orientation: O
+	}, P;
+	return D === !0 && (P = 12), D === !1 && (P = 24), /* @__PURE__ */ o(e, {
+		...N,
+		ref: A,
+		children: /* @__PURE__ */ o(r, {
+			...k,
+			id: c,
+			isDisabled: C,
+			"aria-label": j,
+			isRequired: b,
+			"data-design-system-component": "TimeField",
+			"data-fullwidth": S,
+			defaultValue: w ? s(w) : void 0,
+			onChange: (e) => T?.((e || "").toString()),
+			value: typeof E == "string" ? s(E) : E,
+			hourCycle: P,
+			children: /* @__PURE__ */ o(n, {
+				"data-fullwidth": S,
+				"aria-disabled": C,
+				"data-nature": M,
+				children: (e) => /* @__PURE__ */ o(a, { segment: e })
+			})
+		})
+	});
+});
+//#endregion
+export { c as default };

package/dist/components/TimeField/TimeField.styled.js

@@ -0,0 +1,55 @@
+import { styled as e } from "styled-components";
+import { DateInput as t, TimeField as n } from "react-aria-components";
+//#region packages/components/TimeField/TimeField.styled.ts
+var r = e(n)`
+  display: flex;
+
+  &[data-fullwidth="true"] {
+    width: 100%;
+  }
+`, i = e(t)`
+  position: relative;
+  display: inline-flex;
+  justify-content: flex-start;
+  align-items: center;
+  background-color: var(--color-content-neutral-primary-reversed);
+  outline: 1px solid var(--color-content-neutral-stroke);
+  outline-offset: -1px;
+  border-radius: var(--radius-rounded);
+  padding: var(--spacing-xs);
+  font-size: var(--text-font-size-md);
+  line-height: var(--text-line-height-md);
+  color: var(--color-content-neutral-primary);
+
+  .react-aria-DateSegment {
+    padding: 0 var(--spacing-xxs);
+
+    &[data-type="literal"] {
+      padding: 0;
+    }
+  }
+
+  &[data-fullwidth="true"] {
+    width: 100%;
+  }
+
+  &[aria-disabled="true"] {
+    background: var(--color-content-neutral-tertiary);
+    color: var(--color-content-neutral-secondary);
+    cursor: not-allowed;
+  }
+
+  &[data-nature="negative"] {
+    outline-color: var(--color-content-message-negative);
+  }
+
+  &[data-nature="positive"] {
+    outline-color: var(--color-content-message-positive-darker);
+  }
+
+  &[data-nature="warning"] {
+    outline-color: var(--color-content-message-warning-darker);
+  }
+`;
+//#endregion
+export { i as DateInput, r as TimeField };

package/dist/components/TimePicker/TimePicker.js

@@ -0,0 +1,93 @@
+"use client";
+import e from "../SelectItem/SelectItem.js";
+import t from "../../internal-components/FormGroupWrapper/FormGroupWrapper.js";
+import n from "../../internal/getNatureFromMessages/getNatureFromMessages.js";
+import r from "../Select/Select.js";
+import { ReadOnlyValue as i, SelectsRow as a } from "./TimePicker.styled.js";
+import { buildOptions as o } from "./utils/buildOptions/buildOptions.js";
+import { getSegment as s } from "./utils/getSegment/getSegment.js";
+import c from "react";
+import { jsx as l } from "react/jsx-runtime";
+//#region packages/components/TimePicker/TimePicker.tsx
+var u = [
+	"hours",
+	"minutes",
+	"seconds"
+], d = {
+	hours: "HH",
+	minutes: "MM",
+	seconds: "SS"
+}, f = {
+	hours: "Hours",
+	minutes: "Minutes",
+	seconds: "Seconds"
+}, p = {
+	hours: 23,
+	minutes: 59,
+	seconds: 59
+}, m = {
+	hours: "h",
+	minutes: "m",
+	seconds: "s"
+}, h = c.forwardRef(({ wrapperProps: h, label: g, labelIconRight: _, labelIconRightTooltip: v, helperTextIcon: y, helperText: b, errorHelperText: x, errorHelperTextIcon: S, successHelperText: C, successHelperTextIcon: w, warningHelperText: T, warningHelperTextIcon: E, required: D, nature: O, isDisabled: k, isReadOnly: A, orientation: j, value: M, onChange: N, units: P = u, minutesStep: F = 1, secondsStep: I = 1, "aria-label": L }, R) => {
+	let z = c.useId(), B = L ?? String(g), V = n({
+		nature: O,
+		successHelperText: C,
+		errorHelperText: x,
+		warningHelperText: T
+	}), H = {
+		hours: 1,
+		minutes: F,
+		seconds: I
+	};
+	return /* @__PURE__ */ l(t, {
+		...h,
+		ref: R,
+		"data-design-system-component": "TimePicker",
+		"data-nature": V,
+		label: g,
+		labelIconRight: _,
+		labelIconRightTooltip: v,
+		helperTextIcon: y,
+		helperText: b,
+		errorHelperText: x,
+		errorHelperTextIcon: S,
+		successHelperText: C,
+		successHelperTextIcon: w,
+		warningHelperText: T,
+		warningHelperTextIcon: E,
+		required: D,
+		orientation: j,
+		children: A ? /* @__PURE__ */ l(i, {
+			"data-readonly": "true",
+			children: P.filter((e) => u.includes(e)).map((e) => s(M, e) ?? d[e]).join(":")
+		}) : /* @__PURE__ */ l(a, { children: P.map((t) => {
+			if (!u.includes(t)) return null;
+			let n = o(p[t], H[t]), i = s(M, t);
+			return /* @__PURE__ */ l(r, {
+				id: `${z}-${t}`,
+				mode: "single",
+				"aria-label": `${B} : ${f[t]}`,
+				nature: V,
+				disabled: k,
+				placeholder: d[t],
+				fullWidth: !0,
+				value: i,
+				onChange: (e) => {
+					N({
+						...M ?? {},
+						[t]: e.padStart(2, "0")
+					});
+				},
+				wrapperProps: { style: { width: "80px" } },
+				children: n.map((n) => /* @__PURE__ */ l(e, {
+					id: n,
+					text: `${n}${m[t]}`
+				}, n))
+			}, t);
+		}) })
+	});
+});
+h.displayName = "TimePicker";
+//#endregion
+export { h as default };

package/dist/components/TimePicker/TimePicker.styled.js

@@ -0,0 +1,11 @@
+import { styled as e } from "styled-components";
+//#region packages/components/TimePicker/TimePicker.styled.ts
+var t = e.div`
+  display: flex;
+  gap: var(--spacing-xxs);
+  align-items: flex-start;
+`, n = e.span`
+  min-height: 32px;
+`;
+//#endregion
+export { n as ReadOnlyValue, t as SelectsRow };

package/dist/components/TimePicker/utils/buildOptions/buildOptions.js

@@ -0,0 +1,9 @@
+//#region packages/components/TimePicker/utils/buildOptions/buildOptions.ts
+function e(e, t) {
+	if (e < 0 || !Number.isFinite(e)) throw Error(`buildOptions: max must be a non-negative finite number, received ${e}`);
+	let n = Math.max(1, Math.floor(t)), r = [];
+	for (let t = 0; t <= e; t += n) r.push(String(t).padStart(2, "0"));
+	return r;
+}
+//#endregion
+export { e as buildOptions };

package/dist/components/TimePicker/utils/getSegment/getSegment.js

@@ -0,0 +1,7 @@
+//#region packages/components/TimePicker/utils/getSegment/getSegment.ts
+function e(e, t) {
+	let n = e?.[t];
+	return n ? n.padStart(2, "0") : null;
+}
+//#endregion
+export { e as getSegment };

package/dist/components/Timeline/Timeline.js

@@ -0,0 +1,57 @@
+import { isGroupLine as e } from "./utils/Timeline.types.js";
+import { GridLine as t, GridLines as n, LinesContainer as r, Root as i, TimelineAndBlockContainer as a } from "./Timeline.styled.js";
+import o from "./components/TimelineRange/TimelineRange.js";
+import { computeItemPosition as s } from "./components/BlockLineContainer/utils/computeItemPosition/computeItemPosition.js";
+import c from "./components/BlockLineContainer/BlockLineContainer.js";
+import l from "./components/GroupLineContainer/GroupLineContainer.js";
+import { getGridLineDates as u } from "./utils/getGridLineDates/getGridLineDates.js";
+import { useMemo as d } from "react";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region packages/components/Timeline/Timeline.tsx
+function h({ emptyPlaceholder: h, lines: g, startDate: _, endDate: v, expandedGroups: y, onExpandedGroupsChange: b, shape: x = "rounded", showGridLines: S = !1, ...C }) {
+	let w = d(() => S ? u(_, v) : [], [
+		S,
+		_,
+		v
+	]);
+	return !g || g.length === 0 ? /* @__PURE__ */ p(f, { children: h }) : /* @__PURE__ */ p(i, {
+		...C,
+		"data-shape": x,
+		"data-testid": "timeline",
+		children: /* @__PURE__ */ m(a, { children: [/* @__PURE__ */ p(o, {
+			startDate: _,
+			endDate: v
+		}), /* @__PURE__ */ m(r, {
+			"data-testid": "block-chart",
+			children: [g.map((t, n) => e(t) ? /* @__PURE__ */ p(l, {
+				name: t.name,
+				subLines: t.subLines,
+				lineStartDate: _,
+				lineEndDate: v,
+				groupHoverText: t.groupHoverText,
+				isExpanded: y ? y[t.name] ?? !1 : void 0,
+				onExpandedChange: b && ((e) => b({
+					...y,
+					[t.name]: e
+				}))
+			}, `block-chart-group-${t.name}-${n}`) : /* @__PURE__ */ p(c, {
+				"data-testid": `block-chart-line-${t.name}-${n}`,
+				name: t.name,
+				blocks: t.blocks,
+				lineStartDate: _,
+				lineEndDate: v
+			}, `block-chart-line-${t.name}-${n}`)), w.length > 0 && /* @__PURE__ */ p(n, {
+				"data-testid": "timeline-grid-lines",
+				children: w.map((e) => /* @__PURE__ */ p(t, {
+					"data-testid": `grid-line-${e.toISOString()}`,
+					style: { left: `${s({
+						startDate: e,
+						endDate: e
+					}, _, v).start}%` }
+				}, e.toISOString()))
+			})]
+		})] })
+	});
+}
+//#endregion
+export { h as default };

package/dist/components/Timeline/Timeline.styled.js

@@ -0,0 +1,35 @@
+import { styled as e } from "styled-components";
+//#region packages/components/Timeline/Timeline.styled.tsx
+var t = e.div`
+  display: flex;
+  align-items: flex-end;
+  overflow-x: auto;
+
+  &[data-shape="squared"] {
+    --timeline-block-radius: var(--radius-minimal);
+  }
+`, n = e.div`
+  flex: 1;
+`, r = e.div`
+  position: relative;
+  overflow: hidden;
+`, i = e.div`
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: ${188}px;
+  right: 0;
+  pointer-events: none;
+  z-index: calc(var(--z-index-base) + 2);
+`, a = e.div`
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  border-right: var(--stroke-default, 1px) dashed
+    var(--color-content-neutral-stroke, #e7e7e7);
+  /* Zero-width box: the border sits just before its date, flush against a
+     block starting on it instead of covering the block's first pixel. */
+  margin-left: calc(var(--stroke-default, 1px) * -1);
+`;
+//#endregion
+export { a as GridLine, i as GridLines, r as LinesContainer, t as Root, n as TimelineAndBlockContainer };

package/dist/components/Timeline/components/BlockLineContainer/BlockLineContainer.js

@@ -0,0 +1,100 @@
+import e, { TooltipTrigger as t } from "../../../Tooltip/Tooltip.js";
+import { maxLanesToDisplayBeforeCollapsingForIndentLevel as n } from "../../utils/Timeline.types.js";
+import { computeItemPosition as r } from "./utils/computeItemPosition/computeItemPosition.js";
+import { CustomHoverTooltip as i, GroupContainer as a, LaneContainer as o, LineNow as s, OneLineContainer as c, Overlay as l, Root as u } from "./BlockLineContainer.styled.js";
+import d from "./utils/groupOverlappingBlocks/groupOverlappingBlocks.js";
+import { assignBlocksToLanes as f } from "./utils/assignBlocksToLanes/assignBlocksToLanes.js";
+import { isBlockInBoundaries as p } from "./utils/isBlockInBoundaries/isBlockInBoundaries.js";
+import m from "./components/ExpandButton/ExpandButton.js";
+import h from "./utils/getLineHeight/getLineHeight.js";
+import { NameBlock as g } from "./components/NameBlock/NameBlock.js";
+import { getBlockStyles as _ } from "./utils/getBlockStyles/getBlockStyles.js";
+import { useMemo as v, useState as y } from "react";
+import { TooltipTrigger as b } from "react-aria-components";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
+//#region packages/components/Timeline/components/BlockLineContainer/BlockLineContainer.tsx
+function C({ name: C, blocks: w, lineStartDate: T, lineEndDate: E, isGroupParent: D, isGroupExpanded: O, onNameClick: k, indentLevel: A = 0, ...j }) {
+	let [M, N] = y(!0), P = v(() => w.filter((e) => p(e, T, E)), [
+		w,
+		T,
+		E
+	]), F = v(() => d(P), [P]), I = v(() => F.map((e) => f(e.blocks)), [F]), L = /* @__PURE__ */ new Date(), R = L >= T && L <= E, z = r({
+		startDate: T,
+		endDate: L
+	}, T, E), B = r({
+		startDate: L,
+		endDate: L
+	}, T, E), V = I.reduce((e, t) => Math.max(e, t.length), 0);
+	return /* @__PURE__ */ S(u, {
+		...j,
+		children: [/* @__PURE__ */ x(g, {
+			name: C,
+			isGroupParent: D,
+			isExpanded: O,
+			onClick: k,
+			indentLevel: A
+		}), /* @__PURE__ */ S(c, {
+			style: { height: h({
+				nbOfLanes: V,
+				isCollapsed: M,
+				indentLevel: A
+			}) },
+			children: [
+				R && /* @__PURE__ */ x(l, {
+					"data-testid": "timeline-past-overlay",
+					style: { width: `${z.width}%` },
+					"data-is-expanded": O || A > 0
+				}),
+				F.map((s, c) => {
+					let l = I[c], u = M ? l.slice(0, n(A)) : l, d = l.length > u.length;
+					return /* @__PURE__ */ S(a, { children: [u.map((n, a) => /* @__PURE__ */ x(o, { children: n.map((n) => {
+						let { start: o, width: s } = r(n, T, E), l = {
+							onClick: n.onClick,
+							style: _({
+								start: o,
+								width: s,
+								block: n,
+								lineStartDate: T,
+								lineEndDate: E,
+								indentLevel: A
+							}),
+							"data-start": String(o),
+							"data-width": String(s),
+							"data-color": n.color,
+							"data-group-index": String(c),
+							"data-lane-index": String(a),
+							"data-testid": n.hoverText,
+							"data-clickable": n.onClick ? "true" : void 0
+						};
+						return n.hoverContent ? /* @__PURE__ */ S(b, {
+							delay: 0,
+							closeDelay: 0,
+							children: [/* @__PURE__ */ x(t, { triggerButtonProps: l }), /* @__PURE__ */ x(i, {
+								placement: "top",
+								children: n.hoverContent
+							})]
+						}, n.id) : /* @__PURE__ */ x(e, {
+							label: n.hoverText,
+							placement: "top",
+							closeDelay: 0,
+							delay: 0,
+							fluid: !0,
+							children: /* @__PURE__ */ x(t, { triggerButtonProps: l })
+						}, n.id);
+					}) }, `lane-${a}`)), d && /* @__PURE__ */ x(m, {
+						blocks: s.blocks,
+						lineStartDate: T,
+						lineEndDate: E,
+						onClick: () => N(!M)
+					})] }, `${s.start.toISOString()} - ${c}`);
+				}),
+				R && /* @__PURE__ */ x(s, {
+					"data-testid": "timeline-now-line",
+					style: { left: `${B.start}%` }
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { C as default };

package/dist/components/Timeline/components/BlockLineContainer/BlockLineContainer.styled.js

@@ -0,0 +1,72 @@
+import { styled as e } from "styled-components";
+import { Tooltip as t } from "react-aria-components";
+//#region packages/components/Timeline/components/BlockLineContainer/BlockLineContainer.styled.tsx
+var n = e.div`
+  display: flex;
+`, r = e.div`
+  flex: 1;
+  position: relative;
+  border-bottom: 1px solid var(--color-content-neutral-stroke);
+  overflow: hidden;
+`, i = e.div`
+  position: absolute;
+  top: var(--spacing-xs);
+  bottom: var(--spacing-xs);
+  left: 0;
+  right: 0;
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xxs);
+
+  button[data-clickable="true"]:hover {
+    filter: brightness(0.8);
+  }
+`, a = e.div`
+  position: relative;
+  flex: 1;
+  min-height: 0;
+`, o = e.div`
+  position: absolute;
+  max-width: 100%;
+  height: 100%;
+  z-index: calc(var(--z-index-base) + 1);
+  background-color: rgba(255, 255, 255, 0.6);
+  pointer-events: none;
+
+  &[data-is-expanded="true"] {
+    background-color: #f6f6f699;
+  }
+`, s = e.div`
+  position: absolute;
+  width: 1px;
+  /* Above the grid lines, which sit at +2. */
+  z-index: calc(var(--z-index-base) + 3);
+  height: 100%;
+  border: 1px solid var(--color-content-neutral-primary);
+  transform: translateX(-50%);
+`, c = e(t)`
+  outline: none;
+  forced-color-adjust: none;
+  transform: translate3d(0, 0, 0);
+  transition:
+    transform 200ms,
+    opacity 200ms;
+
+  &[data-entering],
+  &[data-exiting] {
+    transform: var(--origin);
+    opacity: 0;
+  }
+
+  &[data-placement="top"] {
+    margin-bottom: var(--spacing-xs);
+    --origin: translateY(4px);
+  }
+
+  &[data-placement="bottom"] {
+    margin-top: var(--spacing-xs);
+    --origin: translateY(-4px);
+  }
+`;
+//#endregion
+export { c as CustomHoverTooltip, i as GroupContainer, a as LaneContainer, s as LineNow, r as OneLineContainer, o as Overlay, n as Root };

package/dist/components/Timeline/components/BlockLineContainer/components/ExpandButton/ExpandButton.js

@@ -0,0 +1,43 @@
+import e from "../../../../../../internal/usetranslations/usetranslations.js";
+import { computeItemPosition as t } from "../../utils/computeItemPosition/computeItemPosition.js";
+import { Root as n, StyledExpandButton as r } from "./ExpandButton.styled.js";
+import { jsx as i } from "react/jsx-runtime";
+//#region packages/components/Timeline/components/BlockLineContainer/components/ExpandButton/ExpandButton.tsx
+function a(a) {
+	let s = e(o), c = a.lineEndDate, l = a.lineStartDate;
+	for (let e of a.blocks) e.startDate < c && (c = e.startDate), e.endDate > l && (l = e.endDate);
+	let { start: u, width: d } = t({
+		startDate: c,
+		endDate: l
+	}, a.lineStartDate, a.lineEndDate);
+	return /* @__PURE__ */ i(n, {
+		style: {
+			left: `${u}%`,
+			width: `${d}%`
+		},
+		children: /* @__PURE__ */ i(r, {
+			onClick: a.onClick,
+			type: "button",
+			"data-start": u,
+			"data-width": d,
+			title: s.expand,
+			children: /* @__PURE__ */ i("svg", {
+				width: "8",
+				height: "2",
+				viewBox: "0 0 8 2",
+				fill: "none",
+				xmlns: "http://www.w3.org/2000/svg",
+				children: /* @__PURE__ */ i("path", {
+					d: "M0.999878 0C0.449878 0 -0.00012207 0.45 -0.00012207 1C-0.00012207 1.55 0.449878 2 0.999878 2C1.54988 2 1.99988 1.55 1.99988 1C1.99988 0.45 1.54988 0 0.999878 0ZM6.99988 0C6.44988 0 5.99988 0.45 5.99988 1C5.99988 1.55 6.44988 2 6.99988 2C7.54988 2 7.99988 1.55 7.99988 1C7.99988 0.45 7.54988 0 6.99988 0ZM3.99988 0C3.44988 0 2.99988 0.45 2.99988 1C2.99988 1.55 3.44988 2 3.99988 2C4.54988 2 4.99988 1.55 4.99988 1C4.99988 0.45 4.54988 0 3.99988 0Z",
+					fill: "#454545"
+				})
+			})
+		})
+	});
+}
+var o = {
+	en: { expand: "Expand" },
+	fr: { expand: "Afficher plus" }
+};
+//#endregion
+export { a as default };

package/dist/components/Timeline/components/BlockLineContainer/components/ExpandButton/ExpandButton.styled.js

@@ -0,0 +1,15 @@
+import { styled as e } from "styled-components";
+//#region packages/components/Timeline/components/BlockLineContainer/components/ExpandButton/ExpandButton.styled.ts
+var t = e.div`
+  position: absolute;
+  bottom: calc(var(--spacing-xs) * -2);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`, n = e.button`
+  all: unset;
+  cursor: pointer;
+  padding: var(--spacing-xs);
+`;
+//#endregion
+export { t as Root, n as StyledExpandButton };

package/dist/components/Timeline/components/BlockLineContainer/components/NameBlock/NameBlock.js

@@ -0,0 +1,32 @@
+import { lineHeightForIndentLevel as e } from "../../../../utils/Timeline.types.js";
+import { CaretIcon as t, NameButton as n, NameContainer as r, TextContent as i } from "./NameBlock.styled.js";
+import { useEffect as a, useRef as o, useState as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region packages/components/Timeline/components/BlockLineContainer/components/NameBlock/NameBlock.tsx
+var u = ({ name: u, isGroupParent: d, isExpanded: f, onClick: p, indentLevel: m = 0 }) => {
+	let h = o(null), [g, _] = s(!1);
+	a(() => {
+		let t = h.current;
+		t && _(t.scrollHeight > e(m) - 5);
+	}, [u, m]);
+	let v = /* @__PURE__ */ c(i, {
+		title: g ? u : void 0,
+		ref: h,
+		children: u
+	});
+	return /* @__PURE__ */ c(r, {
+		"data-is-group-parent": d,
+		"data-is-expanded": f,
+		"data-indent-level": m,
+		children: d ? /* @__PURE__ */ l(n, {
+			type: "button",
+			onClick: p,
+			children: [/* @__PURE__ */ c(t, {
+				name: "caret",
+				"data-is-expanded": f
+			}), v]
+		}) : v
+	});
+};
+//#endregion
+export { u as NameBlock };

package/dist/components/Timeline/components/BlockLineContainer/components/NameBlock/NameBlock.styled.js

@@ -0,0 +1,55 @@
+import e from "../../../../../Icon/Icon.js";
+import { styled as t } from "styled-components";
+//#region packages/components/Timeline/components/BlockLineContainer/components/NameBlock/NameBlock.styled.ts
+var n = t.div`
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  padding-right: var(--spacing-xs);
+  border-bottom: 1px solid var(--color-content-neutral-stroke);
+  font-size: 14px;
+  line-height: 18px;
+  width: ${188}px;
+  color: var(--color-content-neutral-primary);
+
+  &[data-indent-level="1"] {
+    padding-left: var(--spacing-xs);
+  }
+
+  &[data-is-group-parent="true"] {
+    color: var(--color-content-neutral-primary);
+    font-size: var(--text-font-size-sm);
+    font-style: normal;
+    font-weight: 400;
+    line-height: var(--text-line-height-sm);
+
+    &[data-is-expanded="true"] {
+      color: var(--color-content-action-action);
+    }
+  }
+`, r = t.button`
+  all: unset;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xxs);
+  max-width: 100%;
+`, i = t.span`
+  display: -webkit-box;
+  max-width: 100%;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`, a = t(e)`
+  flex-shrink: 0;
+  transition: transform 0.2s ease;
+  transform: rotate(0deg);
+  font-size: 16px;
+
+  &[data-is-expanded="true"] {
+    transform: rotate(90deg);
+  }
+`;
+//#endregion
+export { a as CaretIcon, r as NameButton, n as NameContainer, i as TextContent };

package/dist/components/Timeline/components/BlockLineContainer/utils/assignBlocksToLanes/assignBlocksToLanes.js

@@ -0,0 +1,26 @@
+//#region packages/components/Timeline/components/BlockLineContainer/utils/assignBlocksToLanes/assignBlocksToLanes.ts
+function e(e) {
+	let r = /* @__PURE__ */ new Map();
+	for (let t of e) {
+		let e = r.get(t.color) ?? [];
+		e.push(t), r.set(t.color, e);
+	}
+	return Array.from(r.entries()).map(([e, n]) => ({
+		color: String(e),
+		lanes: t(n),
+		startsAt: n.reduce((e, t) => Math.min(e, t.startDate.getTime()), Infinity)
+	})).sort((e, t) => e.startsAt - t.startsAt || n(e.color, t.color)).flatMap((e) => e.lanes);
+}
+function t(e) {
+	let t = [...e].sort((e, t) => e.startDate.getTime() - t.startDate.getTime() || e.endDate.getTime() - t.endDate.getTime() || n(e.id, t.id)), r = [];
+	for (let e of t) {
+		let t = r.find((t) => t[t.length - 1].endDate.getTime() <= e.startDate.getTime());
+		t ? t.push(e) : r.push([e]);
+	}
+	return r;
+}
+function n(e, t) {
+	return e < t ? -1 : +(e > t);
+}
+//#endregion
+export { e as assignBlocksToLanes };