@inf-monkeys-tech/monkeys-design 1.0.111 → 1.0.112

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.
@@ -517,7 +517,13 @@ function mergeStyles(...sources) {
517
517
  );
518
518
  }
519
519
  function getPresetDefaults(preset) {
520
- return presetDefaults[preset] ?? presetDefaults.default;
520
+ const defaults = presetDefaults[preset];
521
+ if (!defaults) {
522
+ throw new TypeError(
523
+ `Unknown Data Explorer theme preset "${String(preset)}". Expected one of: ${Object.keys(presetDefaults).join(", ")}.`
524
+ );
525
+ }
526
+ return defaults;
521
527
  }
522
528
  function resolveDataExplorerAppearance(appearance) {
523
529
  const preset = appearance?.preset ?? "default";
@@ -1743,7 +1749,46 @@ function resolveAppearance(appearance) {
1743
1749
  surface === "outlined" && "border-border bg-background text-foreground shadow-none"
1744
1750
  ),
1745
1751
  itemHeight: density === "compact" ? "min-h-9" : density === "comfortable" ? "min-h-14" : "min-h-11",
1746
- itemPadding: density === "compact" ? "px-2 py-1.5" : density === "comfortable" ? "px-3 py-3" : "px-3 py-2"
1752
+ itemPadding: density === "compact" ? "px-2 py-1.5" : density === "comfortable" ? "px-3 py-3" : "px-3 py-2",
1753
+ searchHeight: density === "compact" ? "h-8" : density === "comfortable" ? "h-10" : "h-9"
1754
+ };
1755
+ }
1756
+ var navigationTreeRowHoverClassName = "hover:bg-[var(--monkeys-component-navigation-sidebar-tree-row-hover-background,hsl(var(--muted)))] hover:text-[var(--monkeys-component-navigation-sidebar-tree-row-hover-foreground,hsl(var(--foreground)))]";
1757
+ var navigationTreeRowSelectedClassName = "bg-[var(--monkeys-component-navigation-sidebar-tree-row-selected-background,hsl(var(--accent)))] text-[var(--monkeys-component-navigation-sidebar-tree-row-selected-foreground,hsl(var(--accent-foreground)))] hover:bg-[var(--monkeys-component-navigation-sidebar-tree-row-selected-background,hsl(var(--accent)))] hover:text-[var(--monkeys-component-navigation-sidebar-tree-row-selected-foreground,hsl(var(--accent-foreground)))]";
1758
+ var navigationTreeNestedControlClassName = "hover:!bg-transparent hover:!text-inherit focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
1759
+ function resolveNavigationTreeClassNames(classNames) {
1760
+ return {
1761
+ ...classNames,
1762
+ groupHeader: cn(navigationTreeRowHoverClassName, classNames?.groupHeader),
1763
+ itemSelected: cn(
1764
+ navigationTreeRowSelectedClassName,
1765
+ classNames?.itemSelected
1766
+ ),
1767
+ nodeButton: cn(
1768
+ navigationTreeRowHoverClassName,
1769
+ "aria-selected:bg-[var(--monkeys-component-navigation-sidebar-tree-row-selected-background,hsl(var(--accent)))] aria-selected:text-[var(--monkeys-component-navigation-sidebar-tree-row-selected-foreground,hsl(var(--accent-foreground)))] aria-selected:hover:bg-[var(--monkeys-component-navigation-sidebar-tree-row-selected-background,hsl(var(--accent)))] aria-selected:hover:text-[var(--monkeys-component-navigation-sidebar-tree-row-selected-foreground,hsl(var(--accent-foreground)))]",
1770
+ classNames?.nodeButton
1771
+ ),
1772
+ expander: cn(
1773
+ navigationTreeNestedControlClassName,
1774
+ classNames?.expander
1775
+ ),
1776
+ nodeToggle: cn(
1777
+ navigationTreeNestedControlClassName,
1778
+ classNames?.nodeToggle
1779
+ ),
1780
+ groupActions: cn(
1781
+ navigationTreeNestedControlClassName,
1782
+ classNames?.groupActions
1783
+ ),
1784
+ nodeActions: cn(
1785
+ navigationTreeNestedControlClassName,
1786
+ classNames?.nodeActions
1787
+ ),
1788
+ nodeDragHandle: cn(
1789
+ navigationTreeNestedControlClassName,
1790
+ classNames?.nodeDragHandle
1791
+ )
1747
1792
  };
1748
1793
  }
1749
1794
  function EntryButton({
@@ -2366,7 +2411,13 @@ function NavigationSidebarInner(props, ref) {
2366
2411
  );
2367
2412
  }
2368
2413
  const treeProps = props.tree;
2369
- return /* @__PURE__ */ jsxRuntime.jsx(DataExplorerViewTree, { ...treeProps });
2414
+ return /* @__PURE__ */ jsxRuntime.jsx(
2415
+ DataExplorerViewTree,
2416
+ {
2417
+ ...treeProps,
2418
+ classNames: resolveNavigationTreeClassNames(treeProps.classNames)
2419
+ }
2420
+ );
2370
2421
  };
2371
2422
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2372
2423
  /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2462,61 +2513,79 @@ function NavigationSidebarInner(props, ref) {
2462
2513
  ]
2463
2514
  }
2464
2515
  ) : null,
