@flanksource/clicky-ui 0.3.15 → 0.3.17

package/dist/components/MultiSelect.cjs

@@ -53,7 +53,7 @@ function MultiSelect({
     }
     onChange([...value, nextValue]);
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("inline-flex", className), children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("inline-flex min-w-0", className), children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
       button.Button,
       {
@@ -63,14 +63,14 @@ function MultiSelect({
         disabled,
         "aria-label": ariaLabel ?? `${placeholder} filter`,
         className: utils.cn(
-          "w-fit max-w-[15rem] min-w-0 shrink-0 justify-between gap-3 text-left font-normal",
+          "w-fit max-w-[15rem] min-w-0 justify-between gap-3 text-left font-normal",
           triggerClassName,
           value.length === 0 && "text-muted-foreground"
         ),
         ...getReferenceProps(),
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: selected }),
-          /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: open ? UiChevronUp.UiChevronUp : UiChevronDown.UiChevronDown, className: "text-muted-foreground" })
+          /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: open ? UiChevronUp.UiChevronUp : UiChevronDown.UiChevronDown, className: "shrink-0 text-muted-foreground" })
         ]
       }
     ),

package/dist/components/MultiSelect.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.cjs","sources":["../../src/components/MultiSelect.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode, type Ref } from \"react\";\nimport {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  shift,\n  useClick,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport { Button } from \"./button\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiChevronDown, UiChevronUp } from \"../icons\";\nimport { useEscapeLayer, useFloatingZIndex } from \"../overlay/modalStack\";\n\nexport type MultiSelectOption = {\n  /** Stable option value written into the selected value array. */\n  value: string;\n  /** Visible option label in the menu and trigger summary. */\n  label: ReactNode;\n  /** Prevents selecting this option while still showing it in the menu. */\n  disabled?: boolean;\n  /** Optional browser tooltip for truncated or explanatory labels. */\n  title?: string;\n};\n\nexport type MultiSelectProps = {\n  /** Available options, rendered in the order provided. */\n  options: MultiSelectOption[];\n  /** Controlled selected option values. */\n  value: string[];\n  /** Called with the complete next value array after each toggle. */\n  onChange: (next: string[]) => void;\n  /** Trigger text when nothing is selected. Also labels the menu. */\n  placeholder?: string;\n  /** Accessible name for the trigger. Use when the field is labelled\n   *  elsewhere so the trigger doesn't have to borrow `placeholder` for its\n   *  name (which would force a synthesized placeholder). */\n  ariaLabel?: string;\n  /** Disables opening and changing selections. */\n  disabled?: boolean;\n  /** Classes applied to the root wrapper. */\n  className?: string;\n  /** Classes applied to the trigger button. */\n  triggerClassName?: string;\n  /** Classes applied to the popover menu. */\n  menuClassName?: string;\n};\n\nexport function MultiSelect({\n  options,\n  value,\n  onChange,\n  placeholder = \"Select options\",\n  ariaLabel,\n  disabled,\n  className,\n  triggerClassName,\n  menuClassName,\n}: MultiSelectProps) {\n  const [open, setOpen] = useState(false);\n\n  // Portaled (floating-ui) so the menu escapes `overflow` clipping from\n  // scroll-container ancestors, matching Combobox/DropdownMenu.\n  const floatingZ = useFloatingZIndex();\n  const { refs, floatingStyles, context } = useFloating({\n    open,\n    onOpenChange: setOpen,\n    placement: \"bottom-start\",\n    whileElementsMounted: autoUpdate,\n    middleware: [offset(6), flip({ padding: 8 }), shift({ padding: 8 })],\n  });\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useClick(context),\n    useDismiss(context, { escapeKey: false }),\n    useRole(context, { role: \"menu\" }),\n  ]);\n  useEscapeLayer(open, () => {\n    setOpen(false);\n    if (refs.domReference.current instanceof HTMLElement) refs.domReference.current.focus();\n  });\n\n  const selected = useMemo(() => {\n    const selectedOptions = options.filter((option) => value.includes(option.value));\n    const labels = selectedOptions\n      .map((option) => option.label)\n      .filter((label): label is string => typeof label === \"string\");\n\n    if (selectedOptions.length === 0) return placeholder;\n    if (labels.length === 0) return `${selectedOptions.length} selected`;\n    if (labels.length <= 2) return labels.join(\", \");\n    return `${labels.length} selected`;\n  }, [options, placeholder, value]);\n\n  function toggleOption(nextValue: string) {\n    if (value.includes(nextValue)) {\n      onChange(value.filter((current) => current !== nextValue));\n      return;\n    }\n    onChange([...value, nextValue]);\n  }\n\n  return (\n    <div className={cn(\"inline-flex\", className)}>\n      <Button\n        ref={refs.setReference as Ref<HTMLButtonElement>}\n        type=\"button\"\n        variant=\"outline\"\n        disabled={disabled}\n        aria-label={ariaLabel ?? `${placeholder} filter`}\n        className={cn(\n          \"w-fit max-w-[15rem] min-w-0 shrink-0 justify-between gap-3 text-left font-normal\",\n          triggerClassName,\n          value.length === 0 && \"text-muted-foreground\",\n        )}\n        {...getReferenceProps()}\n      >\n        <span className=\"truncate\">{selected}</span>\n        <Icon icon={open ? UiChevronUp : UiChevronDown} className=\"text-muted-foreground\" />\n      </Button>\n      {open && (\n        <FloatingPortal>\n          <FloatingFocusManager context={context} modal={false}>\n            <div\n              ref={refs.setFloating}\n              role=\"menu\"\n              aria-label={placeholder}\n              style={{ ...floatingStyles, zIndex: floatingZ }}\n              className={cn(\n                \"min-w-[14rem] max-w-[20rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n                menuClassName,\n              )}\n              {...getFloatingProps()}\n            >\n          <div className=\"mb-1 flex items-center justify-between gap-2 px-2 py-1 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\">\n            <span>{placeholder}</span>\n            <button\n              type=\"button\"\n              className=\"text-[10px] text-primary disabled:text-muted-foreground\"\n              onClick={() => onChange([])}\n              disabled={value.length === 0}\n            >\n              Clear all\n            </button>\n          </div>\n          <div className=\"max-h-64 overflow-auto\">\n            {options.map((option) => {\n              const checked = value.includes(option.value);\n              return (\n                <label\n                  key={option.value}\n                  className={cn(\n                    \"flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm hover:bg-accent\",\n                    option.disabled && \"cursor-not-allowed opacity-50\",\n                  )}\n                >\n                  <input\n                    type=\"checkbox\"\n                    role=\"menuitemcheckbox\"\n                    className=\"size-4 rounded border border-input\"\n                    checked={checked}\n                    disabled={option.disabled}\n                    onChange={() => toggleOption(option.value)}\n                  />\n                  <span className=\"min-w-0 truncate\">{option.label}</span>\n                </label>\n              );\n            })}\n          </div>\n            </div>\n          </FloatingFocusManager>\n        </FloatingPortal>\n      )}\n    </div>\n  );\n}\n"],"names":["useState","useFloatingZIndex","useFloating","autoUpdate","offset","flip","shift","useInteractions","useClick","useDismiss","useRole","useEscapeLayer","useMemo","cn","jsxs","Button","jsx","Icon","UiChevronUp","UiChevronDown","FloatingPortal","FloatingFocusManager"],"mappings":"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"}
+{"version":3,"file":"MultiSelect.cjs","sources":["../../src/components/MultiSelect.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode, type Ref } from \"react\";\nimport {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  shift,\n  useClick,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport { Button } from \"./button\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiChevronDown, UiChevronUp } from \"../icons\";\nimport { useEscapeLayer, useFloatingZIndex } from \"../overlay/modalStack\";\n\nexport type MultiSelectOption = {\n  /** Stable option value written into the selected value array. */\n  value: string;\n  /** Visible option label in the menu and trigger summary. */\n  label: ReactNode;\n  /** Prevents selecting this option while still showing it in the menu. */\n  disabled?: boolean;\n  /** Optional browser tooltip for truncated or explanatory labels. */\n  title?: string;\n};\n\nexport type MultiSelectProps = {\n  /** Available options, rendered in the order provided. */\n  options: MultiSelectOption[];\n  /** Controlled selected option values. */\n  value: string[];\n  /** Called with the complete next value array after each toggle. */\n  onChange: (next: string[]) => void;\n  /** Trigger text when nothing is selected. Also labels the menu. */\n  placeholder?: string;\n  /** Accessible name for the trigger. Use when the field is labelled\n   *  elsewhere so the trigger doesn't have to borrow `placeholder` for its\n   *  name (which would force a synthesized placeholder). */\n  ariaLabel?: string;\n  /** Disables opening and changing selections. */\n  disabled?: boolean;\n  /** Classes applied to the root wrapper. */\n  className?: string;\n  /** Classes applied to the trigger button. */\n  triggerClassName?: string;\n  /** Classes applied to the popover menu. */\n  menuClassName?: string;\n};\n\nexport function MultiSelect({\n  options,\n  value,\n  onChange,\n  placeholder = \"Select options\",\n  ariaLabel,\n  disabled,\n  className,\n  triggerClassName,\n  menuClassName,\n}: MultiSelectProps) {\n  const [open, setOpen] = useState(false);\n\n  // Portaled (floating-ui) so the menu escapes `overflow` clipping from\n  // scroll-container ancestors, matching Combobox/DropdownMenu.\n  const floatingZ = useFloatingZIndex();\n  const { refs, floatingStyles, context } = useFloating({\n    open,\n    onOpenChange: setOpen,\n    placement: \"bottom-start\",\n    whileElementsMounted: autoUpdate,\n    middleware: [offset(6), flip({ padding: 8 }), shift({ padding: 8 })],\n  });\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useClick(context),\n    useDismiss(context, { escapeKey: false }),\n    useRole(context, { role: \"menu\" }),\n  ]);\n  useEscapeLayer(open, () => {\n    setOpen(false);\n    if (refs.domReference.current instanceof HTMLElement) refs.domReference.current.focus();\n  });\n\n  const selected = useMemo(() => {\n    const selectedOptions = options.filter((option) => value.includes(option.value));\n    const labels = selectedOptions\n      .map((option) => option.label)\n      .filter((label): label is string => typeof label === \"string\");\n\n    if (selectedOptions.length === 0) return placeholder;\n    if (labels.length === 0) return `${selectedOptions.length} selected`;\n    if (labels.length <= 2) return labels.join(\", \");\n    return `${labels.length} selected`;\n  }, [options, placeholder, value]);\n\n  function toggleOption(nextValue: string) {\n    if (value.includes(nextValue)) {\n      onChange(value.filter((current) => current !== nextValue));\n      return;\n    }\n    onChange([...value, nextValue]);\n  }\n\n  // `min-w-0` here, and a shrinkable trigger below, let the summary ellipsize\n  // inside a width-capped flex parent (a FilterBar chip) rather than overflow\n  // onto its neighbour.\n  return (\n    <div className={cn(\"inline-flex min-w-0\", className)}>\n      <Button\n        ref={refs.setReference as Ref<HTMLButtonElement>}\n        type=\"button\"\n        variant=\"outline\"\n        disabled={disabled}\n        aria-label={ariaLabel ?? `${placeholder} filter`}\n        className={cn(\n          \"w-fit max-w-[15rem] min-w-0 justify-between gap-3 text-left font-normal\",\n          triggerClassName,\n          value.length === 0 && \"text-muted-foreground\",\n        )}\n        {...getReferenceProps()}\n      >\n        <span className=\"truncate\">{selected}</span>\n        <Icon icon={open ? UiChevronUp : UiChevronDown} className=\"shrink-0 text-muted-foreground\" />\n      </Button>\n      {open && (\n        <FloatingPortal>\n          <FloatingFocusManager context={context} modal={false}>\n            <div\n              ref={refs.setFloating}\n              role=\"menu\"\n              aria-label={placeholder}\n              style={{ ...floatingStyles, zIndex: floatingZ }}\n              className={cn(\n                \"min-w-[14rem] max-w-[20rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n                menuClassName,\n              )}\n              {...getFloatingProps()}\n            >\n          <div className=\"mb-1 flex items-center justify-between gap-2 px-2 py-1 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\">\n            <span>{placeholder}</span>\n            <button\n              type=\"button\"\n              className=\"text-[10px] text-primary disabled:text-muted-foreground\"\n              onClick={() => onChange([])}\n              disabled={value.length === 0}\n            >\n              Clear all\n            </button>\n          </div>\n          <div className=\"max-h-64 overflow-auto\">\n            {options.map((option) => {\n              const checked = value.includes(option.value);\n              return (\n                <label\n                  key={option.value}\n                  className={cn(\n                    \"flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm hover:bg-accent\",\n                    option.disabled && \"cursor-not-allowed opacity-50\",\n                  )}\n                >\n                  <input\n                    type=\"checkbox\"\n                    role=\"menuitemcheckbox\"\n                    className=\"size-4 rounded border border-input\"\n                    checked={checked}\n                    disabled={option.disabled}\n                    onChange={() => toggleOption(option.value)}\n                  />\n                  <span className=\"min-w-0 truncate\">{option.label}</span>\n                </label>\n              );\n            })}\n          </div>\n            </div>\n          </FloatingFocusManager>\n        </FloatingPortal>\n      )}\n    </div>\n  );\n}\n"],"names":["useState","useFloatingZIndex","useFloating","autoUpdate","offset","flip","shift","useInteractions","useClick","useDismiss","useRole","useEscapeLayer","useMemo","cn","jsxs","Button","jsx","Icon","UiChevronUp","UiChevronDown","FloatingPortal","FloatingFocusManager"],"mappings":"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"}

