@mirror-physics/fractal-ui 0.2.0-next.73 → 0.2.0-next.74

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.
Files changed (9) hide show
  1. package/dist/index.cjs +368 -265
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +141 -16
  4. package/dist/index.css.map +1 -1
  5. package/dist/index.d.cts +26 -1
  6. package/dist/index.d.ts +26 -1
  7. package/dist/index.js +373 -272
  8. package/dist/index.js.map +1 -1
  9. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -101,6 +101,8 @@ __export(index_exports, {
101
101
  TextButtonGhost: () => TextButtonGhost,
102
102
  Textarea: () => Textarea,
103
103
  TextareaGhost: () => TextareaGhost,
104
+ Toast: () => Toast,
105
+ ToastViewport: () => ToastViewport,
104
106
  Toggle: () => Toggle,
105
107
  ToggleGhost: () => ToggleGhost,
106
108
  UILoader: () => UILoader,
@@ -1138,10 +1140,109 @@ var AlertDescription = React9.forwardRef(
1138
1140
  );
1139
1141
  AlertDescription.displayName = "AlertDescription";
1140
1142
 
1141
- // src/components/Toggle/Toggle.tsx
1143
+ // src/components/Toast/Toast.tsx
1144
+ var React10 = __toESM(require("react"), 1);
1145
+ var import_react_dom = require("react-dom");
1146
+ var import_fractal_icons8 = require("@mirror-physics/fractal-icons");
1142
1147
  var import_jsx_runtime13 = require("react/jsx-runtime");
1143
- function Toggle({ checked, onChange, label, className }) {
1148
+ var defaultIcons2 = {
1149
+ default: import_fractal_icons8.CircleInfo,
1150
+ info: import_fractal_icons8.CircleInfo,
1151
+ success: import_fractal_icons8.CircleCheck,
1152
+ warning: import_fractal_icons8.Warning,
1153
+ error: import_fractal_icons8.CircleClose
1154
+ };
1155
+ var Toast = React10.forwardRef(function Toast2({
1156
+ action,
1157
+ children,
1158
+ className,
1159
+ dismissLabel = "Dismiss notification",
1160
+ duration,
1161
+ icon,
1162
+ onBlurCapture,
1163
+ onDismiss,
1164
+ onFocusCapture,
1165
+ onPointerEnter,
1166
+ onPointerLeave,
1167
+ role,
1168
+ variant = "default",
1169
+ ...props
1170
+ }, ref) {
1171
+ const [paused, setPaused] = React10.useState(false);
1172
+ const dismissRef = React10.useRef(onDismiss);
1173
+ const DefaultIcon = defaultIcons2[variant];
1174
+ const resolvedDuration = duration === void 0 ? variant === "error" ? null : 5e3 : duration;
1175
+ React10.useEffect(() => {
1176
+ dismissRef.current = onDismiss;
1177
+ }, [onDismiss]);
1178
+ React10.useEffect(() => {
1179
+ if (!dismissRef.current || paused || resolvedDuration === null || resolvedDuration <= 0) return;
1180
+ const timeout = window.setTimeout(() => dismissRef.current?.(), resolvedDuration);
1181
+ return () => window.clearTimeout(timeout);
1182
+ }, [paused, resolvedDuration]);
1183
+ const announcementRole = role ?? (variant === "error" ? "alert" : "status");
1144
1184
  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
1185
+ "div",
1186
+ {
1187
+ ref,
1188
+ "aria-atomic": "true",
1189
+ "aria-live": announcementRole === "alert" ? "assertive" : "polite",
1190
+ className: cn("fractal-toast", `fractal-toast--${variant}`, className),
1191
+ role: announcementRole,
1192
+ onBlurCapture: (event) => {
1193
+ onBlurCapture?.(event);
1194
+ if (!event.currentTarget.contains(event.relatedTarget)) setPaused(false);
1195
+ },
1196
+ onFocusCapture: (event) => {
1197
+ onFocusCapture?.(event);
1198
+ setPaused(true);
1199
+ },
1200
+ onPointerEnter: (event) => {
1201
+ onPointerEnter?.(event);
1202
+ setPaused(true);
1203
+ },
1204
+ onPointerLeave: (event) => {
1205
+ onPointerLeave?.(event);
1206
+ setPaused(false);
1207
+ },
1208
+ ...props,
1209
+ children: [
1210
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { "aria-hidden": "true", className: "fractal-toast__icon", children: icon ?? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DefaultIcon, { size: 18 }) }),
1211
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "fractal-toast__content", children }),
1212
+ action && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "fractal-toast__action", children: action }),
1213
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
1214
+ "button",
1215
+ {
1216
+ "aria-label": dismissLabel,
1217
+ className: "fractal-toast__dismiss",
1218
+ onClick: onDismiss,
1219
+ type: "button",
1220
+ children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_fractal_icons8.Close, { "aria-hidden": "true", size: 14 })
1221
+ }
1222
+ )
1223
+ ]
1224
+ }
1225
+ );
1226
+ });
1227
+ var ToastViewport = React10.forwardRef(function ToastViewport2({ children, className, portal = true, position = "top-center", ...props }, ref) {
1228
+ const viewport = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
1229
+ "div",
1230
+ {
1231
+ ref,
1232
+ className: cn("fractal-toast-viewport", `fractal-toast-viewport--${position}`, className),
1233
+ "data-position": position,
1234
+ ...props,
1235
+ children
1236
+ }
1237
+ );
1238
+ if (!portal || typeof document === "undefined") return viewport;
1239
+ return (0, import_react_dom.createPortal)(viewport, document.body);
1240
+ });
1241
+
1242
+ // src/components/Toggle/Toggle.tsx
1243
+ var import_jsx_runtime14 = require("react/jsx-runtime");
1244
+ function Toggle({ checked, onChange, label, className }) {
1245
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
1145
1246
  "button",
1146
1247
  {
1147
1248
  type: "button",
@@ -1150,16 +1251,16 @@ function Toggle({ checked, onChange, label, className }) {
1150
1251
  className: cn("fractal-toggle", className),
1151
1252
  onClick: () => onChange(!checked),
1152
1253
  children: [
1153
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: cn("fractal-toggle-track", checked && "fractal-toggle-track--checked"), children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: cn("fractal-toggle-thumb", checked && "fractal-toggle-thumb--checked") }) }),
1154
- label && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "fractal-toggle-label", children: label })
1254
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: cn("fractal-toggle-track", checked && "fractal-toggle-track--checked"), children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: cn("fractal-toggle-thumb", checked && "fractal-toggle-thumb--checked") }) }),
1255
+ label && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "fractal-toggle-label", children: label })
1155
1256
  ]
1156
1257
  }
1157
1258
  );
1158
1259
  }
1159
1260
 
1160
1261
  // src/components/Modal/Modal.tsx
1161
- var React10 = __toESM(require("react"), 1);
1162
- var import_react_dom = require("react-dom");
1262
+ var React11 = __toESM(require("react"), 1);
1263
+ var import_react_dom2 = require("react-dom");
1163
1264
 
1164
1265
  // src/hooks/useEscapeDismiss.ts
1165
1266
  var import_react2 = require("react");