2465
- !resolvedCollapsed && props.search ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("p-3 pb-2", props.classNames?.search), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-9 items-center gap-2 rounded-md border border-border bg-background px-3 text-muted-foreground focus-within:ring-2 focus-within:ring-ring", children: [
2466
- /* @__PURE__ */ jsxRuntime.jsx(
2467
- "span",
2468
- {
2469
- className: cn(
2470
- "flex shrink-0",
2471
- props.classNames?.searchIcon
2472
- ),
2473
- "aria-hidden": "true",
2474
- children: props.search.icon ?? /* @__PURE__ */ jsxRuntime.jsx(SearchIcon, {})
2475
- }
2476
- ),
2477
- /* @__PURE__ */ jsxRuntime.jsx(
2478
- "input",
2479
- {
2480
- type: "search",
2481
- value: resolvedSearchValue,
2482
- placeholder: props.search.placeholder,
2483
- "aria-label": props.search.ariaLabel,
2484
- className: cn(
2485
- "min-w-0 flex-1 bg-transparent text-sm text-foreground outline-none placeholder:text-muted-foreground",
2486
- props.classNames?.searchInput
2487
- ),
2488
- onChange: (event) => {
2489
- const nextValue = event.currentTarget.value;
2490
- if (props.search?.value === void 0)
2491
- setInternalSearchValue(nextValue);
2492
- props.search?.onValueChange?.(nextValue);
2516
+ !resolvedCollapsed && props.search ? /* @__PURE__ */ jsxRuntime.jsx(
2517
+ "div",
2518
+ {
2519
+ className: cn(
2520
+ "px-[var(--monkeys-component-navigation-sidebar-content-inline-padding,var(--global-spacing,0.75rem))] pb-2 pt-3",
2521
+ props.classNames?.search
2522
+ ),
2523
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
2524
+ "div",
2525
+ {
2526
+ className: cn(
2527
+ "flex items-center gap-2 rounded-md border border-input bg-[var(--monkeys-component-navigation-sidebar-search-background,hsl(var(--monkeys-color-control-surface)))] px-3 text-muted-foreground ring-offset-control-surface focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
2528
+ appearance.searchHeight
2529
+ ),
2530
+ children: [
2531
+ /* @__PURE__ */ jsxRuntime.jsx(
2532
+ "span",
2533
+ {
2534
+ className: cn(
2535
+ "flex shrink-0",
2536
+ props.classNames?.searchIcon
2537
+ ),
2538
+ "aria-hidden": "true",
2539
+ children: props.search.icon ?? /* @__PURE__ */ jsxRuntime.jsx(SearchIcon, {})
2540
+ }
2541
+ ),
2542
+ /* @__PURE__ */ jsxRuntime.jsx(
2543
+ "input",
2544
+ {
2545
+ type: "search",
2546
+ value: resolvedSearchValue,
2547
+ placeholder: props.search.placeholder,
2548
+ "aria-label": props.search.ariaLabel,
2549
+ className: cn(
2550
+ "min-w-0 flex-1 bg-transparent text-sm text-foreground outline-none placeholder:text-muted-foreground",
2551
+ props.classNames?.searchInput
2552
+ ),
2553
+ onChange: (event) => {
2554
+ const nextValue = event.currentTarget.value;
2555
+ if (props.search?.value === void 0)
2556
+ setInternalSearchValue(nextValue);
2557
+ props.search?.onValueChange?.(nextValue);
2558
+ }
2559
+ }
2560
+ ),
2561
+ resolvedSearchValue && props.search.clearLabel ? /* @__PURE__ */ jsxRuntime.jsx(
2562
+ "button",
2563
+ {
2564
+ type: "button",
2565
+ className: cn(
2566
+ "inline-flex h-6 w-6 items-center justify-center rounded text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
2567
+ props.classNames?.searchClear
2568
+ ),
2569
+ "aria-label": props.search.clearLabel,
2570
+ title: props.search.clearLabel,
2571
+ onClick: () => {
2572
+ if (props.search?.value === void 0)
2573
+ setInternalSearchValue("");
2574
+ props.search?.onValueChange?.("");
2575
+ },
2576
+ children: /* @__PURE__ */ jsxRuntime.jsx(ClearIcon, {})
2577
+ }
2578
+ ) : null
2579
+ ]
2493
2580
  }
2494
- }
2495
- ),
2496
- resolvedSearchValue && props.search.clearLabel ? /* @__PURE__ */ jsxRuntime.jsx(
2497
- "button",
2498
- {
2499
- type: "button",
2500
- className: cn(
2501
- "inline-flex h-6 w-6 items-center justify-center rounded text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
2502
- props.classNames?.searchClear
2503
- ),
2504
- "aria-label": props.search.clearLabel,
2505
- title: props.search.clearLabel,
2506
- onClick: () => {
2507
- if (props.search?.value === void 0)
2508
- setInternalSearchValue("");
2509
- props.search?.onValueChange?.("");
2510
- },
2511
- children: /* @__PURE__ */ jsxRuntime.jsx(ClearIcon, {})
2512
- }
2513
- ) : null
2514
- ] }) }) : null,
2581
+ )
2582
+ }
2583
+ ) : null,
2515
2584
  /* @__PURE__ */ jsxRuntime.jsx(
2516
2585
  "div",
2517
2586
  {
2518
2587
  className: cn(
2519
- "min-h-0 flex-1 overflow-y-auto p-3",
2588
+ "min-h-0 flex-1 overflow-y-auto px-[var(--monkeys-component-navigation-sidebar-content-inline-padding,var(--global-spacing,0.75rem))] py-3",
2520
2589
  resolvedCollapsed && "px-1.5",
2521
2590
  props.classNames?.content
2522
2591
  ),