package/dist/components/MultiSelect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../src/components/MultiSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAoBpE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,iEAAiE;IACjE,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,KAAK,EAAE,SAAS,CAAC;IACjB,yEAAyE;IACzE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,yDAAyD;IACzD,OAAO,EAAE,iBAAiB,EAAE,CAAC;IAC7B,yCAAyC;IACzC,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,mEAAmE;IACnE,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnC,mEAAmE;IACnE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;8DAE0D;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6CAA6C;IAC7C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,2CAA2C;IAC3C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAA8B,EAC9B,SAAS,EACT,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,aAAa,GACd,EAAE,gBAAgB,2CAoHlB"}
+{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../src/components/MultiSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAoBpE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,iEAAiE;IACjE,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,KAAK,EAAE,SAAS,CAAC;IACjB,yEAAyE;IACzE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,yDAAyD;IACzD,OAAO,EAAE,iBAAiB,EAAE,CAAC;IAC7B,yCAAyC;IACzC,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,mEAAmE;IACnE,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnC,mEAAmE;IACnE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;8DAE0D;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6CAA6C;IAC7C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,2CAA2C;IAC3C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAA8B,EAC9B,SAAS,EACT,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,aAAa,GACd,EAAE,gBAAgB,2CAuHlB"}

package/dist/components/MultiSelect.js

@@ -51,7 +51,7 @@ function MultiSelect({
     }
     onChange([...value, nextValue]);
   }
-  return /* @__PURE__ */ jsxs("div", { className: cn("inline-flex", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("inline-flex min-w-0", className), children: [
     /* @__PURE__ */ jsxs(
       Button,
       {
@@ -61,14 +61,14 @@ function MultiSelect({
         disabled,
         "aria-label": ariaLabel ?? `${placeholder} filter`,
         className: cn(
-          "w-fit max-w-[15rem] min-w-0 shrink-0 justify-between gap-3 text-left font-normal",
+          "w-fit max-w-[15rem] min-w-0 justify-between gap-3 text-left font-normal",
           triggerClassName,
           value.length === 0 && "text-muted-foreground"
         ),
         ...getReferenceProps(),
         children: [
           /* @__PURE__ */ jsx("span", { className: "truncate", children: selected }),
-          /* @__PURE__ */ jsx(Icon, { icon: open ? UiChevronUp : UiChevronDown, className: "text-muted-foreground" })
+          /* @__PURE__ */ jsx(Icon, { icon: open ? UiChevronUp : UiChevronDown, className: "shrink-0 text-muted-foreground" })
         ]
       }
     ),

package/dist/components/MultiSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.js","sources":["../../src/components/MultiSelect.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode, type Ref } from \"react\";\nimport {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  shift,\n  useClick,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport { Button } from \"./button\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiChevronDown, UiChevronUp } from \"../icons\";\nimport { useEscapeLayer, useFloatingZIndex } from \"../overlay/modalStack\";\n\nexport type MultiSelectOption = {\n  /** Stable option value written into the selected value array. */\n  value: string;\n  /** Visible option label in the menu and trigger summary. */\n  label: ReactNode;\n  /** Prevents selecting this option while still showing it in the menu. */\n  disabled?: boolean;\n  /** Optional browser tooltip for truncated or explanatory labels. */\n  title?: string;\n};\n\nexport type MultiSelectProps = {\n  /** Available options, rendered in the order provided. */\n  options: MultiSelectOption[];\n  /** Controlled selected option values. */\n  value: string[];\n  /** Called with the complete next value array after each toggle. */\n  onChange: (next: string[]) => void;\n  /** Trigger text when nothing is selected. Also labels the menu. */\n  placeholder?: string;\n  /** Accessible name for the trigger. Use when the field is labelled\n   *  elsewhere so the trigger doesn't have to borrow `placeholder` for its\n   *  name (which would force a synthesized placeholder). */\n  ariaLabel?: string;\n  /** Disables opening and changing selections. */\n  disabled?: boolean;\n  /** Classes applied to the root wrapper. */\n  className?: string;\n  /** Classes applied to the trigger button. */\n  triggerClassName?: string;\n  /** Classes applied to the popover menu. */\n  menuClassName?: string;\n};\n\nexport function MultiSelect({\n  options,\n  value,\n  onChange,\n  placeholder = \"Select options\",\n  ariaLabel,\n  disabled,\n  className,\n  triggerClassName,\n  menuClassName,\n}: MultiSelectProps) {\n  const [open, setOpen] = useState(false);\n\n  // Portaled (floating-ui) so the menu escapes `overflow` clipping from\n  // scroll-container ancestors, matching Combobox/DropdownMenu.\n  const floatingZ = useFloatingZIndex();\n  const { refs, floatingStyles, context } = useFloating({\n    open,\n    onOpenChange: setOpen,\n    placement: \"bottom-start\",\n    whileElementsMounted: autoUpdate,\n    middleware: [offset(6), flip({ padding: 8 }), shift({ padding: 8 })],\n  });\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useClick(context),\n    useDismiss(context, { escapeKey: false }),\n    useRole(context, { role: \"menu\" }),\n  ]);\n  useEscapeLayer(open, () => {\n    setOpen(false);\n    if (refs.domReference.current instanceof HTMLElement) refs.domReference.current.focus();\n  });\n\n  const selected = useMemo(() => {\n    const selectedOptions = options.filter((option) => value.includes(option.value));\n    const labels = selectedOptions\n      .map((option) => option.label)\n      .filter((label): label is string => typeof label === \"string\");\n\n    if (selectedOptions.length === 0) return placeholder;\n    if (labels.length === 0) return `${selectedOptions.length} selected`;\n    if (labels.length <= 2) return labels.join(\", \");\n    return `${labels.length} selected`;\n  }, [options, placeholder, value]);\n\n  function toggleOption(nextValue: string) {\n    if (value.includes(nextValue)) {\n      onChange(value.filter((current) => current !== nextValue));\n      return;\n    }\n    onChange([...value, nextValue]);\n  }\n\n  return (\n    <div className={cn(\"inline-flex\", className)}>\n      <Button\n        ref={refs.setReference as Ref<HTMLButtonElement>}\n        type=\"button\"\n        variant=\"outline\"\n        disabled={disabled}\n        aria-label={ariaLabel ?? `${placeholder} filter`}\n        className={cn(\n          \"w-fit max-w-[15rem] min-w-0 shrink-0 justify-between gap-3 text-left font-normal\",\n          triggerClassName,\n          value.length === 0 && \"text-muted-foreground\",\n        )}\n        {...getReferenceProps()}\n      >\n        <span className=\"truncate\">{selected}</span>\n        <Icon icon={open ? UiChevronUp : UiChevronDown} className=\"text-muted-foreground\" />\n      </Button>\n      {open && (\n        <FloatingPortal>\n          <FloatingFocusManager context={context} modal={false}>\n            <div\n              ref={refs.setFloating}\n              role=\"menu\"\n              aria-label={placeholder}\n              style={{ ...floatingStyles, zIndex: floatingZ }}\n              className={cn(\n                \"min-w-[14rem] max-w-[20rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n                menuClassName,\n              )}\n              {...getFloatingProps()}\n            >\n          <div className=\"mb-1 flex items-center justify-between gap-2 px-2 py-1 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\">\n            <span>{placeholder}</span>\n            <button\n              type=\"button\"\n              className=\"text-[10px] text-primary disabled:text-muted-foreground\"\n              onClick={() => onChange([])}\n              disabled={value.length === 0}\n            >\n              Clear all\n            </button>\n          </div>\n          <div className=\"max-h-64 overflow-auto\">\n            {options.map((option) => {\n              const checked = value.includes(option.value);\n              return (\n                <label\n                  key={option.value}\n                  className={cn(\n                    \"flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm hover:bg-accent\",\n                    option.disabled && \"cursor-not-allowed opacity-50\",\n                  )}\n                >\n                  <input\n                    type=\"checkbox\"\n                    role=\"menuitemcheckbox\"\n                    className=\"size-4 rounded border border-input\"\n                    checked={checked}\n                    disabled={option.disabled}\n                    onChange={() => toggleOption(option.value)}\n                  />\n                  <span className=\"min-w-0 truncate\">{option.label}</span>\n                </label>\n              );\n            })}\n          </div>\n            </div>\n          </FloatingFocusManager>\n        </FloatingPortal>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"MultiSelect.js","sources":["../../src/components/MultiSelect.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode, type Ref } from \"react\";\nimport {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  shift,\n  useClick,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport { Button } from \"./button\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiChevronDown, UiChevronUp } from \"../icons\";\nimport { useEscapeLayer, useFloatingZIndex } from \"../overlay/modalStack\";\n\nexport type MultiSelectOption = {\n  /** Stable option value written into the selected value array. */\n  value: string;\n  /** Visible option label in the menu and trigger summary. */\n  label: ReactNode;\n  /** Prevents selecting this option while still showing it in the menu. */\n  disabled?: boolean;\n  /** Optional browser tooltip for truncated or explanatory labels. */\n  title?: string;\n};\n\nexport type MultiSelectProps = {\n  /** Available options, rendered in the order provided. */\n  options: MultiSelectOption[];\n  /** Controlled selected option values. */\n  value: string[];\n  /** Called with the complete next value array after each toggle. */\n  onChange: (next: string[]) => void;\n  /** Trigger text when nothing is selected. Also labels the menu. */\n  placeholder?: string;\n  /** Accessible name for the trigger. Use when the field is labelled\n   *  elsewhere so the trigger doesn't have to borrow `placeholder` for its\n   *  name (which would force a synthesized placeholder). */\n  ariaLabel?: string;\n  /** Disables opening and changing selections. */\n  disabled?: boolean;\n  /** Classes applied to the root wrapper. */\n  className?: string;\n  /** Classes applied to the trigger button. */\n  triggerClassName?: string;\n  /** Classes applied to the popover menu. */\n  menuClassName?: string;\n};\n\nexport function MultiSelect({\n  options,\n  value,\n  onChange,\n  placeholder = \"Select options\",\n  ariaLabel,\n  disabled,\n  className,\n  triggerClassName,\n  menuClassName,\n}: MultiSelectProps) {\n  const [open, setOpen] = useState(false);\n\n  // Portaled (floating-ui) so the menu escapes `overflow` clipping from\n  // scroll-container ancestors, matching Combobox/DropdownMenu.\n  const floatingZ = useFloatingZIndex();\n  const { refs, floatingStyles, context } = useFloating({\n    open,\n    onOpenChange: setOpen,\n    placement: \"bottom-start\",\n    whileElementsMounted: autoUpdate,\n    middleware: [offset(6), flip({ padding: 8 }), shift({ padding: 8 })],\n  });\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useClick(context),\n    useDismiss(context, { escapeKey: false }),\n    useRole(context, { role: \"menu\" }),\n  ]);\n  useEscapeLayer(open, () => {\n    setOpen(false);\n    if (refs.domReference.current instanceof HTMLElement) refs.domReference.current.focus();\n  });\n\n  const selected = useMemo(() => {\n    const selectedOptions = options.filter((option) => value.includes(option.value));\n    const labels = selectedOptions\n      .map((option) => option.label)\n      .filter((label): label is string => typeof label === \"string\");\n\n    if (selectedOptions.length === 0) return placeholder;\n    if (labels.length === 0) return `${selectedOptions.length} selected`;\n    if (labels.length <= 2) return labels.join(\", \");\n    return `${labels.length} selected`;\n  }, [options, placeholder, value]);\n\n  function toggleOption(nextValue: string) {\n    if (value.includes(nextValue)) {\n      onChange(value.filter((current) => current !== nextValue));\n      return;\n    }\n    onChange([...value, nextValue]);\n  }\n\n  // `min-w-0` here, and a shrinkable trigger below, let the summary ellipsize\n  // inside a width-capped flex parent (a FilterBar chip) rather than overflow\n  // onto its neighbour.\n  return (\n    <div className={cn(\"inline-flex min-w-0\", className)}>\n      <Button\n        ref={refs.setReference as Ref<HTMLButtonElement>}\n        type=\"button\"\n        variant=\"outline\"\n        disabled={disabled}\n        aria-label={ariaLabel ?? `${placeholder} filter`}\n        className={cn(\n          \"w-fit max-w-[15rem] min-w-0 justify-between gap-3 text-left font-normal\",\n          triggerClassName,\n          value.length === 0 && \"text-muted-foreground\",\n        )}\n        {...getReferenceProps()}\n      >\n        <span className=\"truncate\">{selected}</span>\n        <Icon icon={open ? UiChevronUp : UiChevronDown} className=\"shrink-0 text-muted-foreground\" />\n      </Button>\n      {open && (\n        <FloatingPortal>\n          <FloatingFocusManager context={context} modal={false}>\n            <div\n              ref={refs.setFloating}\n              role=\"menu\"\n              aria-label={placeholder}\n              style={{ ...floatingStyles, zIndex: floatingZ }}\n              className={cn(\n                \"min-w-[14rem] max-w-[20rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n                menuClassName,\n              )}\n              {...getFloatingProps()}\n            >\n          <div className=\"mb-1 flex items-center justify-between gap-2 px-2 py-1 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\">\n            <span>{placeholder}</span>\n            <button\n              type=\"button\"\n              className=\"text-[10px] text-primary disabled:text-muted-foreground\"\n              onClick={() => onChange([])}\n              disabled={value.length === 0}\n            >\n              Clear all\n            </button>\n          </div>\n          <div className=\"max-h-64 overflow-auto\">\n            {options.map((option) => {\n              const checked = value.includes(option.value);\n              return (\n                <label\n                  key={option.value}\n                  className={cn(\n                    \"flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm hover:bg-accent\",\n                    option.disabled && \"cursor-not-allowed opacity-50\",\n                  )}\n                >\n                  <input\n                    type=\"checkbox\"\n                    role=\"menuitemcheckbox\"\n                    className=\"size-4 rounded border border-input\"\n                    checked={checked}\n                    disabled={option.disabled}\n                    onChange={() => toggleOption(option.value)}\n                  />\n                  <span className=\"min-w-0 truncate\">{option.label}</span>\n                </label>\n              );\n            })}\n          </div>\n            </div>\n          </FloatingFocusManager>\n        </FloatingPortal>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/SecretKeySelector.cjs

@@ -5,8 +5,14 @@ const react = require("react");
 const mi = require("@flanksource/icons/mi");
 const utils = require("../lib/utils.cjs");
 const Combobox = require("./Combobox.cjs");
+const iconMenuPicker = require("./icon-menu-picker.cjs");
 const UiEdit = require("../icons/components/UiEdit.cjs");
 const DEFAULT_SOURCES = ["secret", "configmap", "value"];
+const SHRINKABLE_FIELD = "max-w-full min-w-0 shrink";
+const SOURCE_FIELD = `${SHRINKABLE_FIELD} basis-40 grow-0`;
+const RESOURCE_FIELD = `${SHRINKABLE_FIELD} basis-40 grow-0`;
+const KEY_FIELD = `${SHRINKABLE_FIELD} basis-72 grow`;
+const VALUE_FIELD = `${SHRINKABLE_FIELD} basis-64 grow`;
 function SecretKeySelector({
   value,
   onChange,
@@ -89,8 +95,11 @@ function SecretKeySelector({
     }
   };
   const setName = (name) => {
-    if (isServiceAccount) return onChange(name ? { kind: "serviceaccount", name } : void 0);
-    return onChange(name ? { kind: refKind, name, key: selectedKey } : void 0);
+    if (isServiceAccount)
+      return onChange(name ? { kind: "serviceaccount", name } : void 0);
+    return onChange(
+      name ? { kind: refKind, name, key: selectedKey } : void 0
+    );
   };
   const setKey = (key) => selectedName ? onChange({ kind: refKind, name: selectedName, key }) : void 0;
   const setLiteral = (v) => onChange({ kind: "value", value: v });
@@ -103,80 +112,144 @@ function SecretKeySelector({
     })),
     [sourceList]
   );
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("flex flex-wrap items-center gap-2", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[9.5rem] shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(
-      Combobox.Combobox,
-      {
-        ariaLabel: "Secret value source",
-        options: sourceOptions,
-        value: source,
-        onChange: (next) => setSource(next),
-        allowCustomValue: false,
-        required: true
-      }
-    ) }),
-    isLiteral ? /* @__PURE__ */ jsxRuntime.jsx(
-      TextField,
-      {
-        value: literalValue,
-        onChange: setLiteral,
-        placeholder: "Static value…",
-        ariaLabel: "Static value"
-      }
-    ) : isOnePassword ? /* @__PURE__ */ jsxRuntime.jsx(
-      TextField,
-      {
-        value: opRef,
-        onChange: setOpRef,
-        placeholder: "op://vault/item/field",
-        ariaLabel: "1Password reference",
-        mono: true
-      }
-    ) : isServiceAccount ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-[1_1_16rem]", "data-slot": "secret-serviceaccount-field", children: /* @__PURE__ */ jsxRuntime.jsx(
-      Combobox.Combobox,
-      {
-        options: nameOptions,
-        value: selectedName,
-        onChange: setName,
-        allowCustomValue: true,
-        loading: resourcesLoading,
-        invalid: nameInvalid,
-        placeholder: "Service account…"
-      }
-    ) }) : /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: "grid min-w-0 flex-[1_1_18rem] grid-cols-[minmax(8rem,11rem)_minmax(8rem,1fr)] items-center gap-2",
-        "data-slot": "secret-reference-fields",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0", children: /* @__PURE__ */ jsxRuntime.jsx(
-            Combobox.Combobox,
-            {
-              options: nameOptions,
-              value: selectedName,
-              onChange: setName,
-              allowCustomValue: true,
-              loading: resourcesLoading,
-              invalid: nameInvalid,
-              placeholder: `Select ${refKind}…`
-            }
-          ) }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0", children: /* @__PURE__ */ jsxRuntime.jsx(
-            Combobox.Combobox,
-            {
-              options: keyOptions,
-              value: selectedKey,
-              onChange: setKey,
-              allowCustomValue: true,
-              loading: previewLoading,
-              invalid: keyInvalid,
-              placeholder: selectedName ? keyPlaceholder(refKind) : "—"
-            }
-          ) })
-        ]
-      }
-    )
-  ] });
+  const sourceMenuOptions = react.useMemo(
+    () => sourceList.map((kind) => ({
+      value: kind,
+      label: SOURCE_LABEL[kind],
+      icon: SOURCE_ICON[kind]
+    })),
+    [sourceList]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "secret-key-selector",
+      className: utils.cn("@container w-full min-w-0", className),
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: "flex w-full max-w-full min-w-0 flex-nowrap items-center gap-2",
+          "data-slot": "secret-fields",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: utils.cn(SOURCE_FIELD, "@max-md:hidden"),
+                "data-slot": "secret-source-combobox",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  Combobox.Combobox,
+                  {
+                    ariaLabel: "Secret value source",
+                    options: sourceOptions,
+                    value: source,
+                    onChange: (next) => setSource(next),
+                    allowCustomValue: false,
+                    required: true
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: "hidden shrink-0 @max-md:!block",
+                "data-slot": "secret-source-menu",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  iconMenuPicker.IconMenuPicker,
+                  {
+                    value: source,
+                    onChange: setSource,
+                    options: sourceMenuOptions,
+                    ariaLabel: "Secret value source",
+                    triggerClassName: "size-control-h rounded-md border border-input bg-background"
+                  }
+                )
+              }
+            ),
+            isLiteral ? /* @__PURE__ */ jsxRuntime.jsx(
+              TextField,
+              {
+                value: literalValue,
+                onChange: setLiteral,
+                placeholder: "Static value…",
+                ariaLabel: "Static value"
+              }
+            ) : isOnePassword ? /* @__PURE__ */ jsxRuntime.jsx(
+              TextField,
+              {
+                value: opRef,
+                onChange: setOpRef,
+                placeholder: "op://vault/item/field",
+                ariaLabel: "1Password reference",
+                mono: true
+              }
+            ) : isServiceAccount ? /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: VALUE_FIELD,
+                "data-slot": "secret-serviceaccount-field",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  Combobox.Combobox,
+                  {
+                    options: nameOptions,
+                    value: selectedName,
+                    onChange: setName,
+                    allowCustomValue: true,
+                    loading: resourcesLoading,
+                    invalid: nameInvalid,
+                    placeholder: "Service account…"
+                  }
+                )
+              }
+            ) : /* @__PURE__ */ jsxRuntime.jsxs(
+              "div",
+              {
+                className: utils.cn(
+                  "flex flex-nowrap items-center gap-2",
+                  SHRINKABLE_FIELD,
+                  "grow"
+                ),
+                "data-slot": "secret-reference-fields",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      className: RESOURCE_FIELD,
+                      "data-slot": "secret-resource-field",
+                      children: /* @__PURE__ */ jsxRuntime.jsx(
+                        Combobox.Combobox,
+                        {
+                          options: nameOptions,
+                          value: selectedName,
+                          onChange: setName,
+                          allowCustomValue: true,
+                          loading: resourcesLoading,
+                          invalid: nameInvalid,
+                          placeholder: `Select ${refKind}…`
+                        }
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: KEY_FIELD, "data-slot": "secret-key-field", children: /* @__PURE__ */ jsxRuntime.jsx(
+                    Combobox.Combobox,
+                    {
+                      options: keyOptions,
+                      value: selectedKey,
+                      onChange: setKey,
+                      allowCustomValue: true,
+                      loading: previewLoading,
+                      invalid: keyInvalid,
+                      placeholder: selectedName ? keyPlaceholder(refKind) : "—"
+                    }
+                  ) })
+                ]
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
 }
 function TextField({
   value,
@@ -185,7 +258,7 @@ function TextField({
   ariaLabel,
   mono
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-[1_1_16rem]", "data-slot": "secret-value-fields", children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: VALUE_FIELD, "data-slot": "secret-value-fields", children: /* @__PURE__ */ jsxRuntime.jsx(
     "input",
     {
       type: "text",

package/dist/components/SecretKeySelector.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SecretKeySelector.cjs","sources":["../../src/components/SecretKeySelector.tsx"],"sourcesContent":["import { createElement, useEffect, useMemo, useState } from \"react\";\nimport {\n  K8SSecret,\n  K8SConfigmap,\n  Helm,\n  K8SServiceaccount,\n  Vault,\n} from \"@flanksource/icons/mi\";\nimport { type StaticIconComponent } from \"../data/Icon\";\nimport { cn } from \"../lib/utils\";\nimport { UiEdit } from \"../icons\";\nimport { Combobox, type ComboboxOption } from \"./Combobox\";\n\n// SecretKeySelector picks how a credential is sourced and lowers the choice into\n// a single reference string the consumer persists. It supports Kubernetes\n// Secrets and ConfigMaps (name + key), Helm release values (name + jsonpath\n// key), a service-account token (name only), a 1Password reference\n// (op://vault/item/field), and a static inline \"Value\". It is presentational:\n// it fetches nothing — the consumer supplies async `loadResources` /\n// `loadKeyPreview` (for keyed kinds) and optional `loadServiceAccounts` getters.\n\n/** Kinds that reference a named resource plus one of its keys. */\nexport type SecretKind = \"secret\" | \"configmap\" | \"helm\";\n\n/** Every source the picker can emit, including the non-keyed ones. */\nexport type SecretValueSource = SecretKind | \"serviceaccount\" | \"onepassword\" | \"value\";\n\n/** One key's mid-masked preview. `value` is already masked by the consumer. */\nexport type KeyPreview = { key: string; value: string };\n\n/**\n * The selector's value: a {kind,name,key} reference into a Secret / ConfigMap /\n * Helm release, a service-account token by name, a 1Password op:// reference, or\n * a static inline literal.\n */\nexport type SecretKeyValue =\n  | { kind: SecretKind; name: string; key: string }\n  | { kind: \"serviceaccount\"; name: string }\n  | { kind: \"onepassword\"; ref: string }\n  | { kind: \"value\"; value: string };\n\n/** A named secret/configmap/helm-release and its data key names (values never returned). */\nexport type SecretResource = { name: string; keys?: string[] };\n\nexport type SecretKeySelectorProps = {\n  value: SecretKeyValue | undefined;\n  onChange: (next: SecretKeyValue | undefined) => void;\n  /** Loads the named keyed kind's resources (name + data key names). */\n  loadResources: (kind: SecretKind) => Promise<SecretResource[]>;\n  /** Loads mid-masked previews for the named keyed resource's keys. */\n  loadKeyPreview: (kind: SecretKind, name: string) => Promise<KeyPreview[]>;\n  /**\n   * Loads the service-account names (no keys) for the \"serviceaccount\" source.\n   * When omitted, that source's name field accepts freeform entry only.\n   */\n  loadServiceAccounts?: () => Promise<SecretResource[]>;\n  /**\n   * The sources offered in the picker, in order. Defaults to\n   * `[\"secret\", \"configmap\", \"value\"]` (or drops \"value\" when `allowLiteral` is\n   * false). Pass an explicit list to offer helm / serviceaccount / onepassword.\n   */\n  sources?: SecretValueSource[];\n  /**\n   * Shorthand honoured only when `sources` is not supplied: `false` drops the\n   * inline \"Value\" source, leaving Secret/ConfigMap. Ignored when `sources` is\n   * given.\n   */\n  allowLiteral?: boolean;\n  /**\n   * When true, a chosen name absent from the loaded resources, or a key absent\n   * from the chosen keyed resource's keys, is flagged invalid (once the load\n   * settles). The onepassword and literal sources are never strict-flagged.\n   */\n  strict?: boolean;\n  className?: string;\n};\n\nconst DEFAULT_SOURCES: SecretValueSource[] = [\"secret\", \"configmap\", \"value\"];\n\nexport function SecretKeySelector({\n  value,\n  onChange,\n  loadResources,\n  loadKeyPreview,\n  loadServiceAccounts,\n  sources,\n  allowLiteral = true,\n  strict = false,\n  className,\n}: SecretKeySelectorProps) {\n  const sourceList = useMemo<SecretValueSource[]>(\n    () => sources ?? (allowLiteral ? DEFAULT_SOURCES : [\"secret\", \"configmap\"]),\n    [sources, allowLiteral],\n  );\n\n  const source: SecretValueSource = value?.kind ?? sourceList[0] ?? \"secret\";\n  const isKeyed = source === \"secret\" || source === \"configmap\" || source === \"helm\";\n  const isServiceAccount = source === \"serviceaccount\";\n  const isOnePassword = source === \"onepassword\";\n  const isLiteral = source === \"value\";\n  // A keyed source's refKind drives the loaders; other sources default to \"secret\".\n  const refKind: SecretKind = isKeyed ? (source as SecretKind) : \"secret\";\n\n  const selectedName =\n    value && (value.kind === \"serviceaccount\" || isRefKind(value)) ? value.name : \"\";\n  const selectedKey = value && isRefKind(value) ? value.key : \"\";\n  const literalValue = value && value.kind === \"value\" ? value.value : \"\";\n  const opRef = value && value.kind === \"onepassword\" ? value.ref : \"\";\n\n  const [resources, setResources] = useState<SecretResource[]>([]);\n  const [resourcesLoading, setResourcesLoading] = useState(false);\n  const [previews, setPreviews] = useState<KeyPreview[]>([]);\n  const [previewLoading, setPreviewLoading] = useState(false);\n\n  // Load the name list for keyed kinds (secret/configmap/helm) and, when a\n  // loader is supplied, for the serviceaccount source. Other sources list nothing.\n  useEffect(() => {\n    const loader = isKeyed\n      ? () => loadResources(refKind)\n      : isServiceAccount && loadServiceAccounts\n        ? loadServiceAccounts\n        : null;\n    if (!loader) {\n      setResources([]);\n      return;\n    }\n    let cancelled = false;\n    setResourcesLoading(true);\n    loader()\n      .then((res) => !cancelled && setResources(res))\n      .finally(() => !cancelled && setResourcesLoading(false));\n    return () => {\n      cancelled = true;\n    };\n  }, [loadResources, loadServiceAccounts, refKind, isKeyed, isServiceAccount]);\n\n  useEffect(() => {\n    if (!isKeyed || !selectedName) {\n      setPreviews([]);\n      return;\n    }\n    let cancelled = false;\n    setPreviewLoading(true);\n    loadKeyPreview(refKind, selectedName)\n      .then((res) => !cancelled && setPreviews(res))\n      .catch(() => !cancelled && setPreviews([]))\n      .finally(() => !cancelled && setPreviewLoading(false));\n    return () => {\n      cancelled = true;\n    };\n  }, [loadKeyPreview, refKind, selectedName, isKeyed]);\n\n  const nameOptions = useMemo<ComboboxOption[]>(\n    () => resources.map((r) => ({ value: r.name, label: r.name })),\n    [resources],\n  );\n  const selectedResource = useMemo(\n    () => resources.find((r) => r.name === selectedName),\n    [resources, selectedName],\n  );\n  const keyOptions = useMemo(\n    () => buildKeyOptions(selectedResource?.keys ?? [], previews, selectedKey),\n    [selectedResource, selectedKey, previews],\n  );\n\n  // Strict validity: the name is invalid when it names no loaded resource; the\n  // key is invalid when, with a resolved resource, it isn't one of that\n  // resource's keys. Only names from a listed source are checked (a\n  // serviceaccount source with no loader lists nothing, so it never flags).\n  const listsNames = isKeyed || (isServiceAccount && !!loadServiceAccounts);\n  const nameInvalid = strict && listsNames && !!selectedName && !resourcesLoading && !selectedResource;\n  const keyInvalid =\n    strict &&\n    isKeyed &&\n    !!selectedKey &&\n    !!selectedResource &&\n    !resourcesLoading &&\n    !(selectedResource.keys ?? []).includes(selectedKey);\n\n  const setSource = (next: SecretValueSource) => {\n    switch (next) {\n      case \"value\":\n        return onChange({ kind: \"value\", value: \"\" });\n      case \"onepassword\":\n        return onChange({ kind: \"onepassword\", ref: \"\" });\n      case \"serviceaccount\":\n        return onChange({ kind: \"serviceaccount\", name: \"\" });\n      default:\n        return onChange({ kind: next, name: \"\", key: \"\" });\n    }\n  };\n  const setName = (name: string) => {\n    if (isServiceAccount) return onChange(name ? { kind: \"serviceaccount\", name } : undefined);\n    return onChange(name ? { kind: refKind, name, key: selectedKey } : undefined);\n  };\n  const setKey = (key: string) =>\n    selectedName ? onChange({ kind: refKind, name: selectedName, key }) : undefined;\n  const setLiteral = (v: string) => onChange({ kind: \"value\", value: v });\n  const setOpRef = (v: string) => onChange({ kind: \"onepassword\", ref: v });\n\n  const sourceOptions = useMemo<ComboboxOption[]>(\n    () =>\n      sourceList.map((k) => ({\n        value: k,\n        label: SOURCE_LABEL[k],\n        icon: createElement(SOURCE_ICON[k], { className: \"size-4\" }),\n      })),\n    [sourceList],\n  );\n\n  return (\n    <div className={cn(\"flex flex-wrap items-center gap-2\", className)}>\n      <div className=\"w-[9.5rem] shrink-0\">\n        <Combobox\n          ariaLabel=\"Secret value source\"\n          options={sourceOptions}\n          value={source}\n          onChange={(next) => setSource(next as SecretValueSource)}\n          allowCustomValue={false}\n          required\n        />\n      </div>\n      {isLiteral ? (\n        <TextField\n          value={literalValue}\n          onChange={setLiteral}\n          placeholder=\"Static value…\"\n          ariaLabel=\"Static value\"\n        />\n      ) : isOnePassword ? (\n        <TextField\n          value={opRef}\n          onChange={setOpRef}\n          placeholder=\"op://vault/item/field\"\n          ariaLabel=\"1Password reference\"\n          mono\n        />\n      ) : isServiceAccount ? (\n        <div className=\"min-w-0 flex-[1_1_16rem]\" data-slot=\"secret-serviceaccount-field\">\n          <Combobox\n            options={nameOptions}\n            value={selectedName}\n            onChange={setName}\n            allowCustomValue\n            loading={resourcesLoading}\n            invalid={nameInvalid}\n            placeholder=\"Service account…\"\n          />\n        </div>\n      ) : (\n        <div\n          className=\"grid min-w-0 flex-[1_1_18rem] grid-cols-[minmax(8rem,11rem)_minmax(8rem,1fr)] items-center gap-2\"\n          data-slot=\"secret-reference-fields\"\n        >\n          <div className=\"min-w-0\">\n            <Combobox\n              options={nameOptions}\n              value={selectedName}\n              onChange={setName}\n              allowCustomValue\n              loading={resourcesLoading}\n              invalid={nameInvalid}\n              placeholder={`Select ${refKind}…`}\n            />\n          </div>\n          <div className=\"min-w-0\">\n            <Combobox\n              options={keyOptions}\n              value={selectedKey}\n              onChange={setKey}\n              allowCustomValue\n              loading={previewLoading}\n              invalid={keyInvalid}\n              placeholder={selectedName ? keyPlaceholder(refKind) : \"—\"}\n            />\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n\n// TextField is the shared single-input surface for the literal and 1Password\n// sources (no resource list backs either).\nfunction TextField({\n  value,\n  onChange,\n  placeholder,\n  ariaLabel,\n  mono,\n}: {\n  value: string;\n  onChange: (v: string) => void;\n  placeholder: string;\n  ariaLabel: string;\n  mono?: boolean;\n}) {\n  return (\n    <div className=\"min-w-0 flex-[1_1_16rem]\" data-slot=\"secret-value-fields\">\n      <input\n        type=\"text\"\n        value={value}\n        onChange={(e) => onChange(e.target.value)}\n        placeholder={placeholder}\n        aria-label={ariaLabel}\n        className={cn(\n          \"h-control-h w-full min-w-0 rounded border border-input bg-background px-control-px text-sm\",\n          \"outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n          mono && \"font-mono\",\n        )}\n      />\n    </div>\n  );\n}\n\n// isRefKind narrows to the keyed variants that carry both a name and a key.\nfunction isRefKind(\n  v: SecretKeyValue,\n): v is { kind: SecretKind; name: string; key: string } {\n  return v.kind === \"secret\" || v.kind === \"configmap\" || v.kind === \"helm\";\n}\n\n// keyPlaceholder hints the key field: helm keys are jsonpath expressions into\n// the merged release values, the others are literal data keys.\nfunction keyPlaceholder(kind: SecretKind): string {\n  return kind === \"helm\" ? \"jsonpath…\" : \"Key…\";\n}\n\n// Each source's leading glyph. The flanksource FCs carry static metadata that\n// doesn't unify with ComponentType, so type the slot as a plain render function.\nconst SOURCE_ICON: Record<SecretValueSource, StaticIconComponent> = {\n  secret: K8SSecret,\n  configmap: K8SConfigmap,\n  helm: Helm,\n  serviceaccount: K8SServiceaccount,\n  onepassword: Vault,\n  value: UiEdit,\n};\n\nconst SOURCE_LABEL: Record<SecretValueSource, string> = {\n  secret: \"Secret\",\n  configmap: \"ConfigMap\",\n  helm: \"Helm\",\n  serviceaccount: \"Service Account\",\n  onepassword: \"1Password\",\n  value: \"Value\",\n};\n\n// buildKeyOptions labels each key with its mid-masked preview value when one is\n// available. A selected key absent from the list is pinned so the selection\n// stays visible.\nfunction buildKeyOptions(\n  keys: string[],\n  previews: KeyPreview[],\n  selectedKey: string,\n): ComboboxOption[] {\n  const masked = new Map(previews.map((p) => [p.key, p.value]));\n  const base = keys.map((k) => ({\n    value: k,\n    label: masked.has(k) ? `${k} — ${masked.get(k)}` : k,\n  }));\n  if (selectedKey && !base.some((o) => o.value === selectedKey)) {\n    return [{ value: selectedKey, label: selectedKey }, ...base];\n  }\n  return base;\n}\n"],"names":["useMemo","useState","useEffect","createElement","cn","jsx","Combobox","jsxs","K8SSecret","K8SConfigmap","Helm","K8SServiceaccount","Vault","UiEdit"],"mappings":"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"}
+{"version":3,"file":"SecretKeySelector.cjs","sources":["../../src/components/SecretKeySelector.tsx"],"sourcesContent":["import { createElement, useEffect, useMemo, useState } from \"react\";\nimport {\n  K8SSecret,\n  K8SConfigmap,\n  Helm,\n  K8SServiceaccount,\n  Vault,\n} from \"@flanksource/icons/mi\";\nimport { type StaticIconComponent } from \"../data/Icon\";\nimport { cn } from \"../lib/utils\";\nimport { UiEdit } from \"../icons\";\nimport { Combobox, type ComboboxOption } from \"./Combobox\";\nimport { IconMenuPicker, type IconMenuOption } from \"./icon-menu-picker\";\n\n// SecretKeySelector picks how a credential is sourced and lowers the choice into\n// a single reference string the consumer persists. It supports Kubernetes\n// Secrets and ConfigMaps (name + key), Helm release values (name + jsonpath\n// key), a service-account token (name only), a 1Password reference\n// (op://vault/item/field), and a static inline \"Value\". It is presentational:\n// it fetches nothing — the consumer supplies async `loadResources` /\n// `loadKeyPreview` (for keyed kinds) and optional `loadServiceAccounts` getters.\n\n/** Kinds that reference a named resource plus one of its keys. */\nexport type SecretKind = \"secret\" | \"configmap\" | \"helm\";\n\n/** Every source the picker can emit, including the non-keyed ones. */\nexport type SecretValueSource =\n  | SecretKind\n  | \"serviceaccount\"\n  | \"onepassword\"\n  | \"value\";\n\n/** One key's mid-masked preview. `value` is already masked by the consumer. */\nexport type KeyPreview = { key: string; value: string };\n\n/**\n * The selector's value: a {kind,name,key} reference into a Secret / ConfigMap /\n * Helm release, a service-account token by name, a 1Password op:// reference, or\n * a static inline literal.\n */\nexport type SecretKeyValue =\n  | { kind: SecretKind; name: string; key: string }\n  | { kind: \"serviceaccount\"; name: string }\n  | { kind: \"onepassword\"; ref: string }\n  | { kind: \"value\"; value: string };\n\n/** A named secret/configmap/helm-release and its data key names (values never returned). */\nexport type SecretResource = { name: string; keys?: string[] };\n\nexport type SecretKeySelectorProps = {\n  value: SecretKeyValue | undefined;\n  onChange: (next: SecretKeyValue | undefined) => void;\n  /** Loads the named keyed kind's resources (name + data key names). */\n  loadResources: (kind: SecretKind) => Promise<SecretResource[]>;\n  /** Loads mid-masked previews for the named keyed resource's keys. */\n  loadKeyPreview: (kind: SecretKind, name: string) => Promise<KeyPreview[]>;\n  /**\n   * Loads the service-account names (no keys) for the \"serviceaccount\" source.\n   * When omitted, that source's name field accepts freeform entry only.\n   */\n  loadServiceAccounts?: () => Promise<SecretResource[]>;\n  /**\n   * The sources offered in the picker, in order. Defaults to\n   * `[\"secret\", \"configmap\", \"value\"]` (or drops \"value\" when `allowLiteral` is\n   * false). Pass an explicit list to offer helm / serviceaccount / onepassword.\n   */\n  sources?: SecretValueSource[];\n  /**\n   * Shorthand honoured only when `sources` is not supplied: `false` drops the\n   * inline \"Value\" source, leaving Secret/ConfigMap. Ignored when `sources` is\n   * given.\n   */\n  allowLiteral?: boolean;\n  /**\n   * When true, a chosen name absent from the loaded resources, or a key absent\n   * from the chosen keyed resource's keys, is flagged invalid (once the load\n   * settles). The onepassword and literal sources are never strict-flagged.\n   */\n  strict?: boolean;\n  className?: string;\n};\n\nconst DEFAULT_SOURCES: SecretValueSource[] = [\"secret\", \"configmap\", \"value\"];\n\nconst SHRINKABLE_FIELD = \"max-w-full min-w-0 shrink\";\nconst SOURCE_FIELD = `${SHRINKABLE_FIELD} basis-40 grow-0`;\nconst RESOURCE_FIELD = `${SHRINKABLE_FIELD} basis-40 grow-0`;\nconst KEY_FIELD = `${SHRINKABLE_FIELD} basis-72 grow`;\nconst VALUE_FIELD = `${SHRINKABLE_FIELD} basis-64 grow`;\n\nexport function SecretKeySelector({\n  value,\n  onChange,\n  loadResources,\n  loadKeyPreview,\n  loadServiceAccounts,\n  sources,\n  allowLiteral = true,\n  strict = false,\n  className,\n}: SecretKeySelectorProps) {\n  const sourceList = useMemo<SecretValueSource[]>(\n    () => sources ?? (allowLiteral ? DEFAULT_SOURCES : [\"secret\", \"configmap\"]),\n    [sources, allowLiteral],\n  );\n\n  const source: SecretValueSource = value?.kind ?? sourceList[0] ?? \"secret\";\n  const isKeyed =\n    source === \"secret\" || source === \"configmap\" || source === \"helm\";\n  const isServiceAccount = source === \"serviceaccount\";\n  const isOnePassword = source === \"onepassword\";\n  const isLiteral = source === \"value\";\n  // A keyed source's refKind drives the loaders; other sources default to \"secret\".\n  const refKind: SecretKind = isKeyed ? (source as SecretKind) : \"secret\";\n\n  const selectedName =\n    value && (value.kind === \"serviceaccount\" || isRefKind(value))\n      ? value.name\n      : \"\";\n  const selectedKey = value && isRefKind(value) ? value.key : \"\";\n  const literalValue = value && value.kind === \"value\" ? value.value : \"\";\n  const opRef = value && value.kind === \"onepassword\" ? value.ref : \"\";\n\n  const [resources, setResources] = useState<SecretResource[]>([]);\n  const [resourcesLoading, setResourcesLoading] = useState(false);\n  const [previews, setPreviews] = useState<KeyPreview[]>([]);\n  const [previewLoading, setPreviewLoading] = useState(false);\n\n  // Load the name list for keyed kinds (secret/configmap/helm) and, when a\n  // loader is supplied, for the serviceaccount source. Other sources list nothing.\n  useEffect(() => {\n    const loader = isKeyed\n      ? () => loadResources(refKind)\n      : isServiceAccount && loadServiceAccounts\n        ? loadServiceAccounts\n        : null;\n    if (!loader) {\n      setResources([]);\n      return;\n    }\n    let cancelled = false;\n    setResourcesLoading(true);\n    loader()\n      .then((res) => !cancelled && setResources(res))\n      .finally(() => !cancelled && setResourcesLoading(false));\n    return () => {\n      cancelled = true;\n    };\n  }, [loadResources, loadServiceAccounts, refKind, isKeyed, isServiceAccount]);\n\n  useEffect(() => {\n    if (!isKeyed || !selectedName) {\n      setPreviews([]);\n      return;\n    }\n    let cancelled = false;\n    setPreviewLoading(true);\n    loadKeyPreview(refKind, selectedName)\n      .then((res) => !cancelled && setPreviews(res))\n      .catch(() => !cancelled && setPreviews([]))\n      .finally(() => !cancelled && setPreviewLoading(false));\n    return () => {\n      cancelled = true;\n    };\n  }, [loadKeyPreview, refKind, selectedName, isKeyed]);\n\n  const nameOptions = useMemo<ComboboxOption[]>(\n    () => resources.map((r) => ({ value: r.name, label: r.name })),\n    [resources],\n  );\n  const selectedResource = useMemo(\n    () => resources.find((r) => r.name === selectedName),\n    [resources, selectedName],\n  );\n  const keyOptions = useMemo(\n    () => buildKeyOptions(selectedResource?.keys ?? [], previews, selectedKey),\n    [selectedResource, selectedKey, previews],\n  );\n\n  // Strict validity: the name is invalid when it names no loaded resource; the\n  // key is invalid when, with a resolved resource, it isn't one of that\n  // resource's keys. Only names from a listed source are checked (a\n  // serviceaccount source with no loader lists nothing, so it never flags).\n  const listsNames = isKeyed || (isServiceAccount && !!loadServiceAccounts);\n  const nameInvalid =\n    strict &&\n    listsNames &&\n    !!selectedName &&\n    !resourcesLoading &&\n    !selectedResource;\n  const keyInvalid =\n    strict &&\n    isKeyed &&\n    !!selectedKey &&\n    !!selectedResource &&\n    !resourcesLoading &&\n    !(selectedResource.keys ?? []).includes(selectedKey);\n\n  const setSource = (next: SecretValueSource) => {\n    switch (next) {\n      case \"value\":\n        return onChange({ kind: \"value\", value: \"\" });\n      case \"onepassword\":\n        return onChange({ kind: \"onepassword\", ref: \"\" });\n      case \"serviceaccount\":\n        return onChange({ kind: \"serviceaccount\", name: \"\" });\n      default:\n        return onChange({ kind: next, name: \"\", key: \"\" });\n    }\n  };\n  const setName = (name: string) => {\n    if (isServiceAccount)\n      return onChange(name ? { kind: \"serviceaccount\", name } : undefined);\n    return onChange(\n      name ? { kind: refKind, name, key: selectedKey } : undefined,\n    );\n  };\n  const setKey = (key: string) =>\n    selectedName\n      ? onChange({ kind: refKind, name: selectedName, key })\n      : undefined;\n  const setLiteral = (v: string) => onChange({ kind: \"value\", value: v });\n  const setOpRef = (v: string) => onChange({ kind: \"onepassword\", ref: v });\n\n  const sourceOptions = useMemo<ComboboxOption[]>(\n    () =>\n      sourceList.map((k) => ({\n        value: k,\n        label: SOURCE_LABEL[k],\n        icon: createElement(SOURCE_ICON[k], { className: \"size-4\" }),\n      })),\n    [sourceList],\n  );\n  const sourceMenuOptions = useMemo<IconMenuOption<SecretValueSource>[]>(\n    () =>\n      sourceList.map((kind) => ({\n        value: kind,\n        label: SOURCE_LABEL[kind],\n        icon: SOURCE_ICON[kind],\n      })),\n    [sourceList],\n  );\n\n  return (\n    <div\n      data-slot=\"secret-key-selector\"\n      className={cn(\"@container w-full min-w-0\", className)}\n    >\n      <div\n        className=\"flex w-full max-w-full min-w-0 flex-nowrap items-center gap-2\"\n        data-slot=\"secret-fields\"\n      >\n        <div\n          className={cn(SOURCE_FIELD, \"@max-md:hidden\")}\n          data-slot=\"secret-source-combobox\"\n        >\n          <Combobox\n            ariaLabel=\"Secret value source\"\n            options={sourceOptions}\n            value={source}\n            onChange={(next) => setSource(next as SecretValueSource)}\n            allowCustomValue={false}\n            required\n          />\n        </div>\n        <div\n          className=\"hidden shrink-0 @max-md:!block\"\n          data-slot=\"secret-source-menu\"\n        >\n          <IconMenuPicker\n            value={source}\n            onChange={setSource}\n            options={sourceMenuOptions}\n            ariaLabel=\"Secret value source\"\n            triggerClassName=\"size-control-h rounded-md border border-input bg-background\"\n          />\n        </div>\n        {isLiteral ? (\n          <TextField\n            value={literalValue}\n            onChange={setLiteral}\n            placeholder=\"Static value…\"\n            ariaLabel=\"Static value\"\n          />\n        ) : isOnePassword ? (\n          <TextField\n            value={opRef}\n            onChange={setOpRef}\n            placeholder=\"op://vault/item/field\"\n            ariaLabel=\"1Password reference\"\n            mono\n          />\n        ) : isServiceAccount ? (\n          <div\n            className={VALUE_FIELD}\n            data-slot=\"secret-serviceaccount-field\"\n          >\n            <Combobox\n              options={nameOptions}\n              value={selectedName}\n              onChange={setName}\n              allowCustomValue\n              loading={resourcesLoading}\n              invalid={nameInvalid}\n              placeholder=\"Service account…\"\n            />\n          </div>\n        ) : (\n          <div\n            className={cn(\n              \"flex flex-nowrap items-center gap-2\",\n              SHRINKABLE_FIELD,\n              \"grow\",\n            )}\n            data-slot=\"secret-reference-fields\"\n          >\n            <div\n              className={RESOURCE_FIELD}\n              data-slot=\"secret-resource-field\"\n            >\n              <Combobox\n                options={nameOptions}\n                value={selectedName}\n                onChange={setName}\n                allowCustomValue\n                loading={resourcesLoading}\n                invalid={nameInvalid}\n                placeholder={`Select ${refKind}…`}\n              />\n            </div>\n            <div className={KEY_FIELD} data-slot=\"secret-key-field\">\n              <Combobox\n                options={keyOptions}\n                value={selectedKey}\n                onChange={setKey}\n                allowCustomValue\n                loading={previewLoading}\n                invalid={keyInvalid}\n                placeholder={selectedName ? keyPlaceholder(refKind) : \"—\"}\n              />\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\n// TextField is the shared single-input surface for the literal and 1Password\n// sources (no resource list backs either).\nfunction TextField({\n  value,\n  onChange,\n  placeholder,\n  ariaLabel,\n  mono,\n}: {\n  value: string;\n  onChange: (v: string) => void;\n  placeholder: string;\n  ariaLabel: string;\n  mono?: boolean;\n}) {\n  return (\n    <div className={VALUE_FIELD} data-slot=\"secret-value-fields\">\n      <input\n        type=\"text\"\n        value={value}\n        onChange={(e) => onChange(e.target.value)}\n        placeholder={placeholder}\n        aria-label={ariaLabel}\n        className={cn(\n          \"h-control-h w-full min-w-0 rounded border border-input bg-background px-control-px text-sm\",\n          \"outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n          mono && \"font-mono\",\n        )}\n      />\n    </div>\n  );\n}\n\n// isRefKind narrows to the keyed variants that carry both a name and a key.\nfunction isRefKind(\n  v: SecretKeyValue,\n): v is { kind: SecretKind; name: string; key: string } {\n  return v.kind === \"secret\" || v.kind === \"configmap\" || v.kind === \"helm\";\n}\n\n// keyPlaceholder hints the key field: helm keys are jsonpath expressions into\n// the merged release values, the others are literal data keys.\nfunction keyPlaceholder(kind: SecretKind): string {\n  return kind === \"helm\" ? \"jsonpath…\" : \"Key…\";\n}\n\n// Each source's leading glyph. The flanksource FCs carry static metadata that\n// doesn't unify with ComponentType, so type the slot as a plain render function.\nconst SOURCE_ICON: Record<SecretValueSource, StaticIconComponent> = {\n  secret: K8SSecret,\n  configmap: K8SConfigmap,\n  helm: Helm,\n  serviceaccount: K8SServiceaccount,\n  onepassword: Vault,\n  value: UiEdit,\n};\n\nconst SOURCE_LABEL: Record<SecretValueSource, string> = {\n  secret: \"Secret\",\n  configmap: \"ConfigMap\",\n  helm: \"Helm\",\n  serviceaccount: \"Service Account\",\n  onepassword: \"1Password\",\n  value: \"Value\",\n};\n\n// buildKeyOptions labels each key with its mid-masked preview value when one is\n// available. A selected key absent from the list is pinned so the selection\n// stays visible.\nfunction buildKeyOptions(\n  keys: string[],\n  previews: KeyPreview[],\n  selectedKey: string,\n): ComboboxOption[] {\n  const masked = new Map(previews.map((p) => [p.key, p.value]));\n  const base = keys.map((k) => ({\n    value: k,\n    label: masked.has(k) ? `${k} — ${masked.get(k)}` : k,\n  }));\n  if (selectedKey && !base.some((o) => o.value === selectedKey)) {\n    return [{ value: selectedKey, label: selectedKey }, ...base];\n  }\n  return base;\n}\n"],"names":["useMemo","useState","useEffect","createElement","jsx","cn","jsxs","Combobox","IconMenuPicker","K8SSecret","K8SConfigmap","Helm","K8SServiceaccount","Vault","UiEdit"],"mappings":"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"}

package/dist/components/SecretKeySelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SecretKeySelector.d.ts","sourceRoot":"","sources":["../../src/components/SecretKeySelector.tsx"],"names":[],"mappings":"AAqBA,kEAAkE;AAClE,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,WAAW,GAAG,MAAM,CAAC;AAEzD,sEAAsE;AACtE,MAAM,MAAM,iBAAiB,GAAG,UAAU,GAAG,gBAAgB,GAAG,aAAa,GAAG,OAAO,CAAC;AAExF,+EAA+E;AAC/E,MAAM,MAAM,UAAU,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAExD;;;;GAIG;AACH,MAAM,MAAM,cAAc,GACtB;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAC/C;IAAE,IAAI,EAAE,gBAAgB,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GACxC;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GACpC;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAErC,4FAA4F;AAC5F,MAAM,MAAM,cAAc,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;CAAE,CAAC;AAE/D,MAAM,MAAM,sBAAsB,GAAG;IACnC,KAAK,EAAE,cAAc,GAAG,SAAS,CAAC;IAClC,QAAQ,EAAE,CAAC,IAAI,EAAE,cAAc,GAAG,SAAS,KAAK,IAAI,CAAC;IACrD,sEAAsE;IACtE,aAAa,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,OAAO,CAAC,cAAc,EAAE,CAAC,CAAC;IAC/D,qEAAqE;IACrE,cAAc,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,UAAU,EAAE,CAAC,CAAC;IAC1E;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC,cAAc,EAAE,CAAC,CAAC;IACtD;;;;OAIG;IACH,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC9B;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAIF,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,OAAO,EACP,YAAmB,EACnB,MAAc,EACd,SAAS,GACV,EAAE,sBAAsB,2CA+LxB"}
+{"version":3,"file":"SecretKeySelector.d.ts","sourceRoot":"","sources":["../../src/components/SecretKeySelector.tsx"],"names":[],"mappings":"AAsBA,kEAAkE;AAClE,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,WAAW,GAAG,MAAM,CAAC;AAEzD,sEAAsE;AACtE,MAAM,MAAM,iBAAiB,GACzB,UAAU,GACV,gBAAgB,GAChB,aAAa,GACb,OAAO,CAAC;AAEZ,+EAA+E;AAC/E,MAAM,MAAM,UAAU,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAExD;;;;GAIG;AACH,MAAM,MAAM,cAAc,GACtB;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAC/C;IAAE,IAAI,EAAE,gBAAgB,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,GACxC;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GACpC;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAErC,4FAA4F;AAC5F,MAAM,MAAM,cAAc,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;CAAE,CAAC;AAE/D,MAAM,MAAM,sBAAsB,GAAG;IACnC,KAAK,EAAE,cAAc,GAAG,SAAS,CAAC;IAClC,QAAQ,EAAE,CAAC,IAAI,EAAE,cAAc,GAAG,SAAS,KAAK,IAAI,CAAC;IACrD,sEAAsE;IACtE,aAAa,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,OAAO,CAAC,cAAc,EAAE,CAAC,CAAC;IAC/D,qEAAqE;IACrE,cAAc,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,UAAU,EAAE,CAAC,CAAC;IAC1E;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC,cAAc,EAAE,CAAC,CAAC;IACtD;;;;OAIG;IACH,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC9B;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAUF,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,OAAO,EACP,YAAmB,EACnB,MAAc,EACd,SAAS,GACV,EAAE,sBAAsB,2CAsPxB"}