@flanksource/clicky-ui 0.3.26 → 0.3.28

package/dist/data/ai/ToolSchemaBrowser.sidebar.js

@@ -0,0 +1,389 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useRef, useEffect } from "react";
+import { IconButton } from "../../components/IconButton.js";
+import { SegmentedControl } from "../../components/SegmentedControl.js";
+import { ListMenu, ListMenuSection, ListMenuHeader, ListMenuItem } from "../../components/ListMenu.js";
+import { DropdownMenu } from "../../overlay/DropdownMenu.js";
+import { cn } from "../../lib/utils.js";
+import { Icon } from "../Icon.js";
+import { ToolDirectoryHeader } from "./ToolSchemaBrowser.directory-header.js";
+import { ToolSelectionStrategyToolbar } from "./ToolSchemaBrowser.selection-toolbar.js";
+import { TOOL_HINTS, selectedToolState, updateSelectedTools, directoryPermissionRule } from "./ToolSchemaBrowser.model.js";
+import { UiSearch } from "../../icons/components/UiSearch.js";
+import { UiListDashes } from "../../icons/components/UiListDashes.js";
+import { UiLayers } from "../../icons/components/UiLayers.js";
+import { UiFilter } from "../../icons/components/UiFilter.js";
+import { UiEye } from "../../icons/components/UiEye.js";
+import { UiWarningTriangle } from "../../icons/components/UiWarningTriangle.js";
+import { UiRepeat } from "../../icons/components/UiRepeat.js";
+import { UiGlobe } from "../../icons/components/UiGlobe.js";
+import { UiWrench } from "../../icons/components/UiWrench.js";
+function ToolSchemaBrowserSidebar({
+  query,
+  view,
+  filters,
+  sections,
+  active,
+  filteredCount,
+  isOpen,
+  selection,
+  value,
+  onRule,
+  onQueryChange,
+  onViewChange,
+  onFilterChange,
+  onClearFilters,
+  onToggle,
+  onSelect
+}) {
+  const selected = (selection == null ? void 0 : selection.selected) ?? /* @__PURE__ */ new Set();
+  const activeFilterCount = Object.values(filters).filter(
+    (filter) => filter !== "any"
+  ).length;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("label", { className: "flex h-9 shrink-0 items-center gap-2 border-b border-border px-2 text-xs", children: [
+      /* @__PURE__ */ jsx(Icon, { icon: UiSearch, className: "size-3.5 text-muted-foreground" }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          value: query,
+          onChange: (event) => onQueryChange(event.target.value),
+          placeholder: "Search tools",
+          className: "min-w-0 flex-1 bg-transparent outline-none"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-1 border-b border-border px-2 py-1", children: [
+      /* @__PURE__ */ jsx(
+        ViewToggleButton,
+        {
+          active: view === "group",
+          icon: UiListDashes,
+          label: "Group",
+          onClick: () => onViewChange("group")
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        ViewToggleButton,
+        {
+          active: view === "tree",
+          icon: UiLayers,
+          label: "Tree",
+          onClick: () => onViewChange("tree")
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        DropdownMenu,
+        {
+          align: "right",
+          menuLabel: "Tool annotation filters",
+          menuClassName: "w-72 p-2",
+          className: "ml-auto",
+          trigger: /* @__PURE__ */ jsxs("span", { className: "relative inline-flex", children: [
+            /* @__PURE__ */ jsx(
+              IconButton,
+              {
+                icon: UiFilter,
+                label: activeFilterCount > 0 ? `Filter tool annotations, ${activeFilterCount} active` : "Filter tool annotations",
+                className: cn(
+                  activeFilterCount > 0 && "bg-primary/10 text-primary"
+                )
+              }
+            ),
+            activeFilterCount > 0 && /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute -right-1 -top-1 flex size-4 items-center justify-center rounded-full bg-primary text-[9px] font-bold text-primary-foreground", children: activeFilterCount })
+          ] }),
+          children: () => /* @__PURE__ */ jsxs("div", { className: "space-y-density-2", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-density-2", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold", children: "Tool annotations" }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  disabled: activeFilterCount === 0,
+                  onClick: onClearFilters,
+                  className: "text-[10px] font-medium text-primary disabled:text-muted-foreground",
+                  children: "Clear all"
+                }
+              )
+            ] }),
+            TOOL_HINTS.map(({ key, label }) => /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+              /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 text-[10px] font-medium text-muted-foreground", children: [
+                /* @__PURE__ */ jsx(
+                  Icon,
+                  {
+                    icon: hintFilterIcon(key),
+                    className: cn("size-3", hintIconClass(key))
+                  }
+                ),
+                label
+              ] }),
+              /* @__PURE__ */ jsx(
+                SegmentedControl,
+                {
+                  "aria-label": label,
+                  value: filters[key],
+                  onChange: (next) => onFilterChange(key, next),
+                  size: "sm",
+                  className: "w-full",
+                  options: [
+                    { id: "any", label: "Any" },
+                    { id: "yes", label: "Yes" },
+                    { id: "no", label: "No" }
+                  ]
+                }
+              )
+            ] }, key))
+          ] })
+        }
+      )
+    ] }),
+    selection && onRule && selection.count > 0 && /* @__PURE__ */ jsx(
+      ToolSelectionStrategyToolbar,
+      {
+        selection,
+        onRule
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      ListMenu,
+      {
+        className: "min-h-0 flex-1 overflow-y-auto divide-y-0",
+        ...selection ? { selection } : {},
+        children: [
+          sections.map((section) => {
+            const sectionKey = `p:${section.label}`;
+            const sectionOpen = isOpen(sectionKey);
+            const sectionTools = section.children.flatMap((child) => child.tools);
+            const sectionNames = sectionTools.map((tool) => tool.name);
+            const sectionState = selectedToolState(selected, sectionNames);
+            return /* @__PURE__ */ jsxs(ListMenuSection, { children: [
+              /* @__PURE__ */ jsxs(ListMenuHeader, { className: "px-0 py-0", children: [
+                selection && /* @__PURE__ */ jsx(
+                  SelectionCheckbox,
+                  {
+                    label: `Select all visible tools in ${section.label}`,
+                    checked: sectionState.checked,
+                    mixed: sectionState.mixed,
+                    onChange: () => selection.set(
+                      updateSelectedTools(
+                        selection.selectedKeys,
+                        sectionNames
+                      )
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  ToolDirectoryHeader,
+                  {
+                    label: section.label,
+                    count: section.count,
+                    open: sectionOpen,
+                    variant: "section",
+                    onToggle: () => onToggle(sectionKey),
+                    ...onRule ? {
+                      onAdd: () => onRule(
+                        directoryPermissionRule({
+                          tools: sectionTools,
+                          view,
+                          depth: "section"
+                        })
+                      )
+                    } : {}
+                  }
+                )
+              ] }),
+              sectionOpen && section.children.map((child) => {
+                const childKey = `s:${section.label}///${child.label}`;
+                const childOpen = isOpen(childKey);
+                const childNames = child.tools.map((tool) => tool.name);
+                const childState = selectedToolState(selected, childNames);
+                return /* @__PURE__ */ jsxs("div", { children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center border-b border-border bg-background pl-2", children: [
+                    selection && /* @__PURE__ */ jsx(
+                      SelectionCheckbox,
+                      {
+                        label: `Select all visible tools in ${child.label}`,
+                        checked: childState.checked,
+                        mixed: childState.mixed,
+                        onChange: () => selection.set(
+                          updateSelectedTools(
+                            selection.selectedKeys,
+                            childNames
+                          )
+                        )
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      ToolDirectoryHeader,
+                      {
+                        label: child.label,
+                        count: child.tools.length,
+                        open: childOpen,
+                        variant: "child",
+                        onToggle: () => onToggle(childKey),
+                        ...onRule ? {
+                          onAdd: () => onRule(
+                            directoryPermissionRule({
+                              tools: child.tools,
+                              view,
+                              depth: "child"
+                            })
+                          )
+                        } : {}
+                      }
+                    )
+                  ] }),
+                  childOpen && child.tools.map((tool) => /* @__PURE__ */ jsx(
+                    ToolSidebarRow,
+                    {
+                      tool,
+                      active: (active == null ? void 0 : active.name) === tool.name,
+                      policy: value == null ? void 0 : value[tool.name],
+                      selectable: selection !== void 0,
+                      onSelect: () => onSelect(tool.name)
+                    },
+                    tool.name
+                  ))
+                ] }, childKey);
+              })
+            ] }, sectionKey);
+          }),
+          filteredCount === 0 && /* @__PURE__ */ jsx("div", { className: "px-3 py-8 text-center text-xs text-muted-foreground", children: "No matching tools" })
+        ]
+      }
+    )
+  ] });
+}
+function ToolSidebarRow({
+  tool,
+  active,
+  policy,
+  selectable,
+  onSelect
+}) {
+  return /* @__PURE__ */ jsx(
+    ListMenuItem,
+    {
+      active,
+      role: "button",
+      tabIndex: 0,
+      "aria-selected": active,
+      "aria-label": tool.label || tool.name,
+      className: cn("px-2 py-2", selectable ? "pl-4" : "pl-6"),
+      onClick: onSelect,
+      onKeyDown: (event) => {
+        if (event.key === "Enter" || event.key === " ") {
+          event.preventDefault();
+          onSelect();
+        }
+      },
+      ...selectable ? {
+        itemKey: tool.name,
+        checkboxLabel: `Select ${tool.label || tool.name}`
+      } : {},
+      children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[1rem_minmax(0,1fr)_auto] items-center gap-2", children: [
+        tool.icon ? /* @__PURE__ */ jsx(Icon, { name: tool.icon, className: "size-3.5 text-muted-foreground" }) : /* @__PURE__ */ jsx(Icon, { icon: UiWrench, className: "size-3.5 text-muted-foreground" }),
+        /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-xs font-medium", children: tool.label || tool.name }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx(ToolHintIcons, { tool }),
+          policy && /* @__PURE__ */ jsx("span", { className: "rounded bg-muted px-1 py-0.5 text-[9px] font-medium capitalize text-muted-foreground", children: policy === "allow" ? "On" : policy === "deny" ? "Off" : policy })
+        ] })
+      ] })
+    }
+  );
+}
+function ToolHintIcons({ tool }) {
+  var _a, _b, _c, _d;
+  const hints = [
+    [
+      (_a = tool.annotations) == null ? void 0 : _a.readOnlyHint,
+      "Read only tool",
+      UiEye,
+      "text-emerald-600"
+    ],
+    [
+      (_b = tool.annotations) == null ? void 0 : _b.destructiveHint,
+      "Destructive tool",
+      UiWarningTriangle,
+      "text-red-600"
+    ],
+    [
+      (_c = tool.annotations) == null ? void 0 : _c.idempotentHint,
+      "Idempotent tool",
+      UiRepeat,
+      "text-sky-600"
+    ],
+    [
+      (_d = tool.annotations) == null ? void 0 : _d.openWorldHint,
+      "Open world tool",
+      UiGlobe,
+      "text-violet-600"
+    ]
+  ];
+  return hints.flatMap(
+    ([enabled, label, icon, className]) => enabled ? [
+      /* @__PURE__ */ jsx("span", { role: "img", "aria-label": label, title: label, children: /* @__PURE__ */ jsx(Icon, { icon, className: cn("size-3", className) }) }, label)
+    ] : []
+  );
+}
+function SelectionCheckbox({
+  label,
+  checked,
+  mixed,
+  onChange
+}) {
+  const ref = useRef(null);
+  useEffect(() => {
+    if (ref.current) ref.current.indeterminate = mixed;
+  }, [mixed]);
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      ref,
+      type: "checkbox",
+      checked,
+      "aria-label": label,
+      onChange,
+      className: "ml-2 size-3.5 shrink-0 rounded border-input"
+    }
+  );
+}
+function ViewToggleButton({
+  active,
+  icon,
+  label,
+  onClick
+}) {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      "aria-pressed": active,
+      className: cn(
+        "flex items-center gap-1 rounded px-2 py-0.5 text-[11px] font-medium",
+        active ? "bg-accent text-foreground" : "text-muted-foreground hover:bg-accent/50"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(Icon, { icon, className: "size-3.5" }),
+        label
+      ]
+    }
+  );
+}
+function hintFilterIcon(key) {
+  if (key === "readOnlyHint") return UiEye;
+  if (key === "destructiveHint") return UiWarningTriangle;
+  if (key === "idempotentHint") return UiRepeat;
+  return UiGlobe;
+}
+function hintIconClass(key) {
+  if (key === "readOnlyHint") return "text-emerald-600";
+  if (key === "destructiveHint") return "text-red-600";
+  if (key === "idempotentHint") return "text-sky-600";
+  return "text-violet-600";
+}
+export {
+  ToolSchemaBrowserSidebar
+};
+//# sourceMappingURL=ToolSchemaBrowser.sidebar.js.map

