@flanksource/clicky-ui 0.3.46 → 0.3.48

package/dist/overlay/DropdownMenuSubmenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenuSubmenu.js","sources":["../../src/overlay/DropdownMenuSubmenu.tsx"],"sourcesContent":["import { Fragment, useContext, useEffect, useRef, useState } from \"react\";\nimport {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingList,\n  FloatingNode,\n  FloatingPortal,\n  offset,\n  safePolygon,\n  shift,\n  useClick,\n  useDismiss,\n  useFloating,\n  useFloatingNodeId,\n  useFloatingParentNodeId,\n  useFloatingTree,\n  useHover,\n  useInteractions,\n  useListItem,\n  useListNavigation,\n  useMergeRefs,\n  useRole,\n  type UseInteractionsReturn,\n} from \"@floating-ui/react\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiChevronRight } from \"../icons\";\nimport { MENU_POPOVER_CLASS, MenuContext } from \"./dropdownMenuContext\";\nimport { useEscapeLayer, useFloatingZIndex } from \"./modalStack\";\nimport type { DropdownMenuItem } from \"./DropdownMenu\";\nimport { cn } from \"../lib/utils\";\n\n// Shared item surfaces so a leaf renders identically in the root menu or a\n// flyout submenu.\nconst MENU_ITEM_CLASS =\n  \"flex w-full items-center gap-2 px-3 py-1.5 text-left text-xs text-popover-foreground hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\";\nconst MENU_HEADER_CLASS =\n  \"select-none px-3 pb-1 pt-2 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\";\n\nfunction MenuItemIcon({\n  icon,\n  iconColor,\n  iconClassName,\n}: {\n  icon: string | StaticIconComponent | undefined;\n  iconColor: string | undefined;\n  iconClassName: string | undefined;\n}) {\n  if (!icon) return null;\n  return (\n    // `text-base` rather than inheriting the row: `Icon` sizes at 1em, so on a\n    // `text-xs` row the glyph came out at 12px — smaller than anything a caller\n    // puts in the label beside it, and too small to identify at a glance. The\n    // row's content box is already 16px tall, so this does not change its height.\n    <span\n      className={cn(\"inline-flex shrink-0 text-base\", iconClassName)}\n      style={iconColor ? { color: iconColor } : undefined}\n    >\n      <Icon {...(typeof icon === \"string\" ? { name: icon } : { icon })} />\n    </span>\n  );\n}\n\nfunction MenuLeaf({ item }: { item: DropdownMenuItem }) {\n  const menu = useContext(MenuContext);\n  const tree = useFloatingTree();\n  const listItem = useListItem();\n  const isActive = listItem.index === menu.activeIndex;\n\n  const activate = () => {\n    if (item.disabled) return;\n    item.onSelect();\n    // A selection closes every open level; each menu subscribes to \"click\".\n    tree?.events.emit(\"click\");\n  };\n\n  return (\n    <button\n      ref={listItem.ref}\n      type=\"button\"\n      role=\"menuitem\"\n      tabIndex={isActive ? 0 : -1}\n      disabled={item.disabled}\n      title={item.title}\n      className={MENU_ITEM_CLASS}\n      {...menu.getItemProps({\n        onClick: activate,\n        onFocus: () => menu.setHasFocusInside(true),\n        onKeyDown: (event) => {\n          if (event.key === \"Enter\" || event.key === \" \") {\n            event.preventDefault();\n            activate();\n          }\n        },\n      })}\n    >\n      <MenuItemIcon\n        icon={item.icon}\n        iconColor={item.iconColor}\n        iconClassName={item.iconClassName}\n      />\n      {item.label}\n    </button>\n  );\n}\n\nfunction MenuSubmenu({ item }: { item: DropdownMenuItem }) {\n  const parent = useContext(MenuContext);\n  const tree = useFloatingTree();\n  const nodeId = useFloatingNodeId();\n  const parentId = useFloatingParentNodeId();\n  const listItem = useListItem();\n\n  const [isOpen, setIsOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState<number | null>(null);\n  const [hasFocusInside, setHasFocusInside] = useState(false);\n  const elementsRef = useRef<Array<HTMLElement | null>>([]);\n  const floatingZ = useFloatingZIndex();\n\n  const { refs, floatingStyles, context } = useFloating<HTMLButtonElement>({\n    // nodeId is always defined inside the FloatingTree; guard for the type only.\n    ...(nodeId ? { nodeId } : {}),\n    open: isOpen,\n    onOpenChange: setIsOpen,\n    placement: \"right-start\",\n    middleware: [\n      offset({ mainAxis: 0, alignmentAxis: -4 }),\n      flip({ padding: 8 }),\n      shift({ padding: 8, crossAxis: true }),\n    ],\n    whileElementsMounted: autoUpdate,\n  });\n\n  const hover = useHover(context, {\n    delay: { open: 75 },\n    handleClose: safePolygon(),\n  });\n  // Hover opens the flyout for mouse users; click/tap also opens it (touch and\n  // keyboard) but never toggles it shut — leaving via safePolygon or selecting a\n  // leaf is what closes it.\n  const click = useClick(context, { toggle: false });\n  const role = useRole(context, { role: \"menu\" });\n  // Escape is owned by useEscapeLayer (below) so it dismisses one menu level at\n  // a time and cooperates with modals; useDismiss keeps outside-press dismissal.\n  const dismiss = useDismiss(context, { escapeKey: false, bubbles: true });\n  const listNav = useListNavigation(context, {\n    listRef: elementsRef,\n    activeIndex,\n    nested: true,\n    onNavigate: setActiveIndex,\n    loop: true,\n  });\n  const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions(\n    [hover, click, role, dismiss, listNav],\n  );\n\n  useEscapeLayer(isOpen, () => setIsOpen(false));\n\n  useEffect(() => {\n    if (!tree) return;\n    const closeAll = () => setIsOpen(false);\n    const closeSiblings = (event: {\n      nodeId: string;\n      parentId: string | null;\n    }) => {\n      if (event.nodeId !== nodeId && event.parentId === parentId) {\n        setIsOpen(false);\n      }\n    };\n    tree.events.on(\"click\", closeAll);\n    tree.events.on(\"menuopen\", closeSiblings);\n    return () => {\n      tree.events.off(\"click\", closeAll);\n      tree.events.off(\"menuopen\", closeSiblings);\n    };\n  }, [tree, nodeId, parentId]);\n\n  useEffect(() => {\n    if (isOpen && tree) tree.events.emit(\"menuopen\", { parentId, nodeId });\n  }, [isOpen, tree, nodeId, parentId]);\n\n  const isActive = listItem.index === parent.activeIndex;\n  const referenceRef = useMergeRefs([refs.setReference, listItem.ref]);\n  const ariaLabel = typeof item.label === \"string\" ? item.label : undefined;\n\n  return (\n    <FloatingNode id={nodeId}>\n      <button\n        ref={referenceRef}\n        type=\"button\"\n        role=\"menuitem\"\n        tabIndex={isActive ? 0 : -1}\n        disabled={item.disabled}\n        title={item.title}\n        aria-haspopup=\"menu\"\n        aria-expanded={isOpen}\n        data-focus-inside={hasFocusInside ? \"\" : undefined}\n        className={MENU_ITEM_CLASS}\n        {...parent.getItemProps(\n          // Merge the parent's roving-tabindex props with this trigger's own\n          // reference props (open on hover/click/ArrowRight). Both prop-getters\n          // return an opaque prop bag; the cast bridges the two getter\n          // signatures (getReferenceProps -> getItemProps parameter).\n          getReferenceProps({\n            onFocus: () => {\n              setHasFocusInside(false);\n              parent.setHasFocusInside(true);\n            },\n          }) as unknown as Parameters<UseInteractionsReturn[\"getItemProps\"]>[0],\n        )}\n      >\n        <MenuItemIcon\n          icon={item.icon}\n          iconColor={item.iconColor}\n          iconClassName={item.iconClassName}\n        />\n        <span className=\"min-w-0 flex-1 truncate\">{item.label}</span>\n        <Icon icon={UiChevronRight} className=\"ml-auto shrink-0 opacity-60\" />\n      </button>\n      <MenuContext.Provider\n        value={{\n          getItemProps,\n          activeIndex,\n          setActiveIndex,\n          setHasFocusInside,\n          isOpen,\n        }}\n      >\n        <FloatingList elementsRef={elementsRef}>\n          {isOpen && (\n            <FloatingPortal>\n              <FloatingFocusManager\n                context={context}\n                modal={false}\n                initialFocus={-1}\n                returnFocus={false}\n              >\n                <div\n                  ref={refs.setFloating}\n                  role=\"menu\"\n                  style={{ ...floatingStyles, zIndex: floatingZ }}\n                  className={MENU_POPOVER_CLASS}\n                  {...getFloatingProps()}\n                  aria-label={ariaLabel}\n                  {...(ariaLabel ? { \"aria-labelledby\": undefined } : {})}\n                >\n                  {item.header != null && (\n                    <div className=\"border-b border-border px-3 py-1.5\">\n                      {item.header}\n                    </div>\n                  )}\n                  <MenuItemList items={item.children ?? []} />\n                </div>\n              </FloatingFocusManager>\n            </FloatingPortal>\n          )}\n        </FloatingList>\n      </MenuContext.Provider>\n    </FloatingNode>\n  );\n}\n\n/**\n * Renders one menu level: a leaf `menuitem` button, or a submenu trigger when\n * the item has `children`. A group header renders above the first item of each\n * contiguous group (headers are not focusable, so keyboard navigation stays\n * dense over the interactive items). Must be rendered inside a `FloatingList`\n * whose `elementsRef` backs the enclosing menu's list navigation.\n */\nexport function MenuItemList({ items }: { items: DropdownMenuItem[] }) {\n  return (\n    <>\n      {items.map((item, index) => {\n        const showHeader =\n          item.group != null && item.group !== items[index - 1]?.group;\n        const hasChildren = !!item.children && item.children.length > 0;\n        return (\n          <Fragment key={index}>\n            {showHeader && (\n              <div role=\"presentation\" className={MENU_HEADER_CLASS}>\n                {item.group}\n              </div>\n            )}\n            {hasChildren ? (\n              <MenuSubmenu item={item} />\n            ) : (\n              <MenuLeaf item={item} />\n            )}\n          </Fragment>\n        );\n      })}\n    </>\n  );\n}\n"],"names":["Fragment"],"mappings":"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"}
+{"version":3,"file":"DropdownMenuSubmenu.js","sources":["../../src/overlay/DropdownMenuSubmenu.tsx"],"sourcesContent":["import { Fragment, useContext, useEffect, useRef, useState } from \"react\";\nimport {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingList,\n  FloatingNode,\n  FloatingPortal,\n  offset,\n  safePolygon,\n  shift,\n  useClick,\n  useDismiss,\n  useFloating,\n  useFloatingNodeId,\n  useFloatingParentNodeId,\n  useFloatingTree,\n  useHover,\n  useInteractions,\n  useListItem,\n  useListNavigation,\n  useMergeRefs,\n  useRole,\n  type UseInteractionsReturn,\n} from \"@floating-ui/react\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiChevronRight } from \"../icons\";\nimport { MENU_POPOVER_CLASS, MenuContext } from \"./dropdownMenuContext\";\nimport { useEscapeLayer, useFloatingZIndex } from \"./modalStack\";\nimport type { DropdownMenuItem } from \"./DropdownMenu\";\nimport { cn } from \"../lib/utils\";\n\n// Shared item surfaces so a leaf renders identically in the root menu or a\n// flyout submenu.\nconst MENU_ITEM_CLASS =\n  \"flex w-full items-center gap-2 px-3 py-1.5 text-left text-xs text-popover-foreground hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\";\nconst MENU_HEADER_CLASS =\n  \"select-none px-3 pb-1 pt-2 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\";\n\nfunction MenuItemIcon({\n  icon,\n  iconColor,\n  iconClassName,\n}: {\n  icon: string | StaticIconComponent | undefined;\n  iconColor: string | undefined;\n  iconClassName: string | undefined;\n}) {\n  if (!icon) return null;\n  return (\n    // `text-base` rather than inheriting the row: `Icon` sizes at 1em, so on a\n    // `text-xs` row the glyph came out at 12px — smaller than anything a caller\n    // puts in the label beside it, and too small to identify at a glance. The\n    // row's content box is already 16px tall, so this does not change its height.\n    <span\n      className={cn(\"inline-flex shrink-0 text-base\", iconClassName)}\n      style={iconColor ? { color: iconColor } : undefined}\n    >\n      <Icon {...(typeof icon === \"string\" ? { name: icon } : { icon })} />\n    </span>\n  );\n}\n\nfunction MenuLeaf({ item }: { item: DropdownMenuItem }) {\n  const menu = useContext(MenuContext);\n  const tree = useFloatingTree();\n  const listItem = useListItem();\n  const isActive = listItem.index === menu.activeIndex;\n\n  const activate = () => {\n    if (item.disabled) return;\n    item.onSelect();\n    // A selection closes every open level; each menu subscribes to \"click\".\n    tree?.events.emit(\"click\");\n  };\n\n  return (\n    <button\n      ref={listItem.ref}\n      type=\"button\"\n      role=\"menuitem\"\n      tabIndex={isActive ? 0 : -1}\n      disabled={item.disabled}\n      title={item.title}\n      className={MENU_ITEM_CLASS}\n      {...menu.getItemProps({\n        onClick: activate,\n        onFocus: () => menu.setHasFocusInside(true),\n        onKeyDown: (event) => {\n          if (event.key === \"Enter\" || event.key === \" \") {\n            event.preventDefault();\n            activate();\n          }\n        },\n      })}\n    >\n      <MenuItemIcon\n        icon={item.icon}\n        iconColor={item.iconColor}\n        iconClassName={item.iconClassName}\n      />\n      {item.label}\n    </button>\n  );\n}\n\nfunction MenuSubmenu({ item }: { item: DropdownMenuItem }) {\n  const parent = useContext(MenuContext);\n  const tree = useFloatingTree();\n  const nodeId = useFloatingNodeId();\n  const parentId = useFloatingParentNodeId();\n  const listItem = useListItem();\n\n  const [isOpen, setIsOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState<number | null>(null);\n  const [hasFocusInside, setHasFocusInside] = useState(false);\n  const elementsRef = useRef<Array<HTMLElement | null>>([]);\n  const floatingZ = useFloatingZIndex();\n\n  const { refs, floatingStyles, context } = useFloating<HTMLButtonElement>({\n    // nodeId is always defined inside the FloatingTree; guard for the type only.\n    ...(nodeId ? { nodeId } : {}),\n    open: isOpen,\n    onOpenChange: setIsOpen,\n    placement: \"right-start\",\n    middleware: [\n      offset({ mainAxis: 0, alignmentAxis: -4 }),\n      flip({ padding: 8 }),\n      shift({ padding: 8, crossAxis: true }),\n    ],\n    whileElementsMounted: autoUpdate,\n  });\n\n  const hover = useHover(context, {\n    delay: { open: 75 },\n    handleClose: safePolygon(),\n  });\n  // Hover opens the flyout for mouse users; click/tap also opens it (touch and\n  // keyboard) but never toggles it shut — leaving via safePolygon or selecting a\n  // leaf is what closes it.\n  const click = useClick(context, { toggle: false });\n  const role = useRole(context, { role: \"menu\" });\n  // Escape is owned by useEscapeLayer (below) so it dismisses one menu level at\n  // a time and cooperates with modals; useDismiss keeps outside-press dismissal.\n  const dismiss = useDismiss(context, { escapeKey: false, bubbles: true });\n  const listNav = useListNavigation(context, {\n    listRef: elementsRef,\n    activeIndex,\n    nested: true,\n    onNavigate: setActiveIndex,\n    loop: true,\n  });\n  const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions(\n    [hover, click, role, dismiss, listNav],\n  );\n\n  useEscapeLayer(isOpen, () => context.onOpenChange(false));\n\n  useEffect(() => {\n    if (!tree) return;\n    const closeAll = () => context.onOpenChange(false);\n    const closeSiblings = (event: {\n      nodeId: string;\n      parentId: string | null;\n    }) => {\n      if (event.nodeId !== nodeId && event.parentId === parentId) {\n        context.onOpenChange(false);\n      }\n    };\n    tree.events.on(\"click\", closeAll);\n    tree.events.on(\"menuopen\", closeSiblings);\n    return () => {\n      tree.events.off(\"click\", closeAll);\n      tree.events.off(\"menuopen\", closeSiblings);\n    };\n  }, [tree, nodeId, parentId, context.onOpenChange]);\n\n  useEffect(() => {\n    if (isOpen && tree) tree.events.emit(\"menuopen\", { parentId, nodeId });\n  }, [isOpen, tree, nodeId, parentId]);\n\n  const isActive = listItem.index === parent.activeIndex;\n  const referenceRef = useMergeRefs([refs.setReference, listItem.ref]);\n  const ariaLabel = typeof item.label === \"string\" ? item.label : undefined;\n\n  return (\n    <FloatingNode id={nodeId}>\n      <button\n        ref={referenceRef}\n        type=\"button\"\n        role=\"menuitem\"\n        tabIndex={isActive ? 0 : -1}\n        disabled={item.disabled}\n        title={item.title}\n        aria-haspopup=\"menu\"\n        aria-expanded={isOpen}\n        data-focus-inside={hasFocusInside ? \"\" : undefined}\n        className={MENU_ITEM_CLASS}\n        {...parent.getItemProps(\n          // Merge the parent's roving-tabindex props with this trigger's own\n          // reference props (open on hover/click/ArrowRight). Both prop-getters\n          // return an opaque prop bag; the cast bridges the two getter\n          // signatures (getReferenceProps -> getItemProps parameter).\n          getReferenceProps({\n            onFocus: () => {\n              setHasFocusInside(false);\n              parent.setHasFocusInside(true);\n            },\n          }) as unknown as Parameters<UseInteractionsReturn[\"getItemProps\"]>[0],\n        )}\n      >\n        <MenuItemIcon\n          icon={item.icon}\n          iconColor={item.iconColor}\n          iconClassName={item.iconClassName}\n        />\n        <span className=\"min-w-0 flex-1 truncate\">{item.label}</span>\n        <Icon icon={UiChevronRight} className=\"ml-auto shrink-0 opacity-60\" />\n      </button>\n      <MenuContext.Provider\n        value={{\n          getItemProps,\n          activeIndex,\n          setActiveIndex,\n          setHasFocusInside,\n          isOpen,\n        }}\n      >\n        <FloatingList elementsRef={elementsRef}>\n          {isOpen && (\n            <FloatingPortal>\n              <FloatingFocusManager\n                context={context}\n                modal={false}\n                initialFocus={-1}\n                returnFocus={false}\n              >\n                <div\n                  ref={refs.setFloating}\n                  role=\"menu\"\n                  style={{ ...floatingStyles, zIndex: floatingZ }}\n                  className={MENU_POPOVER_CLASS}\n                  {...getFloatingProps()}\n                  aria-label={ariaLabel}\n                  {...(ariaLabel ? { \"aria-labelledby\": undefined } : {})}\n                >\n                  {item.header != null && (\n                    <div className=\"border-b border-border px-3 py-1.5\">\n                      {item.header}\n                    </div>\n                  )}\n                  <MenuItemList items={item.children ?? []} />\n                </div>\n              </FloatingFocusManager>\n            </FloatingPortal>\n          )}\n        </FloatingList>\n      </MenuContext.Provider>\n    </FloatingNode>\n  );\n}\n\n/**\n * Renders one menu level: a leaf `menuitem` button, or a submenu trigger when\n * the item has `children`. A group header renders above the first item of each\n * contiguous group (headers are not focusable, so keyboard navigation stays\n * dense over the interactive items). Must be rendered inside a `FloatingList`\n * whose `elementsRef` backs the enclosing menu's list navigation.\n */\nexport function MenuItemList({ items }: { items: DropdownMenuItem[] }) {\n  return (\n    <>\n      {items.map((item, index) => {\n        const showHeader =\n          item.group != null && item.group !== items[index - 1]?.group;\n        const hasChildren = !!item.children && item.children.length > 0;\n        return (\n          <Fragment key={index}>\n            {showHeader && (\n              <div role=\"presentation\" className={MENU_HEADER_CLASS}>\n                {item.group}\n              </div>\n            )}\n            {hasChildren ? (\n              <MenuSubmenu item={item} />\n            ) : (\n              <MenuLeaf item={item} />\n            )}\n          </Fragment>\n        );\n      })}\n    </>\n  );\n}\n"],"names":["Fragment"],"mappings":"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"}

