@stigmer/react 1.0.3 → 2.0.0

package/src/library/InstanceVisibilitySelector.tsx

@@ -0,0 +1,323 @@
+"use client";
+
+import { useCallback, useRef, useState } from "react";
+import { cn } from "@stigmer/theme";
+import { ApiResourceVisibility } from "@stigmer/protos/ai/stigmer/commons/apiresource/enum_pb";
+
+/** Props for {@link InstanceVisibilitySelector}. */
+export interface InstanceVisibilitySelectorProps {
+  /** Current visibility of the instance. */
+  readonly visibility: ApiResourceVisibility;
+  /**
+   * Called when the user confirms a visibility change.
+   * Escalating visibility (to org or public) shows an inline confirmation.
+   */
+  readonly onVisibilityChange: (v: ApiResourceVisibility) => void;
+  /** Shows a spinner/disabled state while the RPC is in flight. */
+  readonly isPending?: boolean;
+  /** Disables all interaction (e.g., when the user lacks can_edit). */
+  readonly disabled?: boolean;
+  /** Additional CSS classes applied to the root element. */
+  readonly className?: string;
+}
+
+const OPTIONS: readonly {
+  readonly value: ApiResourceVisibility;
+  readonly label: string;
+  readonly description: string;
+}[] = [
+  {
+    value: ApiResourceVisibility.visibility_private,
+    label: "Private",
+    description: "Only you can access",
+  },
+  {
+    value: ApiResourceVisibility.visibility_org,
+    label: "Organization",
+    description: "All org members can view executions",
+  },
+  {
+    value: ApiResourceVisibility.visibility_public,
+    label: "Public",
+    description: "All authenticated users can view",
+  },
+];
+
+/**
+ * Three-state visibility selector for instances (AgentInstance,
+ * WorkflowInstance).
+ *
+ * Unlike the binary {@link VisibilityToggle} used for blueprints,
+ * instances support the full visibility spectrum: Private, Organization,
+ * and Public. Escalating visibility (private -> org, or any -> public)
+ * shows an inline confirmation prompt since expanding access is
+ * consequential.
+ *
+ * For workflow instances, ORG visibility has cascading effects:
+ * all org members automatically see all executions via FGA
+ * inheritance (zero per-execution tuples needed).
+ *
+ * WAI-ARIA Radio Group with roving tabindex. All visual properties
+ * flow through `--stgm-*` design tokens.
+ *
+ * @example
+ * ```tsx
+ * const { updateVisibility, isPending } = useUpdateVisibility(
+ *   "workflowInstance",
+ *   instance.metadata.id,
+ * );
+ *
+ * <InstanceVisibilitySelector
+ *   visibility={instance.metadata.visibility}
+ *   onVisibilityChange={updateVisibility}
+ *   isPending={isPending}
+ * />
+ * ```
+ */
+export function InstanceVisibilitySelector({
+  visibility,
+  onVisibilityChange,
+  isPending = false,
+  disabled = false,
+  className,
+}: InstanceVisibilitySelectorProps) {
+  const [confirming, setConfirming] = useState<ApiResourceVisibility | null>(
+    null,
+  );
+  const optionRefs = useRef<(HTMLButtonElement | null)[]>([]);
+  const effectivelyDisabled = disabled || isPending;
+
+  const isEscalation = useCallback(
+    (target: ApiResourceVisibility) => {
+      const order = [
+        ApiResourceVisibility.visibility_private,
+        ApiResourceVisibility.visibility_org,
+        ApiResourceVisibility.visibility_public,
+      ];
+      return order.indexOf(target) > order.indexOf(visibility);
+    },
+    [visibility],
+  );
+
+  const handleSelect = useCallback(
+    (value: ApiResourceVisibility) => {
+      if (value === visibility) return;
+
+      if (isEscalation(value)) {
+        setConfirming(value);
+        return;
+      }
+
+      onVisibilityChange(value);
+    },
+    [visibility, onVisibilityChange, isEscalation],
+  );
+
+  const confirmChange = useCallback(() => {
+    if (confirming === null) return;
+    setConfirming(null);
+    onVisibilityChange(confirming);
+  }, [confirming, onVisibilityChange]);
+
+  const cancelConfirm = useCallback(() => {
+    setConfirming(null);
+  }, []);
+
+  const handleKeyDown = useCallback(
+    (e: React.KeyboardEvent<HTMLButtonElement>, index: number) => {
+      let nextIndex: number | null = null;
+
+      if (e.key === "ArrowRight" || e.key === "ArrowDown") {
+        e.preventDefault();
+        nextIndex = (index + 1) % OPTIONS.length;
+      } else if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
+        e.preventDefault();
+        nextIndex = (index - 1 + OPTIONS.length) % OPTIONS.length;
+      }
+
+      if (nextIndex !== null) {
+        optionRefs.current[nextIndex]?.focus();
+        handleSelect(OPTIONS[nextIndex].value);
+      }
+    },
+    [handleSelect],
+  );
+
+  const confirmingOption = confirming
+    ? OPTIONS.find((o) => o.value === confirming)
+    : null;
+
+  return (
+    <div className={cn("inline-flex flex-col gap-1.5", className)}>
+      <div
+        role="radiogroup"
+        aria-label="Instance visibility"
+        aria-disabled={effectivelyDisabled || undefined}
+        className={cn(
+          "inline-flex rounded-md bg-muted p-0.5",
+          effectivelyDisabled && "pointer-events-none opacity-50",
+        )}
+      >
+        {OPTIONS.map((option, index) => {
+          const isSelected = visibility === option.value;
+
+          return (
+            <button
+              key={option.value}
+              ref={(el) => {
+                optionRefs.current[index] = el;
+              }}
+              type="button"
+              role="radio"
+              aria-checked={isSelected}
+              aria-label={`${option.label}: ${option.description}`}
+              tabIndex={isSelected ? 0 : -1}
+              disabled={effectivelyDisabled}
+              onClick={() => handleSelect(option.value)}
+              onKeyDown={(e) => handleKeyDown(e, index)}
+              className={cn(
+                "inline-flex cursor-pointer items-center gap-1 rounded-sm px-2.5 py-1 text-xs font-medium transition-colors",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                isSelected
+                  ? getSelectedStyle(option.value)
+                  : "text-muted-foreground hover:text-foreground",
+              )}
+            >
+              {isPending && isSelected ? (
+                <span
+                  className="inline-block size-3 animate-spin rounded-full border-2 border-current border-t-transparent"
+                  aria-hidden="true"
+                />
+              ) : (
+                getIcon(option.value)
+              )}
+              {option.label}
+            </button>
+          );
+        })}
+      </div>
+
+      {/* Description of current state */}
+      {!confirming && (
+        <p className="text-[0.65rem] text-muted-foreground">
+          {OPTIONS.find((o) => o.value === visibility)?.description}
+        </p>
+      )}
+
+      {/* Confirmation prompt for escalation */}
+      {confirming !== null && confirmingOption && (
+        <div
+          className={cn(
+            "flex items-center gap-2 rounded-md border px-3 py-1.5 text-xs",
+            confirming === ApiResourceVisibility.visibility_public
+              ? "border-amber-200 bg-amber-50 dark:border-amber-800/50 dark:bg-amber-950/30"
+              : "border-blue-200 bg-blue-50 dark:border-blue-800/50 dark:bg-blue-950/30",
+          )}
+          role="alert"
+        >
+          <span
+            className={cn(
+              confirming === ApiResourceVisibility.visibility_public
+                ? "text-amber-800 dark:text-amber-200"
+                : "text-blue-800 dark:text-blue-200",
+            )}
+          >
+            {confirming === ApiResourceVisibility.visibility_public
+              ? "Make visible to all authenticated users?"
+              : "Make visible to all org members?"}
+          </span>
+          <button
+            type="button"
+            onClick={confirmChange}
+            className={cn(
+              "rounded px-2 py-0.5 text-xs font-medium text-white",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              confirming === ApiResourceVisibility.visibility_public
+                ? "bg-amber-600 hover:bg-amber-700 dark:bg-amber-600 dark:hover:bg-amber-500"
+                : "bg-blue-600 hover:bg-blue-700 dark:bg-blue-600 dark:hover:bg-blue-500",
+            )}
+          >
+            Confirm
+          </button>
+          <button
+            type="button"
+            onClick={cancelConfirm}
+            className={cn(
+              "rounded px-2 py-0.5 text-xs font-medium",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              confirming === ApiResourceVisibility.visibility_public
+                ? "text-amber-700 hover:text-amber-900 dark:text-amber-300 dark:hover:text-amber-100"
+                : "text-blue-700 hover:text-blue-900 dark:text-blue-300 dark:hover:text-blue-100",
+            )}
+          >
+            Cancel
+          </button>
+        </div>
+      )}
+    </div>
+  );
+}
+
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+
+function getSelectedStyle(value: ApiResourceVisibility): string {
+  switch (value) {
+    case ApiResourceVisibility.visibility_private:
+      return "bg-amber-50 text-amber-800 shadow-sm dark:bg-amber-900/30 dark:text-amber-300";
+    case ApiResourceVisibility.visibility_org:
+      return "bg-blue-100 text-blue-800 shadow-sm dark:bg-blue-900/40 dark:text-blue-300";
+    case ApiResourceVisibility.visibility_public:
+      return "bg-emerald-100 text-emerald-800 shadow-sm dark:bg-emerald-900/40 dark:text-emerald-300";
+    default:
+      return "bg-background text-foreground shadow-sm";
+  }
+}
+
+function getIcon(value: ApiResourceVisibility) {
+  switch (value) {
+    case ApiResourceVisibility.visibility_private:
+      return <LockIcon className="size-3" />;
+    case ApiResourceVisibility.visibility_org:
+      return <UsersIcon className="size-3" />;
+    case ApiResourceVisibility.visibility_public:
+      return <GlobeIcon className="size-3" />;
+    default:
+      return null;
+  }
+}
+
+// ---------------------------------------------------------------------------
+// Icons
+// ---------------------------------------------------------------------------
+
+function LockIcon({ className }: { readonly className?: string }) {
+  return (
+    <svg className={className} viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <rect x="3.5" y="7" width="9" height="7" rx="1.5" />
+      <path d="M5.5 7V5a2.5 2.5 0 0 1 5 0v2" />
+    </svg>
+  );
+}
+
+function UsersIcon({ className }: { readonly className?: string }) {
+  return (
+    <svg className={className} viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="6" cy="5" r="2.5" />
+      <path d="M2 13c0-2.21 1.79-4 4-4s4 1.79 4 4" />
+      <circle cx="11.5" cy="5.5" r="2" />
+      <path d="M14 13c0-1.66-1.12-3-2.5-3-.5 0-1 .14-1.4.4" />
+    </svg>
+  );
+}
+
+function GlobeIcon({ className }: { readonly className?: string }) {
+  return (
+    <svg className={className} viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="8" cy="8" r="6" />
+      <path d="M2 8h12" />
+      <path d="M8 2c1.66 1.46 2.6 3.63 2.6 6s-.94 4.54-2.6 6c-1.66-1.46-2.6-3.63-2.6-6s.94-4.54 2.6-6Z" />
+    </svg>
+  );
+}

