@widgetic/editor 4.0.7 → 4.0.8

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 (56) hide show
  1. package/README.md +12 -1
  2. package/dist/components/WidgetPreview.svelte +32 -1
  3. package/dist/components/WidgetPreview.svelte.d.ts +5 -0
  4. package/dist/components/editors/PropsEditor.svelte +171 -87
  5. package/dist/components/editors/PropsEditor.svelte.d.ts +3 -2
  6. package/dist/components/ic/AngleInputController.svelte +21 -7
  7. package/dist/components/ic/AngleInputController.svelte.d.ts +16 -6
  8. package/dist/components/ic/BrowserInputController.svelte +28 -15
  9. package/dist/components/ic/BrowserInputController.svelte.d.ts +25 -19
  10. package/dist/components/ic/CheckboxInputController.svelte +21 -7
  11. package/dist/components/ic/CheckboxInputController.svelte.d.ts +25 -15
  12. package/dist/components/ic/ColorPickerInputController.svelte +47 -19
  13. package/dist/components/ic/ColorPickerInputController.svelte.d.ts +42 -17
  14. package/dist/components/ic/DateFieldInputController.svelte +21 -7
  15. package/dist/components/ic/DateFieldInputController.svelte.d.ts +24 -14
  16. package/dist/components/ic/DatePickerInputController.svelte +25 -8
  17. package/dist/components/ic/DatePickerInputController.svelte.d.ts +21 -8
  18. package/dist/components/ic/DropdownInputController.svelte +39 -14
  19. package/dist/components/ic/DropdownInputController.svelte.d.ts +33 -17
  20. package/dist/components/ic/FixedPositionInputController.svelte +24 -10
  21. package/dist/components/ic/FixedPositionInputController.svelte.d.ts +16 -4
  22. package/dist/components/ic/FontInputController.svelte +28 -10
  23. package/dist/components/ic/FontInputController.svelte.d.ts +33 -18
  24. package/dist/components/ic/NumberInputController.svelte +23 -9
  25. package/dist/components/ic/NumberInputController.svelte.d.ts +18 -7
  26. package/dist/components/ic/PositionInputController.svelte +17 -5
  27. package/dist/components/ic/PositionInputController.svelte.d.ts +20 -11
  28. package/dist/components/ic/RadioGroupInputController.svelte +21 -7
  29. package/dist/components/ic/RadioGroupInputController.svelte.d.ts +22 -12
  30. package/dist/components/ic/RangeCalendarInputController.svelte +34 -16
  31. package/dist/components/ic/RangeCalendarInputController.svelte.d.ts +25 -11
  32. package/dist/components/ic/RoundedCornersInputController.svelte +24 -10
  33. package/dist/components/ic/RoundedCornersInputController.svelte.d.ts +26 -16
  34. package/dist/components/ic/SliderInputController.svelte +41 -18
  35. package/dist/components/ic/SliderInputController.svelte.d.ts +35 -19
  36. package/dist/components/ic/SliderRangeInputController.svelte +27 -11
  37. package/dist/components/ic/SliderRangeInputController.svelte.d.ts +22 -9
  38. package/dist/components/ic/SwitchInputController.svelte +17 -5
  39. package/dist/components/ic/SwitchInputController.svelte.d.ts +14 -5
  40. package/dist/components/ic/TagsInputController.svelte +21 -7
  41. package/dist/components/ic/TagsInputController.svelte.d.ts +16 -6
  42. package/dist/components/ic/TextAreaInputController.svelte +18 -12
  43. package/dist/components/ic/TextAreaInputController.svelte.d.ts +6 -4
  44. package/dist/components/ic/TextAreaPreviewInputController.svelte +21 -7
  45. package/dist/components/ic/TextAreaPreviewInputController.svelte.d.ts +16 -6
  46. package/dist/components/ic/TextInputController.svelte +23 -8
  47. package/dist/components/ic/TextInputController.svelte.d.ts +20 -8
  48. package/dist/components/ic/TimeInputController.svelte +17 -5
  49. package/dist/components/ic/TimeInputController.svelte.d.ts +14 -5
  50. package/dist/components/ic/VectorInputController.svelte +29 -10
  51. package/dist/components/ic/VectorInputController.svelte.d.ts +33 -18
  52. package/dist/index.d.ts +1 -0
  53. package/dist/schemaViews.d.ts +105 -0
  54. package/dist/schemaViews.js +11 -0
  55. package/dist/utils/FontManager.js +1 -1
  56. package/package.json +9 -6
