@d34dman/flowdrop 0.0.43 → 0.0.45

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 (97) hide show
  1. package/README.md +8 -8
  2. package/dist/api/enhanced-client.d.ts +3 -1
  3. package/dist/api/enhanced-client.js +35 -5
  4. package/dist/components/App.svelte +68 -34
  5. package/dist/components/ConfigForm.svelte +169 -142
  6. package/dist/components/ConfigForm.svelte.d.ts +4 -2
  7. package/dist/components/ConfigPanel.svelte +42 -15
  8. package/dist/components/LogsSidebar.svelte +20 -19
  9. package/dist/components/Navbar.svelte +150 -80
  10. package/dist/components/Navbar.svelte.d.ts +8 -0
  11. package/dist/components/NodeSidebar.svelte +334 -217
  12. package/dist/components/PipelineStatus.svelte +6 -1
  13. package/dist/components/ReadOnlyDetails.svelte +14 -14
  14. package/dist/components/SchemaForm.svelte +49 -30
  15. package/dist/components/SchemaForm.svelte.d.ts +11 -1
  16. package/dist/components/SettingsModal.svelte +279 -0
  17. package/dist/components/SettingsModal.svelte.d.ts +23 -0
  18. package/dist/components/SettingsPanel.svelte +615 -0
  19. package/dist/components/SettingsPanel.svelte.d.ts +21 -0
  20. package/dist/components/ThemeToggle.svelte +186 -0
  21. package/dist/components/ThemeToggle.svelte.d.ts +14 -0
  22. package/dist/components/WorkflowEditor.svelte +114 -38
  23. package/dist/components/form/FormArray.svelte +81 -81
  24. package/dist/components/form/FormAutocomplete.svelte +1014 -0
  25. package/dist/components/form/FormAutocomplete.svelte.d.ts +25 -0
  26. package/dist/components/form/FormCheckboxGroup.svelte +16 -16
  27. package/dist/components/form/FormCodeEditor.svelte +26 -26
  28. package/dist/components/form/FormField.svelte +52 -21
  29. package/dist/components/form/FormFieldLight.svelte +19 -19
  30. package/dist/components/form/FormFieldWrapper.svelte +4 -4
  31. package/dist/components/form/FormMarkdownEditor.svelte +124 -57
  32. package/dist/components/form/FormNumberField.svelte +13 -13
  33. package/dist/components/form/FormRangeField.svelte +16 -16
  34. package/dist/components/form/FormSelect.svelte +15 -15
  35. package/dist/components/form/FormTemplateEditor.svelte +34 -34
  36. package/dist/components/form/FormTextField.svelte +13 -13
  37. package/dist/components/form/FormTextarea.svelte +13 -13
  38. package/dist/components/form/FormToggle.svelte +8 -8
  39. package/dist/components/form/index.d.ts +1 -0
  40. package/dist/components/form/index.js +1 -0
  41. package/dist/components/form/types.d.ts +133 -8
  42. package/dist/components/form/types.js +50 -1
  43. package/dist/components/interrupt/ChoicePrompt.svelte +45 -38
  44. package/dist/components/interrupt/ConfirmationPrompt.svelte +35 -35
  45. package/dist/components/interrupt/FormPrompt.svelte +27 -20
  46. package/dist/components/interrupt/InterruptBubble.svelte +50 -50
  47. package/dist/components/interrupt/TextInputPrompt.svelte +39 -32
  48. package/dist/components/layouts/MainLayout.svelte +233 -34
  49. package/dist/components/layouts/MainLayout.svelte.d.ts +12 -0
  50. package/dist/components/nodes/GatewayNode.svelte +175 -125
  51. package/dist/components/nodes/IdeaNode.svelte +70 -84
  52. package/dist/components/nodes/NotesNode.svelte +124 -88
  53. package/dist/components/nodes/SimpleNode.svelte +91 -69
  54. package/dist/components/nodes/SquareNode.svelte +102 -75
  55. package/dist/components/nodes/TerminalNode.svelte +127 -113
  56. package/dist/components/nodes/ToolNode.svelte +125 -76
  57. package/dist/components/nodes/WorkflowNode.svelte +164 -108
  58. package/dist/components/playground/ChatPanel.svelte +76 -76
  59. package/dist/components/playground/ExecutionLogs.svelte +71 -69
  60. package/dist/components/playground/InputCollector.svelte +59 -59
  61. package/dist/components/playground/MessageBubble.svelte +111 -112
  62. package/dist/components/playground/Playground.svelte +184 -138
  63. package/dist/components/playground/PlaygroundModal.svelte +18 -19
  64. package/dist/components/playground/SessionManager.svelte +68 -67
  65. package/dist/config/defaultPortConfig.js +22 -22
  66. package/dist/core/index.d.ts +2 -0
  67. package/dist/core/index.js +1 -0
  68. package/dist/form/fieldRegistry.d.ts +17 -1
  69. package/dist/form/fieldRegistry.js +18 -2
  70. package/dist/form/index.d.ts +20 -2
  71. package/dist/form/index.js +19 -1
  72. package/dist/helpers/nodeLayoutHelper.d.ts +14 -0
  73. package/dist/helpers/nodeLayoutHelper.js +19 -0
  74. package/dist/helpers/workflowEditorHelper.js +23 -11
  75. package/dist/index.d.ts +5 -0
  76. package/dist/index.js +13 -0
  77. package/dist/services/autoSaveService.d.ts +112 -0
  78. package/dist/services/autoSaveService.js +223 -0
  79. package/dist/services/settingsService.d.ts +92 -0
  80. package/dist/services/settingsService.js +202 -0
  81. package/dist/services/toastService.d.ts +9 -0
  82. package/dist/services/toastService.js +30 -1
  83. package/dist/stores/settingsStore.d.ts +128 -0
  84. package/dist/stores/settingsStore.js +488 -0
  85. package/dist/stores/themeStore.d.ts +68 -0
  86. package/dist/stores/themeStore.js +215 -0
  87. package/dist/styles/base.css +338 -621
  88. package/dist/styles/toast.css +33 -0
  89. package/dist/styles/tokens.css +402 -0
  90. package/dist/types/index.d.ts +78 -0
  91. package/dist/types/index.js +2 -0
  92. package/dist/types/playground.d.ts +12 -0
  93. package/dist/types/settings.d.ts +185 -0
  94. package/dist/types/settings.js +101 -0
  95. package/dist/utils/colors.d.ts +100 -7
  96. package/dist/utils/colors.js +228 -67
  97. package/package.json +2 -2
