@d34dman/flowdrop 0.0.63 → 0.0.65

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.
Files changed (125) hide show
  1. package/README.md +2 -0
  2. package/dist/adapters/agentspec/AgentSpecAdapter.js +1 -40
  3. package/dist/api/enhanced-client.d.ts +19 -0
  4. package/dist/api/enhanced-client.js +9 -0
  5. package/dist/components/App.svelte +32 -36
  6. package/dist/components/CanvasBanner.stories.svelte +12 -8
  7. package/dist/components/CanvasBanner.stories.svelte.d.ts +1 -1
  8. package/dist/components/ConfigModal.svelte +7 -11
  9. package/dist/components/ConfigModal.svelte.d.ts +5 -23
  10. package/dist/components/ConfigPanel.stories.svelte +35 -26
  11. package/dist/components/ConfigPanel.stories.svelte.d.ts +1 -1
  12. package/dist/components/LoadingSpinner.stories.svelte +13 -13
  13. package/dist/components/LoadingSpinner.stories.svelte.d.ts +1 -1
  14. package/dist/components/Logo.stories.svelte +4 -4
  15. package/dist/components/Logo.stories.svelte.d.ts +1 -1
  16. package/dist/components/LogsSidebar.svelte +6 -9
  17. package/dist/components/LogsSidebar.svelte.d.ts +3 -20
  18. package/dist/components/MarkdownDisplay.stories.svelte +25 -10
  19. package/dist/components/MarkdownDisplay.stories.svelte.d.ts +1 -1
  20. package/dist/components/Navbar.stories.svelte +42 -30
  21. package/dist/components/Navbar.stories.svelte.d.ts +1 -1
  22. package/dist/components/Navbar.svelte +6 -3
  23. package/dist/components/NodeSidebar.svelte +1 -0
  24. package/dist/components/NodeStatusOverlay.stories.svelte +61 -50
  25. package/dist/components/NodeStatusOverlay.stories.svelte.d.ts +1 -1
  26. package/dist/components/NodeStatusOverlay.svelte +4 -4
  27. package/dist/components/PipelineStatus.svelte +10 -12
  28. package/dist/components/PipelineStatus.svelte.d.ts +2 -2
  29. package/dist/components/SchemaForm.stories.svelte +97 -82
  30. package/dist/components/SchemaForm.stories.svelte.d.ts +1 -1
  31. package/dist/components/SchemaForm.svelte +6 -2
  32. package/dist/components/SettingsPanel.svelte +6 -1
  33. package/dist/components/StatusIcon.stories.svelte +15 -15
  34. package/dist/components/StatusIcon.stories.svelte.d.ts +1 -1
  35. package/dist/components/StatusIcon.svelte +1 -1
  36. package/dist/components/StatusLabel.stories.svelte +8 -8
  37. package/dist/components/StatusLabel.stories.svelte.d.ts +1 -1
  38. package/dist/components/ThemeToggle.stories.svelte +10 -10
  39. package/dist/components/ThemeToggle.stories.svelte.d.ts +1 -1
  40. package/dist/components/WorkflowEditor.svelte +23 -5
  41. package/dist/components/form/FormAutocomplete.svelte +2 -0
  42. package/dist/components/form/FormCheckboxGroup.stories.svelte +13 -13
  43. package/dist/components/form/FormCheckboxGroup.stories.svelte.d.ts +1 -1
  44. package/dist/components/form/FormField.svelte +2 -2
  45. package/dist/components/form/FormFieldLight.svelte +4 -4
  46. package/dist/components/form/FormFieldWrapper.stories.svelte +38 -16
  47. package/dist/components/form/FormFieldWrapper.stories.svelte.d.ts +1 -1
  48. package/dist/components/form/FormNumberField.stories.svelte +21 -18
  49. package/dist/components/form/FormNumberField.stories.svelte.d.ts +1 -1
  50. package/dist/components/form/FormRangeField.stories.svelte +13 -13
  51. package/dist/components/form/FormRangeField.stories.svelte.d.ts +1 -1
  52. package/dist/components/form/FormSelect.stories.svelte +21 -21
  53. package/dist/components/form/FormSelect.stories.svelte.d.ts +1 -1
  54. package/dist/components/form/FormTemplateEditor.svelte +0 -13
  55. package/dist/components/form/FormTemplateEditor.svelte.d.ts +1 -7
  56. package/dist/components/form/FormTextField.stories.svelte +17 -17
  57. package/dist/components/form/FormTextField.stories.svelte.d.ts +1 -1
  58. package/dist/components/form/FormTextarea.stories.svelte +21 -18
  59. package/dist/components/form/FormTextarea.stories.svelte.d.ts +1 -1
  60. package/dist/components/form/FormToggle.stories.svelte +13 -13
  61. package/dist/components/form/FormToggle.stories.svelte.d.ts +1 -1
  62. package/dist/components/form/index.d.ts +2 -1
  63. package/dist/components/form/index.js +1 -2
  64. package/dist/components/form/types.d.ts +8 -20
  65. package/dist/components/form/types.js +3 -8
  66. package/dist/components/interrupt/ChoicePrompt.stories.svelte +37 -28
  67. package/dist/components/interrupt/ChoicePrompt.stories.svelte.d.ts +1 -1
  68. package/dist/components/interrupt/ConfirmationPrompt.stories.svelte +57 -35
  69. package/dist/components/interrupt/ConfirmationPrompt.stories.svelte.d.ts +1 -1
  70. package/dist/components/interrupt/FormPrompt.svelte +1 -0
  71. package/dist/components/interrupt/ReviewPrompt.stories.svelte +52 -31
  72. package/dist/components/interrupt/ReviewPrompt.stories.svelte.d.ts +1 -1
  73. package/dist/components/interrupt/ReviewPrompt.svelte +44 -25
  74. package/dist/components/interrupt/TextInputPrompt.stories.svelte +32 -19
  75. package/dist/components/interrupt/TextInputPrompt.stories.svelte.d.ts +1 -1
  76. package/dist/components/interrupt/TextInputPrompt.svelte +1 -0
  77. package/dist/components/layouts/MainLayout.svelte +3 -0
  78. package/dist/components/nodes/GatewayNode.stories.svelte +96 -64
  79. package/dist/components/nodes/IdeaNode.stories.svelte +40 -36
  80. package/dist/components/nodes/NotesNode.stories.svelte +61 -54
  81. package/dist/components/nodes/SimpleNode.stories.svelte +141 -83
  82. package/dist/components/nodes/SquareNode.stories.svelte +70 -44
  83. package/dist/components/nodes/TerminalNode.stories.svelte +10 -10
  84. package/dist/components/nodes/TerminalNode.svelte +6 -2
  85. package/dist/components/nodes/ToolNode.stories.svelte +177 -59
  86. package/dist/components/nodes/WorkflowNode.stories.svelte +43 -38
  87. package/dist/components/playground/MessageBubble.stories.svelte +51 -38
  88. package/dist/components/playground/MessageBubble.stories.svelte.d.ts +1 -1
  89. package/dist/components/playground/Playground.svelte +2 -4
  90. package/dist/config/constants.d.ts +21 -0
  91. package/dist/config/constants.js +9 -0
  92. package/dist/core/index.d.ts +7 -5
  93. package/dist/core/index.js +5 -5
  94. package/dist/editor/index.d.ts +4 -4
  95. package/dist/editor/index.js +3 -4
  96. package/dist/form/code.js +16 -4
  97. package/dist/form/fieldRegistry.d.ts +8 -82
  98. package/dist/form/fieldRegistry.js +9 -101
  99. package/dist/form/full.d.ts +4 -1
  100. package/dist/form/full.js +6 -1
  101. package/dist/form/index.d.ts +1 -1
  102. package/dist/form/index.js +0 -2
  103. package/dist/form/markdown.js +11 -3
  104. package/dist/helpers/workflowEditorHelper.d.ts +0 -3
  105. package/dist/helpers/workflowEditorHelper.js +7 -26
  106. package/dist/index.js +3 -0
  107. package/dist/services/apiVariableService.d.ts +1 -3
  108. package/dist/services/apiVariableService.js +3 -4
  109. package/dist/services/dynamicSchemaService.js +3 -4
  110. package/dist/stories/CanvasDecorator.svelte +7 -8
  111. package/dist/stories/CanvasDecorator.svelte.d.ts +2 -2
  112. package/dist/stories/NodeDecorator.svelte +13 -14
  113. package/dist/stories/NodeDecorator.svelte.d.ts +1 -1
  114. package/dist/stories/utils.d.ts +2 -2
  115. package/dist/stories/utils.js +55 -55
  116. package/dist/styles/base.css +12 -4
  117. package/dist/styles/tokens.css +138 -130
  118. package/dist/types/interrupt.d.ts +1 -4
  119. package/dist/utils/errors.d.ts +28 -0
  120. package/dist/utils/errors.js +44 -0
  121. package/dist/utils/handleIds.d.ts +35 -0
  122. package/dist/utils/handleIds.js +58 -0
  123. package/package.json +53 -12
  124. package/dist/api/client.d.ts +0 -110
  125. package/dist/api/client.js +0 -240
