@agregio-solutions/design-system 2.2.0 → 2.3.1

package/dist/components/Combobox/Combobox.js

@@ -0,0 +1,98 @@
+"use client";
+import e from "../SelectItem/SelectItem.js";
+import t from "../../internal-components/FormGroupWrapper/FormGroupWrapper.js";
+import { Input as n, InputAndTrigger as r, ListBox as i, Popover as a, RootCombobox as o, Trigger as s } from "./Combobox.styled.js";
+import c from "../../internal/getNatureFromMessages/getNatureFromMessages.js";
+import l from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region packages/components/Combobox/Combobox.tsx
+var f = (e) => {
+	if (!("selectedKeys" in e)) return !1;
+	let { id: t, selectionMode: n, selectedKeys: r } = e;
+	if (n !== "multiple") throw Error(`Combobox "${t}": \`selectedKeys\` requires \`selectionMode="multiple"\``);
+	if (!Array.isArray(r)) throw Error(`Combobox "${t}": \`selectedKeys\` must be an array, use \`[]\` when nothing is selected`);
+	return !0;
+}, p = (e) => f(e) ? {
+	selectionMode: "multiple",
+	value: e.selectedKeys,
+	onChange: (t) => {
+		Array.isArray(t) && e.onSelectionChange(t.map(String));
+	}
+} : {
+	selectedKey: e.value,
+	onSelectionChange: (t) => e.onChange?.(String(t || ""))
+}, m = l.forwardRef((f, m) => {
+	let h = f["aria-label"] ?? String(f.label), g = l.useRef(null), _ = c({
+		nature: f.nature,
+		successHelperText: f.successHelperText,
+		errorHelperText: f.errorHelperText,
+		warningHelperText: f.warningHelperText
+	}), v = {
+		...f.wrapperProps,
+		htmlForId: f.id,
+		label: f.label,
+		labelIconRight: f.labelIconRight,
+		labelIconRightTooltip: f.labelIconRightTooltip,
+		helperTextIcon: f.helperTextIcon,
+		helperText: f.helperText,
+		errorHelperText: f.errorHelperText,
+		errorHelperTextIcon: f.errorHelperTextIcon,
+		successHelperText: f.successHelperText,
+		successHelperTextIcon: f.successHelperTextIcon,
+		warningHelperText: f.warningHelperText,
+		warningHelperTextIcon: f.warningHelperTextIcon,
+		orientation: f.orientation,
+		required: f.required
+	};
+	return /* @__PURE__ */ u(t, {
+		...v,
+		children: /* @__PURE__ */ d(o, {
+			id: f.id,
+			isDisabled: f.disabled,
+			isRequired: f.required,
+			...p(f),
+			disabledKeys: f.disabledIds,
+			"data-fullwidth": f.fullWidth,
+			"aria-label": h,
+			defaultFilter: f.defaultFilter,
+			inputValue: f.inputValue,
+			defaultInputValue: f.defaultInputValue,
+			onInputChange: f.onInputChange,
+			items: f.items,
+			defaultItems: f.defaultItems,
+			children: [/* @__PURE__ */ d(r, {
+				ref: g,
+				"data-nature": _,
+				"data-fullwidth": f.fullWidth,
+				children: [
+					/* @__PURE__ */ u(n, {
+						...f.inputProps,
+						placeholder: f.placeholder || f.inputProps?.placeholder,
+						ref: m,
+						"data-nature": _,
+						"data-fullwidth": f.fullWidth,
+						hasIcon: !1
+					}),
+					f.triggerContentRight,
+					/* @__PURE__ */ u(s, {
+						iconLeft: "expand_more",
+						mode: "tertiary"
+					})
+				]
+			}), /* @__PURE__ */ u(a, {
+				offset: 4,
+				placement: "bottom",
+				triggerRef: g,
+				children: /* @__PURE__ */ u(i, {
+					"data-tall": f.tallDropdown || void 0,
+					children: (t) => /* @__PURE__ */ u(e, {
+						...t,
+						selectionMode: f.selectionMode ?? "single"
+					})
+				})
+			})]
+		})
+	});
+});
+//#endregion
+export { m as default };

package/dist/components/Combobox/Combobox.styled.js