@@ -0,0 +1,202 @@
1
+ /**
2
+ * Settings Service for FlowDrop
3
+ *
4
+ * Provides API operations for user preferences/settings using the
5
+ * configurable endpoint system. Integrates with settingsStore for
6
+ * hybrid localStorage + API persistence.
7
+ *
8
+ * @module services/settingsService
9
+ */
10
+ import { buildEndpointUrl, getEndpointHeaders } from "../config/endpoints.js";
11
+ // =========================================================================
12
+ // Configuration
13
+ // =========================================================================
14
+ /**
15
+ * Endpoint configuration reference
16
+ */
17
+ let endpointConfig = null;
18
+ /**
19
+ * Set the endpoint configuration for settings API calls
20
+ *
21
+ * @param config - Endpoint configuration
22
+ */
23
+ export function setSettingsEndpointConfig(config) {
24
+ endpointConfig = config;
25
+ }
26
+ /**
27
+ * Get the current endpoint configuration
28
+ *
29
+ * @returns Current endpoint configuration or null
30
+ */
31
+ export function getSettingsEndpointConfig() {
32
+ return endpointConfig;
33
+ }
34
+ // =========================================================================
35
+ // API Request Helper
36
+ // =========================================================================
37
+ /**
38
+ * Make an API request for settings operations
39
+ *
40
+ * @param endpointKey - Key for headers lookup
41
+ * @param endpointPath - Path to the endpoint
42
+ * @param options - Additional fetch options
43
+ * @returns Parsed response data
44
+ */
45
+ async function settingsRequest(endpointKey, endpointPath, options = {}) {
46
+ if (!endpointConfig) {
47
+ throw new Error("Endpoint configuration not set. Call setSettingsEndpointConfig() first.");
48
+ }
49
+ const url = buildEndpointUrl(endpointConfig, endpointPath);
50
+ const headers = getEndpointHeaders(endpointConfig, endpointKey);
51
+ const response = await fetch(url, {
52
+ headers,
53
+ ...options
54
+ });
55
+ // Check if response is JSON
56
+ const contentType = response.headers.get("content-type");
57
+ const isJson = contentType?.includes("application/json");
58
+ if (!response.ok) {
59
+ let errorMessage = `HTTP ${response.status}: ${response.statusText}`;
60
+ if (isJson) {
61
+ try {
62
+ const data = (await response.json());
63
+ errorMessage = data.error ?? data.message ?? errorMessage;
64
+ }
65
+ catch {
66
+ // Failed to parse JSON, use default error message
67
+ }
68
+ }
69
+ throw new Error(errorMessage);
70
+ }
71
+ // Parse successful response
72
+ const data = (await response.json());
73
+ return data;
74
+ }
75
+ // =========================================================================
76
+ // Settings API Methods
77
+ // =========================================================================
78
+ /**
79
+ * Settings API namespace
80
+ */
81
+ export const settingsApi = {
82
+ /**
83
+ * Get user preferences from the backend
84
+ *
85
+ * @returns User's saved preferences
86
+ */
87
+ async getPreferences() {
88
+ if (!endpointConfig) {
89
+ throw new Error("Endpoint configuration not set");
90
+ }
91
+ const response = await settingsRequest("users.preferences", endpointConfig.endpoints.users.preferences, { method: "GET" });
92
+ if (!response.success || !response.data) {
93
+ throw new Error(typeof response.error === "string"
94
+ ? response.error
95
+ : "Failed to fetch user preferences");
96
+ }
97
+ return response.data;
98
+ },
99
+ /**
100
+ * Save user preferences to the backend
101
+ *
102
+ * @param settings - Complete settings to save
103
+ */
104
+ async savePreferences(settings) {
105
+ if (!endpointConfig) {
106
+ throw new Error("Endpoint configuration not set");
107
+ }
108
+ const response = await settingsRequest("users.preferences", endpointConfig.endpoints.users.preferences, {
109
+ method: "PUT",
110
+ body: JSON.stringify(settings)
111
+ });
112
+ if (!response.success) {
113
+ throw new Error(typeof response.error === "string"
114
+ ? response.error
115
+ : "Failed to save user preferences");
116
+ }
117
+ },
118
+ /**
119
+ * Partially update user preferences
120
+ *
121
+ * @param partial - Partial settings to merge
122
+ */
123
+ async patchPreferences(partial) {
124
+ if (!endpointConfig) {
125
+ throw new Error("Endpoint configuration not set");
126
+ }
127
+ const response = await settingsRequest("users.preferences", endpointConfig.endpoints.users.preferences, {
128
+ method: "PATCH",
129
+ body: JSON.stringify(partial)
130
+ });
131
+ if (!response.success || !response.data) {
132
+ throw new Error(typeof response.error === "string"
133
+ ? response.error
134
+ : "Failed to update user preferences");
135
+ }
136
+ return response.data;
137
+ }
138
+ };
139
+ // =========================================================================
140
+ // Settings Service Class (for settingsStore integration)
141
+ // =========================================================================
142
+ /**
143
+ * Settings service class for integration with settingsStore
144
+ *
145
+ * @example
146
+ * ```typescript
147
+ * import { SettingsService } from "@d34dman/flowdrop";
148
+ * import { setSettingsService } from "@d34dman/flowdrop";
149
+ *
150
+ * const service = new SettingsService(endpointConfig);
151
+ * setSettingsService(service);
152
+ * ```
153
+ */
154
+ export class SettingsService {
155
+ config;
156
+ /**
157
+ * Create a new settings service instance
158
+ *
159
+ * @param config - Endpoint configuration
160
+ */
161
+ constructor(config) {
162
+ this.config = config;
163
+ // Also set the module-level config
164
+ setSettingsEndpointConfig(config);
165
+ }
166
+ /**
167
+ * Get user preferences from the backend
168
+ *
169
+ * @returns User's saved preferences
170
+ */
171
+ async getPreferences() {
172
+ return settingsApi.getPreferences();
173
+ }
174
+ /**
175
+ * Save user preferences to the backend
176
+ *
177
+ * @param settings - Complete settings to save
178
+ */
179
+ async savePreferences(settings) {
180
+ return settingsApi.savePreferences(settings);
181
+ }
182
+ /**
183
+ * Partially update user preferences
184
+ *
185
+ * @param partial - Partial settings to merge
186
+ */
187
+ async patchPreferences(partial) {
188
+ return settingsApi.patchPreferences(partial);
189
+ }
190
+ }
191
+ // =========================================================================
192
+ // Factory Function
193
+ // =========================================================================
194
+ /**
195
+ * Create a settings service instance
196
+ *
197
+ * @param config - Endpoint configuration
198
+ * @returns SettingsService instance
199
+ */
200
+ export function createSettingsService(config) {
201
+ return new SettingsService(config);
202
+ }
@@ -3,6 +3,15 @@
3
3
  * Centralized toast notification service using svelte-french-toast
