@flanksource/clicky-ui 0.3.18 → 0.3.19

package/dist/components/ComboboxMenu.cjs

@@ -124,7 +124,11 @@ function ComboboxMenu({
                         )
                       }
                     ),
-                    /* @__PURE__ */ jsxRuntime.jsx(ComboboxOptionText, { option })
+                    /* @__PURE__ */ jsxRuntime.jsx(ComboboxOptionText, { option }),
+                    option.trailing != null && // Capped and truncating rather than `shrink-0`: in a menu
+                    // clamped by the viewport edge the label is what identifies
+                    // the option, so the preview yields first.
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto min-w-0 max-w-[55%] truncate pl-2 text-right text-xs text-muted-foreground", children: option.trailing })
                   ] })
                 }
               )

package/dist/components/ComboboxMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxMenu.cjs","sources":["../../src/components/ComboboxMenu.tsx"],"sourcesContent":["import { Fragment, type ReactNode, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { FilterPill } from \"../data/FilterPill\";\nimport { Icon, LabelIcon } from \"../data/Icon\";\nimport { UiCheck } from \"../icons\";\nimport { cn } from \"../lib/utils\";\nimport type {\n  ComboboxOption,\n  ComboboxTriStateMode,\n} from \"./combobox-types\";\nimport type { ComboboxMenuPosition } from \"./combobox-utils\";\n\nexport function ComboboxMenu({\n  customEntry,\n  filtered,\n  floatingZ,\n  footer,\n  highlighted,\n  isSelected,\n  listId,\n  listRef,\n  loading,\n  menuPos,\n  modes,\n  multiple,\n  onHighlight,\n  onSelect,\n  onSetMode,\n  tristate,\n}: {\n  customEntry: ComboboxOption | null;\n  filtered: ComboboxOption[];\n  floatingZ: number;\n  footer: ReactNode;\n  highlighted: number;\n  isSelected: (value: string) => boolean;\n  listId: string | undefined;\n  listRef: RefObject<HTMLDivElement>;\n  loading: boolean | undefined;\n  menuPos: ComboboxMenuPosition;\n  modes: Record<string, ComboboxTriStateMode>;\n  multiple: boolean;\n  onHighlight: (index: number) => void;\n  onSelect: (option: ComboboxOption) => void;\n  onSetMode: (value: string, mode: string) => void;\n  tristate: boolean;\n}) {\n  return createPortal(\n    <div\n      id={listId}\n      ref={listRef}\n      role=\"listbox\"\n      aria-multiselectable={multiple || undefined}\n      style={{\n        position: \"fixed\",\n        ...(menuPos.top != null\n          ? { top: menuPos.top }\n          : { bottom: menuPos.bottom }),\n        left: menuPos.left,\n        minWidth: menuPos.width,\n        maxWidth: menuPos.maxWidth,\n        maxHeight: menuPos.maxHeight,\n        zIndex: floatingZ,\n      }}\n      className=\"w-max overflow-auto rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\"\n    >\n      {loading && filtered.length === 0 && (\n        <div className=\"px-2 py-4 text-center text-sm text-muted-foreground\">\n          Loading…\n        </div>\n      )}\n      {!loading && filtered.length === 0 && !customEntry && (\n        <div className=\"px-2 py-4 text-center text-sm text-muted-foreground\">\n          No results\n        </div>\n      )}\n      {filtered.map((option, index) => {\n        const selected = isSelected(option.value);\n        const mode = tristate ? modes[option.value] : undefined;\n        const showHeader =\n          option.group != null &&\n          option.group !== filtered[index - 1]?.group;\n        return (\n          <Fragment key={option.value}>\n            {showHeader && (\n              <div\n                role=\"presentation\"\n                className=\"select-none px-2 pb-1 pt-2 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\"\n              >\n                {option.group}\n              </div>\n            )}\n            <div\n              id={listId ? `${listId}-${index}` : undefined}\n              role=\"option\"\n              aria-selected={tristate ? mode != null : selected}\n              aria-disabled={option.disabled}\n              {...(mode != null\n                ? {\n                    \"aria-label\": `${option.label}, ${\n                      mode === \"include\" ? \"included\" : \"excluded\"\n                    }`,\n                  }\n                : {})}\n              {...(option.title !== undefined ? { title: option.title } : {})}\n              {...(tristate\n                ? { \"data-filter-option\": option.value }\n                : {})}\n              onMouseDown={(event) => {\n                event.preventDefault();\n                if (!tristate && !option.disabled) onSelect(option);\n              }}\n              {...(tristate\n                ? {\n                    onClick: () => {\n                      if (!option.disabled) onSelect(option);\n                    },\n                  }\n                : {})}\n              onMouseEnter={() => onHighlight(index)}\n              className={cn(\n                \"flex cursor-pointer gap-2 rounded-sm px-2 py-1.5 text-sm\",\n                option.description ? \"items-start\" : \"items-center\",\n                index === highlighted && \"bg-accent\",\n                selected && !tristate && \"font-medium\",\n                option.disabled && \"cursor-not-allowed opacity-50\",\n              )}\n            >\n              {tristate ? (\n                <div className=\"min-w-0 flex-1\">\n                  <FilterPill\n                    mode={mode ?? \"neutral\"}\n                    togglePosition=\"right\"\n                    interactive={false}\n                    label={option.label}\n                    onModeChange={(next) => onSetMode(option.value, next)}\n                    className=\"w-full justify-between\"\n                  />\n                  <ComboboxOptionDescription description={option.description} />\n                </div>\n              ) : (\n                <>\n                  <Icon\n                    icon={UiCheck}\n                    className={cn(\n                      \"shrink-0 text-xs\",\n                      option.description && \"mt-1\",\n                      selected ? \"opacity-100\" : \"opacity-0\",\n                    )}\n                  />\n                  <LabelIcon\n                    icon={option.icon}\n                    className={cn(\n                      \"text-sm text-muted-foreground\",\n                      option.description && \"mt-1\",\n                    )}\n                  />\n                  <ComboboxOptionText option={option} />\n                </>\n              )}\n            </div>\n          </Fragment>\n        );\n      })}\n      {customEntry && (\n        <div\n          id={listId ? `${listId}-${filtered.length}` : undefined}\n          role=\"option\"\n          aria-selected={false}\n          data-filter-add-custom={customEntry.value}\n          title={customEntry.title}\n          onMouseDown={(event) => event.preventDefault()}\n          onClick={() => onSelect(customEntry)}\n          onMouseEnter={() => onHighlight(filtered.length)}\n          className={cn(\n            \"flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-primary\",\n            highlighted === filtered.length && \"bg-accent\",\n          )}\n        >\n          <LabelIcon\n            icon={customEntry.icon}\n            className=\"text-sm text-muted-foreground\"\n          />\n          <span className=\"min-w-0 truncate\">{customEntry.label}</span>\n        </div>\n      )}\n      {footer != null && (\n        <div className=\"select-none px-2 py-1.5 text-[11px] text-muted-foreground\">\n          {footer}\n        </div>\n      )}\n    </div>,\n    document.body,\n  );\n}\n\nfunction ComboboxOptionText({ option }: { option: ComboboxOption }) {\n  return (\n    <span className=\"min-w-0 flex-1\">\n      <span className=\"block truncate\">{option.label}</span>\n      <ComboboxOptionDescription description={option.description} />\n    </span>\n  );\n}\n\nfunction ComboboxOptionDescription({ description }: { description: string | undefined }) {\n  return description ? (\n    <span className=\"mt-0.5 block whitespace-pre-line text-xs font-normal leading-4 text-muted-foreground\">\n      {description}\n    </span>\n  ) : null;\n}\n"],"names":["createPortal","jsxs","jsx","Fragment","cn","FilterPill","Icon","UiCheck","LabelIcon"],"mappings":"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"}
+{"version":3,"file":"ComboboxMenu.cjs","sources":["../../src/components/ComboboxMenu.tsx"],"sourcesContent":["import { Fragment, type ReactNode, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { FilterPill } from \"../data/FilterPill\";\nimport { Icon, LabelIcon } from \"../data/Icon\";\nimport { UiCheck } from \"../icons\";\nimport { cn } from \"../lib/utils\";\nimport type {\n  ComboboxOption,\n  ComboboxTriStateMode,\n} from \"./combobox-types\";\nimport type { ComboboxMenuPosition } from \"./combobox-utils\";\n\nexport function ComboboxMenu({\n  customEntry,\n  filtered,\n  floatingZ,\n  footer,\n  highlighted,\n  isSelected,\n  listId,\n  listRef,\n  loading,\n  menuPos,\n  modes,\n  multiple,\n  onHighlight,\n  onSelect,\n  onSetMode,\n  tristate,\n}: {\n  customEntry: ComboboxOption | null;\n  filtered: ComboboxOption[];\n  floatingZ: number;\n  footer: ReactNode;\n  highlighted: number;\n  isSelected: (value: string) => boolean;\n  listId: string | undefined;\n  listRef: RefObject<HTMLDivElement>;\n  loading: boolean | undefined;\n  menuPos: ComboboxMenuPosition;\n  modes: Record<string, ComboboxTriStateMode>;\n  multiple: boolean;\n  onHighlight: (index: number) => void;\n  onSelect: (option: ComboboxOption) => void;\n  onSetMode: (value: string, mode: string) => void;\n  tristate: boolean;\n}) {\n  return createPortal(\n    <div\n      id={listId}\n      ref={listRef}\n      role=\"listbox\"\n      aria-multiselectable={multiple || undefined}\n      style={{\n        position: \"fixed\",\n        ...(menuPos.top != null\n          ? { top: menuPos.top }\n          : { bottom: menuPos.bottom }),\n        left: menuPos.left,\n        minWidth: menuPos.width,\n        maxWidth: menuPos.maxWidth,\n        maxHeight: menuPos.maxHeight,\n        zIndex: floatingZ,\n      }}\n      className=\"w-max overflow-auto rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\"\n    >\n      {loading && filtered.length === 0 && (\n        <div className=\"px-2 py-4 text-center text-sm text-muted-foreground\">\n          Loading…\n        </div>\n      )}\n      {!loading && filtered.length === 0 && !customEntry && (\n        <div className=\"px-2 py-4 text-center text-sm text-muted-foreground\">\n          No results\n        </div>\n      )}\n      {filtered.map((option, index) => {\n        const selected = isSelected(option.value);\n        const mode = tristate ? modes[option.value] : undefined;\n        const showHeader =\n          option.group != null &&\n          option.group !== filtered[index - 1]?.group;\n        return (\n          <Fragment key={option.value}>\n            {showHeader && (\n              <div\n                role=\"presentation\"\n                className=\"select-none px-2 pb-1 pt-2 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\"\n              >\n                {option.group}\n              </div>\n            )}\n            <div\n              id={listId ? `${listId}-${index}` : undefined}\n              role=\"option\"\n              aria-selected={tristate ? mode != null : selected}\n              aria-disabled={option.disabled}\n              {...(mode != null\n                ? {\n                    \"aria-label\": `${option.label}, ${\n                      mode === \"include\" ? \"included\" : \"excluded\"\n                    }`,\n                  }\n                : {})}\n              {...(option.title !== undefined ? { title: option.title } : {})}\n              {...(tristate\n                ? { \"data-filter-option\": option.value }\n                : {})}\n              onMouseDown={(event) => {\n                event.preventDefault();\n                if (!tristate && !option.disabled) onSelect(option);\n              }}\n              {...(tristate\n                ? {\n                    onClick: () => {\n                      if (!option.disabled) onSelect(option);\n                    },\n                  }\n                : {})}\n              onMouseEnter={() => onHighlight(index)}\n              className={cn(\n                \"flex cursor-pointer gap-2 rounded-sm px-2 py-1.5 text-sm\",\n                option.description ? \"items-start\" : \"items-center\",\n                index === highlighted && \"bg-accent\",\n                selected && !tristate && \"font-medium\",\n                option.disabled && \"cursor-not-allowed opacity-50\",\n              )}\n            >\n              {tristate ? (\n                <div className=\"min-w-0 flex-1\">\n                  <FilterPill\n                    mode={mode ?? \"neutral\"}\n                    togglePosition=\"right\"\n                    interactive={false}\n                    label={option.label}\n                    onModeChange={(next) => onSetMode(option.value, next)}\n                    className=\"w-full justify-between\"\n                  />\n                  <ComboboxOptionDescription description={option.description} />\n                </div>\n              ) : (\n                <>\n                  <Icon\n                    icon={UiCheck}\n                    className={cn(\n                      \"shrink-0 text-xs\",\n                      option.description && \"mt-1\",\n                      selected ? \"opacity-100\" : \"opacity-0\",\n                    )}\n                  />\n                  <LabelIcon\n                    icon={option.icon}\n                    className={cn(\n                      \"text-sm text-muted-foreground\",\n                      option.description && \"mt-1\",\n                    )}\n                  />\n                  <ComboboxOptionText option={option} />\n                  {option.trailing != null && (\n                    // Capped and truncating rather than `shrink-0`: in a menu\n                    // clamped by the viewport edge the label is what identifies\n                    // the option, so the preview yields first.\n                    <span className=\"ml-auto min-w-0 max-w-[55%] truncate pl-2 text-right text-xs text-muted-foreground\">\n                      {option.trailing}\n                    </span>\n                  )}\n                </>\n              )}\n            </div>\n          </Fragment>\n        );\n      })}\n      {customEntry && (\n        <div\n          id={listId ? `${listId}-${filtered.length}` : undefined}\n          role=\"option\"\n          aria-selected={false}\n          data-filter-add-custom={customEntry.value}\n          title={customEntry.title}\n          onMouseDown={(event) => event.preventDefault()}\n          onClick={() => onSelect(customEntry)}\n          onMouseEnter={() => onHighlight(filtered.length)}\n          className={cn(\n            \"flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-primary\",\n            highlighted === filtered.length && \"bg-accent\",\n          )}\n        >\n          <LabelIcon\n            icon={customEntry.icon}\n            className=\"text-sm text-muted-foreground\"\n          />\n          <span className=\"min-w-0 truncate\">{customEntry.label}</span>\n        </div>\n      )}\n      {footer != null && (\n        <div className=\"select-none px-2 py-1.5 text-[11px] text-muted-foreground\">\n          {footer}\n        </div>\n      )}\n    </div>,\n    document.body,\n  );\n}\n\nfunction ComboboxOptionText({ option }: { option: ComboboxOption }) {\n  return (\n    <span className=\"min-w-0 flex-1\">\n      <span className=\"block truncate\">{option.label}</span>\n      <ComboboxOptionDescription description={option.description} />\n    </span>\n  );\n}\n\nfunction ComboboxOptionDescription({ description }: { description: string | undefined }) {\n  return description ? (\n    <span className=\"mt-0.5 block whitespace-pre-line text-xs font-normal leading-4 text-muted-foreground\">\n      {description}\n    </span>\n  ) : null;\n}\n"],"names":["createPortal","jsxs","jsx","Fragment","cn","FilterPill","Icon","UiCheck","LabelIcon"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"ComboboxMenu.d.ts","sourceRoot":"","sources":["../../src/components/ComboboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMjE,OAAO,KAAK,EACV,cAAc,EACd,oBAAoB,EACrB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAE7D,wBAAgB,YAAY,CAAC,EAC3B,WAAW,EACX,QAAQ,EACR,SAAS,EACT,MAAM,EACN,WAAW,EACX,UAAU,EACV,MAAM,EACN,OAAO,EACP,OAAO,EACP,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,SAAS,EACT,QAAQ,GACT,EAAE;IACD,WAAW,EAAE,cAAc,GAAG,IAAI,CAAC;IACnC,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,SAAS,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;IACvC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,OAAO,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACnC,OAAO,EAAE,OAAO,GAAG,SAAS,CAAC;IAC7B,OAAO,EAAE,oBAAoB,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAAC;IAC5C,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IAC3C,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,QAAQ,EAAE,OAAO,CAAC;CACnB,+BAoJA"}
+{"version":3,"file":"ComboboxMenu.d.ts","sourceRoot":"","sources":["../../src/components/ComboboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMjE,OAAO,KAAK,EACV,cAAc,EACd,oBAAoB,EACrB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAE7D,wBAAgB,YAAY,CAAC,EAC3B,WAAW,EACX,QAAQ,EACR,SAAS,EACT,MAAM,EACN,WAAW,EACX,UAAU,EACV,MAAM,EACN,OAAO,EACP,OAAO,EACP,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,SAAS,EACT,QAAQ,GACT,EAAE;IACD,WAAW,EAAE,cAAc,GAAG,IAAI,CAAC;IACnC,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,SAAS,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;IACvC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,OAAO,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACnC,OAAO,EAAE,OAAO,GAAG,SAAS,CAAC;IAC7B,OAAO,EAAE,oBAAoB,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAAC;IAC5C,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IAC3C,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,QAAQ,EAAE,OAAO,CAAC;CACnB,+BA4JA"}

package/dist/components/ComboboxMenu.js

@@ -122,7 +122,11 @@ function ComboboxMenu({
                         )
                       }
                     ),
-                    /* @__PURE__ */ jsx(ComboboxOptionText, { option })
+                    /* @__PURE__ */ jsx(ComboboxOptionText, { option }),
+                    option.trailing != null && // Capped and truncating rather than `shrink-0`: in a menu
+                    // clamped by the viewport edge the label is what identifies
+                    // the option, so the preview yields first.
+                    /* @__PURE__ */ jsx("span", { className: "ml-auto min-w-0 max-w-[55%] truncate pl-2 text-right text-xs text-muted-foreground", children: option.trailing })
                   ] })
                 }
               )

