@dilipod/ui 0.4.18 → 0.4.20

package/dist/components/scenarios-manager.d.ts

@@ -20,7 +20,9 @@ export interface ScenariosManagerProps {
     isLoading?: boolean;
     isComplete?: boolean;
     minScenariosToComplete?: number;
+    /** Whether to show expanded by default */
+    defaultExpanded?: boolean;
     className?: string;
 }
-export declare function ScenariosManager({ scenarios, onAdd, onUpdate, onDelete, onComplete, suggestions, isLoading, isComplete, minScenariosToComplete, className, }: ScenariosManagerProps): import("react/jsx-runtime").JSX.Element;
+export declare function ScenariosManager({ scenarios, onAdd, onUpdate, onDelete, onComplete, suggestions, isLoading, isComplete, minScenariosToComplete, defaultExpanded, className, }: ScenariosManagerProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=scenarios-manager.d.ts.map

package/dist/components/scenarios-manager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scenarios-manager.d.ts","sourceRoot":"","sources":["../../src/components/scenarios-manager.tsx"],"names":[],"mappings":"AAmBA,MAAM,MAAM,YAAY,GAAG,YAAY,GAAG,kBAAkB,GAAG,eAAe,GAAG,WAAW,CAAA;AAE5F,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,YAAY,CAAA;IAClB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,YAAY,CAAA;IAClB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,qBAAqB;IACpC,SAAS,EAAE,QAAQ,EAAE,CAAA;IACrB,KAAK,EAAE,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACxD,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACvE,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACvC,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;IAChC,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAA;IAClC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAoOD,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,WAAgB,EAChB,SAAS,EACT,UAAkB,EAClB,sBAA0B,EAC1B,SAAS,GACV,EAAE,qBAAqB,2CA+KvB"}
+{"version":3,"file":"scenarios-manager.d.ts","sourceRoot":"","sources":["../../src/components/scenarios-manager.tsx"],"names":[],"mappings":"AAmBA,MAAM,MAAM,YAAY,GAAG,YAAY,GAAG,kBAAkB,GAAG,eAAe,GAAG,WAAW,CAAA;AAE5F,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,YAAY,CAAA;IAClB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,YAAY,CAAA;IAClB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,qBAAqB;IACpC,SAAS,EAAE,QAAQ,EAAE,CAAA;IACrB,KAAK,EAAE,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACxD,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACvE,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACvC,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;IAChC,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAA;IAClC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,0CAA0C;IAC1C,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAoOD,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,WAAgB,EAChB,SAAS,EACT,UAAkB,EAClB,sBAA0B,EAC1B,eAAsB,EACtB,SAAS,GACV,EAAE,qBAAqB,2CAwMvB"}

package/dist/index.js

@@ -4420,12 +4420,14 @@ function ScenariosManager({
   isLoading,
   isComplete = false,
   minScenariosToComplete = 1,
+  defaultExpanded = true,
   className
 }) {
   const [dialogOpen, setDialogOpen] = React51__namespace.useState(false);
   const [editingScenario, setEditingScenario] = React51__namespace.useState(null);
   const [deletingId, setDeletingId] = React51__namespace.useState(null);
   const [isCompleting, setIsCompleting] = React51__namespace.useState(false);
+  const [isExpanded, setIsExpanded] = React51__namespace.useState(defaultExpanded);
   const canComplete = scenarios.length >= minScenariosToComplete && !isComplete && onComplete;
   const handleAddClick = () => {
     setEditingScenario(null);
@@ -4468,74 +4470,85 @@ function ScenariosManager({
     )
   );
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-4", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-sm bg-[var(--cyan)]/10 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(react_star.Lightning, { size: 20, weight: "fill", className: "text-[var(--cyan)]" }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-[var(--black)]", children: "Scenarios" }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: scenarios.length === 0 ? "Define rules for edge cases and escalations" : `${scenarios.length} scenario${scenarios.length === 1 ? "" : "s"} defined` })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", onClick: handleAddClick, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => setIsExpanded(!isExpanded),
+        className: "w-full flex items-center justify-between bg-muted/30 border border-border/50 px-4 py-3 rounded-lg hover:bg-muted/50 transition-colors",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-12 h-12 rounded-lg bg-[var(--cyan)]/10 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(react_star.Lightning, { size: 24, weight: "fill", className: "text-[var(--cyan)]" }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-left", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-[var(--black)]", children: "Scenarios" }),
+                isComplete && /* @__PURE__ */ jsxRuntime.jsxs(Badge, { variant: "primary", size: "sm", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(react_star.CheckCircle, { size: 12, weight: "fill" }),
+                  "Complete"
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: scenarios.length === 0 ? "Define rules for edge cases and escalations" : `${scenarios.length} scenario${scenarios.length === 1 ? "" : "s"} defined` })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3", children: isExpanded ? /* @__PURE__ */ jsxRuntime.jsx(react_star.CaretUp, { size: 20, className: "text-muted-foreground" }) : /* @__PURE__ */ jsxRuntime.jsx(react_star.CaretDown, { size: 20, className: "text-muted-foreground" }) })
+        ]
+      }
+    ),
+    isExpanded && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", onClick: handleAddClick, children: [
         /* @__PURE__ */ jsxRuntime.jsx(react_star.Plus, { size: 16, className: "mr-1" }),
         "Add scenario"