package/dist/rpc/FilterForm.cjs

@@ -27,6 +27,7 @@ function FilterForm({
   showSubmit = true,
   excludedParameterNames = [],
   presentation = "form",
+  onChange,
   onSubmit
 }) {
   var _a;
@@ -48,6 +49,14 @@ function FilterForm({
   const [error, setError] = react.useState("");
   const debouncedValues = formMetadata.useDebouncedRecord(values, 250);
   const lastAutoSubmitted = react.useRef(null);
+  const onChangeRef = react.useRef(onChange);
+  react.useEffect(() => {
+    onChangeRef.current = onChange;
+  });
+  react.useEffect(() => {
+    var _a2;
+    (_a2 = onChangeRef.current) == null ? void 0 : _a2.call(onChangeRef, values);
+  }, [values]);
   const lookupParameters = react.useMemo(
     () => formMetadata.packLookupParameterValues(debouncedValues, parameters),
     [debouncedValues, parameters]

package/dist/rpc/FilterForm.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FilterForm.cjs","sources":["../../src/rpc/FilterForm.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, type FormEvent } from \"react\";\nimport { keepPreviousData, useQuery } from \"@tanstack/react-query\";\nimport { Button } from \"../components/button\";\nimport { FilterBar } from \"../components/FilterBar\";\nimport {\n  packLookupParameterValues,\n  parametersToFormConfig,\n  pruneParameterValues,\n  buildInitialParameterValues,\n  titleCase,\n  useDebouncedRecord,\n  type ParameterValues,\n} from \"./formMetadata\";\nimport type { OpenAPIParameter } from \"./types\";\nimport { useOpenAPI, type OperationsApiClient } from \"./useOperations\";\nimport { ParameterGrid } from \"./FilterFormFields\";\n\nexport type FilterFormProps = {\n  client: OperationsApiClient;\n  path: string;\n  method: string;\n  parameters?: OpenAPIParameter[];\n  initialValues?: ParameterValues | undefined;\n  lockedValues?: ParameterValues | undefined;\n  hideLocked?: boolean | undefined;\n  enableLookup?: boolean | undefined;\n  autoSubmit?: boolean | undefined;\n  submitLabel?: string | undefined;\n  submittingLabel?: string | undefined;\n  emptyMessage?: string | undefined;\n  isSubmitting?: boolean | undefined;\n  className?: string | undefined;\n  formId?: string | undefined;\n  showSubmit?: boolean | undefined;\n  excludedParameterNames?: string[] | undefined;\n  /** Renders operation controls as form rows or the shared table FilterBar. */\n  presentation?: \"form\" | \"filter-bar\" | undefined;\n  onSubmit: (values: ParameterValues) => void | Promise<void>;\n};\n\nexport function FilterForm({\n  client,\n  path,\n  method,\n  parameters = [],\n  initialValues = {},\n  lockedValues = {},\n  hideLocked = false,\n  enableLookup = method.toUpperCase() === \"GET\",\n  autoSubmit = false,\n  submitLabel = \"Execute request\",\n  submittingLabel = \"Executing…\",\n  emptyMessage = \"This operation does not require input.\",\n  isSubmitting = false,\n  className,\n  formId,\n  showSubmit = true,\n  excludedParameterNames = [],\n  presentation = \"form\",\n  onSubmit,\n}: FilterFormProps) {\n  const resetKey = useMemo(\n    () =>\n      `${method}:${path}:${JSON.stringify(initialValues)}:${JSON.stringify(\n        lockedValues\n      )}`,\n    [initialValues, lockedValues, method, path]\n  );\n  const visibleParameters = useMemo(\n    () =>\n      parameters.filter(\n        (parameter) => !excludedParameterNames.includes(parameter.name)\n      ),\n    [excludedParameterNames, parameters]\n  );\n  const [values, setValues] = useState<ParameterValues>(() =>\n    buildInitialParameterValues(parameters, method, lockedValues, initialValues)\n  );\n  const [error, setError] = useState(\"\");\n  const debouncedValues = useDebouncedRecord(values, 250);\n  const lastAutoSubmitted = useRef<string | null>(null);\n  const lookupParameters = useMemo(\n    () => packLookupParameterValues(debouncedValues, parameters),\n    [debouncedValues, parameters]\n  );\n\n  const lookupQuery = useQuery({\n    queryKey: [\"filter-form-lookup\", method, path, lookupParameters],\n    queryFn: async () =>\n      (await client.lookupFilters?.(path, method, lookupParameters, {\n        Accept: \"application/json+clicky\",\n      })) ?? { filters: {} },\n    enabled:\n      enableLookup &&\n      !!client.lookupFilters &&\n      parameters.some((param) => param.in === \"query\"),\n    placeholderData: keepPreviousData,\n    staleTime: 30_000,\n    retry: 0,\n  });\n\n  // Shapes come from the spec so a control keeps its identity while the lookup\n  // that fills it is in flight; see parametersToFormConfig.\n  const { data: spec } = useOpenAPI(client);\n  const filterShapes = spec?.components?.[\"x-clicky-filters\"];\n\n  const formConfig = useMemo(\n    () =>\n      parametersToFormConfig(visibleParameters, values, setValues, {\n        lookup: lookupQuery.data,\n        components: filterShapes,\n        lockedValues,\n        hideLocked,\n      }),\n    [\n      filterShapes,\n      hideLocked,\n      lockedValues,\n      lookupQuery.data,\n      visibleParameters,\n      values,\n    ]\n  );\n\n  const hasFields =\n    formConfig.filters.length > 0 ||\n    formConfig.search != null ||\n    formConfig.timeRange != null;\n\n  async function handleSubmit(event?: FormEvent) {\n    event?.preventDefault();\n\n    const missingRequired = parameters.filter((param) => {\n      if (!param.required) return false;\n      const value = lockedValues[param.name] ?? values[param.name] ?? \"\";\n      return value.trim() === \"\";\n    });\n\n    if (missingRequired.length > 0) {\n      setError(\n        `Missing required fields: ${missingRequired\n          .map((param) => titleCase(param.name))\n          .join(\", \")}`\n      );\n      return;\n    }\n\n    setError(\"\");\n    await onSubmit(pruneParameterValues(values));\n  }\n\n  useEffect(() => {\n    setValues(\n      buildInitialParameterValues(\n        parameters,\n        method,\n        lockedValues,\n        initialValues\n      )\n    );\n    setError(\"\");\n    lastAutoSubmitted.current = null;\n  }, [resetKey]);\n\n  useEffect(() => {\n    if (!autoSubmit) {\n      return;\n    }\n\n    const missingRequired = parameters.filter((param) => {\n      if (!param.required) return false;\n      const value =\n        lockedValues[param.name] ?? debouncedValues[param.name] ?? \"\";\n      return value.trim() === \"\";\n    });\n    if (missingRequired.length > 0) {\n      return;\n    }\n\n    const submittedValues = pruneParameterValues(debouncedValues);\n    const signature = JSON.stringify(submittedValues);\n    if (lastAutoSubmitted.current === signature) {\n      return;\n    }\n\n    lastAutoSubmitted.current = signature;\n    setError(\"\");\n    void onSubmit(submittedValues);\n  }, [autoSubmit, debouncedValues, lockedValues, onSubmit, parameters]);\n\n  return (\n    <form id={formId} className=\"space-y-3\" onSubmit={handleSubmit}>\n      {hasFields ? (\n        presentation === \"filter-bar\" ? (\n          <FilterBar\n            autoSubmit={autoSubmit}\n            filters={formConfig.filters}\n            overflowMode=\"wrap\"\n            {...(formConfig.search ? { search: formConfig.search } : {})}\n            {...(formConfig.timeRange\n              ? { timeRange: formConfig.timeRange }\n              : {})}\n            {...(!autoSubmit\n              ? {\n                  onApply: () => void handleSubmit(),\n                  applyLabel: submitLabel,\n                  isPending: isSubmitting,\n                }\n              : {})}\n            {...(className ? { className } : {})}\n          />\n        ) : (\n          <ParameterGrid\n            autoSubmit={autoSubmit}\n            filters={formConfig.filters}\n            isSubmitting={isSubmitting}\n            submitLabel={submitLabel}\n            submittingLabel={submittingLabel}\n            showSubmit={showSubmit}\n            {...(formConfig.timeRange\n              ? { timeRange: formConfig.timeRange }\n              : {})}\n            {...(className ? { className } : {})}\n          />\n        )\n      ) : (\n        <div className=\"flex items-center justify-between gap-4\">\n          <p className=\"text-sm text-muted-foreground\">{emptyMessage}</p>\n          {showSubmit ? (\n            <Button\n              type=\"button\"\n              onClick={handleSubmit}\n              disabled={isSubmitting}\n            >\n              {isSubmitting ? submittingLabel : submitLabel}\n            </Button>\n          ) : null}\n        </div>\n      )}\n\n      {error && (\n        <div className=\"rounded-md border border-destructive/40 bg-destructive/5 p-3 text-sm text-destructive\">\n          {error}\n        </div>\n      )}\n    </form>\n  );\n}\n"],"names":["useMemo","useState","buildInitialParameterValues","useDebouncedRecord","useRef","packLookupParameterValues","useQuery","_a","keepPreviousData","useOpenAPI","parametersToFormConfig","titleCase","pruneParameterValues","useEffect","jsx","FilterBar","ParameterGrid","jsxs","Button"],"mappings":"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"}
+{"version":3,"file":"FilterForm.cjs","sources":["../../src/rpc/FilterForm.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, type FormEvent } from \"react\";\nimport { keepPreviousData, useQuery } from \"@tanstack/react-query\";\nimport { Button } from \"../components/button\";\nimport { FilterBar } from \"../components/FilterBar\";\nimport {\n  packLookupParameterValues,\n  parametersToFormConfig,\n  pruneParameterValues,\n  buildInitialParameterValues,\n  titleCase,\n  useDebouncedRecord,\n  type ParameterValues,\n} from \"./formMetadata\";\nimport type { OpenAPIParameter } from \"./types\";\nimport { useOpenAPI, type OperationsApiClient } from \"./useOperations\";\nimport { ParameterGrid } from \"./FilterFormFields\";\n\nexport type FilterFormProps = {\n  client: OperationsApiClient;\n  path: string;\n  method: string;\n  parameters?: OpenAPIParameter[];\n  initialValues?: ParameterValues | undefined;\n  lockedValues?: ParameterValues | undefined;\n  hideLocked?: boolean | undefined;\n  enableLookup?: boolean | undefined;\n  autoSubmit?: boolean | undefined;\n  submitLabel?: string | undefined;\n  submittingLabel?: string | undefined;\n  emptyMessage?: string | undefined;\n  isSubmitting?: boolean | undefined;\n  className?: string | undefined;\n  formId?: string | undefined;\n  showSubmit?: boolean | undefined;\n  excludedParameterNames?: string[] | undefined;\n  /** Renders operation controls as form rows or the shared table FilterBar. */\n  presentation?: \"form\" | \"filter-bar\" | undefined;\n  /** Called with the current values whenever they change, starting with the\n   *  initial values, so the form can act as a controlled field set inside a\n   *  host form (pair with showSubmit={false}). */\n  onChange?: ((values: ParameterValues) => void) | undefined;\n  onSubmit: (values: ParameterValues) => void | Promise<void>;\n};\n\nexport function FilterForm({\n  client,\n  path,\n  method,\n  parameters = [],\n  initialValues = {},\n  lockedValues = {},\n  hideLocked = false,\n  enableLookup = method.toUpperCase() === \"GET\",\n  autoSubmit = false,\n  submitLabel = \"Execute request\",\n  submittingLabel = \"Executing…\",\n  emptyMessage = \"This operation does not require input.\",\n  isSubmitting = false,\n  className,\n  formId,\n  showSubmit = true,\n  excludedParameterNames = [],\n  presentation = \"form\",\n  onChange,\n  onSubmit,\n}: FilterFormProps) {\n  const resetKey = useMemo(\n    () =>\n      `${method}:${path}:${JSON.stringify(initialValues)}:${JSON.stringify(\n        lockedValues\n      )}`,\n    [initialValues, lockedValues, method, path]\n  );\n  const visibleParameters = useMemo(\n    () =>\n      parameters.filter(\n        (parameter) => !excludedParameterNames.includes(parameter.name)\n      ),\n    [excludedParameterNames, parameters]\n  );\n  const [values, setValues] = useState<ParameterValues>(() =>\n    buildInitialParameterValues(parameters, method, lockedValues, initialValues)\n  );\n  const [error, setError] = useState(\"\");\n  const debouncedValues = useDebouncedRecord(values, 250);\n  const lastAutoSubmitted = useRef<string | null>(null);\n  // The latest callback is read from a ref so a host passing an inline\n  // function is notified per value change, not per render.\n  const onChangeRef = useRef(onChange);\n  useEffect(() => {\n    onChangeRef.current = onChange;\n  });\n  useEffect(() => {\n    onChangeRef.current?.(values);\n  }, [values]);\n  const lookupParameters = useMemo(\n    () => packLookupParameterValues(debouncedValues, parameters),\n    [debouncedValues, parameters]\n  );\n\n  const lookupQuery = useQuery({\n    queryKey: [\"filter-form-lookup\", method, path, lookupParameters],\n    queryFn: async () =>\n      (await client.lookupFilters?.(path, method, lookupParameters, {\n        Accept: \"application/json+clicky\",\n      })) ?? { filters: {} },\n    enabled:\n      enableLookup &&\n      !!client.lookupFilters &&\n      parameters.some((param) => param.in === \"query\"),\n    placeholderData: keepPreviousData,\n    staleTime: 30_000,\n    retry: 0,\n  });\n\n  // Shapes come from the spec so a control keeps its identity while the lookup\n  // that fills it is in flight; see parametersToFormConfig.\n  const { data: spec } = useOpenAPI(client);\n  const filterShapes = spec?.components?.[\"x-clicky-filters\"];\n\n  const formConfig = useMemo(\n    () =>\n      parametersToFormConfig(visibleParameters, values, setValues, {\n        lookup: lookupQuery.data,\n        components: filterShapes,\n        lockedValues,\n        hideLocked,\n      }),\n    [\n      filterShapes,\n      hideLocked,\n      lockedValues,\n      lookupQuery.data,\n      visibleParameters,\n      values,\n    ]\n  );\n\n  const hasFields =\n    formConfig.filters.length > 0 ||\n    formConfig.search != null ||\n    formConfig.timeRange != null;\n\n  async function handleSubmit(event?: FormEvent) {\n    event?.preventDefault();\n\n    const missingRequired = parameters.filter((param) => {\n      if (!param.required) return false;\n      const value = lockedValues[param.name] ?? values[param.name] ?? \"\";\n      return value.trim() === \"\";\n    });\n\n    if (missingRequired.length > 0) {\n      setError(\n        `Missing required fields: ${missingRequired\n          .map((param) => titleCase(param.name))\n          .join(\", \")}`\n      );\n      return;\n    }\n\n    setError(\"\");\n    await onSubmit(pruneParameterValues(values));\n  }\n\n  useEffect(() => {\n    setValues(\n      buildInitialParameterValues(\n        parameters,\n        method,\n        lockedValues,\n        initialValues\n      )\n    );\n    setError(\"\");\n    lastAutoSubmitted.current = null;\n  }, [resetKey]);\n\n  useEffect(() => {\n    if (!autoSubmit) {\n      return;\n    }\n\n    const missingRequired = parameters.filter((param) => {\n      if (!param.required) return false;\n      const value =\n        lockedValues[param.name] ?? debouncedValues[param.name] ?? \"\";\n      return value.trim() === \"\";\n    });\n    if (missingRequired.length > 0) {\n      return;\n    }\n\n    const submittedValues = pruneParameterValues(debouncedValues);\n    const signature = JSON.stringify(submittedValues);\n    if (lastAutoSubmitted.current === signature) {\n      return;\n    }\n\n    lastAutoSubmitted.current = signature;\n    setError(\"\");\n    void onSubmit(submittedValues);\n  }, [autoSubmit, debouncedValues, lockedValues, onSubmit, parameters]);\n\n  return (\n    <form id={formId} className=\"space-y-3\" onSubmit={handleSubmit}>\n      {hasFields ? (\n        presentation === \"filter-bar\" ? (\n          <FilterBar\n            autoSubmit={autoSubmit}\n            filters={formConfig.filters}\n            overflowMode=\"wrap\"\n            {...(formConfig.search ? { search: formConfig.search } : {})}\n            {...(formConfig.timeRange\n              ? { timeRange: formConfig.timeRange }\n              : {})}\n            {...(!autoSubmit\n              ? {\n                  onApply: () => void handleSubmit(),\n                  applyLabel: submitLabel,\n                  isPending: isSubmitting,\n                }\n              : {})}\n            {...(className ? { className } : {})}\n          />\n        ) : (\n          <ParameterGrid\n            autoSubmit={autoSubmit}\n            filters={formConfig.filters}\n            isSubmitting={isSubmitting}\n            submitLabel={submitLabel}\n            submittingLabel={submittingLabel}\n            showSubmit={showSubmit}\n            {...(formConfig.timeRange\n              ? { timeRange: formConfig.timeRange }\n              : {})}\n            {...(className ? { className } : {})}\n          />\n        )\n      ) : (\n        <div className=\"flex items-center justify-between gap-4\">\n          <p className=\"text-sm text-muted-foreground\">{emptyMessage}</p>\n          {showSubmit ? (\n            <Button\n              type=\"button\"\n              onClick={handleSubmit}\n              disabled={isSubmitting}\n            >\n              {isSubmitting ? submittingLabel : submitLabel}\n            </Button>\n          ) : null}\n        </div>\n      )}\n\n      {error && (\n        <div className=\"rounded-md border border-destructive/40 bg-destructive/5 p-3 text-sm text-destructive\">\n          {error}\n        </div>\n      )}\n    </form>\n  );\n}\n"],"names":["useMemo","useState","buildInitialParameterValues","useDebouncedRecord","useRef","useEffect","_a","packLookupParameterValues","useQuery","keepPreviousData","useOpenAPI","parametersToFormConfig","titleCase","pruneParameterValues","jsx","FilterBar","ParameterGrid","jsxs","Button"],"mappings":"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"}

package/dist/rpc/FilterForm.d.ts

@@ -21,7 +21,11 @@ export type FilterFormProps = {
     excludedParameterNames?: string[] | undefined;
     /** Renders operation controls as form rows or the shared table FilterBar. */
     presentation?: "form" | "filter-bar" | undefined;
+    /** Called with the current values whenever they change, starting with the
+     *  initial values, so the form can act as a controlled field set inside a
+     *  host form (pair with showSubmit={false}). */
+    onChange?: ((values: ParameterValues) => void) | undefined;
     onSubmit: (values: ParameterValues) => void | Promise<void>;
 };
-export declare function FilterForm({ client, path, method, parameters, initialValues, lockedValues, hideLocked, enableLookup, autoSubmit, submitLabel, submittingLabel, emptyMessage, isSubmitting, className, formId, showSubmit, excludedParameterNames, presentation, onSubmit, }: FilterFormProps): import("react").JSX.Element;
+export declare function FilterForm({ client, path, method, parameters, initialValues, lockedValues, hideLocked, enableLookup, autoSubmit, submitLabel, submittingLabel, emptyMessage, isSubmitting, className, formId, showSubmit, excludedParameterNames, presentation, onChange, onSubmit, }: FilterFormProps): import("react").JSX.Element;
 //# sourceMappingURL=FilterForm.d.ts.map

package/dist/rpc/FilterForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilterForm.d.ts","sourceRoot":"","sources":["../../src/rpc/FilterForm.tsx"],"names":[],"mappings":"AAIA,OAAO,EAOL,KAAK,eAAe,EACrB,MAAM,gBAAgB,CAAC;AACxB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,EAAc,KAAK,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAGvE,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,mBAAmB,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAChC,aAAa,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;IAC5C,YAAY,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;IAC3C,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACjC,YAAY,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACnC,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,eAAe,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,YAAY,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACjC,sBAAsB,CAAC,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IAC9C,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,SAAS,CAAC;IACjD,QAAQ,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC7D,CAAC;AAEF,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,IAAI,EACJ,MAAM,EACN,UAAe,EACf,aAAkB,EAClB,YAAiB,EACjB,UAAkB,EAClB,YAA6C,EAC7C,UAAkB,EAClB,WAA+B,EAC/B,eAA8B,EAC9B,YAAuD,EACvD,YAAoB,EACpB,SAAS,EACT,MAAM,EACN,UAAiB,EACjB,sBAA2B,EAC3B,YAAqB,EACrB,QAAQ,GACT,EAAE,eAAe,+BA2LjB"}
+{"version":3,"file":"FilterForm.d.ts","sourceRoot":"","sources":["../../src/rpc/FilterForm.tsx"],"names":[],"mappings":"AAIA,OAAO,EAOL,KAAK,eAAe,EACrB,MAAM,gBAAgB,CAAC;AACxB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,EAAc,KAAK,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAGvE,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,mBAAmB,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAChC,aAAa,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;IAC5C,YAAY,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;IAC3C,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACjC,YAAY,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACnC,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,eAAe,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,YAAY,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACjC,sBAAsB,CAAC,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IAC9C,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,SAAS,CAAC;IACjD;;oDAEgD;IAChD,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC3D,QAAQ,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC7D,CAAC;AAEF,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,IAAI,EACJ,MAAM,EACN,UAAe,EACf,aAAkB,EAClB,YAAiB,EACjB,UAAkB,EAClB,YAA6C,EAC7C,UAAkB,EAClB,WAA+B,EAC/B,eAA8B,EAC9B,YAAuD,EACvD,YAAoB,EACpB,SAAS,EACT,MAAM,EACN,UAAiB,EACjB,sBAA2B,EAC3B,YAAqB,EACrB,QAAQ,EACR,QAAQ,GACT,EAAE,eAAe,+BAoMjB"}

package/dist/rpc/FilterForm.js

@@ -25,6 +25,7 @@ function FilterForm({
   showSubmit = true,
   excludedParameterNames = [],
   presentation = "form",
+  onChange,
   onSubmit
 }) {
   var _a;
@@ -46,6 +47,14 @@ function FilterForm({
   const [error, setError] = useState("");
   const debouncedValues = useDebouncedRecord(values, 250);
   const lastAutoSubmitted = useRef(null);
+  const onChangeRef = useRef(onChange);
+  useEffect(() => {
+    onChangeRef.current = onChange;
+  });
+  useEffect(() => {
+    var _a2;
+    (_a2 = onChangeRef.current) == null ? void 0 : _a2.call(onChangeRef, values);
+  }, [values]);
   const lookupParameters = useMemo(
     () => packLookupParameterValues(debouncedValues, parameters),
     [debouncedValues, parameters]

package/dist/rpc/FilterForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterForm.js","sources":["../../src/rpc/FilterForm.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, type FormEvent } from \"react\";\nimport { keepPreviousData, useQuery } from \"@tanstack/react-query\";\nimport { Button } from \"../components/button\";\nimport { FilterBar } from \"../components/FilterBar\";\nimport {\n  packLookupParameterValues,\n  parametersToFormConfig,\n  pruneParameterValues,\n  buildInitialParameterValues,\n  titleCase,\n  useDebouncedRecord,\n  type ParameterValues,\n} from \"./formMetadata\";\nimport type { OpenAPIParameter } from \"./types\";\nimport { useOpenAPI, type OperationsApiClient } from \"./useOperations\";\nimport { ParameterGrid } from \"./FilterFormFields\";\n\nexport type FilterFormProps = {\n  client: OperationsApiClient;\n  path: string;\n  method: string;\n  parameters?: OpenAPIParameter[];\n  initialValues?: ParameterValues | undefined;\n  lockedValues?: ParameterValues | undefined;\n  hideLocked?: boolean | undefined;\n  enableLookup?: boolean | undefined;\n  autoSubmit?: boolean | undefined;\n  submitLabel?: string | undefined;\n  submittingLabel?: string | undefined;\n  emptyMessage?: string | undefined;\n  isSubmitting?: boolean | undefined;\n  className?: string | undefined;\n  formId?: string | undefined;\n  showSubmit?: boolean | undefined;\n  excludedParameterNames?: string[] | undefined;\n  /** Renders operation controls as form rows or the shared table FilterBar. */\n  presentation?: \"form\" | \"filter-bar\" | undefined;\n  onSubmit: (values: ParameterValues) => void | Promise<void>;\n};\n\nexport function FilterForm({\n  client,\n  path,\n  method,\n  parameters = [],\n  initialValues = {},\n  lockedValues = {},\n  hideLocked = false,\n  enableLookup = method.toUpperCase() === \"GET\",\n  autoSubmit = false,\n  submitLabel = \"Execute request\",\n  submittingLabel = \"Executing…\",\n  emptyMessage = \"This operation does not require input.\",\n  isSubmitting = false,\n  className,\n  formId,\n  showSubmit = true,\n  excludedParameterNames = [],\n  presentation = \"form\",\n  onSubmit,\n}: FilterFormProps) {\n  const resetKey = useMemo(\n    () =>\n      `${method}:${path}:${JSON.stringify(initialValues)}:${JSON.stringify(\n        lockedValues\n      )}`,\n    [initialValues, lockedValues, method, path]\n  );\n  const visibleParameters = useMemo(\n    () =>\n      parameters.filter(\n        (parameter) => !excludedParameterNames.includes(parameter.name)\n      ),\n    [excludedParameterNames, parameters]\n  );\n  const [values, setValues] = useState<ParameterValues>(() =>\n    buildInitialParameterValues(parameters, method, lockedValues, initialValues)\n  );\n  const [error, setError] = useState(\"\");\n  const debouncedValues = useDebouncedRecord(values, 250);\n  const lastAutoSubmitted = useRef<string | null>(null);\n  const lookupParameters = useMemo(\n    () => packLookupParameterValues(debouncedValues, parameters),\n    [debouncedValues, parameters]\n  );\n\n  const lookupQuery = useQuery({\n    queryKey: [\"filter-form-lookup\", method, path, lookupParameters],\n    queryFn: async () =>\n      (await client.lookupFilters?.(path, method, lookupParameters, {\n        Accept: \"application/json+clicky\",\n      })) ?? { filters: {} },\n    enabled:\n      enableLookup &&\n      !!client.lookupFilters &&\n      parameters.some((param) => param.in === \"query\"),\n    placeholderData: keepPreviousData,\n    staleTime: 30_000,\n    retry: 0,\n  });\n\n  // Shapes come from the spec so a control keeps its identity while the lookup\n  // that fills it is in flight; see parametersToFormConfig.\n  const { data: spec } = useOpenAPI(client);\n  const filterShapes = spec?.components?.[\"x-clicky-filters\"];\n\n  const formConfig = useMemo(\n    () =>\n      parametersToFormConfig(visibleParameters, values, setValues, {\n        lookup: lookupQuery.data,\n        components: filterShapes,\n        lockedValues,\n        hideLocked,\n      }),\n    [\n      filterShapes,\n      hideLocked,\n      lockedValues,\n      lookupQuery.data,\n      visibleParameters,\n      values,\n    ]\n  );\n\n  const hasFields =\n    formConfig.filters.length > 0 ||\n    formConfig.search != null ||\n    formConfig.timeRange != null;\n\n  async function handleSubmit(event?: FormEvent) {\n    event?.preventDefault();\n\n    const missingRequired = parameters.filter((param) => {\n      if (!param.required) return false;\n      const value = lockedValues[param.name] ?? values[param.name] ?? \"\";\n      return value.trim() === \"\";\n    });\n\n    if (missingRequired.length > 0) {\n      setError(\n        `Missing required fields: ${missingRequired\n          .map((param) => titleCase(param.name))\n          .join(\", \")}`\n      );\n      return;\n    }\n\n    setError(\"\");\n    await onSubmit(pruneParameterValues(values));\n  }\n\n  useEffect(() => {\n    setValues(\n      buildInitialParameterValues(\n        parameters,\n        method,\n        lockedValues,\n        initialValues\n      )\n    );\n    setError(\"\");\n    lastAutoSubmitted.current = null;\n  }, [resetKey]);\n\n  useEffect(() => {\n    if (!autoSubmit) {\n      return;\n    }\n\n    const missingRequired = parameters.filter((param) => {\n      if (!param.required) return false;\n      const value =\n        lockedValues[param.name] ?? debouncedValues[param.name] ?? \"\";\n      return value.trim() === \"\";\n    });\n    if (missingRequired.length > 0) {\n      return;\n    }\n\n    const submittedValues = pruneParameterValues(debouncedValues);\n    const signature = JSON.stringify(submittedValues);\n    if (lastAutoSubmitted.current === signature) {\n      return;\n    }\n\n    lastAutoSubmitted.current = signature;\n    setError(\"\");\n    void onSubmit(submittedValues);\n  }, [autoSubmit, debouncedValues, lockedValues, onSubmit, parameters]);\n\n  return (\n    <form id={formId} className=\"space-y-3\" onSubmit={handleSubmit}>\n      {hasFields ? (\n        presentation === \"filter-bar\" ? (\n          <FilterBar\n            autoSubmit={autoSubmit}\n            filters={formConfig.filters}\n            overflowMode=\"wrap\"\n            {...(formConfig.search ? { search: formConfig.search } : {})}\n            {...(formConfig.timeRange\n              ? { timeRange: formConfig.timeRange }\n              : {})}\n            {...(!autoSubmit\n              ? {\n                  onApply: () => void handleSubmit(),\n                  applyLabel: submitLabel,\n                  isPending: isSubmitting,\n                }\n              : {})}\n            {...(className ? { className } : {})}\n          />\n        ) : (\n          <ParameterGrid\n            autoSubmit={autoSubmit}\n            filters={formConfig.filters}\n            isSubmitting={isSubmitting}\n            submitLabel={submitLabel}\n            submittingLabel={submittingLabel}\n            showSubmit={showSubmit}\n            {...(formConfig.timeRange\n              ? { timeRange: formConfig.timeRange }\n              : {})}\n            {...(className ? { className } : {})}\n          />\n        )\n      ) : (\n        <div className=\"flex items-center justify-between gap-4\">\n          <p className=\"text-sm text-muted-foreground\">{emptyMessage}</p>\n          {showSubmit ? (\n            <Button\n              type=\"button\"\n              onClick={handleSubmit}\n              disabled={isSubmitting}\n            >\n              {isSubmitting ? submittingLabel : submitLabel}\n            </Button>\n          ) : null}\n        </div>\n      )}\n\n      {error && (\n        <div className=\"rounded-md border border-destructive/40 bg-destructive/5 p-3 text-sm text-destructive\">\n          {error}\n        </div>\n      )}\n    </form>\n  );\n}\n"],"names":["_a"],"mappings":";;;;;;;;AAwCO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa,CAAA;AAAA,EACb,gBAAgB,CAAA;AAAA,EAChB,eAAe,CAAA;AAAA,EACf,aAAa;AAAA,EACb,eAAe,OAAO,YAAA,MAAkB;AAAA,EACxC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb,yBAAyB,CAAA;AAAA,EACzB,eAAe;AAAA,EACf;AACF,GAAoB;;AAClB,QAAM,WAAW;AAAA,IACf,MACE,GAAG,MAAM,IAAI,IAAI,IAAI,KAAK,UAAU,aAAa,CAAC,IAAI,KAAK;AAAA,MACzD;AAAA,IAAA,CACD;AAAA,IACH,CAAC,eAAe,cAAc,QAAQ,IAAI;AAAA,EAAA;AAE5C,QAAM,oBAAoB;AAAA,IACxB,MACE,WAAW;AAAA,MACT,CAAC,cAAc,CAAC,uBAAuB,SAAS,UAAU,IAAI;AAAA,IAAA;AAAA,IAElE,CAAC,wBAAwB,UAAU;AAAA,EAAA;AAErC,QAAM,CAAC,QAAQ,SAAS,IAAI;AAAA,IAA0B,MACpD,4BAA4B,YAAY,QAAQ,cAAc,aAAa;AAAA,EAAA;AAE7E,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,kBAAkB,mBAAmB,QAAQ,GAAG;AACtD,QAAM,oBAAoB,OAAsB,IAAI;AACpD,QAAM,mBAAmB;AAAA,IACvB,MAAM,0BAA0B,iBAAiB,UAAU;AAAA,IAC3D,CAAC,iBAAiB,UAAU;AAAA,EAAA;AAG9B,QAAM,cAAc,SAAS;AAAA,IAC3B,UAAU,CAAC,sBAAsB,QAAQ,MAAM,gBAAgB;AAAA,IAC/D,SAAS,YAAA;;AACN,qBAAMA,MAAA,OAAO,kBAAP,gBAAAA,IAAA,aAAuB,MAAM,QAAQ,kBAAkB;AAAA,QAC5D,QAAQ;AAAA,MAAA,OACH,EAAE,SAAS,GAAC;AAAA;AAAA,IACrB,SACE,gBACA,CAAC,CAAC,OAAO,iBACT,WAAW,KAAK,CAAC,UAAU,MAAM,OAAO,OAAO;AAAA,IACjD,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,OAAO;AAAA,EAAA,CACR;AAID,QAAM,EAAE,MAAM,SAAS,WAAW,MAAM;AACxC,QAAM,gBAAe,kCAAM,eAAN,mBAAmB;AAExC,QAAM,aAAa;AAAA,IACjB,MACE,uBAAuB,mBAAmB,QAAQ,WAAW;AAAA,MAC3D,QAAQ,YAAY;AAAA,MACpB,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,IAAA,CACD;AAAA,IACH;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAGF,QAAM,YACJ,WAAW,QAAQ,SAAS,KAC5B,WAAW,UAAU,QACrB,WAAW,aAAa;AAE1B,iBAAe,aAAa,OAAmB;AAC7C,mCAAO;AAEP,UAAM,kBAAkB,WAAW,OAAO,CAAC,UAAU;AACnD,UAAI,CAAC,MAAM,SAAU,QAAO;AAC5B,YAAM,QAAQ,aAAa,MAAM,IAAI,KAAK,OAAO,MAAM,IAAI,KAAK;AAChE,aAAO,MAAM,WAAW;AAAA,IAC1B,CAAC;AAED,QAAI,gBAAgB,SAAS,GAAG;AAC9B;AAAA,QACE,4BAA4B,gBACzB,IAAI,CAAC,UAAU,UAAU,MAAM,IAAI,CAAC,EACpC,KAAK,IAAI,CAAC;AAAA,MAAA;AAEf;AAAA,IACF;AAEA,aAAS,EAAE;AACX,UAAM,SAAS,qBAAqB,MAAM,CAAC;AAAA,EAC7C;AAEA,YAAU,MAAM;AACd;AAAA,MACE;AAAA,QACE;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAEF,aAAS,EAAE;AACX,sBAAkB,UAAU;AAAA,EAC9B,GAAG,CAAC,QAAQ,CAAC;AAEb,YAAU,MAAM;AACd,QAAI,CAAC,YAAY;AACf;AAAA,IACF;AAEA,UAAM,kBAAkB,WAAW,OAAO,CAAC,UAAU;AACnD,UAAI,CAAC,MAAM,SAAU,QAAO;AAC5B,YAAM,QACJ,aAAa,MAAM,IAAI,KAAK,gBAAgB,MAAM,IAAI,KAAK;AAC7D,aAAO,MAAM,WAAW;AAAA,IAC1B,CAAC;AACD,QAAI,gBAAgB,SAAS,GAAG;AAC9B;AAAA,IACF;AAEA,UAAM,kBAAkB,qBAAqB,eAAe;AAC5D,UAAM,YAAY,KAAK,UAAU,eAAe;AAChD,QAAI,kBAAkB,YAAY,WAAW;AAC3C;AAAA,IACF;AAEA,sBAAkB,UAAU;AAC5B,aAAS,EAAE;AACX,SAAK,SAAS,eAAe;AAAA,EAC/B,GAAG,CAAC,YAAY,iBAAiB,cAAc,UAAU,UAAU,CAAC;AAEpE,8BACG,QAAA,EAAK,IAAI,QAAQ,WAAU,aAAY,UAAU,cAC/C,UAAA;AAAA,IAAA,YACC,iBAAiB,eACf;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAS,WAAW;AAAA,QACpB,cAAa;AAAA,QACZ,GAAI,WAAW,SAAS,EAAE,QAAQ,WAAW,OAAA,IAAW,CAAA;AAAA,QACxD,GAAI,WAAW,YACZ,EAAE,WAAW,WAAW,UAAA,IACxB,CAAA;AAAA,QACH,GAAI,CAAC,aACF;AAAA,UACE,SAAS,MAAM,KAAK,aAAA;AAAA,UACpB,YAAY;AAAA,UACZ,WAAW;AAAA,QAAA,IAEb,CAAA;AAAA,QACH,GAAI,YAAY,EAAE,cAAc,CAAA;AAAA,MAAC;AAAA,IAAA,IAGpC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAS,WAAW;AAAA,QACpB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACC,GAAI,WAAW,YACZ,EAAE,WAAW,WAAW,UAAA,IACxB,CAAA;AAAA,QACH,GAAI,YAAY,EAAE,cAAc,CAAA;AAAA,MAAC;AAAA,IAAA,IAItC,qBAAC,OAAA,EAAI,WAAU,2CACb,UAAA;AAAA,MAAA,oBAAC,KAAA,EAAE,WAAU,iCAAiC,UAAA,cAAa;AAAA,MAC1D,aACC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAS;AAAA,UACT,UAAU;AAAA,UAET,yBAAe,kBAAkB;AAAA,QAAA;AAAA,MAAA,IAElC;AAAA,IAAA,GACN;AAAA,IAGD,SACC,oBAAC,OAAA,EAAI,WAAU,yFACZ,UAAA,MAAA,CACH;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"FilterForm.js","sources":["../../src/rpc/FilterForm.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, type FormEvent } from \"react\";\nimport { keepPreviousData, useQuery } from \"@tanstack/react-query\";\nimport { Button } from \"../components/button\";\nimport { FilterBar } from \"../components/FilterBar\";\nimport {\n  packLookupParameterValues,\n  parametersToFormConfig,\n  pruneParameterValues,\n  buildInitialParameterValues,\n  titleCase,\n  useDebouncedRecord,\n  type ParameterValues,\n} from \"./formMetadata\";\nimport type { OpenAPIParameter } from \"./types\";\nimport { useOpenAPI, type OperationsApiClient } from \"./useOperations\";\nimport { ParameterGrid } from \"./FilterFormFields\";\n\nexport type FilterFormProps = {\n  client: OperationsApiClient;\n  path: string;\n  method: string;\n  parameters?: OpenAPIParameter[];\n  initialValues?: ParameterValues | undefined;\n  lockedValues?: ParameterValues | undefined;\n  hideLocked?: boolean | undefined;\n  enableLookup?: boolean | undefined;\n  autoSubmit?: boolean | undefined;\n  submitLabel?: string | undefined;\n  submittingLabel?: string | undefined;\n  emptyMessage?: string | undefined;\n  isSubmitting?: boolean | undefined;\n  className?: string | undefined;\n  formId?: string | undefined;\n  showSubmit?: boolean | undefined;\n  excludedParameterNames?: string[] | undefined;\n  /** Renders operation controls as form rows or the shared table FilterBar. */\n  presentation?: \"form\" | \"filter-bar\" | undefined;\n  /** Called with the current values whenever they change, starting with the\n   *  initial values, so the form can act as a controlled field set inside a\n   *  host form (pair with showSubmit={false}). */\n  onChange?: ((values: ParameterValues) => void) | undefined;\n  onSubmit: (values: ParameterValues) => void | Promise<void>;\n};\n\nexport function FilterForm({\n  client,\n  path,\n  method,\n  parameters = [],\n  initialValues = {},\n  lockedValues = {},\n  hideLocked = false,\n  enableLookup = method.toUpperCase() === \"GET\",\n  autoSubmit = false,\n  submitLabel = \"Execute request\",\n  submittingLabel = \"Executing…\",\n  emptyMessage = \"This operation does not require input.\",\n  isSubmitting = false,\n  className,\n  formId,\n  showSubmit = true,\n  excludedParameterNames = [],\n  presentation = \"form\",\n  onChange,\n  onSubmit,\n}: FilterFormProps) {\n  const resetKey = useMemo(\n    () =>\n      `${method}:${path}:${JSON.stringify(initialValues)}:${JSON.stringify(\n        lockedValues\n      )}`,\n    [initialValues, lockedValues, method, path]\n  );\n  const visibleParameters = useMemo(\n    () =>\n      parameters.filter(\n        (parameter) => !excludedParameterNames.includes(parameter.name)\n      ),\n    [excludedParameterNames, parameters]\n  );\n  const [values, setValues] = useState<ParameterValues>(() =>\n    buildInitialParameterValues(parameters, method, lockedValues, initialValues)\n  );\n  const [error, setError] = useState(\"\");\n  const debouncedValues = useDebouncedRecord(values, 250);\n  const lastAutoSubmitted = useRef<string | null>(null);\n  // The latest callback is read from a ref so a host passing an inline\n  // function is notified per value change, not per render.\n  const onChangeRef = useRef(onChange);\n  useEffect(() => {\n    onChangeRef.current = onChange;\n  });\n  useEffect(() => {\n    onChangeRef.current?.(values);\n  }, [values]);\n  const lookupParameters = useMemo(\n    () => packLookupParameterValues(debouncedValues, parameters),\n    [debouncedValues, parameters]\n  );\n\n  const lookupQuery = useQuery({\n    queryKey: [\"filter-form-lookup\", method, path, lookupParameters],\n    queryFn: async () =>\n      (await client.lookupFilters?.(path, method, lookupParameters, {\n        Accept: \"application/json+clicky\",\n      })) ?? { filters: {} },\n    enabled:\n      enableLookup &&\n      !!client.lookupFilters &&\n      parameters.some((param) => param.in === \"query\"),\n    placeholderData: keepPreviousData,\n    staleTime: 30_000,\n    retry: 0,\n  });\n\n  // Shapes come from the spec so a control keeps its identity while the lookup\n  // that fills it is in flight; see parametersToFormConfig.\n  const { data: spec } = useOpenAPI(client);\n  const filterShapes = spec?.components?.[\"x-clicky-filters\"];\n\n  const formConfig = useMemo(\n    () =>\n      parametersToFormConfig(visibleParameters, values, setValues, {\n        lookup: lookupQuery.data,\n        components: filterShapes,\n        lockedValues,\n        hideLocked,\n      }),\n    [\n      filterShapes,\n      hideLocked,\n      lockedValues,\n      lookupQuery.data,\n      visibleParameters,\n      values,\n    ]\n  );\n\n  const hasFields =\n    formConfig.filters.length > 0 ||\n    formConfig.search != null ||\n    formConfig.timeRange != null;\n\n  async function handleSubmit(event?: FormEvent) {\n    event?.preventDefault();\n\n    const missingRequired = parameters.filter((param) => {\n      if (!param.required) return false;\n      const value = lockedValues[param.name] ?? values[param.name] ?? \"\";\n      return value.trim() === \"\";\n    });\n\n    if (missingRequired.length > 0) {\n      setError(\n        `Missing required fields: ${missingRequired\n          .map((param) => titleCase(param.name))\n          .join(\", \")}`\n      );\n      return;\n    }\n\n    setError(\"\");\n    await onSubmit(pruneParameterValues(values));\n  }\n\n  useEffect(() => {\n    setValues(\n      buildInitialParameterValues(\n        parameters,\n        method,\n        lockedValues,\n        initialValues\n      )\n    );\n    setError(\"\");\n    lastAutoSubmitted.current = null;\n  }, [resetKey]);\n\n  useEffect(() => {\n    if (!autoSubmit) {\n      return;\n    }\n\n    const missingRequired = parameters.filter((param) => {\n      if (!param.required) return false;\n      const value =\n        lockedValues[param.name] ?? debouncedValues[param.name] ?? \"\";\n      return value.trim() === \"\";\n    });\n    if (missingRequired.length > 0) {\n      return;\n    }\n\n    const submittedValues = pruneParameterValues(debouncedValues);\n    const signature = JSON.stringify(submittedValues);\n    if (lastAutoSubmitted.current === signature) {\n      return;\n    }\n\n    lastAutoSubmitted.current = signature;\n    setError(\"\");\n    void onSubmit(submittedValues);\n  }, [autoSubmit, debouncedValues, lockedValues, onSubmit, parameters]);\n\n  return (\n    <form id={formId} className=\"space-y-3\" onSubmit={handleSubmit}>\n      {hasFields ? (\n        presentation === \"filter-bar\" ? (\n          <FilterBar\n            autoSubmit={autoSubmit}\n            filters={formConfig.filters}\n            overflowMode=\"wrap\"\n            {...(formConfig.search ? { search: formConfig.search } : {})}\n            {...(formConfig.timeRange\n              ? { timeRange: formConfig.timeRange }\n              : {})}\n            {...(!autoSubmit\n              ? {\n                  onApply: () => void handleSubmit(),\n                  applyLabel: submitLabel,\n                  isPending: isSubmitting,\n                }\n              : {})}\n            {...(className ? { className } : {})}\n          />\n        ) : (\n          <ParameterGrid\n            autoSubmit={autoSubmit}\n            filters={formConfig.filters}\n            isSubmitting={isSubmitting}\n            submitLabel={submitLabel}\n            submittingLabel={submittingLabel}\n            showSubmit={showSubmit}\n            {...(formConfig.timeRange\n              ? { timeRange: formConfig.timeRange }\n              : {})}\n            {...(className ? { className } : {})}\n          />\n        )\n      ) : (\n        <div className=\"flex items-center justify-between gap-4\">\n          <p className=\"text-sm text-muted-foreground\">{emptyMessage}</p>\n          {showSubmit ? (\n            <Button\n              type=\"button\"\n              onClick={handleSubmit}\n              disabled={isSubmitting}\n            >\n              {isSubmitting ? submittingLabel : submitLabel}\n            </Button>\n          ) : null}\n        </div>\n      )}\n\n      {error && (\n        <div className=\"rounded-md border border-destructive/40 bg-destructive/5 p-3 text-sm text-destructive\">\n          {error}\n        </div>\n      )}\n    </form>\n  );\n}\n"],"names":["_a"],"mappings":"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"}

