@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.
@@ -525,7 +525,13 @@ function mergeStyles(...sources) {
525
525
  );
526
526
  }
527
527
  function getPresetDefaults(preset) {
528
- return presetDefaults[preset] ?? presetDefaults.default;
528
+ const defaults = presetDefaults[preset];
529
+ if (!defaults) {
530
+ throw new TypeError(
531
+ `Unknown Data Explorer theme preset "${String(preset)}". Expected one of: ${Object.keys(presetDefaults).join(", ")}.`
532
+ );
533
+ }
534
+ return defaults;
529
535
  }
530
536
  function resolveDataExplorerAppearance(appearance) {
531
537
  const preset = appearance?.preset ?? "default";
@@ -3251,7 +3257,46 @@ function resolveAppearance(appearance) {
3251
3257
  surface === "outlined" && "border-border bg-background text-foreground shadow-none"
3252
3258
  ),
3253
3259
  itemHeight: density === "compact" ? "min-h-9" : density === "comfortable" ? "min-h-14" : "min-h-11",
3254
- itemPadding: density === "compact" ? "px-2 py-1.5" : density === "comfortable" ? "px-3 py-3" : "px-3 py-2"
3260
+ itemPadding: density === "compact" ? "px-2 py-1.5" : density === "comfortable" ? "px-3 py-3" : "px-3 py-2",
3261
+ searchHeight: density === "compact" ? "h-8" : density === "comfortable" ? "h-10" : "h-9"
3262
+ };
3263
+ }
3264
+ 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)))]";
3265
+ 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)))]";
3266
+ var navigationTreeNestedControlClassName = "hover:!bg-transparent hover:!text-inherit focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
3267
+ function resolveNavigationTreeClassNames(classNames) {
3268
+ return {
3269
+ ...classNames,
3270
+ groupHeader: cn(navigationTreeRowHoverClassName, classNames?.groupHeader),
3271
+ itemSelected: cn(
3272
+ navigationTreeRowSelectedClassName,
3273
+ classNames?.itemSelected
3274
+ ),
3275
+ nodeButton: cn(
3276
+ navigationTreeRowHoverClassName,
3277
+ "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)))]",
3278
+ classNames?.nodeButton
3279
+ ),
3280
+ expander: cn(
3281
+ navigationTreeNestedControlClassName,
3282
+ classNames?.expander
3283
+ ),
3284
+ nodeToggle: cn(
3285
+ navigationTreeNestedControlClassName,
3286
+ classNames?.nodeToggle
3287
+ ),
3288
+ groupActions: cn(
3289
+ navigationTreeNestedControlClassName,
3290
+ classNames?.groupActions
3291
+ ),
3292
+ nodeActions: cn(
3293
+ navigationTreeNestedControlClassName,
3294
+ classNames?.nodeActions
3295
+ ),
3296
+ nodeDragHandle: cn(
3297
+ navigationTreeNestedControlClassName,
3298
+ classNames?.nodeDragHandle
3299
+ )
3255
3300
  };
3256
3301
  }
3257
3302
  function EntryButton({
@@ -3874,7 +3919,13 @@ function NavigationSidebarInner(props, ref) {
3874
3919
  );
3875
3920
  }
3876
3921
  const treeProps = props.tree;
3877
- return /* @__PURE__ */ jsxRuntime.jsx(DataExplorerViewTree, { ...treeProps });
3922
+ return /* @__PURE__ */ jsxRuntime.jsx(
3923
+ DataExplorerViewTree,
3924
+ {
3925
+ ...treeProps,
3926
+ classNames: resolveNavigationTreeClassNames(treeProps.classNames)
3927
+ }
3928
+ );
3878
3929
  };
3879
3930
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3880
3931
  /* @__PURE__ */ jsxRuntime.jsxs(
@@ -3970,61 +4021,79 @@ function NavigationSidebarInner(props, ref) {
3970
4021
  ]
3971
4022
  }
3972
4023
  ) : null,
