@dilipod/ui 0.4.18 → 0.4.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/scenarios-manager.d.ts +3 -1
- package/dist/components/scenarios-manager.d.ts.map +1 -1
- package/dist/index.js +75 -62
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +76 -63
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/scenarios-manager.tsx +112 -86
|
@@ -20,7 +20,9 @@ export interface ScenariosManagerProps {
|
|
|
20
20
|
isLoading?: boolean;
|
|
21
21
|
isComplete?: boolean;
|
|
22
22
|
minScenariosToComplete?: number;
|
|
23
|
+
/** Whether to show expanded by default */
|
|
24
|
+
defaultExpanded?: boolean;
|
|
23
25
|
className?: string;
|
|
24
26
|
}
|
|
25
|
-
export declare function ScenariosManager({ scenarios, onAdd, onUpdate, onDelete, onComplete, suggestions, isLoading, isComplete, minScenariosToComplete, className, }: ScenariosManagerProps): import("react/jsx-runtime").JSX.Element;
|
|
27
|
+
export declare function ScenariosManager({ scenarios, onAdd, onUpdate, onDelete, onComplete, suggestions, isLoading, isComplete, minScenariosToComplete, defaultExpanded, className, }: ScenariosManagerProps): import("react/jsx-runtime").JSX.Element;
|
|
26
28
|
//# sourceMappingURL=scenarios-manager.d.ts.map
|
|
@@ -1 +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,
|
|
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,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,2CAsMvB"}
|
package/dist/index.js
CHANGED
|
@@ -4420,12 +4420,14 @@ function ScenariosManager({
|
|
|
4420
4420
|
isLoading,
|
|
4421
4421
|
isComplete = false,
|
|
4422
4422
|
minScenariosToComplete = 1,
|
|
4423
|
+
defaultExpanded = true,
|
|
4423
4424
|
className
|
|
4424
4425
|
}) {
|
|
4425
4426
|
const [dialogOpen, setDialogOpen] = React51__namespace.useState(false);
|
|
4426
4427
|
const [editingScenario, setEditingScenario] = React51__namespace.useState(null);
|
|
4427
4428
|
const [deletingId, setDeletingId] = React51__namespace.useState(null);
|
|
4428
4429
|
const [isCompleting, setIsCompleting] = React51__namespace.useState(false);
|
|
4430
|
+
const [isExpanded, setIsExpanded] = React51__namespace.useState(defaultExpanded);
|
|
4429
4431
|
const canComplete = scenarios.length >= minScenariosToComplete && !isComplete && onComplete;
|
|
4430
4432
|
const handleAddClick = () => {
|
|
4431
4433
|
setEditingScenario(null);
|
|
@@ -4468,74 +4470,85 @@ function ScenariosManager({
|
|
|
4468
4470
|
)
|
|
4469
4471
|
);
|
|
4470
4472
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-4", className), children: [
|
|
4471
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4472
|
-
|
|
4473
|
-
|
|
4474
|
-
|
|
4475
|
-
|
|
4476
|
-
|
|
4477
|
-
|
|
4478
|
-
|
|
4479
|
-
|
|
4473
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4474
|
+
"button",
|
|
4475
|
+
{
|
|
4476
|
+
type: "button",
|
|
4477
|
+
onClick: () => setIsExpanded(!isExpanded),
|
|
4478
|
+
className: "w-full flex items-center justify-between hover:bg-muted/30 -mx-2 px-2 py-1 rounded-sm transition-colors",
|
|
4479
|
+
children: [
|
|
4480
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
|
|
4481
|
+
/* @__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)]" }) }),
|
|
4482
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-left", children: [
|
|
4483
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-[var(--black)]", children: "Scenarios" }),
|
|
4484
|
+
/* @__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` })
|
|
4485
|
+
] })
|
|
4486
|
+
] }),
|
|
4487
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
4488
|
+
isComplete && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 text-[var(--cyan)]", children: [
|
|
4489
|
+
/* @__PURE__ */ jsxRuntime.jsx(react_star.CheckCircle, { size: 16, weight: "fill" }),
|
|
4490
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: "Complete" })
|
|
4491
|
+
] }),
|
|
4492
|
+
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" })
|
|
4493
|
+
] })
|
|
4494
|
+
]
|
|
4495
|
+
}
|
|
4496
|
+
),
|
|
4497
|
+
isExpanded && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
4498
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", onClick: handleAddClick, children: [
|
|
4480
4499
|
/* @__PURE__ */ jsxRuntime.jsx(react_star.Plus, { size: 16, className: "mr-1" }),
|
|
4481
4500
|
"Add scenario"
|
|
4482
|
-
] })
|
|
4483
|
-
|
|
4484
|
-
|
|
4485
|
-
ScenarioCard,
|
|
4486
|
-
{
|
|
4487
|
-
scenario,
|
|
4488
|
-
onEdit: () => handleEditClick(scenario),
|
|
4489
|
-
onDelete: () => handleDelete(scenario.id)
|
|
4490
|
-
},
|
|
4491
|
-
scenario.id
|
|
4492
|
-
)) }),
|
|
4493
|
-
scenarios.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border border-dashed border-border rounded-sm p-8 text-center", children: [
|
|
4494
|
-
/* @__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" }) }),
|
|
4495
|
-
/* @__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." }),
|
|
4496
|
-
/* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", onClick: handleAddClick, children: [
|
|
4497
|
-
/* @__PURE__ */ jsxRuntime.jsx(react_star.Plus, { size: 16, className: "mr-1.5" }),
|
|
4498
|
-
"Add your first scenario"
|
|
4499
|
-
] })
|
|
4500
|
-
] }),
|
|
4501
|
-
filteredSuggestions.length > 0 && !isComplete && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-2", children: [
|
|
4502
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mb-2", children: "Suggested scenarios:" }),
|
|
4503
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: filteredSuggestions.map((suggestion, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
4504
|
-
SuggestionChip,
|
|
4501
|
+
] }) }),
|
|
4502
|
+
scenarios.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-3", children: scenarios.map((scenario) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
4503
|
+
ScenarioCard,
|
|
4505
4504
|
{
|
|
4506
|
-
|
|
4507
|
-
|
|
4508
|
-
|
|
4505
|
+
scenario,
|
|
4506
|
+
onEdit: () => handleEditClick(scenario),
|
|
4507
|
+
onDelete: () => handleDelete(scenario.id)
|
|
4509
4508
|
},
|
|
4510
|
-
|
|
4511
|
-
)) })
|
|
4512
|
-
|
|
4513
|
-
|
|
4514
|
-
|
|
4515
|
-
/* @__PURE__ */ jsxRuntime.
|
|
4516
|
-
|
|
4509
|
+
scenario.id
|
|
4510
|
+
)) }),
|
|
4511
|
+
scenarios.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border border-dashed border-border rounded-sm p-8 text-center", children: [
|
|
4512
|
+
/* @__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" }) }),
|
|
4513
|
+
/* @__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." }),
|
|
4514
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", onClick: handleAddClick, children: [
|
|
4515
|
+
/* @__PURE__ */ jsxRuntime.jsx(react_star.Plus, { size: 16, className: "mr-1.5" }),
|
|
4516
|
+
"Add your first scenario"
|
|
4517
|
+
] })
|
|
4517
4518
|
] }),
|
|
4518
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4519
|
-
|
|
4520
|
-
{
|
|
4521
|
-
|
|
4522
|
-
|
|
4523
|
-
|
|
4524
|
-
|
|
4525
|
-
|
|
4526
|
-
|
|
4527
|
-
|
|
4528
|
-
|
|
4529
|
-
]
|
|
4530
|
-
}
|
|
4531
|
-
)
|
|
4532
|
-
] }) }),
|
|
4533
|
-
isComplete && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-4 border-t border-border", children: [
|
|
4534
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-[var(--cyan)]", children: [
|
|
4535
|
-
/* @__PURE__ */ jsxRuntime.jsx(react_star.CheckCircle, { size: 16, weight: "fill" }),
|
|
4536
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: "Scenarios completed" })
|
|
4519
|
+
filteredSuggestions.length > 0 && !isComplete && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-2", children: [
|
|
4520
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mb-2", children: "Suggested scenarios:" }),
|
|
4521
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: filteredSuggestions.map((suggestion, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
4522
|
+
SuggestionChip,
|
|
4523
|
+
{
|
|
4524
|
+
suggestion,
|
|
4525
|
+
onAdd: () => handleSuggestionAdd(suggestion),
|
|
4526
|
+
disabled: isLoading
|
|
4527
|
+
},
|
|
4528
|
+
index
|
|
4529
|
+
)) })
|
|
4537
4530
|
] }),
|
|
4538
|
-
/* @__PURE__ */ jsxRuntime.jsx("
|
|
4531
|
+
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: [
|
|
4532
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4533
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-[var(--black)]", children: "Ready to proceed?" }),
|
|
4534
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-0.5", children: "Mark your scenarios as complete to continue with the onboarding." })
|
|
4535
|
+
] }),
|
|
4536
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4537
|
+
Button,
|
|
4538
|
+
{
|
|
4539
|
+
onClick: handleComplete,
|
|
4540
|
+
disabled: isCompleting,
|
|
4541
|
+
loading: isCompleting,
|
|
4542
|
+
size: "sm",
|
|
4543
|
+
className: "shrink-0",
|
|
4544
|
+
children: [
|
|
4545
|
+
/* @__PURE__ */ jsxRuntime.jsx(react_star.Check, { size: 16, className: "mr-1.5" }),
|
|
4546
|
+
"Mark complete"
|
|
4547
|
+
]
|
|
4548
|
+
}
|
|
4549
|
+
)
|
|
4550
|
+
] }) }),
|
|
4551
|
+
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." }) })
|
|
4539
4552
|
] }),
|
|
4540
4553
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4541
4554
|
ScenarioDialog,
|