@@ -1,5 +1,22 @@
1
1
  import type { DateValue } from "@internationalized/date";
2
2
  import type { DateRange as BitsDateRange } from "bits-ui";
3
+ type DateRange = {
4
+ start?: DateValue;
5
+ end?: DateValue;
6
+ };
7
+ import type { Writable } from 'svelte/store';
8
+ /** Declared props contract — export lets below are annotated from it so the
9
+ * interface cannot drift from what the component actually reads. */
10
+ export interface RangeCalendarInputControllerProps {
11
+ label: string;
12
+ value?: BitsDateRange;
13
+ onChange: (newValue: DateRange) => void;
14
+ helpText?: string;
15
+ controllerId: string;
16
+ openDropdowns: Writable<Set<string>>;
17
+ toggleDropdown: (id: string) => void;
18
+ onFocus?: () => void;
19
+ }
3
20
  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> {
4
21
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
5
22
  $$bindings?: Bindings;
@@ -14,17 +31,14 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
14
31
  z_$$bindings?: Bindings;
15
32
  }
16
33
  declare const RangeCalendarInputController: $$__sveltets_2_IsomorphicComponent<{
17
- label: string;
18
- value: BitsDateRange | undefined;
19
- onChange: (newValue: {
20
- start?: DateValue;
21
- end?: DateValue;
22
- }) => void;
23
- helpText?: string | undefined;
24
- controllerId: string;
25
- openDropdowns: any;
26
- toggleDropdown: (id: string) => void;
27
- onFocus?: () => void;
34
+ label: RangeCalendarInputControllerProps["label"];
35
+ value: RangeCalendarInputControllerProps["value"];
36
+ onChange: RangeCalendarInputControllerProps["onChange"];
37
+ helpText?: RangeCalendarInputControllerProps["helpText"];
38
+ controllerId: RangeCalendarInputControllerProps["controllerId"];
39
+ openDropdowns: RangeCalendarInputControllerProps["openDropdowns"];
40
+ toggleDropdown: RangeCalendarInputControllerProps["toggleDropdown"];
41
+ onFocus?: RangeCalendarInputControllerProps["onFocus"];
28
42
  }, {
29
43
  [evt: string]: CustomEvent<any>;
30
44
  }, {}, {}, string>;
@@ -12,6 +12,17 @@
12
12
  * - Accepts only positive integer values
13
13
  -->
14
14
 
15
+ <script module lang="ts">
16
+ /** Declared props contract — export lets below are annotated from it so the
17
+ * interface cannot drift from what the component actually reads. */
18
+ export interface RoundedCornersInputControllerProps {
19
+ value: { topLeft: number; topRight: number; bottomRight: number; bottomLeft: number };
20
+ onChange: (newValue: { topLeft: number; topRight: number; bottomRight: number; bottomLeft: number }) => void;
21
+ helpText?: string;
22
+ onFocus?: () => void;
23
+ }
24
+ </script>
25
+
15
26
  <script lang="ts">
16
27
  import { onMount } from 'svelte';
17
28
  import Lock from '../icons/locked.svelte';
@@ -22,12 +33,15 @@
22
33
  const MIN_RADIUS = 0;
23
34
  const MAX_RADIUS = 120;
24
35
 