@@ -1,4 +1,4 @@
1
- import type { VariableSchema, TemplateVariablesConfig, WorkflowNode, WorkflowEdge, AuthProvider } from '../../types/index.js';
1
+ import type { TemplateVariablesConfig, WorkflowNode, WorkflowEdge, AuthProvider } from '../../types/index.js';
2
2
  interface Props {
3
3
  /** Field identifier */
4
4
  id: string;
@@ -17,12 +17,6 @@ interface Props {
17
17
  * Controls which variables are available and how they are displayed.
18
18
  */
19
19
  variables?: TemplateVariablesConfig;
20
- /**
21
- * Variable schema for advanced autocomplete with nested drilling.
22
- * When provided, enables dot notation (user.name) and array access (items[0]).
23
- * @deprecated Use `variables.schema` instead
24
- */
25
- variableSchema?: VariableSchema;
26
20
  /** Placeholder variable example for the hint */
27
21
  placeholderExample?: string;
28
22
  /** Whether the field is disabled (read-only) */
@@ -1,30 +1,30 @@
1
1
  <script module>
2
- import { defineMeta } from "@storybook/addon-svelte-csf";
3
- import FormTextField from "./FormTextField.svelte";
4
- import { fn } from "storybook/test";
2
+ import { defineMeta } from '@storybook/addon-svelte-csf';
3
+ import FormTextField from './FormTextField.svelte';
4
+ import { fn } from 'storybook/test';
5
5
 
6
6
  const { Story } = defineMeta({
7
- title: "Form/FormTextField",
7
+ title: 'Form/FormTextField',
8
8
  component: FormTextField,
9
- tags: ["autodocs"],
9
+ tags: ['autodocs'],
10
10
  argTypes: {
11
- value: { control: "text" },
12
- placeholder: { control: "text" },
13
- required: { control: "boolean" },
14
- disabled: { control: "boolean" },
11
+ value: { control: 'text' },
12
+ placeholder: { control: 'text' },
13
+ required: { control: 'boolean' },
14
+ disabled: { control: 'boolean' }
15
15
  },
16
16
  args: {
17
- id: "demo-text-field",
18
- value: "",
19
- onChange: fn(),
20
- },
17
+ id: 'demo-text-field',
18
+ value: '',
19
+ onChange: fn()
20
+ }
21
21
  });
22
22
  </script>
23
23
 
24
- <Story name="Default" args={{ placeholder: "Enter text..." }} />
24
+ <Story name="Default" args={{ placeholder: 'Enter text...' }} />
25
25
 
26
- <Story name="With Value" args={{ value: "Hello World", placeholder: "Enter text..." }} />
26
+ <Story name="With Value" args={{ value: 'Hello World', placeholder: 'Enter text...' }} />
27
27
 
28
- <Story name="Required" args={{ required: true, placeholder: "Required field" }} />
28
+ <Story name="Required" args={{ required: true, placeholder: 'Required field' }} />
29
29
 
30
- <Story name="Disabled" args={{ value: "Cannot edit this", disabled: true }} />
30
+ <Story name="Disabled" args={{ value: 'Cannot edit this', disabled: true }} />
@@ -11,7 +11,7 @@ declare const FormTextField: $$__sveltets_2_IsomorphicComponent<{
11
11
  }, {
12
12
  [evt: string]: CustomEvent<any>;
13
13
  }, {}, {}, string>;
14
- import FormTextField from "./FormTextField.svelte";
14
+ import FormTextField from './FormTextField.svelte';
15
15
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
16
16
  new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
17
17
  $$bindings?: Bindings;
@@ -1,31 +1,34 @@
1
1
  <script module>
2
- import { defineMeta } from "@storybook/addon-svelte-csf";
3
- import FormTextarea from "./FormTextarea.svelte";
4
- import { fn } from "storybook/test";
2
+ import { defineMeta } from '@storybook/addon-svelte-csf';
3
+ import FormTextarea from './FormTextarea.svelte';
4
+ import { fn } from 'storybook/test';
5
5
 
6
6
  const { Story } = defineMeta({
7
- title: "Form/FormTextarea",
7
+ title: 'Form/FormTextarea',
8
8
  component: FormTextarea,
9
- tags: ["autodocs"],
9
+ tags: ['autodocs'],
10
10
  argTypes: {
11
- value: { control: "text" },
12
- placeholder: { control: "text" },
13
- rows: { control: { type: "number", min: 1, max: 20 } },
14
- required: { control: "boolean" },
15
- disabled: { control: "boolean" },
11
+ value: { control: 'text' },
12
+ placeholder: { control: 'text' },
13
+ rows: { control: { type: 'number', min: 1, max: 20 } },
14
+ required: { control: 'boolean' },
15
+ disabled: { control: 'boolean' }
16
16
  },
17
17
  args: {
18
- id: "demo-textarea",
19
- value: "",
20
- onChange: fn(),
21
- },
18
+ id: 'demo-textarea',
19
+ value: '',
20
+ onChange: fn()
21
+ }
22
22
  });