package/dist/data/ai/ToolSchemaBrowser.sidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolSchemaBrowser.sidebar.js","sources":["../../../src/data/ai/ToolSchemaBrowser.sidebar.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { IconButton } from \"../../components/IconButton\";\nimport { SegmentedControl } from \"../../components/SegmentedControl\";\nimport {\n  ListMenu,\n  ListMenuHeader,\n  ListMenuItem,\n  ListMenuSection,\n} from \"../../components/ListMenu\";\nimport type { ListMenuSelection } from \"../../components/use-list-menu-selection\";\nimport { DropdownMenu } from \"../../overlay/DropdownMenu\";\nimport { cn } from \"../../lib/utils\";\nimport {\n  UiEye,\n  UiFilter,\n  UiGlobe,\n  UiLayers,\n  UiListDashes,\n  UiRepeat,\n  UiSearch,\n  UiWarningTriangle,\n  UiWrench,\n} from \"../../icons\";\nimport { Icon, type StaticIconComponent } from \"../Icon\";\nimport type { PermissionRule } from \"../chat/tool-policy\";\nimport type { ToolMeta, ToolPolicy } from \"../chat/types\";\nimport { ToolDirectoryHeader } from \"./ToolSchemaBrowser.directory-header\";\nimport { ToolSelectionStrategyToolbar } from \"./ToolSchemaBrowser.selection-toolbar\";\nimport {\n  TOOL_HINTS,\n  directoryPermissionRule,\n  selectedToolState,\n  updateSelectedTools,\n  type ToolHintFilter,\n  type ToolHintFilters,\n  type ToolHintKey,\n  type ToolSchemaViewMode,\n  type ToolSection,\n} from \"./ToolSchemaBrowser.model\";\n\nexport function ToolSchemaBrowserSidebar({\n  query,\n  view,\n  filters,\n  sections,\n  active,\n  filteredCount,\n  isOpen,\n  selection,\n  value,\n  onRule,\n  onQueryChange,\n  onViewChange,\n  onFilterChange,\n  onClearFilters,\n  onToggle,\n  onSelect,\n}: {\n  query: string;\n  view: ToolSchemaViewMode;\n  filters: ToolHintFilters;\n  sections: ToolSection[];\n  active: ToolMeta | undefined;\n  filteredCount: number;\n  isOpen: (key: string) => boolean;\n  selection?: ListMenuSelection | undefined;\n  value: Record<string, ToolPolicy> | undefined;\n  onRule: ((rule: PermissionRule) => void) | undefined;\n  onQueryChange: (query: string) => void;\n  onViewChange: (view: ToolSchemaViewMode) => void;\n  onFilterChange: (key: ToolHintKey, value: ToolHintFilter) => void;\n  onClearFilters: () => void;\n  onToggle: (key: string) => void;\n  onSelect: (name: string) => void;\n}) {\n  const selected = selection?.selected ?? new Set<string>();\n  const activeFilterCount = Object.values(filters).filter(\n    (filter) => filter !== \"any\",\n  ).length;\n  return (\n    <>\n      <label className=\"flex h-9 shrink-0 items-center gap-2 border-b border-border px-2 text-xs\">\n        <Icon icon={UiSearch} className=\"size-3.5 text-muted-foreground\" />\n        <input\n          value={query}\n          onChange={(event) => onQueryChange(event.target.value)}\n          placeholder=\"Search tools\"\n          className=\"min-w-0 flex-1 bg-transparent outline-none\"\n        />\n      </label>\n      <div className=\"flex shrink-0 items-center gap-1 border-b border-border px-2 py-1\">\n        <ViewToggleButton\n          active={view === \"group\"}\n          icon={UiListDashes}\n          label=\"Group\"\n          onClick={() => onViewChange(\"group\")}\n        />\n        <ViewToggleButton\n          active={view === \"tree\"}\n          icon={UiLayers}\n          label=\"Tree\"\n          onClick={() => onViewChange(\"tree\")}\n        />\n        <DropdownMenu\n          align=\"right\"\n          menuLabel=\"Tool annotation filters\"\n          menuClassName=\"w-72 p-2\"\n          className=\"ml-auto\"\n          trigger={\n            <span className=\"relative inline-flex\">\n              <IconButton\n                icon={UiFilter}\n                label={\n                  activeFilterCount > 0\n                    ? `Filter tool annotations, ${activeFilterCount} active`\n                    : \"Filter tool annotations\"\n                }\n                className={cn(\n                  activeFilterCount > 0 && \"bg-primary/10 text-primary\",\n                )}\n              />\n              {activeFilterCount > 0 && (\n                <span className=\"pointer-events-none absolute -right-1 -top-1 flex size-4 items-center justify-center rounded-full bg-primary text-[9px] font-bold text-primary-foreground\">\n                  {activeFilterCount}\n                </span>\n              )}\n            </span>\n          }\n        >\n          {() => (\n            <div className=\"space-y-density-2\">\n              <div className=\"flex items-center justify-between gap-density-2\">\n                <span className=\"text-xs font-semibold\">Tool annotations</span>\n                <button\n                  type=\"button\"\n                  disabled={activeFilterCount === 0}\n                  onClick={onClearFilters}\n                  className=\"text-[10px] font-medium text-primary disabled:text-muted-foreground\"\n                >\n                  Clear all\n                </button>\n              </div>\n              {TOOL_HINTS.map(({ key, label }) => (\n                <div key={key} className=\"space-y-1\">\n                  <span className=\"flex items-center gap-1 text-[10px] font-medium text-muted-foreground\">\n                    <Icon\n                      icon={hintFilterIcon(key)}\n                      className={cn(\"size-3\", hintIconClass(key))}\n                    />\n                    {label}\n                  </span>\n                  <SegmentedControl<ToolHintFilter>\n                    aria-label={label}\n                    value={filters[key]}\n                    onChange={(next) => onFilterChange(key, next)}\n                    size=\"sm\"\n                    className=\"w-full\"\n                    options={[\n                      { id: \"any\", label: \"Any\" },\n                      { id: \"yes\", label: \"Yes\" },\n                      { id: \"no\", label: \"No\" },\n                    ]}\n                  />\n                </div>\n              ))}\n            </div>\n          )}\n        </DropdownMenu>\n      </div>\n      {selection && onRule && selection.count > 0 && (\n        <ToolSelectionStrategyToolbar\n          selection={selection}\n          onRule={onRule}\n        />\n      )}\n      <ListMenu\n        className=\"min-h-0 flex-1 overflow-y-auto divide-y-0\"\n        {...(selection ? { selection } : {})}\n      >\n        {sections.map((section) => {\n          const sectionKey = `p:${section.label}`;\n          const sectionOpen = isOpen(sectionKey);\n          const sectionTools = section.children.flatMap((child) => child.tools);\n          const sectionNames = sectionTools.map((tool) => tool.name);\n          const sectionState = selectedToolState(selected, sectionNames);\n          return (\n            <ListMenuSection key={sectionKey}>\n              <ListMenuHeader className=\"px-0 py-0\">\n                {selection && (\n                  <SelectionCheckbox\n                    label={`Select all visible tools in ${section.label}`}\n                    checked={sectionState.checked}\n                    mixed={sectionState.mixed}\n                    onChange={() =>\n                      selection.set(\n                        updateSelectedTools(\n                          selection.selectedKeys,\n                          sectionNames,\n                        ),\n                      )\n                    }\n                  />\n                )}\n                <ToolDirectoryHeader\n                  label={section.label}\n                  count={section.count}\n                  open={sectionOpen}\n                  variant=\"section\"\n                  onToggle={() => onToggle(sectionKey)}\n                  {...(onRule\n                    ? {\n                        onAdd: () =>\n                          onRule(\n                            directoryPermissionRule({\n                              tools: sectionTools,\n                              view,\n                              depth: \"section\",\n                            }),\n                          ),\n                      }\n                    : {})}\n                />\n              </ListMenuHeader>\n              {sectionOpen &&\n                section.children.map((child) => {\n                  const childKey = `s:${section.label}///${child.label}`;\n                  const childOpen = isOpen(childKey);\n                  const childNames = child.tools.map((tool) => tool.name);\n                  const childState = selectedToolState(selected, childNames);\n                  return (\n                    <div key={childKey}>\n                      <div className=\"flex items-center border-b border-border bg-background pl-2\">\n                        {selection && (\n                          <SelectionCheckbox\n                            label={`Select all visible tools in ${child.label}`}\n                            checked={childState.checked}\n                            mixed={childState.mixed}\n                            onChange={() =>\n                              selection.set(\n                                updateSelectedTools(\n                                  selection.selectedKeys,\n                                  childNames,\n                                ),\n                              )\n                            }\n                          />\n                        )}\n                        <ToolDirectoryHeader\n                          label={child.label}\n                          count={child.tools.length}\n                          open={childOpen}\n                          variant=\"child\"\n                          onToggle={() => onToggle(childKey)}\n                          {...(onRule\n                            ? {\n                                onAdd: () =>\n                                  onRule(\n                                    directoryPermissionRule({\n                                      tools: child.tools,\n                                      view,\n                                      depth: \"child\",\n                                    }),\n                                  ),\n                              }\n                            : {})}\n                        />\n                      </div>\n                      {childOpen &&\n                        child.tools.map((tool) => (\n                          <ToolSidebarRow\n                            key={tool.name}\n                            tool={tool}\n                            active={active?.name === tool.name}\n                            policy={value?.[tool.name]}\n                            selectable={selection !== undefined}\n                            onSelect={() => onSelect(tool.name)}\n                          />\n                        ))}\n                    </div>\n                  );\n                })}\n            </ListMenuSection>\n          );\n        })}\n        {filteredCount === 0 && (\n          <div className=\"px-3 py-8 text-center text-xs text-muted-foreground\">\n            No matching tools\n          </div>\n        )}\n      </ListMenu>\n    </>\n  );\n}\n\nfunction ToolSidebarRow({\n  tool,\n  active,\n  policy,\n  selectable,\n  onSelect,\n}: {\n  tool: ToolMeta;\n  active: boolean;\n  policy: ToolPolicy | undefined;\n  selectable: boolean;\n  onSelect: () => void;\n}) {\n  return (\n    <ListMenuItem\n      active={active}\n      role=\"button\"\n      tabIndex={0}\n      aria-selected={active}\n      aria-label={tool.label || tool.name}\n      className={cn(\"px-2 py-2\", selectable ? \"pl-4\" : \"pl-6\")}\n      onClick={onSelect}\n      onKeyDown={(event) => {\n        if (event.key === \"Enter\" || event.key === \" \") {\n          event.preventDefault();\n          onSelect();\n        }\n      }}\n      {...(selectable\n        ? {\n            itemKey: tool.name,\n            checkboxLabel: `Select ${tool.label || tool.name}`,\n          }\n        : {})}\n    >\n      <div className=\"grid grid-cols-[1rem_minmax(0,1fr)_auto] items-center gap-2\">\n        {tool.icon ? (\n          <Icon name={tool.icon} className=\"size-3.5 text-muted-foreground\" />\n        ) : (\n          <Icon icon={UiWrench} className=\"size-3.5 text-muted-foreground\" />\n        )}\n        <span className=\"min-w-0 truncate text-xs font-medium\">\n          {tool.label || tool.name}\n        </span>\n        <div className=\"flex items-center gap-1\">\n          <ToolHintIcons tool={tool} />\n          {policy && (\n            <span className=\"rounded bg-muted px-1 py-0.5 text-[9px] font-medium capitalize text-muted-foreground\">\n              {policy === \"allow\" ? \"On\" : policy === \"deny\" ? \"Off\" : policy}\n            </span>\n          )}\n        </div>\n      </div>\n    </ListMenuItem>\n  );\n}\n\nfunction ToolHintIcons({ tool }: { tool: ToolMeta }) {\n  const hints = [\n    [\n      tool.annotations?.readOnlyHint,\n      \"Read only tool\",\n      UiEye,\n      \"text-emerald-600\",\n    ],\n    [\n      tool.annotations?.destructiveHint,\n      \"Destructive tool\",\n      UiWarningTriangle,\n      \"text-red-600\",\n    ],\n    [\n      tool.annotations?.idempotentHint,\n      \"Idempotent tool\",\n      UiRepeat,\n      \"text-sky-600\",\n    ],\n    [\n      tool.annotations?.openWorldHint,\n      \"Open world tool\",\n      UiGlobe,\n      \"text-violet-600\",\n    ],\n  ] as const;\n  return hints.flatMap(([enabled, label, icon, className]) =>\n    enabled\n      ? [\n          <span key={label} role=\"img\" aria-label={label} title={label}>\n            <Icon icon={icon} className={cn(\"size-3\", className)} />\n          </span>,\n        ]\n      : [],\n  );\n}\n\nfunction SelectionCheckbox({\n  label,\n  checked,\n  mixed,\n  onChange,\n}: {\n  label: string;\n  checked: boolean;\n  mixed: boolean;\n  onChange: () => void;\n}) {\n  const ref = useRef<HTMLInputElement>(null);\n  useEffect(() => {\n    if (ref.current) ref.current.indeterminate = mixed;\n  }, [mixed]);\n  return (\n    <input\n      ref={ref}\n      type=\"checkbox\"\n      checked={checked}\n      aria-label={label}\n      onChange={onChange}\n      className=\"ml-2 size-3.5 shrink-0 rounded border-input\"\n    />\n  );\n}\n\nfunction ViewToggleButton({\n  active,\n  icon,\n  label,\n  onClick,\n}: {\n  active: boolean;\n  icon: StaticIconComponent;\n  label: string;\n  onClick: () => void;\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      aria-pressed={active}\n      className={cn(\n        \"flex items-center gap-1 rounded px-2 py-0.5 text-[11px] font-medium\",\n        active\n          ? \"bg-accent text-foreground\"\n          : \"text-muted-foreground hover:bg-accent/50\",\n      )}\n    >\n      <Icon icon={icon} className=\"size-3.5\" />\n      {label}\n    </button>\n  );\n}\n\nfunction hintFilterIcon(key: ToolHintKey): StaticIconComponent {\n  if (key === \"readOnlyHint\") return UiEye;\n  if (key === \"destructiveHint\") return UiWarningTriangle;\n  if (key === \"idempotentHint\") return UiRepeat;\n  return UiGlobe;\n}\n\nfunction hintIconClass(key: ToolHintKey): string {\n  if (key === \"readOnlyHint\") return \"text-emerald-600\";\n  if (key === \"destructiveHint\") return \"text-red-600\";\n  if (key === \"idempotentHint\") return \"text-sky-600\";\n  return \"text-violet-600\";\n}\n"],"names":[],"mappings":"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"}