@@ -1213,7 +1314,7 @@ function useEscapeDismiss(priority, handler, enabled = true) {
1213
1314
 
1214
1315
  // src/components/UILoader/UILoader.tsx
1215
1316
  var import_react3 = require("react");
1216
- var import_jsx_runtime14 = require("react/jsx-runtime");
1317
+ var import_jsx_runtime15 = require("react/jsx-runtime");
1217
1318
  var LEFT = "M0 53C0 51 1.6 49.5 3.6 49.5h16.5c1 0 1.9.4 2.5 1L42.1 69.6c.7.7 1.1 1.6 1.1 2.5v16.2c0 2-1.6 3.5-3.6 3.5H23.1c-1 0-1.9-.4-2.5-1L1.1 71.7C.4 71 0 70.1 0 69.2V53Z";
1218
1319
  var CENTER = "M0 3.5C0 1.6 1.6 0 3.6 0h16.5c1 0 1.9.4 2.5 1L92.5 69.6c.7.7 1 1.6 1 2.5v16.2c0 2-1.6 3.5-3.6 3.5H73.4c-1 0-1.9-.4-2.5-1L1.1 22.2C.4 21.6 0 20.7 0 19.7V3.5Z";
1219
1320
  var RIGHT = "M50.4 3.5C50.4 1.6 52 0 54 0h16.5c1 0 1.9.4 2.5 1l69.8 68.6c.7.7 1.1 1.6 1.1 2.5v16.2c0 2-1.6 3.5-3.6 3.5h-16.5c-1 0-1.9-.4-2.5-1L51.4 22.2c-.7-.6-1-1.5-1-2.5V3.5Z";
@@ -1222,7 +1323,7 @@ function UILoader({ size = 48, tone = "neutral", className, style, label = "Load
1222
1323
  const clipId = `fractal-ui-loader-clip-${rawId}`;
1223
1324
  const gradientId = `fractal-ui-loader-gradient-${rawId}`;
1224
1325
  const height = typeof size === "number" ? `${size}px` : size;
1225
- return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1326
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1226
1327
  "span",
1227
1328
  {
1228
1329
  "aria-hidden": ariaHidden || void 0,
@@ -1230,52 +1331,52 @@ function UILoader({ size = 48, tone = "neutral", className, style, label = "Load
1230
1331
  className: cn("fractal-ui-loader", `fractal-ui-loader--${tone}`, className),
1231
1332
  role: ariaHidden ? void 0 : "status",
1232
1333
  style,
1233
- children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("svg", { "aria-hidden": "true", fill: "none", viewBox: "0 0 144 92", style: { height, width: "auto" }, children: [
1234
- /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("defs", { children: [
1235
- /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("linearGradient", { id: gradientId, x1: "59", x2: "94.3", y1: "0", y2: "89.1", gradientUnits: "userSpaceOnUse", children: [
1236
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("stop", { className: "fractal-ui-loader__stop-start", offset: "0" }),
1237
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("stop", { className: "fractal-ui-loader__stop-end", offset: "1" })
1334
+ children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("svg", { "aria-hidden": "true", fill: "none", viewBox: "0 0 144 92", style: { height, width: "auto" }, children: [
1335
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("defs", { children: [
1336
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("linearGradient", { id: gradientId, x1: "59", x2: "94.3", y1: "0", y2: "89.1", gradientUnits: "userSpaceOnUse", children: [
1337
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("stop", { className: "fractal-ui-loader__stop-start", offset: "0" }),
1338
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("stop", { className: "fractal-ui-loader__stop-end", offset: "1" })
1238
1339
  ] }),
1239
- /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("linearGradient", { id: `${gradientId}-shine`, x1: "0", x2: "1", y1: "0", y2: "0", children: [
1240
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("stop", { offset: "0.4", stopColor: "white", stopOpacity: "0" }),
1241
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("stop", { offset: "0.5", stopColor: "white", stopOpacity: "0.62" }),
1242
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("stop", { offset: "0.6", stopColor: "white", stopOpacity: "0" })
1340
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("linearGradient", { id: `${gradientId}-shine`, x1: "0", x2: "1", y1: "0", y2: "0", children: [
1341
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("stop", { offset: "0.4", stopColor: "white", stopOpacity: "0" }),
1342
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("stop", { offset: "0.5", stopColor: "white", stopOpacity: "0.62" }),
1343
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("stop", { offset: "0.6", stopColor: "white", stopOpacity: "0" })
1243
1344
  ] }),
1244
- /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("clipPath", { id: clipId, children: [
1245
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: LEFT }),
1246
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: CENTER }),
1247
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: RIGHT })
1345
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("clipPath", { id: clipId, children: [
1346
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: LEFT }),
1347
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: CENTER }),
1348
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: RIGHT })
1248
1349
  ] })
1249
1350
  ] }),
1250
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: CENTER, fill: `url(#${gradientId})` }),
1251
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: RIGHT, fill: `url(#${gradientId})` }),
1252
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: LEFT, fill: `url(#${gradientId})` }),
1253
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("g", { clipPath: `url(#${clipId})`, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("g", { className: "fractal-ui-loader__shine-axis", transform: "translate(72 46) rotate(68.4)", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("rect", { className: "fractal-ui-loader__shine", x: "-160", y: "-100", width: "320", height: "200", fill: `url(#${gradientId}-shine)` }) }) })
1351
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: CENTER, fill: `url(#${gradientId})` }),
1352
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: RIGHT, fill: `url(#${gradientId})` }),
1353
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: LEFT, fill: `url(#${gradientId})` }),
1354
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("g", { clipPath: `url(#${clipId})`, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("g", { className: "fractal-ui-loader__shine-axis", transform: "translate(72 46) rotate(68.4)", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("rect", { className: "fractal-ui-loader__shine", x: "-160", y: "-100", width: "320", height: "200", fill: `url(#${gradientId}-shine)` }) }) })
1254
1355
  ] })
1255
1356
  }
1256
1357
  );
1257
1358
  }
1258
1359
 
1259
1360
  // src/components/Modal/Modal.tsx
1260
- var import_jsx_runtime15 = require("react/jsx-runtime");
1261
- var CloseIcon = () => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: "M12 4L4 12M4 4L12 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
1361
+ var import_jsx_runtime16 = require("react/jsx-runtime");
1362
+ var CloseIcon = () => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("path", { d: "M12 4L4 12M4 4L12 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
1262
1363
  function Modal({ open, onClose, title, children, danger, warn, footer, noClose, closeDisabled = false, size = "sm", loading = false, loadingLabel = "Loading", scrollable = false, className }) {
1263
- const [bodyScrolled, setBodyScrolled] = React10.useState(false);
1364
+ const [bodyScrolled, setBodyScrolled] = React11.useState(false);
1264
1365
  useEscapeDismiss(80, onClose, open && !noClose && !closeDisabled);
1265
- React10.useEffect(() => {
1366
+ React11.useEffect(() => {
1266
1367
  if (open) setBodyScrolled(false);
1267
1368
  }, [open]);
1268
1369
  if (!open) return null;
1269
1370
  const sizeClass = `fractal-modal-panel--${size}`;
1270
1371
  const accentClass = danger ? "fractal-modal-panel--danger" : warn ? "fractal-modal-panel--warn" : "";
1271
- return (0, import_react_dom.createPortal)(
1272
- /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "fractal-modal-overlay", onClick: noClose || closeDisabled ? void 0 : onClose, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
1372
+ return (0, import_react_dom2.createPortal)(
1373
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "fractal-modal-overlay", onClick: noClose || closeDisabled ? void 0 : onClose, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
1273
1374
  "div",
1274
1375
  {
1275
1376
  className: cn("fractal-modal-panel", sizeClass, accentClass, scrollable && "fractal-modal-panel--scrollable", className),
1276
1377
  onClick: (e) => e.stopPropagation(),
1277
1378
  children: [
1278
- /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
1379
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
1279
1380
  "div",
1280
1381
  {
1281
1382
  className: cn(
@@ -1284,12 +1385,12 @@ function Modal({ open, onClose, title, children, danger, warn, footer, noClose,
1284
1385
  scrollable && bodyScrolled && "fractal-modal-title-row--scrolled"
1285
1386
  ),
1286
1387
  children: [
1287
- /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("h3", { className: cn("fractal-modal-title", danger && "fractal-modal-title--danger", warn && "fractal-modal-title--warn"), children: title }),
1288
- !noClose && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("button", { type: "button", onClick: onClose, title: "Close", disabled: closeDisabled, className: "fractal-modal-close", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(CloseIcon, {}) })
1388
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("h3", { className: cn("fractal-modal-title", danger && "fractal-modal-title--danger", warn && "fractal-modal-title--warn"), children: title }),
1389
+ !noClose && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("button", { type: "button", onClick: onClose, title: "Close", disabled: closeDisabled, className: "fractal-modal-close", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CloseIcon, {}) })
1289
1390
  ]
1290
1391
  }
1291
1392
  ),
1292
- /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1393
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1293
1394
  "div",
1294
1395
  {
1295
1396
  "aria-busy": loading || void 0,
@@ -1300,10 +1401,10 @@ function Modal({ open, onClose, title, children, danger, warn, footer, noClose,
1300
1401
  scrollable && "fractal-modal-body--scrollable"
1301
1402
  ),
1302
1403
  onScroll: scrollable ? (event) => setBodyScrolled(event.currentTarget.scrollTop > 0) : void 0,
1303
- children: loading ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(UILoader, { label: loadingLabel }) : children
1404
+ children: loading ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(UILoader, { label: loadingLabel }) : children
1304
1405
  }
1305
1406
  ),
1306
- footer && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: cn("fractal-modal-footer", scrollable && "fractal-modal-footer--divided"), children: footer })
1407
+ footer && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: cn("fractal-modal-footer", scrollable && "fractal-modal-footer--divided"), children: footer })
1307
1408
  ]
1308
1409
  }
1309
1410
  ) }),
@@ -1312,17 +1413,17 @@ function Modal({ open, onClose, title, children, danger, warn, footer, noClose,
1312
1413
  }
1313
1414
 
1314
1415
  // src/components/DataTable/DataTable.tsx
1315
- var import_jsx_runtime16 = require("react/jsx-runtime");
1416
+ var import_jsx_runtime17 = require("react/jsx-runtime");
1316
1417
  function DataTable({ columns, data, emptyMessage, header, size = "md", className }) {
1317
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: cn("fractal-datatable", `fractal-datatable--${size}`, className), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "fractal-datatable-surface", children: [
1318
- header && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "fractal-datatable-header", children: header }),
1319
- data.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "fractal-datatable-empty", children: emptyMessage || "No data" }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("table", { className: "fractal-datatable-table", children: [
1320
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("tr", { className: "fractal-datatable-thead-row", children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("th", { className: "fractal-datatable-th", style: { width: col.width }, children: col.header }, col.key)) }) }),
1321
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("tbody", { children: data.map((row, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1418
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: cn("fractal-datatable", `fractal-datatable--${size}`, className), children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "fractal-datatable-surface", children: [
1419
+ header && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "fractal-datatable-header", children: header }),
1420
+ data.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "fractal-datatable-empty", children: emptyMessage || "No data" }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("table", { className: "fractal-datatable-table", children: [
1421
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("tr", { className: "fractal-datatable-thead-row", children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("th", { className: "fractal-datatable-th", style: { width: col.width }, children: col.header }, col.key)) }) }),
1422
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("tbody", { children: data.map((row, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1322
1423
  "tr",
1323
1424
  {
1324
1425
  className: "fractal-datatable-row",
1325
- children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("td", { className: "fractal-datatable-td", style: { width: col.width }, children: col.render(row, rowIndex) }, col.key))
1426
+ children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("td", { className: "fractal-datatable-td", style: { width: col.width }, children: col.render(row, rowIndex) }, col.key))
1326
1427
  },
1327
1428
  rowIndex
1328
1429
  )) })
