dialkit 1.2.1 → 1.3.0

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 (55) hide show
  1. package/README.md +220 -3
  2. package/dist/dropdown-position.d.ts +15 -0
  3. package/dist/dropdown-position.js +22 -0
  4. package/dist/dropdown-position.js.map +1 -0
  5. package/dist/index.cjs +697 -307
  6. package/dist/index.cjs.map +1 -1
  7. package/dist/index.d.cts +42 -5
  8. package/dist/index.d.ts +42 -5
  9. package/dist/index.js +720 -331
  10. package/dist/index.js.map +1 -1
  11. package/dist/panel-drag.d.ts +19 -0
  12. package/dist/panel-drag.js +72 -0
  13. package/dist/panel-drag.js.map +1 -0
  14. package/dist/solid/index.cjs +661 -204
  15. package/dist/solid/index.cjs.map +1 -1
  16. package/dist/solid/index.d.cts +40 -3
  17. package/dist/solid/index.d.ts +40 -3
  18. package/dist/solid/index.js +646 -190
  19. package/dist/solid/index.js.map +1 -1
  20. package/dist/store/index.cjs +272 -41
  21. package/dist/store/index.cjs.map +1 -1
  22. package/dist/store/index.d.cts +30 -3
  23. package/dist/store/index.d.ts +30 -3
  24. package/dist/store/index.js +269 -40
  25. package/dist/store/index.js.map +1 -1
  26. package/dist/styles.css +105 -7
  27. package/dist/svelte/components/DialRoot.svelte +176 -11
  28. package/dist/svelte/components/DialRoot.svelte.d.ts +1 -0
  29. package/dist/svelte/components/DialRoot.svelte.d.ts.map +1 -1
  30. package/dist/svelte/components/Folder.svelte +24 -13
  31. package/dist/svelte/components/Folder.svelte.d.ts +1 -0
  32. package/dist/svelte/components/Folder.svelte.d.ts.map +1 -1
  33. package/dist/svelte/components/Panel.svelte +98 -71
  34. package/dist/svelte/components/Panel.svelte.d.ts +2 -0
  35. package/dist/svelte/components/Panel.svelte.d.ts.map +1 -1
  36. package/dist/svelte/components/PresetManager.svelte +5 -5
  37. package/dist/svelte/components/PresetManager.svelte.d.ts.map +1 -1
  38. package/dist/svelte/components/SelectControl.svelte +6 -14
  39. package/dist/svelte/components/SelectControl.svelte.d.ts.map +1 -1
  40. package/dist/svelte/createDialKit.svelte.d.ts +11 -1
  41. package/dist/svelte/createDialKit.svelte.d.ts.map +1 -1
  42. package/dist/svelte/createDialKit.svelte.js +61 -34
  43. package/dist/svelte/index.d.ts +3 -3
  44. package/dist/svelte/index.d.ts.map +1 -1
  45. package/dist/svelte/index.js +1 -1
  46. package/dist/svelte/theme-css.d.ts +1 -1
  47. package/dist/svelte/theme-css.d.ts.map +1 -1
  48. package/dist/svelte/theme-css.js +105 -7
  49. package/dist/vue/index.cjs +573 -132
  50. package/dist/vue/index.cjs.map +1 -1
  51. package/dist/vue/index.d.cts +53 -6
  52. package/dist/vue/index.d.ts +53 -6
  53. package/dist/vue/index.js +573 -133
  54. package/dist/vue/index.js.map +1 -1
  55. package/package.json +2 -2