package/src/library/index.ts

@@ -70,3 +70,6 @@ export type {
   VisibilityResourceKind,
   UseUpdateVisibilityReturn,
 } from "./useUpdateVisibility";
+
+export { InstanceVisibilitySelector } from "./InstanceVisibilitySelector";
+export type { InstanceVisibilitySelectorProps } from "./InstanceVisibilitySelector";

package/src/library/useUpdateVisibility.ts

@@ -8,7 +8,13 @@ import { useStigmer } from "../hooks";
 import { toError } from "../internal/toError";
 
 /** Resource kinds that support the `updateVisibility` RPC. */
-export type VisibilityResourceKind = "skill" | "agent" | "mcpServer";
+export type VisibilityResourceKind =
+  | "skill"
+  | "agent"
+  | "mcpServer"
+  | "workflow"
+  | "agentInstance"
+  | "workflowInstance";
 
 /** Return value of {@link useUpdateVisibility}. */
 export interface UseUpdateVisibilityReturn {
@@ -26,8 +32,11 @@ export interface UseUpdateVisibilityReturn {
 }
 
 /**
- * Behavior hook that updates the visibility of a Skill, Agent, or
- * MCP Server.
+ * Behavior hook that updates the visibility of a resource.
+ *
+ * Supports blueprints (Agent, Workflow, Skill, MCP Server) with
+ * private/public visibility, and instances (AgentInstance,
+ * WorkflowInstance) with the full private/org/public spectrum.
  *
  * Wraps the generated `stigmer.{kind}.updateVisibility()` SDK method
  * with loading and error state management. The hook is stateless with
@@ -40,10 +49,10 @@ export interface UseUpdateVisibilityReturn {
  *
  * @example
  * ```tsx
- * const { updateVisibility, isPending } = useUpdateVisibility("skill", skill.metadata.id);
+ * const { updateVisibility, isPending } = useUpdateVisibility("workflow", workflow.metadata.id);
  *
  * <VisibilityToggle
- *   visibility={skill.metadata.visibility}
+ *   visibility={workflow.metadata.visibility}
  *   onVisibilityChange={updateVisibility}
  *   isPending={isPending}
  * />
@@ -80,6 +89,15 @@ export function useUpdateVisibility(
           case "mcpServer":
             await stigmer.mcpServer.updateVisibility(input);
             break;
+          case "workflow":
+            await stigmer.workflow.updateVisibility(input);
+            break;
+          case "agentInstance":
+            await stigmer.agentInstance.updateVisibility(input);
+            break;
+          case "workflowInstance":
+            await stigmer.workflowInstance.updateVisibility(input);
+            break;
         }
       } catch (err) {
         setError(toError(err));

package/src/mcp-server/McpServerDetailView.tsx

@@ -28,6 +28,7 @@ import { ErrorMessage } from "../error/ErrorMessage";
 import { EnvVarForm } from "../environment/EnvVarForm";
 import type { EnvVarFormVariable } from "../environment/EnvVarForm";
 import { VisibilityToggle } from "../library/VisibilityToggle";
+import { PermissionGate } from "../iam-policy/PermissionGate";
 import { Tabs, type TabItem } from "../tabs/Tabs";
 import { ResourceDetailShell } from "../resource-detail/ResourceDetailShell";
 import { Section } from "../resource-detail/Section";
@@ -392,20 +393,28 @@ export function McpServerDetailView({
     updatedAt: specAudit?.updatedAt ? timestampDate(specAudit.updatedAt) : null,
   };
 
-  const isPublic = meta?.visibility === ApiResourceVisibility.visibility_public;
-  const visibilityControl =
-    onVisibilityChange && meta ? (
-      <VisibilityToggle
-        visibility={meta.visibility}
-        onVisibilityChange={onVisibilityChange}
-        isPending={isVisibilityPending}
-      />
-    ) : isPublic ? (
+  const visibilityBadge =
+    meta?.visibility === ApiResourceVisibility.visibility_public ? (
       <span className="shrink-0 rounded-full bg-muted px-2 py-0.5 text-[10px] font-medium text-muted-foreground">
         Public
       </span>
     ) : undefined;
 
+  const visibilityControl =
+    onVisibilityChange && meta ? (
+      <PermissionGate
+        resource={{ kind: "mcp_server", id: meta.id }}
+        relation="can_edit"
+        fallback={visibilityBadge}
+      >
+        <VisibilityToggle
+          visibility={meta.visibility}
+          onVisibilityChange={onVisibilityChange}
+          isPending={isVisibilityPending}
+        />
+      </PermissionGate>
+    ) : visibilityBadge;
+
   const headerMetaExtra = (
     <>
       {status && <ValidationStateBadge state={status.validationState} />}

package/src/organization/CreateOrganizationForm.tsx

@@ -1,29 +1,14 @@
 "use client";
 
 import { useCallback, useRef, useState, type FormEvent } from "react";
+import { create as createMessage } from "@bufbuild/protobuf";
 import { cn } from "@stigmer/theme";
 import { getUserMessage } from "@stigmer/sdk";
 import type { Organization } from "@stigmer/protos/ai/stigmer/tenancy/organization/v1/api_pb";
+import { ApiResourceMetadataSchema } from "@stigmer/protos/ai/stigmer/commons/apiresource/metadata_pb";
 import { useCreateOrganization } from "./useCreateOrganization";
 import { generateSlug } from "../internal/slug";
-
-// ---------------------------------------------------------------------------
-// Slug validation (mirrors Organization proto CEL rules)
-// ---------------------------------------------------------------------------
-
-const SLUG_PATTERN = /^[a-z][a-z0-9-]*$/;
-const SLUG_MIN = 2;
-const SLUG_MAX = 15;
-
-function validateSlug(slug: string): string | null {
-  if (slug.length === 0) return "Slug is required.";
-  if (slug.length < SLUG_MIN || slug.length > SLUG_MAX)
-    return `Must be between ${SLUG_MIN} and ${SLUG_MAX} characters.`;
-  if (!/^[a-z]/.test(slug)) return "Must start with a lowercase letter.";
-  if (!SLUG_PATTERN.test(slug))
-    return "Only lowercase letters, numbers, and hyphens are allowed.";
-  return null;
-}
+import { validateMessage, getFieldError } from "../internal/validate";
 
 // ---------------------------------------------------------------------------
 // Public API
@@ -72,9 +57,26 @@ export function CreateOrganizationForm({
   const slugTouchedRef = useRef(false);
 
   const trimmedName = name.trim();
-  const slugError = slug.length > 0 ? validateSlug(slug) : null;
+
+  const violations =
+    slug.length > 0 || trimmedName.length > 0
+      ? validateMessage(
+          ApiResourceMetadataSchema,
+          createMessage(ApiResourceMetadataSchema, {
+            ...(slug.length > 0 && { slug }),
+            ...(trimmedName.length > 0 && { name: trimmedName }),
+          }),
+        )
+      : [];
+  const slugError = slug.length > 0 ? getFieldError(violations, "slug") : null;
+  const nameError =
+    trimmedName.length > 0 ? getFieldError(violations, "name") : null;
   const canSubmit =
-    trimmedName !== "" && slug.length > 0 && slugError === null && !isCreating;
+    trimmedName !== "" &&
+    slug.length > 0 &&
+    slugError === null &&
+    nameError === null &&
+    !isCreating;
 
   const handleNameChange = useCallback(
     (value: string) => {
@@ -132,16 +134,24 @@ export function CreateOrganizationForm({
             disabled={isCreating}
             autoFocus
             required
+            maxLength={63}
             className={cn(
-              "w-full rounded-md border border-input bg-background px-2.5 py-1.5 text-xs text-foreground",
+              "w-full rounded-md border bg-background px-2.5 py-1.5 text-xs text-foreground",
               "placeholder:text-muted-foreground",
               "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
               "disabled:pointer-events-none disabled:opacity-50",
+              nameError ? "border-destructive" : "border-input",
             )}
           />
-          <p className="text-[0.65rem] text-muted-foreground">
-            A human-readable display name for the organization.
-          </p>
+          {nameError ? (
+            <p className="text-[0.65rem] text-destructive" role="alert">
+              {nameError}
+            </p>
+          ) : (
+            <p className="text-[0.65rem] text-muted-foreground">
+              A human-readable display name for the organization.
+            </p>
+          )}
         </div>
 
         {/* ---- Slug ---- */}