@@ -0,0 +1,90 @@
+import e from "../Button/Button.js";
+import { baseDropdownStyles as t } from "../Dropdown/Dropdown.styled.js";
+import { CoreTextInput as n } from "../../internal-components/CoreTextInput/CoreTextInput.styled.js";
+import { styled as r } from "styled-components";
+import { ComboBox as i, Group as a, ListBox as o, Popover as s } from "react-aria-components";
+//#region packages/components/Combobox/Combobox.styled.ts
+var c = r(i)`
+  &[data-fullwidth="true"] {
+    width: 100%;
+  }
+`, l = r(a)`
+  display: inline-flex;
+  align-items: center;
+  min-height: 40px;
+  border-radius: var(--radius-rounded);
+  background: var(--background-color);
+  outline: var(--border-color) solid 1px;
+  outline-offset: -1px;
+
+  &[data-fullwidth="true"] {
+    width: 100%;
+  }
+
+  &:has(input:focus),
+  &:has(input[data-force-focus]) {
+    box-shadow:
+      #fff 0 0 0 2px,
+      var(--color-background-highlight-focus) 0 0 0 4px,
+      rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
+  }
+
+  /* Border and background only: the text and placeholder colors stay on the input, which keeps its own data-nature */
+  &[data-disabled] {
+    --background-color: var(--color-content-neutral-tertiary);
+    --border-color: var(--color-content-neutral-stroke);
+  }
+
+  &[data-nature="default"]:not([data-disabled]) {
+    --background-color: var(--color-content-neutral-primary-reversed);
+    --border-color: var(--color-content-neutral-stroke);
+  }
+
+  &[data-nature="negative"]:not([data-disabled]) {
+    --background-color: var(--color-content-neutral-primary-reversed);
+    --border-color: var(--color-content-message-negative);
+  }
+
+  &[data-nature="positive"]:not([data-disabled]) {
+    --background-color: var(--color-content-neutral-primary-reversed);
+    --border-color: var(--color-content-message-positive-darker);
+  }
+
+  &[data-nature="warning"]:not([data-disabled]) {
+    --background-color: var(--color-content-neutral-primary-reversed);
+    --border-color: var(--color-content-message-warning-darker);
+  }
+`, u = r(n)`
+  flex: 1;
+  min-width: 0;
+  background: transparent;
+  border-radius: 0;
+  outline: none;
+
+  &:focus,
+  &[data-force-focus] {
+    box-shadow: none;
+  }
+`, d = r(e)`
+  /* Tighten the gap with whatever sits on the trigger's left (doubled selector to beat the Button's own icon-only padding) */
+  &&[data-has-no-text="true"] {
+    padding-left: calc(var(--spacing-xs) / 2);
+  }
+
+  /* Remove outline/background color because those styles are applied to the field shell instead */
+  background-color: transparent !important;
+  outline: none !important;
+  box-shadow: none !important;
+  color: var(--color-content-neutral-tertiary) !important;
+
+  &:disabled {
+    color: var(--color-content-neutral-primary-reversed) !important;
+  }
+`, f = r(s)``, p = r(o)`
+  ${t};
+  z-index: var(--z-index-dropdown);
+  outline: none;
+  width: var(--trigger-width);
+`;
+//#endregion
+export { u as Input, l as InputAndTrigger, p as ListBox, f as Popover, c as RootCombobox, d as Trigger };

package/dist/components/DataTable/DataTable.js

