@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.
package/dist/index.mjs CHANGED
@@ -22339,7 +22339,13 @@ function mergeStyles2(...sources) {
22339
22339
  );
22340
22340
  }
22341
22341
  function getPresetDefaults2(preset) {
22342
- return presetDefaults2[preset] ?? presetDefaults2.default;
22342
+ const defaults = presetDefaults2[preset];
22343
+ if (!defaults) {
22344
+ throw new TypeError(
22345
+ `Unknown Data Explorer theme preset "${String(preset)}". Expected one of: ${Object.keys(presetDefaults2).join(", ")}.`
22346
+ );
22347
+ }
22348
+ return defaults;
22343
22349
  }
22344
22350
  function resolveDataExplorerAppearance(appearance) {
22345
22351
  const preset = appearance?.preset ?? "default";
@@ -26974,7 +26980,46 @@ function resolveAppearance(appearance) {
26974
26980
  surface === "outlined" && "border-border bg-background text-foreground shadow-none"
26975
26981
  ),
26976
26982
  itemHeight: density === "compact" ? "min-h-9" : density === "comfortable" ? "min-h-14" : "min-h-11",
26977
- itemPadding: density === "compact" ? "px-2 py-1.5" : density === "comfortable" ? "px-3 py-3" : "px-3 py-2"
26983
+ itemPadding: density === "compact" ? "px-2 py-1.5" : density === "comfortable" ? "px-3 py-3" : "px-3 py-2",
26984
+ searchHeight: density === "compact" ? "h-8" : density === "comfortable" ? "h-10" : "h-9"
26985
+ };
26986
+ }
26987
+ 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)))]";
26988
+ 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)))]";
26989
+ var navigationTreeNestedControlClassName = "hover:!bg-transparent hover:!text-inherit focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
26990
+ function resolveNavigationTreeClassNames(classNames) {
26991
+ return {
26992
+ ...classNames,
26993
+ groupHeader: cn(navigationTreeRowHoverClassName, classNames?.groupHeader),
26994
+ itemSelected: cn(
26995
+ navigationTreeRowSelectedClassName,
26996
+ classNames?.itemSelected
26997
+ ),
26998
+ nodeButton: cn(
26999
+ navigationTreeRowHoverClassName,
27000
+ "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)))]",
27001
+ classNames?.nodeButton
27002
+ ),
27003
+ expander: cn(
27004
+ navigationTreeNestedControlClassName,
27005
+ classNames?.expander
27006
+ ),
27007
+ nodeToggle: cn(
27008
+ navigationTreeNestedControlClassName,
27009
+ classNames?.nodeToggle
27010
+ ),
27011
+ groupActions: cn(
27012
+ navigationTreeNestedControlClassName,
27013
+ classNames?.groupActions
27014
+ ),
27015
+ nodeActions: cn(
27016
+ navigationTreeNestedControlClassName,
27017
+ classNames?.nodeActions
27018
+ ),
27019
+ nodeDragHandle: cn(
27020
+ navigationTreeNestedControlClassName,
27021
+ classNames?.nodeDragHandle
27022
+ )
26978
27023
  };
26979
27024
  }
26980
27025
  function EntryButton({
@@ -27597,7 +27642,13 @@ function NavigationSidebarInner(props, ref) {
27597
27642
  );
27598
27643
  }
27599
27644
  const treeProps = props.tree;
27600
- return /* @__PURE__ */ jsx(DataExplorerViewTree, { ...treeProps });
27645
+ return /* @__PURE__ */ jsx(
27646
+ DataExplorerViewTree,
27647
+ {
27648
+ ...treeProps,
27649
+ classNames: resolveNavigationTreeClassNames(treeProps.classNames)
27650
+ }
27651
+ );
27601
27652
  };