package/dist/rpc/InlineError.cjs

@@ -2,19 +2,18 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const button = require("../components/button.cjs");
+const ErrorDetails = require("../data/diagnostics/ErrorDetails.cjs");
 const Icon = require("../data/Icon.cjs");
-const utils = require("../lib/utils.cjs");
+const operationErrorDiagnostics = require("./operationErrorDiagnostics.cjs");
 const UiPlay = require("../icons/components/UiPlay.cjs");
-const UiChevronRight = require("../icons/components/UiChevronRight.cjs");
 function InlineError({ title, error, className, runNow }) {
-  const message = error instanceof Error ? error.message : String(error ?? "");
-  const details = getErrorDetails(error);
-  const hasDetails = Boolean(details.responseBody || details.status || details.url);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("rounded-xl border border-dashed border-red-300 p-6 text-sm", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium text-red-600", children: title }),
-      message && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-muted-foreground", children: message }),
-      runNow && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3 flex justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ErrorDetails.ErrorDetails,
+    {
+      title,
+      diagnostics: operationErrorDiagnostics.operationErrorDiagnostics(error),
+      ...className ? { className } : {},
+      actions: runNow && /* @__PURE__ */ jsxRuntime.jsxs(
         button.Button,
         {
           type: "button",
@@ -28,39 +27,9 @@ function InlineError({ title, error, className, runNow }) {
             "Run now"
           ]
         }
-      ) })
-    ] }),
-    hasDetails && /* @__PURE__ */ jsxRuntime.jsxs("details", { className: "group mt-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("summary", { className: "flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiChevronRight.UiChevronRight, className: "transition-transform group-open:rotate-90" }),
-        "More details"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 space-y-2 text-left font-mono text-xs", children: [
-        (details.method || details.url || details.status) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-muted-foreground", children: [
-          details.method && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-            details.method,
-            " "
-          ] }),
-          details.url,
-          details.status != null && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-            " - ",
-            details.status
-          ] })
-        ] }),
-        details.responseBody && /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "max-h-64 overflow-auto rounded-md bg-muted p-2 text-xs", children: details.responseBody })
-      ] })
-    ] })
-  ] });
-}
-function getErrorDetails(error) {
-  if (error == null || typeof error !== "object") return {};
-  const record = error;
-  const details = {};
-  if (typeof record.method === "string") details.method = record.method;
-  if (typeof record.url === "string") details.url = record.url;
-  if (typeof record.status === "number") details.status = record.status;
-  if (typeof record.responseBody === "string") details.responseBody = record.responseBody;
-  return details;
+      )
+    }
+  );
 }
 exports.InlineError = InlineError;
 //# sourceMappingURL=InlineError.cjs.map