25
- // Required props
26
- export let label: string;
27
- export let value: { topLeft: number; topRight: number; bottomRight: number; bottomLeft: number };
28
- export let onChange: (newValue: { topLeft: number; topRight: number; bottomRight: number; bottomLeft: number }) => void;
29
- export let helpText: string | undefined = undefined;
30
- export let onFocus: () => void = () => {};
36
+ // Required props. `label`, `config` and `helpText` arrive through the
37
+ // dynamic-component props object but are never read here — export const
38
+ // keeps the init-set contract without the unused-reactive warning. A live
39
+ // no-op default: nothing reads these, so it can never mask a real value.
40
+ export const label: string = '';
41
+ export let value: RoundedCornersInputControllerProps['value'];
42
+ export let onChange: RoundedCornersInputControllerProps['onChange'];
43
+ export let helpText: RoundedCornersInputControllerProps['helpText'] = undefined;
44
+ export let onFocus: RoundedCornersInputControllerProps['onFocus'] = () => {};
31
45
 
32
46
  // Optional: Class prop for external styling
33
47
  let className = '';
@@ -359,10 +373,10 @@
359
373
  aria-pressed={isLocked}
360
374
  >
361
375
  <div class="flex items-center justify-center w-full h-full {isLocked ? 'text-sage-green' : 'text-grey7'}">
362
- <svelte:component
363
- this={isLocked ? Lock : Unlock}
364
- class="w-5 h-5"
365
- />
376
+ <!-- Lock/Unlock are bare SVG components (no props); the old
377
+ svelte:component + class here type-checked to never and the
378
+ class never rendered. -->
379
+ {#if isLocked}<Lock />{:else}<Unlock />{/if}
366
380
  </div>
367
381
  </button>
368
382
  </div>
@@ -1,3 +1,21 @@
1
+ /** Declared props contract — export lets below are annotated from it so the
2
+ * interface cannot drift from what the component actually reads. */
3
+ export interface RoundedCornersInputControllerProps {
4
+ value: {
5
+ topLeft: number;
6
+ topRight: number;
7
+ bottomRight: number;
8
+ bottomLeft: number;
9
+ };
10
+ onChange: (newValue: {
11
+ topLeft: number;
12
+ topRight: number;
13
+ bottomRight: number;
14
+ bottomLeft: number;
15
+ }) => void;
16
+ helpText?: string;
17
+ onFocus?: () => void;
18
+ }
1
19
  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> {
2
20
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
3
21
  $$bindings?: Bindings;
@@ -12,24 +30,16 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
12
30
  z_$$bindings?: Bindings;
13
31
  }
14
32
  declare const RoundedCornersInputController: $$__sveltets_2_IsomorphicComponent<{
15
- label: string;
16
- value: {
17
- topLeft: number;
18
- topRight: number;
19
- bottomRight: number;
20
- bottomLeft: number;
21
- };
22
- onChange: (newValue: {
23
- topLeft: number;
24
- topRight: number;
25
- bottomRight: number;
26
- bottomLeft: number;
27
- }) => void;
28
- helpText?: string | undefined;
29
- onFocus?: () => void;
33
+ label?: string;
34
+ value: RoundedCornersInputControllerProps["value"];
35
+ onChange: RoundedCornersInputControllerProps["onChange"];
36
+ helpText?: RoundedCornersInputControllerProps["helpText"];
37
+ onFocus?: RoundedCornersInputControllerProps["onFocus"];
30
38
  class?: string;
31
39
  }, {
32
40
  [evt: string]: CustomEvent<any>;
33
- }, {}, {}, string>;
41
+ }, {}, {
42
+ label: string;
43
+ }, string>;
34
44
  type RoundedCornersInputController = InstanceType<typeof RoundedCornersInputController>;
35
45
  export default RoundedCornersInputController;