@@ -0,0 +1,53 @@
+"use client";
+import e from "./DataTableRow/DataTableRow.js";
+import t from "../Pagination/Pagination.js";
+import n from "./DataTableRoot/DataTableRoot.js";
+import r from "./DataTableEmptyPlaceholder/DataTableEmptyPlaceholder.js";
+import i from "./DataTableContext.js";
+import a from "./DataTableSkeletonRows/DataTableSkeletonRows.js";
+import { DataTableExpandedRow as o, DataTableOverflowWrapper as s } from "./DataTable.styled.js";
+import { Fragment as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region packages/components/DataTable/DataTable.tsx
+var d = 10;
+function f({ table: f, pagination: p, renderSubComponent: m, itemsPerPageOptions: h, size: g = "default", isLoading: _ = !1, ...v }) {
+	let y = (f.state.columnFilters?.length ?? 0) > 0 || (f.state.globalFilter?.length ?? 0) > 0, b = f.getHeaderGroups(), x = f.getRowModel().rows, S = f.getRowCount?.() ?? x.length;
+	return /* @__PURE__ */ u("div", {
+		...v,
+		"data-design-system-component": "DataTable",
+		children: [
+			/* @__PURE__ */ l(i.Provider, {
+				value: { size: g },
+				children: /* @__PURE__ */ l(s, { children: /* @__PURE__ */ u(n, {
+					"aria-busy": _,
+					children: [/* @__PURE__ */ l("thead", { children: b.map((e) => /* @__PURE__ */ l("tr", { children: e.headers.map((e) => /* @__PURE__ */ l(f.FlexRender, { header: e }, e.id)) }, e.id)) }), /* @__PURE__ */ u("tbody", { children: [_ && /* @__PURE__ */ l(a, {
+						rowCount: p?.pageSize ?? f.state.pagination?.pageSize ?? d,
+						columnCount: b[b.length - 1]?.headers.length ?? 0
+					}), !_ && x.map((t) => {
+						let n = t, r = n.getVisibleCells?.() ?? t.getAllCells(), i = n.getIsExpanded?.() ?? !1;
+						return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(e, {
+							"data-sub-row-expanded": i,
+							"data-is-sub-row": !!t.getParentRow(),
+							children: r.map((e) => /* @__PURE__ */ l(f.FlexRender, { cell: e }, e.id))
+						}), i && !!m && /* @__PURE__ */ l("tr", { children: /* @__PURE__ */ l(o, {
+							colSpan: r.length,
+							children: m({ row: t })
+						}) })] }, t.id);
+					})] })]
+				}) })
+			}),
+			!_ && S === 0 && /* @__PURE__ */ l(r, { withFilters: y }),
+			!!p && /* @__PURE__ */ l(t, {
+				count: S,
+				onPageChange: (e) => f.setPageIndex?.(e),
+				pageIndex: p.pageIndex,
+				onItemsPerPageChange: (e) => f.setPageSize?.(e),
+				itemsPerPage: p.pageSize,
+				itemsPerPageOptions: h,
+				style: { marginTop: "16px" }
+			})
+		]
+	});
+}
+//#endregion
+export { f as default };

package/dist/components/DataTable/DataTable.styled.js

@@ -0,0 +1,11 @@
+import { styled as e } from "styled-components";
+//#region packages/components/DataTable/DataTable.styled.ts
+var t = e.div`
+  overflow-x: auto;
+  overflow-y: hidden;
+  width: 100%;
+`, n = e.td`
+  padding: var(--spacing-sm);
+`;
+//#endregion
+export { n as DataTableExpandedRow, t as DataTableOverflowWrapper };

package/dist/components/DataTable/DataTableCell/DataTableCell.js

@@ -0,0 +1,21 @@
+"use client";
+import { useDataTableContext as e } from "../DataTableContext.js";
+import { IconWrapper as t, TableCell as n, Wrapper as r } from "./DataTableCell.styled.js";
+import "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region packages/components/DataTable/DataTableCell/DataTableCell.tsx
+function o({ children: o, iconLeft: s, border: c, align: l = "left", size: u, compact: d, ...f }) {
+	let { size: p } = e();
+	return /* @__PURE__ */ i(n, {
+		...f,
+		"data-border": c,
+		children: /* @__PURE__ */ a(r, {
+			"data-align": l,
+			"data-size": u || p,
+			"data-compact": d,
+			children: [!!s && /* @__PURE__ */ i(t, { name: s }), o]
+		})
+	});
+}
+//#endregion
+export { o as default };

package/dist/components/DataTable/DataTableCell/DataTableCell.styled.js