4
4
  * Provides consistent toast notifications across the FlowDrop application
5
5
  */
6
+ import { type DefaultToastOptions } from "svelte-5-french-toast";
7
+ /**
8
+ * Default toast options themed with FlowDrop design tokens.
9
+ * Use with <Toaster toastOptions={flowdropToastOptions} containerClassName="flowdrop-toaster" />
10
+ * and import '@d34dman/flowdrop/styles/toast.css' (or app toast.css) so toast bar styles apply.
11
+ */
12
+ export declare const flowdropToastOptions: DefaultToastOptions;
13
+ /** Container class for FlowDrop-themed Toaster (used with toast.css). */
14
+ export declare const FLOWDROP_TOASTER_CLASS = "flowdrop-toaster";
6
15
  /**
7
16
  * Toast notification types
8
17
  */
@@ -3,7 +3,36 @@
3
3
  * Centralized toast notification service using svelte-french-toast
4
4
  * Provides consistent toast notifications across the FlowDrop application
5
5
  */
6
- import { toast } from 'svelte-5-french-toast';
6
+ import { toast } from "svelte-5-french-toast";
7
+ /**
8
+ * Default toast options themed with FlowDrop design tokens.
9
+ * Use with <Toaster toastOptions={flowdropToastOptions} containerClassName="flowdrop-toaster" />
10
+ * and import '@d34dman/flowdrop/styles/toast.css' (or app toast.css) so toast bar styles apply.
11
+ */
12
+ export const flowdropToastOptions = {
13
+ className: "flowdrop-toast-bar",
14
+ style: "",
15
+ success: {
16
+ iconTheme: {
17
+ primary: "var(--fd-success)",
18
+ secondary: "var(--fd-success-foreground)"
19
+ }
20
+ },
21
+ error: {
22
+ iconTheme: {
23
+ primary: "var(--fd-error)",
24
+ secondary: "var(--fd-error-foreground)"
25
+ }
26
+ },
27
+ loading: {
28
+ iconTheme: {
29
+ primary: "var(--fd-primary)",
30
+ secondary: "var(--fd-primary-muted)"
31
+ }
32
+ }
33
+ };
34
+ /** Container class for FlowDrop-themed Toaster (used with toast.css). */
35
+ export const FLOWDROP_TOASTER_CLASS = "flowdrop-toaster";
7
36
  /**
8
37
  * Show a success toast notification
9
38
  */