@@ -1,3 +1,28 @@
1
+ <script module lang="ts">
2
+ import type { InputControllerConfig } from './index';
3
+ import type { SliderProps } from '@widgetic/design-system/components';
4
+
5
+ /** Declared props contract — export lets below are annotated from it so the
6
+ * interface cannot drift from what the component actually reads. */
7
+ export interface SliderInputControllerProps {
8
+ height?: number;
9
+ elementsGap?: number;
10
+ thumbSize?: number;
11
+ sliderType?: SliderProps['type'];
12
+ barHeight?: number;
13
+ label?: string;
14
+ value: number | number[];
15
+ onChange: (newValue: number | number[]) => void;
16
+ config?: InputControllerConfig;
17
+ helpText?: string;
18
+ min?: number;
19
+ max?: number;
20
+ step?: number;
21
+ onFocus?: () => void;
22
+ autofocus?: boolean;
23
+ }
24
+ </script>
25
+
1
26
  <script lang="ts">
2
27
  /**
3
28
  * SliderInputController Component
@@ -16,11 +41,9 @@
16
41
  /**
17
42
  * Shadcn UI components from Widgetic design-system package
18
43
  */
19
- import { Slider, type SliderProps } from '@widgetic/design-system/components';
44
+ import { Slider } from '@widgetic/design-system/components';
20
45
  import { InputControllerHeader } from './index';
21
46
 
22
- // Component config
23
- import type { InputControllerConfig } from './index';
24
47
 
25
48
  /**
26
49
  * Component Props
@@ -28,26 +51,26 @@
28
51
  */
29
52
  let className = '';
30
53
  export { className as class };
31
- export let height = 48; // pixels
32
- export let elementsGap = 8; // pixels
33
- export let thumbSize = 24; // pixels
34
- export let sliderType: SliderProps['type'] = "single";
35
- export let barHeight = 8; // pixels
36
- export let label: string = ''; // Display label
37
- export let value: number | number[]; // Current slider value
38
- export let onChange: (newValue: number | number[]) => void; // Value change callback
39
- export let config: InputControllerConfig = {}; // Additional configuration
40
- export let helpText: string | undefined = undefined; // Help text for the input
54
+ export let height: SliderInputControllerProps['height'] = 48;
55
+ export let elementsGap: SliderInputControllerProps['elementsGap'] = 8;
56
+ export let thumbSize: SliderInputControllerProps['thumbSize'] = 24;
57
+ export let sliderType: SliderInputControllerProps['sliderType'] = "single";
58
+ export let barHeight: SliderInputControllerProps['barHeight'] = 8;
59
+ export let label: SliderInputControllerProps['label'] = '';
60
+ export let value: SliderInputControllerProps['value'];
61
+ export let onChange: SliderInputControllerProps['onChange'];
62
+ export let config: SliderInputControllerProps['config'] = {};
63
+ export let helpText: SliderInputControllerProps['helpText'] = undefined;
41
64
 
42
65
  /**
43
66
  * Configuration Options
44
67
  * Derived from config prop with fallbacks
45
68
  */
46
- export let min: number = config.min || 0; // Minimum allowed value
47
- export let max: number = config.max || 100; // Maximum allowed value
48
- export let step: number = config.step || 1; // Step increment
49
- export let onFocus: () => void = () => {}; // Focus callback
50
- export let autofocus: boolean = false; // Auto-focus on mount
69
+ export let min: SliderInputControllerProps['min'] = config.min || 0;
70
+ export let max: SliderInputControllerProps['max'] = config.max || 100;
71
+ export let step: SliderInputControllerProps['step'] = config.step || 1;
72
+ export let onFocus: SliderInputControllerProps['onFocus'] = () => {};
73
+ export let autofocus: SliderInputControllerProps['autofocus'] = false; // Auto-focus on mount
51
74
 
52
75
  /**
53
76
  * Internal State
@@ -1,8 +1,24 @@
1
- /**
2
- * Shadcn UI components from Widgetic design-system package
3
- */
4
- import { type SliderProps } from '@widgetic/design-system/components';
5
1
  import type { InputControllerConfig } from './index';