@@ -1331,9 +1432,9 @@ function DataTable({ columns, data, emptyMessage, header, size = "md", className
1331
1432
  }
1332
1433
 
1333
1434
  // src/components/Dropdown/Dropdown.tsx
1334
- var React11 = __toESM(require("react"), 1);
1335
- var import_fractal_icons8 = require("@mirror-physics/fractal-icons");
1336
- var import_jsx_runtime17 = require("react/jsx-runtime");
1435
+ var React12 = __toESM(require("react"), 1);
1436
+ var import_fractal_icons9 = require("@mirror-physics/fractal-icons");
1437
+ var import_jsx_runtime18 = require("react/jsx-runtime");
1337
1438
  var MARGIN = 4;
1338
1439
  function Dropdown({
1339
1440
  items,
@@ -1355,10 +1456,10 @@ function Dropdown({
1355
1456
  closeOnSelect = true,
1356
1457
  disabled = false
1357
1458
  }) {
1358
- const [open, setOpen] = React11.useState(false);
1359
- const triggerRef = React11.useRef(null);
1360
- const panelRef = React11.useRef(null);
1361
- const [panelStyle, setPanelStyle] = React11.useState({});
1459
+ const [open, setOpen] = React12.useState(false);
1460
+ const triggerRef = React12.useRef(null);
1461
+ const panelRef = React12.useRef(null);
1462
+ const [panelStyle, setPanelStyle] = React12.useState({});
1362
1463
  const visibleItems = items.filter(
1363
1464
  (item) => item.icon != null || item.description != null && (typeof item.description === "string" ? item.description !== "" : true)
1364
1465
  );
@@ -1367,8 +1468,8 @@ function Dropdown({
1367
1468
  const selected = items.find((i) => i.value === selectedValue && i.kind !== "header") ?? selectableItems[0] ?? visibleItems[0];
1368
1469
  const isUp = direction === "up";
1369
1470
  const isHorizontalDirection = direction === "left" || direction === "right";
1370
- const ChevronIcon = direction === "up" ? import_fractal_icons8.ChevronUp : direction === "left" ? import_fractal_icons8.ChevronLeft : direction === "right" ? import_fractal_icons8.ChevronRight : import_fractal_icons8.ChevronDown;
1371
- React11.useLayoutEffect(() => {
1471
+ const ChevronIcon = direction === "up" ? import_fractal_icons9.ChevronUp : direction === "left" ? import_fractal_icons9.ChevronLeft : direction === "right" ? import_fractal_icons9.ChevronRight : import_fractal_icons9.ChevronDown;
1472
+ React12.useLayoutEffect(() => {
1372
1473
  if (!open || !triggerRef.current || !panelRef.current) return;
1373
1474
  const triggerRect = triggerRef.current.getBoundingClientRect();
1374
1475
  const panelRect = panelRef.current.getBoundingClientRect();
@@ -1419,7 +1520,7 @@ function Dropdown({
1419
1520
  }
1420
1521
  setPanelStyle({ top, left, right });
1421
1522
  }, [open, direction, isHorizontalDirection, isUp, align]);
1422
- React11.useEffect(() => {
1523
+ React12.useEffect(() => {
1423
1524
  if (!open) return;
1424
1525
  const handleClickOutside = (e) => {
1425
1526
  const target = e.target;
@@ -1429,8 +1530,8 @@ function Dropdown({
1429
1530
  document.addEventListener("mousedown", handleClickOutside);
1430
1531
  return () => document.removeEventListener("mousedown", handleClickOutside);
1431
1532
  }, [open]);
1432
- return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: cn("fractal-dropdown", className), children: [
1433
- /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
1533
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: cn("fractal-dropdown", className), children: [
1534
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
1434
1535
  "button",
1435
1536
  {
1436
1537
  ref: triggerRef,
@@ -1449,15 +1550,15 @@ function Dropdown({
1449
1550
  triggerClassName
1450
1551
  ),
1451
1552
  children: [
1452
- triggerContent != null ? triggerContent : /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
1453
- selected.icon != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "fractal-dropdown-icon fractal-dropdown-icon--trigger", children: selected.icon }),
1454
- selected.description != null && (typeof selected.description !== "string" || selected.description !== "") && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "fractal-dropdown-selected-text", children: selected.description })
1553
+ triggerContent != null ? triggerContent : /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
1554
+ selected.icon != null && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "fractal-dropdown-icon fractal-dropdown-icon--trigger", children: selected.icon }),
1555
+ selected.description != null && (typeof selected.description !== "string" || selected.description !== "") && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "fractal-dropdown-selected-text", children: selected.description })
1455
1556
  ] }),
1456
- !noChevron && !iconOnly && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "fractal-dropdown-chevron", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ChevronIcon, { size: size === "sm" ? 14 : 16 }) })
1557
+ !noChevron && !iconOnly && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "fractal-dropdown-chevron", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChevronIcon, { size: size === "sm" ? 14 : 16 }) })
1457
1558
  ]
1458
1559
  }
1459
1560
  ),
1460
- open && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
1561
+ open && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
1461
1562
  "div",
1462
1563
  {
1463
1564
  ref: panelRef,
@@ -1466,21 +1567,21 @@ function Dropdown({
1466
1567
  className: cn("fractal-dropdown-panel", `fractal-dropdown-panel--${size}`, panelClassName),
1467
1568
  style: panelStyle,
1468
1569
  children: [
1469
- label != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "fractal-dropdown-label", children: label }),
1570
+ label != null && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "fractal-dropdown-label", children: label }),
1470
1571
  visibleItems.map((item, index) => {
1471
- const topDivider = item.border === "top" ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "fractal-dropdown-separator" }) : null;
1472
- const bottomDivider = item.border === "bottom" ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "fractal-dropdown-separator" }) : null;
1572
+ const topDivider = item.border === "top" ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "fractal-dropdown-separator" }) : null;
1573
+ const bottomDivider = item.border === "bottom" ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "fractal-dropdown-separator" }) : null;
1473
1574
  if (item.kind === "header") {
1474
- return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(React11.Fragment, { children: [
1575
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(React12.Fragment, { children: [
1475
1576
  topDivider,
1476
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { role: "presentation", className: "fractal-dropdown-label", children: item.description }),
1577
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { role: "presentation", className: "fractal-dropdown-label", children: item.description }),
1477
1578
  bottomDivider
1478
1579
  ] }, `header-${index}`);
1479
1580
  }
1480
1581
  const isSelected = item.value === selectedValue;
1481
- return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(React11.Fragment, { children: [
1582
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(React12.Fragment, { children: [
1482
1583
  topDivider,
1483
- /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
1584
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
1484
1585
  "button",
1485
1586
  {
1486
1587
  type: "button",
@@ -1492,9 +1593,9 @@ function Dropdown({
1492
1593
  },
1493
1594
  className: "fractal-dropdown-option",
1494
1595
  children: [
1495
- item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "fractal-dropdown-icon", children: item.icon }),
1496
- item.description != null && (typeof item.description !== "string" || item.description !== "") && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "fractal-dropdown-option-text", children: item.description }),
1497
- item.trailing != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "fractal-dropdown-trailing", children: item.trailing })
1596
+ item.icon != null && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "fractal-dropdown-icon", children: item.icon }),
1597
+ item.description != null && (typeof item.description !== "string" || item.description !== "") && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "fractal-dropdown-option-text", children: item.description }),
1598
+ item.trailing != null && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "fractal-dropdown-trailing", children: item.trailing })
1498
1599
  ]
1499
1600
  }
1500
1601
  ),