package/dist/rpc/InlineError.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"InlineError.cjs","sources":["../../src/rpc/InlineError.tsx"],"sourcesContent":["import { Button } from \"../components/button\";\nimport { Icon } from \"../data/Icon\";\nimport { UiChevronRight, UiPlay } from \"../icons\";\nimport { cn } from \"../lib/utils\";\n\nexport type InlineErrorProps = {\n  title: string;\n  error: unknown;\n  className?: string;\n  runNow?: {\n    onClick: () => void;\n    loading?: boolean;\n  };\n};\n\ntype ErrorDetails = {\n  method?: string;\n  url?: string;\n  status?: number;\n  responseBody?: string;\n};\n\nexport function InlineError({ title, error, className, runNow }: InlineErrorProps) {\n  const message = error instanceof Error ? error.message : String(error ?? \"\");\n  const details = getErrorDetails(error);\n  const hasDetails = Boolean(details.responseBody || details.status || details.url);\n\n  return (\n    <div className={cn(\"rounded-xl border border-dashed border-red-300 p-6 text-sm\", className)}>\n      <div className=\"text-center\">\n        <div className=\"font-medium text-red-600\">{title}</div>\n        {message && <div className=\"mt-1 text-muted-foreground\">{message}</div>}\n        {runNow && (\n          <div className=\"mt-3 flex justify-center\">\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={runNow.onClick}\n              loading={runNow.loading ?? false}\n              loadingLabel={runNow.loading ? \"Running…\" : undefined}\n            >\n              <Icon icon={UiPlay} />\n              Run now\n            </Button>\n          </div>\n        )}\n      </div>\n      {hasDetails && (\n        <details className=\"group mt-3\">\n          <summary className=\"flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground\">\n            <Icon icon={UiChevronRight} className=\"transition-transform group-open:rotate-90\" />\n            More details\n          </summary>\n          <div className=\"mt-2 space-y-2 text-left font-mono text-xs\">\n            {(details.method || details.url || details.status) && (\n              <div className=\"text-muted-foreground\">\n                {details.method && <span>{details.method} </span>}\n                {details.url}\n                {details.status != null && <span> - {details.status}</span>}\n              </div>\n            )}\n            {details.responseBody && (\n              <pre className=\"max-h-64 overflow-auto rounded-md bg-muted p-2 text-xs\">\n                {details.responseBody}\n              </pre>\n            )}\n          </div>\n        </details>\n      )}\n    </div>\n  );\n}\n\nfunction getErrorDetails(error: unknown): ErrorDetails {\n  if (error == null || typeof error !== \"object\") return {};\n  const record = error as Record<string, unknown>;\n  const details: ErrorDetails = {};\n  if (typeof record.method === \"string\") details.method = record.method;\n  if (typeof record.url === \"string\") details.url = record.url;\n  if (typeof record.status === \"number\") details.status = record.status;\n  if (typeof record.responseBody === \"string\") details.responseBody = record.responseBody;\n  return details;\n}\n"],"names":["cn","jsxs","jsx","Button","Icon","UiPlay","UiChevronRight"],"mappings":";;;;;;;;AAsBO,SAAS,YAAY,EAAE,OAAO,OAAO,WAAW,UAA4B;AACjF,QAAM,UAAU,iBAAiB,QAAQ,MAAM,UAAU,OAAO,SAAS,EAAE;AAC3E,QAAM,UAAU,gBAAgB,KAAK;AACrC,QAAM,aAAa,QAAQ,QAAQ,gBAAgB,QAAQ,UAAU,QAAQ,GAAG;AAEhF,yCACG,OAAA,EAAI,WAAWA,MAAAA,GAAG,8DAA8D,SAAS,GACxF,UAAA;AAAA,IAAAC,2BAAAA,KAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,MAAAC,2BAAAA,IAAC,OAAA,EAAI,WAAU,4BAA4B,UAAA,OAAM;AAAA,MAChD,WAAWA,2BAAAA,IAAC,OAAA,EAAI,WAAU,8BAA8B,UAAA,SAAQ;AAAA,MAChE,UACCA,2BAAAA,IAAC,OAAA,EAAI,WAAU,4BACb,UAAAD,2BAAAA;AAAAA,QAACE,OAAAA;AAAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,SAAS,OAAO;AAAA,UAChB,SAAS,OAAO,WAAW;AAAA,UAC3B,cAAc,OAAO,UAAU,aAAa;AAAA,UAE5C,UAAA;AAAA,YAAAD,2BAAAA,IAACE,KAAAA,MAAA,EAAK,MAAMC,OAAAA,OAAA,CAAQ;AAAA,YAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,EAExB,CACF;AAAA,IAAA,GAEJ;AAAA,IACC,cACCJ,2BAAAA,KAAC,WAAA,EAAQ,WAAU,cACjB,UAAA;AAAA,MAAAA,2BAAAA,KAAC,WAAA,EAAQ,WAAU,6GACjB,UAAA;AAAA,QAAAC,2BAAAA,IAACE,KAAAA,MAAA,EAAK,MAAME,eAAAA,gBAAgB,WAAU,6CAA4C;AAAA,QAAE;AAAA,MAAA,GAEtF;AAAA,MACAL,2BAAAA,KAAC,OAAA,EAAI,WAAU,8CACX,UAAA;AAAA,SAAA,QAAQ,UAAU,QAAQ,OAAO,QAAQ,WACzCA,2BAAAA,KAAC,OAAA,EAAI,WAAU,yBACZ,UAAA;AAAA,UAAA,QAAQ,0CAAW,QAAA,EAAM,UAAA;AAAA,YAAA,QAAQ;AAAA,YAAO;AAAA,UAAA,GAAC;AAAA,UACzC,QAAQ;AAAA,UACR,QAAQ,UAAU,QAAQA,2BAAAA,KAAC,QAAA,EAAK,UAAA;AAAA,YAAA;AAAA,YAAI,QAAQ;AAAA,UAAA,EAAA,CAAO;AAAA,QAAA,GACtD;AAAA,QAED,QAAQ,gBACPC,2BAAAA,IAAC,SAAI,WAAU,0DACZ,kBAAQ,aAAA,CACX;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;AAEA,SAAS,gBAAgB,OAA8B;AACrD,MAAI,SAAS,QAAQ,OAAO,UAAU,iBAAiB,CAAA;AACvD,QAAM,SAAS;AACf,QAAM,UAAwB,CAAA;AAC9B,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,QAAQ,SAAU,SAAQ,MAAM,OAAO;AACzD,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,iBAAiB,SAAU,SAAQ,eAAe,OAAO;AAC3E,SAAO;AACT;;"}
+{"version":3,"file":"InlineError.cjs","sources":["../../src/rpc/InlineError.tsx"],"sourcesContent":["import { Button } from \"../components/button\";\nimport { ErrorDetails } from \"../data/diagnostics/ErrorDetails\";\nimport { Icon } from \"../data/Icon\";\nimport { UiPlay } from \"../icons\";\nimport { operationErrorDiagnostics } from \"./operationErrorDiagnostics\";\n\nexport type InlineErrorProps = {\n  title: string;\n  error: unknown;\n  className?: string;\n  runNow?: {\n    onClick: () => void;\n    loading?: boolean;\n  };\n};\n\nexport function InlineError({ title, error, className, runNow }: InlineErrorProps) {\n  return (\n    <ErrorDetails\n      title={title}\n      diagnostics={operationErrorDiagnostics(error)}\n      {...(className ? { className } : {})}\n      actions={\n        runNow && (\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={runNow.onClick}\n            loading={runNow.loading ?? false}\n            loadingLabel={runNow.loading ? \"Running…\" : undefined}\n          >\n            <Icon icon={UiPlay} />\n            Run now\n          </Button>\n        )\n      }\n    />\n  );\n}\n"],"names":["jsx","ErrorDetails","operationErrorDiagnostics","jsxs","Button","Icon","UiPlay"],"mappings":";;;;;;;;AAgBO,SAAS,YAAY,EAAE,OAAO,OAAO,WAAW,UAA4B;AACjF,SACEA,2BAAAA;AAAAA,IAACC,aAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,aAAaC,0BAAAA,0BAA0B,KAAK;AAAA,MAC3C,GAAI,YAAY,EAAE,UAAA,IAAc,CAAA;AAAA,MACjC,SACE,UACEC,2BAAAA;AAAAA,QAACC,OAAAA;AAAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,SAAS,OAAO;AAAA,UAChB,SAAS,OAAO,WAAW;AAAA,UAC3B,cAAc,OAAO,UAAU,aAAa;AAAA,UAE5C,UAAA;AAAA,YAAAJ,2BAAAA,IAACK,KAAAA,MAAA,EAAK,MAAMC,OAAAA,OAAA,CAAQ;AAAA,YAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAExB;AAAA,EAAA;AAKV;;"}