package/dist/components/ComboboxMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxMenu.js","sources":["../../src/components/ComboboxMenu.tsx"],"sourcesContent":["import { Fragment, type ReactNode, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { FilterPill } from \"../data/FilterPill\";\nimport { Icon, LabelIcon } from \"../data/Icon\";\nimport { UiCheck } from \"../icons\";\nimport { cn } from \"../lib/utils\";\nimport type {\n  ComboboxOption,\n  ComboboxTriStateMode,\n} from \"./combobox-types\";\nimport type { ComboboxMenuPosition } from \"./combobox-utils\";\n\nexport function ComboboxMenu({\n  customEntry,\n  filtered,\n  floatingZ,\n  footer,\n  highlighted,\n  isSelected,\n  listId,\n  listRef,\n  loading,\n  menuPos,\n  modes,\n  multiple,\n  onHighlight,\n  onSelect,\n  onSetMode,\n  tristate,\n}: {\n  customEntry: ComboboxOption | null;\n  filtered: ComboboxOption[];\n  floatingZ: number;\n  footer: ReactNode;\n  highlighted: number;\n  isSelected: (value: string) => boolean;\n  listId: string | undefined;\n  listRef: RefObject<HTMLDivElement>;\n  loading: boolean | undefined;\n  menuPos: ComboboxMenuPosition;\n  modes: Record<string, ComboboxTriStateMode>;\n  multiple: boolean;\n  onHighlight: (index: number) => void;\n  onSelect: (option: ComboboxOption) => void;\n  onSetMode: (value: string, mode: string) => void;\n  tristate: boolean;\n}) {\n  return createPortal(\n    <div\n      id={listId}\n      ref={listRef}\n      role=\"listbox\"\n      aria-multiselectable={multiple || undefined}\n      style={{\n        position: \"fixed\",\n        ...(menuPos.top != null\n          ? { top: menuPos.top }\n          : { bottom: menuPos.bottom }),\n        left: menuPos.left,\n        minWidth: menuPos.width,\n        maxWidth: menuPos.maxWidth,\n        maxHeight: menuPos.maxHeight,\n        zIndex: floatingZ,\n      }}\n      className=\"w-max overflow-auto rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\"\n    >\n      {loading && filtered.length === 0 && (\n        <div className=\"px-2 py-4 text-center text-sm text-muted-foreground\">\n          Loading…\n        </div>\n      )}\n      {!loading && filtered.length === 0 && !customEntry && (\n        <div className=\"px-2 py-4 text-center text-sm text-muted-foreground\">\n          No results\n        </div>\n      )}\n      {filtered.map((option, index) => {\n        const selected = isSelected(option.value);\n        const mode = tristate ? modes[option.value] : undefined;\n        const showHeader =\n          option.group != null &&\n          option.group !== filtered[index - 1]?.group;\n        return (\n          <Fragment key={option.value}>\n            {showHeader && (\n              <div\n                role=\"presentation\"\n                className=\"select-none px-2 pb-1 pt-2 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\"\n              >\n                {option.group}\n              </div>\n            )}\n            <div\n              id={listId ? `${listId}-${index}` : undefined}\n              role=\"option\"\n              aria-selected={tristate ? mode != null : selected}\n              aria-disabled={option.disabled}\n              {...(mode != null\n                ? {\n                    \"aria-label\": `${option.label}, ${\n                      mode === \"include\" ? \"included\" : \"excluded\"\n                    }`,\n                  }\n                : {})}\n              {...(option.title !== undefined ? { title: option.title } : {})}\n              {...(tristate\n                ? { \"data-filter-option\": option.value }\n                : {})}\n              onMouseDown={(event) => {\n                event.preventDefault();\n                if (!tristate && !option.disabled) onSelect(option);\n              }}\n              {...(tristate\n                ? {\n                    onClick: () => {\n                      if (!option.disabled) onSelect(option);\n                    },\n                  }\n                : {})}\n              onMouseEnter={() => onHighlight(index)}\n              className={cn(\n                \"flex cursor-pointer gap-2 rounded-sm px-2 py-1.5 text-sm\",\n                option.description ? \"items-start\" : \"items-center\",\n                index === highlighted && \"bg-accent\",\n                selected && !tristate && \"font-medium\",\n                option.disabled && \"cursor-not-allowed opacity-50\",\n              )}\n            >\n              {tristate ? (\n                <div className=\"min-w-0 flex-1\">\n                  <FilterPill\n                    mode={mode ?? \"neutral\"}\n                    togglePosition=\"right\"\n                    interactive={false}\n                    label={option.label}\n                    onModeChange={(next) => onSetMode(option.value, next)}\n                    className=\"w-full justify-between\"\n                  />\n                  <ComboboxOptionDescription description={option.description} />\n                </div>\n              ) : (\n                <>\n                  <Icon\n                    icon={UiCheck}\n                    className={cn(\n                      \"shrink-0 text-xs\",\n                      option.description && \"mt-1\",\n                      selected ? \"opacity-100\" : \"opacity-0\",\n                    )}\n                  />\n                  <LabelIcon\n                    icon={option.icon}\n                    className={cn(\n                      \"text-sm text-muted-foreground\",\n                      option.description && \"mt-1\",\n                    )}\n                  />\n                  <ComboboxOptionText option={option} />\n                </>\n              )}\n            </div>\n          </Fragment>\n        );\n      })}\n      {customEntry && (\n        <div\n          id={listId ? `${listId}-${filtered.length}` : undefined}\n          role=\"option\"\n          aria-selected={false}\n          data-filter-add-custom={customEntry.value}\n          title={customEntry.title}\n          onMouseDown={(event) => event.preventDefault()}\n          onClick={() => onSelect(customEntry)}\n          onMouseEnter={() => onHighlight(filtered.length)}\n          className={cn(\n            \"flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-primary\",\n            highlighted === filtered.length && \"bg-accent\",\n          )}\n        >\n          <LabelIcon\n            icon={customEntry.icon}\n            className=\"text-sm text-muted-foreground\"\n          />\n          <span className=\"min-w-0 truncate\">{customEntry.label}</span>\n        </div>\n      )}\n      {footer != null && (\n        <div className=\"select-none px-2 py-1.5 text-[11px] text-muted-foreground\">\n          {footer}\n        </div>\n      )}\n    </div>,\n    document.body,\n  );\n}\n\nfunction ComboboxOptionText({ option }: { option: ComboboxOption }) {\n  return (\n    <span className=\"min-w-0 flex-1\">\n      <span className=\"block truncate\">{option.label}</span>\n      <ComboboxOptionDescription description={option.description} />\n    </span>\n  );\n}\n\nfunction ComboboxOptionDescription({ description }: { description: string | undefined }) {\n  return description ? (\n    <span className=\"mt-0.5 block whitespace-pre-line text-xs font-normal leading-4 text-muted-foreground\">\n      {description}\n    </span>\n  ) : null;\n}\n"],"names":["Fragment"],"mappings":"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"}
+{"version":3,"file":"ComboboxMenu.js","sources":["../../src/components/ComboboxMenu.tsx"],"sourcesContent":["import { Fragment, type ReactNode, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { FilterPill } from \"../data/FilterPill\";\nimport { Icon, LabelIcon } from \"../data/Icon\";\nimport { UiCheck } from \"../icons\";\nimport { cn } from \"../lib/utils\";\nimport type {\n  ComboboxOption,\n  ComboboxTriStateMode,\n} from \"./combobox-types\";\nimport type { ComboboxMenuPosition } from \"./combobox-utils\";\n\nexport function ComboboxMenu({\n  customEntry,\n  filtered,\n  floatingZ,\n  footer,\n  highlighted,\n  isSelected,\n  listId,\n  listRef,\n  loading,\n  menuPos,\n  modes,\n  multiple,\n  onHighlight,\n  onSelect,\n  onSetMode,\n  tristate,\n}: {\n  customEntry: ComboboxOption | null;\n  filtered: ComboboxOption[];\n  floatingZ: number;\n  footer: ReactNode;\n  highlighted: number;\n  isSelected: (value: string) => boolean;\n  listId: string | undefined;\n  listRef: RefObject<HTMLDivElement>;\n  loading: boolean | undefined;\n  menuPos: ComboboxMenuPosition;\n  modes: Record<string, ComboboxTriStateMode>;\n  multiple: boolean;\n  onHighlight: (index: number) => void;\n  onSelect: (option: ComboboxOption) => void;\n  onSetMode: (value: string, mode: string) => void;\n  tristate: boolean;\n}) {\n  return createPortal(\n    <div\n      id={listId}\n      ref={listRef}\n      role=\"listbox\"\n      aria-multiselectable={multiple || undefined}\n      style={{\n        position: \"fixed\",\n        ...(menuPos.top != null\n          ? { top: menuPos.top }\n          : { bottom: menuPos.bottom }),\n        left: menuPos.left,\n        minWidth: menuPos.width,\n        maxWidth: menuPos.maxWidth,\n        maxHeight: menuPos.maxHeight,\n        zIndex: floatingZ,\n      }}\n      className=\"w-max overflow-auto rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\"\n    >\n      {loading && filtered.length === 0 && (\n        <div className=\"px-2 py-4 text-center text-sm text-muted-foreground\">\n          Loading…\n        </div>\n      )}\n      {!loading && filtered.length === 0 && !customEntry && (\n        <div className=\"px-2 py-4 text-center text-sm text-muted-foreground\">\n          No results\n        </div>\n      )}\n      {filtered.map((option, index) => {\n        const selected = isSelected(option.value);\n        const mode = tristate ? modes[option.value] : undefined;\n        const showHeader =\n          option.group != null &&\n          option.group !== filtered[index - 1]?.group;\n        return (\n          <Fragment key={option.value}>\n            {showHeader && (\n              <div\n                role=\"presentation\"\n                className=\"select-none px-2 pb-1 pt-2 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\"\n              >\n                {option.group}\n              </div>\n            )}\n            <div\n              id={listId ? `${listId}-${index}` : undefined}\n              role=\"option\"\n              aria-selected={tristate ? mode != null : selected}\n              aria-disabled={option.disabled}\n              {...(mode != null\n                ? {\n                    \"aria-label\": `${option.label}, ${\n                      mode === \"include\" ? \"included\" : \"excluded\"\n                    }`,\n                  }\n                : {})}\n              {...(option.title !== undefined ? { title: option.title } : {})}\n              {...(tristate\n                ? { \"data-filter-option\": option.value }\n                : {})}\n              onMouseDown={(event) => {\n                event.preventDefault();\n                if (!tristate && !option.disabled) onSelect(option);\n              }}\n              {...(tristate\n                ? {\n                    onClick: () => {\n                      if (!option.disabled) onSelect(option);\n                    },\n                  }\n                : {})}\n              onMouseEnter={() => onHighlight(index)}\n              className={cn(\n                \"flex cursor-pointer gap-2 rounded-sm px-2 py-1.5 text-sm\",\n                option.description ? \"items-start\" : \"items-center\",\n                index === highlighted && \"bg-accent\",\n                selected && !tristate && \"font-medium\",\n                option.disabled && \"cursor-not-allowed opacity-50\",\n              )}\n            >\n              {tristate ? (\n                <div className=\"min-w-0 flex-1\">\n                  <FilterPill\n                    mode={mode ?? \"neutral\"}\n                    togglePosition=\"right\"\n                    interactive={false}\n                    label={option.label}\n                    onModeChange={(next) => onSetMode(option.value, next)}\n                    className=\"w-full justify-between\"\n                  />\n                  <ComboboxOptionDescription description={option.description} />\n                </div>\n              ) : (\n                <>\n                  <Icon\n                    icon={UiCheck}\n                    className={cn(\n                      \"shrink-0 text-xs\",\n                      option.description && \"mt-1\",\n                      selected ? \"opacity-100\" : \"opacity-0\",\n                    )}\n                  />\n                  <LabelIcon\n                    icon={option.icon}\n                    className={cn(\n                      \"text-sm text-muted-foreground\",\n                      option.description && \"mt-1\",\n                    )}\n                  />\n                  <ComboboxOptionText option={option} />\n                  {option.trailing != null && (\n                    // Capped and truncating rather than `shrink-0`: in a menu\n                    // clamped by the viewport edge the label is what identifies\n                    // the option, so the preview yields first.\n                    <span className=\"ml-auto min-w-0 max-w-[55%] truncate pl-2 text-right text-xs text-muted-foreground\">\n                      {option.trailing}\n                    </span>\n                  )}\n                </>\n              )}\n            </div>\n          </Fragment>\n        );\n      })}\n      {customEntry && (\n        <div\n          id={listId ? `${listId}-${filtered.length}` : undefined}\n          role=\"option\"\n          aria-selected={false}\n          data-filter-add-custom={customEntry.value}\n          title={customEntry.title}\n          onMouseDown={(event) => event.preventDefault()}\n          onClick={() => onSelect(customEntry)}\n          onMouseEnter={() => onHighlight(filtered.length)}\n          className={cn(\n            \"flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-primary\",\n            highlighted === filtered.length && \"bg-accent\",\n          )}\n        >\n          <LabelIcon\n            icon={customEntry.icon}\n            className=\"text-sm text-muted-foreground\"\n          />\n          <span className=\"min-w-0 truncate\">{customEntry.label}</span>\n        </div>\n      )}\n      {footer != null && (\n        <div className=\"select-none px-2 py-1.5 text-[11px] text-muted-foreground\">\n          {footer}\n        </div>\n      )}\n    </div>,\n    document.body,\n  );\n}\n\nfunction ComboboxOptionText({ option }: { option: ComboboxOption }) {\n  return (\n    <span className=\"min-w-0 flex-1\">\n      <span className=\"block truncate\">{option.label}</span>\n      <ComboboxOptionDescription description={option.description} />\n    </span>\n  );\n}\n\nfunction ComboboxOptionDescription({ description }: { description: string | undefined }) {\n  return description ? (\n    <span className=\"mt-0.5 block whitespace-pre-line text-xs font-normal leading-4 text-muted-foreground\">\n      {description}\n    </span>\n  ) : null;\n}\n"],"names":["Fragment"],"mappings":"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"}