23
23
  </script>
24
24
 
25
- <Story name="Default" args={{ placeholder: "Enter your message..." }} />
25
+ <Story name="Default" args={{ placeholder: 'Enter your message...' }} />
26
26
 
27
- <Story name="Custom Rows" args={{ rows: 8, placeholder: "Larger text area..." }} />
27
+ <Story name="Custom Rows" args={{ rows: 8, placeholder: 'Larger text area...' }} />
28
28
 
29
- <Story name="With Value" args={{ value: "This is a multiline\ntext content\nwith several lines." }} />
29
+ <Story
30
+ name="With Value"
31
+ args={{ value: 'This is a multiline\ntext content\nwith several lines.' }}
32
+ />
30
33
 
31
- <Story name="Disabled" args={{ value: "Read-only content", disabled: true }} />
34
+ <Story name="Disabled" args={{ value: 'Read-only content', disabled: true }} />
@@ -11,7 +11,7 @@ declare const FormTextarea: $$__sveltets_2_IsomorphicComponent<{
11
11
  }, {
12
12
  [evt: string]: CustomEvent<any>;
13
13
  }, {}, {}, string>;
14
- import FormTextarea from "./FormTextarea.svelte";
14
+ import FormTextarea from './FormTextarea.svelte';
15
15
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
16
16
  new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