package/dist/data/ai/agent-action-icons.cjs

@@ -47,12 +47,20 @@ function effortIcon(value) {
   return void 0;
 }
 const PERMISSION_MODE_ICONS = {
-  default: { icon: UiHandPalm.UiHandPalm, tone: "slate", label: "Ask" },
-  plan: { icon: UiPauseCircle.UiPauseCircle, tone: "sky", label: "Plan" },
-  acceptEdits: { icon: UiFastForwardCircle.UiFastForwardCircle, tone: "emerald", label: "Auto" },
-  auto: { icon: UiFastForwardCircle.UiFastForwardCircle, tone: "emerald", label: "Auto" },
-  dontAsk: { icon: UiFastForwardCircle.UiFastForwardCircle, tone: "emerald", label: "Don't ask" },
-  bypassPermissions: { icon: UiShieldSlash.UiShieldSlash, tone: "rose", label: "Off" }
+  default: { icon: UiHandPalm.UiHandPalm, tone: "slate", label: "Manual" },
+  plan: { icon: UiPauseCircle.UiPauseCircle, tone: "teal", label: "Plan" },
+  acceptEdits: {
+    icon: UiFastForwardCircle.UiFastForwardCircle,
+    tone: "violet",
+    label: "Accept edits"
+  },
+  auto: { icon: UiFastForwardCircle.UiFastForwardCircle, tone: "violet", label: "Auto" },
+  dontAsk: { icon: UiShieldSlash.UiShieldSlash, tone: "rose", label: "Don't ask" },
+  bypassPermissions: {
+    icon: UiShieldSlash.UiShieldSlash,
+    tone: "rose",
+    label: "Bypass permissions"
+  }
 };
 const APPROVAL_ICONS = {
   question: { icon: UiQuestion.UiQuestion, tone: "sky", label: "Question" },

package/dist/data/ai/agent-action-icons.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"agent-action-icons.cjs","sources":["../../../src/data/ai/agent-action-icons.ts"],"sourcesContent":["import type { StaticIconComponent } from \"../Icon\";\nimport {\n  EFFORT_LEVEL_ICONS,\n  effortLevelLabel,\n  type EffortLevel,\n} from \"../chat/effort-icons\";\nimport type { SessionTone } from \"./SessionViewer.model\";\nimport type { SpecPermissionMode } from \"./SpecRuntimeEditor.model\";\nimport {\n  UiArrowFatUp,\n  UiBraces,\n  UiBox,\n  UiChatDots,\n  UiCircleX,\n  UiFastForwardCircle,\n  UiHandPalm,\n  UiPass,\n  UiPauseCircle,\n  UiPlayCircle,\n  UiQuestion,\n  UiSealCheck,\n  UiShieldSlash,\n  UiStrategy,\n  UiTerminal,\n} from \"../../icons\";\n\n// Implements the semantic groups of the Flanksource \"Agent Action Icons\" design\n// beyond the per-tool ACTIONS map (which lives in SessionViewer.model.ts). Each\n// entry pairs a generated Ui* glyph with a SessionTone so the disc/text color\n// (SESSION_TONES in session-tones.ts) encodes the action's category. Blue\n// reasons, green executes, teal confirms; the effort ramp climbs slate → sky →\n// amber → orange → rose → fuchsia; approval clears green / blocks red.\n\nexport interface AgentActionMeta {\n  icon: StaticIconComponent;\n  tone: SessionTone;\n  label: string;\n}\n\n// ── Agent workflow: plan → run → verify ─────────────────────────────────────\nexport type WorkflowPhase = \"plan\" | \"run\" | \"verify\";\n\nexport const WORKFLOW_PHASES: Record<WorkflowPhase, AgentActionMeta> = {\n  plan: { icon: UiStrategy, tone: \"sky\", label: \"Plan\" },\n  run: { icon: UiPlayCircle, tone: \"emerald\", label: \"Run\" },\n  verify: { icon: UiSealCheck, tone: \"teal\", label: \"Verify\" },\n};\n\n// ── Effort levels: reasoning / token budget on the severity hue ramp ─────────\n// The battery glyphs are the chat layer's source of truth (EFFORT_LEVEL_ICONS);\n// here we add the semantic tone + label so an effort chip reads at a glance.\nexport type { EffortLevel } from \"../chat/effort-icons\";\n\nconst EFFORT_TONES: Record<EffortLevel, SessionTone> = {\n  minimal: \"slate\",\n  low: \"sky\",\n  medium: \"amber\",\n  high: \"orange\",\n  xhigh: \"orange\",\n  max: \"rose\",\n  ultra: \"fuchsia\",\n  adaptive: \"indigo\",\n};\n\nexport const EFFORT_ICONS: Record<EffortLevel, AgentActionMeta> = Object.fromEntries(\n  (Object.keys(EFFORT_LEVEL_ICONS) as EffortLevel[]).map((level) => [\n    level,\n    {\n      icon: EFFORT_LEVEL_ICONS[level],\n      tone: EFFORT_TONES[level],\n      label: effortLevelLabel(level),\n    },\n  ]),\n) as Record<EffortLevel, AgentActionMeta>;\n\n/** Resolve the effort glyph for a known value. */\nexport function effortIcon(value: string): AgentActionMeta | undefined {\n  const key = value.trim().toLowerCase();\n  if (key in EFFORT_ICONS) return EFFORT_ICONS[key as EffortLevel];\n  return undefined;\n}\n\n// ── Permission modes: colors matched to Claude Code ──────────────────────────\nexport const PERMISSION_MODE_ICONS: Record<\n  SpecPermissionMode,\n  AgentActionMeta\n> = {\n  default: { icon: UiHandPalm, tone: \"slate\", label: \"Ask\" },\n  plan: { icon: UiPauseCircle, tone: \"sky\", label: \"Plan\" },\n  acceptEdits: { icon: UiFastForwardCircle, tone: \"emerald\", label: \"Auto\" },\n  auto: { icon: UiFastForwardCircle, tone: \"emerald\", label: \"Auto\" },\n  dontAsk: { icon: UiFastForwardCircle, tone: \"emerald\", label: \"Don't ask\" },\n  bypassPermissions: { icon: UiShieldSlash, tone: \"rose\", label: \"Off\" },\n};\n\n// ── Approval states: where a proposed action sits in the HITL flow ───────────\nexport type ApprovalState =\n  | \"question\"\n  | \"pending\"\n  | \"approved\"\n  | \"denied\"\n  | \"escalate\";\n\nexport const APPROVAL_ICONS: Record<ApprovalState, AgentActionMeta> = {\n  question: { icon: UiQuestion, tone: \"sky\", label: \"Question\" },\n  pending: { icon: UiChatDots, tone: \"amber\", label: \"Awaiting input\" },\n  approved: { icon: UiPass, tone: \"emerald\", label: \"Approved\" },\n  denied: { icon: UiCircleX, tone: \"rose\", label: \"Denied\" },\n  escalate: { icon: UiArrowFatUp, tone: \"orange\", label: \"Escalate\" },\n};\n\n// ── Agent runtimes: where an agent executes ──────────────────────────────────\nexport type AgentRuntime = \"sdk\" | \"terminal\" | \"api\";\n\nexport const AGENT_RUNTIME_ICONS: Record<AgentRuntime, AgentActionMeta> = {\n  sdk: { icon: UiBox, tone: \"indigo\", label: \"SDK agent\" },\n  terminal: { icon: UiTerminal, tone: \"slate\", label: \"Terminal agent\" },\n  api: { icon: UiBraces, tone: \"sky\", label: \"API agent\" },\n};\n"],"names":["UiStrategy","UiPlayCircle","UiSealCheck","EFFORT_LEVEL_ICONS","effortLevelLabel","UiHandPalm","UiPauseCircle","UiFastForwardCircle","UiShieldSlash","UiQuestion","UiChatDots","UiPass","UiCircleX","UiArrowFatUp","UiBox","UiTerminal","UiBraces"],"mappings":";;;;;;;;;;;;;;;;;;AA0CO,MAAM,kBAA0D;AAAA,EACrE,MAAM,EAAE,MAAMA,WAAAA,YAAY,MAAM,OAAO,OAAO,OAAA;AAAA,EAC9C,KAAK,EAAE,MAAMC,aAAAA,cAAc,MAAM,WAAW,OAAO,MAAA;AAAA,EACnD,QAAQ,EAAE,MAAMC,YAAAA,aAAa,MAAM,QAAQ,OAAO,SAAA;AACpD;AAOA,MAAM,eAAiD;AAAA,EACrD,SAAS;AAAA,EACT,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,KAAK;AAAA,EACL,OAAO;AAAA,EACP,UAAU;AACZ;AAEO,MAAM,eAAqD,OAAO;AAAA,EACtE,OAAO,KAAKC,YAAAA,kBAAkB,EAAoB,IAAI,CAAC,UAAU;AAAA,IAChE;AAAA,IACA;AAAA,MACE,MAAMA,YAAAA,mBAAmB,KAAK;AAAA,MAC9B,MAAM,aAAa,KAAK;AAAA,MACxB,OAAOC,YAAAA,iBAAiB,KAAK;AAAA,IAAA;AAAA,EAC/B,CACD;AACH;AAGO,SAAS,WAAW,OAA4C;AACrE,QAAM,MAAM,MAAM,KAAA,EAAO,YAAA;AACzB,MAAI,OAAO,aAAc,QAAO,aAAa,GAAkB;AAC/D,SAAO;AACT;AAGO,MAAM,wBAGT;AAAA,EACF,SAAS,EAAE,MAAMC,WAAAA,YAAY,MAAM,SAAS,OAAO,MAAA;AAAA,EACnD,MAAM,EAAE,MAAMC,cAAAA,eAAe,MAAM,OAAO,OAAO,OAAA;AAAA,EACjD,aAAa,EAAE,MAAMC,oBAAAA,qBAAqB,MAAM,WAAW,OAAO,OAAA;AAAA,EAClE,MAAM,EAAE,MAAMA,oBAAAA,qBAAqB,MAAM,WAAW,OAAO,OAAA;AAAA,EAC3D,SAAS,EAAE,MAAMA,oBAAAA,qBAAqB,MAAM,WAAW,OAAO,YAAA;AAAA,EAC9D,mBAAmB,EAAE,MAAMC,cAAAA,eAAe,MAAM,QAAQ,OAAO,MAAA;AACjE;AAUO,MAAM,iBAAyD;AAAA,EACpE,UAAU,EAAE,MAAMC,WAAAA,YAAY,MAAM,OAAO,OAAO,WAAA;AAAA,EAClD,SAAS,EAAE,MAAMC,WAAAA,YAAY,MAAM,SAAS,OAAO,iBAAA;AAAA,EACnD,UAAU,EAAE,MAAMC,OAAAA,QAAQ,MAAM,WAAW,OAAO,WAAA;AAAA,EAClD,QAAQ,EAAE,MAAMC,UAAAA,WAAW,MAAM,QAAQ,OAAO,SAAA;AAAA,EAChD,UAAU,EAAE,MAAMC,aAAAA,cAAc,MAAM,UAAU,OAAO,WAAA;AACzD;AAKO,MAAM,sBAA6D;AAAA,EACxE,KAAK,EAAE,MAAMC,MAAAA,OAAO,MAAM,UAAU,OAAO,YAAA;AAAA,EAC3C,UAAU,EAAE,MAAMC,WAAAA,YAAY,MAAM,SAAS,OAAO,iBAAA;AAAA,EACpD,KAAK,EAAE,MAAMC,SAAAA,UAAU,MAAM,OAAO,OAAO,YAAA;AAC7C;;;;;;;"}
+{"version":3,"file":"agent-action-icons.cjs","sources":["../../../src/data/ai/agent-action-icons.ts"],"sourcesContent":["import type { StaticIconComponent } from \"../Icon\";\nimport {\n  EFFORT_LEVEL_ICONS,\n  effortLevelLabel,\n  type EffortLevel,\n} from \"../chat/effort-icons\";\nimport type { SessionTone } from \"./SessionViewer.model\";\nimport type { SpecPermissionMode } from \"./SpecRuntimeEditor.model\";\nimport {\n  UiArrowFatUp,\n  UiBraces,\n  UiBox,\n  UiChatDots,\n  UiCircleX,\n  UiFastForwardCircle,\n  UiHandPalm,\n  UiPass,\n  UiPauseCircle,\n  UiPlayCircle,\n  UiQuestion,\n  UiSealCheck,\n  UiShieldSlash,\n  UiStrategy,\n  UiTerminal,\n} from \"../../icons\";\n\n// Implements the semantic groups of the Flanksource \"Agent Action Icons\" design\n// beyond the per-tool ACTIONS map (which lives in SessionViewer.model.ts). Each\n// entry pairs a generated Ui* glyph with a SessionTone so the disc/text color\n// (SESSION_TONES in session-tones.ts) encodes the action's category. Blue\n// reasons, green executes, teal confirms; the effort ramp climbs slate → sky →\n// amber → orange → rose → fuchsia; approval clears green / blocks red.\n\nexport interface AgentActionMeta {\n  icon: StaticIconComponent;\n  tone: SessionTone;\n  label: string;\n}\n\n// ── Agent workflow: plan → run → verify ─────────────────────────────────────\nexport type WorkflowPhase = \"plan\" | \"run\" | \"verify\";\n\nexport const WORKFLOW_PHASES: Record<WorkflowPhase, AgentActionMeta> = {\n  plan: { icon: UiStrategy, tone: \"sky\", label: \"Plan\" },\n  run: { icon: UiPlayCircle, tone: \"emerald\", label: \"Run\" },\n  verify: { icon: UiSealCheck, tone: \"teal\", label: \"Verify\" },\n};\n\n// ── Effort levels: reasoning / token budget on the severity hue ramp ─────────\n// The battery glyphs are the chat layer's source of truth (EFFORT_LEVEL_ICONS);\n// here we add the semantic tone + label so an effort chip reads at a glance.\nexport type { EffortLevel } from \"../chat/effort-icons\";\n\nconst EFFORT_TONES: Record<EffortLevel, SessionTone> = {\n  minimal: \"slate\",\n  low: \"sky\",\n  medium: \"amber\",\n  high: \"orange\",\n  xhigh: \"orange\",\n  max: \"rose\",\n  ultra: \"fuchsia\",\n  adaptive: \"indigo\",\n};\n\nexport const EFFORT_ICONS: Record<EffortLevel, AgentActionMeta> =\n  Object.fromEntries(\n    (Object.keys(EFFORT_LEVEL_ICONS) as EffortLevel[]).map((level) => [\n      level,\n      {\n        icon: EFFORT_LEVEL_ICONS[level],\n        tone: EFFORT_TONES[level],\n        label: effortLevelLabel(level),\n      },\n    ]),\n  ) as Record<EffortLevel, AgentActionMeta>;\n\n/** Resolve the effort glyph for a known value. */\nexport function effortIcon(value: string): AgentActionMeta | undefined {\n  const key = value.trim().toLowerCase();\n  if (key in EFFORT_ICONS) return EFFORT_ICONS[key as EffortLevel];\n  return undefined;\n}\n\n// ── Permission modes: Claude Code's native mode vocabulary ───────────────────\nexport const PERMISSION_MODE_ICONS: Record<\n  SpecPermissionMode,\n  AgentActionMeta\n> = {\n  default: { icon: UiHandPalm, tone: \"slate\", label: \"Manual\" },\n  plan: { icon: UiPauseCircle, tone: \"teal\", label: \"Plan\" },\n  acceptEdits: {\n    icon: UiFastForwardCircle,\n    tone: \"violet\",\n    label: \"Accept edits\",\n  },\n  auto: { icon: UiFastForwardCircle, tone: \"violet\", label: \"Auto\" },\n  dontAsk: { icon: UiShieldSlash, tone: \"rose\", label: \"Don't ask\" },\n  bypassPermissions: {\n    icon: UiShieldSlash,\n    tone: \"rose\",\n    label: \"Bypass permissions\",\n  },\n};\n\n// ── Approval states: where a proposed action sits in the HITL flow ───────────\nexport type ApprovalState =\n  | \"question\"\n  | \"pending\"\n  | \"approved\"\n  | \"denied\"\n  | \"escalate\";\n\nexport const APPROVAL_ICONS: Record<ApprovalState, AgentActionMeta> = {\n  question: { icon: UiQuestion, tone: \"sky\", label: \"Question\" },\n  pending: { icon: UiChatDots, tone: \"amber\", label: \"Awaiting input\" },\n  approved: { icon: UiPass, tone: \"emerald\", label: \"Approved\" },\n  denied: { icon: UiCircleX, tone: \"rose\", label: \"Denied\" },\n  escalate: { icon: UiArrowFatUp, tone: \"orange\", label: \"Escalate\" },\n};\n\n// ── Agent runtimes: where an agent executes ──────────────────────────────────\nexport type AgentRuntime = \"sdk\" | \"terminal\" | \"api\";\n\nexport const AGENT_RUNTIME_ICONS: Record<AgentRuntime, AgentActionMeta> = {\n  sdk: { icon: UiBox, tone: \"indigo\", label: \"SDK agent\" },\n  terminal: { icon: UiTerminal, tone: \"slate\", label: \"Terminal agent\" },\n  api: { icon: UiBraces, tone: \"sky\", label: \"API agent\" },\n};\n"],"names":["UiStrategy","UiPlayCircle","UiSealCheck","EFFORT_LEVEL_ICONS","effortLevelLabel","UiHandPalm","UiPauseCircle","UiFastForwardCircle","UiShieldSlash","UiQuestion","UiChatDots","UiPass","UiCircleX","UiArrowFatUp","UiBox","UiTerminal","UiBraces"],"mappings":";;;;;;;;;;;;;;;;;;AA0CO,MAAM,kBAA0D;AAAA,EACrE,MAAM,EAAE,MAAMA,WAAAA,YAAY,MAAM,OAAO,OAAO,OAAA;AAAA,EAC9C,KAAK,EAAE,MAAMC,aAAAA,cAAc,MAAM,WAAW,OAAO,MAAA;AAAA,EACnD,QAAQ,EAAE,MAAMC,YAAAA,aAAa,MAAM,QAAQ,OAAO,SAAA;AACpD;AAOA,MAAM,eAAiD;AAAA,EACrD,SAAS;AAAA,EACT,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,KAAK;AAAA,EACL,OAAO;AAAA,EACP,UAAU;AACZ;AAEO,MAAM,eACX,OAAO;AAAA,EACJ,OAAO,KAAKC,YAAAA,kBAAkB,EAAoB,IAAI,CAAC,UAAU;AAAA,IAChE;AAAA,IACA;AAAA,MACE,MAAMA,YAAAA,mBAAmB,KAAK;AAAA,MAC9B,MAAM,aAAa,KAAK;AAAA,MACxB,OAAOC,YAAAA,iBAAiB,KAAK;AAAA,IAAA;AAAA,EAC/B,CACD;AACH;AAGK,SAAS,WAAW,OAA4C;AACrE,QAAM,MAAM,MAAM,KAAA,EAAO,YAAA;AACzB,MAAI,OAAO,aAAc,QAAO,aAAa,GAAkB;AAC/D,SAAO;AACT;AAGO,MAAM,wBAGT;AAAA,EACF,SAAS,EAAE,MAAMC,WAAAA,YAAY,MAAM,SAAS,OAAO,SAAA;AAAA,EACnD,MAAM,EAAE,MAAMC,cAAAA,eAAe,MAAM,QAAQ,OAAO,OAAA;AAAA,EAClD,aAAa;AAAA,IACX,MAAMC,oBAAAA;AAAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAET,MAAM,EAAE,MAAMA,oBAAAA,qBAAqB,MAAM,UAAU,OAAO,OAAA;AAAA,EAC1D,SAAS,EAAE,MAAMC,cAAAA,eAAe,MAAM,QAAQ,OAAO,YAAA;AAAA,EACrD,mBAAmB;AAAA,IACjB,MAAMA,cAAAA;AAAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAEX;AAUO,MAAM,iBAAyD;AAAA,EACpE,UAAU,EAAE,MAAMC,WAAAA,YAAY,MAAM,OAAO,OAAO,WAAA;AAAA,EAClD,SAAS,EAAE,MAAMC,WAAAA,YAAY,MAAM,SAAS,OAAO,iBAAA;AAAA,EACnD,UAAU,EAAE,MAAMC,OAAAA,QAAQ,MAAM,WAAW,OAAO,WAAA;AAAA,EAClD,QAAQ,EAAE,MAAMC,UAAAA,WAAW,MAAM,QAAQ,OAAO,SAAA;AAAA,EAChD,UAAU,EAAE,MAAMC,aAAAA,cAAc,MAAM,UAAU,OAAO,WAAA;AACzD;AAKO,MAAM,sBAA6D;AAAA,EACxE,KAAK,EAAE,MAAMC,MAAAA,OAAO,MAAM,UAAU,OAAO,YAAA;AAAA,EAC3C,UAAU,EAAE,MAAMC,WAAAA,YAAY,MAAM,SAAS,OAAO,iBAAA;AAAA,EACpD,KAAK,EAAE,MAAMC,SAAAA,UAAU,MAAM,OAAO,OAAO,YAAA;AAC7C;;;;;;;"}