package/dist/components/EndpointSelector.model.cjs

@@ -0,0 +1,96 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const SecretKeySelector_model = require("./SecretKeySelector.model.cjs");
+const SCHEME_TO_MODE = {
+  svc: "service",
+  ip: "cluster-ip",
+  proxy: "api-proxy",
+  host: "ingress",
+  portforward: "port-forward"
+};
+const MODE_TO_SCHEME = Object.fromEntries(
+  Object.entries(SCHEME_TO_MODE).map(([scheme, mode]) => [mode, scheme])
+);
+const WORKLOAD_URL = /^([a-z]+):\/\/([^/:?#]*)(?::(\d+))?([^?#]*)(?:\?(.+))?$/;
+function validPort(port) {
+  return /^\d+$/.test(port) && Number(port) >= 1 && Number(port) <= 65535;
+}
+function parseTarget(mode, host, query) {
+  const dot = host.indexOf(".");
+  const name = dot >= 0 ? host.slice(0, dot) : host;
+  const namespace = dot >= 0 ? host.slice(dot + 1) : "";
+  if (!name) return void 0;
+  const kind = mode === "ingress" ? "ingress" : mode === "port-forward" && new URLSearchParams(query).get("kind") === "deployment" ? "deployment" : "service";
+  return {
+    kind,
+    name,
+    ...namespace ? { namespace } : {}
+  };
+}
+function parseWorkloadValue(raw) {
+  const match = WORKLOAD_URL.exec(raw);
+  if (!match) return void 0;
+  const [, scheme = "", host = "", port = "", path = "", query = ""] = match;
+  const mode = SCHEME_TO_MODE[scheme];
+  if (!mode || port && !validPort(port)) return void 0;
+  if (mode === "port-forward" && (new URLSearchParams(query).has("selector") || !["", "service", "deployment"].includes(
+    new URLSearchParams(query).get("kind") ?? ""
+  ))) {
+    return void 0;
+  }
+  const target = parseTarget(mode, host, query);
+  if (!target) return void 0;
+  return {
+    mode,
+    target,
+    ...port ? { port } : {},
+    ...path ? { path } : {}
+  };
+}
+function parseEndpointValue(raw) {
+  if (typeof raw !== "string" || raw === "") return void 0;
+  return parseWorkloadValue(raw) ?? {
+    mode: "url",
+    source: SecretKeySelector_model.parseSecretRef(raw)
+  };
+}
+function workloadHost(target) {
+  if (!target.name) {
+    throw new Error("Endpoint workload mode requires a workload name");
+  }
+  return target.namespace ? `${target.name}.${target.namespace}` : target.name;
+}
+function validateWorkloadValue(value) {
+  if (value.mode === "ingress" && value.target.kind !== "ingress") {
+    throw new Error("Ingress endpoint mode requires an ingress target");
+  }
+  if (value.mode !== "ingress" && value.mode !== "port-forward" && value.target.kind !== "service") {
+    throw new Error(`${value.mode} endpoint mode requires a service target`);
+  }
+  if (value.mode === "port-forward" && !["service", "deployment"].includes(value.target.kind)) {
+    throw new Error(
+      "Port-forward endpoint mode requires a service or deployment target"
+    );
+  }
+  if (value.port && !validPort(value.port)) {
+    throw new Error(
+      `Endpoint port "${value.port}" must be between 1 and 65535`
+    );
+  }
+  if (value.path && !value.path.startsWith("/")) {
+    throw new Error(`Endpoint path "${value.path}" must start with /`);
+  }
+}
+function serializeEndpointValue(value) {
+  if (!value) return "";
+  if (value.mode === "url") return SecretKeySelector_model.serializeSecretRef(value.source);
+  validateWorkloadValue(value);
+  const scheme = MODE_TO_SCHEME[value.mode];
+  const port = value.port ? `:${value.port}` : "";
+  const path = value.path ?? "";
+  const kind = value.mode === "port-forward" && value.target.kind === "deployment" ? "?kind=deployment" : "";
+  return `${scheme}://${workloadHost(value.target)}${port}${path}${kind}`;
+}
+exports.parseEndpointValue = parseEndpointValue;
+exports.serializeEndpointValue = serializeEndpointValue;
+//# sourceMappingURL=EndpointSelector.model.cjs.map

package/dist/components/EndpointSelector.model.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EndpointSelector.model.cjs","sources":["../../src/components/EndpointSelector.model.ts"],"sourcesContent":["import type { SecretKeySelectorProps, SecretKeyValue } from \"./SecretKeySelector\";\nimport type {\n  WorkloadKind,\n  WorkloadResource,\n} from \"./workload-picker-utils\";\nimport type { WorkloadPickerProps } from \"./WorkloadPicker\";\nimport {\n  parseSecretRef,\n  serializeSecretRef,\n} from \"./SecretKeySelector.model\";\n\nexport type EndpointMode =\n  | \"url\"\n  | \"service\"\n  | \"cluster-ip\"\n  | \"api-proxy\"\n  | \"ingress\"\n  | \"port-forward\";\n\nexport type EndpointWorkloadMode = Exclude<EndpointMode, \"url\">;\n\nexport type EndpointTarget =\n  | {\n      kind: \"ingress\";\n      name: string;\n      host?: string;\n      namespace?: string;\n    }\n  | {\n      kind: Exclude<WorkloadKind, \"ingress\">;\n      name: string;\n      namespace?: string;\n    };\n\nexport type EndpointWorkloadValue = {\n  mode: EndpointWorkloadMode;\n  target: EndpointTarget;\n  scheme?: string;\n  port?: string;\n  path?: string;\n};\n\nexport type EndpointSelectorValue =\n  | {\n      mode: \"url\";\n      source: SecretKeyValue;\n    }\n  | EndpointWorkloadValue;\n\nexport type EndpointSelectorDefaults = {\n  scheme?: string;\n  path?: string;\n};\n\nexport type EndpointUrlSelectorProps = Omit<\n  SecretKeySelectorProps,\n  \"value\" | \"onChange\"\n>;\n\nexport type EndpointSelectorProps = {\n  value: EndpointSelectorValue | undefined;\n  onChange: (value: EndpointSelectorValue | undefined) => void;\n  namespace?: string;\n  modes: EndpointMode[];\n  defaultMode?: EndpointMode;\n  loadWorkloads: WorkloadPickerProps[\"loadWorkloads\"];\n  urlSelector?: EndpointUrlSelectorProps;\n  modeKinds?: Partial<Record<EndpointWorkloadMode, WorkloadKind[]>>;\n  defaults?: EndpointSelectorDefaults;\n  preferredPorts?: readonly number[];\n  schemes?: string[];\n  allowCustomScheme?: boolean;\n  allowCustomPort?: boolean;\n  showScheme?: boolean;\n  showPath?: boolean;\n  showIngressPort?: boolean;\n  className?: string;\n};\n\nexport type EndpointResources = Partial<\n  Record<WorkloadKind, WorkloadResource[]>\n>;\n\nconst SCHEME_TO_MODE = {\n  svc: \"service\",\n  ip: \"cluster-ip\",\n  proxy: \"api-proxy\",\n  host: \"ingress\",\n  portforward: \"port-forward\",\n} as const satisfies Record<string, EndpointMode>;\n\nconst MODE_TO_SCHEME = Object.fromEntries(\n  Object.entries(SCHEME_TO_MODE).map(([scheme, mode]) => [mode, scheme]),\n) as Record<EndpointWorkloadMode, keyof typeof SCHEME_TO_MODE>;\n\nconst WORKLOAD_URL =\n  /^([a-z]+):\\/\\/([^/:?#]*)(?::(\\d+))?([^?#]*)(?:\\?(.+))?$/;\n\nfunction validPort(port: string) {\n  return /^\\d+$/.test(port) && Number(port) >= 1 && Number(port) <= 65535;\n}\n\nfunction parseTarget(\n  mode: EndpointWorkloadMode,\n  host: string,\n  query: string,\n): EndpointTarget | undefined {\n  const dot = host.indexOf(\".\");\n  const name = dot >= 0 ? host.slice(0, dot) : host;\n  const namespace = dot >= 0 ? host.slice(dot + 1) : \"\";\n  if (!name) return undefined;\n\n  const kind =\n    mode === \"ingress\"\n      ? \"ingress\"\n      : mode === \"port-forward\" &&\n          new URLSearchParams(query).get(\"kind\") === \"deployment\"\n        ? \"deployment\"\n        : \"service\";\n  return {\n    kind,\n    name,\n    ...(namespace ? { namespace } : {}),\n  };\n}\n\nfunction parseWorkloadValue(raw: string): EndpointWorkloadValue | undefined {\n  const match = WORKLOAD_URL.exec(raw);\n  if (!match) return undefined;\n  const [, scheme = \"\", host = \"\", port = \"\", path = \"\", query = \"\"] =\n    match;\n  const mode = SCHEME_TO_MODE[scheme as keyof typeof SCHEME_TO_MODE];\n  if (!mode || (port && !validPort(port))) return undefined;\n  if (\n    mode === \"port-forward\" &&\n    (new URLSearchParams(query).has(\"selector\") ||\n      ![\"\", \"service\", \"deployment\"].includes(\n        new URLSearchParams(query).get(\"kind\") ?? \"\",\n      ))\n  ) {\n    return undefined;\n  }\n\n  const target = parseTarget(mode, host, query);\n  if (!target) return undefined;\n  return {\n    mode,\n    target,\n    ...(port ? { port } : {}),\n    ...(path ? { path } : {}),\n  };\n}\n\nexport function parseEndpointValue(\n  raw: unknown,\n): EndpointSelectorValue | undefined {\n  if (typeof raw !== \"string\" || raw === \"\") return undefined;\n  return (\n    parseWorkloadValue(raw) ?? {\n      mode: \"url\",\n      source: parseSecretRef(raw)!,\n    }\n  );\n}\n\nfunction workloadHost(target: EndpointTarget) {\n  if (!target.name) {\n    throw new Error(\"Endpoint workload mode requires a workload name\");\n  }\n  return target.namespace\n    ? `${target.name}.${target.namespace}`\n    : target.name;\n}\n\nfunction validateWorkloadValue(value: EndpointWorkloadValue) {\n  if (value.mode === \"ingress\" && value.target.kind !== \"ingress\") {\n    throw new Error(\"Ingress endpoint mode requires an ingress target\");\n  }\n  if (\n    value.mode !== \"ingress\" &&\n    value.mode !== \"port-forward\" &&\n    value.target.kind !== \"service\"\n  ) {\n    throw new Error(`${value.mode} endpoint mode requires a service target`);\n  }\n  if (\n    value.mode === \"port-forward\" &&\n    ![\"service\", \"deployment\"].includes(value.target.kind)\n  ) {\n    throw new Error(\n      \"Port-forward endpoint mode requires a service or deployment target\",\n    );\n  }\n  if (value.port && !validPort(value.port)) {\n    throw new Error(\n      `Endpoint port \"${value.port}\" must be between 1 and 65535`,\n    );\n  }\n  if (value.path && !value.path.startsWith(\"/\")) {\n    throw new Error(`Endpoint path \"${value.path}\" must start with /`);\n  }\n}\n\nexport function serializeEndpointValue(\n  value: EndpointSelectorValue | undefined,\n): string {\n  if (!value) return \"\";\n  if (value.mode === \"url\") return serializeSecretRef(value.source);\n  validateWorkloadValue(value);\n  const scheme = MODE_TO_SCHEME[value.mode];\n  const port = value.port ? `:${value.port}` : \"\";\n  const path = value.path ?? \"\";\n  const kind =\n    value.mode === \"port-forward\" && value.target.kind === \"deployment\"\n      ? \"?kind=deployment\"\n      : \"\";\n  return `${scheme}://${workloadHost(value.target)}${port}${path}${kind}`;\n}\n"],"names":["parseSecretRef","serializeSecretRef"],"mappings":"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"}