17
17
  $$bindings?: Bindings;
@@ -1,23 +1,23 @@
1
1
  <script module>
2
- import { defineMeta } from "@storybook/addon-svelte-csf";
3
- import FormToggle from "./FormToggle.svelte";
4
- import { fn } from "storybook/test";
2
+ import { defineMeta } from '@storybook/addon-svelte-csf';
3
+ import FormToggle from './FormToggle.svelte';
4
+ import { fn } from 'storybook/test';
5
5
 
6
6
  const { Story } = defineMeta({
7
- title: "Form/FormToggle",
7
+ title: 'Form/FormToggle',
8
8
  component: FormToggle,
9
- tags: ["autodocs"],
9
+ tags: ['autodocs'],
10
10
  argTypes: {
11
- value: { control: "boolean" },
12
- onLabel: { control: "text" },
13
- offLabel: { control: "text" },
14
- disabled: { control: "boolean" },
11
+ value: { control: 'boolean' },
12
+ onLabel: { control: 'text' },
13
+ offLabel: { control: 'text' },
14
+ disabled: { control: 'boolean' }
15
15
  },
16
16
  args: {
17
- id: "demo-toggle",
17
+ id: 'demo-toggle',
18
18
  value: false,
19
- onChange: fn(),
20
- },
19
+ onChange: fn()
20
+ }
21
21
  });
22
22
  </script>
23
23
 
@@ -25,6 +25,6 @@
25
25
 
26
26
  <Story name="On" args={{ value: true }} />
27
27
 
28
- <Story name="Custom Labels" args={{ value: true, onLabel: "Yes", offLabel: "No" }} />
28
+ <Story name="Custom Labels" args={{ value: true, onLabel: 'Yes', offLabel: 'No' }} />
29
29
 
30
30
  <Story name="Disabled" args={{ value: true, disabled: true }} />
@@ -11,7 +11,7 @@ declare const FormToggle: $$__sveltets_2_IsomorphicComponent<{
11
11
  }, {
12
12
  [evt: string]: CustomEvent<any>;
13
13
  }, {}, {}, string>;
14
- import FormToggle from "./FormToggle.svelte";
14
+ import FormToggle from './FormToggle.svelte';
15
15
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
16
16
  new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
17
17
  $$bindings?: Bindings;
@@ -29,7 +29,8 @@
29
29
  * />
