dishui 0.0.89 → 0.0.97

package/dist/components/Table/index.d.ts

@@ -1,11 +1,26 @@
 import React from 'react';
+export type TableCardOptions = {
+    /** Applied to each Table.Body grid. */
+    gridClassName?: string;
+    gridStyle?: React.CSSProperties;
+    /** Applied to each body row card. */
+    className?: string;
+    style?: React.CSSProperties;
+    fieldClassName?: string;
+    fieldStyle?: React.CSSProperties;
+    labelClassName?: string;
+    labelStyle?: React.CSSProperties;
+};
 export type TableProps = {
     children: React.ReactNode;
+    card?: boolean;
+    cardOptions?: TableCardOptions;
     className?: string;
     onClick?: (e: React.MouseEvent) => void;
     onMouseEnter?: (e: React.MouseEvent) => void;
     onMouseLeave?: (e: React.MouseEvent) => void;
 } & React.TableHTMLAttributes<HTMLTableElement>;
+declare const Table: ({ children, className, card, cardOptions, onClick, onMouseEnter, onMouseLeave, ...rest }: TableProps) => React.JSX.Element;
 export type TableHeadProps = React.HTMLAttributes<HTMLTableSectionElement>;
 export type TableBodyProps = React.HTMLAttributes<HTMLTableSectionElement>;
 export type TableRowProps = {
@@ -19,6 +34,8 @@ export type TableRowProps = {
 } & Omit<React.HTMLAttributes<HTMLTableRowElement>, 'className' | 'onClick' | 'onDoubleClick' | 'onMouseEnter' | 'onMouseLeave'>;
 export type TableCellProps = {
     children?: React.ReactNode;
+    /** Visible field label in card body cells only. */
+    label?: React.ReactNode;
     className?: string;
     onClick?: (e: React.MouseEvent) => void;
     colSpan?: number;
@@ -42,7 +59,8 @@ export type TableHeaderCellProps = {
 } & React.ThHTMLAttributes<HTMLTableCellElement>;
 export type TableCaptionProps = React.HTMLAttributes<HTMLTableCaptionElement>;
 export type TableFooterProps = React.HTMLAttributes<HTMLTableSectionElement>;
-interface TableCompound extends React.FC<TableProps> {
+export type TableCardProps = Omit<TableProps, 'card'>;
+interface TableSubcomponents {
     Caption: React.FC<TableCaptionProps>;
     Footer: React.FC<TableFooterProps>;
     Head: React.FC<TableHeadProps>;
@@ -51,5 +69,8 @@ interface TableCompound extends React.FC<TableProps> {
     Cell: React.FC<TableCellProps>;
     HeaderCell: React.FC<TableHeaderCellProps>;
 }
-declare const TableWithCompounds: TableCompound;
+declare const TableCard: (props: TableCardProps) => React.JSX.Element;
+declare const TableWithCompounds: typeof Table & TableSubcomponents & {
+    Card: typeof TableCard & TableSubcomponents;
+};
 export default TableWithCompounds;

package/dist/components/Table/index.js

@@ -1,117 +1,169 @@
 import { cn as e } from "../../utils/cn.js";
-import "react";
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
+/* empty css      */
+import t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/components/Table/index.tsx
-var r = ({ children: n, className: r = "", onClick: i, onMouseEnter: a, onMouseLeave: o, ...s }) => {
-	let c = e("table", r);
-	return /* @__PURE__ */ t("table", {
-		...s,
-		className: c,
-		onClick: i,
-		onMouseEnter: a,
-		onMouseLeave: o,
-		children: n
+var i = t.createContext(null), a = t.createContext(!1), o = {}, s = ({ children: t, className: r = "", card: s = !1, cardOptions: c = o, onClick: l, onMouseEnter: u, onMouseLeave: d, ...f }) => {
+	let p = e("table", s && "dishui-table-card", r);
+	return /* @__PURE__ */ n(i.Provider, {
+		value: s ? c : null,
+		children: /* @__PURE__ */ n(a.Provider, {
+			value: !1,
+			children: /* @__PURE__ */ n("table", {
+				role: s ? "table" : void 0,
+				...f,
+				className: p,
+				onClick: l,
+				onMouseEnter: u,
+				onMouseLeave: d,
+				children: t
+			})
+		})
 	});
-}, i = ({ children: n, className: r = "", ...i }) => {
-	let a = e("table-header-group", r);
-	return /* @__PURE__ */ t("thead", {
-		...i,
-		className: a,
-		children: n
-	});
-}, a = ({ children: n, className: r = "", ...i }) => {
-	let a = e("table-row-group", r);
-	return /* @__PURE__ */ t("tbody", {
-		...i,
-		className: a,
-		children: n
-	});
-}, o = ({ children: n, className: r = "", selected: i = !1, onClick: a, onDoubleClick: o, onMouseEnter: s, onMouseLeave: c, ...l }) => {
-	let u = e("table-row", i && "bg-base-200", "hover:bg-base-100", r);
-	return /* @__PURE__ */ t("tr", {
-		className: u,
-		onClick: a,
-		onDoubleClick: o,
-		onMouseEnter: s,
-		onMouseLeave: c,
-		...l,
-		children: n
-	});
-}, s = ({ children: n, className: r = "", onClick: i, colSpan: a, style: o, onDoubleClick: s, onMouseEnter: c, onMouseLeave: l, ...u }) => {
-	let d = e("table-cell", r);
-	return /* @__PURE__ */ t("td", {
-		...u,
-		className: d,
-		onClick: i,
-		colSpan: a,
-		style: o,
-		onDoubleClick: s,
-		onMouseEnter: c,
-		onMouseLeave: l,
-		children: n
-	});
-}, c = ({ children: r, className: i = "", onClick: a, sortable: o = !1, sortDirection: s = null, draggable: c, onDragStart: l, onDragOver: u, onDrop: d, onMouseEnter: f, onMouseLeave: p, ...m }) => {
-	let h = e("table-cell font-medium", o && "cursor-pointer", i);
-	return /* @__PURE__ */ t("th", {
-		...m,
-		className: h,
-		onClick: a,
-		draggable: c,
-		onDragStart: l,
-		onDragOver: u,
-		onDrop: d,
-		onMouseEnter: f,
-		onMouseLeave: p,
-		children: o ? /* @__PURE__ */ n("div", {
-			className: "flex items-center gap-2",
-			children: [r, o && /* @__PURE__ */ t("div", {
-				className: "flex flex-col",
-				children: s === "asc" ? /* @__PURE__ */ t("svg", {
-					xmlns: "http://www.w3.org/2000/svg",
-					className: "h-4 w-4",
-					fill: "none",
-					viewBox: "0 0 24 24",
-					stroke: "currentColor",
-					children: /* @__PURE__ */ t("path", {
-						strokeLinecap: "round",
-						strokeLinejoin: "round",
-						strokeWidth: "2",
-						d: "M5 15l7-7 7 7"
-					})
-				}) : s === "desc" ? /* @__PURE__ */ t("svg", {
-					xmlns: "http://www.w3.org/2000/svg",
-					className: "h-4 w-4",
-					fill: "none",
-					viewBox: "0 0 24 24",
-					stroke: "currentColor",
-					children: /* @__PURE__ */ t("path", {
-						strokeLinecap: "round",
-						strokeLinejoin: "round",
-						strokeWidth: "2",
-						d: "M19 9l-7 7-7-7"
-					})
-				}) : /* @__PURE__ */ t("div", {
-					className: "h-4 w-4 opacity-30",
-					children: /* @__PURE__ */ t("svg", {
+}, c = {
+	Caption: (e) => /* @__PURE__ */ n("caption", { ...e }),
+	Footer: (e) => {
+		let r = t.useContext(i);
+		return /* @__PURE__ */ n("tfoot", {
+			role: r ? "rowgroup" : void 0,
+			...e
+		});
+	},
+	Head: ({ children: r, className: a = "", ...o }) => {
+		let s = t.useContext(i), c = e("table-header-group", a);
+		return /* @__PURE__ */ n("thead", {
+			role: s ? "rowgroup" : void 0,
+			...o,
+			className: c,
+			children: r
+		});
+	},
+	Body: ({ children: r, className: o = "", style: s, ...c }) => {
+		let l = t.useContext(i), u = e("table-row-group", l && "dishui-table-card__grid", l?.gridClassName, o);
+		return /* @__PURE__ */ n(a.Provider, {
+			value: !0,
+			children: /* @__PURE__ */ n("tbody", {
+				role: l ? "rowgroup" : void 0,
+				...c,
+				className: u,
+				style: l ? {
+					...l.gridStyle,
+					...s
+				} : s,
+				children: r
+			})
+		});
+	},
+	Row: ({ children: r, className: o = "", selected: s = !1, style: c, onClick: l, onDoubleClick: u, onMouseEnter: d, onMouseLeave: f, ...p }) => {
+		let m = t.useContext(i), h = t.useContext(a) ? m : null, g = e("table-row", s && "bg-base-200", "hover:bg-base-100", h && "dishui-table-card__row", h?.className, o);
+		return /* @__PURE__ */ n("tr", {
+			role: m ? "row" : void 0,
+			"data-card-selected": h && s ? "true" : void 0,
+			style: h ? {
+				...h.style,
+				...c
+			} : c,
+			className: g,
+			onClick: l,
+			onDoubleClick: u,
+			onMouseEnter: d,
+			onMouseLeave: f,
+			...p,
+			children: r
+		});
+	},
+	Cell: ({ children: o, label: s, className: c = "", onClick: l, colSpan: u, style: d, onDoubleClick: f, onMouseEnter: p, onMouseLeave: m, ...h }) => {
+		let g = t.useContext(i), _ = t.useContext(a) ? g : null, v = e("table-cell", _ && "dishui-table-card__field", _?.fieldClassName, c);
+		return /* @__PURE__ */ r("td", {
+			role: g ? "cell" : void 0,
+			...h,
+			className: v,
+			onClick: l,
+			colSpan: u,
+			style: _ ? {
+				..._.fieldStyle,
+				...d
+			} : d,
+			onDoubleClick: f,
+			onMouseEnter: p,
+			onMouseLeave: m,
+			children: [_ && s != null ? /* @__PURE__ */ n("div", {
+				className: e("dishui-table-card__label", _.labelClassName),
+				style: _.labelStyle,
+				children: s
+			}) : null, o]
+		});
+	},
+	HeaderCell: ({ children: o, className: s = "", style: c, onClick: l, sortable: u = !1, sortDirection: d = null, draggable: f, onDragStart: p, onDragOver: m, onDrop: h, onMouseEnter: g, onMouseLeave: _, ...v }) => {
+		let y = t.useContext(i), b = t.useContext(a), x = b ? y : null, S = e("table-cell font-medium", u && "cursor-pointer", x && "dishui-table-card__field", x?.fieldClassName, s);
+		return /* @__PURE__ */ n("th", {
+			role: y ? v.scope === "row" || v.scope === "rowgroup" || b && !v.scope ? "rowheader" : "columnheader" : void 0,
+			...v,
+			style: x ? {
+				...x.fieldStyle,
+				...c
+			} : c,
+			className: S,
+			onClick: l,
+			draggable: f,
+			onDragStart: p,
+			onDragOver: m,
+			onDrop: h,
+			onMouseEnter: g,
+			onMouseLeave: _,
+			children: u ? /* @__PURE__ */ r("div", {
+				className: "flex items-center gap-2",
+				children: [o, u && /* @__PURE__ */ n("div", {
+					className: "flex flex-col",
+					children: d === "asc" ? /* @__PURE__ */ n("svg", {
 						xmlns: "http://www.w3.org/2000/svg",
 						className: "h-4 w-4",
 						fill: "none",
 						viewBox: "0 0 24 24",
 						stroke: "currentColor",
-						children: /* @__PURE__ */ t("path", {
+						children: /* @__PURE__ */ n("path", {
 							strokeLinecap: "round",
 							strokeLinejoin: "round",
 							strokeWidth: "2",
-							d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4"
+							d: "M5 15l7-7 7 7"
+						})
+					}) : d === "desc" ? /* @__PURE__ */ n("svg", {
+						xmlns: "http://www.w3.org/2000/svg",
+						className: "h-4 w-4",
+						fill: "none",
+						viewBox: "0 0 24 24",
+						stroke: "currentColor",
+						children: /* @__PURE__ */ n("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							strokeWidth: "2",
+							d: "M19 9l-7 7-7-7"
+						})
+					}) : /* @__PURE__ */ n("div", {
+						className: "h-4 w-4 opacity-30",
+						children: /* @__PURE__ */ n("svg", {
+							xmlns: "http://www.w3.org/2000/svg",
+							className: "h-4 w-4",
+							fill: "none",
+							viewBox: "0 0 24 24",
+							stroke: "currentColor",
+							children: /* @__PURE__ */ n("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								strokeWidth: "2",
+								d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4"
+							})
 						})
 					})
-				})
-			})]
-		}) : r
-	});
-}, l = (e) => /* @__PURE__ */ t("caption", { ...e }), u = (e) => /* @__PURE__ */ t("tfoot", { ...e }), d = r;
-d.Caption = l, d.Footer = u, d.Head = i, d.Body = a, d.Row = o, d.Cell = s, d.HeaderCell = c;
+				})]
+			}) : o
+		});
+	}
+}, l = Object.assign(s, c, { Card: Object.assign((e) => /* @__PURE__ */ n(s, {
+	...e,
+	card: !0
+}), c) });
 //#endregion
-export { d as default };
+export { l as default };
 
 //# sourceMappingURL=index.js.map

package/dist/components/Table/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Table/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport type TableProps = {\n  children: React.ReactNode;\n  className?: string;\n  onClick?: (e: React.MouseEvent) => void;\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n} & React.TableHTMLAttributes<HTMLTableElement>;\n\nconst Table = ({\n  children,\n  className = '',\n  onClick,\n  onMouseEnter,\n  onMouseLeave,\n  ...rest\n}: TableProps) => {\n  const baseClass = 'table';\n  \n  const tableClasses = cn(baseClass, className);\n\n  return (\n    <table \n      {...rest}\n      className={tableClasses}\n      onClick={onClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      {children}\n    </table>\n  );\n};\n\n// Table.Head 组件\nexport type TableHeadProps = React.HTMLAttributes<HTMLTableSectionElement>;\n\nconst TableHead = ({\n  children,\n  className = '',\n  ...rest\n}: TableHeadProps) => {\n  const baseClass = 'table-header-group';\n  \n  const headClasses = cn(baseClass, className);\n\n  return (\n    <thead {...rest} className={headClasses}>\n      {children}\n    </thead>\n  );\n};\n\n// Table.Body 组件\nexport type TableBodyProps = React.HTMLAttributes<HTMLTableSectionElement>;\n\nconst TableBody = ({\n  children,\n  className = '',\n  ...rest\n}: TableBodyProps) => {\n  const baseClass = 'table-row-group';\n  \n  const bodyClasses = cn(baseClass, className);\n\n  return (\n    <tbody {...rest} className={bodyClasses}>\n      {children}\n    </tbody>\n  );\n};\n\n// Table.Row 组件\nexport type TableRowProps = {\n  children: React.ReactNode;\n  className?: string;\n  selected?: boolean;\n  onClick?: (e: React.MouseEvent) => void;\n  onDoubleClick?: (e: React.MouseEvent) => void;\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n} & Omit<\n  React.HTMLAttributes<HTMLTableRowElement>,\n  'className' | 'onClick' | 'onDoubleClick' | 'onMouseEnter' | 'onMouseLeave'\n>;\n\nconst TableRow = ({\n  children,\n  className = '',\n  selected = false,\n  onClick,\n  onDoubleClick,\n  onMouseEnter,\n  onMouseLeave,\n  ...rest\n}: TableRowProps) => {\n  const baseClass = 'table-row';\n\n  const rowClasses = cn(\n    baseClass,\n    selected && 'bg-base-200',\n    'hover:bg-base-100',\n    className\n  );\n\n  return (\n    <tr \n      className={rowClasses}\n      onClick={onClick}\n      onDoubleClick={onDoubleClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      {...rest}\n    >\n      {children}\n    </tr>\n  );\n};\n\n// Table.Cell 组件\nexport type TableCellProps = {\n  children?: React.ReactNode;\n  className?: string;\n  onClick?: (e: React.MouseEvent) => void;\n  colSpan?: number;\n  style?: React.CSSProperties;\n  \n  // 添加鼠标事件\n  onDoubleClick?: (e: React.MouseEvent) => void;\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n} & React.TdHTMLAttributes<HTMLTableCellElement>;\n\nconst TableCell = ({\n  children,\n  className = '',\n  onClick,\n  colSpan,\n  style,\n  onDoubleClick,\n  onMouseEnter,\n  onMouseLeave,\n  ...rest\n}: TableCellProps) => {\n  const baseClass = 'table-cell';\n  \n  const cellClasses = cn(baseClass, className);\n\n  return (\n    <td\n      {...rest}\n      className={cellClasses}\n      onClick={onClick}\n      colSpan={colSpan}\n      style={style}\n      onDoubleClick={onDoubleClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      {children}\n    </td>\n  );\n};\n\n// Table.HeaderCell 组件\nexport type TableHeaderCellProps = {\n  children: React.ReactNode;\n  className?: string;\n  onClick?: (e: React.MouseEvent) => void;\n  sortable?: boolean;\n  sortDirection?: 'asc' | 'desc' | null;\n  \n  // 拖拽相关属性\n  draggable?: boolean;\n  onDragStart?: (e: React.DragEvent) => void;\n  onDragOver?: (e: React.DragEvent) => void;\n  onDrop?: (e: React.DragEvent) => void;\n  \n  // 鼠标事件\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n} & React.ThHTMLAttributes<HTMLTableCellElement>;\n\nconst TableHeaderCell = ({\n  children,\n  className = '',\n  onClick,\n  sortable = false,\n  sortDirection = null,\n  \n  // 拖拽相关属性\n  draggable,\n  onDragStart,\n  onDragOver,\n  onDrop,\n  \n  // 鼠标事件\n  onMouseEnter,\n  onMouseLeave,\n  ...rest\n}: TableHeaderCellProps) => {\n  const baseClass = 'table-cell font-medium';\n  \n  const headerCellClasses = cn(\n    baseClass,\n    sortable && 'cursor-pointer',\n    className\n  );\n\n  return (\n    <th\n      {...rest}\n      className={headerCellClasses}\n      onClick={onClick}\n      draggable={draggable}\n      onDragStart={onDragStart}\n      onDragOver={onDragOver}\n      onDrop={onDrop}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      {sortable ? <div className=\"flex items-center gap-2\">\n        {children}\n        {sortable && (\n          <div className=\"flex flex-col\">\n            {sortDirection === 'asc' ? (\n              <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M5 15l7-7 7 7\" />\n              </svg>\n            ) : sortDirection === 'desc' ? (\n              <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M19 9l-7 7-7-7\" />\n              </svg>\n            ) : (\n              <div className=\"h-4 w-4 opacity-30\">\n                <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                  <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4\" />\n                </svg>\n              </div>\n            )}\n          </div>\n        )}\n      </div> : children}\n    </th>\n  );\n};\n\nexport type TableCaptionProps = React.HTMLAttributes<HTMLTableCaptionElement>;\nexport type TableFooterProps = React.HTMLAttributes<HTMLTableSectionElement>;\nconst TableCaption = (props: TableCaptionProps) => <caption {...props} />;\nconst TableFooter = (props: TableFooterProps) => <tfoot {...props} />;\n\n// 扩展Table组件，添加子组件\ninterface TableCompound extends React.FC<TableProps> {\n  Caption: React.FC<TableCaptionProps>;\n  Footer: React.FC<TableFooterProps>;\n  Head: React.FC<TableHeadProps>;\n  Body: React.FC<TableBodyProps>;\n  Row: React.FC<TableRowProps>;\n  Cell: React.FC<TableCellProps>;\n  HeaderCell: React.FC<TableHeaderCellProps>;\n}\n\nconst TableWithCompounds = Table as TableCompound;\nTableWithCompounds.Caption = TableCaption;\nTableWithCompounds.Footer = TableFooter;\nTableWithCompounds.Head = TableHead;\nTableWithCompounds.Body = TableBody;\nTableWithCompounds.Row = TableRow;\nTableWithCompounds.Cell = TableCell;\nTableWithCompounds.HeaderCell = TableHeaderCell;\n\nexport default TableWithCompounds; "],"mappings":";;;;AAWA,IAAM,KAAS,EACb,aACA,eAAY,IACZ,YACA,iBACA,iBACA,GAAG,QACa;CAGhB,IAAM,IAAe,EAAG,SAAW,CAAS;CAE5C,OACE,kBAAC,SAAD;EACE,GAAI;EACJ,WAAW;EACF;EACK;EACA;EAEb;CACI,CAAA;AAEX,GAKM,KAAa,EACjB,aACA,eAAY,IACZ,GAAG,QACiB;CAGpB,IAAM,IAAc,EAAG,sBAAW,CAAS;CAE3C,OACE,kBAAC,SAAD;EAAO,GAAI;EAAM,WAAW;EACzB;CACI,CAAA;AAEX,GAKM,KAAa,EACjB,aACA,eAAY,IACZ,GAAG,QACiB;CAGpB,IAAM,IAAc,EAAG,mBAAW,CAAS;CAE3C,OACE,kBAAC,SAAD;EAAO,GAAI;EAAM,WAAW;EACzB;CACI,CAAA;AAEX,GAgBM,KAAY,EAChB,aACA,eAAY,IACZ,cAAW,IACX,YACA,kBACA,iBACA,iBACA,GAAG,QACgB;CAGnB,IAAM,IAAa,EACjB,aACA,KAAY,eACZ,qBACA,CACF;CAEA,OACE,kBAAC,MAAD;EACE,WAAW;EACF;EACM;EACD;EACA;EACd,GAAI;EAEH;CACC,CAAA;AAER,GAgBM,KAAa,EACjB,aACA,eAAY,IACZ,YACA,YACA,UACA,kBACA,iBACA,iBACA,GAAG,QACiB;CAGpB,IAAM,IAAc,EAAG,cAAW,CAAS;CAE3C,OACE,kBAAC,MAAD;EACE,GAAI;EACJ,WAAW;EACF;EACA;EACF;EACQ;EACD;EACA;EAEb;CACC,CAAA;AAER,GAqBM,KAAmB,EACvB,aACA,eAAY,IACZ,YACA,cAAW,IACX,mBAAgB,MAGhB,cACA,gBACA,eACA,WAGA,iBACA,iBACA,GAAG,QACuB;CAG1B,IAAM,IAAoB,EACxB,0BACA,KAAY,kBACZ,CACF;CAEA,OACE,kBAAC,MAAD;EACE,GAAI;EACJ,WAAW;EACF;EACE;EACE;EACD;EACJ;EACM;EACA;EAEb,UAAA,IAAW,kBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACT,GACA,KACC,kBAAC,OAAD;IAAK,WAAU;IACZ,UAAA,MAAkB,QACjB,kBAAC,OAAD;KAAK,OAAM;KAA6B,WAAU;KAAU,MAAK;KAAO,SAAQ;KAAY,QAAO;KACjG,UAAA,kBAAC,QAAD;MAAM,eAAc;MAAQ,gBAAe;MAAQ,aAAY;MAAI,GAAE;KAAiB,CAAA;IACnF,CAAA,IACH,MAAkB,SACpB,kBAAC,OAAD;KAAK,OAAM;KAA6B,WAAU;KAAU,MAAK;KAAO,SAAQ;KAAY,QAAO;KACjG,UAAA,kBAAC,QAAD;MAAM,eAAc;MAAQ,gBAAe;MAAQ,aAAY;MAAI,GAAE;KAAkB,CAAA;IACpF,CAAA,IAEL,kBAAC,OAAD;KAAK,WAAU;KACb,UAAA,kBAAC,OAAD;MAAK,OAAM;MAA6B,WAAU;MAAU,MAAK;MAAO,SAAQ;MAAY,QAAO;MACjG,UAAA,kBAAC,QAAD;OAAM,eAAc;OAAQ,gBAAe;OAAQ,aAAY;OAAI,GAAE;MAAoD,CAAA;KACtH,CAAA;IACF,CAAA;GAEJ,CAAA,CAEJ;EAAI,CAAA,IAAA;CACP,CAAA;AAER,GAIM,KAAgB,MAA6B,kBAAC,WAAD,EAAS,GAAI,EAAQ,CAAA,GAClE,KAAe,MAA4B,kBAAC,SAAD,EAAO,GAAI,EAAQ,CAAA,GAa9D,IAAqB;AAC3B,EAAmB,UAAU,GAC7B,EAAmB,SAAS,GAC5B,EAAmB,OAAO,GAC1B,EAAmB,OAAO,GAC1B,EAAmB,MAAM,GACzB,EAAmB,OAAO,GAC1B,EAAmB,aAAa"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Table/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\nimport './Table.css';\n\nexport type TableCardOptions = {\n  /** Applied to each Table.Body grid. */\n  gridClassName?: string;\n  gridStyle?: React.CSSProperties;\n  /** Applied to each body row card. */\n  className?: string;\n  style?: React.CSSProperties;\n  fieldClassName?: string;\n  fieldStyle?: React.CSSProperties;\n  labelClassName?: string;\n  labelStyle?: React.CSSProperties;\n};\n\nconst CardContext = React.createContext<TableCardOptions | null>(null);\nconst BodyContext = React.createContext(false);\nconst defaultCardOptions: TableCardOptions = {};\n\nexport type TableProps = {\n  children: React.ReactNode;\n  card?: boolean;\n  cardOptions?: TableCardOptions;\n  className?: string;\n  onClick?: (e: React.MouseEvent) => void;\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n} & React.TableHTMLAttributes<HTMLTableElement>;\n\nconst Table = ({\n  children,\n  className = '',\n  card = false,\n  cardOptions = defaultCardOptions,\n  onClick,\n  onMouseEnter,\n  onMouseLeave,\n  ...rest\n}: TableProps) => {\n  const baseClass = 'table';\n  \n  const tableClasses = cn(baseClass, card && 'dishui-table-card', className);\n\n  return (\n    <CardContext.Provider value={card ? cardOptions : null}>\n      <BodyContext.Provider value={false}>\n        <table\n          role={card ? 'table' : undefined}\n          {...rest}\n          className={tableClasses}\n          onClick={onClick}\n          onMouseEnter={onMouseEnter}\n          onMouseLeave={onMouseLeave}\n        >\n          {children}\n        </table>\n      </BodyContext.Provider>\n    </CardContext.Provider>\n  );\n};\n\n// Table.Head 组件\nexport type TableHeadProps = React.HTMLAttributes<HTMLTableSectionElement>;\n\nconst TableHead = ({\n  children,\n  className = '',\n  ...rest\n}: TableHeadProps) => {\n  const options = React.useContext(CardContext);\n  const baseClass = 'table-header-group';\n  \n  const headClasses = cn(baseClass, className);\n\n  return (\n    <thead role={options ? 'rowgroup' : undefined} {...rest} className={headClasses}>\n      {children}\n    </thead>\n  );\n};\n\n// Table.Body 组件\nexport type TableBodyProps = React.HTMLAttributes<HTMLTableSectionElement>;\n\nconst TableBody = ({\n  children,\n  className = '',\n  style,\n  ...rest\n}: TableBodyProps) => {\n  const options = React.useContext(CardContext);\n  const bodyClasses = cn('table-row-group', options && 'dishui-table-card__grid', options?.gridClassName, className);\n\n  return (\n    <BodyContext.Provider value={true}>\n      <tbody\n        role={options ? 'rowgroup' : undefined}\n        {...rest}\n        className={bodyClasses}\n        style={options ? { ...options.gridStyle, ...style } : style}\n      >\n        {children}\n      </tbody>\n    </BodyContext.Provider>\n  );\n};\n\n// Table.Row 组件\nexport type TableRowProps = {\n  children: React.ReactNode;\n  className?: string;\n  selected?: boolean;\n  onClick?: (e: React.MouseEvent) => void;\n  onDoubleClick?: (e: React.MouseEvent) => void;\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n} & Omit<\n  React.HTMLAttributes<HTMLTableRowElement>,\n  'className' | 'onClick' | 'onDoubleClick' | 'onMouseEnter' | 'onMouseLeave'\n>;\n\nconst TableRow = ({\n  children,\n  className = '',\n  selected = false,\n  style,\n  onClick,\n  onDoubleClick,\n  onMouseEnter,\n  onMouseLeave,\n  ...rest\n}: TableRowProps) => {\n  const cardOptions = React.useContext(CardContext);\n  const inBody = React.useContext(BodyContext);\n  const options = inBody ? cardOptions : null;\n  const baseClass = 'table-row';\n\n  const rowClasses = cn(\n    baseClass,\n    selected && 'bg-base-200',\n    'hover:bg-base-100',\n    options && 'dishui-table-card__row',\n    options?.className,\n    className\n  );\n\n  return (\n    <tr\n      role={cardOptions ? 'row' : undefined}\n      data-card-selected={options && selected ? 'true' : undefined}\n      style={options ? { ...options.style, ...style } : style}\n      className={rowClasses}\n      onClick={onClick}\n      onDoubleClick={onDoubleClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      {...rest}\n    >\n      {children}\n    </tr>\n  );\n};\n\n// Table.Cell 组件\nexport type TableCellProps = {\n  children?: React.ReactNode;\n  /** Visible field label in card body cells only. */\n  label?: React.ReactNode;\n  className?: string;\n  onClick?: (e: React.MouseEvent) => void;\n  colSpan?: number;\n  style?: React.CSSProperties;\n  \n  // 添加鼠标事件\n  onDoubleClick?: (e: React.MouseEvent) => void;\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n} & React.TdHTMLAttributes<HTMLTableCellElement>;\n\nconst TableCell = ({\n  children,\n  label,\n  className = '',\n  onClick,\n  colSpan,\n  style,\n  onDoubleClick,\n  onMouseEnter,\n  onMouseLeave,\n  ...rest\n}: TableCellProps) => {\n  const cardOptions = React.useContext(CardContext);\n  const inBody = React.useContext(BodyContext);\n  const options = inBody ? cardOptions : null;\n  const cellClasses = cn('table-cell', options && 'dishui-table-card__field', options?.fieldClassName, className);\n\n  return (\n    <td\n      role={cardOptions ? 'cell' : undefined}\n      {...rest}\n      className={cellClasses}\n      onClick={onClick}\n      colSpan={colSpan}\n      style={options ? { ...options.fieldStyle, ...style } : style}\n      onDoubleClick={onDoubleClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      {/* Keep children in a fixed slot so mode/label changes preserve local state. */}\n      {options && label !== null && label !== undefined ? <div className={cn('dishui-table-card__label', options.labelClassName)} style={options.labelStyle}>{label}</div> : null}\n      {children}\n    </td>\n  );\n};\n\n// Table.HeaderCell 组件\nexport type TableHeaderCellProps = {\n  children: React.ReactNode;\n  className?: string;\n  onClick?: (e: React.MouseEvent) => void;\n  sortable?: boolean;\n  sortDirection?: 'asc' | 'desc' | null;\n  \n  // 拖拽相关属性\n  draggable?: boolean;\n  onDragStart?: (e: React.DragEvent) => void;\n  onDragOver?: (e: React.DragEvent) => void;\n  onDrop?: (e: React.DragEvent) => void;\n  \n  // 鼠标事件\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: (e: React.MouseEvent) => void;\n} & React.ThHTMLAttributes<HTMLTableCellElement>;\n\nconst TableHeaderCell = ({\n  children,\n  className = '',\n  style,\n  onClick,\n  sortable = false,\n  sortDirection = null,\n  \n  // 拖拽相关属性\n  draggable,\n  onDragStart,\n  onDragOver,\n  onDrop,\n  \n  // 鼠标事件\n  onMouseEnter,\n  onMouseLeave,\n  ...rest\n}: TableHeaderCellProps) => {\n  const cardOptions = React.useContext(CardContext);\n  const inBody = React.useContext(BodyContext);\n  const options = inBody ? cardOptions : null;\n  const baseClass = 'table-cell font-medium';\n  \n  const headerCellClasses = cn(\n    baseClass,\n    sortable && 'cursor-pointer',\n    options && 'dishui-table-card__field',\n    options?.fieldClassName,\n    className\n  );\n\n  return (\n    <th\n      role={cardOptions ? (rest.scope === 'row' || rest.scope === 'rowgroup' || (inBody && !rest.scope) ? 'rowheader' : 'columnheader') : undefined}\n      {...rest}\n      style={options ? { ...options.fieldStyle, ...style } : style}\n      className={headerCellClasses}\n      onClick={onClick}\n      draggable={draggable}\n      onDragStart={onDragStart}\n      onDragOver={onDragOver}\n      onDrop={onDrop}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      {sortable ? <div className=\"flex items-center gap-2\">\n        {children}\n        {sortable && (\n          <div className=\"flex flex-col\">\n            {sortDirection === 'asc' ? (\n              <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M5 15l7-7 7 7\" />\n              </svg>\n            ) : sortDirection === 'desc' ? (\n              <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M19 9l-7 7-7-7\" />\n              </svg>\n            ) : (\n              <div className=\"h-4 w-4 opacity-30\">\n                <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                  <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4\" />\n                </svg>\n              </div>\n            )}\n          </div>\n        )}\n      </div> : children}\n    </th>\n  );\n};\n\nexport type TableCaptionProps = React.HTMLAttributes<HTMLTableCaptionElement>;\nexport type TableFooterProps = React.HTMLAttributes<HTMLTableSectionElement>;\nconst TableCaption = (props: TableCaptionProps) => <caption {...props} />;\nconst TableFooter = (props: TableFooterProps) => {\n  const options = React.useContext(CardContext);\n  return <tfoot role={options ? 'rowgroup' : undefined} {...props} />;\n};\n\n// 扩展Table组件，添加子组件\nexport type TableCardProps = Omit<TableProps, 'card'>;\n\ninterface TableSubcomponents {\n  Caption: React.FC<TableCaptionProps>;\n  Footer: React.FC<TableFooterProps>;\n  Head: React.FC<TableHeadProps>;\n  Body: React.FC<TableBodyProps>;\n  Row: React.FC<TableRowProps>;\n  Cell: React.FC<TableCellProps>;\n  HeaderCell: React.FC<TableHeaderCellProps>;\n}\n\nconst subcomponents: TableSubcomponents = {\n  Caption: TableCaption,\n  Footer: TableFooter,\n  Head: TableHead,\n  Body: TableBody,\n  Row: TableRow,\n  Cell: TableCell,\n  HeaderCell: TableHeaderCell,\n};\n\nconst TableCard = (props: TableCardProps) => <Table {...props} card />;\nconst TableWithCompounds = Object.assign(Table, subcomponents, {\n  Card: Object.assign(TableCard, subcomponents),\n});\n\nexport default TableWithCompounds; "],"mappings":"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"}

package/dist/components/ai/AgentChat/index.d.ts

@@ -0,0 +1,54 @@
+import React from 'react';
+export type AgentChatReasoningStep = {
+    /** Tools used in this step, rendered as chips: `Sales History · Flavor Data`. */
+    tools?: string[];
+    /** Rendered as `for 4s` after the chips. */
+    durationMs?: number;
+    /** Plain-language result of the step. */
+    summary?: React.ReactNode;
+};
+export type AgentChatMessage = {
+    id: string;
+    role: 'user' | 'assistant';
+    content?: React.ReactNode | string;
+    /** Assistant-only: each step renders as a chips-and-duration line followed by its summary. */
+    reasoning?: AgentChatReasoningStep[];
+    /** Epoch milliseconds. */
+    createdAt?: number;
+};
+export type ChatThread = {
+    id: string;
+    label: string;
+    messages: AgentChatMessage[];
+};
+export type AgentChatLabels = {
+    send?: string;
+    thinking?: string;
+    threads?: string;
+    messages?: string;
+};
+export type AgentChatProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {
+    threads: ChatThread[];
+    /** Controlled active thread id. */
+    activeThread?: string;
+    defaultActiveThread?: string;
+    onActiveThreadChange?: (threadId: string) => void;
+    /** Called with the trimmed composer text and the active thread id. */
+    onSend?: (text: string, threadId: string) => void;
+    /** Shows a thinking indicator under the last message and disables sending. */
+    busy?: boolean;
+    placeholder?: string;
+    /** Total panel height; number = px. */
+    height?: string | number;
+    /** Replace the default message renderer. */
+    renderMessage?: (message: AgentChatMessage) => React.ReactNode;
+    /** Shown when the active thread has no messages. */
+    emptyState?: React.ReactNode;
+    labels?: AgentChatLabels;
+};
+/**
+ * Tabbed chat panel: a `tablist` of threads, a scrollable log where user
+ * turns sit right in a muted bubble and assistant turns sit left as plain
+ * text with their reasoning lines, and a composer that auto-grows.
+ */
+export default function AgentChat({ threads, activeThread: activeProp, defaultActiveThread, onActiveThreadChange, onSend, busy, placeholder, height, renderMessage, emptyState, labels, className, style, ...rest }: AgentChatProps): React.JSX.Element;

package/dist/components/ai/AgentChat/index.js

@@ -0,0 +1,176 @@
+import { cn as e } from "../../../utils/cn.js";
+import { formatDuration as t } from "../shared.js";
+import n from "../LoadingState/index.js";
+/* empty css          */
+import r, { useCallback as i, useEffect as a, useId as o, useRef as s, useState as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/ai/AgentChat/index.tsx
+var f = {
+	send: "Send",
+	thinking: "Thinking",
+	threads: "Threads",
+	messages: "Messages"
+}, p = (e) => {
+	e.style.height = "auto", e.style.height = `${Math.min(e.scrollHeight, 160)}px`;
+}, m = () => /* @__PURE__ */ d("svg", {
+	width: "16",
+	height: "16",
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "2",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": "true",
+	children: [/* @__PURE__ */ u("path", { d: "m5 12 7-7 7 7" }), /* @__PURE__ */ u("path", { d: "M12 19V5" })]
+}), h = ({ steps: e }) => /* @__PURE__ */ u("ol", {
+	className: "dishui-ai-agent-chat__reasoning",
+	children: e.map((e) => /* @__PURE__ */ d("li", {
+		className: "dishui-ai-agent-chat__step",
+		children: [(e.tools?.length || e.durationMs !== void 0) && /* @__PURE__ */ d("div", {
+			className: "dishui-ai-agent-chat__tools",
+			children: [e.tools?.map((e, t) => /* @__PURE__ */ d(r.Fragment, { children: [t > 0 && /* @__PURE__ */ u("span", {
+				className: "dishui-ai-agent-chat__sep",
+				"aria-hidden": "true",
+				children: "·"
+			}), /* @__PURE__ */ u("span", {
+				className: "dishui-ai-agent-chat__chip",
+				children: e
+			})] }, e)), e.durationMs !== void 0 && /* @__PURE__ */ d(l, { children: [!!e.tools?.length && /* @__PURE__ */ u("span", {
+				className: "dishui-ai-agent-chat__sep",
+				"aria-hidden": "true",
+				children: "·"
+			}), /* @__PURE__ */ d("span", {
+				className: "dishui-ai-agent-chat__duration",
+				children: ["for ", t(e.durationMs)]
+			})] })]
+		}), e.summary !== void 0 && /* @__PURE__ */ u("div", {
+			className: "dishui-ai-agent-chat__summary",
+			children: e.summary
+		})]
+	}, `${e.durationMs ?? ""}-${e.tools?.join("-") ?? ""}-${String(e.summary ?? "")}`))
+}), g = ({ message: t }) => /* @__PURE__ */ d("div", {
+	className: e("dishui-ai-agent-chat__message", `dishui-ai-agent-chat__message--${t.role}`),
+	children: [t.role === "assistant" && t.reasoning?.length ? /* @__PURE__ */ u(h, { steps: t.reasoning }) : null, t.content !== void 0 && t.content !== null && /* @__PURE__ */ u("div", {
+		className: "dishui-ai-agent-chat__content",
+		children: t.content
+	})]
+});
+function _({ threads: t, activeThread: l, defaultActiveThread: h, onActiveThreadChange: _, onSend: v, busy: y = !1, placeholder: b = "Ask the agent…", height: x = 480, renderMessage: S, emptyState: C, labels: w, className: T, style: E, ...D }) {
+	let O = o(), k = {
+		...f,
+		...w
+	}, [A, j] = c(h ?? t[0]?.id), M = l ?? A, N = t.find((e) => e.id === M) ?? t[0], P = i((e) => {
+		j(e), _?.(e);
+	}, [_]), F = s({}), I = (e, n) => {
+		let r;
+		if (e.key === "ArrowRight" ? r = (n + 1) % t.length : e.key === "ArrowLeft" ? r = (n - 1 + t.length) % t.length : e.key === "Home" ? r = 0 : e.key === "End" && (r = t.length - 1), r === void 0) return;
+		e.preventDefault();
+		let i = t[r];
+		P(i.id), F.current[i.id]?.focus();
+	}, L = s(null), R = N?.messages.length ?? 0;
+	a(() => {
+		let e = L.current;
+		e && (e.scrollTop = e.scrollHeight);
+	}, [R, y]);
+	let [z, B] = c(""), V = s(null), H = !y && z.trim().length > 0 && !!N, U = () => {
+		if (!H || !N) return;
+		v?.(z.trim(), N.id), B("");
+		let e = V.current;
+		e && (e.style.height = "auto");
+	}, W = (e) => {
+		e.key === "Enter" && !e.shiftKey && !e.nativeEvent.isComposing && (e.preventDefault(), U());
+	}, G = `${O}-panel`, K = (e) => `${O}-tab-${e}`;
+	return /* @__PURE__ */ d("div", {
+		...D,
+		className: e("dishui-ai-agent-chat", T),
+		style: {
+			...E,
+			height: typeof x == "number" ? `${x}px` : x
+		},
+		children: [
+			t.length > 1 && /* @__PURE__ */ u("div", {
+				className: "dishui-ai-agent-chat__tabs",
+				role: "tablist",
+				"aria-label": k.threads,
+				children: t.map((t, n) => {
+					let r = t.id === N?.id;
+					return /* @__PURE__ */ u("button", {
+						ref: (e) => {
+							F.current[t.id] = e;
+						},
+						id: K(t.id),
+						type: "button",
+						role: "tab",
+						"aria-selected": r,
+						"aria-controls": G,
+						tabIndex: r ? 0 : -1,
+						className: e("dishui-ai-agent-chat__tab", r && "dishui-ai-agent-chat__tab--active"),
+						onClick: () => P(t.id),
+						onKeyDown: (e) => I(e, n),
+						children: t.label
+					}, t.id);
+				})
+			}),
+			/* @__PURE__ */ u("div", {
+				ref: L,
+				id: G,
+				role: "tabpanel",
+				"aria-labelledby": N && t.length > 1 ? K(N.id) : void 0,
+				className: "dishui-ai-agent-chat__log",
+				children: /* @__PURE__ */ d("div", {
+					role: "log",
+					"aria-live": "polite",
+					"aria-label": k.messages,
+					className: "dishui-ai-agent-chat__messages",
+					children: [
+						R === 0 && !y && C !== void 0 && /* @__PURE__ */ u("div", {
+							className: "dishui-ai-agent-chat__empty",
+							children: C
+						}),
+						N?.messages.map((e) => /* @__PURE__ */ u(r.Fragment, { children: S ? S(e) : /* @__PURE__ */ u(g, { message: e }) }, e.id)),
+						y && /* @__PURE__ */ u("div", {
+							className: "dishui-ai-agent-chat__message dishui-ai-agent-chat__message--assistant",
+							children: /* @__PURE__ */ u(n, {
+								variant: "dots",
+								size: "sm",
+								label: k.thinking,
+								showElapsed: !1
+							})
+						})
+					]
+				})
+			}),
+			/* @__PURE__ */ d("form", {
+				className: "dishui-ai-agent-chat__composer",
+				onSubmit: (e) => {
+					e.preventDefault(), U();
+				},
+				children: [/* @__PURE__ */ u("textarea", {
+					ref: V,
+					className: "dishui-ai-agent-chat__input",
+					rows: 1,
+					value: z,
+					placeholder: b,
+					"aria-label": b,
+					disabled: !N,
+					onChange: (e) => {
+						B(e.target.value), p(e.target);
+					},
+					onKeyDown: W
+				}), /* @__PURE__ */ u("button", {
+					type: "submit",
+					className: "dishui-ai-agent-chat__send",
+					disabled: !H,
+					"aria-label": k.send,
+					title: k.send,
+					children: /* @__PURE__ */ u(m, {})
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { _ as default };
+
+//# sourceMappingURL=index.js.map