@@ -1508,10 +1609,10 @@ function Dropdown({
1508
1609
  }
1509
1610
 
1510
1611
  // src/components/Link/Link.tsx
1511
- var React12 = __toESM(require("react"), 1);
1512
- var import_jsx_runtime18 = require("react/jsx-runtime");
1513
- var Link = React12.forwardRef(
1514
- ({ className, theme = "default", size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
1612
+ var React13 = __toESM(require("react"), 1);
1613
+ var import_jsx_runtime19 = require("react/jsx-runtime");
1614
+ var Link = React13.forwardRef(
1615
+ ({ className, theme = "default", size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
1515
1616
  "a",
1516
1617
  {
1517
1618
  ref,
@@ -1523,10 +1624,10 @@ var Link = React12.forwardRef(
1523
1624
  Link.displayName = "Link";
1524
1625
 
1525
1626
  // src/components/Chip/Chip.tsx
1526
- var React13 = __toESM(require("react"), 1);
1527
- var import_jsx_runtime19 = require("react/jsx-runtime");
1528
- var Chip = React13.forwardRef(
1529
- ({ className, tone = "neutral", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
1627
+ var React14 = __toESM(require("react"), 1);
1628
+ var import_jsx_runtime20 = require("react/jsx-runtime");
1629
+ var Chip = React14.forwardRef(
1630
+ ({ className, tone = "neutral", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
1530
1631
  "span",
1531
1632
  {
1532
1633
  ref,
@@ -1538,8 +1639,8 @@ var Chip = React13.forwardRef(
1538
1639
  Chip.displayName = "Chip";
1539
1640
 
1540
1641
  // src/components/Checkbox/Checkbox.tsx
1541
- var import_fractal_icons9 = require("@mirror-physics/fractal-icons");
1542
- var import_jsx_runtime20 = require("react/jsx-runtime");
1642
+ var import_fractal_icons10 = require("@mirror-physics/fractal-icons");
1643
+ var import_jsx_runtime21 = require("react/jsx-runtime");
1543
1644
  function Checkbox({
1544
1645
  checked,
1545
1646
  indeterminate = false,
@@ -1550,7 +1651,7 @@ function Checkbox({
1550
1651
  onKeyDown,
1551
1652
  ...props
1552
1653
  }) {
1553
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
1654
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
1554
1655
  "button",
1555
1656
  {
1556
1657
  ...props,
@@ -1572,18 +1673,18 @@ function Checkbox({
1572
1673
  onKeyDown?.(event);
1573
1674
  if (event.key === " " || event.key === "Enter") event.stopPropagation();
1574
1675
  },
1575
- children: indeterminate ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { className: "fractal-checkbox__indeterminate-icon", "aria-hidden": "true", children: [
1576
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_fractal_icons9.Checkbox, { size: 18 }),
1577
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_fractal_icons9.Minus, { className: "fractal-checkbox__indeterminate-mark", size: 12 })
1578
- ] }) : checked ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_fractal_icons9.CheckboxChecked, { "aria-hidden": "true", size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_fractal_icons9.Checkbox, { "aria-hidden": "true", size: 18 })
1676
+ children: indeterminate ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { className: "fractal-checkbox__indeterminate-icon", "aria-hidden": "true", children: [
1677
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_fractal_icons10.Checkbox, { size: 18 }),
1678
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_fractal_icons10.Minus, { className: "fractal-checkbox__indeterminate-mark", size: 12 })
1679
+ ] }) : checked ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_fractal_icons10.CheckboxChecked, { "aria-hidden": "true", size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_fractal_icons10.Checkbox, { "aria-hidden": "true", size: 18 })
1579
1680
  }
1580
1681
  );
1581
1682
  }
1582
1683
 
1583
1684
  // src/components/SortableTable/SortableTable.tsx
1584
1685
  var import_react4 = require("react");
1585
- var import_fractal_icons10 = require("@mirror-physics/fractal-icons");
1586
- var import_jsx_runtime21 = require("react/jsx-runtime");
1686
+ var import_fractal_icons11 = require("@mirror-physics/fractal-icons");
1687
+ var import_jsx_runtime22 = require("react/jsx-runtime");
1587
1688
  function SortableTable({
1588
1689
  columns,
1589
1690
  data,
@@ -1678,16 +1779,16 @@ function SortableTable({
1678
1779
  onSortChange?.(nextKey, nextDirection);
1679
1780
  }
1680
1781
  };
1681
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cn("fractal-sortable-table", `fractal-sortable-table--${size}`, embedded && "fractal-sortable-table--embedded", className), children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "fractal-sortable-table-surface", children: [
1682
- header && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "fractal-sortable-table-header", children: header }),
1683
- visibleRows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "fractal-sortable-table-empty", children: emptyMessage || "No data" }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("table", { "aria-label": ariaLabel, className: "fractal-sortable-table-table", children: [
1684
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("tr", { className: "fractal-sortable-table-thead-row", children: [
1685
- selection && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
1782
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: cn("fractal-sortable-table", `fractal-sortable-table--${size}`, embedded && "fractal-sortable-table--embedded", className), children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "fractal-sortable-table-surface", children: [
1783
+ header && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "fractal-sortable-table-header", children: header }),
1784
+ visibleRows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "fractal-sortable-table-empty", children: emptyMessage || "No data" }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("table", { "aria-label": ariaLabel, className: "fractal-sortable-table-table", children: [
1785
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "fractal-sortable-table-thead-row", children: [
1786
+ selection && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
1686
1787
  "th",
1687
1788
  {
1688
1789
  className: "fractal-sortable-table-th fractal-sortable-table-selection-cell",
1689
1790
  scope: "col",
1690
- children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
1791
+ children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
1691
1792
  Checkbox,
1692
1793
  {
1693
1794
  "aria-label": selection.selectAllLabel ?? "Select all rows",
@@ -1713,7 +1814,7 @@ function SortableTable({
1713
1814
  columns.map((col) => {
1714
1815
  const isActive = activeKey === col.key && activeDirection !== null;
1715
1816
  if (!col.sortable) {
1716
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
1817
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
1717
1818
  "th",
1718
1819
  {
1719
1820
  className: "fractal-sortable-table-th",
@@ -1724,13 +1825,13 @@ function SortableTable({
1724
1825
  col.key
1725
1826
  );
1726
1827
  }
1727
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
1828
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
1728
1829
  "th",
1729
1830
  {
1730
1831
  className: "fractal-sortable-table-th fractal-sortable-table-th--sortable",
1731
1832
  scope: "col",
1732
1833
  style: { width: col.width },
1733
- children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
1834
+ children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
1734
1835
  "button",
1735
1836
  {
1736
1837
  type: "button",
@@ -1741,8 +1842,8 @@ function SortableTable({
1741
1842
  onClick: () => handleSortClick(col.key),
1742
1843
  "aria-sort": isActive ? activeDirection === "asc" ? "ascending" : "descending" : "none",
1743
1844
  children: [
1744
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: col.header }),
1745
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "fractal-sortable-table-sort-icon", "aria-hidden": "true", children: isActive && activeDirection === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_fractal_icons10.ArrowUp, { size: 14 }) : isActive && activeDirection === "desc" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_fractal_icons10.ArrowDown, { size: 14 }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_fractal_icons10.ArrowsUpDown, { size: 14 }) })
1845
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: col.header }),
1846
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "fractal-sortable-table-sort-icon", "aria-hidden": "true", children: isActive && activeDirection === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_fractal_icons11.ArrowUp, { size: 14 }) : isActive && activeDirection === "desc" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_fractal_icons11.ArrowDown, { size: 14 }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_fractal_icons11.ArrowsUpDown, { size: 14 }) })
1746
1847
  ]
1747
1848
  }
1748
1849
  )
@@ -1751,7 +1852,7 @@ function SortableTable({
1751
1852
  );
1752
1853
  })
1753
1854
  ] }) }),
1754
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("tbody", { children: visibleRows.map((row, rowIndex) => {
1855
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("tbody", { children: visibleRows.map((row, rowIndex) => {
1755
1856
  const highlighted = highlightRow?.(row, rowIndex) ?? false;
1756
1857
  const disabled = isRowDisabled?.(row) ?? false;
1757
1858
  const selectionDisabled = disabled || (isRowSelectionDisabled?.(row) ?? false);
@@ -1760,7 +1861,7 @@ function SortableTable({
1760
1861
  label: rowAction.label(row, rowIndex),
1761
1862
  icon: rowAction.icon(row, rowIndex)
1762
1863
  } : null;
1763
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
1864
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
1764
1865
  "tr",
1765
1866
  {
1766
1867
  className: cn(
@@ -1784,7 +1885,7 @@ function SortableTable({
1784
1885
  role: interactive ? "button" : void 0,
1785
1886
  tabIndex: interactive ? 0 : void 0,
1786
1887
  children: [
1787
- selection && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("td", { className: "fractal-sortable-table-td fractal-sortable-table-selection-cell", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
1888
+ selection && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("td", { className: "fractal-sortable-table-td fractal-sortable-table-selection-cell", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
1788
1889
  Checkbox,
1789
1890
  {
1790
1891
  "aria-label": selection.getRowLabel(row),
@@ -1796,7 +1897,7 @@ function SortableTable({
1796
1897
  }
1797
1898
  }
1798
1899
  ) }),
1799
- columns.map((col, columnIndex) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
1900
+ columns.map((col, columnIndex) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
1800
1901
  "td",
1801
1902
  {
1802
1903
  className: cn(
@@ -1806,7 +1907,7 @@ function SortableTable({
1806
1907
  style: { width: col.width, textAlign: col.align ?? "left" },
1807
1908
  children: [
1808
1909
  col.render(row, rowIndex),
1809
- action && columnIndex === columns.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "fractal-sortable-table-row-action", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "fractal-sortable-table-row-action__icon", children: action.icon }) })
1910
+ action && columnIndex === columns.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "fractal-sortable-table-row-action", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "fractal-sortable-table-row-action__icon", children: action.icon }) })
1810
1911
  ]
1811
1912
  },
1812
1913
  col.key
@@ -1822,7 +1923,7 @@ function SortableTable({
1822
1923
 
1823
1924
  // src/components/Tabs/Tabs.tsx
1824
1925
  var import_react5 = require("react");
1825
- var import_jsx_runtime22 = require("react/jsx-runtime");
1926
+ var import_jsx_runtime23 = require("react/jsx-runtime");
1826
1927
  function Tabs({
1827
1928
  items,
1828
1929
  defaultValue,
@@ -1893,8 +1994,8 @@ function Tabs({
1893
1994
  selectTab(nextId2);
1894
1995
  requestAnimationFrame(() => tabRefs.current[nextId2]?.focus());
1895
1996
  };
1896
- return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: cn("fractal-tabs", `fractal-tabs--${variant}`, divider && "fractal-tabs--divider", className), children: [
1897
- /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
1997
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: cn("fractal-tabs", `fractal-tabs--${variant}`, divider && "fractal-tabs--divider", className), children: [
1998
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1898
1999
  "div",
1899
2000
  {
1900
2001
  ref: tabListRef,
@@ -1907,7 +2008,7 @@ function Tabs({
1907
2008
  const isActive = item.id === activeId;
1908
2009
  const tabId = `${reactId}-tab-${item.id}`;
1909
2010
  const panelId = `${reactId}-panel-${item.id}`;
1910
- return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
2011
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1911
2012
  "button",
1912
2013
  {
1913
2014
  ref: (el) => {
@@ -1938,7 +2039,7 @@ function Tabs({
1938
2039
  const tabId = `${reactId}-tab-${item.id}`;
1939
2040
  const panelId = `${reactId}-panel-${item.id}`;
1940
2041
  const isActive = item.id === activeId;
1941
- return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
2042
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1942
2043
  "div",
1943
2044
  {
1944
2045
  id: panelId,
@@ -1955,14 +2056,14 @@ function Tabs({
1955
2056
  }
1956
2057
 
1957
2058
  // src/components/ContentSwitcher/ContentSwitcher.tsx
1958
- var React14 = __toESM(require("react"), 1);
1959
- var import_jsx_runtime23 = require("react/jsx-runtime");
2059
+ var React15 = __toESM(require("react"), 1);
2060
+ var import_jsx_runtime24 = require("react/jsx-runtime");
1960
2061
  function ContentSwitcher({ items, value, onValueChange, ariaLabel, fullWidth = false, className }) {
1961
- const switcherRef = React14.useRef(null);
1962
- const buttonRefs = React14.useRef([]);
1963
- const indicatorMotionReadyRef = React14.useRef(false);
2062
+ const switcherRef = React15.useRef(null);
2063
+ const buttonRefs = React15.useRef([]);
2064
+ const indicatorMotionReadyRef = React15.useRef(false);
1964
2065
  const activeIndex = items.findIndex((item) => item.value === value);
1965
- React14.useLayoutEffect(() => {
2066
+ React15.useLayoutEffect(() => {
1966
2067
  const switcher = switcherRef.current;
1967
2068
  const activeButton = buttonRefs.current[activeIndex];
1968
2069
  let motionFrame = 0;
@@ -2014,7 +2115,7 @@ function ContentSwitcher({ items, value, onValueChange, ariaLabel, fullWidth = f
2014
2115
  onValueChange(items[nextIndex].value);
2015
2116
  }
2016
2117
  };
2017
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
2118
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
2018
2119
  "div",
2019
2120
  {
2020
2121
  className: cn("fractal-content-switcher", fullWidth && "fractal-content-switcher--full-width", className),
@@ -2022,10 +2123,10 @@ function ContentSwitcher({ items, value, onValueChange, ariaLabel, fullWidth = f
2022
2123
  "aria-label": ariaLabel,
2023
2124
  ref: switcherRef,
2024
2125
  children: [
2025
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "fractal-content-switcher__indicator", "aria-hidden": true }),
2126
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "fractal-content-switcher__indicator", "aria-hidden": true }),
2026
2127
  items.map((item, index) => {
2027
2128
  const active = item.value === value;
2028
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
2129
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
2029
2130
  "button",
2030
2131
  {
2031
2132
  className: cn("fractal-content-switcher__item", active && "fractal-content-switcher__item--active"),
@@ -2058,8 +2159,8 @@ function ContentSwitcher({ items, value, onValueChange, ariaLabel, fullWidth = f
2058
2159
 
2059
2160
  // src/components/Disclosure/Disclosure.tsx
2060
2161
  var import_react6 = require("react");
2061
- var import_fractal_icons11 = require("@mirror-physics/fractal-icons");
2062
- var import_jsx_runtime24 = require("react/jsx-runtime");
2162
+ var import_fractal_icons12 = require("@mirror-physics/fractal-icons");
2163
+ var import_jsx_runtime25 = require("react/jsx-runtime");
2063
2164
  function Disclosure({
2064
2165
  title,
2065
2166
  meta,
@@ -2087,7 +2188,7 @@ function Disclosure({
2087
2188
  onOpenChange?.(next);
2088
2189
  }
2089
2190
  };
2090
- return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
2191
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
2091
2192
  "div",
2092
2193
  {
2093
2194
  className: cn(
@@ -2098,7 +2199,7 @@ function Disclosure({
2098
2199
  className
2099
2200
  ),
2100
2201
  children: [
2101
- /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
2202
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
2102
2203
  "button",
2103
2204
  {
2104
2205
  type: "button",
@@ -2109,13 +2210,13 @@ function Disclosure({
2109
2210
  disabled,
2110
2211
  onClick: toggle,
2111
2212
  children: [
2112
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "fractal-disclosure-icon", "aria-hidden": "true", children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_fractal_icons11.ChevronDown, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_fractal_icons11.ChevronRight, { size: 16 }) }),
2113
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "fractal-disclosure-title", children: title }),
2114
- meta && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "fractal-disclosure-meta", children: meta })
2213
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "fractal-disclosure-icon", "aria-hidden": "true", children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_fractal_icons12.ChevronDown, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_fractal_icons12.ChevronRight, { size: 16 }) }),
2214
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "fractal-disclosure-title", children: title }),
2215
+ meta && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "fractal-disclosure-meta", children: meta })
2115
2216
  ]
2116
2217
  }
2117
2218
  ),
2118
- /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
2219
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
2119
2220
  "div",
2120
2221
  {
2121
2222
  id: panelId,
@@ -2123,7 +2224,7 @@ function Disclosure({
2123
2224
  "aria-labelledby": headerId,
2124
2225
  className: "fractal-disclosure-panel",
2125
2226
  hidden: !isOpen,
2126
- children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "fractal-disclosure-panel-inner", children })
2227
+ children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "fractal-disclosure-panel-inner", children })
2127
2228
  }
2128
2229
  )
2129
2230
  ]
@@ -2132,18 +2233,18 @@ function Disclosure({
2132
2233
  }
2133
2234
 
2134
2235
  // src/components/LatticeLoader/LatticeLoader.tsx
2135
- var import_jsx_runtime25 = require("react/jsx-runtime");
2236
+ var import_jsx_runtime26 = require("react/jsx-runtime");
2136
2237
  var LATTICE_COUNT = 160;
2137
2238
  var WAVE_PERIOD = 80;
2138
2239
  function LatticeLoader({ className, label = "Loading", ...props }) {
2139
- return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
2240
+ return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
2140
2241
  "span",
2141
2242
  {
2142
2243
  "aria-label": label,
2143
2244
  className: cn("fractal-lattice-loader", className),
2144
2245
  role: "progressbar",
2145
2246
  ...props,
2146
- children: Array.from({ length: LATTICE_COUNT }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
2247
+ children: Array.from({ length: LATTICE_COUNT }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
2147
2248
  "span",
2148
2249
  {
2149
2250
  "aria-hidden": "true",
@@ -2157,10 +2258,10 @@ function LatticeLoader({ className, label = "Loading", ...props }) {
2157
2258
  }
2158
2259
 
2159
2260
  // src/components/Ghost/Ghost.tsx
2160
- var import_jsx_runtime26 = require("react/jsx-runtime");
2261
+ var import_jsx_runtime27 = require("react/jsx-runtime");
2161
2262
  var toCssLength = (value) => typeof value === "number" ? `${value}px` : value;
2162
2263
  function Ghost({ className, width, height, radius, style, ...props }) {
2163
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
2264
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
2164
2265
  "div",
2165
2266
  {
2166
2267
  "aria-hidden": "true",
@@ -2176,15 +2277,15 @@ function Ghost({ className, width, height, radius, style, ...props }) {
2176
2277
  );
2177
2278
  }
2178
2279
  function GhostLine({ className, size = "md", width = "100%", ...props }) {
2179
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: cn("fractal-ghost-line", `fractal-ghost-line--${size}`, className), width, ...props });
2280
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: cn("fractal-ghost-line", `fractal-ghost-line--${size}`, className), width, ...props });
2180
2281
  }
2181
2282
  function ButtonGhost({ className, size = "md", iconOnly = false, width, ...props }) {
2182
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: cn("fractal-ghost-button", `fractal-ghost-button--${size}`, iconOnly && "fractal-ghost-button--icon-only", className), width, ...props });
2283
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: cn("fractal-ghost-button", `fractal-ghost-button--${size}`, iconOnly && "fractal-ghost-button--icon-only", className), width, ...props });
2183
2284
  }
2184
2285
  function CardGhost({ className, lines = 3, showHeader = true, ...props }) {
2185
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-card", className), ...props, children: [
2186
- showHeader && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "38%" }),
2187
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "fractal-ghost-stack", children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: index === lines - 1 ? "62%" : "100%" }, index)) })
2286
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-card", className), ...props, children: [
2287
+ showHeader && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "38%" }),
2288
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "fractal-ghost-stack", children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: index === lines - 1 ? "62%" : "100%" }, index)) })
2188
2289
  ] });
2189
2290
  }
2190
2291
  function DataTableGhost({
@@ -2198,81 +2299,81 @@ function DataTableGhost({
2198
2299
  ...props
2199
2300
  }) {
2200
2301
  const cells = Array.from({ length: columns }, (_, index) => index);
2201
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "aria-busy": "true", "aria-label": "Loading table", className: cn("fractal-ghost-table", `fractal-ghost-table--${size}`, className), role: "status", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("table", { className: "fractal-ghost-table__table", children: [
2202
- (showHeader || headers) && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("tr", { className: "fractal-ghost-table__head-row", children: cells.map((index) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("th", { style: { width: columnWidths?.[index] }, children: headers?.[index] ?? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { size: "sm", width: index === columns - 1 ? "62%" : "76%" }) }, index)) }) }),
2203
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("tbody", { children: Array.from({ length: rows }, (_, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("tr", { className: "fractal-ghost-table__row", children: cells.map((columnIndex) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("td", { style: { width: columnWidths?.[columnIndex] }, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: `${[72, 54, 82, 63, 46][(rowIndex + columnIndex) % 5]}%` }) }, columnIndex)) }, rowIndex)) })
2302
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { "aria-busy": "true", "aria-label": "Loading table", className: cn("fractal-ghost-table", `fractal-ghost-table--${size}`, className), role: "status", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("table", { className: "fractal-ghost-table__table", children: [
2303
+ (showHeader || headers) && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("tr", { className: "fractal-ghost-table__head-row", children: cells.map((index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("th", { style: { width: columnWidths?.[index] }, children: headers?.[index] ?? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { size: "sm", width: index === columns - 1 ? "62%" : "76%" }) }, index)) }) }),
2304
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("tbody", { children: Array.from({ length: rows }, (_, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("tr", { className: "fractal-ghost-table__row", children: cells.map((columnIndex) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("td", { style: { width: columnWidths?.[columnIndex] }, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: `${[72, 54, 82, 63, 46][(rowIndex + columnIndex) % 5]}%` }) }, columnIndex)) }, rowIndex)) })
2204
2305
  ] }) });
2205
2306
  }
2206
2307
  function InputGhost({ className, labelWidth = "26%", ...props }) {
2207
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(FormFieldGhost, { className, labelWidth, ...props });
2308
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(FormFieldGhost, { className, labelWidth, ...props });
2208
2309
  }
2209
2310
  function TextareaGhost({ className, labelWidth = "26%", ...props }) {
2210
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(FormFieldGhost, { className, labelWidth, multiline: true, ...props });
2311
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(FormFieldGhost, { className, labelWidth, multiline: true, ...props });
2211
2312
  }
2212
2313
  function LabelGhost({ className, width = "26%", ...props }) {
2213
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { className: cn("fractal-ghost-label", className), size: "sm", width, ...props });
2314
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { className: cn("fractal-ghost-label", className), size: "sm", width, ...props });
2214
2315
  }
2215
2316
  function FormFieldGhost({ className, labelWidth = "26%", multiline = false, ...props }) {
2216
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-field", className), ...props, children: [
2217
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(LabelGhost, { width: labelWidth }),
2218
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: cn("fractal-ghost-field__control", multiline && "fractal-ghost-field__control--multiline") })
2317
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-field", className), ...props, children: [
2318
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(LabelGhost, { width: labelWidth }),
2319
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: cn("fractal-ghost-field__control", multiline && "fractal-ghost-field__control--multiline") })
2219
2320
  ] });
2220
2321
  }
2221
2322
  function AlertGhost({ className, ...props }) {
2222
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-alert", className), ...props, children: [
2223
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "30%" }),
2224
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { size: "sm", width: "78%" })
2323
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-alert", className), ...props, children: [
2324
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "30%" }),
2325
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { size: "sm", width: "78%" })
2225
2326
  ] });
2226
2327
  }
2227
2328
  function CheckboxGhost({ className, ...props }) {
2228
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-choice", className), ...props, children: [
2229
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: "fractal-ghost-choice__control" }),
2230
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "42%" })
2329
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-choice", className), ...props, children: [
2330
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: "fractal-ghost-choice__control" }),
2331
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "42%" })
2231
2332
  ] });