@@ -0,0 +1,78 @@
+import e from "../../Icon/Icon.js";
+import { styled as t } from "styled-components";
+//#region packages/components/DataTable/DataTableCell/DataTableCell.styled.ts
+var n = t.td`
+  padding: 0;
+
+  &[data-border="left"],
+  &[data-border="both"] {
+    border-left: 1px solid var(--color-content-neutral-stroke);
+  }
+
+  &[data-border="right"],
+  &[data-border="both"] {
+    border-right: 1px solid var(--color-content-neutral-stroke);
+  }
+`, r = t.div`
+  display: flex;
+  align-items: center;
+  column-gap: var(--spacing-xs);
+  padding: var(--spacing-sm);
+  color: var(--color-content-neutral-secondary);
+  font-size: var(--text-font-size-md);
+  line-height: var(--text-line-height-md);
+  font-weight: normal;
+
+  &[data-compact="true"] {
+    padding-block: var(--spacing-xs);
+  }
+
+  &[data-size="small"] {
+    column-gap: var(--spacing-xxs);
+    padding: var(--spacing-xs) var(--spacing-sm) var(--spacing-xs)
+      var(--spacing-xs);
+    font-size: var(--text-font-size-sm);
+    line-height: var(--text-line-height-sm);
+
+    &[data-compact="true"] {
+      padding-block: var(--spacing-xxs);
+    }
+  }
+
+  &[data-size="large"] {
+    column-gap: var(--spacing-sm);
+    padding: var(--spacing-md);
+    font-size: var(--text-font-size-lg);
+    line-height: var(--text-line-height-lg);
+
+    &[data-compact="true"] {
+      padding-block: var(--spacing-sm);
+    }
+  }
+
+  &[data-align="center"] {
+    justify-content: center;
+    text-align: center;
+  }
+
+  &[data-align="right"] {
+    justify-content: flex-end;
+    text-align: right;
+  }
+
+  // Remove padding for specific components to avoid double padding that can make the Cell too tall
+  & [data-design-system-component="Radio"] {
+    padding: 0 !important;
+  }
+  & [data-design-system-component="RadioGroupItem"] {
+    padding: 0 !important;
+  }
+  & [data-design-system-component="Checkbox"] {
+    padding: 0 !important;
+  }
+`, i = t(e)`
+  display: inline-block;
+  font-size: var(--text-font-size-xl);
+`;
+//#endregion
+export { i as IconWrapper, n as TableCell, r as Wrapper };

package/dist/components/DataTable/DataTableContext.js

@@ -0,0 +1,9 @@
+"use client";
+import { createContext as e, useContext as t } from "react";
+//#region packages/components/DataTable/DataTableContext.tsx
+var n = e({ size: "default" });
+function r() {
+	return t(n) || { size: "default" };
+}
+//#endregion
+export { n as default, r as useDataTableContext };

package/dist/components/DataTable/DataTableEmptyPlaceholder/DataTableEmptyPlaceholder.js

@@ -0,0 +1,25 @@
+import e from "../../../internal/usetranslations/usetranslations.js";
+import { Root as t } from "./DataTableEmptyPlaceholder.styled.js";
+import "react";
+import { jsxs as n } from "react/jsx-runtime";
+//#region packages/components/DataTable/DataTableEmptyPlaceholder/DataTableEmptyPlaceholder.tsx
+function r({ withFilters: r }) {
+	let a = e(i);
+	return /* @__PURE__ */ n(t, { children: [
+		a.noData,
+		r && /* @__PURE__ */ n("b", { children: [" ", a.withFilters] }),
+		"."
+	] });
+}
+var i = {
+	en: {
+		noData: "Sorry, there is currently no data to display",
+		withFilters: "with the active filters"
+	},
+	fr: {
+		noData: "Désolé, il n'y a actuellement aucune donnée à afficher",
+		withFilters: "avec les filtres actifs"
+	}
+};
+//#endregion
+export { r as default };

package/dist/components/DataTable/DataTableEmptyPlaceholder/DataTableEmptyPlaceholder.styled.js

@@ -0,0 +1,10 @@
+import { styled as e } from "styled-components";
+//#region packages/components/DataTable/DataTableEmptyPlaceholder/DataTableEmptyPlaceholder.styled.ts
+var t = e.div`
+  padding: var(--spacing-md);
+  text-align: center;
+  color: var(--color-content-message-warning);
+  background-color: var(--color-content-neutral-primary-reversed);
+`;
+//#endregion
+export { t as Root };

