svelte-tweakpane-ui 1.5.12 → 1.5.13

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 (93) hide show
  1. package/dist/control/Button.svelte +5 -5
  2. package/dist/control/Button.svelte.d.ts +5 -5
  3. package/dist/control/ButtonGrid.svelte +5 -5
  4. package/dist/control/ButtonGrid.svelte.d.ts +32 -34
  5. package/dist/control/Checkbox.svelte.d.ts +9 -13
  6. package/dist/control/Color.svelte +3 -4
  7. package/dist/control/Color.svelte.d.ts +94 -99
  8. package/dist/control/CubicBezier.svelte +5 -5
  9. package/dist/control/CubicBezier.svelte.d.ts +43 -47
  10. package/dist/control/File.svelte +3 -3
  11. package/dist/control/File.svelte.d.ts +34 -38
  12. package/dist/control/Image.svelte +3 -3
  13. package/dist/control/Image.svelte.d.ts +31 -35
  14. package/dist/control/IntervalSlider.svelte +1 -1
  15. package/dist/control/IntervalSlider.svelte.d.ts +103 -108
  16. package/dist/control/List.svelte +5 -5
  17. package/dist/control/List.svelte.d.ts +24 -28
  18. package/dist/control/Point.svelte +9 -9
  19. package/dist/control/Point.svelte.d.ts +142 -147
  20. package/dist/control/RadioGrid.svelte +3 -4
  21. package/dist/control/RadioGrid.svelte.d.ts +60 -64
  22. package/dist/control/Ring.svelte +1 -1
  23. package/dist/control/Ring.svelte.d.ts +105 -109
  24. package/dist/control/RotationEuler.svelte +5 -5
  25. package/dist/control/RotationEuler.svelte.d.ts +110 -115
  26. package/dist/control/RotationQuaternion.svelte +5 -5
  27. package/dist/control/RotationQuaternion.svelte.d.ts +108 -113
  28. package/dist/control/Slider.svelte +1 -1
  29. package/dist/control/Slider.svelte.d.ts +95 -99
  30. package/dist/control/Stepper.svelte +1 -1
  31. package/dist/control/Stepper.svelte.d.ts +95 -99
  32. package/dist/control/Text.svelte +1 -1
  33. package/dist/control/Text.svelte.d.ts +25 -29
  34. package/dist/control/Textarea.svelte +2 -2
  35. package/dist/control/Textarea.svelte.d.ts +34 -38
  36. package/dist/control/Wheel.svelte +1 -1
  37. package/dist/control/Wheel.svelte.d.ts +101 -104
  38. package/dist/core/Binding.svelte +5 -5
  39. package/dist/core/Binding.svelte.d.ts +9 -14
  40. package/dist/core/Blade.svelte +3 -3
  41. package/dist/core/Blade.svelte.d.ts +5 -7
  42. package/dist/core/Folder.svelte +4 -4
  43. package/dist/core/Folder.svelte.d.ts +5 -5
  44. package/dist/core/Pane.svelte +3 -3
  45. package/dist/core/Pane.svelte.d.ts +217 -221
  46. package/dist/core/Separator.svelte +1 -1
  47. package/dist/core/Separator.svelte.d.ts +0 -2
  48. package/dist/core/TabGroup.svelte +4 -4
  49. package/dist/core/TabGroup.svelte.d.ts +3 -3
  50. package/dist/core/TabPage.svelte +4 -4
  51. package/dist/core/TabPage.svelte.d.ts +4 -4
  52. package/dist/extra/AutoObject.svelte +5 -5
  53. package/dist/extra/AutoObject.svelte.d.ts +4 -5
  54. package/dist/extra/AutoValue.svelte.d.ts +9 -13
  55. package/dist/extra/Element.svelte +1 -1
  56. package/dist/extra/Element.svelte.d.ts +23 -25
  57. package/dist/internal/ClsPad.svelte +3 -2
  58. package/dist/internal/GenericBinding.svelte +2 -2
  59. package/dist/internal/GenericBinding.svelte.d.ts +8 -11
  60. package/dist/internal/GenericBladeFolding.svelte +1 -1
  61. package/dist/internal/GenericBladeFolding.svelte.d.ts +25 -27
  62. package/dist/internal/GenericInput.svelte.d.ts +8 -11
  63. package/dist/internal/GenericInputFolding.svelte.d.ts +78 -81
  64. package/dist/internal/GenericMonitor.svelte.d.ts +76 -79
  65. package/dist/internal/GenericPane.svelte +4 -4
  66. package/dist/internal/GenericPane.svelte.d.ts +6 -7
  67. package/dist/internal/GenericSlider.svelte +1 -1
  68. package/dist/internal/GenericSlider.svelte.d.ts +100 -101
  69. package/dist/internal/InternalMonitorBoolean.svelte +2 -2
  70. package/dist/internal/InternalMonitorBoolean.svelte.d.ts +79 -82
  71. package/dist/internal/InternalMonitorNumber.svelte +3 -3
  72. package/dist/internal/InternalMonitorNumber.svelte.d.ts +100 -103
  73. package/dist/internal/InternalMonitorString.svelte +2 -2
  74. package/dist/internal/InternalMonitorString.svelte.d.ts +84 -87
  75. package/dist/internal/InternalPaneDraggable.svelte +5 -5
  76. package/dist/internal/InternalPaneDraggable.svelte.d.ts +86 -88
  77. package/dist/internal/InternalPaneFixed.svelte.d.ts +26 -27
  78. package/dist/internal/InternalPaneInline.svelte +1 -1
  79. package/dist/internal/InternalPaneInline.svelte.d.ts +13 -14
  80. package/dist/monitor/FpsGraph.svelte +5 -5
  81. package/dist/monitor/FpsGraph.svelte.d.ts +45 -47
  82. package/dist/monitor/Monitor.svelte +1 -1
  83. package/dist/monitor/Monitor.svelte.d.ts +316 -331
  84. package/dist/monitor/Profiler.svelte +3 -3
  85. package/dist/monitor/Profiler.svelte.d.ts +51 -59
  86. package/dist/monitor/WaveformMonitor.svelte +5 -5
  87. package/dist/monitor/WaveformMonitor.svelte.d.ts +102 -105
  88. package/dist/theme.d.ts +1 -1
  89. package/dist/theme.js +0 -2
  90. package/dist/utils.d.ts +5 -5
  91. package/dist/utils.js +2 -4
  92. package/license.txt +1 -1
  93. package/package.json +24 -29