2
+ import type { SliderProps } from '@widgetic/design-system/components';
3
+ /** Declared props contract — export lets below are annotated from it so the
4
+ * interface cannot drift from what the component actually reads. */
5
+ export interface SliderInputControllerProps {
6
+ height?: number;
7
+ elementsGap?: number;
8
+ thumbSize?: number;
9
+ sliderType?: SliderProps['type'];
10
+ barHeight?: number;
11
+ label?: string;
12
+ value: number | number[];
13
+ onChange: (newValue: number | number[]) => void;
14
+ config?: InputControllerConfig;
15
+ helpText?: string;
16
+ min?: number;
17
+ max?: number;
18
+ step?: number;
19
+ onFocus?: () => void;
20
+ autofocus?: boolean;
21
+ }
6
22
  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> {
7
23
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
8
24
  $$bindings?: Bindings;
@@ -21,24 +37,24 @@ declare const SliderInputController: $$__sveltets_2_IsomorphicComponent<{
21
37
  * Component Props
22
38
  * External properties that configure the slider's behavior
23
39
  */ class?: string;
24
- height?: number;
25
- elementsGap?: number;
26
- thumbSize?: number;
27
- sliderType?: SliderProps["type"];
28
- barHeight?: number;
29
- label?: string;
30
- value: number | number[];
31
- onChange: (newValue: number | number[]) => void;
32
- config?: InputControllerConfig;
33
- helpText?: string | undefined;
40
+ height?: SliderInputControllerProps["height"];
41
+ elementsGap?: SliderInputControllerProps["elementsGap"];
42
+ thumbSize?: SliderInputControllerProps["thumbSize"];
43
+ sliderType?: SliderInputControllerProps["sliderType"];
44
+ barHeight?: SliderInputControllerProps["barHeight"];
45
+ label?: SliderInputControllerProps["label"];
46
+ value: SliderInputControllerProps["value"];
47
+ onChange: SliderInputControllerProps["onChange"];
48
+ config?: SliderInputControllerProps["config"];
49
+ helpText?: SliderInputControllerProps["helpText"];
34
50
  /**
35
51
  * Configuration Options
36
52
  * Derived from config prop with fallbacks
37
- */ min?: number;
38
- max?: number;
39
- step?: number;
40
- onFocus?: () => void;
41
- autofocus?: boolean;
53
+ */ min?: SliderInputControllerProps["min"];
54
+ max?: SliderInputControllerProps["max"];
55
+ step?: SliderInputControllerProps["step"];
56
+ onFocus?: SliderInputControllerProps["onFocus"];
57
+ autofocus?: SliderInputControllerProps["autofocus"];
42
58
  }, {
43
59
  [evt: string]: CustomEvent<any>;
44
60
  }, {}, {}, string>;
@@ -17,6 +17,24 @@
17
17
  * - Manages focus states across multiple inputs
18
18
  -->
19
19
 
20
+ <script module lang="ts">
21
+ import type { InputControllerConfig } from './index';
22
+
23
+ /** Declared props contract — export lets below are annotated from it so the
24
+ * interface cannot drift from what the component actually reads. */
25
+ export interface SliderRangeInputControllerProps {
26
+ label: string;
27
+ value?: [number, number];
28
+ onChange: (newValue: [number, number]) => void;
29
+ config?: InputControllerConfig;
30
+ helpText?: string;
31
+ min?: number;
32
+ max?: number;
33
+ step?: number;
34
+ onFocus?: () => void;
35
+ }
36
+ </script>
37
+
20
38
  <script lang="ts">
21
39
  // Svelte imports
22
40
  import { onMount, tick } from 'svelte';
@@ -24,26 +42,24 @@
24
42
  // local components imports
25
43
  import SliderInputController from './SliderInputController.svelte';
26
44
 
27
- // Component config
28
- import type { InputControllerConfig } from './index';
29
45
 
30
46
  // Component props
31
47
  let className = '';
32
48
  export { className as class };
33
- export let label: string;
34
- export let value: [number, number] = [0, 100];
35
- export let onChange: (newValue: [number, number]) => void;
36
- export let config: InputControllerConfig = {};
37
- export let helpText: string | undefined = undefined;
49
+ export let label: SliderRangeInputControllerProps['label'];
50
+ export let value: SliderRangeInputControllerProps['value'] = [0, 100];
51
+ export let onChange: SliderRangeInputControllerProps['onChange'];
52
+ export let config: SliderRangeInputControllerProps['config'] = {};
53
+ export let helpText: SliderRangeInputControllerProps['helpText'] = undefined;
38
54
 
39
55
  /**
40
56
  * Configuration Options
41
57
  * Derived from config prop with fallbacks
42
58
  */
43
- export let min: number = config.min || 0;
44
- export let max: number = config.max || 100;
45
- export let step: number = config.step || 1;
46
- export let onFocus: () => void = () => {};
59
+ export let min: SliderRangeInputControllerProps['min'] = config.min || 0;
60
+ export let max: SliderRangeInputControllerProps['max'] = config.max || 100;
61
+ export let step: SliderRangeInputControllerProps['step'] = config.step || 1;
62
+ export let onFocus: SliderRangeInputControllerProps['onFocus'] = () => {};
47
63
  // export let autofocus: boolean = false;
48
64
 
49
65
  // Store initial scroll position
@@ -1,4 +1,17 @@
1
1
  import type { InputControllerConfig } from './index';
2
+ /** Declared props contract — export lets below are annotated from it so the
3
+ * interface cannot drift from what the component actually reads. */
4
+ export interface SliderRangeInputControllerProps {
5
+ label: string;
6
+ value?: [number, number];
7
+ onChange: (newValue: [number, number]) => void;
8
+ config?: InputControllerConfig;
9
+ helpText?: string;
10
+ min?: number;
11
+ max?: number;
12
+ step?: number;
13
+ onFocus?: () => void;
14
+ }
2
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> {
3
16
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
17
  $$bindings?: Bindings;
@@ -14,18 +27,18 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
14
27
  }
15
28
  declare const SliderRangeInputController: $$__sveltets_2_IsomorphicComponent<{
16
29
  class?: string;
17
- label: string;
18
- value?: [number, number];
19
- onChange: (newValue: [number, number]) => void;
20
- config?: InputControllerConfig;
21
- helpText?: string | undefined;
30
+ label: SliderRangeInputControllerProps["label"];
31
+ value?: SliderRangeInputControllerProps["value"];
32
+ onChange: SliderRangeInputControllerProps["onChange"];
33
+ config?: SliderRangeInputControllerProps["config"];
34
+ helpText?: SliderRangeInputControllerProps["helpText"];
22
35
  /**
23
36
  * Configuration Options
24
37
  * Derived from config prop with fallbacks
25
- */ min?: number;
26
- max?: number;
27
- step?: number;
28
- onFocus?: () => void;
38
+ */ min?: SliderRangeInputControllerProps["min"];
39
+ max?: SliderRangeInputControllerProps["max"];
40
+ step?: SliderRangeInputControllerProps["step"];
41
+ onFocus?: SliderRangeInputControllerProps["onFocus"];
29
42
  }, {
30
43
  [evt: string]: CustomEvent<any>;
31
44
  }, {}, {}, string>;
@@ -1,3 +1,15 @@
1
+ <script module lang="ts">
2
+ /** Declared props contract — export lets below are annotated from it so the
3
+ * interface cannot drift from what the component actually reads. */
4
+ export interface SwitchInputControllerProps {
5
+ label: string;
6
+ value: boolean;
7
+ onChange: (newValue: boolean) => void;
8
+ description?: string;
9
+ onFocus?: () => void;
10
+ }
11
+ </script>
12
+
1
13
  <script lang="ts">
2
14
  // Svelte imports
3
15
  import { onMount } from 'svelte';
@@ -7,11 +19,11 @@
7
19
  import { InputControllerHeader } from './index';
8
20
 
9
21
  // Component props
10
- export let label: string;
11
- export let value: boolean;
12
- export let onChange: (newValue: boolean) => void;
13
- export let description: string | undefined = undefined;
14
- export let onFocus: () => void = () => {};
22
+ export let label: SwitchInputControllerProps['label'];
23
+ export let value: SwitchInputControllerProps['value'];
24
+ export let onChange: SwitchInputControllerProps['onChange'];
25
+ export let description: SwitchInputControllerProps['description'] = undefined;
26
+ export let onFocus: SwitchInputControllerProps['onFocus'] = () => {};
15
27
 
16
28
  function toggle(newValue?: boolean) {
17
29
  value = typeof newValue === 'boolean' ? newValue : !value;
@@ -1,3 +1,12 @@
1
+ /** Declared props contract — export lets below are annotated from it so the
2
+ * interface cannot drift from what the component actually reads. */
3
+ export interface SwitchInputControllerProps {
4
+ label: string;
5
+ value: boolean;
6
+ onChange: (newValue: boolean) => void;
7
+ description?: string;
8
+ onFocus?: () => void;
9
+ }
1
10
  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> {
2
11
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
3
12
  $$bindings?: Bindings;
@@ -12,11 +21,11 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
12
21
  z_$$bindings?: Bindings;
13
22
  }
14
23
  declare const SwitchInputController: $$__sveltets_2_IsomorphicComponent<{
15
- label: string;
16
- value: boolean;
17
- onChange: (newValue: boolean) => void;
18
- description?: string | undefined;
19
- onFocus?: () => void;
24
+ label: SwitchInputControllerProps["label"];
25
+ value: SwitchInputControllerProps["value"];
26
+ onChange: SwitchInputControllerProps["onChange"];
27
+ description?: SwitchInputControllerProps["description"];
28
+ onFocus?: SwitchInputControllerProps["onFocus"];
20
29
  }, {
21
30
  [evt: string]: CustomEvent<any>;
22
31
  }, {}, {}, string>;
@@ -11,19 +11,33 @@
11
11
  * - Prevents duplicate tags
12
12
  -->
13
13
 
14
+ <script module lang="ts">
15
+ import type { InputControllerConfig } from './index';
16
+
17
+ /** Declared props contract — export lets below are annotated from it so the
18
+ * interface cannot drift from what the component actually reads. */
19
+ export interface TagsInputControllerProps {
20
+ label: string;
21
+ value?: string[];
22
+ onChange: (newValue: string[]) => void;
23
+ config?: InputControllerConfig;
24
+ helpText?: string;
25
+ onFocus?: () => void;
26
+ }
27
+ </script>
28
+
14
29
  <script lang="ts">
15
30
  import { onMount, onDestroy } from 'svelte';
16
31
  import InputControllerHeader from './InputControllerHeader.svelte';
17
- import type { InputControllerConfig } from './index';
18
32
  import { IconX } from '@widgetic/design-system/icons';
19
33
 
20
34
  // Required props
21
- export let label: string;
22
- export let value: string[] = [];
23
- export let onChange: (newValue: string[]) => void;
24
- export let config: InputControllerConfig = {};
25
- export let helpText: string | undefined = undefined;
26
- export let onFocus: () => void = () => {};
35
+ export let label: TagsInputControllerProps['label'];
36
+ export let value: TagsInputControllerProps['value'] = [];
37
+ export let onChange: TagsInputControllerProps['onChange'];
38
+ export let config: TagsInputControllerProps['config'] = {};
39
+ export let helpText: TagsInputControllerProps['helpText'] = undefined;
40
+ export let onFocus: TagsInputControllerProps['onFocus'] = () => {};
27
41
 
28
42
  // Optional: Class prop for external styling
29
43
  let className = '';
@@ -1,4 +1,14 @@
1
1
  import type { InputControllerConfig } from './index';
2
+ /** Declared props contract — export lets below are annotated from it so the
3
+ * interface cannot drift from what the component actually reads. */
4
+ export interface TagsInputControllerProps {
5
+ label: string;
6
+ value?: string[];
7
+ onChange: (newValue: string[]) => void;
8
+ config?: InputControllerConfig;
9
+ helpText?: string;
10
+ onFocus?: () => void;
11
+ }
2
12
  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> {
3
13
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
14
  $$bindings?: Bindings;
@@ -13,12 +23,12 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
13
23
  z_$$bindings?: Bindings;
14
24
  }
15
25
  declare const TagsInputController: $$__sveltets_2_IsomorphicComponent<{
16
- label: string;
17
- value?: string[];
18
- onChange: (newValue: string[]) => void;
19
- config?: InputControllerConfig;
20
- helpText?: string | undefined;
21
- onFocus?: () => void;
26
+ label: TagsInputControllerProps["label"];
27
+ value?: TagsInputControllerProps["value"];
28
+ onChange: TagsInputControllerProps["onChange"];
29
+ config?: TagsInputControllerProps["config"];
30
+ helpText?: TagsInputControllerProps["helpText"];
31
+ onFocus?: TagsInputControllerProps["onFocus"];
22
32
  class?: string;
23
33
  }, {
24
34
  [evt: string]: CustomEvent<any>;
@@ -22,14 +22,29 @@
22
22
  - Maintains formatting consistency across operations
23
23
  -->
24
24
 
25
+ <script module lang="ts">
26
+ import type { InputControllerConfig } from './index';
27
+
28
+ /** Declared props contract — the instance script's $props() below is
29
+ * annotated from it so the interface cannot drift from what is read. */
30
+ export interface TextAreaInputControllerProps {
31
+ class?: string;
32
+ label: string;
33
+ value: string;
34
+ onChange: (newValue: string) => void;
35
+ config?: InputControllerConfig;
36
+ description?: string;
37
+ onFocus?: () => void;
38
+ onClose?: () => void;
39
+ }
40
+ </script>
41
+
25
42
  <script lang="ts">
26
43
  // Svelte imports
27
44
  import { onMount, onDestroy } from 'svelte';
28
45
  import { writable } from 'svelte/store';
29
46
  import type { ComponentEvents } from 'svelte';
30
47
 
31
- // Component config
32
- import type { InputControllerConfig } from './index';
33
48
 
34
49
  // Import Shadcn UI components
35
50
  import { Button, ToggleGroup, Popover, Command } from '@widgetic/design-system/components';
@@ -71,16 +86,7 @@
71
86
  description = undefined,
72
87
  onFocus = () => {},
73
88
  onClose = undefined
74
- } = $props<{
75
- class: string;
76
- label: string;
77
- value: string;
78
- onChange: (newValue: string) => void;
79
- config?: InputControllerConfig;
80
- description?: string;
81
- onFocus?: () => void;
82
- onClose?: () => void;
83
- }>();
89
+ }: TextAreaInputControllerProps = $props();
84
90
 
85
91
  // Use config values with fallbacks
86
92
  const textColor = $derived(config.textColor || '#1a1a1a');
@@ -1,6 +1,8 @@
1
1
  import type { InputControllerConfig } from './index';
2
- type $$ComponentProps = {
3
- class: string;
2
+ /** Declared props contract — the instance script's $props() below is
3
+ * annotated from it so the interface cannot drift from what is read. */
4
+ export interface TextAreaInputControllerProps {
5
+ class?: string;
4
6
  label: string;
5
7
  value: string;
6
8
  onChange: (newValue: string) => void;
@@ -8,7 +10,7 @@ type $$ComponentProps = {
8
10
  description?: string;
9
11
  onFocus?: () => void;
10
12
  onClose?: () => void;
11
- };
12
- declare const TextAreaInputController: import("svelte").Component<$$ComponentProps, {}, "value">;
13
+ }
14
+ declare const TextAreaInputController: import("svelte").Component<TextAreaInputControllerProps, {}, "value">;
13
15
  type TextAreaInputController = ReturnType<typeof TextAreaInputController>;
14
16
  export default TextAreaInputController;