package/dist/components/DataTable/DataTableHeader/DataTableHeader.js

@@ -0,0 +1,44 @@
+"use client";
+import { useDataTableContext as e } from "../DataTableContext.js";
+import { IconSortWrapper as t, IconWrapper as n, SortButton as r, SortIcon as i, TableHead as a, Wrapper as o } from "./DataTableHeader.styled.js";
+import "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region packages/components/DataTable/DataTableHeader/DataTableHeader.tsx
+var l = {
+	asc: "ascending",
+	desc: "descending",
+	none: "none"
+};
+function u({ text: u, iconLeft: d, sortDirection: f = "none", onSortClick: p, border: m, align: h = "left", size: g, ..._ }) {
+	let { size: v } = e(), y = !!p;
+	return /* @__PURE__ */ s(a, {
+		..._,
+		"data-design-system-component": "DataTableHeader",
+		"data-border": m,
+		"data-sortable": y ? "true" : void 0,
+		"aria-sort": y ? l[f] : void 0,
+		onClick: p,
+		children: /* @__PURE__ */ c(o, {
+			"data-align": h,
+			"data-size": g || v,
+			children: [
+				!!d && /* @__PURE__ */ s(n, { name: d }),
+				/* @__PURE__ */ s(r, {
+					as: y ? "button" : "span",
+					type: y ? "button" : void 0,
+					"data-sort-direction": f,
+					children: u
+				}),
+				y && /* @__PURE__ */ c(t, { children: [/* @__PURE__ */ s(i, {
+					name: "expand_less",
+					"data-active": f === "asc"
+				}), /* @__PURE__ */ s(i, {
+					name: "expand_more",
+					"data-active": f === "desc"
+				})] })
+			]
+		})
+	});
+}
+//#endregion
+export { u as default };

package/dist/components/DataTable/DataTableHeader/DataTableHeader.styled.js

