svelte-tweakpane-ui 1.6.0-preview.3 → 1.6.0-preview.5

package/dist/internal/InternalPaneDraggable.svelte.d.ts

@@ -1,91 +1,6 @@
 import { SvelteComponent } from 'svelte'
 declare const __propDef: {
-	props: {
-		/**
-		 * Horizontal position of the pane relative to the left edge of the window, in pixels.
-		 *
-		 * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
-		 * positioned on the page. (So-named because of its similarity to CSS `position` property.)
-		 *
-		 * By default, this position is saved to local storage for persistence across page loads.
-		 * @default `0`
-		 * @bindable
-		 * */
-		x?: number
-		/**
-		 * Vertical position of the pane relative to the top of the window, in pixels.
-		 *
-		 * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
-		 * positioned on the page. (So-named because of its similarity to CSS `position` property.)
-		 *
-		 * By default, this position is saved to local storage for persistence across page loads.
-		 * @default `0`
-		 * @bindable
-		 * */
-		y?: number
-		/**
-		 * Minimum pane width in pixels.
-		 * @default `200`
-		 * */
-		minWidth?: number
-		/**
-		 * Maximum pane width in pixels.
-		 * @default `600`
-		 * */
-		maxWidth?: number
-		/**
-		 * Automatically collapse open panels when the available window size is less than the height
-		 * of the pane.
-		 *
-		 * @default `false`
-		 * */
-		collapseChildrenToFit?: boolean
-		/**
-		 * Identifier to be used if multiple `<Pane position="draggable">` components with
-		 * `storePositionLocally` set to true are used on the same page.
-		 * @default `'1'`
-		 */
-		localStoreId?: string
-		/**
-		 * CSS [padding property string](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
-		 * to apply to the draggable pane container to prevent it from being dragged all the way to
-		 * the edge of the window.
-		 *
-		 * Useful for keeping the pane away from of menu bars, etc.
-		 * @default `'0'`
-		 */
-		padding?: string
-		/**
-		 * Allow the user to resize the width of the pane by dragging the right corner of the title
-		 * bar.
-		 * @default `true`
-		 * */
-		resizable?: boolean
-		/**
-		 * Store the pane's position and width when the user changes it interactively.
-		 *
-		 * Set the `localStoreId` prop if you have multiple draggable panes on the same page with
-		 * `storePositionLocally` set to `true`.
-		 * @default `true`
-		 * */
-		storePositionLocally?: boolean
-		/**
-		 * Width of the pane, in pixels.
-		 *
-		 * Setting explicitly via a passed prop will override saved user-specified width.
-		 *
-		 * Use this prop to set a starting width, or to monitor changes in the the pane's width when
-		 * a user resizes it.
-		 *
-		 * Note that height is not exposed because it is determined dynamically by the pane's
-		 * contents and state of its foldable elements.
-		 *
-		 * By default, the width value is saved to local storage for persistence across page loads.
-		 * @default `256`
-		 * @bindable
-		 * */
-		width?: number
-	} & Omit<
+	props: Omit<
 		{
 			/**
 			 * Text in the pane's title bar.
@@ -152,14 +67,97 @@ declare const __propDef: {
 			 * Note that the `Pane` type for this property comes from the core Tweakpane library.
 			 * Creating an alias is suggested to avoid confusion with the _Svelte Tweakpane UI_ `Pane`
 			 * component: e.g. `import { type Pane as TpPane } from 'tweakpane'`
-			 *
 			 * @bindable
 			 * @readonly
 			 */
 			tpPane?: import('tweakpane').Pane | undefined
 		},
 		'userCreatedPane'
-	>
+	> & {
+		/**
+		 * Horizontal position of the pane relative to the left edge of the window, in pixels.
+		 *
+		 * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
+		 * positioned on the page. (So-named because of its similarity to CSS `position` property.)
+		 *
+		 * By default, this position is saved to local storage for persistence across page loads.
+		 * @default `0`
+		 * @bindable
+		 */
+		x?: number
+		/**
+		 * Vertical position of the pane relative to the top of the window, in pixels.
+		 *
+		 * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
+		 * positioned on the page. (So-named because of its similarity to CSS `position` property.)
+		 *
+		 * By default, this position is saved to local storage for persistence across page loads.
+		 * @default `0`
+		 * @bindable
+		 */
+		y?: number
+		/**
+		 * Width of the pane, in pixels.
+		 *
+		 * Setting explicitly via a passed prop will override saved user-specified width.
+		 *
+		 * Use this prop to set a starting width, or to monitor changes in the the pane's width when
+		 * a user resizes it.
+		 *
+		 * Note that height is not exposed because it is determined dynamically by the pane's
+		 * contents and state of its foldable elements.
+		 *
+		 * By default, the width value is saved to local storage for persistence across page loads.
+		 * @default `256`
+		 * @bindable
+		 */
+		width?: number
+		/**
+		 * Minimum pane width in pixels.
+		 * @default `200`
+		 */
+		minWidth?: number
+		/**
+		 * Maximum pane width in pixels.
+		 * @default `600`
+		 */
+		maxWidth?: number
+		/**
+		 * Allow the user to resize the width of the pane by dragging the right corner of the title
+		 * bar.
+		 * @default `true`
+		 */
+		resizable?: boolean
+		/**
+		 * CSS [padding property string](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
+		 * to apply to the draggable pane container to prevent it from being dragged all the way to
+		 * the edge of the window.
+		 *
+		 * Useful for keeping the pane away from of menu bars, etc.
+		 * @default `'0'`
+		 */
+		padding?: string
+		/**
+		 * Automatically collapse open panels when the available window size is less than the height
+		 * of the pane.
+		 * @default `false`
+		 */
+		collapseChildrenToFit?: boolean
+		/**
+		 * Store the pane's position and width when the user changes it interactively.
+		 *
+		 * Set the `localStoreId` prop if you have multiple draggable panes on the same page with
+		 * `storePositionLocally` set to `true`.
+		 * @default `true`
+		 */
+		storePositionLocally?: boolean
+		/**
+		 * Identifier to be used if multiple `<Pane position="draggable">` components with
+		 * `storePositionLocally` set to true are used on the same page.
+		 * @default `'1'`
+		 */
+		localStoreId?: string
+	}
 	events: {
 		[evt: string]: CustomEvent<any>
 	}

package/dist/internal/InternalPaneFixed.svelte.d.ts

@@ -1,30 +1,6 @@
 import { SvelteComponent } from 'svelte'
 declare const __propDef: {
-	props: {
-		/**
-		 * Horizontal position of the pane relative to the left edge of the window, in pixels.
-		 *
-		 * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
-		 * positioned on the page. (So-named because of its similarity to CSS `position` property.)
-		 * @default `undefined`  \
-		 * 8 pixels from the right edge of the window.
-		 * */
-		x?: number
-		/**
-		 * Vertical position of the pane relative to the top of the window, in pixels.
-		 *
-		 * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
-		 * positioned on the page. (So-named because of its similarity to CSS `position` property.)
-		 * @default `undefined`  \
-		 * 8 pixels from the top edge of the window.
-		 * */
-		y?: number
-		/**
-		 * Width of the pane, in pixels.
-		 * @default `256`
-		 * */
-		width?: number
-	} & Omit<
+	props: Omit<
 		{
 			/**
 			 * Text in the pane's title bar.
@@ -91,14 +67,37 @@ declare const __propDef: {
 			 * Note that the `Pane` type for this property comes from the core Tweakpane library.
 			 * Creating an alias is suggested to avoid confusion with the _Svelte Tweakpane UI_ `Pane`
 			 * component: e.g. `import { type Pane as TpPane } from 'tweakpane'`
-			 *
 			 * @bindable
 			 * @readonly
 			 */
 			tpPane?: import('tweakpane').Pane | undefined
 		},
 		'userCreatedPane'
-	>
+	> & {
+		/**
+		 * Horizontal position of the pane relative to the left edge of the window, in pixels.
+		 *
+		 * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
+		 * positioned on the page. (So-named because of its similarity to CSS `position` property.)
+		 * @default `undefined`  \
+		 * 8 pixels from the right edge of the window.
+		 */
+		x?: number
+		/**
+		 * Vertical position of the pane relative to the top of the window, in pixels.
+		 *
+		 * Not to be confused with the `position` prop which defines _how_, not _where_, the pane is
+		 * positioned on the page. (So-named because of its similarity to CSS `position` property.)
+		 * @default `undefined`  \
+		 * 8 pixels from the top edge of the window.
+		 */
+		y?: number
+		/**
+		 * Width of the pane, in pixels.
+		 * @default `256`
+		 */
+		width?: number
+	}
 	events: {
 		[evt: string]: CustomEvent<any>
 	}

package/dist/internal/InternalPaneInline.svelte

@@ -1,7 +1,7 @@
 <script>
+	import { onMount } from 'svelte'
 	import GenericPane from './GenericPane.svelte'
 	import { removeKeys } from '../utils.js'
-	import { onMount } from 'svelte'
 	export let expanded = void 0
 	export let width = void 0
 	export let tpPane = void 0

package/dist/internal/InternalPaneInline.svelte.d.ts

@@ -1,19 +1,6 @@
 import { SvelteComponent } from 'svelte'
 declare const __propDef: {
 	props: {
-		/**
-		 * Width of the pane, in pixels.
-		 *
-		 * If undefined, the pane will fill the width of its container. (This behavior is unique to
-		 * `position="inline"`.)
-		 *
-		 * This value is particularly important in combination with `scale`, since a scaled inline
-		 * pane will grow indefinitely wider if an intrinsic width is not specified and a containing
-		 * element is not provided.
-		 * @default `undefined`
-		 * */
-		width?: number
-	} & {
 		/**
 		 * Text in the pane's title bar.
 		 * @default `Tweakpane`  \
@@ -79,11 +66,23 @@ declare const __propDef: {
 		 * Note that the `Pane` type for this property comes from the core Tweakpane library.
 		 * Creating an alias is suggested to avoid confusion with the _Svelte Tweakpane UI_ `Pane`
 		 * component: e.g. `import { type Pane as TpPane } from 'tweakpane'`
-		 *
 		 * @bindable
 		 * @readonly
 		 */
 		tpPane?: import('tweakpane').Pane | undefined
+	} & {
+		/**
+		 * Width of the pane, in pixels.
+		 *
+		 * If undefined, the pane will fill the width of its container. (This behavior is unique to
+		 * `position="inline"`.)
+		 *
+		 * This value is particularly important in combination with `scale`, since a scaled inline
+		 * pane will grow indefinitely wider if an intrinsic width is not specified and a containing
+		 * element is not provided.
+		 * @default `undefined`
+		 */
+		width?: number
 	}
 	events: {
 		[evt: string]: CustomEvent<any>

package/dist/monitor/FpsGraph.svelte

@@ -1,12 +1,12 @@
 <script context="module"></script>
 
 <script>
-	import Blade from '../core/Blade.svelte'
-	import ClsPad from '../internal/ClsPad.svelte'
-	import { fillWith } from '../utils'
 	import * as pluginModule from '@kitschpatrol/tweakpane-plugin-essentials'
 	import { BROWSER } from 'esm-env'
 	import { createEventDispatcher, onDestroy, onMount } from 'svelte'
+	import Blade from '../core/Blade.svelte'
+	import ClsPad from '../internal/ClsPad.svelte'
+	import { fillWith } from '../utils.js'
 	export let rows = void 0
 	export let interval = void 0
 	export let max = void 0
@@ -50,10 +50,10 @@
 	}
 	let options
 	$: options = {
-		min,
-		max,
 		interval,
 		label,
+		max,
+		min,
 		rows,
 		view: 'fpsgraph',
 	}

package/dist/monitor/FpsGraph.svelte.d.ts

@@ -20,49 +20,7 @@ declare const __propDef: {
 		 * @default `undefined`
 		 */
 		end?: () => void
-	} & ({
-		/**
-		 * Lower bound of the FPS graph.
-		 * @default `0`
-		 * */
-		min?: number
-		/**
-		 * Upper bound of the FPS graph.
-		 * @default `90`
-		 * */
-		max?: number
-		/**
-		 * Function to start a single frame measurement sample.
-		 *
-		 * If undefined, a `requestAnimationFrame` is used to indicate the overall performance of
-		 * the page.
-		 * @default `undefined`
-		 * */
-		begin?: () => void
-		/**
-		 * Function to end a single frame measurement sample.
-		 *
-		 * If undefined, a `requestAnimationFrame` is used to indicate the overall performance of
-		 * the page.
-		 * @default `undefined`
-		 * */
-		end?: () => void
-		/**
-		 * Time in milliseconds between updates to the graph.
-		 * @default `1000`
-		 * */
-		interval?: number
-		/**
-		 * Text displayed next to the FPS graph.
-		 * @default `undefined`
-		 * */
-		label?: string
-		/**
-		 * Height of the FPS graph, in rows.
-		 * @default `2`
-		 * */
-		rows?: number
-	} & Omit<
+	} & (Omit<
 		{
 			/**
 			 * Blade configuration exposing Tweakpane's internal
@@ -90,7 +48,6 @@ declare const __propDef: {
 			 * components wrapping `<Blade>`'s functionality.
 			 *
 			 * Direct manipulation of Tweakpane's internals can break _Svelte Tweakpane UI_ abstractions.
-			 *
 			 * @bindable
 			 * @readonly
 			 */
@@ -103,13 +60,54 @@ declare const __propDef: {
 			 * components wrapping `<Blade>`'s functionality in combination with a Tweakpane plugin.
 			 *
 			 * Direct manipulation of Tweakpane's internals can break _Svelte Tweakpane UI_ abstractions.
-			 *
 			 * @default `undefined`
 			 */
 			plugin?: import('../utils.js').Plugin | undefined
 		},
 		'ref' | 'options' | 'plugin'
-	>)
+	> & {
+		/**
+		 * Lower bound of the FPS graph.
+		 * @default `0`
+		 */
+		min?: number
+		/**
+		 * Upper bound of the FPS graph.
+		 * @default `90`
+		 */
+		max?: number
+		/**
+		 * Function to start a single frame measurement sample.
+		 *
+		 * If undefined, a `requestAnimationFrame` is used to indicate the overall performance of
+		 * the page.
+		 * @default `undefined`
+		 */
+		begin?: () => void
+		/**
+		 * Function to end a single frame measurement sample.
+		 *
+		 * If undefined, a `requestAnimationFrame` is used to indicate the overall performance of
+		 * the page.
+		 * @default `undefined`
+		 */
+		end?: () => void
+		/**
+		 * Time in milliseconds between updates to the graph.
+		 * @default `1000`
+		 */
+		interval?: number
+		/**
+		 * Text displayed next to the FPS graph.
+		 * @default `undefined`
+		 */
+		label?: string
+		/**
+		 * Height of the FPS graph, in rows.
+		 * @default `2`
+		 */
+		rows?: number
+	})
 	slots: {}
 	events: {
 		/**
@@ -118,7 +116,7 @@ declare const __propDef: {
 		 * Note that the values described in the `FpsGraphChangeEvent` type are available on the
 		 * `event.detail` parameter.
 		 * @event
-		 * */
+		 */
 		change: FpsGraphChangeEvent
 	}
 }

package/dist/monitor/Monitor.svelte

@@ -1,4 +1,4 @@
-<script generics="W extends number | string | boolean | unknown">
+<script generics="W extends boolean | number | string | unknown">
 	import InternalMonitorBoolean from '../internal/InternalMonitorBoolean.svelte'
 	import InternalMonitorNumber from '../internal/InternalMonitorNumber.svelte'
 	import InternalMonitorString from '../internal/InternalMonitorString.svelte'