2232
2333
  }
2233
2334
  var ToggleGhost = CheckboxGhost;
2234
2335
  function ChipGhost({ className, width = 74, ...props }) {
2235
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: cn("fractal-ghost-chip", className), height: 24, width, ...props });
2336
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: cn("fractal-ghost-chip", className), height: 24, width, ...props });
2236
2337
  }
2237
2338
  function LinkGhost({ className, width = 96, ...props }) {
2238
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { className: cn("fractal-ghost-link", className), size: "sm", width, ...props });
2339
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { className: cn("fractal-ghost-link", className), size: "sm", width, ...props });
2239
2340
  }
2240
2341
  var TextButtonGhost = LinkGhost;
2241
2342
  function DropdownGhost({ className, ...props }) {
2242
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-dropdown", className), ...props, children: [
2243
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "38%" }),
2244
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: "fractal-ghost-dropdown__chevron" })
2343
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-dropdown", className), ...props, children: [
2344
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "38%" }),
2345
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: "fractal-ghost-dropdown__chevron" })
2245
2346
  ] });
2246
2347
  }
2247
2348
  function ContentSwitcherGhost({ className, options = 3, ...props }) {
2248
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "aria-hidden": "true", className: cn("fractal-ghost-switcher", className), ...props, children: Array.from({ length: options }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, {}, index)) });
2349
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { "aria-hidden": "true", className: cn("fractal-ghost-switcher", className), ...props, children: Array.from({ length: options }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, {}, index)) });
2249
2350
  }