package/dist/components/EndpointSelector.model.d.ts

@@ -49,4 +49,6 @@ export type EndpointSelectorProps = {
     className?: string;
 };
 export type EndpointResources = Partial<Record<WorkloadKind, WorkloadResource[]>>;
+export declare function parseEndpointValue(raw: unknown): EndpointSelectorValue | undefined;
+export declare function serializeEndpointValue(value: EndpointSelectorValue | undefined): string;
 //# sourceMappingURL=EndpointSelector.model.d.ts.map

package/dist/components/EndpointSelector.model.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EndpointSelector.model.d.ts","sourceRoot":"","sources":["../../src/components/EndpointSelector.model.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAClF,OAAO,KAAK,EACV,YAAY,EACZ,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE5D,MAAM,MAAM,YAAY,GACpB,KAAK,GACL,SAAS,GACT,YAAY,GACZ,WAAW,GACX,SAAS,GACT,cAAc,CAAC;AAEnB,MAAM,MAAM,oBAAoB,GAAG,OAAO,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;AAEhE,MAAM,MAAM,cAAc,GACtB;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GACD;IACE,IAAI,EAAE,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;IACvC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEN,MAAM,MAAM,qBAAqB,GAAG;IAClC,IAAI,EAAE,oBAAoB,CAAC;IAC3B,MAAM,EAAE,cAAc,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAC7B;IACE,IAAI,EAAE,KAAK,CAAC;IACZ,MAAM,EAAE,cAAc,CAAC;CACxB,GACD,qBAAqB,CAAC;AAE1B,MAAM,MAAM,wBAAwB,GAAG;IACrC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,IAAI,CACzC,sBAAsB,EACtB,OAAO,GAAG,UAAU,CACrB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,qBAAqB,GAAG,SAAS,CAAC;IACzC,QAAQ,EAAE,CAAC,KAAK,EAAE,qBAAqB,GAAG,SAAS,KAAK,IAAI,CAAC;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,aAAa,EAAE,mBAAmB,CAAC,eAAe,CAAC,CAAC;IACpD,WAAW,CAAC,EAAE,wBAAwB,CAAC;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,oBAAoB,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC;IAClE,QAAQ,CAAC,EAAE,wBAAwB,CAAC;IACpC,cAAc,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACnC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,OAAO,CACrC,MAAM,CAAC,YAAY,EAAE,gBAAgB,EAAE,CAAC,CACzC,CAAC"}
+{"version":3,"file":"EndpointSelector.model.d.ts","sourceRoot":"","sources":["../../src/components/EndpointSelector.model.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAClF,OAAO,KAAK,EACV,YAAY,EACZ,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAM5D,MAAM,MAAM,YAAY,GACpB,KAAK,GACL,SAAS,GACT,YAAY,GACZ,WAAW,GACX,SAAS,GACT,cAAc,CAAC;AAEnB,MAAM,MAAM,oBAAoB,GAAG,OAAO,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;AAEhE,MAAM,MAAM,cAAc,GACtB;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GACD;IACE,IAAI,EAAE,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;IACvC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEN,MAAM,MAAM,qBAAqB,GAAG;IAClC,IAAI,EAAE,oBAAoB,CAAC;IAC3B,MAAM,EAAE,cAAc,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAC7B;IACE,IAAI,EAAE,KAAK,CAAC;IACZ,MAAM,EAAE,cAAc,CAAC;CACxB,GACD,qBAAqB,CAAC;AAE1B,MAAM,MAAM,wBAAwB,GAAG;IACrC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,IAAI,CACzC,sBAAsB,EACtB,OAAO,GAAG,UAAU,CACrB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,qBAAqB,GAAG,SAAS,CAAC;IACzC,QAAQ,EAAE,CAAC,KAAK,EAAE,qBAAqB,GAAG,SAAS,KAAK,IAAI,CAAC;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,aAAa,EAAE,mBAAmB,CAAC,eAAe,CAAC,CAAC;IACpD,WAAW,CAAC,EAAE,wBAAwB,CAAC;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,oBAAoB,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC;IAClE,QAAQ,CAAC,EAAE,wBAAwB,CAAC;IACpC,cAAc,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACnC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,OAAO,CACrC,MAAM,CAAC,YAAY,EAAE,gBAAgB,EAAE,CAAC,CACzC,CAAC;AAwEF,wBAAgB,kBAAkB,CAChC,GAAG,EAAE,OAAO,GACX,qBAAqB,GAAG,SAAS,CAQnC;AAwCD,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,qBAAqB,GAAG,SAAS,GACvC,MAAM,CAYR"}

package/dist/components/EndpointSelector.model.js

@@ -0,0 +1,96 @@
+import { parseSecretRef, serializeSecretRef } from "./SecretKeySelector.model.js";
+const SCHEME_TO_MODE = {
+  svc: "service",
+  ip: "cluster-ip",
+  proxy: "api-proxy",
+  host: "ingress",
+  portforward: "port-forward"
+};
+const MODE_TO_SCHEME = Object.fromEntries(
+  Object.entries(SCHEME_TO_MODE).map(([scheme, mode]) => [mode, scheme])
+);
+const WORKLOAD_URL = /^([a-z]+):\/\/([^/:?#]*)(?::(\d+))?([^?#]*)(?:\?(.+))?$/;
+function validPort(port) {
+  return /^\d+$/.test(port) && Number(port) >= 1 && Number(port) <= 65535;
+}
+function parseTarget(mode, host, query) {
+  const dot = host.indexOf(".");
+  const name = dot >= 0 ? host.slice(0, dot) : host;
+  const namespace = dot >= 0 ? host.slice(dot + 1) : "";
+  if (!name) return void 0;
+  const kind = mode === "ingress" ? "ingress" : mode === "port-forward" && new URLSearchParams(query).get("kind") === "deployment" ? "deployment" : "service";
+  return {
+    kind,
+    name,
+    ...namespace ? { namespace } : {}
+  };
+}
+function parseWorkloadValue(raw) {
+  const match = WORKLOAD_URL.exec(raw);
+  if (!match) return void 0;
+  const [, scheme = "", host = "", port = "", path = "", query = ""] = match;
+  const mode = SCHEME_TO_MODE[scheme];
+  if (!mode || port && !validPort(port)) return void 0;
+  if (mode === "port-forward" && (new URLSearchParams(query).has("selector") || !["", "service", "deployment"].includes(
+    new URLSearchParams(query).get("kind") ?? ""
+  ))) {
+    return void 0;
+  }
+  const target = parseTarget(mode, host, query);
+  if (!target) return void 0;
+  return {
+    mode,
+    target,
+    ...port ? { port } : {},
+    ...path ? { path } : {}
+  };
+}
+function parseEndpointValue(raw) {
+  if (typeof raw !== "string" || raw === "") return void 0;
+  return parseWorkloadValue(raw) ?? {
+    mode: "url",
+    source: parseSecretRef(raw)
+  };
+}
+function workloadHost(target) {
+  if (!target.name) {
+    throw new Error("Endpoint workload mode requires a workload name");
+  }
+  return target.namespace ? `${target.name}.${target.namespace}` : target.name;
+}
+function validateWorkloadValue(value) {
+  if (value.mode === "ingress" && value.target.kind !== "ingress") {
+    throw new Error("Ingress endpoint mode requires an ingress target");
+  }
+  if (value.mode !== "ingress" && value.mode !== "port-forward" && value.target.kind !== "service") {
+    throw new Error(`${value.mode} endpoint mode requires a service target`);
+  }
+  if (value.mode === "port-forward" && !["service", "deployment"].includes(value.target.kind)) {
+    throw new Error(
+      "Port-forward endpoint mode requires a service or deployment target"
+    );
+  }
+  if (value.port && !validPort(value.port)) {
+    throw new Error(
+      `Endpoint port "${value.port}" must be between 1 and 65535`
+    );
+  }
+  if (value.path && !value.path.startsWith("/")) {
+    throw new Error(`Endpoint path "${value.path}" must start with /`);
+  }
+}
+function serializeEndpointValue(value) {
+  if (!value) return "";
+  if (value.mode === "url") return serializeSecretRef(value.source);
+  validateWorkloadValue(value);
+  const scheme = MODE_TO_SCHEME[value.mode];
+  const port = value.port ? `:${value.port}` : "";
+  const path = value.path ?? "";
+  const kind = value.mode === "port-forward" && value.target.kind === "deployment" ? "?kind=deployment" : "";
+  return `${scheme}://${workloadHost(value.target)}${port}${path}${kind}`;
+}
+export {
+  parseEndpointValue,
+  serializeEndpointValue
+};
+//# sourceMappingURL=EndpointSelector.model.js.map

package/dist/components/EndpointSelector.model.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EndpointSelector.model.js","sources":["../../src/components/EndpointSelector.model.ts"],"sourcesContent":["import type { SecretKeySelectorProps, SecretKeyValue } from \"./SecretKeySelector\";\nimport type {\n  WorkloadKind,\n  WorkloadResource,\n} from \"./workload-picker-utils\";\nimport type { WorkloadPickerProps } from \"./WorkloadPicker\";\nimport {\n  parseSecretRef,\n  serializeSecretRef,\n} from \"./SecretKeySelector.model\";\n\nexport type EndpointMode =\n  | \"url\"\n  | \"service\"\n  | \"cluster-ip\"\n  | \"api-proxy\"\n  | \"ingress\"\n  | \"port-forward\";\n\nexport type EndpointWorkloadMode = Exclude<EndpointMode, \"url\">;\n\nexport type EndpointTarget =\n  | {\n      kind: \"ingress\";\n      name: string;\n      host?: string;\n      namespace?: string;\n    }\n  | {\n      kind: Exclude<WorkloadKind, \"ingress\">;\n      name: string;\n      namespace?: string;\n    };\n\nexport type EndpointWorkloadValue = {\n  mode: EndpointWorkloadMode;\n  target: EndpointTarget;\n  scheme?: string;\n  port?: string;\n  path?: string;\n};\n\nexport type EndpointSelectorValue =\n  | {\n      mode: \"url\";\n      source: SecretKeyValue;\n    }\n  | EndpointWorkloadValue;\n\nexport type EndpointSelectorDefaults = {\n  scheme?: string;\n  path?: string;\n};\n\nexport type EndpointUrlSelectorProps = Omit<\n  SecretKeySelectorProps,\n  \"value\" | \"onChange\"\n>;\n\nexport type EndpointSelectorProps = {\n  value: EndpointSelectorValue | undefined;\n  onChange: (value: EndpointSelectorValue | undefined) => void;\n  namespace?: string;\n  modes: EndpointMode[];\n  defaultMode?: EndpointMode;\n  loadWorkloads: WorkloadPickerProps[\"loadWorkloads\"];\n  urlSelector?: EndpointUrlSelectorProps;\n  modeKinds?: Partial<Record<EndpointWorkloadMode, WorkloadKind[]>>;\n  defaults?: EndpointSelectorDefaults;\n  preferredPorts?: readonly number[];\n  schemes?: string[];\n  allowCustomScheme?: boolean;\n  allowCustomPort?: boolean;\n  showScheme?: boolean;\n  showPath?: boolean;\n  showIngressPort?: boolean;\n  className?: string;\n};\n\nexport type EndpointResources = Partial<\n  Record<WorkloadKind, WorkloadResource[]>\n>;\n\nconst SCHEME_TO_MODE = {\n  svc: \"service\",\n  ip: \"cluster-ip\",\n  proxy: \"api-proxy\",\n  host: \"ingress\",\n  portforward: \"port-forward\",\n} as const satisfies Record<string, EndpointMode>;\n\nconst MODE_TO_SCHEME = Object.fromEntries(\n  Object.entries(SCHEME_TO_MODE).map(([scheme, mode]) => [mode, scheme]),\n) as Record<EndpointWorkloadMode, keyof typeof SCHEME_TO_MODE>;\n\nconst WORKLOAD_URL =\n  /^([a-z]+):\\/\\/([^/:?#]*)(?::(\\d+))?([^?#]*)(?:\\?(.+))?$/;\n\nfunction validPort(port: string) {\n  return /^\\d+$/.test(port) && Number(port) >= 1 && Number(port) <= 65535;\n}\n\nfunction parseTarget(\n  mode: EndpointWorkloadMode,\n  host: string,\n  query: string,\n): EndpointTarget | undefined {\n  const dot = host.indexOf(\".\");\n  const name = dot >= 0 ? host.slice(0, dot) : host;\n  const namespace = dot >= 0 ? host.slice(dot + 1) : \"\";\n  if (!name) return undefined;\n\n  const kind =\n    mode === \"ingress\"\n      ? \"ingress\"\n      : mode === \"port-forward\" &&\n          new URLSearchParams(query).get(\"kind\") === \"deployment\"\n        ? \"deployment\"\n        : \"service\";\n  return {\n    kind,\n    name,\n    ...(namespace ? { namespace } : {}),\n  };\n}\n\nfunction parseWorkloadValue(raw: string): EndpointWorkloadValue | undefined {\n  const match = WORKLOAD_URL.exec(raw);\n  if (!match) return undefined;\n  const [, scheme = \"\", host = \"\", port = \"\", path = \"\", query = \"\"] =\n    match;\n  const mode = SCHEME_TO_MODE[scheme as keyof typeof SCHEME_TO_MODE];\n  if (!mode || (port && !validPort(port))) return undefined;\n  if (\n    mode === \"port-forward\" &&\n    (new URLSearchParams(query).has(\"selector\") ||\n      ![\"\", \"service\", \"deployment\"].includes(\n        new URLSearchParams(query).get(\"kind\") ?? \"\",\n      ))\n  ) {\n    return undefined;\n  }\n\n  const target = parseTarget(mode, host, query);\n  if (!target) return undefined;\n  return {\n    mode,\n    target,\n    ...(port ? { port } : {}),\n    ...(path ? { path } : {}),\n  };\n}\n\nexport function parseEndpointValue(\n  raw: unknown,\n): EndpointSelectorValue | undefined {\n  if (typeof raw !== \"string\" || raw === \"\") return undefined;\n  return (\n    parseWorkloadValue(raw) ?? {\n      mode: \"url\",\n      source: parseSecretRef(raw)!,\n    }\n  );\n}\n\nfunction workloadHost(target: EndpointTarget) {\n  if (!target.name) {\n    throw new Error(\"Endpoint workload mode requires a workload name\");\n  }\n  return target.namespace\n    ? `${target.name}.${target.namespace}`\n    : target.name;\n}\n\nfunction validateWorkloadValue(value: EndpointWorkloadValue) {\n  if (value.mode === \"ingress\" && value.target.kind !== \"ingress\") {\n    throw new Error(\"Ingress endpoint mode requires an ingress target\");\n  }\n  if (\n    value.mode !== \"ingress\" &&\n    value.mode !== \"port-forward\" &&\n    value.target.kind !== \"service\"\n  ) {\n    throw new Error(`${value.mode} endpoint mode requires a service target`);\n  }\n  if (\n    value.mode === \"port-forward\" &&\n    ![\"service\", \"deployment\"].includes(value.target.kind)\n  ) {\n    throw new Error(\n      \"Port-forward endpoint mode requires a service or deployment target\",\n    );\n  }\n  if (value.port && !validPort(value.port)) {\n    throw new Error(\n      `Endpoint port \"${value.port}\" must be between 1 and 65535`,\n    );\n  }\n  if (value.path && !value.path.startsWith(\"/\")) {\n    throw new Error(`Endpoint path \"${value.path}\" must start with /`);\n  }\n}\n\nexport function serializeEndpointValue(\n  value: EndpointSelectorValue | undefined,\n): string {\n  if (!value) return \"\";\n  if (value.mode === \"url\") return serializeSecretRef(value.source);\n  validateWorkloadValue(value);\n  const scheme = MODE_TO_SCHEME[value.mode];\n  const port = value.port ? `:${value.port}` : \"\";\n  const path = value.path ?? \"\";\n  const kind =\n    value.mode === \"port-forward\" && value.target.kind === \"deployment\"\n      ? \"?kind=deployment\"\n      : \"\";\n  return `${scheme}://${workloadHost(value.target)}${port}${path}${kind}`;\n}\n"],"names":[],"mappings":"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"}

package/dist/components/FilterBar.cjs

@@ -230,9 +230,28 @@ function FilterBarFilterPanelContent({
     filter.kind === "enum" && /* @__PURE__ */ jsxRuntime.jsx(EnumFilterField, { filter, grow: true }),
     filter.kind === "boolean" && /* @__PURE__ */ jsxRuntime.jsx(BooleanFilterField, { filter }),
     filter.kind === "tristate" && /* @__PURE__ */ jsxRuntime.jsx(TriStateFilterField, { filter }),
+    filter.kind === "date-range" && /* @__PURE__ */ jsxRuntime.jsx(
+      FilterBarRangePanel,
+      {
+        kind: filter.timeEnabled === false ? "date" : "time",
+        label: filter.label,
+        ...dateRangeFilterProps(filter)
+      }
+    ),
     filter.kind === "text" && /* @__PURE__ */ jsxRuntime.jsx(TextFilterField, { filter, grow: true })
   ] });
 }