package/dist/rpc/InlineError.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InlineError.d.ts","sourceRoot":"","sources":["../../src/rpc/InlineError.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE;QACP,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,OAAO,CAAC,EAAE,OAAO,CAAC;KACnB,CAAC;CACH,CAAC;AASF,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,gBAAgB,+BAkDhF"}
+{"version":3,"file":"InlineError.d.ts","sourceRoot":"","sources":["../../src/rpc/InlineError.tsx"],"names":[],"mappings":"AAMA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE;QACP,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,OAAO,CAAC,EAAE,OAAO,CAAC;KACnB,CAAC;CACH,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,gBAAgB,+BAuBhF"}

package/dist/rpc/InlineError.js

@@ -1,18 +1,17 @@
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "../components/button.js";
+import { ErrorDetails } from "../data/diagnostics/ErrorDetails.js";
 import { Icon } from "../data/Icon.js";
-import { cn } from "../lib/utils.js";
+import { operationErrorDiagnostics } from "./operationErrorDiagnostics.js";
 import { UiPlay } from "../icons/components/UiPlay.js";
-import { UiChevronRight } from "../icons/components/UiChevronRight.js";
 function InlineError({ title, error, className, runNow }) {
-  const message = error instanceof Error ? error.message : String(error ?? "");
-  const details = getErrorDetails(error);
-  const hasDetails = Boolean(details.responseBody || details.status || details.url);
-  return /* @__PURE__ */ jsxs("div", { className: cn("rounded-xl border border-dashed border-red-300 p-6 text-sm", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
-      /* @__PURE__ */ jsx("div", { className: "font-medium text-red-600", children: title }),
-      message && /* @__PURE__ */ jsx("div", { className: "mt-1 text-muted-foreground", children: message }),
-      runNow && /* @__PURE__ */ jsx("div", { className: "mt-3 flex justify-center", children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
+    ErrorDetails,
+    {
+      title,
+      diagnostics: operationErrorDiagnostics(error),
+      ...className ? { className } : {},
+      actions: runNow && /* @__PURE__ */ jsxs(
         Button,
         {
           type: "button",
@@ -26,39 +25,9 @@ function InlineError({ title, error, className, runNow }) {
             "Run now"
           ]
         }
-      ) })
-    ] }),
-    hasDetails && /* @__PURE__ */ jsxs("details", { className: "group mt-3", children: [
-      /* @__PURE__ */ jsxs("summary", { className: "flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground", children: [
-        /* @__PURE__ */ jsx(Icon, { icon: UiChevronRight, className: "transition-transform group-open:rotate-90" }),
-        "More details"
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "mt-2 space-y-2 text-left font-mono text-xs", children: [
-        (details.method || details.url || details.status) && /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground", children: [
-          details.method && /* @__PURE__ */ jsxs("span", { children: [
-            details.method,
-            " "
-          ] }),
-          details.url,
-          details.status != null && /* @__PURE__ */ jsxs("span", { children: [
-            " - ",
-            details.status
-          ] })
-        ] }),
-        details.responseBody && /* @__PURE__ */ jsx("pre", { className: "max-h-64 overflow-auto rounded-md bg-muted p-2 text-xs", children: details.responseBody })
-      ] })
-    ] })
-  ] });
-}
-function getErrorDetails(error) {
-  if (error == null || typeof error !== "object") return {};
-  const record = error;
-  const details = {};
-  if (typeof record.method === "string") details.method = record.method;
-  if (typeof record.url === "string") details.url = record.url;
-  if (typeof record.status === "number") details.status = record.status;
-  if (typeof record.responseBody === "string") details.responseBody = record.responseBody;
-  return details;
+      )
+    }
+  );
 }
 export {
   InlineError

package/dist/rpc/InlineError.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineError.js","sources":["../../src/rpc/InlineError.tsx"],"sourcesContent":["import { Button } from \"../components/button\";\nimport { Icon } from \"../data/Icon\";\nimport { UiChevronRight, UiPlay } from \"../icons\";\nimport { cn } from \"../lib/utils\";\n\nexport type InlineErrorProps = {\n  title: string;\n  error: unknown;\n  className?: string;\n  runNow?: {\n    onClick: () => void;\n    loading?: boolean;\n  };\n};\n\ntype ErrorDetails = {\n  method?: string;\n  url?: string;\n  status?: number;\n  responseBody?: string;\n};\n\nexport function InlineError({ title, error, className, runNow }: InlineErrorProps) {\n  const message = error instanceof Error ? error.message : String(error ?? \"\");\n  const details = getErrorDetails(error);\n  const hasDetails = Boolean(details.responseBody || details.status || details.url);\n\n  return (\n    <div className={cn(\"rounded-xl border border-dashed border-red-300 p-6 text-sm\", className)}>\n      <div className=\"text-center\">\n        <div className=\"font-medium text-red-600\">{title}</div>\n        {message && <div className=\"mt-1 text-muted-foreground\">{message}</div>}\n        {runNow && (\n          <div className=\"mt-3 flex justify-center\">\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={runNow.onClick}\n              loading={runNow.loading ?? false}\n              loadingLabel={runNow.loading ? \"Running…\" : undefined}\n            >\n              <Icon icon={UiPlay} />\n              Run now\n            </Button>\n          </div>\n        )}\n      </div>\n      {hasDetails && (\n        <details className=\"group mt-3\">\n          <summary className=\"flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground\">\n            <Icon icon={UiChevronRight} className=\"transition-transform group-open:rotate-90\" />\n            More details\n          </summary>\n          <div className=\"mt-2 space-y-2 text-left font-mono text-xs\">\n            {(details.method || details.url || details.status) && (\n              <div className=\"text-muted-foreground\">\n                {details.method && <span>{details.method} </span>}\n                {details.url}\n                {details.status != null && <span> - {details.status}</span>}\n              </div>\n            )}\n            {details.responseBody && (\n              <pre className=\"max-h-64 overflow-auto rounded-md bg-muted p-2 text-xs\">\n                {details.responseBody}\n              </pre>\n            )}\n          </div>\n        </details>\n      )}\n    </div>\n  );\n}\n\nfunction getErrorDetails(error: unknown): ErrorDetails {\n  if (error == null || typeof error !== \"object\") return {};\n  const record = error as Record<string, unknown>;\n  const details: ErrorDetails = {};\n  if (typeof record.method === \"string\") details.method = record.method;\n  if (typeof record.url === \"string\") details.url = record.url;\n  if (typeof record.status === \"number\") details.status = record.status;\n  if (typeof record.responseBody === \"string\") details.responseBody = record.responseBody;\n  return details;\n}\n"],"names":[],"mappings":";;;;;;AAsBO,SAAS,YAAY,EAAE,OAAO,OAAO,WAAW,UAA4B;AACjF,QAAM,UAAU,iBAAiB,QAAQ,MAAM,UAAU,OAAO,SAAS,EAAE;AAC3E,QAAM,UAAU,gBAAgB,KAAK;AACrC,QAAM,aAAa,QAAQ,QAAQ,gBAAgB,QAAQ,UAAU,QAAQ,GAAG;AAEhF,8BACG,OAAA,EAAI,WAAW,GAAG,8DAA8D,SAAS,GACxF,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAU,4BAA4B,UAAA,OAAM;AAAA,MAChD,WAAW,oBAAC,OAAA,EAAI,WAAU,8BAA8B,UAAA,SAAQ;AAAA,MAChE,UACC,oBAAC,OAAA,EAAI,WAAU,4BACb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,SAAS,OAAO;AAAA,UAChB,SAAS,OAAO,WAAW;AAAA,UAC3B,cAAc,OAAO,UAAU,aAAa;AAAA,UAE5C,UAAA;AAAA,YAAA,oBAAC,MAAA,EAAK,MAAM,OAAA,CAAQ;AAAA,YAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,EAExB,CACF;AAAA,IAAA,GAEJ;AAAA,IACC,cACC,qBAAC,WAAA,EAAQ,WAAU,cACjB,UAAA;AAAA,MAAA,qBAAC,WAAA,EAAQ,WAAU,6GACjB,UAAA;AAAA,QAAA,oBAAC,MAAA,EAAK,MAAM,gBAAgB,WAAU,6CAA4C;AAAA,QAAE;AAAA,MAAA,GAEtF;AAAA,MACA,qBAAC,OAAA,EAAI,WAAU,8CACX,UAAA;AAAA,SAAA,QAAQ,UAAU,QAAQ,OAAO,QAAQ,WACzC,qBAAC,OAAA,EAAI,WAAU,yBACZ,UAAA;AAAA,UAAA,QAAQ,+BAAW,QAAA,EAAM,UAAA;AAAA,YAAA,QAAQ;AAAA,YAAO;AAAA,UAAA,GAAC;AAAA,UACzC,QAAQ;AAAA,UACR,QAAQ,UAAU,QAAQ,qBAAC,QAAA,EAAK,UAAA;AAAA,YAAA;AAAA,YAAI,QAAQ;AAAA,UAAA,EAAA,CAAO;AAAA,QAAA,GACtD;AAAA,QAED,QAAQ,gBACP,oBAAC,SAAI,WAAU,0DACZ,kBAAQ,aAAA,CACX;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;AAEA,SAAS,gBAAgB,OAA8B;AACrD,MAAI,SAAS,QAAQ,OAAO,UAAU,iBAAiB,CAAA;AACvD,QAAM,SAAS;AACf,QAAM,UAAwB,CAAA;AAC9B,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,QAAQ,SAAU,SAAQ,MAAM,OAAO;AACzD,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,iBAAiB,SAAU,SAAQ,eAAe,OAAO;AAC3E,SAAO;AACT;"}
+{"version":3,"file":"InlineError.js","sources":["../../src/rpc/InlineError.tsx"],"sourcesContent":["import { Button } from \"../components/button\";\nimport { ErrorDetails } from \"../data/diagnostics/ErrorDetails\";\nimport { Icon } from \"../data/Icon\";\nimport { UiPlay } from \"../icons\";\nimport { operationErrorDiagnostics } from \"./operationErrorDiagnostics\";\n\nexport type InlineErrorProps = {\n  title: string;\n  error: unknown;\n  className?: string;\n  runNow?: {\n    onClick: () => void;\n    loading?: boolean;\n  };\n};\n\nexport function InlineError({ title, error, className, runNow }: InlineErrorProps) {\n  return (\n    <ErrorDetails\n      title={title}\n      diagnostics={operationErrorDiagnostics(error)}\n      {...(className ? { className } : {})}\n      actions={\n        runNow && (\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"sm\"\n            onClick={runNow.onClick}\n            loading={runNow.loading ?? false}\n            loadingLabel={runNow.loading ? \"Running…\" : undefined}\n          >\n            <Icon icon={UiPlay} />\n            Run now\n          </Button>\n        )\n      }\n    />\n  );\n}\n"],"names":[],"mappings":";;;;;;AAgBO,SAAS,YAAY,EAAE,OAAO,OAAO,WAAW,UAA4B;AACjF,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,aAAa,0BAA0B,KAAK;AAAA,MAC3C,GAAI,YAAY,EAAE,UAAA,IAAc,CAAA;AAAA,MACjC,SACE,UACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,SAAS,OAAO;AAAA,UAChB,SAAS,OAAO,WAAW;AAAA,UAC3B,cAAc,OAAO,UAAU,aAAa;AAAA,UAE5C,UAAA;AAAA,YAAA,oBAAC,MAAA,EAAK,MAAM,OAAA,CAAQ;AAAA,YAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAExB;AAAA,EAAA;AAKV;"}