27602
27653
  return /* @__PURE__ */ jsxs(Fragment, { children: [
27603
27654
  /* @__PURE__ */ jsxs(
@@ -27693,61 +27744,79 @@ function NavigationSidebarInner(props, ref) {
27693
27744
  ]
27694
27745
  }
27695
27746
  ) : null,
27696
- !resolvedCollapsed && props.search ? /* @__PURE__ */ jsx("div", { className: cn("p-3 pb-2", props.classNames?.search), children: /* @__PURE__ */ 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: [
27697
- /* @__PURE__ */ jsx(
27698
- "span",
27699
- {
27700
- className: cn(
27701
- "flex shrink-0",
27702
- props.classNames?.searchIcon
27703
- ),
27704
- "aria-hidden": "true",
27705
- children: props.search.icon ?? /* @__PURE__ */ jsx(SearchIcon, {})
27706
- }
27707
- ),
27708
- /* @__PURE__ */ jsx(
27709
- "input",
27710
- {
27711
- type: "search",
27712
- value: resolvedSearchValue,
27713
- placeholder: props.search.placeholder,
27714
- "aria-label": props.search.ariaLabel,
27715
- className: cn(
27716
- "min-w-0 flex-1 bg-transparent text-sm text-foreground outline-none placeholder:text-muted-foreground",
27717
- props.classNames?.searchInput
27718
- ),
27719
- onChange: (event) => {
27720
- const nextValue = event.currentTarget.value;
27721
- if (props.search?.value === void 0)
27722
- setInternalSearchValue(nextValue);
27723
- props.search?.onValueChange?.(nextValue);
27747
+ !resolvedCollapsed && props.search ? /* @__PURE__ */ jsx(
27748
+ "div",
27749
+ {
27750
+ className: cn(
27751
+ "px-[var(--monkeys-component-navigation-sidebar-content-inline-padding,var(--global-spacing,0.75rem))] pb-2 pt-3",
27752
+ props.classNames?.search
27753
+ ),
27754
+ children: /* @__PURE__ */ jsxs(
27755
+ "div",
27756
+ {
27757
+ className: cn(
27758
+ "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",
27759
+ appearance.searchHeight
27760
+ ),
27761
+ children: [
27762
+ /* @__PURE__ */ jsx(
27763
+ "span",
27764
+ {
27765
+ className: cn(
27766
+ "flex shrink-0",
27767
+ props.classNames?.searchIcon
27768
+ ),
27769
+ "aria-hidden": "true",
27770
+ children: props.search.icon ?? /* @__PURE__ */ jsx(SearchIcon, {})
27771
+ }
27772
+ ),
27773
+ /* @__PURE__ */ jsx(
27774
+ "input",
27775
+ {
27776
+ type: "search",
27777
+ value: resolvedSearchValue,
27778
+ placeholder: props.search.placeholder,
27779
+ "aria-label": props.search.ariaLabel,
27780
+ className: cn(
27781
+ "min-w-0 flex-1 bg-transparent text-sm text-foreground outline-none placeholder:text-muted-foreground",
27782
+ props.classNames?.searchInput
27783
+ ),
27784
+ onChange: (event) => {
27785
+ const nextValue = event.currentTarget.value;
27786
+ if (props.search?.value === void 0)
27787
+ setInternalSearchValue(nextValue);
27788
+ props.search?.onValueChange?.(nextValue);
27789
+ }
27790
+ }
27791
+ ),
27792
+ resolvedSearchValue && props.search.clearLabel ? /* @__PURE__ */ jsx(
27793
+ "button",
27794
+ {
27795
+ type: "button",
27796
+ className: cn(
27797
+ "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",
27798
+ props.classNames?.searchClear
27799
+ ),
27800
+ "aria-label": props.search.clearLabel,
27801
+ title: props.search.clearLabel,
27802
+ onClick: () => {
27803
+ if (props.search?.value === void 0)
27804
+ setInternalSearchValue("");
27805
+ props.search?.onValueChange?.("");
27806
+ },
27807
+ children: /* @__PURE__ */ jsx(ClearIcon, {})
27808
+ }
27809
+ ) : null
27810
+ ]
27724
27811
  }
27725
- }
27726
- ),
27727
- resolvedSearchValue && props.search.clearLabel ? /* @__PURE__ */ jsx(
27728
- "button",
27729
- {
27730
- type: "button",
27731
- className: cn(
27732
- "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",
27733
- props.classNames?.searchClear
27734
- ),
27735
- "aria-label": props.search.clearLabel,
27736
- title: props.search.clearLabel,
27737
- onClick: () => {
27738
- if (props.search?.value === void 0)
27739
- setInternalSearchValue("");
27740
- props.search?.onValueChange?.("");
27741
- },
27742
- children: /* @__PURE__ */ jsx(ClearIcon, {})
27743
- }
27744
- ) : null
27745
- ] }) }) : null,
27812
+ )
27813
+ }
27814
+ ) : null,
27746
27815
  /* @__PURE__ */ jsx(
27747
27816
  "div",
27748
27817
  {
27749
27818
  className: cn(
27750
- "min-h-0 flex-1 overflow-y-auto p-3",
27819
+ "min-h-0 flex-1 overflow-y-auto px-[var(--monkeys-component-navigation-sidebar-content-inline-padding,var(--global-spacing,0.75rem))] py-3",
27751
27820
  resolvedCollapsed && "px-1.5",
27752
27821
  props.classNames?.content
27753
27822
  ),