30
30
  * ```
31
31
  */
32
- export * from './types.js';
32
+ export type { FieldType, FieldFormat, FieldOption, OneOfItem, BaseFieldProps, TextFieldProps, TextareaFieldProps, NumberFieldProps, ToggleFieldProps, RangeFieldProps, SelectFieldProps, CheckboxGroupFieldProps, ArrayFieldProps, CodeEditorFieldProps, MarkdownEditorFieldProps, TemplateEditorFieldProps, AutocompleteFieldProps, FieldSchema, FormFieldFactoryProps, FormFieldWrapperProps, SchemaFormProps, AutocompleteConfig } from './types.js';
33
+ export { isFieldOptionArray, isOneOfArray, oneOfToOptions, normalizeOptions, getSchemaOptions } from './types.js';
33
34
  export { default as FormField } from './FormField.svelte';
34
35
  export { default as FormFieldWrapper } from './FormFieldWrapper.svelte';
35
36
  export { default as FormTextField } from './FormTextField.svelte';
@@ -29,8 +29,7 @@
29
29
  * />
30
30
  * ```
31
31
  */
32
- // Types
33
- export * from './types.js';
32
+ export { isFieldOptionArray, isOneOfArray, oneOfToOptions, normalizeOptions, getSchemaOptions } from './types.js';
34
33
  // Main factory component
35
34
  export { default as FormField } from './FormField.svelte';
36
35
  // Wrapper component
@@ -5,7 +5,7 @@
5
5
  * These types provide a foundation for dynamic form rendering based on JSON Schema
6
6
  * and support extensibility for complex field types like arrays and objects.
7
7
  */
8
- import type { AutocompleteConfig, VariableSchema, TemplateVariablesConfig } from '../../types/index.js';
8
+ import type { AutocompleteConfig, TemplateVariablesConfig } from '../../types/index.js';
9
9
  /**
10
10
  * Supported field types for form rendering
11
11
  * Aligned with JSON Schema specification (draft-07)
@@ -30,10 +30,10 @@ export type FieldFormat = 'multiline' | 'hidden' | 'range' | 'json' | 'code' | '
30
30
  /**
31
31
  * Option type for select and checkbox group fields
32
32
  *
33
- * @deprecated Use JSON Schema `oneOf` with `const`/`title` instead for labeled options.
34
- * This type is kept for backwards compatibility but will be removed in a future version.
33
+ * For new schemas, prefer JSON Schema `oneOf` with `const`/`title`.
34
+ * This type is supported for simpler use cases and backward compatibility.
35
35
  *
36
- * @example Standard JSON Schema approach:
36
+ * @example Standard JSON Schema approach (preferred):
37
37
  * ```json
38
38
  * {
39
39
  * "type": "string",
@@ -199,12 +199,6 @@ export interface TemplateEditorFieldProps extends BaseFieldProps<string> {
199
199
  * Controls which variables are available and how they are displayed.
200
200
  */
201
201
  variables?: TemplateVariablesConfig;
202
- /**
203
- * Variable schema for advanced autocomplete with nested drilling.
204
- * When provided, enables dot notation (user.name) and array access (items[0]).
205
- * @deprecated Use `variables.schema` instead
206
- */
207
- variableSchema?: VariableSchema;
208
202
  /** Placeholder variable example for the hint */
209
203
  placeholderExample?: string;
210
204
  }