@@ -176,9 +186,8 @@ export function CreateOrganizationForm({
             </p>
           ) : (
             <p className="text-[0.65rem] text-muted-foreground">
-              URL-friendly identifier used in resource references.{" "}
-              {SLUG_MIN}&ndash;{SLUG_MAX} characters: lowercase letters, numbers, and
-              hyphens.
+              URL-friendly identifier used in resource references. 2&ndash;63
+              characters: lowercase letters, numbers, and hyphens.
             </p>
           )}
         </div>

package/src/provider.tsx

@@ -6,6 +6,10 @@ import { cn, resolvePresetClass } from "@stigmer/theme";
 import type { ThemePresetId } from "@stigmer/theme";
 import { StigmerContext } from "./context";
 import { DeploymentModeContext } from "./deployment-mode";
+import { ExecutionTargetContext } from "./execution-target-context";
+import type { ExecutionTargetOption } from "./session/execution-target";
+import type { RunnerAdapter } from "./runner-adapter";
+import { RunnerAdapterContext } from "./runner-adapter";
 import type { ColorMode, ResolvedColorMode } from "./color-mode";
 import { ColorModeContext, useSystemColorMode } from "./color-mode";
 import { PortalContainerContext } from "./portal-container";
@@ -34,6 +38,41 @@ export interface StigmerProviderProps {
    * Platform builders pass it based on their deployment context.
    */
   readonly deploymentMode?: DeploymentMode;
+  /**
+   * Default execution target for all sessions created within this
+   * provider scope.
+   *
+   * - `"local"` -- Client provides runners (desktop app, CLI, or
+   *   customer-managed runner process).
+   * - `"cloud"` -- Server provisions cloud sandboxes automatically.
+   * - `undefined` (default) -- Server decides based on deployment
+   *   context (LOCAL for OSS, CLOUD for managed).
+   *
+   * This is an app-level setting, not a per-session choice. Hooks
+   * like `useNewSessionFlow` and `useCreateSession` read this from
+   * context so every session in the tree inherits the same target.
+   */
+  readonly executionTarget?: ExecutionTargetOption;
+  /**
+   * Runner adapter for local execution lifecycle management.
+   *
+   * When `executionTarget` is `"local"`, SDK hooks automatically call
+   * the adapter after session/execution creation and on terminal phase
+   * detection. Cloud consumers omit this prop entirely.
+   *
+   * Desktop apps provide a Tauri-based adapter; self-hosted customers
+   * provide their own implementation of the {@link RunnerAdapter}
+   * interface.
+   *
+   * @example
+   * ```tsx
+   * const adapter = useTauriRunnerAdapter();
+   * <StigmerProvider client={client} executionTarget="local" runnerAdapter={adapter}>
+   *   <App />
+   * </StigmerProvider>
+   * ```
+   */
+  readonly runnerAdapter?: RunnerAdapter;
   /**
    * Built-in theme preset to apply.
    *
@@ -121,6 +160,8 @@ export function StigmerProvider({
   client,
   children,
   deploymentMode = "cloud",
+  executionTarget,
+  runnerAdapter,
   preset,
   className,
   colorMode = "light",
@@ -138,20 +179,24 @@ export function StigmerProvider({
   return (
     <StigmerContext.Provider value={client}>
       <DeploymentModeContext.Provider value={deploymentMode}>
-        <ColorModeContext.Provider value={resolvedMode}>
-          <ModelRegistryContext.Provider value={registryState}>
-            <TaskKindRegistryContext.Provider value={taskKindRegistryState}>
-              <PortalContainerContext.Provider value={portalContainer}>
-                <div
-                  className={cn("stgm", presetClass, className)}
-                  data-stgm-color-mode={resolvedMode}
-                >
-                  {children}
-                </div>
-              </PortalContainerContext.Provider>
-            </TaskKindRegistryContext.Provider>
-          </ModelRegistryContext.Provider>
-        </ColorModeContext.Provider>
+        <ExecutionTargetContext.Provider value={executionTarget}>
+          <RunnerAdapterContext.Provider value={runnerAdapter ?? null}>
+            <ColorModeContext.Provider value={resolvedMode}>
+              <ModelRegistryContext.Provider value={registryState}>
+                <TaskKindRegistryContext.Provider value={taskKindRegistryState}>
+                  <PortalContainerContext.Provider value={portalContainer}>
+                    <div
+                      className={cn("stgm", presetClass, className)}
+                      data-stgm-color-mode={resolvedMode}
+                    >
+                      {children}
+                    </div>
+                  </PortalContainerContext.Provider>
+                </TaskKindRegistryContext.Provider>
+              </ModelRegistryContext.Provider>
+            </ColorModeContext.Provider>
+          </RunnerAdapterContext.Provider>
+        </ExecutionTargetContext.Provider>
       </DeploymentModeContext.Provider>
     </StigmerContext.Provider>
   );

package/src/resource-creation/index.ts

@@ -12,6 +12,8 @@ export type { ResourceTemplate, TemplateCategory } from "./templates/types";
 export { TEMPLATE_CATEGORY_LABELS } from "./templates/types";
 export { AGENT_TEMPLATES } from "./templates/agent-templates";
 export { MCP_SERVER_TEMPLATES } from "./templates/mcp-server-templates";
+export { WORKFLOW_TEMPLATES } from "./templates/workflow-templates";
+export type { WorkflowTemplateData } from "./templates/workflow-templates";
 
 // Hooks
 export { useWizardState } from "./useWizardState";

package/src/resource-creation/templates/index.ts

@@ -5,3 +5,5 @@ export { TEMPLATE_CATEGORY_LABELS } from "./types";
 // Static template data
 export { AGENT_TEMPLATES } from "./agent-templates";
 export { MCP_SERVER_TEMPLATES } from "./mcp-server-templates";
+export { WORKFLOW_TEMPLATES } from "./workflow-templates";
+export type { WorkflowTemplateData } from "./workflow-templates";