@@ -1,91 +1,6 @@
1
1
  import { SvelteComponent } from 'svelte'
2
2
  declare const __propDef: {
3
- props: {
4
- /**
5
- * Horizontal position of the pane relative to the left edge of the window, in pixels.
6
- *
7
- * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
8
- * positioned on the page. (So-named because of its similarity to CSS `position` property.)
9
- *
10
- * By default, this position is saved to local storage for persistence across page loads.
11
- * @default `0`
12
- * @bindable
13
- * */
14
- x?: number
15
- /**
16
- * Vertical position of the pane relative to the top of the window, in pixels.
17
- *
18
- * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
19
- * positioned on the page. (So-named because of its similarity to CSS `position` property.)
20
- *
21
- * By default, this position is saved to local storage for persistence across page loads.
22
- * @default `0`
23
- * @bindable
24
- * */
25
- y?: number
26
- /**
27
- * Minimum pane width in pixels.
28
- * @default `200`
29
- * */
30
- minWidth?: number
31
- /**
32
- * Maximum pane width in pixels.
33
- * @default `600`
34
- * */
35
- maxWidth?: number
36
- /**
37
- * Automatically collapse open panels when the available window size is less than the height
38
- * of the pane.
39
- *
40
- * @default `false`
41
- * */
42
- collapseChildrenToFit?: boolean
43
- /**
44
- * Identifier to be used if multiple `<Pane position="draggable">` components with
45
- * `storePositionLocally` set to true are used on the same page.
46
- * @default `'1'`
47
- */
48
- localStoreId?: string
49
- /**
50
- * CSS [padding property string](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
51
- * to apply to the draggable pane container to prevent it from being dragged all the way to
52
- * the edge of the window.
53
- *
54
- * Useful for keeping the pane away from of menu bars, etc.
55
- * @default `'0'`
56
- */
57
- padding?: string
58
- /**
59
- * Allow the user to resize the width of the pane by dragging the right corner of the title
60
- * bar.
61
- * @default `true`
62
- * */
63
- resizable?: boolean
64
- /**
65
- * Store the pane's position and width when the user changes it interactively.
66
- *
67
- * Set the `localStoreId` prop if you have multiple draggable panes on the same page with
68
- * `storePositionLocally` set to `true`.
69
- * @default `true`
70
- * */
71
- storePositionLocally?: boolean
72
- /**
73
- * Width of the pane, in pixels.
74
- *
75
- * Setting explicitly via a passed prop will override saved user-specified width.
76
- *
77
- * Use this prop to set a starting width, or to monitor changes in the the pane's width when
78
- * a user resizes it.
79
- *
80
- * Note that height is not exposed because it is determined dynamically by the pane's
81
- * contents and state of its foldable elements.
82
- *
83
- * By default, the width value is saved to local storage for persistence across page loads.
84
- * @default `256`
85
- * @bindable
86
- * */
87
- width?: number
88
- } & Omit<
3
+ props: Omit<
89
4
  {
90
5
  /**
91
6
  * Text in the pane's title bar.
@@ -152,14 +67,97 @@ declare const __propDef: {
152
67
  * Note that the `Pane` type for this property comes from the core Tweakpane library.
153
68
  * Creating an alias is suggested to avoid confusion with the _Svelte Tweakpane UI_ `Pane`
154
69
  * component: e.g. `import { type Pane as TpPane } from 'tweakpane'`
155
- *
156
70
  * @bindable
157
71
  * @readonly
158
72
  */
159
73
  tpPane?: import('tweakpane').Pane | undefined
160
74
  },
161
75
  'userCreatedPane'
162
- >
76
+ > & {
77
+ /**
78
+ * Horizontal position of the pane relative to the left edge of the window, in pixels.
79
+ *
80
+ * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
81
+ * positioned on the page. (So-named because of its similarity to CSS `position` property.)
82
+ *
83
+ * By default, this position is saved to local storage for persistence across page loads.
84
+ * @default `0`
85
+ * @bindable
86
+ */
87
+ x?: number
88
+ /**
89
+ * Vertical position of the pane relative to the top of the window, in pixels.
90
+ *
91
+ * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
92
+ * positioned on the page. (So-named because of its similarity to CSS `position` property.)
93
+ *
94
+ * By default, this position is saved to local storage for persistence across page loads.
95
+ * @default `0`
96
+ * @bindable
97
+ */
98
+ y?: number
99
+ /**
100
+ * Width of the pane, in pixels.
101
+ *
102
+ * Setting explicitly via a passed prop will override saved user-specified width.
103
+ *
104
+ * Use this prop to set a starting width, or to monitor changes in the the pane's width when
105
+ * a user resizes it.
106
+ *
107
+ * Note that height is not exposed because it is determined dynamically by the pane's
108
+ * contents and state of its foldable elements.
109
+ *
110
+ * By default, the width value is saved to local storage for persistence across page loads.
111
+ * @default `256`
112
+ * @bindable
113
+ */
114
+ width?: number
115
+ /**
116
+ * Minimum pane width in pixels.
117
+ * @default `200`
118
+ */
119
+ minWidth?: number
120
+ /**
121
+ * Maximum pane width in pixels.
122
+ * @default `600`
123
+ */
124
+ maxWidth?: number
125
+ /**
126
+ * Allow the user to resize the width of the pane by dragging the right corner of the title
127
+ * bar.
128
+ * @default `true`
129
+ */
130
+ resizable?: boolean
131
+ /**
132
+ * CSS [padding property string](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
133
+ * to apply to the draggable pane container to prevent it from being dragged all the way to
134
+ * the edge of the window.
135
+ *
136
+ * Useful for keeping the pane away from of menu bars, etc.
137
+ * @default `'0'`
138
+ */
139
+ padding?: string
140
+ /**
141
+ * Automatically collapse open panels when the available window size is less than the height
142
+ * of the pane.
143
+ * @default `false`
144
+ */
145
+ collapseChildrenToFit?: boolean
146
+ /**
147
+ * Store the pane's position and width when the user changes it interactively.
148
+ *
149
+ * Set the `localStoreId` prop if you have multiple draggable panes on the same page with
150
+ * `storePositionLocally` set to `true`.
151
+ * @default `true`
152
+ */
153
+ storePositionLocally?: boolean
154
+ /**
155
+ * Identifier to be used if multiple `<Pane position="draggable">` components with
156
+ * `storePositionLocally` set to true are used on the same page.
157
+ * @default `'1'`
158
+ */
159
+ localStoreId?: string
160
+ }
163
161
  events: {
164
162
  [evt: string]: CustomEvent<any>
165
163
  }
@@ -1,30 +1,6 @@
1
1
  import { SvelteComponent } from 'svelte'
2
2
  declare const __propDef: {
3
- props: {
4
- /**
5
- * Horizontal position of the pane relative to the left edge of the window, in pixels.
6
- *
7
- * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
8
- * positioned on the page. (So-named because of its similarity to CSS `position` property.)
9
- * @default `undefined` \
10
- * 8 pixels from the right edge of the window.
11
- * */
12
- x?: number
13
- /**
14
- * Vertical position of the pane relative to the top of the window, in pixels.
15
- *
16
- * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
17
- * positioned on the page. (So-named because of its similarity to CSS `position` property.)
18
- * @default `undefined` \
19
- * 8 pixels from the top edge of the window.
20
- * */
21
- y?: number
22
- /**
23
- * Width of the pane, in pixels.
24
- * @default `256`
25
- * */
26
- width?: number
27
- } & Omit<
3
+ props: Omit<
28
4
  {
29
5
  /**
30
6
  * Text in the pane's title bar.
@@ -91,14 +67,37 @@ declare const __propDef: {
91
67
  * Note that the `Pane` type for this property comes from the core Tweakpane library.
92
68
  * Creating an alias is suggested to avoid confusion with the _Svelte Tweakpane UI_ `Pane`
93
69
  * component: e.g. `import { type Pane as TpPane } from 'tweakpane'`
94
- *
95
70
  * @bindable
96
71
  * @readonly
97
72
  */
98
73
  tpPane?: import('tweakpane').Pane | undefined
99
74
  },
100
75
  'userCreatedPane'
101
- >
76
+ > & {
77
+ /**
78
+ * Horizontal position of the pane relative to the left edge of the window, in pixels.
79
+ *
80
+ * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
81
+ * positioned on the page. (So-named because of its similarity to CSS `position` property.)
82
+ * @default `undefined` \
83
+ * 8 pixels from the right edge of the window.
84
+ */
85
+ x?: number
86
+ /**
87
+ * Vertical position of the pane relative to the top of the window, in pixels.
88
+ *
89
+ * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
90
+ * positioned on the page. (So-named because of its similarity to CSS `position` property.)
91
+ * @default `undefined` \
92
+ * 8 pixels from the top edge of the window.
93
+ */
94
+ y?: number
95
+ /**
96
+ * Width of the pane, in pixels.
97
+ * @default `256`
98
+ */
99
+ width?: number
100
+ }
102
101
  events: {
103
102
  [evt: string]: CustomEvent<any>
104
103
  }
@@ -1,7 +1,7 @@
1
1
  <script>
2
+ import { onMount } from 'svelte'
2
3
  import GenericPane from './GenericPane.svelte'
3
4
  import { removeKeys } from '../utils.js'
4
- import { onMount } from 'svelte'
5
5
  export let expanded = void 0
6
6
  export let width = void 0
7
7
  export let tpPane = void 0
@@ -1,19 +1,6 @@
1
1
  import { SvelteComponent } from 'svelte'
2
2
  declare const __propDef: {
3
3
  props: {
4
- /**
5
- * Width of the pane, in pixels.
6
- *
7
- * If undefined, the pane will fill the width of its container. (This behavior is unique to
8
- * `position="inline"`.)
9
- *
10
- * This value is particularly important in combination with `scale`, since a scaled inline
11
- * pane will grow indefinitely wider if an intrinsic width is not specified and a containing
12
- * element is not provided.
13
- * @default `undefined`
14
- * */
15
- width?: number
16
- } & {
17
4
  /**
18
5
  * Text in the pane's title bar.
19
6
  * @default `Tweakpane` \
@@ -79,11 +66,23 @@ declare const __propDef: {
79
66
  * Note that the `Pane` type for this property comes from the core Tweakpane library.
80
67
  * Creating an alias is suggested to avoid confusion with the _Svelte Tweakpane UI_ `Pane`
81
68
  * component: e.g. `import { type Pane as TpPane } from 'tweakpane'`
82
- *
83
69
  * @bindable
84
70
  * @readonly
85
71
  */
86
72
  tpPane?: import('tweakpane').Pane | undefined
73
+ } & {
74
+ /**
75
+ * Width of the pane, in pixels.
76
+ *
77
+ * If undefined, the pane will fill the width of its container. (This behavior is unique to
78
+ * `position="inline"`.)
79
+ *
80
+ * This value is particularly important in combination with `scale`, since a scaled inline
81
+ * pane will grow indefinitely wider if an intrinsic width is not specified and a containing
82
+ * element is not provided.
83
+ * @default `undefined`
84
+ */
85
+ width?: number
87
86
  }
88
87
  events: {
89
88
  [evt: string]: CustomEvent<any>
@@ -1,12 +1,12 @@
1
1
  <script context="module"></script>
2
2
 
3
3
  <script>
4
- import Blade from '../core/Blade.svelte'
5
- import ClsPad from '../internal/ClsPad.svelte'
6
- import { fillWith } from '../utils'
7
4
  import * as pluginModule from '@kitschpatrol/tweakpane-plugin-essentials'
8
5
  import { BROWSER } from 'esm-env'
9
6
  import { createEventDispatcher, onDestroy, onMount } from 'svelte'
7
+ import Blade from '../core/Blade.svelte'
8
+ import ClsPad from '../internal/ClsPad.svelte'
9
+ import { fillWith } from '../utils.js'
10
10
  export let rows = void 0
11
11
  export let interval = void 0
12
12
  export let max = void 0
@@ -50,10 +50,10 @@
50
50
  }
51
51
  let options
52
52
  $: options = {
53
- min,
54
- max,
55
53
  interval,
56
54
  label,
55
+ max,
56
+ min,
57
57
  rows,
58
58
  view: 'fpsgraph',
59
59
  }
@@ -20,49 +20,7 @@ declare const __propDef: {
20
20
  * @default `undefined`
21
21
  */
22
22
  end?: () => void
23
- } & ({
24
- /**
25
- * Lower bound of the FPS graph.
26
- * @default `0`
27
- * */
28
- min?: number
29
- /**
30
- * Upper bound of the FPS graph.
31
- * @default `90`
32
- * */
33
- max?: number
34
- /**
35
- * Function to start a single frame measurement sample.
36
- *
37
- * If undefined, a `requestAnimationFrame` is used to indicate the overall performance of
38
- * the page.
39
- * @default `undefined`
40
- * */
41
- begin?: () => void
42
- /**
43
- * Function to end a single frame measurement sample.
44
- *
45
- * If undefined, a `requestAnimationFrame` is used to indicate the overall performance of
46
- * the page.
47
- * @default `undefined`
48
- * */
49
- end?: () => void
50
- /**
51
- * Time in milliseconds between updates to the graph.
52
- * @default `1000`
53
- * */
54
- interval?: number
55
- /**
56
- * Text displayed next to the FPS graph.
57
- * @default `undefined`
58
- * */
59
- label?: string
60
- /**
61
- * Height of the FPS graph, in rows.
62
- * @default `2`
63
- * */
64
- rows?: number
65
- } & Omit<
23
+ } & (Omit<
66
24
  {
67
25
  /**
68
26
  * Blade configuration exposing Tweakpane's internal
@@ -90,7 +48,6 @@ declare const __propDef: {
90
48
  * components wrapping `<Blade>`'s functionality.
91
49
  *
92
50
  * Direct manipulation of Tweakpane's internals can break _Svelte Tweakpane UI_ abstractions.
93
- *
94
51
  * @bindable
95
52
  * @readonly
96
53
  */
@@ -103,13 +60,54 @@ declare const __propDef: {
103
60
  * components wrapping `<Blade>`'s functionality in combination with a Tweakpane plugin.
104
61
  *
105
62
  * Direct manipulation of Tweakpane's internals can break _Svelte Tweakpane UI_ abstractions.
106
- *
107
63
  * @default `undefined`
108
64
  */
109
65
  plugin?: import('../utils.js').Plugin | undefined
110
66
  },
111
67
  'ref' | 'options' | 'plugin'
112
- >)
68
+ > & {
69
+ /**
70
+ * Lower bound of the FPS graph.
71
+ * @default `0`
72
+ */
73
+ min?: number
74
+ /**
75
+ * Upper bound of the FPS graph.
76
+ * @default `90`
77
+ */
78
+ max?: number
79
+ /**
80
+ * Function to start a single frame measurement sample.
81
+ *
82
+ * If undefined, a `requestAnimationFrame` is used to indicate the overall performance of
83
+ * the page.
84
+ * @default `undefined`
85
+ */
86
+ begin?: () => void
87
+ /**
88
+ * Function to end a single frame measurement sample.
89
+ *
90
+ * If undefined, a `requestAnimationFrame` is used to indicate the overall performance of
91
+ * the page.
92
+ * @default `undefined`
93
+ */
94
+ end?: () => void
95
+ /**
96
+ * Time in milliseconds between updates to the graph.
97
+ * @default `1000`
98
+ */
99
+ interval?: number
100
+ /**
101
+ * Text displayed next to the FPS graph.
102
+ * @default `undefined`
103
+ */
104
+ label?: string
105
+ /**
106
+ * Height of the FPS graph, in rows.
107
+ * @default `2`
108
+ */
109
+ rows?: number
110
+ })
113
111
  slots: {}
114
112
  events: {
115
113
  /**
@@ -118,7 +116,7 @@ declare const __propDef: {
118
116
  * Note that the values described in the `FpsGraphChangeEvent` type are available on the
119
117
  * `event.detail` parameter.
120
118
  * @event
121
- * */
119
+ */
122
120
  change: FpsGraphChangeEvent
123
121
  }
124
122
  }
@@ -1,4 +1,4 @@
1
- <script generics="W extends number | string | boolean | unknown">
1
+ <script generics="W extends boolean | number | string | unknown">
2
2
  import InternalMonitorBoolean from '../internal/InternalMonitorBoolean.svelte'
3
3
  import InternalMonitorNumber from '../internal/InternalMonitorNumber.svelte'
4
4
  import InternalMonitorString from '../internal/InternalMonitorString.svelte'