2250
2351
  var TabsGhost = ContentSwitcherGhost;
2251
2352
  function DisclosureGhost({ className, ...props }) {
2252
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-disclosure", className), ...props, children: [
2253
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: "fractal-ghost-disclosure__icon" }),
2254
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "42%" })
2353
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-disclosure", className), ...props, children: [
2354
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: "fractal-ghost-disclosure__icon" }),
2355
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "42%" })
2255
2356
  ] });
2256
2357
  }
2257
2358
  function PaginationGhost({ className, pages = 5, ...props }) {
2258
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "aria-hidden": "true", className: cn("fractal-ghost-pagination", className), ...props, children: Array.from({ length: pages }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, {}, index)) });
2359
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { "aria-hidden": "true", className: cn("fractal-ghost-pagination", className), ...props, children: Array.from({ length: pages }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, {}, index)) });
2259
2360
  }
2260
2361
  function FileDropzoneGhost({ className, ...props }) {
2261
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-dropzone", className), ...props, children: [
2262
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: "fractal-ghost-dropzone__icon" }),
2263
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "26%" }),
2264
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { size: "sm", width: "46%" })
2362
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-dropzone", className), ...props, children: [
2363
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: "fractal-ghost-dropzone__icon" }),
2364
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "26%" }),
2365
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { size: "sm", width: "46%" })
2265
2366
  ] });
2266
2367
  }
2267
2368
  function PromptCardGhost({ className, ...props }) {
2268
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(CardGhost, { className: cn("fractal-ghost-prompt-card", className), lines: 4, ...props });
2369
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CardGhost, { className: cn("fractal-ghost-prompt-card", className), lines: 4, ...props });
2269
2370
  }
2270
2371
  function ConversationGhost({
2271
2372
  className,
2272
2373
  "aria-label": ariaLabel = "Loading conversation",
2273
2374
  ...props
2274
2375
  }) {
2275
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
2376
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
2276
2377
  "div",
2277
2378
  {
2278
2379
  "aria-busy": "true",
@@ -2281,54 +2382,54 @@ function ConversationGhost({
2281
2382
  role: "status",
2282
2383
  ...props,
2283
2384
  children: [
2284
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "aria-hidden": "true", className: "fractal-ghost-conversation__message fractal-ghost-conversation__message--user", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "fractal-ghost-conversation__bubble", children: [
2285
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "100%" }),
2286
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "86%" }),
2287
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "64%" })
2385
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { "aria-hidden": "true", className: "fractal-ghost-conversation__message fractal-ghost-conversation__message--user", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "fractal-ghost-conversation__bubble", children: [
2386
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "100%" }),
2387
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "86%" }),
2388
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "64%" })
2288
2389
  ] }) }),
2289
- /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: "fractal-ghost-conversation__message fractal-ghost-conversation__message--assistant", children: [
2290
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "92%" }),
2291
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "78%" }),
2292
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "58%" })
2390
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: "fractal-ghost-conversation__message fractal-ghost-conversation__message--assistant", children: [
2391
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "92%" }),
2392
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "78%" }),
2393
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "58%" })
2293
2394
  ] })
2294
2395
  ]
2295
2396
  }
2296
2397
  );
2297
2398
  }
2298
2399
  function SortableTableGhost(props) {
2299
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DataTableGhost, { ...props });
2400
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DataTableGhost, { ...props });
2300
2401
  }
2301
2402
  function SidebarGhost({ className, items = 6, ...props }) {
2302
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("aside", { "aria-hidden": "true", className: cn("fractal-ghost-sidebar", className), ...props, children: [
2303
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: "fractal-ghost-sidebar__brand" }),
2304
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "fractal-ghost-sidebar__items", children: Array.from({ length: items }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "fractal-ghost-sidebar__item", children: [
2305
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, {}),
2306
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: `${[54, 68, 44, 61][index % 4]}%` })
2403
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("aside", { "aria-hidden": "true", className: cn("fractal-ghost-sidebar", className), ...props, children: [
2404
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: "fractal-ghost-sidebar__brand" }),
2405
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "fractal-ghost-sidebar__items", children: Array.from({ length: items }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "fractal-ghost-sidebar__item", children: [
2406
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, {}),
2407
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: `${[54, 68, 44, 61][index % 4]}%` })
2307
2408
  ] }, index)) })
2308
2409
  ] });
2309
2410
  }
2310
2411
  function ModalGhost({ className, title, lines = 3, ...props }) {
2311
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SurfaceGhost, { className: cn("fractal-ghost-modal", className), title, lines, ...props });
2412
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SurfaceGhost, { className: cn("fractal-ghost-modal", className), title, lines, ...props });
2312
2413
  }
2313
2414
  function SidePanelGhost({ className, title, lines = 5, ...props }) {
2314
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SurfaceGhost, { className: cn("fractal-ghost-side-panel", className), title, lines, ...props });
2415
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SurfaceGhost, { className: cn("fractal-ghost-side-panel", className), title, lines, ...props });
2315
2416
  }
2316
2417
  function SurfaceGhost({ className, title, lines = 3, ...props }) {
2317
- return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-surface", className), ...props, children: [
2318
- /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "fractal-ghost-surface__header", children: [
2319
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: "42%" }),
2320
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Ghost, { className: "fractal-ghost-surface__close" })
2418
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { "aria-hidden": "true", className: cn("fractal-ghost-surface", className), ...props, children: [
2419
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "fractal-ghost-surface__header", children: [
2420
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: "42%" }),
2421
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Ghost, { className: "fractal-ghost-surface__close" })
2321
2422
  ] }),