package/dist/rpc/OperationArgsForm.cjs

@@ -0,0 +1,153 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const FilterForm = require("./FilterForm.cjs");
+const clickyMetadata = require("./clickyMetadata.cjs");
+const formMetadata = require("./formMetadata.cjs");
+const NO_PARAMETERS = [];
+function OperationArgsForm({
+  client,
+  operation,
+  args,
+  onChange,
+  onValidityChange,
+  className
+}) {
+  var _a;
+  const parameters = operation.operation.parameters ?? NO_PARAMETERS;
+  const [initial] = react.useState(
+    () => storedArgsToValues(args, parameters, operation.method)
+  );
+  const [values, setValues] = react.useState(initial.values);
+  const problems = react.useMemo(
+    () => parameterProblems(parameters, values),
+    [parameters, values]
+  );
+  const valid = problems.length === 0;
+  react.useEffect(() => {
+    onValidityChange == null ? void 0 : onValidityChange(valid);
+  }, [onValidityChange, valid]);
+  const handleChange = (next) => {
+    setValues(next);
+    onChange(
+      valuesToArgs({
+        parameters,
+        method: operation.method,
+        values: next,
+        stored: initial.names
+      })
+    );
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      FilterForm.FilterForm,
+      {
+        client,
+        path: operation.path,
+        method: operation.method,
+        parameters,
+        initialValues: initial.values,
+        enableLookup: Boolean((_a = clickyMetadata.getOperationClickyMeta(operation)) == null ? void 0 : _a.supportsLookup),
+        showSubmit: false,
+        onChange: handleChange,
+        onSubmit: () => void 0,
+        ...className ? { className } : {}
+      }
+    ),
+    initial.dropped.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: [
+      "Dropped arguments this operation no longer accepts:",
+      " ",
+      initial.dropped.join(", ")
+    ] }) : null,
+    problems.map((problem) => /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-destructive", children: problem }, problem))
+  ] });
+}
+function storedArgsToValues(args, parameters, method) {
+  const known = new Set(parameters.map((parameter) => parameter.name));
+  const stored = {};
+  const dropped = [];
+  for (const [name, value] of Object.entries(args)) {
+    if (!known.has(name)) {
+      dropped.push(name);
+      continue;
+    }
+    stored[name] = storedValueToString(name, value);
+  }
+  return {
+    values: formMetadata.buildInitialParameterValues(parameters, method, {}, stored),
+    names: new Set(Object.keys(stored)),
+    dropped
+  };
+}
+function storedValueToString(name, value) {
+  if (Array.isArray(value)) return value.map(String).join(",");
+  if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") {
+    return String(value);
+  }
+  throw new Error(
+    `Stored argument ${name} has an unsupported value: ${JSON.stringify(value)}`
+  );
+}
+function valuesToArgs({
+  parameters,
+  method,
+  values,
+  stored
+}) {
+  const args = {};
+  for (const parameter of parameters) {
+    const raw = values[parameter.name] ?? "";
+    if (raw.trim() === "") continue;
+    const isDefault = raw === effectiveDefault(parameter, method);
+    if (isDefault && !parameter.required && !stored.has(parameter.name)) continue;
+    args[parameter.name] = typedValue(parameter, raw);
+  }
+  return args;
+}
+function effectiveDefault(parameter, method) {
+  var _a;
+  const value = formMetadata.defaultValueForParameter(parameter, method);
+  return ((_a = parameter.schema) == null ? void 0 : _a.type) === "boolean" && value === "" ? "false" : value;
+}
+function typedValue(parameter, raw) {
+  var _a;
+  switch ((_a = parameter.schema) == null ? void 0 : _a.type) {
+    case "boolean":
+      return raw === "true";
+    case "integer":
+      return isWholeNumber(raw) ? Number(raw) : raw;
+    case "number":
+      return isNumber(raw) ? Number(raw) : raw;
+    case "array":
+      return raw.split(",").map((item) => item.trim()).filter(Boolean);
+    default:
+      return raw;
+  }
+}
+function parameterProblems(parameters, values) {
+  var _a, _b;
+  const missing = parameters.filter(
+    (parameter) => parameter.required && (values[parameter.name] ?? "").trim() === ""
+  ).map((parameter) => formMetadata.titleCase(parameter.name));
+  const problems = missing.length > 0 ? [`Missing required fields: ${missing.join(", ")}`] : [];
+  for (const parameter of parameters) {
+    const raw = (values[parameter.name] ?? "").trim();
+    if (raw === "") continue;
+    const label = formMetadata.titleCase(parameter.name);
+    if (((_a = parameter.schema) == null ? void 0 : _a.type) === "integer" && !isWholeNumber(raw)) {
+      problems.push(`${label} must be a whole number.`);
+    } else if (((_b = parameter.schema) == null ? void 0 : _b.type) === "number" && !isNumber(raw)) {
+      problems.push(`${label} must be a number.`);
+    }
+  }
+  return problems;
+}
+function isWholeNumber(raw) {
+  return /^-?\d+$/.test(raw.trim());
+}
+function isNumber(raw) {
+  return raw.trim() !== "" && Number.isFinite(Number(raw));
+}
+exports.OperationArgsForm = OperationArgsForm;
+//# sourceMappingURL=OperationArgsForm.cjs.map