@@ -0,0 +1,128 @@
1
+ /**
2
+ * Settings Store for FlowDrop
3
+ *
4
+ * Provides unified state management for all user-configurable settings with:
5
+ * - Hybrid persistence (localStorage primary, optional API sync)
6
+ * - Category-specific derived stores for performance
7
+ * - Deep merge support for partial updates
8
+ * - Theme system compatibility (backward compatible with themeStore)
9
+ *
10
+ * @module stores/settingsStore
11
+ */
12
+ import type { FlowDropSettings, ThemeSettings, EditorSettings, UISettings, BehaviorSettings, ApiSettings, PartialSettings, SyncStatus, ResolvedTheme, ThemePreference, SettingsChangeCallback, SettingsCategory } from "../types/settings.js";
13
+ /**
14
+ * Main settings store (read-only access to current settings)
15
+ */
16
+ export declare const settingsStore: import("svelte/store").Readable<FlowDropSettings>;
17
+ /**
18
+ * Sync status store for UI indicators
19
+ */
20
+ export declare const syncStatusStore: import("svelte/store").Readable<{
21
+ status: SyncStatus;
22
+ lastSyncedAt: number;
23
+ error: string;
24
+ }>;
25
+ /**
26
+ * Theme settings store
27
+ */
28
+ export declare const themeSettings: import("svelte/store").Readable<ThemeSettings>;
29
+ /**
30
+ * Editor settings store
31
+ */
32
+ export declare const editorSettings: import("svelte/store").Readable<EditorSettings>;
33
+ /**
34
+ * UI settings store
35
+ */
36
+ export declare const uiSettings: import("svelte/store").Readable<UISettings>;
37
+ /**
38
+ * Behavior settings store
39
+ */
40
+ export declare const behaviorSettings: import("svelte/store").Readable<BehaviorSettings>;
41
+ /**
42
+ * API settings store
43
+ */
44
+ export declare const apiSettings: import("svelte/store").Readable<ApiSettings>;
45
+ /**
46
+ * Theme preference store (backward compatible with themeStore)
47
+ */
48
+ export declare const theme: import("svelte/store").Readable<ThemePreference>;
49
+ /**
50
+ * Resolved theme store
51
+ * Always returns the actual theme being applied ('light' or 'dark')
52
+ */
53
+ export declare const resolvedTheme: import("svelte/store").Readable<ResolvedTheme>;
54
+ /**
55
+ * Update settings with partial values
56
+ *
57
+ * @param partial - Partial settings to merge
58
+ */
59
+ export declare function updateSettings(partial: PartialSettings): void;
60
+ /**
61
+ * Reset settings to defaults
62
+ *
63
+ * @param categories - Optional categories to reset (all if not specified)
64
+ */
65
+ export declare function resetSettings(categories?: SettingsCategory[]): void;
66
+ /**
67
+ * Get current settings synchronously
68
+ */
69
+ export declare function getSettings(): FlowDropSettings;
70
+ /**
71
+ * Set the theme preference
72
+ *
73
+ * @param newTheme - The new theme preference ('light', 'dark', or 'auto')
74
+ */
75
+ export declare function setTheme(newTheme: ThemePreference): void;
76
+ /**
77
+ * Toggle between light and dark themes
78
+ * If currently 'auto', switches to the opposite of system preference
79
+ */
80
+ export declare function toggleTheme(): void;
81
+ /**
82
+ * Cycle through theme options: light -> dark -> auto -> light
83
+ */
84
+ export declare function cycleTheme(): void;
85
+ /**
86
+ * Initialize the theme system
87
+ * Should be called once on app startup
88
+ */
89
+ export declare function initializeTheme(): void;
90
+ /**
91
+ * Set the settings service for API operations
92
+ *
93
+ * @param service - Settings service instance
94
+ */
95
+ export declare function setSettingsService(service: {
96
+ savePreferences: (settings: FlowDropSettings) => Promise<void>;
97
+ getPreferences: () => Promise<FlowDropSettings>;
98
+ } | null): void;
99
+ /**
100
+ * Sync current settings to the backend API
101
+ *
102
+ * @returns Promise that resolves when sync is complete
103
+ */
104
+ export declare function syncSettingsToApi(): Promise<void>;
105
+ /**
106
+ * Load settings from the backend API
107
+ *
108
+ * @returns Promise that resolves when load is complete
109
+ */
110
+ export declare function loadSettingsFromApi(): Promise<void>;
111
+ /**
112
+ * Subscribe to settings changes
113
+ *
114
+ * @param callback - Function to call when settings change
115
+ * @returns Unsubscribe function
116
+ */
117
+ export declare function onSettingsChange(callback: SettingsChangeCallback): () => void;
118
+ /**
119
+ * Initialize the settings system
120
+ *
121
+ * @param options - Initialization options
122
+ */
123
+ export declare function initializeSettings(options?: {
124
+ /** Custom default settings to merge */
125
+ defaults?: PartialSettings;
126
+ /** Enable API sync on initialization */
127
+ apiSync?: boolean;
128
+ }): Promise<void>;