@@ -263,12 +257,6 @@ export interface FieldSchema {
263
257
  multiple?: boolean;
264
258
  /** Format hint for specialized rendering */
265
259
  format?: FieldFormat;
266
- /**
267
- * Options for select type fields
268
- * @deprecated Use JSON Schema `oneOf` with `const`/`title` instead.
269
- * This property is kept for backwards compatibility but will be removed in a future version.
270
- */
271
- options?: FieldOption[];
272
260
  /** Placeholder text */
273
261
  placeholder?: string;
274
262
  /** Minimum value for numbers */
@@ -373,8 +361,8 @@ export declare function oneOfToOptions(oneOfItems: OneOfItem[]): FieldOption[];
373
361
  /**
374
362
  * Normalize options to FieldOption format
375
363
  * Handles multiple input formats for consistent internal handling:
376
- * - JSON Schema oneOf items (standard) -> converted to FieldOption
377
- * - FieldOption array (legacy) -> passed through
364
+ * - JSON Schema oneOf items -> converted to FieldOption
365
+ * - FieldOption array -> passed through
378
366
  * - String array -> converted to FieldOption
379
367
  *
380
368
  * @param options - Options in various formats
@@ -407,9 +395,9 @@ export declare function getSchemaOptions(schema: FieldSchema): FieldOption[];
407
395
  * required: ["name"]
408
396
  * },
409
397
  * values: { name: "John", age: 30 },
410
- * onChange: (values) => console.log("Changed:", values),
398
+ * onChange: (values) => handleChange(values),
411
399
  * showActions: true,
412
- * onSave: (values) => console.log("Saved:", values)
400
+ * onSave: (values) => handleSave(values)
413
401
  * };
414
402
  * ```
415
403
  */
@@ -33,8 +33,8 @@ export function oneOfToOptions(oneOfItems) {
33
33
  /**
34
34
  * Normalize options to FieldOption format
35
35
  * Handles multiple input formats for consistent internal handling:
36
- * - JSON Schema oneOf items (standard) -> converted to FieldOption
37
- * - FieldOption array (legacy) -> passed through
36
+ * - JSON Schema oneOf items -> converted to FieldOption
37
+ * - FieldOption array -> passed through
38
38
  * - String array -> converted to FieldOption
39
39
  *
40
40
  * @param options - Options in various formats
@@ -48,7 +48,7 @@ export function normalizeOptions(options) {
48
48
  if (isOneOfArray(options)) {
49
49
  return oneOfToOptions(options);
50
50
  }
51
- // Handle FieldOption array (legacy, deprecated)
51
+ // Handle FieldOption array
52
52
  if (isFieldOptionArray(options)) {
53
53
  return options;
54
54
  }
@@ -66,13 +66,8 @@ export function normalizeOptions(options) {
66
66
  * @returns Normalized FieldOption array
67
67
  */
68
68
  export function getSchemaOptions(schema) {
69
- // Prefer standard oneOf pattern
70
69
  if (schema.oneOf && schema.oneOf.length > 0) {
71
70
  return oneOfToOptions(schema.oneOf);
72
71
  }
73
- // Fall back to deprecated options property
74
- if (schema.options && schema.options.length > 0) {
75
- return schema.options;
76
- }
77
72
  return [];
78
73
  }
@@ -1,43 +1,52 @@
1
1
  <script module>
2
- import { defineMeta } from "@storybook/addon-svelte-csf";
3
- import ChoicePrompt from "./ChoicePrompt.svelte";
4
- import { fn } from "storybook/test";
5
- import { createChoiceConfig } from "../../stories/utils.js";
2
+ import { defineMeta } from '@storybook/addon-svelte-csf';
3
+ import ChoicePrompt from './ChoicePrompt.svelte';
4
+ import { fn } from 'storybook/test';
5
+ import { createChoiceConfig } from '../../stories/utils.js';
6
6
 
7
7
  const { Story } = defineMeta({
8
- title: "Interrupt/ChoicePrompt",
8
+ title: 'Interrupt/ChoicePrompt',
9
9
  component: ChoicePrompt,
10
- tags: ["autodocs"],
10
+ tags: ['autodocs'],
11
11
  args: {
12
12
  config: createChoiceConfig(),
13
13
  isResolved: false,
14
14
  isSubmitting: false,
15
- onSubmit: fn(),
16
- },
15
+ onSubmit: fn()
16
+ }
17
17
  });
18
18
  </script>
19
19
 
20
20
  <Story name="Single Select" />
21
21
 
22
- <Story name="Multi Select" args={{
23
- config: createChoiceConfig({
24
- message: "Select the features to enable:",
25
- multiple: true,
26
- options: [
27
- { value: "auth", label: "Authentication", description: "User login and signup" },
28
- { value: "analytics", label: "Analytics", description: "Usage tracking and metrics" },
29
- { value: "notifications", label: "Notifications", description: "Email and push alerts" },
30
- { value: "export", label: "Data Export", description: "CSV and JSON export" },
31
- ],
32
- }),
33
- }} />
22
+ <Story
23
+ name="Multi Select"
24
+ args={{
25
+ config: createChoiceConfig({
26
+ message: 'Select the features to enable:',
27
+ multiple: true,
28
+ options: [
29
+ { value: 'auth', label: 'Authentication', description: 'User login and signup' },
30
+ { value: 'analytics', label: 'Analytics', description: 'Usage tracking and metrics' },
31
+ { value: 'notifications', label: 'Notifications', description: 'Email and push alerts' },
32
+ { value: 'export', label: 'Data Export', description: 'CSV and JSON export' }
33
+ ]
34
+ })
35
+ }}
36
+ />
34
37
 
35
- <Story name="Resolved" args={{
36
- isResolved: true,
37
- resolvedValue: "high",
38
- resolvedByUserName: "Bob",
39
- }} />
38
+ <Story
39
+ name="Resolved"
40
+ args={{
41
+ isResolved: true,
42
+ resolvedValue: 'high',
43
+ resolvedByUserName: 'Bob'
44
+ }}
45
+ />
40
46
 
41
- <Story name="Submitting" args={{
42
- isSubmitting: true,
43
- }} />
47
+ <Story
48
+ name="Submitting"
49
+ args={{
50
+ isSubmitting: true
51
+ }}
52
+ />
@@ -11,7 +11,7 @@ declare const ChoicePrompt: $$__sveltets_2_IsomorphicComponent<{
11
11
  }, {
12
12
  [evt: string]: CustomEvent<any>;
13
13
  }, {}, {}, string>;
14
- import ChoicePrompt from "./ChoicePrompt.svelte";
14
+ import ChoicePrompt from './ChoicePrompt.svelte';
15
15
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
16
16
  new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
17
17
  $$bindings?: Bindings;
@@ -1,49 +1,71 @@
1
1
  <script module>
2
- import { defineMeta } from "@storybook/addon-svelte-csf";
3
- import ConfirmationPrompt from "./ConfirmationPrompt.svelte";
4
- import { fn } from "storybook/test";
5
- import { createConfirmationConfig } from "../../stories/utils.js";
2
+ import { defineMeta } from '@storybook/addon-svelte-csf';
3
+ import ConfirmationPrompt from './ConfirmationPrompt.svelte';
4
+ import { fn } from 'storybook/test';
5
+ import { createConfirmationConfig } from '../../stories/utils.js';
6
6
 
7
7
  const { Story } = defineMeta({
8
- title: "Interrupt/ConfirmationPrompt",
8
+ title: 'Interrupt/ConfirmationPrompt',
9
9
  component: ConfirmationPrompt,
10
- tags: ["autodocs"],
10
+ tags: ['autodocs'],
11
11
  args: {
12
12
  config: createConfirmationConfig(),
13
13
  isResolved: false,
14
14
  isSubmitting: false,
15
15
  onConfirm: fn(),
16
- onDecline: fn(),
17
- },
16
+ onDecline: fn()
17
+ }
18
18
  });