@@ -0,0 +1,110 @@
+import e from "../../Icon/Icon.js";
+import { css as t, styled as n } from "styled-components";
+//#region packages/components/DataTable/DataTableHeader/DataTableHeader.styled.ts
+var r = n.th`
+  padding: 0;
+  vertical-align: bottom;
+  background: var(--color-background-neutral-underground-1);
+
+  &[data-border="left"],
+  &[data-border="both"] {
+    border-left: 1px solid var(--color-content-neutral-stroke);
+  }
+
+  &[data-border="right"],
+  &[data-border="both"] {
+    border-right: 1px solid var(--color-content-neutral-stroke);
+  }
+
+  &[data-sortable="true"]:hover {
+    background: var(--color-content-action-action-lighter);
+    cursor: pointer;
+  }
+`, i = t`
+  ${r}[data-sortable="true"]:hover & {
+    color: var(--color-content-action-action);
+  }
+`, a = n.div`
+  display: flex;
+  align-items: center;
+  width: 100%;
+  column-gap: var(--spacing-xs);
+  padding: var(--spacing-sm);
+  border-bottom: 1px solid var(--color-content-neutral-stroke);
+  font-size: var(--text-font-size-md);
+  line-height: var(--text-line-height-md);
+
+  &[data-size="small"] {
+    column-gap: var(--spacing-xxs);
+    padding: var(--spacing-xs) var(--spacing-sm) var(--spacing-xs)
+      var(--spacing-xs);
+    font-size: var(--text-font-size-sm);
+    line-height: var(--text-line-height-sm);
+  }
+
+  &[data-size="large"] {
+    column-gap: var(--spacing-sm);
+    padding: var(--spacing-md);
+    font-size: var(--text-font-size-lg);
+    line-height: var(--text-line-height-lg);
+  }
+
+  &[data-align="center"] {
+    justify-content: center;
+    text-align: center;
+  }
+
+  &[data-align="right"] {
+    justify-content: flex-end;
+    text-align: right;
+  }
+`, o = n(e)`
+  display: inline-block;
+  font-size: var(--text-font-size-xl);
+  color: var(--color-content-neutral-secondary);
+
+  ${i}
+`, s = n.button`
+  padding: 0;
+  border: none;
+  background: none;
+  font-weight: bold;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  color: var(--color-content-neutral-primary);
+  appearance: none;
+  white-space: nowrap;
+
+  ${r}[data-sortable="true"] & {
+    cursor: pointer;
+  }
+
+  &[data-sort-direction="asc"],
+  &[data-sort-direction="desc"] {
+    color: var(--color-content-action-action);
+  }
+
+  ${o} {
+    color: var(--color-content-neutral-primary);
+  }
+
+  ${i}
+`, c = n(e)`
+  font-size: var(--text-font-size-md);
+  color: var(--color-content-neutral-tertiary);
+
+  &:first-child {
+    margin-bottom: -8px;
+  }
+
+  &[data-active="true"] {
+    color: var(--color-content-action-action);
+  }
+`, l = n.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+`;
+//#endregion
+export { l as IconSortWrapper, o as IconWrapper, s as SortButton, c as SortIcon, r as TableHead, a as Wrapper };

package/dist/components/DataTable/DataTableRoot/DataTableRoot.js

@@ -0,0 +1,13 @@
+"use client";
+import { Table as e } from "./DataTableRoot.styled.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region packages/components/DataTable/DataTableRoot/DataTableRoot.tsx
+function n({ children: n, ...r }) {
+	return /* @__PURE__ */ t(e, {
+		...r,
+		children: n
+	});
+}
+//#endregion
+export { n as default };

package/dist/components/DataTable/DataTableRoot/DataTableRoot.styled.js

@@ -0,0 +1,22 @@
+import { styled as e } from "styled-components";
+//#region packages/components/DataTable/DataTableRoot/DataTableRoot.styled.ts
+var t = e.table`
+  width: 100%;
+  border-collapse: collapse;
+  border-spacing: 0;
+  background-color: var(--color-content-neutral-primary-reversed);
+
+  tbody {
+    border-top: 1px solid var(--color-content-neutral-stroke);
+
+    tr {
+      border-bottom: 1px solid var(--color-content-neutral-stroke);
+
+      &[data-is-sub-row="true"]:has(~ [data-is-sub-row="true"]) {
+        border-bottom: none;
+      }
+    }
+  }
+`;
+//#endregion
+export { t as Table };

package/dist/components/DataTable/DataTableRow/DataTableRow.js

@@ -0,0 +1,13 @@
+"use client";
+import { TableRow as e } from "./DataTableRow.styled.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region packages/components/DataTable/DataTableRow/DataTableRow.tsx
+function n({ children: n, ...r }) {
+	return /* @__PURE__ */ t(e, {
+		...r,
+		children: n
+	});
+}
+//#endregion
+export { n as default };

package/dist/components/DataTable/DataTableRow/DataTableRow.styled.js

@@ -0,0 +1,11 @@
+import { styled as e } from "styled-components";
+//#region packages/components/DataTable/DataTableRow/DataTableRow.styled.ts
+var t = e.tr`
+  background-color: var(--color-content-neutral-primary-reversed);
+
+  &[data-sub-row-expanded="true"] {
+    background-color: var(--color-content-message-informative-lighter);
+  }
+`;
+//#endregion
+export { t as TableRow };

package/dist/components/DataTable/DataTableSkeletonRows/DataTableSkeletonRows.js

@@ -0,0 +1,19 @@
+"use client";
+import e from "../DataTableRow/DataTableRow.js";
+import t from "../../../internal/arrayOfLength/arrayOfLength.js";
+import n from "../../Skeleton/Skeleton.js";
+import r from "../DataTableCell/DataTableCell.js";
+import { Fragment as i, jsx as a } from "react/jsx-runtime";
+//#region packages/components/DataTable/DataTableSkeletonRows/DataTableSkeletonRows.tsx
+function o({ rowCount: o, columnCount: s }) {
+	return /* @__PURE__ */ a(i, { children: t(o).map((i) => /* @__PURE__ */ a(e, {
+		"data-design-system-component": "DataTableSkeletonRows",
+		"aria-hidden": "true",
+		children: t(s).map((e) => /* @__PURE__ */ a(r, { children: /* @__PURE__ */ a(n, {
+			variant: "text",
+			width: "100%"
+		}) }, e))
+	}, i)) });
+}
+//#endregion
+export { o as default };