package/dist/data/ai/agent-action-icons.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"agent-action-icons.d.ts","sourceRoot":"","sources":["../../../src/data/ai/agent-action-icons.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AACnD,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AA0BpE,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,mBAAmB,CAAC;IAC1B,IAAI,EAAE,WAAW,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf;AAGD,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,CAAC;AAEtD,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,aAAa,EAAE,eAAe,CAIlE,CAAC;AAKF,YAAY,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAaxD,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,WAAW,EAAE,eAAe,CASrB,CAAC;AAE1C,kDAAkD;AAClD,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,eAAe,GAAG,SAAS,CAIrE;AAGD,eAAO,MAAM,qBAAqB,EAAE,MAAM,CACxC,kBAAkB,EAClB,eAAe,CAQhB,CAAC;AAGF,MAAM,MAAM,aAAa,GACrB,UAAU,GACV,SAAS,GACT,UAAU,GACV,QAAQ,GACR,UAAU,CAAC;AAEf,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,aAAa,EAAE,eAAe,CAMjE,CAAC;AAGF,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,UAAU,GAAG,KAAK,CAAC;AAEtD,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,YAAY,EAAE,eAAe,CAIrE,CAAC"}
+{"version":3,"file":"agent-action-icons.d.ts","sourceRoot":"","sources":["../../../src/data/ai/agent-action-icons.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AACnD,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AA0BpE,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,mBAAmB,CAAC;IAC1B,IAAI,EAAE,WAAW,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf;AAGD,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,CAAC;AAEtD,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,aAAa,EAAE,eAAe,CAIlE,CAAC;AAKF,YAAY,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAaxD,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,WAAW,EAAE,eAAe,CAUnB,CAAC;AAE5C,kDAAkD;AAClD,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,eAAe,GAAG,SAAS,CAIrE;AAGD,eAAO,MAAM,qBAAqB,EAAE,MAAM,CACxC,kBAAkB,EAClB,eAAe,CAgBhB,CAAC;AAGF,MAAM,MAAM,aAAa,GACrB,UAAU,GACV,SAAS,GACT,UAAU,GACV,QAAQ,GACR,UAAU,CAAC;AAEf,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,aAAa,EAAE,eAAe,CAMjE,CAAC;AAGF,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,UAAU,GAAG,KAAK,CAAC;AAEtD,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,YAAY,EAAE,eAAe,CAIrE,CAAC"}

package/dist/data/ai/agent-action-icons.js

@@ -45,12 +45,20 @@ function effortIcon(value) {
   return void 0;
 }
 const PERMISSION_MODE_ICONS = {
-  default: { icon: UiHandPalm, tone: "slate", label: "Ask" },
-  plan: { icon: UiPauseCircle, tone: "sky", label: "Plan" },
-  acceptEdits: { icon: UiFastForwardCircle, tone: "emerald", label: "Auto" },
-  auto: { icon: UiFastForwardCircle, tone: "emerald", label: "Auto" },
-  dontAsk: { icon: UiFastForwardCircle, tone: "emerald", label: "Don't ask" },
-  bypassPermissions: { icon: UiShieldSlash, tone: "rose", label: "Off" }
+  default: { icon: UiHandPalm, tone: "slate", label: "Manual" },
+  plan: { icon: UiPauseCircle, tone: "teal", label: "Plan" },
+  acceptEdits: {
+    icon: UiFastForwardCircle,
+    tone: "violet",
+    label: "Accept edits"
+  },
+  auto: { icon: UiFastForwardCircle, tone: "violet", label: "Auto" },
+  dontAsk: { icon: UiShieldSlash, tone: "rose", label: "Don't ask" },
+  bypassPermissions: {
+    icon: UiShieldSlash,
+    tone: "rose",
+    label: "Bypass permissions"
+  }
 };
 const APPROVAL_ICONS = {
   question: { icon: UiQuestion, tone: "sky", label: "Question" },

package/dist/data/ai/agent-action-icons.js.map

@@ -1 +1 @@
-{"version":3,"file":"agent-action-icons.js","sources":["../../../src/data/ai/agent-action-icons.ts"],"sourcesContent":["import type { StaticIconComponent } from \"../Icon\";\nimport {\n  EFFORT_LEVEL_ICONS,\n  effortLevelLabel,\n  type EffortLevel,\n} from \"../chat/effort-icons\";\nimport type { SessionTone } from \"./SessionViewer.model\";\nimport type { SpecPermissionMode } from \"./SpecRuntimeEditor.model\";\nimport {\n  UiArrowFatUp,\n  UiBraces,\n  UiBox,\n  UiChatDots,\n  UiCircleX,\n  UiFastForwardCircle,\n  UiHandPalm,\n  UiPass,\n  UiPauseCircle,\n  UiPlayCircle,\n  UiQuestion,\n  UiSealCheck,\n  UiShieldSlash,\n  UiStrategy,\n  UiTerminal,\n} from \"../../icons\";\n\n// Implements the semantic groups of the Flanksource \"Agent Action Icons\" design\n// beyond the per-tool ACTIONS map (which lives in SessionViewer.model.ts). Each\n// entry pairs a generated Ui* glyph with a SessionTone so the disc/text color\n// (SESSION_TONES in session-tones.ts) encodes the action's category. Blue\n// reasons, green executes, teal confirms; the effort ramp climbs slate → sky →\n// amber → orange → rose → fuchsia; approval clears green / blocks red.\n\nexport interface AgentActionMeta {\n  icon: StaticIconComponent;\n  tone: SessionTone;\n  label: string;\n}\n\n// ── Agent workflow: plan → run → verify ─────────────────────────────────────\nexport type WorkflowPhase = \"plan\" | \"run\" | \"verify\";\n\nexport const WORKFLOW_PHASES: Record<WorkflowPhase, AgentActionMeta> = {\n  plan: { icon: UiStrategy, tone: \"sky\", label: \"Plan\" },\n  run: { icon: UiPlayCircle, tone: \"emerald\", label: \"Run\" },\n  verify: { icon: UiSealCheck, tone: \"teal\", label: \"Verify\" },\n};\n\n// ── Effort levels: reasoning / token budget on the severity hue ramp ─────────\n// The battery glyphs are the chat layer's source of truth (EFFORT_LEVEL_ICONS);\n// here we add the semantic tone + label so an effort chip reads at a glance.\nexport type { EffortLevel } from \"../chat/effort-icons\";\n\nconst EFFORT_TONES: Record<EffortLevel, SessionTone> = {\n  minimal: \"slate\",\n  low: \"sky\",\n  medium: \"amber\",\n  high: \"orange\",\n  xhigh: \"orange\",\n  max: \"rose\",\n  ultra: \"fuchsia\",\n  adaptive: \"indigo\",\n};\n\nexport const EFFORT_ICONS: Record<EffortLevel, AgentActionMeta> = Object.fromEntries(\n  (Object.keys(EFFORT_LEVEL_ICONS) as EffortLevel[]).map((level) => [\n    level,\n    {\n      icon: EFFORT_LEVEL_ICONS[level],\n      tone: EFFORT_TONES[level],\n      label: effortLevelLabel(level),\n    },\n  ]),\n) as Record<EffortLevel, AgentActionMeta>;\n\n/** Resolve the effort glyph for a known value. */\nexport function effortIcon(value: string): AgentActionMeta | undefined {\n  const key = value.trim().toLowerCase();\n  if (key in EFFORT_ICONS) return EFFORT_ICONS[key as EffortLevel];\n  return undefined;\n}\n\n// ── Permission modes: colors matched to Claude Code ──────────────────────────\nexport const PERMISSION_MODE_ICONS: Record<\n  SpecPermissionMode,\n  AgentActionMeta\n> = {\n  default: { icon: UiHandPalm, tone: \"slate\", label: \"Ask\" },\n  plan: { icon: UiPauseCircle, tone: \"sky\", label: \"Plan\" },\n  acceptEdits: { icon: UiFastForwardCircle, tone: \"emerald\", label: \"Auto\" },\n  auto: { icon: UiFastForwardCircle, tone: \"emerald\", label: \"Auto\" },\n  dontAsk: { icon: UiFastForwardCircle, tone: \"emerald\", label: \"Don't ask\" },\n  bypassPermissions: { icon: UiShieldSlash, tone: \"rose\", label: \"Off\" },\n};\n\n// ── Approval states: where a proposed action sits in the HITL flow ───────────\nexport type ApprovalState =\n  | \"question\"\n  | \"pending\"\n  | \"approved\"\n  | \"denied\"\n  | \"escalate\";\n\nexport const APPROVAL_ICONS: Record<ApprovalState, AgentActionMeta> = {\n  question: { icon: UiQuestion, tone: \"sky\", label: \"Question\" },\n  pending: { icon: UiChatDots, tone: \"amber\", label: \"Awaiting input\" },\n  approved: { icon: UiPass, tone: \"emerald\", label: \"Approved\" },\n  denied: { icon: UiCircleX, tone: \"rose\", label: \"Denied\" },\n  escalate: { icon: UiArrowFatUp, tone: \"orange\", label: \"Escalate\" },\n};\n\n// ── Agent runtimes: where an agent executes ──────────────────────────────────\nexport type AgentRuntime = \"sdk\" | \"terminal\" | \"api\";\n\nexport const AGENT_RUNTIME_ICONS: Record<AgentRuntime, AgentActionMeta> = {\n  sdk: { icon: UiBox, tone: \"indigo\", label: \"SDK agent\" },\n  terminal: { icon: UiTerminal, tone: \"slate\", label: \"Terminal agent\" },\n  api: { icon: UiBraces, tone: \"sky\", label: \"API agent\" },\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AA0CO,MAAM,kBAA0D;AAAA,EACrE,MAAM,EAAE,MAAM,YAAY,MAAM,OAAO,OAAO,OAAA;AAAA,EAC9C,KAAK,EAAE,MAAM,cAAc,MAAM,WAAW,OAAO,MAAA;AAAA,EACnD,QAAQ,EAAE,MAAM,aAAa,MAAM,QAAQ,OAAO,SAAA;AACpD;AAOA,MAAM,eAAiD;AAAA,EACrD,SAAS;AAAA,EACT,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,KAAK;AAAA,EACL,OAAO;AAAA,EACP,UAAU;AACZ;AAEO,MAAM,eAAqD,OAAO;AAAA,EACtE,OAAO,KAAK,kBAAkB,EAAoB,IAAI,CAAC,UAAU;AAAA,IAChE;AAAA,IACA;AAAA,MACE,MAAM,mBAAmB,KAAK;AAAA,MAC9B,MAAM,aAAa,KAAK;AAAA,MACxB,OAAO,iBAAiB,KAAK;AAAA,IAAA;AAAA,EAC/B,CACD;AACH;AAGO,SAAS,WAAW,OAA4C;AACrE,QAAM,MAAM,MAAM,KAAA,EAAO,YAAA;AACzB,MAAI,OAAO,aAAc,QAAO,aAAa,GAAkB;AAC/D,SAAO;AACT;AAGO,MAAM,wBAGT;AAAA,EACF,SAAS,EAAE,MAAM,YAAY,MAAM,SAAS,OAAO,MAAA;AAAA,EACnD,MAAM,EAAE,MAAM,eAAe,MAAM,OAAO,OAAO,OAAA;AAAA,EACjD,aAAa,EAAE,MAAM,qBAAqB,MAAM,WAAW,OAAO,OAAA;AAAA,EAClE,MAAM,EAAE,MAAM,qBAAqB,MAAM,WAAW,OAAO,OAAA;AAAA,EAC3D,SAAS,EAAE,MAAM,qBAAqB,MAAM,WAAW,OAAO,YAAA;AAAA,EAC9D,mBAAmB,EAAE,MAAM,eAAe,MAAM,QAAQ,OAAO,MAAA;AACjE;AAUO,MAAM,iBAAyD;AAAA,EACpE,UAAU,EAAE,MAAM,YAAY,MAAM,OAAO,OAAO,WAAA;AAAA,EAClD,SAAS,EAAE,MAAM,YAAY,MAAM,SAAS,OAAO,iBAAA;AAAA,EACnD,UAAU,EAAE,MAAM,QAAQ,MAAM,WAAW,OAAO,WAAA;AAAA,EAClD,QAAQ,EAAE,MAAM,WAAW,MAAM,QAAQ,OAAO,SAAA;AAAA,EAChD,UAAU,EAAE,MAAM,cAAc,MAAM,UAAU,OAAO,WAAA;AACzD;AAKO,MAAM,sBAA6D;AAAA,EACxE,KAAK,EAAE,MAAM,OAAO,MAAM,UAAU,OAAO,YAAA;AAAA,EAC3C,UAAU,EAAE,MAAM,YAAY,MAAM,SAAS,OAAO,iBAAA;AAAA,EACpD,KAAK,EAAE,MAAM,UAAU,MAAM,OAAO,OAAO,YAAA;AAC7C;"}
+{"version":3,"file":"agent-action-icons.js","sources":["../../../src/data/ai/agent-action-icons.ts"],"sourcesContent":["import type { StaticIconComponent } from \"../Icon\";\nimport {\n  EFFORT_LEVEL_ICONS,\n  effortLevelLabel,\n  type EffortLevel,\n} from \"../chat/effort-icons\";\nimport type { SessionTone } from \"./SessionViewer.model\";\nimport type { SpecPermissionMode } from \"./SpecRuntimeEditor.model\";\nimport {\n  UiArrowFatUp,\n  UiBraces,\n  UiBox,\n  UiChatDots,\n  UiCircleX,\n  UiFastForwardCircle,\n  UiHandPalm,\n  UiPass,\n  UiPauseCircle,\n  UiPlayCircle,\n  UiQuestion,\n  UiSealCheck,\n  UiShieldSlash,\n  UiStrategy,\n  UiTerminal,\n} from \"../../icons\";\n\n// Implements the semantic groups of the Flanksource \"Agent Action Icons\" design\n// beyond the per-tool ACTIONS map (which lives in SessionViewer.model.ts). Each\n// entry pairs a generated Ui* glyph with a SessionTone so the disc/text color\n// (SESSION_TONES in session-tones.ts) encodes the action's category. Blue\n// reasons, green executes, teal confirms; the effort ramp climbs slate → sky →\n// amber → orange → rose → fuchsia; approval clears green / blocks red.\n\nexport interface AgentActionMeta {\n  icon: StaticIconComponent;\n  tone: SessionTone;\n  label: string;\n}\n\n// ── Agent workflow: plan → run → verify ─────────────────────────────────────\nexport type WorkflowPhase = \"plan\" | \"run\" | \"verify\";\n\nexport const WORKFLOW_PHASES: Record<WorkflowPhase, AgentActionMeta> = {\n  plan: { icon: UiStrategy, tone: \"sky\", label: \"Plan\" },\n  run: { icon: UiPlayCircle, tone: \"emerald\", label: \"Run\" },\n  verify: { icon: UiSealCheck, tone: \"teal\", label: \"Verify\" },\n};\n\n// ── Effort levels: reasoning / token budget on the severity hue ramp ─────────\n// The battery glyphs are the chat layer's source of truth (EFFORT_LEVEL_ICONS);\n// here we add the semantic tone + label so an effort chip reads at a glance.\nexport type { EffortLevel } from \"../chat/effort-icons\";\n\nconst EFFORT_TONES: Record<EffortLevel, SessionTone> = {\n  minimal: \"slate\",\n  low: \"sky\",\n  medium: \"amber\",\n  high: \"orange\",\n  xhigh: \"orange\",\n  max: \"rose\",\n  ultra: \"fuchsia\",\n  adaptive: \"indigo\",\n};\n\nexport const EFFORT_ICONS: Record<EffortLevel, AgentActionMeta> =\n  Object.fromEntries(\n    (Object.keys(EFFORT_LEVEL_ICONS) as EffortLevel[]).map((level) => [\n      level,\n      {\n        icon: EFFORT_LEVEL_ICONS[level],\n        tone: EFFORT_TONES[level],\n        label: effortLevelLabel(level),\n      },\n    ]),\n  ) as Record<EffortLevel, AgentActionMeta>;\n\n/** Resolve the effort glyph for a known value. */\nexport function effortIcon(value: string): AgentActionMeta | undefined {\n  const key = value.trim().toLowerCase();\n  if (key in EFFORT_ICONS) return EFFORT_ICONS[key as EffortLevel];\n  return undefined;\n}\n\n// ── Permission modes: Claude Code's native mode vocabulary ───────────────────\nexport const PERMISSION_MODE_ICONS: Record<\n  SpecPermissionMode,\n  AgentActionMeta\n> = {\n  default: { icon: UiHandPalm, tone: \"slate\", label: \"Manual\" },\n  plan: { icon: UiPauseCircle, tone: \"teal\", label: \"Plan\" },\n  acceptEdits: {\n    icon: UiFastForwardCircle,\n    tone: \"violet\",\n    label: \"Accept edits\",\n  },\n  auto: { icon: UiFastForwardCircle, tone: \"violet\", label: \"Auto\" },\n  dontAsk: { icon: UiShieldSlash, tone: \"rose\", label: \"Don't ask\" },\n  bypassPermissions: {\n    icon: UiShieldSlash,\n    tone: \"rose\",\n    label: \"Bypass permissions\",\n  },\n};\n\n// ── Approval states: where a proposed action sits in the HITL flow ───────────\nexport type ApprovalState =\n  | \"question\"\n  | \"pending\"\n  | \"approved\"\n  | \"denied\"\n  | \"escalate\";\n\nexport const APPROVAL_ICONS: Record<ApprovalState, AgentActionMeta> = {\n  question: { icon: UiQuestion, tone: \"sky\", label: \"Question\" },\n  pending: { icon: UiChatDots, tone: \"amber\", label: \"Awaiting input\" },\n  approved: { icon: UiPass, tone: \"emerald\", label: \"Approved\" },\n  denied: { icon: UiCircleX, tone: \"rose\", label: \"Denied\" },\n  escalate: { icon: UiArrowFatUp, tone: \"orange\", label: \"Escalate\" },\n};\n\n// ── Agent runtimes: where an agent executes ──────────────────────────────────\nexport type AgentRuntime = \"sdk\" | \"terminal\" | \"api\";\n\nexport const AGENT_RUNTIME_ICONS: Record<AgentRuntime, AgentActionMeta> = {\n  sdk: { icon: UiBox, tone: \"indigo\", label: \"SDK agent\" },\n  terminal: { icon: UiTerminal, tone: \"slate\", label: \"Terminal agent\" },\n  api: { icon: UiBraces, tone: \"sky\", label: \"API agent\" },\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AA0CO,MAAM,kBAA0D;AAAA,EACrE,MAAM,EAAE,MAAM,YAAY,MAAM,OAAO,OAAO,OAAA;AAAA,EAC9C,KAAK,EAAE,MAAM,cAAc,MAAM,WAAW,OAAO,MAAA;AAAA,EACnD,QAAQ,EAAE,MAAM,aAAa,MAAM,QAAQ,OAAO,SAAA;AACpD;AAOA,MAAM,eAAiD;AAAA,EACrD,SAAS;AAAA,EACT,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,KAAK;AAAA,EACL,OAAO;AAAA,EACP,UAAU;AACZ;AAEO,MAAM,eACX,OAAO;AAAA,EACJ,OAAO,KAAK,kBAAkB,EAAoB,IAAI,CAAC,UAAU;AAAA,IAChE;AAAA,IACA;AAAA,MACE,MAAM,mBAAmB,KAAK;AAAA,MAC9B,MAAM,aAAa,KAAK;AAAA,MACxB,OAAO,iBAAiB,KAAK;AAAA,IAAA;AAAA,EAC/B,CACD;AACH;AAGK,SAAS,WAAW,OAA4C;AACrE,QAAM,MAAM,MAAM,KAAA,EAAO,YAAA;AACzB,MAAI,OAAO,aAAc,QAAO,aAAa,GAAkB;AAC/D,SAAO;AACT;AAGO,MAAM,wBAGT;AAAA,EACF,SAAS,EAAE,MAAM,YAAY,MAAM,SAAS,OAAO,SAAA;AAAA,EACnD,MAAM,EAAE,MAAM,eAAe,MAAM,QAAQ,OAAO,OAAA;AAAA,EAClD,aAAa;AAAA,IACX,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAET,MAAM,EAAE,MAAM,qBAAqB,MAAM,UAAU,OAAO,OAAA;AAAA,EAC1D,SAAS,EAAE,MAAM,eAAe,MAAM,QAAQ,OAAO,YAAA;AAAA,EACrD,mBAAmB;AAAA,IACjB,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAEX;AAUO,MAAM,iBAAyD;AAAA,EACpE,UAAU,EAAE,MAAM,YAAY,MAAM,OAAO,OAAO,WAAA;AAAA,EAClD,SAAS,EAAE,MAAM,YAAY,MAAM,SAAS,OAAO,iBAAA;AAAA,EACnD,UAAU,EAAE,MAAM,QAAQ,MAAM,WAAW,OAAO,WAAA;AAAA,EAClD,QAAQ,EAAE,MAAM,WAAW,MAAM,QAAQ,OAAO,SAAA;AAAA,EAChD,UAAU,EAAE,MAAM,cAAc,MAAM,UAAU,OAAO,WAAA;AACzD;AAKO,MAAM,sBAA6D;AAAA,EACxE,KAAK,EAAE,MAAM,OAAO,MAAM,UAAU,OAAO,YAAA;AAAA,EAC3C,UAAU,EAAE,MAAM,YAAY,MAAM,SAAS,OAAO,iBAAA;AAAA,EACpD,KAAK,EAAE,MAAM,UAAU,MAAM,OAAO,OAAO,YAAA;AAC7C;"}