+function dateRangeFilterProps(filter) {
+  const {
+    key: _key,
+    kind: _kind,
+    label: _label,
+    icon: _icon,
+    description: _description,
+    ...range
+  } = filter;
+  return range;
+}
 function renderFilterField(filter, grow) {
   if (filter.kind === "lookup") {
     return /* @__PURE__ */ jsxRuntime.jsx(LookupFilterField, { filter, grow });
@@ -261,6 +280,16 @@ function renderFilterField(filter, grow) {
   if (filter.kind === "tristate") {
     return /* @__PURE__ */ jsxRuntime.jsx(TriStateFilterField, { filter });
   }
+  if (filter.kind === "date-range") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      RangeControlButton,
+      {
+        kind: filter.timeEnabled === false ? "date" : "time",
+        label: filter.label,
+        ...dateRangeFilterProps(filter)
+      }
+    );
+  }
   return /* @__PURE__ */ jsxRuntime.jsx(TextFilterField, { filter, grow });
 }
 function OverflowFiltersMenu({
@@ -452,6 +481,16 @@ function OverflowFiltersMenu({
   );
 }
 function FilterBarKeyValueControl({ filter }) {
+  if (filter.kind === "date-range") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      RangeControlButton,
+      {
+        kind: filter.timeEnabled === false ? "date" : "time",
+        label: filter.label,
+        ...dateRangeFilterProps(filter)
+      }
+    );
+  }
   if (filter.kind === "text") {
     return /* @__PURE__ */ jsxRuntime.jsx(TextFilterValueControl, { filter });
   }
@@ -656,7 +695,8 @@ function FilterBarRangePanel({
   timeZones,
   fromPlaceholder,
   toPlaceholder,
-  emptyLabel
+  emptyLabel,
+  disabled
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-72 p-3 text-popover-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(
     TimeRange.TimeRange,
@@ -667,6 +707,7 @@ function FilterBarRangePanel({
       from,
       to,
       onApply,
+      ...disabled !== void 0 ? { disabled } : {},
       ...presets ? { presets } : {},
       ...timeEnabled !== void 0 ? { timeEnabled } : {},
       ...timeZone ? { timeZone } : {},
@@ -1577,7 +1618,8 @@ function RangeControlButton({
   fromPlaceholder,
   toPlaceholder,
   emptyLabel,
-  className
+  className,
+  disabled
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     TimeRange.TimeRange,
@@ -1587,6 +1629,7 @@ function RangeControlButton({
       from,
       to,
       onApply,
+      ...disabled !== void 0 ? { disabled } : {},
       ...presets ? { presets } : {},
       ...timeEnabled !== void 0 ? { timeEnabled } : {},
       ...timeZone ? { timeZone } : {},
@@ -1762,10 +1805,15 @@ function formatRawNumber(value) {
 function createFilterValueMap(filters) {
   return Object.fromEntries(filters.map((filter) => [filter.key, filterBarFilterValue(filter)]));
 }
+function isStageableFilter(filter) {
+  return filter.kind !== "date-range";
+}
 function filterBarFilterValue(filter) {
+  if (!isStageableFilter(filter)) return void 0;
   return filter.value;
 }
 function filterWithStagedValue(filter, value, onChange) {
+  if (!isStageableFilter(filter)) return filter;
   if (filter.kind === "text") {
     return {
       ...filter,
@@ -1837,12 +1885,14 @@ function filterWithStagedValue(filter, value, onChange) {
 }
 function applyStagedFilterValues(filters, stagedValues) {
   for (const filter of filters) {
+    if (!isStageableFilter(filter)) continue;
     const next = Object.hasOwn(stagedValues, filter.key) ? stagedValues[filter.key] : filterBarFilterValue(filter);
     if (sameFilterBarValue(filterBarFilterValue(filter), next)) continue;
     applyFilterBarValue(filter, next);
   }
 }
 function applyFilterBarValue(filter, value) {
+  if (!isStageableFilter(filter)) return;
   if (filter.kind === "text" || filter.kind === "lookup" || filter.kind === "enum") {
     filter.onChange(String(value ?? ""));
     return;