@almadar/ui 5.146.2 → 5.147.0

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.
@@ -27698,7 +27698,12 @@ function daysAgo(n) {
27698
27698
  d.setDate(d.getDate() - n);
27699
27699
  return d;
27700
27700
  }
27701
- var DEFAULT_PRESETS, DateRangePicker;
27701
+ function resolvePresetRange(preset) {
27702
+ if (typeof preset.range === "function") return preset.range();
27703
+ if (preset.range) return preset.range;
27704
+ return TOKEN_RANGES[preset.value]?.() ?? null;
27705
+ }
27706
+ var TOKEN_RANGES, DEFAULT_PRESETS, DateRangePicker;
27702
27707
  var init_DateRangePicker = __esm({
27703
27708
  "components/core/molecules/DateRangePicker.tsx"() {
27704
27709
  "use client";
@@ -27708,32 +27713,19 @@ var init_DateRangePicker = __esm({
27708
27713
  init_Stack();
27709
27714
  init_Typography();
27710
27715
  init_useEventBus();
27716
+ TOKEN_RANGES = {
27717
+ "7d": () => ({ from: toISODate(daysAgo(7)), to: toISODate(/* @__PURE__ */ new Date()) }),
27718
+ "30d": () => ({ from: toISODate(daysAgo(30)), to: toISODate(/* @__PURE__ */ new Date()) }),
27719
+ month: () => ({ from: toISODate(startOfMonth(/* @__PURE__ */ new Date())), to: toISODate(/* @__PURE__ */ new Date()) }),
27720
+ quarter: () => ({ from: toISODate(startOfQuarter(/* @__PURE__ */ new Date())), to: toISODate(/* @__PURE__ */ new Date()) }),
27721
+ ytd: () => ({ from: toISODate(startOfYear(/* @__PURE__ */ new Date())), to: toISODate(/* @__PURE__ */ new Date()) })
27722
+ };
27711
27723
  DEFAULT_PRESETS = [
27712
- {
27713
- label: "Last 7 days",
27714
- value: "7d",
27715
- range: () => ({ from: toISODate(daysAgo(7)), to: toISODate(/* @__PURE__ */ new Date()) })
27716
- },
27717
- {
27718
- label: "Last 30 days",
27719
- value: "30d",
27720
- range: () => ({ from: toISODate(daysAgo(30)), to: toISODate(/* @__PURE__ */ new Date()) })
27721
- },
27722
- {
27723
- label: "This Month",
27724
- value: "month",
27725
- range: () => ({ from: toISODate(startOfMonth(/* @__PURE__ */ new Date())), to: toISODate(/* @__PURE__ */ new Date()) })
27726
- },
27727
- {
27728
- label: "This Quarter",
27729
- value: "quarter",
27730
- range: () => ({ from: toISODate(startOfQuarter(/* @__PURE__ */ new Date())), to: toISODate(/* @__PURE__ */ new Date()) })
27731
- },
27732
- {
27733
- label: "YTD",
27734
- value: "ytd",
27735
- range: () => ({ from: toISODate(startOfYear(/* @__PURE__ */ new Date())), to: toISODate(/* @__PURE__ */ new Date()) })
27736
- }
27724
+ { label: "Last 7 days", value: "7d" },
27725
+ { label: "Last 30 days", value: "30d" },
27726
+ { label: "This Month", value: "month" },
27727
+ { label: "This Quarter", value: "quarter" },
27728
+ { label: "YTD", value: "ytd" }
27737
27729
  ];
27738
27730
  DateRangePicker = ({
27739
27731
  from: fromProp,
@@ -27774,7 +27766,8 @@ var init_DateRangePicker = __esm({
27774
27766
  );
27775
27767
  const handlePreset = React87.useCallback(
27776
27768
  (preset) => {
27777
- const range = preset.range();
27769
+ const range = resolvePresetRange(preset);
27770
+ if (range === null) return;
27778
27771
  setFrom(range.from);
27779
27772
  setTo(range.to);
27780
27773
  setActivePreset(preset.value);
@@ -27782,8 +27775,12 @@ var init_DateRangePicker = __esm({
27782
27775
  },
27783
27776
  [emit]
27784
27777
  );
27778
+ const renderablePresets = React87.useMemo(
27779
+ () => presets.filter((p) => p.range !== void 0 || TOKEN_RANGES[p.value] !== void 0),
27780
+ [presets]
27781
+ );
27785
27782
  const presetButtons = React87.useMemo(
27786
- () => presets.map((preset) => /* @__PURE__ */ jsxRuntime.jsx(
27783
+ () => renderablePresets.map((preset) => /* @__PURE__ */ jsxRuntime.jsx(
27787
27784
  Button,
27788
27785
  {
27789
27786
  variant: activePreset === preset.value ? "primary" : "ghost",
@@ -27793,7 +27790,7 @@ var init_DateRangePicker = __esm({
27793
27790
  },
27794
27791
  preset.value
27795
27792
  )),
27796
- [presets, activePreset, handlePreset]
27793
+ [renderablePresets, activePreset, handlePreset]
27797
27794
  );
27798
27795
  return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", className: cn(className), children: [
27799
27796
  /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "md", align: "end", children: [
@@ -27820,7 +27817,7 @@ var init_DateRangePicker = __esm({
27820
27817
  )
27821
27818
  ] })
27822
27819
  ] }),
27823
- presets.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(HStack, { gap: "xs", wrap: true, children: presetButtons })
27820
+ renderablePresets.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(HStack, { gap: "xs", wrap: true, children: presetButtons })
27824
27821
  ] });
27825
27822
  };
27826
27823
  DateRangePicker.displayName = "DateRangePicker";
@@ -28262,6 +28259,208 @@ var init_PhysicsCanvas = __esm({
28262
28259
  };
28263
28260
  }
28264
28261
  });
28262
+
28263
+ // lib/graphViewLayouts.ts
28264
+ function buildAdjacency(nodeIds, edges) {
28265
+ const known = new Set(nodeIds);
28266
+ const out = /* @__PURE__ */ new Map();
28267
+ const inMap = /* @__PURE__ */ new Map();
28268
+ for (const id of nodeIds) {
28269
+ out.set(id, []);
28270
+ inMap.set(id, []);
28271
+ }
28272
+ for (const edge of edges) {
28273
+ if (!known.has(edge.source) || !known.has(edge.target)) continue;
28274
+ out.get(edge.source)?.push(edge.target);
28275
+ inMap.get(edge.target)?.push(edge.source);
28276
+ }
28277
+ return { out, in: inMap };
28278
+ }
28279
+ function findRoots(nodeIds, adjacency) {
28280
+ return nodeIds.filter((id) => (adjacency.in.get(id)?.length ?? 0) === 0);
28281
+ }
28282
+ function assignLayers(nodeIds, adjacency, roots) {
28283
+ const layer = new Map(nodeIds.map((id) => [id, 0]));
28284
+ const onStack = /* @__PURE__ */ new Set();
28285
+ const visit = (id) => {
28286
+ onStack.add(id);
28287
+ const currentLayer = layer.get(id) ?? 0;
28288
+ for (const next of adjacency.out.get(id) ?? []) {
28289
+ if (onStack.has(next)) continue;
28290
+ const candidate = currentLayer + 1;
28291
+ if (candidate > (layer.get(next) ?? 0)) {
28292
+ layer.set(next, candidate);
28293
+ }
28294
+ visit(next);
28295
+ }
28296
+ onStack.delete(id);
28297
+ };
28298
+ for (const root of roots) visit(root);
28299
+ return layer;
28300
+ }
28301
+ function computeVisitOrder(nodeIds, adjacency, roots) {
28302
+ const order = /* @__PURE__ */ new Map();
28303
+ const visited = /* @__PURE__ */ new Set();
28304
+ let counter = 0;
28305
+ const visit = (id) => {
28306
+ if (visited.has(id)) return;
28307
+ visited.add(id);
28308
+ order.set(id, counter++);
28309
+ for (const next of adjacency.out.get(id) ?? []) visit(next);
28310
+ };
28311
+ for (const root of roots) visit(root);
28312
+ for (const id of nodeIds) {
28313
+ if (!visited.has(id)) order.set(id, counter++);
28314
+ }
28315
+ return order;
28316
+ }
28317
+ function bfsDepthAndOrder(nodeIds, adjacency, roots) {
28318
+ const depth = new Map(nodeIds.map((id) => [id, 0]));
28319
+ const visitOrder = /* @__PURE__ */ new Map();
28320
+ const visited = /* @__PURE__ */ new Set();
28321
+ const queue = [];
28322
+ let counter = 0;
28323
+ for (const root of roots) {
28324
+ if (visited.has(root)) continue;
28325
+ visited.add(root);
28326
+ depth.set(root, 0);
28327
+ visitOrder.set(root, counter++);
28328
+ queue.push(root);
28329
+ }
28330
+ let head = 0;
28331
+ while (head < queue.length) {
28332
+ const id = queue[head++];
28333
+ const d = depth.get(id) ?? 0;
28334
+ for (const next of adjacency.out.get(id) ?? []) {
28335
+ if (visited.has(next)) continue;
28336
+ visited.add(next);
28337
+ depth.set(next, d + 1);
28338
+ visitOrder.set(next, counter++);
28339
+ queue.push(next);
28340
+ }
28341
+ }
28342
+ for (const id of nodeIds) {
28343
+ if (!visited.has(id)) visitOrder.set(id, counter++);
28344
+ }
28345
+ return { depth, visitOrder };
28346
+ }
28347
+ function edgeWalkOrder(nodeIds, adjacency) {
28348
+ const visited = /* @__PURE__ */ new Set();
28349
+ const result = [];
28350
+ for (const start of nodeIds) {
28351
+ if (visited.has(start)) continue;
28352
+ let current = start;
28353
+ while (current !== void 0 && !visited.has(current)) {
28354
+ visited.add(current);
28355
+ result.push(current);
28356
+ const outs = adjacency.out.get(current) ?? [];
28357
+ current = outs.find((next) => !visited.has(next));
28358
+ }
28359
+ }
28360
+ return result;
28361
+ }
28362
+ function groupByTier(nodeIds, tierOf, maxTier) {
28363
+ const groups = Array.from({ length: maxTier + 1 }, () => []);
28364
+ for (const id of nodeIds) {
28365
+ groups[tierOf.get(id) ?? 0].push(id);
28366
+ }
28367
+ return groups;
28368
+ }
28369
+ function distributeAxis(count, start, end) {
28370
+ if (count <= 0) return [];
28371
+ const slot = (end - start) / count;
28372
+ return Array.from({ length: count }, (_, i) => start + slot * (i + 0.5));
28373
+ }
28374
+ function orderByParentPositionThenInput(group, adjacency, positioned, inputIndex) {
28375
+ const withKey = group.map((id) => {
28376
+ const parentValues = (adjacency.in.get(id) ?? []).map((p) => positioned.get(p)).filter((v) => v !== void 0);
28377
+ const avg = parentValues.length > 0 ? parentValues.reduce((a, b) => a + b, 0) / parentValues.length : Number.POSITIVE_INFINITY;
28378
+ return { id, avg, idx: inputIndex.get(id) ?? 0 };
28379
+ });
28380
+ withKey.sort((a, b) => a.avg !== b.avg ? a.avg - b.avg : a.idx - b.idx);
28381
+ return withKey.map((k) => k.id);
28382
+ }
28383
+ function layoutFlow(nodeIds, adjacency, roots, width, height, margin) {
28384
+ const inputIndex = new Map(nodeIds.map((id, i) => [id, i]));
28385
+ const layers = assignLayers(nodeIds, adjacency, roots);
28386
+ const maxLayer = Math.max(...Array.from(layers.values()));
28387
+ const layerGroups = groupByTier(nodeIds, layers, maxLayer);
28388
+ const positions = /* @__PURE__ */ new Map();
28389
+ const yById = /* @__PURE__ */ new Map();
28390
+ for (let l = 0; l <= maxLayer; l++) {
28391
+ const x = margin + l * (width - 2 * margin) / Math.max(1, maxLayer);
28392
+ const ordered2 = orderByParentPositionThenInput(layerGroups[l], adjacency, yById, inputIndex);
28393
+ const ys = distributeAxis(ordered2.length, margin, height - margin);
28394
+ ordered2.forEach((id, i) => {
28395
+ positions.set(id, { id, x, y: ys[i] });
28396
+ yById.set(id, ys[i]);
28397
+ });
28398
+ }
28399
+ return nodeIds.map((id) => positions.get(id));
28400
+ }
28401
+ function layoutTree(nodeIds, adjacency, roots, width, height, margin) {
28402
+ const effectiveRoots = roots.length > 0 ? roots : [nodeIds[0]];
28403
+ const layers = assignLayers(nodeIds, adjacency, effectiveRoots);
28404
+ const maxLayer = Math.max(...Array.from(layers.values()));
28405
+ const visitOrder = computeVisitOrder(nodeIds, adjacency, effectiveRoots);
28406
+ const layerGroups = groupByTier(nodeIds, layers, maxLayer);
28407
+ const positions = /* @__PURE__ */ new Map();
28408
+ for (let l = 0; l <= maxLayer; l++) {
28409
+ const ordered2 = [...layerGroups[l]].sort(
28410
+ (a, b) => (visitOrder.get(a) ?? 0) - (visitOrder.get(b) ?? 0)
28411
+ );
28412
+ const y = margin + l * (height - 2 * margin) / Math.max(1, maxLayer);
28413
+ const xs = distributeAxis(ordered2.length, margin, width - margin);
28414
+ ordered2.forEach((id, i) => positions.set(id, { id, x: xs[i], y }));
28415
+ }
28416
+ return nodeIds.map((id) => positions.get(id));
28417
+ }
28418
+ function layoutRadial(nodeIds, adjacency, roots, width, height, margin) {
28419
+ const cx = width / 2;
28420
+ const cy = height / 2;
28421
+ const maxRadius = Math.min(width, height) / 2 - margin;
28422
+ if (roots.length === 0) {
28423
+ const order = edgeWalkOrder(nodeIds, adjacency);
28424
+ const k = order.length;
28425
+ const positions2 = /* @__PURE__ */ new Map();
28426
+ order.forEach((id, i) => {
28427
+ const angle = i / k * 2 * Math.PI;
28428
+ positions2.set(id, { id, x: cx + maxRadius * Math.cos(angle), y: cy + maxRadius * Math.sin(angle) });
28429
+ });
28430
+ return nodeIds.map((id) => positions2.get(id));
28431
+ }
28432
+ const { depth, visitOrder } = bfsDepthAndOrder(nodeIds, adjacency, roots);
28433
+ const maxDepth = Math.max(...Array.from(depth.values()));
28434
+ const ringGroups = groupByTier(nodeIds, depth, maxDepth);
28435
+ const positions = /* @__PURE__ */ new Map();
28436
+ for (let d = 0; d <= maxDepth; d++) {
28437
+ const ordered2 = [...ringGroups[d]].sort(
28438
+ (a, b) => (visitOrder.get(a) ?? 0) - (visitOrder.get(b) ?? 0)
28439
+ );
28440
+ const radius = d * maxRadius / Math.max(1, maxDepth);
28441
+ const k = ordered2.length;
28442
+ ordered2.forEach((id, i) => {
28443
+ const angle = i / k * 2 * Math.PI;
28444
+ positions.set(id, { id, x: cx + radius * Math.cos(angle), y: cy + radius * Math.sin(angle) });
28445
+ });
28446
+ }
28447
+ return nodeIds.map((id) => positions.get(id));
28448
+ }
28449
+ function computeStaticLayout(mode, input) {
28450
+ const { nodeIds, edges, width, height } = input;
28451
+ const margin = input.margin ?? 40;
28452
+ if (nodeIds.length === 0) return [];
28453
+ if (nodeIds.length === 1) return [{ id: nodeIds[0], x: width / 2, y: height / 2 }];
28454
+ const adjacency = buildAdjacency(nodeIds, edges);
28455
+ const roots = findRoots(nodeIds, adjacency);
28456
+ if (mode === "flow") return layoutFlow(nodeIds, adjacency, roots, width, height, margin);
28457
+ if (mode === "tree") return layoutTree(nodeIds, adjacency, roots, width, height, margin);
28458
+ return layoutRadial(nodeIds, adjacency, roots, width, height, margin);
28459
+ }
28460
+ var init_graphViewLayouts = __esm({
28461
+ "lib/graphViewLayouts.ts"() {
28462
+ }
28463
+ });
28265
28464
  function resolveNodeColor(node, groups) {
28266
28465
  if (node.color) return node.color;
28267
28466
  if (node.group) {
@@ -28276,6 +28475,7 @@ var init_GraphView = __esm({
28276
28475
  "use client";
28277
28476
  init_cn();
28278
28477
  init_atoms();
28478
+ init_graphViewLayouts();
28279
28479
  GROUP_COLORS = [
28280
28480
  "#3b82f6",
28281
28481
  // blue-500
@@ -28306,11 +28506,13 @@ var init_GraphView = __esm({
28306
28506
  height: propHeight,
28307
28507
  className,
28308
28508
  showLabels = true,
28309
- zoomToFit = true
28509
+ zoomToFit = true,
28510
+ layout = "force"
28310
28511
  }) => {
28311
28512
  const { t } = hooks.useTranslate();
28312
28513
  const containerRef = React87.useRef(null);
28313
28514
  const animRef = React87.useRef(0);
28515
+ const arrowMarkerId = React87.useId();
28314
28516
  const [simNodes, setSimNodes] = React87.useState([]);
28315
28517
  const [settled, setSettled] = React87.useState(false);
28316
28518
  const [hoveredId, setHoveredId] = React87.useState(null);
@@ -28367,6 +28569,22 @@ var init_GraphView = __esm({
28367
28569
  fy: 0
28368
28570
  };
28369
28571
  });
28572
+ if (layout !== "force") {
28573
+ const points = computeStaticLayout(layout, {
28574
+ nodeIds: nodes.map((n) => n.id),
28575
+ edges,
28576
+ width: w,
28577
+ height: h
28578
+ });
28579
+ const pointById = new Map(points.map((p) => [p.id, p]));
28580
+ const laidOut = initialNodes.map((node) => {
28581
+ const point = pointById.get(node.id);
28582
+ return point ? { ...node, x: point.x, y: point.y } : node;
28583
+ });
28584
+ setSimNodes(laidOut);
28585
+ setSettled(true);
28586
+ return;
28587
+ }
28370
28588
  let iterations = 0;
28371
28589
  const maxIterations = 120;
28372
28590
  let currentNodes = initialNodes;
@@ -28435,7 +28653,7 @@ var init_GraphView = __esm({
28435
28653
  return () => {
28436
28654
  cancelAnimationFrame(animRef.current);
28437
28655
  };
28438
- }, [nodes, edges, w, h, groups]);
28656
+ }, [nodes, edges, w, h, groups, layout]);
28439
28657
  const viewBox = React87.useMemo(() => {
28440
28658
  if (!zoomToFit || !settled || simNodes.length === 0) {
28441
28659
  return `0 0 ${w} ${h}`;
@@ -28510,6 +28728,19 @@ var init_GraphView = __esm({
28510
28728
  viewBox,
28511
28729
  preserveAspectRatio: "xMidYMid meet",
28512
28730
  children: [
28731
+ layout !== "force" && /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx(
28732
+ "marker",
28733
+ {
28734
+ id: arrowMarkerId,
28735
+ viewBox: "0 0 10 10",
28736
+ refX: "9",
28737
+ refY: "5",
28738
+ markerWidth: "6",
28739
+ markerHeight: "6",
28740
+ orient: "auto-start-reverse",
28741
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M0,0 L10,5 L0,10 z", fill: "currentColor" })
28742
+ }
28743
+ ) }),
28513
28744
  edges.map((edge, idx) => {
28514
28745
  const source = nodeMap.get(edge.source);
28515
28746
  const target = nodeMap.get(edge.target);
@@ -28524,8 +28755,10 @@ var init_GraphView = __esm({
28524
28755
  x2: target.x,
28525
28756
  y2: target.y,
28526
28757
  stroke: edge.color ?? DEFAULT_EDGE_COLOR,
28758
+ color: edge.color ?? DEFAULT_EDGE_COLOR,
28527
28759
  strokeWidth: 1.5,
28528
- opacity: isHighlighted ? 0.8 : 0.15
28760
+ opacity: isHighlighted ? 0.8 : 0.15,
28761
+ markerEnd: layout !== "force" ? `url(#${arrowMarkerId})` : void 0
28529
28762
  }
28530
28763
  ),
28531
28764
  showLabels && edge.label && /* @__PURE__ */ jsxRuntime.jsx(