2322
- title && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "fractal-ghost-surface__title", children: title }),
2323
- /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "fractal-ghost-stack", children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(GhostLine, { width: index === lines - 1 ? "64%" : "100%" }, index)) })
2423
+ title && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "fractal-ghost-surface__title", children: title }),
2424
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "fractal-ghost-stack", children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(GhostLine, { width: index === lines - 1 ? "64%" : "100%" }, index)) })
2324
2425
  ] });
2325
2426
  }
2326
2427
 
2327
2428
  // src/components/Sidebar/Sidebar.tsx
2328
- var React15 = __toESM(require("react"), 1);
2329
- var import_jsx_runtime27 = require("react/jsx-runtime");
2330
- var Sidebar = React15.forwardRef(
2331
- ({ className, width, compact = false, style, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
2429
+ var React16 = __toESM(require("react"), 1);
2430
+ var import_jsx_runtime28 = require("react/jsx-runtime");
2431
+ var Sidebar = React16.forwardRef(
2432
+ ({ className, width, compact = false, style, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
2332
2433
  "aside",
2333
2434
  {
2334
2435
  ref,
@@ -2340,12 +2441,12 @@ var Sidebar = React15.forwardRef(
2340
2441
  )
2341
2442
  );
2342
2443
  Sidebar.displayName = "Sidebar";
2343
- var SidebarHeader = React15.forwardRef(
2344
- ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { ref, className: cn("fractal-sidebar__header", className), ...props })
2444
+ var SidebarHeader = React16.forwardRef(
2445
+ ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { ref, className: cn("fractal-sidebar__header", className), ...props })
2345
2446
  );
2346
2447
  SidebarHeader.displayName = "SidebarHeader";
2347
- var SidebarBrand = React15.forwardRef(
2348
- ({ className, type = "button", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("button", { ref, type, className: cn("fractal-sidebar__brand", className), ...props })
2448
+ var SidebarBrand = React16.forwardRef(
2449
+ ({ className, type = "button", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("button", { ref, type, className: cn("fractal-sidebar__brand", className), ...props })
2349
2450
  );
2350
2451
  SidebarBrand.displayName = "SidebarBrand";
2351
2452
  function SidebarAccountMenu({
@@ -2356,7 +2457,7 @@ function SidebarAccountMenu({
2356
2457
  icon,
2357
2458
  className
2358
2459
  }) {
2359
- return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
2460
+ return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
2360
2461
  Dropdown,
2361
2462
  {
2362
2463
  align: "left",
@@ -2366,25 +2467,25 @@ function SidebarAccountMenu({
2366
2467
  panelClassName: "fractal-sidebar__account-panel",
2367
2468
  selectedValue: "",
2368
2469
  triggerClassName: "fractal-sidebar__account-trigger",
2369
- triggerContent: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
2370
- icon && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "fractal-sidebar__account-icon", "aria-hidden": "true", children: icon }),
2371
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "fractal-sidebar__account-name", children: name })
2470
+ triggerContent: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
2471
+ icon && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "fractal-sidebar__account-icon", "aria-hidden": "true", children: icon }),
2472
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "fractal-sidebar__account-name", children: name })
2372
2473
  ] }),
2373
2474
  triggerLabel,
2374
2475
  triggerVariant: "tertiary"
2375
2476
  }
2376
2477
  );
2377
2478
  }
2378
- var SidebarNav = React15.forwardRef(
2379
- ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("nav", { ref, className: cn("fractal-sidebar__nav", className), ...props })
2479
+ var SidebarNav = React16.forwardRef(
2480
+ ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("nav", { ref, className: cn("fractal-sidebar__nav", className), ...props })
2380
2481
  );
2381
2482
  SidebarNav.displayName = "SidebarNav";
2382
- var SidebarSection = React15.forwardRef(
2383
- ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { ref, className: cn("fractal-sidebar__section", className), ...props })
2483
+ var SidebarSection = React16.forwardRef(
2484
+ ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { ref, className: cn("fractal-sidebar__section", className), ...props })
2384
2485
  );
2385
2486
  SidebarSection.displayName = "SidebarSection";
2386
- var SidebarNavItem = React15.forwardRef(
2387
- ({ active = false, icon, endAdornment, className, type = "button", children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
2487
+ var SidebarNavItem = React16.forwardRef(
2488
+ ({ active = false, icon, endAdornment, className, type = "button", children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
2388
2489
  "button",
2389
2490
  {
2390
2491
  ref,
@@ -2394,28 +2495,28 @@ var SidebarNavItem = React15.forwardRef(
2394
2495
  "aria-current": active ? "page" : void 0,
2395
2496
  ...props,
2396
2497
  children: [
2397
- icon && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "fractal-sidebar__nav-item-icon", "aria-hidden": "true", children: icon }),
2398
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "fractal-sidebar__nav-item-label", children }),
2399
- endAdornment && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "fractal-sidebar__nav-item-end", children: endAdornment })
2498
+ icon && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "fractal-sidebar__nav-item-icon", "aria-hidden": "true", children: icon }),
2499
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "fractal-sidebar__nav-item-label", children }),
2500
+ endAdornment && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "fractal-sidebar__nav-item-end", children: endAdornment })
2400
2501
  ]
2401
2502
  }
2402
2503
  )
2403
2504
  );
2404
2505
  SidebarNavItem.displayName = "SidebarNavItem";
2405
- var SidebarFooter = React15.forwardRef(
2406
- ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { ref, className: cn("fractal-sidebar__footer", className), ...props })
2506
+ var SidebarFooter = React16.forwardRef(
2507
+ ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { ref, className: cn("fractal-sidebar__footer", className), ...props })
2407
2508
  );
2408
2509
  SidebarFooter.displayName = "SidebarFooter";
2409
2510
 
2410
2511
  // src/components/SidePanel/SidePanel.tsx
2411
- var import_react_dom2 = require("react-dom");
2412
- var import_fractal_icons12 = require("@mirror-physics/fractal-icons");
2413
- var import_jsx_runtime28 = require("react/jsx-runtime");
2512
+ var import_react_dom3 = require("react-dom");
2513
+ var import_fractal_icons13 = require("@mirror-physics/fractal-icons");
2514
+ var import_jsx_runtime29 = require("react/jsx-runtime");
2414
2515
  function SidePanel({ open, onClose, title, description, children, footer, size = "md", loading = false, loadingLabel = "Loading", className }) {
2415
2516
  useEscapeDismiss(80, onClose, open);
2416
2517
  if (!open) return null;
2417
- return (0, import_react_dom2.createPortal)(
2418
- /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "fractal-side-panel-overlay", onMouseDown: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
2518
+ return (0, import_react_dom3.createPortal)(
2519
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "fractal-side-panel-overlay", onMouseDown: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
2419
2520
  "aside",
2420
2521
  {
2421
2522
  className: cn("fractal-side-panel", `fractal-side-panel--${size}`, className),
@@ -2424,15 +2525,15 @@ function SidePanel({ open, onClose, title, description, children, footer, size =
2424
2525
  role: "dialog",
2425
2526
  onMouseDown: (event) => event.stopPropagation(),
2426
2527
  children: [
2427
- /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("header", { className: "fractal-side-panel__header", children: [
2428
- /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "fractal-side-panel__heading", children: [
2429
- typeof title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h2", { className: "fractal-side-panel__title", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "fractal-side-panel__title", children: title }),
2430
- description && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("p", { className: "fractal-side-panel__description", children: description })
2528
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("header", { className: "fractal-side-panel__header", children: [
2529
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "fractal-side-panel__heading", children: [
2530
+ typeof title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h2", { className: "fractal-side-panel__title", children: title }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "fractal-side-panel__title", children: title }),
2531
+ description && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "fractal-side-panel__description", children: description })
2431
2532
  ] }),
2432
- /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("button", { type: "button", className: "fractal-side-panel__close", "aria-label": "Close panel", onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_fractal_icons12.Close, { size: 18 }) })
2533
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("button", { type: "button", className: "fractal-side-panel__close", "aria-label": "Close panel", onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_fractal_icons13.Close, { size: 18 }) })
2433
2534
  ] }),
2434
- /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { "aria-busy": loading || void 0, className: cn("fractal-side-panel__body", loading && "fractal-side-panel__body--loading"), children: loading ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(UILoader, { label: loadingLabel }) : children }),
2435
- footer && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("footer", { className: "fractal-side-panel__footer", children: footer })
2535
+ /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { "aria-busy": loading || void 0, className: cn("fractal-side-panel__body", loading && "fractal-side-panel__body--loading"), children: loading ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(UILoader, { label: loadingLabel }) : children }),
2536
+ footer && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("footer", { className: "fractal-side-panel__footer", children: footer })
2436
2537
  ]
2437
2538
  }
2438
2539
  ) }),