package/dist/index.d.cts CHANGED
@@ -43,6 +43,9 @@ type DialConfig = {
43
43
  type ResolvedValues<T extends DialConfig> = {
44
44
  [K in keyof T]: T[K] extends [number, number, number, number?] ? number : T[K] extends SpringConfig ? TransitionConfig : T[K] extends EasingConfig ? TransitionConfig : T[K] extends SelectConfig ? string : T[K] extends ColorConfig ? string : T[K] extends TextConfig ? string : T[K] extends DialConfig ? ResolvedValues<T[K]> : T[K];
45
45
  };
46
+ type DialKitValueUpdates<T extends DialConfig> = {
47
+ [K in keyof T as K extends '_collapsed' ? never : K]?: T[K] extends [number, number, number, number?] ? number : T[K] extends SpringConfig | EasingConfig ? TransitionConfig : T[K] extends ActionConfig ? never : T[K] extends SelectConfig | ColorConfig | TextConfig ? string : T[K] extends DialConfig ? DialKitValueUpdates<T[K]> : T[K];
48
+ };
46
49
  type ShortcutMode = 'fine' | 'normal' | 'coarse';
47
50
  type ShortcutInteraction = 'scroll' | 'drag' | 'move' | 'scroll-only';
48
51
  type ShortcutConfig = {
@@ -81,6 +84,15 @@ type Preset = {
81
84
  name: string;
82
85
  values: Record<string, DialValue>;
83
86
  };
87
+ type DialKitPersistOptions = boolean | {
88
+ key?: string;
89
+ storage?: 'localStorage' | 'sessionStorage';
90
+ presets?: boolean;
91
+ };
92
+ type DialStorePanelOptions = {
93
+ retainOnUnmount?: boolean;
94
+ persist?: DialKitPersistOptions;
95
+ };
84
96
  declare class DialStoreClass {
85
97
  private panels;
86
98
  private listeners;
@@ -90,10 +102,16 @@ declare class DialStoreClass {
90
102
  private presets;
91
103
  private activePreset;
92
104
  private baseValues;
93
- registerPanel(id: string, name: string, config: DialConfig, shortcuts?: Record<string, ShortcutConfig>): void;
94
- updatePanel(id: string, name: string, config: DialConfig, shortcuts?: Record<string, ShortcutConfig>): void;
105
+ private defaultValues;
106
+ private registrationCounts;
107
+ private retainedPanels;
108
+ private persistConfigs;
109
+ registerPanel(id: string, name: string, config: DialConfig, shortcuts?: Record<string, ShortcutConfig>, options?: DialStorePanelOptions): void;
110
+ updatePanel(id: string, name: string, config: DialConfig, shortcuts?: Record<string, ShortcutConfig>, options?: DialStorePanelOptions): void;
95
111
  unregisterPanel(id: string): void;
96
112
  updateValue(panelId: string, path: string, value: DialValue): void;
113
+ updateValues(panelId: string, updates: Record<string, DialValue>): void;
114
+ resetValues(panelId: string): void;
97
115
  updateSpringMode(panelId: string, path: string, mode: 'simple' | 'advanced'): void;
98
116
  getSpringMode(panelId: string, path: string): 'simple' | 'advanced';
99
117
  updateTransitionMode(panelId: string, path: string, mode: 'easing' | 'simple' | 'advanced'): void;
@@ -123,6 +141,13 @@ declare class DialStoreClass {
123
141
  control: ControlMeta;
124
142
  shortcut: ShortcutConfig;
125
143
  }>;
144
+ private configurePanelRetention;
145
+ private reconcileValues;
146
+ private reconcilePresets;
147
+ private normalizePersistConfig;
148
+ private loadPersistedPanel;
149
+ private persistPanel;
150
+ private getStorage;
126
151
  private findControlByPath;
127
152
  private notify;
128
153
  private notifyGlobal;
@@ -147,10 +172,20 @@ declare class DialStoreClass {
147
172
  declare const DialStore: DialStoreClass;
148
173
 
149
174
  interface UseDialOptions {
175
+ id?: string;
176
+ persist?: DialKitPersistOptions;
150
177
  onAction?: (action: string) => void;
151
178
  shortcuts?: Record<string, ShortcutConfig>;
152
179
  }
180
+ interface DialKitController<T extends DialConfig> {
181
+ values: ResolvedValues<T>;
182
+ setValue: (path: string, value: DialValue) => void;
183
+ setValues: (values: DialKitValueUpdates<T>) => void;
184
+ resetValues: () => void;
185
+ getValues: () => ResolvedValues<T>;
186
+ }
153
187
  declare function useDialKit<T extends DialConfig>(name: string, config: T, options?: UseDialOptions): ResolvedValues<T>;
188
+ declare function useDialKitController<T extends DialConfig>(name: string, config: T, options?: UseDialOptions): DialKitController<T>;
154
189
 
155
190
  type DialPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
156
191
  type DialMode = 'popover' | 'inline';
@@ -161,8 +196,9 @@ interface DialRootProps {
161
196
  mode?: DialMode;
162
197
  theme?: DialTheme;
163
198
  productionEnabled?: boolean;
199
+ onOpenChange?: (open: boolean) => void;
164
200
  }
165
- declare function DialRoot({ position, defaultOpen, mode, theme, productionEnabled }: DialRootProps): react_jsx_runtime.JSX.Element | null;
201
+ declare function DialRoot({ position, defaultOpen, mode, theme, productionEnabled, onOpenChange }: DialRootProps): react_jsx_runtime.JSX.Element | null;
166
202
 
167
203
  interface SliderProps {
168
204
  label: string;
@@ -194,8 +230,9 @@ interface FolderProps {
194
230
  inline?: boolean;
195
231
  onOpenChange?: (isOpen: boolean) => void;
196
232
  toolbar?: ReactNode;
233
+ panelHeightOffset?: number;
197
234
  }
198
- declare function Folder({ title, children, defaultOpen, isRoot, inline, onOpenChange, toolbar }: FolderProps): react_jsx_runtime.JSX.Element;
235
+ declare function Folder({ title, children, defaultOpen, isRoot, inline, onOpenChange, toolbar, panelHeightOffset }: FolderProps): react_jsx_runtime.JSX.Element;
199
236
 
200
237
  interface ButtonGroupProps {
201
238
  buttons: Array<{
@@ -274,4 +311,4 @@ interface ShortcutsMenuProps {
274
311
  }
275
312
  declare function ShortcutsMenu({ panelId }: ShortcutsMenuProps): react_jsx_runtime.JSX.Element | null;
276
313
 
277
- export { type ActionConfig, ButtonGroup, type ColorConfig, ColorControl, type ControlMeta, type DialConfig, type DialMode, type DialPosition, DialRoot, DialStore, type DialTheme, type DialValue, type EasingConfig, EasingVisualization, Folder, type PanelConfig, type Preset, PresetManager, type ResolvedValues, type SelectConfig, SelectControl, type ShortcutConfig, type ShortcutInteraction, type ShortcutMode, ShortcutsMenu, Slider, type SpringConfig, SpringControl, SpringVisualization, type TextConfig, TextControl, Toggle, type TransitionConfig, TransitionControl, type UseDialOptions, useDialKit };
314
+ export { type ActionConfig, ButtonGroup, type ColorConfig, ColorControl, type ControlMeta, type DialConfig, type DialKitController, type DialKitPersistOptions, type DialKitValueUpdates, type DialMode, type DialPosition, DialRoot, DialStore, type DialTheme, type DialValue, type EasingConfig, EasingVisualization, Folder, type PanelConfig, type Preset, PresetManager, type ResolvedValues, type SelectConfig, SelectControl, type ShortcutConfig, type ShortcutInteraction, type ShortcutMode, ShortcutsMenu, Slider, type SpringConfig, SpringControl, SpringVisualization, type TextConfig, TextControl, Toggle, type TransitionConfig, TransitionControl, type UseDialOptions, useDialKit, useDialKitController };
package/dist/index.d.ts CHANGED
@@ -43,6 +43,9 @@ type DialConfig = {
43
43
  type ResolvedValues<T extends DialConfig> = {
44
44
  [K in keyof T]: T[K] extends [number, number, number, number?] ? number : T[K] extends SpringConfig ? TransitionConfig : T[K] extends EasingConfig ? TransitionConfig : T[K] extends SelectConfig ? string : T[K] extends ColorConfig ? string : T[K] extends TextConfig ? string : T[K] extends DialConfig ? ResolvedValues<T[K]> : T[K];
45
45
  };
46
+ type DialKitValueUpdates<T extends DialConfig> = {
47
+ [K in keyof T as K extends '_collapsed' ? never : K]?: T[K] extends [number, number, number, number?] ? number : T[K] extends SpringConfig | EasingConfig ? TransitionConfig : T[K] extends ActionConfig ? never : T[K] extends SelectConfig | ColorConfig | TextConfig ? string : T[K] extends DialConfig ? DialKitValueUpdates<T[K]> : T[K];
48
+ };
46
49
  type ShortcutMode = 'fine' | 'normal' | 'coarse';
47
50
  type ShortcutInteraction = 'scroll' | 'drag' | 'move' | 'scroll-only';
48
51
  type ShortcutConfig = {
@@ -81,6 +84,15 @@ type Preset = {
81
84
  name: string;
82
85
  values: Record<string, DialValue>;
83
86
  };
87
+ type DialKitPersistOptions = boolean | {
88
+ key?: string;
89
+ storage?: 'localStorage' | 'sessionStorage';
90
+ presets?: boolean;
91
+ };
92
+ type DialStorePanelOptions = {
93
+ retainOnUnmount?: boolean;
94
+ persist?: DialKitPersistOptions;
95
+ };
84
96
  declare class DialStoreClass {
85
97
  private panels;
86
98
  private listeners;
@@ -90,10 +102,16 @@ declare class DialStoreClass {
90
102
  private presets;
91
103
  private activePreset;
92
104
  private baseValues;
93
- registerPanel(id: string, name: string, config: DialConfig, shortcuts?: Record<string, ShortcutConfig>): void;
94
- updatePanel(id: string, name: string, config: DialConfig, shortcuts?: Record<string, ShortcutConfig>): void;
105
+ private defaultValues;
106
+ private registrationCounts;
107
+ private retainedPanels;
108
+ private persistConfigs;
109
+ registerPanel(id: string, name: string, config: DialConfig, shortcuts?: Record<string, ShortcutConfig>, options?: DialStorePanelOptions): void;
110
+ updatePanel(id: string, name: string, config: DialConfig, shortcuts?: Record<string, ShortcutConfig>, options?: DialStorePanelOptions): void;
95
111
  unregisterPanel(id: string): void;
96
112
  updateValue(panelId: string, path: string, value: DialValue): void;
113
+ updateValues(panelId: string, updates: Record<string, DialValue>): void;
114
+ resetValues(panelId: string): void;
97
115
  updateSpringMode(panelId: string, path: string, mode: 'simple' | 'advanced'): void;
98
116
  getSpringMode(panelId: string, path: string): 'simple' | 'advanced';
99
117
  updateTransitionMode(panelId: string, path: string, mode: 'easing' | 'simple' | 'advanced'): void;
@@ -123,6 +141,13 @@ declare class DialStoreClass {
123
141
  control: ControlMeta;
124
142
  shortcut: ShortcutConfig;
125
143
  }>;
144
+ private configurePanelRetention;
145
+ private reconcileValues;
146
+ private reconcilePresets;
147
+ private normalizePersistConfig;
148
+ private loadPersistedPanel;
149
+ private persistPanel;
150
+ private getStorage;
126
151
  private findControlByPath;
127
152
  private notify;
128
153
  private notifyGlobal;
@@ -147,10 +172,20 @@ declare class DialStoreClass {
147
172
  declare const DialStore: DialStoreClass;
148
173
 
149
174
  interface UseDialOptions {
175
+ id?: string;
176
+ persist?: DialKitPersistOptions;
150
177
  onAction?: (action: string) => void;
151
178
  shortcuts?: Record<string, ShortcutConfig>;
152
179
  }
180
+ interface DialKitController<T extends DialConfig> {
181
+ values: ResolvedValues<T>;
182
+ setValue: (path: string, value: DialValue) => void;
183
+ setValues: (values: DialKitValueUpdates<T>) => void;
184
+ resetValues: () => void;
185
+ getValues: () => ResolvedValues<T>;
186
+ }
153
187
  declare function useDialKit<T extends DialConfig>(name: string, config: T, options?: UseDialOptions): ResolvedValues<T>;
188
+ declare function useDialKitController<T extends DialConfig>(name: string, config: T, options?: UseDialOptions): DialKitController<T>;
154
189
 
155
190
  type DialPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
156
191
  type DialMode = 'popover' | 'inline';
@@ -161,8 +196,9 @@ interface DialRootProps {
161
196
  mode?: DialMode;
162
197
  theme?: DialTheme;
163
198
  productionEnabled?: boolean;
199
+ onOpenChange?: (open: boolean) => void;
164
200
  }
165
- declare function DialRoot({ position, defaultOpen, mode, theme, productionEnabled }: DialRootProps): react_jsx_runtime.JSX.Element | null;
201
+ declare function DialRoot({ position, defaultOpen, mode, theme, productionEnabled, onOpenChange }: DialRootProps): react_jsx_runtime.JSX.Element | null;
166
202
 
167
203
  interface SliderProps {
168
204
  label: string;
@@ -194,8 +230,9 @@ interface FolderProps {
194
230
  inline?: boolean;
195
231
  onOpenChange?: (isOpen: boolean) => void;
196
232
  toolbar?: ReactNode;
233
+ panelHeightOffset?: number;
197
234
  }
198
- declare function Folder({ title, children, defaultOpen, isRoot, inline, onOpenChange, toolbar }: FolderProps): react_jsx_runtime.JSX.Element;
235
+ declare function Folder({ title, children, defaultOpen, isRoot, inline, onOpenChange, toolbar, panelHeightOffset }: FolderProps): react_jsx_runtime.JSX.Element;
199
236
 
200
237
  interface ButtonGroupProps {
201
238
  buttons: Array<{
@@ -274,4 +311,4 @@ interface ShortcutsMenuProps {
274
311
  }
275
312
  declare function ShortcutsMenu({ panelId }: ShortcutsMenuProps): react_jsx_runtime.JSX.Element | null;
276
313
 
277
- export { type ActionConfig, ButtonGroup, type ColorConfig, ColorControl, type ControlMeta, type DialConfig, type DialMode, type DialPosition, DialRoot, DialStore, type DialTheme, type DialValue, type EasingConfig, EasingVisualization, Folder, type PanelConfig, type Preset, PresetManager, type ResolvedValues, type SelectConfig, SelectControl, type ShortcutConfig, type ShortcutInteraction, type ShortcutMode, ShortcutsMenu, Slider, type SpringConfig, SpringControl, SpringVisualization, type TextConfig, TextControl, Toggle, type TransitionConfig, TransitionControl, type UseDialOptions, useDialKit };
314
+ export { type ActionConfig, ButtonGroup, type ColorConfig, ColorControl, type ControlMeta, type DialConfig, type DialKitController, type DialKitPersistOptions, type DialKitValueUpdates, type DialMode, type DialPosition, DialRoot, DialStore, type DialTheme, type DialValue, type EasingConfig, EasingVisualization, Folder, type PanelConfig, type Preset, PresetManager, type ResolvedValues, type SelectConfig, SelectControl, type ShortcutConfig, type ShortcutInteraction, type ShortcutMode, ShortcutsMenu, Slider, type SpringConfig, SpringControl, SpringVisualization, type TextConfig, TextControl, Toggle, type TransitionConfig, TransitionControl, type UseDialOptions, useDialKit, useDialKitController };