19
19
  </script>
20
20
 
21
21
  <Story name="Pending" />
22
22
 
23
- <Story name="Custom Labels" args={{
24
- config: createConfirmationConfig({ message: "Deploy to production?", confirmLabel: "Deploy", cancelLabel: "Abort" }),
25
- }} />
26
-
27
- <Story name="Confirmed" args={{
28
- isResolved: true,
29
- resolvedValue: true,
30
- }} />
31
-
32
- <Story name="Declined" args={{
33
- isResolved: true,
34
- resolvedValue: false,
35
- }} />
36
-
37
- <Story name="Submitting" args={{
38
- isSubmitting: true,
39
- }} />
40
-
41
- <Story name="With Error" args={{
42
- error: "Network error: Failed to submit response",
43
- }} />
44
-
45
- <Story name="Resolved By User" args={{
46
- isResolved: true,
47
- resolvedValue: true,
48
- resolvedByUserName: "Alice",
49
- }} />
23
+ <Story
24
+ name="Custom Labels"
25
+ args={{
26
+ config: createConfirmationConfig({
27
+ message: 'Deploy to production?',
28
+ confirmLabel: 'Deploy',
29
+ cancelLabel: 'Abort'
30
+ })
31
+ }}
32
+ />
33
+
34
+ <Story
35
+ name="Confirmed"
36
+ args={{
37
+ isResolved: true,
38
+ resolvedValue: true
39
+ }}
40
+ />
41
+
42
+ <Story
43
+ name="Declined"
44
+ args={{
45
+ isResolved: true,
46
+ resolvedValue: false
47
+ }}
48
+ />
49
+
50
+ <Story
51
+ name="Submitting"
52
+ args={{
53
+ isSubmitting: true
54
+ }}
55
+ />
56
+
57
+ <Story
58
+ name="With Error"
59
+ args={{
60
+ error: 'Network error: Failed to submit response'
61
+ }}
62
+ />
63
+
64
+ <Story
65
+ name="Resolved By User"
66
+ args={{
67
+ isResolved: true,
68
+ resolvedValue: true,
69
+ resolvedByUserName: 'Alice'
70
+ }}
71
+ />
@@ -11,7 +11,7 @@ declare const ConfirmationPrompt: $$__sveltets_2_IsomorphicComponent<{
11
11
  }, {
12
12
  [evt: string]: CustomEvent<any>;
13
13
  }, {}, {}, string>;