3973
- !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: [
3974
- /* @__PURE__ */ jsxRuntime.jsx(
3975
- "span",
3976
- {
3977
- className: cn(
3978
- "flex shrink-0",
3979
- props.classNames?.searchIcon
3980
- ),
3981
- "aria-hidden": "true",
3982
- children: props.search.icon ?? /* @__PURE__ */ jsxRuntime.jsx(SearchIcon, {})
3983
- }
3984
- ),
3985
- /* @__PURE__ */ jsxRuntime.jsx(
3986
- "input",
3987
- {
3988
- type: "search",
3989
- value: resolvedSearchValue,
3990
- placeholder: props.search.placeholder,
3991
- "aria-label": props.search.ariaLabel,
3992
- className: cn(
3993
- "min-w-0 flex-1 bg-transparent text-sm text-foreground outline-none placeholder:text-muted-foreground",
3994
- props.classNames?.searchInput
3995
- ),
3996
- onChange: (event) => {
3997
- const nextValue = event.currentTarget.value;
3998
- if (props.search?.value === void 0)
3999
- setInternalSearchValue(nextValue);
4000
- props.search?.onValueChange?.(nextValue);
4024
+ !resolvedCollapsed && props.search ? /* @__PURE__ */ jsxRuntime.jsx(
4025
+ "div",
4026
+ {
4027
+ className: cn(
4028
+ "px-[var(--monkeys-component-navigation-sidebar-content-inline-padding,var(--global-spacing,0.75rem))] pb-2 pt-3",
4029
+ props.classNames?.search
4030
+ ),
4031
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
4032
+ "div",
4033
+ {
4034
+ className: cn(
4035
+ "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",
4036
+ appearance.searchHeight
4037
+ ),
4038
+ children: [
4039
+ /* @__PURE__ */ jsxRuntime.jsx(
4040
+ "span",
4041
+ {
4042
+ className: cn(
4043
+ "flex shrink-0",
4044
+ props.classNames?.searchIcon
4045
+ ),
4046
+ "aria-hidden": "true",
4047
+ children: props.search.icon ?? /* @__PURE__ */ jsxRuntime.jsx(SearchIcon, {})
4048
+ }
4049
+ ),
4050
+ /* @__PURE__ */ jsxRuntime.jsx(
4051
+ "input",
4052
+ {
4053
+ type: "search",
4054
+ value: resolvedSearchValue,
4055
+ placeholder: props.search.placeholder,
4056
+ "aria-label": props.search.ariaLabel,
4057
+ className: cn(
4058
+ "min-w-0 flex-1 bg-transparent text-sm text-foreground outline-none placeholder:text-muted-foreground",
4059
+ props.classNames?.searchInput
4060
+ ),
4061
+ onChange: (event) => {
4062
+ const nextValue = event.currentTarget.value;
4063
+ if (props.search?.value === void 0)
4064
+ setInternalSearchValue(nextValue);
4065
+ props.search?.onValueChange?.(nextValue);
4066
+ }
4067
+ }
4068
+ ),
4069
+ resolvedSearchValue && props.search.clearLabel ? /* @__PURE__ */ jsxRuntime.jsx(
4070
+ "button",
4071
+ {
4072
+ type: "button",
4073
+ className: cn(
4074
+ "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",
4075
+ props.classNames?.searchClear
4076
+ ),
4077
+ "aria-label": props.search.clearLabel,
4078
+ title: props.search.clearLabel,
4079
+ onClick: () => {
4080
+ if (props.search?.value === void 0)
4081
+ setInternalSearchValue("");
4082
+ props.search?.onValueChange?.("");
4083
+ },
4084
+ children: /* @__PURE__ */ jsxRuntime.jsx(ClearIcon, {})
4085
+ }
4086
+ ) : null
4087
+ ]
4001
4088
  }
4002
- }
4003
- ),
4004
- resolvedSearchValue && props.search.clearLabel ? /* @__PURE__ */ jsxRuntime.jsx(
4005
- "button",
4006
- {
4007
- type: "button",
4008
- className: cn(
4009
- "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",
4010
- props.classNames?.searchClear
4011
- ),
4012
- "aria-label": props.search.clearLabel,
4013
- title: props.search.clearLabel,
4014
- onClick: () => {
4015
- if (props.search?.value === void 0)
4016
- setInternalSearchValue("");
4017
- props.search?.onValueChange?.("");
4018
- },
4019
- children: /* @__PURE__ */ jsxRuntime.jsx(ClearIcon, {})
4020
- }
4021
- ) : null
4022
- ] }) }) : null,
4089
+ )
4090
+ }
4091
+ ) : null,
4023
4092
  /* @__PURE__ */ jsxRuntime.jsx(
4024
4093
  "div",
4025
4094
  {
4026
4095
  className: cn(
4027
- "min-h-0 flex-1 overflow-y-auto p-3",
4096
+ "min-h-0 flex-1 overflow-y-auto px-[var(--monkeys-component-navigation-sidebar-content-inline-padding,var(--global-spacing,0.75rem))] py-3",
4028
4097
  resolvedCollapsed && "px-1.5",
4029
4098
  props.classNames?.content
4030
4099
  ),