-      ] })
-    ] }),
-    scenarios.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-3", children: scenarios.map((scenario) => /* @__PURE__ */ jsxRuntime.jsx(
-      ScenarioCard,
-      {
-        scenario,
-        onEdit: () => handleEditClick(scenario),
-        onDelete: () => handleDelete(scenario.id)
-      },
-      scenario.id
-    )) }),
-    scenarios.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border border-dashed border-border rounded-sm p-8 text-center", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-12 h-12 rounded-sm bg-muted flex items-center justify-center mx-auto mb-3", children: /* @__PURE__ */ jsxRuntime.jsx(react_star.Lightning, { size: 24, className: "text-muted-foreground" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-4", children: "No scenarios yet. Add rules for how the worker should handle edge cases." }),
-      /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", onClick: handleAddClick, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(react_star.Plus, { size: 16, className: "mr-1.5" }),
-        "Add your first scenario"
-      ] })
-    ] }),
-    filteredSuggestions.length > 0 && !isComplete && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mb-2", children: "Suggested scenarios:" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: filteredSuggestions.map((suggestion, index) => /* @__PURE__ */ jsxRuntime.jsx(
-        SuggestionChip,
+      ] }) }),
+      scenarios.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-3", children: scenarios.map((scenario) => /* @__PURE__ */ jsxRuntime.jsx(
+        ScenarioCard,
         {
-          suggestion,
-          onAdd: () => handleSuggestionAdd(suggestion),
-          disabled: isLoading
+          scenario,
+          onEdit: () => handleEditClick(scenario),
+          onDelete: () => handleDelete(scenario.id)
         },
-        index
-      )) })
-    ] }),
-    canComplete && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-4 border-t border-border", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4 bg-[var(--cyan)]/5 rounded-sm p-4 -mx-1", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[var(--black)]", children: "Ready to proceed?" }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-0.5", children: "Mark your scenarios as complete to continue with the onboarding." })
+        scenario.id
+      )) }),
+      scenarios.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border border-dashed border-border rounded-sm p-8 text-center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-12 h-12 rounded-sm bg-muted flex items-center justify-center mx-auto mb-3", children: /* @__PURE__ */ jsxRuntime.jsx(react_star.Lightning, { size: 24, className: "text-muted-foreground" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-4", children: "No scenarios yet. Add rules for how the worker should handle edge cases." }),
+        /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", onClick: handleAddClick, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(react_star.Plus, { size: 16, className: "mr-1.5" }),
+          "Add your first scenario"
+        ] })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        Button,
-        {
-          onClick: handleComplete,
-          disabled: isCompleting,
-          loading: isCompleting,
-          size: "sm",
-          className: "shrink-0",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(react_star.Check, { size: 16, className: "mr-1.5" }),
-            "Mark complete"
-          ]
-        }
-      )
-    ] }) }),
-    isComplete && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-4 border-t border-border", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-[var(--cyan)]", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(react_star.CheckCircle, { size: 16, weight: "fill" }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: "Scenarios completed" })
+      filteredSuggestions.length > 0 && !isComplete && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mb-2", children: "Suggested scenarios:" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: filteredSuggestions.map((suggestion, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          SuggestionChip,
+          {
+            suggestion,
+            onAdd: () => handleSuggestionAdd(suggestion),
+            disabled: isLoading
+          },
+          index
+        )) })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-1", children: "You can still add or edit scenarios while we build your worker." })
+      canComplete && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-4 border-t border-border", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4 bg-[var(--cyan)]/5 rounded-sm p-4 -mx-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[var(--black)]", children: "Ready to proceed?" }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-0.5", children: "Mark your scenarios as complete to continue with the onboarding." })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          Button,
+          {
+            onClick: handleComplete,
+            disabled: isCompleting,
+            loading: isCompleting,
+            size: "sm",
+            className: "shrink-0",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(react_star.Check, { size: 16, className: "mr-1.5" }),
+              "Mark complete"
+            ]
+          }
+        )
+      ] }) }),
+      isComplete && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-4 border-t border-border", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "You can still add or edit scenarios while we build your worker." }) })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx(
       ScenarioDialog,