14
- import ConfirmationPrompt from "./ConfirmationPrompt.svelte";
14
+ import ConfirmationPrompt from './ConfirmationPrompt.svelte';
15
15
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
16
16
  new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
17
17
  $$bindings?: Bindings;
@@ -43,6 +43,7 @@
43
43
  }: Props = $props();
44
44
 
45
45
  /** Local state for form values */
46
+ // svelte-ignore state_referenced_locally — initial default, user fills the form
46
47
  let formValues = $state<Record<string, unknown>>(config.defaultValues ?? {});
47
48
 
48
49
  /** Display values - either resolved or current form values */
@@ -1,46 +1,67 @@
1
1
  <script module>
2
- import { defineMeta } from "@storybook/addon-svelte-csf";
3
- import ReviewPrompt from "./ReviewPrompt.svelte";
4
- import { fn } from "storybook/test";
5
- import { createReviewConfig } from "../../stories/utils.js";
2
+ import { defineMeta } from '@storybook/addon-svelte-csf';
3
+ import ReviewPrompt from './ReviewPrompt.svelte';
4
+ import { fn } from 'storybook/test';
5
+ import { createReviewConfig } from '../../stories/utils.js';
6
6
 
7
7
  const { Story } = defineMeta({
8
- title: "Interrupt/ReviewPrompt",
8
+ title: 'Interrupt/ReviewPrompt',
9
9
  component: ReviewPrompt,
10
- tags: ["autodocs"],
10
+ tags: ['autodocs'],
11
11
  args: {
12
12
  config: createReviewConfig(),
13
13
  isResolved: false,
14
14
  isSubmitting: false,
15
- onSubmit: fn(),
16
- },
15
+ onSubmit: fn()
16
+ }
17
17
  });
18
18
  </script>
19
19
 
20
20
  <Story name="Default" />
21
21
 
22
- <Story name="Many Changes" args={{
23
- config: createReviewConfig({
24
- message: "Review the content updates:",
25
- changes: [
26
- { field: "title", label: "Title", original: "Getting Started", proposed: "Quick Start Guide" },
27
- { field: "slug", label: "URL Slug", original: "/getting-started", proposed: "/quick-start-guide" },
28
- { field: "description", label: "Meta Description", original: "Learn how to get started", proposed: "A quick start guide for new users" },
29
- { field: "author", label: "Author", original: "admin", proposed: "editor" },
30
- { field: "status", label: "Status", original: "draft", proposed: "published" },
31
- ],
32
- }),
33
- }} />
22
+ <Story
23
+ name="Many Changes"
24
+ args={{
25
+ config: createReviewConfig({
26
+ message: 'Review the content updates:',
27
+ changes: [
28
+ {
29
+ field: 'title',
30
+ label: 'Title',
31
+ original: 'Getting Started',
32
+ proposed: 'Quick Start Guide'
33
+ },
34
+ {
35
+ field: 'slug',
36
+ label: 'URL Slug',
37
+ original: '/getting-started',
38
+ proposed: '/quick-start-guide'
39
+ },
40
+ {
41
+ field: 'description',
42
+ label: 'Meta Description',
43
+ original: 'Learn how to get started',
44
+ proposed: 'A quick start guide for new users'
45
+ },
46
+ { field: 'author', label: 'Author', original: 'admin', proposed: 'editor' },
47
+ { field: 'status', label: 'Status', original: 'draft', proposed: 'published' }
48
+ ]
49
+ })
50
+ }}
51
+ />
34
52
 
35
- <Story name="Resolved" args={{
36
- isResolved: true,
37
- resolvedValue: {
38
- decisions: {
39
- title: { accepted: true, value: "New Title" },
40
- description: { accepted: false, value: "Old description text" },
41
- status: { accepted: true, value: "published" },
53
+ <Story
54
+ name="Resolved"
55
+ args={{
56
+ isResolved: true,
57
+ resolvedValue: {
58
+ decisions: {
59
+ title: { accepted: true, value: 'New Title' },
60
+ description: { accepted: false, value: 'Old description text' },
61
+ status: { accepted: true, value: 'published' }
62
+ },
63
+ summary: { accepted: 2, rejected: 1, total: 3 }
42
64
  },
43
- summary: { accepted: 2, rejected: 1, total: 3 },
44
- },
45
- resolvedByUserName: "Diana",
46
- }} />
65
+ resolvedByUserName: 'Diana'
66
+ }}
67
+ />