@@ -2441,18 +2542,18 @@ function SidePanel({ open, onClose, title, description, children, footer, size =
2441
2542
  }
2442
2543
 
2443
2544
  // src/components/Textarea/Textarea.tsx
2444
- var React16 = __toESM(require("react"), 1);
2445
- var import_jsx_runtime29 = require("react/jsx-runtime");
2446
- var Textarea = React16.forwardRef(
2447
- ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("textarea", { ref, className: cn("fractal-textarea", className), ...props })
2545
+ var React17 = __toESM(require("react"), 1);
2546
+ var import_jsx_runtime30 = require("react/jsx-runtime");
2547
+ var Textarea = React17.forwardRef(
2548
+ ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("textarea", { ref, className: cn("fractal-textarea", className), ...props })
2448
2549
  );
2449
2550
  Textarea.displayName = "Textarea";
2450
2551
 
2451
2552
  // src/components/TextButton/TextButton.tsx
2452
- var React17 = __toESM(require("react"), 1);
2453
- var import_jsx_runtime30 = require("react/jsx-runtime");
2454
- var TextButton = React17.forwardRef(
2455
- ({ className, icon, iconPosition = "start", size = "md", tone = "primary", children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
2553
+ var React18 = __toESM(require("react"), 1);
2554
+ var import_jsx_runtime31 = require("react/jsx-runtime");
2555
+ var TextButton = React18.forwardRef(
2556
+ ({ className, icon, iconPosition = "start", size = "md", tone = "primary", children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
2456
2557
  "button",
2457
2558
  {
2458
2559
  ref,
@@ -2460,9 +2561,9 @@ var TextButton = React17.forwardRef(
2460
2561
  type: "button",
2461
2562
  ...props,
2462
2563
  children: [
2463
- icon && iconPosition === "start" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "fractal-text-button__icon", "aria-hidden": "true", children: icon }),
2464
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { children }),
2465
- icon && iconPosition === "end" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "fractal-text-button__icon", "aria-hidden": "true", children: icon })
2564
+ icon && iconPosition === "start" && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "fractal-text-button__icon", "aria-hidden": "true", children: icon }),
2565
+ /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { children }),
2566
+ icon && iconPosition === "end" && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "fractal-text-button__icon", "aria-hidden": "true", children: icon })
2466
2567
  ]
2467
2568
  }
2468
2569
  )
@@ -2470,9 +2571,9 @@ var TextButton = React17.forwardRef(
2470
2571
  TextButton.displayName = "TextButton";
2471
2572
 
2472
2573
  // src/components/FileDropzone/FileDropzone.tsx
2473
- var React18 = __toESM(require("react"), 1);
2474
- var import_fractal_icons13 = require("@mirror-physics/fractal-icons");
2475
- var import_jsx_runtime31 = require("react/jsx-runtime");
2574
+ var React19 = __toESM(require("react"), 1);
2575
+ var import_fractal_icons14 = require("@mirror-physics/fractal-icons");
2576
+ var import_jsx_runtime32 = require("react/jsx-runtime");
2476
2577
  function FileDropzone({
2477
2578
  files,
2478
2579
  onFilesChange,
@@ -2483,17 +2584,17 @@ function FileDropzone({
2483
2584
  description = "Files stay attached to this record.",
2484
2585
  className
2485
2586
  }) {
2486
- const inputId = React18.useId();
2487
- const inputRef = React18.useRef(null);
2488
- const [isDragging, setIsDragging] = React18.useState(false);
2587
+ const inputId = React19.useId();
2588
+ const inputRef = React19.useRef(null);
2589
+ const [isDragging, setIsDragging] = React19.useState(false);
2489
2590
  const addFiles = (nextFiles) => {
2490
2591
  if (disabled) return;
2491
2592
  const additions = Array.from(nextFiles);
2492
2593
  if (additions.length === 0) return;
2493
2594
  onFilesChange(multiple ? [...files, ...additions] : additions.slice(0, 1));
2494
2595
  };
2495
- return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: cn("fractal-file-dropzone", className), children: [
2496
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
2596
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: cn("fractal-file-dropzone", className), children: [
2597
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
2497
2598
  "input",
2498
2599
  {
2499
2600
  ref: inputRef,
@@ -2509,7 +2610,7 @@ function FileDropzone({
2509
2610
  }
2510
2611
  }
2511
2612
  ),
2512
- /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
2613
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
2513
2614
  "button",
2514
2615
  {
2515
2616
  className: "fractal-file-dropzone__target",
@@ -2532,18 +2633,18 @@ function FileDropzone({
2532
2633
  addFiles(event.dataTransfer.files);
2533
2634
  },
2534
2635
  children: [
2535
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_fractal_icons13.FileArrowUp, { "aria-hidden": "true", size: 20 }),
2536
- /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("span", { className: "fractal-file-dropzone__copy", children: [
2537
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "fractal-file-dropzone__title", children: title }),
2538
- description && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "fractal-file-dropzone__description", children: description })
2636
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_fractal_icons14.FileArrowUp, { "aria-hidden": "true", size: 20 }),
2637
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("span", { className: "fractal-file-dropzone__copy", children: [
2638
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "fractal-file-dropzone__title", children: title }),
2639
+ description && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "fractal-file-dropzone__description", children: description })
2539
2640
  ] })
2540
2641
  ]
2541
2642
  }
2542
2643
  ),
2543
- files.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("ul", { className: "fractal-file-dropzone__files", "aria-label": "Attached files", children: files.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("li", { className: "fractal-file-dropzone__file", children: [
2544
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "fractal-file-dropzone__file-name", children: file.name }),
2545
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "fractal-file-dropzone__file-meta", children: formatFileSize(file.size) }),
2546
- /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
2644
+ files.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("ul", { className: "fractal-file-dropzone__files", "aria-label": "Attached files", children: files.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("li", { className: "fractal-file-dropzone__file", children: [
2645
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "fractal-file-dropzone__file-name", children: file.name }),
2646
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "fractal-file-dropzone__file-meta", children: formatFileSize(file.size) }),
2647
+ /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
2547
2648
  "button",
2548
2649
  {
2549
2650
  className: "fractal-file-dropzone__remove",
@@ -2551,7 +2652,7 @@ function FileDropzone({
2551
2652
  "aria-label": `Remove ${file.name}`,
2552
2653
  disabled,
2553
2654
  onClick: () => onFilesChange(files.filter((_, fileIndex) => fileIndex !== index)),
2554
- children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_fractal_icons13.Close, { "aria-hidden": "true", size: 14 })
2655
+ children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_fractal_icons14.Close, { "aria-hidden": "true", size: 14 })
2555
2656
  }
2556
2657
  )
2557
2658
  ] }, `${file.name}-${file.size}-${index}`)) })
@@ -2564,8 +2665,8 @@ function formatFileSize(bytes) {
2564
2665
  }
2565
2666
 
2566
2667
  // src/components/Pagination/Pagination.tsx
2567
- var import_fractal_icons14 = require("@mirror-physics/fractal-icons");
2568
- var import_jsx_runtime32 = require("react/jsx-runtime");
2668
+ var import_fractal_icons15 = require("@mirror-physics/fractal-icons");
2669
+ var import_jsx_runtime33 = require("react/jsx-runtime");
2569
2670
  function Pagination({
2570
2671
  page,
2571
2672
  pageSize,
@@ -2581,10 +2682,10 @@ function Pagination({
2581
2682
  const start = totalItems === 0 ? 0 : (currentPage - 1) * pageSize + 1;
2582
2683
  const end = Math.min(currentPage * pageSize, totalItems);
2583
2684
  const canChangePageSize = pageSizeOptions != null && pageSizeOptions.length > 0 && onPageSizeChange != null;
2584
- return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("nav", { className: cn("fractal-pagination", className), "aria-label": ariaLabel, children: [
2585
- /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "fractal-pagination__summary", children: totalItems === 0 ? "No results" : `${start}-${end} of ${totalItems}` }),
2586
- /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "fractal-pagination__controls", children: [
2587
- canChangePageSize && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
2685
+ return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("nav", { className: cn("fractal-pagination", className), "aria-label": ariaLabel, children: [
2686
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "fractal-pagination__summary", children: totalItems === 0 ? "No results" : `${start}-${end} of ${totalItems}` }),
2687
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "fractal-pagination__controls", children: [
2688
+ canChangePageSize && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
2588
2689
  Dropdown,
2589
2690
  {
2590
2691
  align: "right",
@@ -2601,7 +2702,7 @@ function Pagination({
2601
2702
  triggerVariant: "tertiary"
2602
2703
  }
2603
2704
  ),
2604
- /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
2705
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
2605
2706
  "button",
2606
2707
  {
2607
2708
  className: "fractal-pagination__button",
@@ -2610,15 +2711,15 @@ function Pagination({
2610
2711
  title: "Previous page",
2611
2712
  disabled: currentPage === 1 || totalItems === 0,
2612
2713
  onClick: () => onPageChange(currentPage - 1),
2613
- children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_fractal_icons14.ArrowLeft, { "aria-hidden": "true", size: 16 })
2714
+ children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_fractal_icons15.ArrowLeft, { "aria-hidden": "true", size: 16 })
2614
2715
  }
2615
2716
  ),
2616
- /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("span", { className: "fractal-pagination__page", "aria-current": "page", children: [
2717
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("span", { className: "fractal-pagination__page", "aria-current": "page", children: [
2617
2718
  currentPage,
2618
2719
  " of ",
2619
2720
  totalPages
2620
2721
  ] }),
2621
- /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
2722
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
2622
2723
  "button",
2623
2724
  {
2624
2725
  className: "fractal-pagination__button",
@@ -2627,7 +2728,7 @@ function Pagination({
2627
2728
  title: "Next page",
2628
2729
  disabled: currentPage === totalPages || totalItems === 0,
2629
2730
  onClick: () => onPageChange(currentPage + 1),
2630
- children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_fractal_icons14.ArrowRight, { "aria-hidden": "true", size: 16 })
2731
+ children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_fractal_icons15.ArrowRight, { "aria-hidden": "true", size: 16 })
2631
2732
  }
2632
2733
  )
2633
2734
  ] })
@@ -2706,6 +2807,8 @@ function Pagination({
2706
2807
  TextButtonGhost,
2707
2808
  Textarea,
2708
2809
  TextareaGhost,
2810
+ Toast,
2811
+ ToastViewport,
2709
2812
  Toggle,
2710
2813
  ToggleGhost,
2711
2814
  UILoader,