svelte-tweakpane-ui 1.5.3 → 1.5.5

package/dist/core/Pane.svelte

@@ -1,26 +1,26 @@
 <script context="module"></script>
 
 <script>
-	import InternalPaneDraggable from '../internal/InternalPaneDraggable.svelte';
-	import InternalPaneFixed from '../internal/InternalPaneFixed.svelte';
-	import InternalPaneInline from '../internal/InternalPaneInline.svelte';
-	import { removeKeys } from '../utils';
-	import { BROWSER } from 'esm-env';
-	import { beforeUpdate } from 'svelte';
-	export let expanded = void 0;
-	export let position = void 0;
-	export let width = void 0;
-	export let tpPane = void 0;
-	export let x = void 0;
-	export let y = void 0;
+	import InternalPaneDraggable from '../internal/InternalPaneDraggable.svelte'
+	import InternalPaneFixed from '../internal/InternalPaneFixed.svelte'
+	import InternalPaneInline from '../internal/InternalPaneInline.svelte'
+	import { removeKeys } from '../utils'
+	import { BROWSER } from 'esm-env'
+	import { beforeUpdate } from 'svelte'
+	export let expanded = void 0
+	export let position = void 0
+	export let width = void 0
+	export let tpPane = void 0
+	export let x = void 0
+	export let y = void 0
 	beforeUpdate(() => {
 		if ($$props.position === 'inline' || $$props.position === 'fixed') {
-			x = $$props.x;
-			y = $$props.y;
-			width = $$props.width;
-			expanded = $$props.expanded;
+			x = $$props.x
+			y = $$props.y
+			width = $$props.width
+			expanded = $$props.expanded
 		}
-	});
+	})
 </script>
 
 <!-- Only prerender inline panes, because fixed / absolute positioned objects don't affect layout

package/dist/core/Pane.svelte.d.ts

@@ -1,5 +1,5 @@
-import { SvelteComponent } from 'svelte';
-export type PanePosition = 'draggable' | 'fixed' | 'inline';
+import { SvelteComponent } from 'svelte'
+export type PanePosition = 'draggable' | 'fixed' | 'inline'
 declare const __propDef: {
 	props: {
 		/**
@@ -17,7 +17,7 @@ declare const __propDef: {
 		 *   vary depending on the defined `position` value.
 		 * @default `'draggable'`
 		 * */
-		position?: PanePosition;
+		position?: PanePosition
 	} & (
 		| ({
 				/**
@@ -35,7 +35,7 @@ declare const __propDef: {
 				 *   vary depending on the defined `position` value.
 				 * @default `'draggable'`
 				 */
-				position: 'fixed';
+				position: 'fixed'
 		  } & {
 				/**
 				 * Horizontal position of the pane relative to the left edge of the window, in pixels.
@@ -47,7 +47,7 @@ declare const __propDef: {
 				 * @default `0`
 				 * @bindable
 				 */
-				x?: number;
+				x?: number
 				/**
 				 * Vertical position of the pane relative to the top of the window, in pixels.
 				 *
@@ -58,7 +58,7 @@ declare const __propDef: {
 				 * @default `0`
 				 * @bindable
 				 */
-				y?: number;
+				y?: number
 				/**
 				 * Width of the pane, in pixels.
 				 *
@@ -74,7 +74,7 @@ declare const __propDef: {
 				 * @default `256`
 				 * @bindable
 				 */
-				width?: number;
+				width?: number
 		  } & Omit<
 					{
 						/**
@@ -83,20 +83,20 @@ declare const __propDef: {
 						 * Unless `position="inline"`, in which case the default is `undefined` and no title bar is
 						 * shown.
 						 */
-						title?: string | undefined;
+						title?: string | undefined
 						/**
 						 * Allow users to interactively expand / contract the pane by clicking its title bar.
 						 *
 						 * Hides the collapse button from the title bar when `false`.
 						 * @default `true`
 						 */
-						userExpandable?: boolean;
+						userExpandable?: boolean
 						/**
 						 * Expand or collapse the pane into its title bar.
 						 * @default `true`
 						 * @bindable
 						 */
-						expanded?: boolean;
+						expanded?: boolean
 						/**
 						 * Custom color scheme.
 						 *
@@ -115,7 +115,7 @@ declare const __propDef: {
 						 * Inherits default Tweakpane theme equivalent to `ThemeUtils.presets.standard`, or the theme
 						 * set with `setGlobalDefaultTheme()`.
 						 */
-						theme?: import('..').Theme | undefined;
+						theme?: import('..').Theme | undefined
 						/**
 						 * Scales the pane's elements by a factor of `scale` to make it easier to see.
 						 *
@@ -129,9 +129,9 @@ declare const __propDef: {
 						 * Negative values are ignored.
 						 * @default `1`
 						 */
-						scale?: number;
+						scale?: number
 						/** Internal use only. */
-						userCreatedPane?: boolean;
+						userCreatedPane?: boolean
 						/**
 						 * The internal Tweakpane [`Pane`](https://tweakpane.github.io/docs/api/classes/Pane.html) object.
 						 *
@@ -146,7 +146,7 @@ declare const __propDef: {
 						 * @bindable
 						 * @readonly
 						 */
-						tpPane?: import('tweakpane').Pane | undefined;
+						tpPane?: import('tweakpane').Pane | undefined
 					},
 					'userCreatedPane'
 				>)
@@ -166,7 +166,7 @@ declare const __propDef: {
 				 *   vary depending on the defined `position` value.
 				 * @default `'draggable'`
 				 */
-				position: 'inline';
+				position: 'inline'
 		  } & Omit<
 				{
 					/**
@@ -184,7 +184,7 @@ declare const __propDef: {
 					 * @default `256`
 					 * @bindable
 					 */
-					width?: number;
+					width?: number
 				} & {
 					/**
 					 * Text in the pane's title bar.
@@ -192,20 +192,20 @@ declare const __propDef: {
 					 * Unless `position="inline"`, in which case the default is `undefined` and no title bar is
 					 * shown.
 					 */
-					title?: string | undefined;
+					title?: string | undefined
 					/**
 					 * Allow users to interactively expand / contract the pane by clicking its title bar.
 					 *
 					 * Hides the collapse button from the title bar when `false`.
 					 * @default `true`
 					 */
-					userExpandable?: boolean;
+					userExpandable?: boolean
 					/**
 					 * Expand or collapse the pane into its title bar.
 					 * @default `true`
 					 * @bindable
 					 */
-					expanded?: boolean;
+					expanded?: boolean
 					/**
 					 * Custom color scheme.
 					 *
@@ -224,7 +224,7 @@ declare const __propDef: {
 					 * Inherits default Tweakpane theme equivalent to `ThemeUtils.presets.standard`, or the theme
 					 * set with `setGlobalDefaultTheme()`.
 					 */
-					theme?: import('..').Theme | undefined;
+					theme?: import('..').Theme | undefined
 					/**
 					 * Scales the pane's elements by a factor of `scale` to make it easier to see.
 					 *
@@ -238,9 +238,9 @@ declare const __propDef: {
 					 * Negative values are ignored.
 					 * @default `1`
 					 */
-					scale?: number;
+					scale?: number
 					/** Internal use only. */
-					userCreatedPane?: boolean;
+					userCreatedPane?: boolean
 					/**
 					 * The internal Tweakpane [`Pane`](https://tweakpane.github.io/docs/api/classes/Pane.html) object.
 					 *
@@ -255,7 +255,7 @@ declare const __propDef: {
 					 * @bindable
 					 * @readonly
 					 */
-					tpPane?: import('tweakpane').Pane | undefined;
+					tpPane?: import('tweakpane').Pane | undefined
 				},
 				'userCreatedPane'
 		  >)
@@ -275,7 +275,7 @@ declare const __propDef: {
 				 *   vary depending on the defined `position` value.
 				 * @default `'draggable'`
 				 */
-				position?: 'draggable' | undefined;
+				position?: 'draggable' | undefined
 		  } & {
 				/**
 				 * Horizontal position of the pane relative to the left edge of the window, in pixels.
@@ -287,7 +287,7 @@ declare const __propDef: {
 				 * @default `0`
 				 * @bindable
 				 */
-				x?: number;
+				x?: number
 				/**
 				 * Vertical position of the pane relative to the top of the window, in pixels.
 				 *
@@ -298,30 +298,30 @@ declare const __propDef: {
 				 * @default `0`
 				 * @bindable
 				 */
-				y?: number;
+				y?: number
 				/**
 				 * Minimum pane width in pixels.
 				 * @default `200`
 				 */
-				minWidth?: number;
+				minWidth?: number
 				/**
 				 * Maximum pane width in pixels.
 				 * @default `600`
 				 */
-				maxWidth?: number;
+				maxWidth?: number
 				/**
 				 * Automatically collapse open panels when the available window size is less than the height
 				 * of the pane.
 				 *
 				 * @default `false`
 				 */
-				collapseChildrenToFit?: boolean;
+				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;
+				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
@@ -330,13 +330,13 @@ declare const __propDef: {
 				 * Useful for keeping the pane away from of menu bars, etc.
 				 * @default `'0'`
 				 */
-				padding?: string;
+				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;
+				resizable?: boolean
 				/**
 				 * Store the pane's position and width when the user changes it interactively.
 				 *
@@ -344,7 +344,7 @@ declare const __propDef: {
 				 * `storePositionLocally` set to `true`.
 				 * @default `true`
 				 */
-				storePositionLocally?: boolean;
+				storePositionLocally?: boolean
 				/**
 				 * Width of the pane, in pixels.
 				 *
@@ -360,7 +360,7 @@ declare const __propDef: {
 				 * @default `256`
 				 * @bindable
 				 */
-				width?: number;
+				width?: number
 		  } & Omit<
 					{
 						/**
@@ -369,20 +369,20 @@ declare const __propDef: {
 						 * Unless `position="inline"`, in which case the default is `undefined` and no title bar is
 						 * shown.
 						 */
-						title?: string | undefined;
+						title?: string | undefined
 						/**
 						 * Allow users to interactively expand / contract the pane by clicking its title bar.
 						 *
 						 * Hides the collapse button from the title bar when `false`.
 						 * @default `true`
 						 */
-						userExpandable?: boolean;
+						userExpandable?: boolean
 						/**
 						 * Expand or collapse the pane into its title bar.
 						 * @default `true`
 						 * @bindable
 						 */
-						expanded?: boolean;
+						expanded?: boolean
 						/**
 						 * Custom color scheme.
 						 *
@@ -401,7 +401,7 @@ declare const __propDef: {
 						 * Inherits default Tweakpane theme equivalent to `ThemeUtils.presets.standard`, or the theme
 						 * set with `setGlobalDefaultTheme()`.
 						 */
-						theme?: import('..').Theme | undefined;
+						theme?: import('..').Theme | undefined
 						/**
 						 * Scales the pane's elements by a factor of `scale` to make it easier to see.
 						 *
@@ -415,9 +415,9 @@ declare const __propDef: {
 						 * Negative values are ignored.
 						 * @default `1`
 						 */
-						scale?: number;
+						scale?: number
 						/** Internal use only. */
-						userCreatedPane?: boolean;
+						userCreatedPane?: boolean
 						/**
 						 * The internal Tweakpane [`Pane`](https://tweakpane.github.io/docs/api/classes/Pane.html) object.
 						 *
@@ -432,26 +432,26 @@ declare const __propDef: {
 						 * @bindable
 						 * @readonly
 						 */
-						tpPane?: import('tweakpane').Pane | undefined;
+						tpPane?: import('tweakpane').Pane | undefined
 					},
 					'userCreatedPane'
 				>)
-	);
+	)
 	events: {
-		[evt: string]: CustomEvent<any>;
-	};
+		[evt: string]: CustomEvent<any>
+	}
 	slots: {
 		/**
 		 * Any Tweakpane component, except another `<Pane>`.
 		 */
-		default: {};
-	};
-	exports?: {} | undefined;
-	bindings?: string | undefined;
-};
-export type PaneProps = typeof __propDef.props;
-export type PaneEvents = typeof __propDef.events;
-export type PaneSlots = typeof __propDef.slots;
+		default: {}
+	}
+	exports?: {} | undefined
+	bindings?: string | undefined
+}
+export type PaneProps = typeof __propDef.props
+export type PaneEvents = typeof __propDef.events
+export type PaneSlots = typeof __propDef.slots
 /**
  * The root `<Pane>` component, used for organizing controls into a single group and controlling how
  * and where the Tweakpane is displayed.
@@ -512,10 +512,10 @@ export type PaneSlots = typeof __propDef.slots;
  * @example
  * ```svelte
  * <script lang="ts">
- * import { Pane, type PanePosition, RadioGrid } from 'svelte-tweakpane-ui';
+ * import { Pane, type PanePosition, RadioGrid } from 'svelte-tweakpane-ui'
  *
- * const options: PanePosition[] = ['inline', 'fixed', 'draggable'];
- * let position: PanePosition = options[0];
+ * const options: PanePosition[] = ['inline', 'fixed', 'draggable']
+ * let position: PanePosition = options[0]
  * </script>
  *
  * <Pane {position} title="Pane" y={position === 'inline' ? undefined : 110}>
@@ -546,4 +546,4 @@ export type PaneSlots = typeof __propDef.slots;
  * [Pane.svelte](https://github.com/kitschpatrol/svelte-tweakpane-ui/blob/main/src/lib/core/Pane.svelte)
  */
 export default class Pane extends SvelteComponent<PaneProps, PaneEvents, PaneSlots> {}
-export {};
+export {}

package/dist/core/Separator.svelte

@@ -1,10 +1,10 @@
 <script>
-	import Blade from './Blade.svelte';
-	import ClsPad from '../internal/ClsPad.svelte';
-	import { BROWSER } from 'esm-env';
+	import Blade from './Blade.svelte'
+	import ClsPad from '../internal/ClsPad.svelte'
+	import { BROWSER } from 'esm-env'
 	const options = {
-		view: 'separator'
-	};
+		view: 'separator',
+	}
 </script>
 
 {#if BROWSER}

package/dist/core/Separator.svelte.d.ts

@@ -1,8 +1,8 @@
-import { SvelteComponent } from 'svelte';
+import { SvelteComponent } from 'svelte'
 import type {
 	SeparatorBladeApi as SeparatorBladeRef,
-	SeparatorBladeParams as SeparatorOptions
-} from 'tweakpane';
+	SeparatorBladeParams as SeparatorOptions,
+} from 'tweakpane'
 declare const __propDef: {
 	props: Omit<
 		{
@@ -11,19 +11,19 @@ declare const __propDef: {
 			 * [`BladeParams`](https://tweakpane.github.io/docs/api/interfaces/BaseBladeParams.html).
 			 *
 			 */
-			options: SeparatorOptions;
+			options: SeparatorOptions
 			/**
 			 * Prevent interactivity and gray out the control.
 			 * @default `false`
 			 */
-			disabled?: boolean;
+			disabled?: boolean
 			/**
 			 * Custom color scheme.
 			 * @default `undefined`  \
 			 * Inherits default Tweakpane theme equivalent to `ThemeUtils.presets.standard`, or the theme
 			 * set with `setGlobalDefaultTheme()`.
 			 */
-			theme?: import('..').Theme | undefined;
+			theme?: import('..').Theme | undefined
 			/**
 			 * Reference to internal Tweakpane
 			 * [`BladeApi`](https://tweakpane.github.io/docs/api/classes/BladeApi.html) for this blade.
@@ -36,7 +36,7 @@ declare const __propDef: {
 			 * @bindable
 			 * @readonly
 			 */
-			ref?: SeparatorBladeRef | undefined;
+			ref?: SeparatorBladeRef | undefined
 			/**
 			 * Imported Tweakpane `TpPluginBundle` (aliased as `Plugin`) module to automatically register in
 			 * the `<Blade>`'s containing `<Pane>`.
@@ -48,20 +48,20 @@ declare const __propDef: {
 			 *
 			 * @default `undefined`
 			 */
-			plugin?: import('./Blade.svelte').Plugin | undefined;
+			plugin?: import('./Blade.svelte').Plugin | undefined
 		},
 		'ref' | 'options' | 'plugin'
-	>;
+	>
 	events: {
-		[evt: string]: CustomEvent<any>;
-	};
-	slots: {};
-	exports?: {} | undefined;
-	bindings?: string | undefined;
-};
-export type SeparatorProps = typeof __propDef.props;
-export type SeparatorEvents = typeof __propDef.events;
-export type SeparatorSlots = typeof __propDef.slots;
+		[evt: string]: CustomEvent<any>
+	}
+	slots: {}
+	exports?: {} | undefined
+	bindings?: string | undefined
+}
+export type SeparatorProps = typeof __propDef.props
+export type SeparatorEvents = typeof __propDef.events
+export type SeparatorSlots = typeof __propDef.slots
 /**
  * A convenience component providing a subtle visual separator between controls, in the spirit of the
  * HTML `<hr>` element.
@@ -74,7 +74,7 @@ export type SeparatorSlots = typeof __propDef.slots;
  * @example
  * ```svelte
  * <script lang="ts">
- * import { Button, Separator } from 'svelte-tweakpane-ui';
+ * import { Button, Separator } from 'svelte-tweakpane-ui'
  * </script>
  *
  * <Button title="Oil" />
@@ -90,4 +90,4 @@ export default class Separator extends SvelteComponent<
 	SeparatorEvents,
 	SeparatorSlots
 > {}
-export {};
+export {}

package/dist/core/TabGroup.svelte

@@ -1,44 +1,44 @@
 <script>
-	import ClsPad from '../internal/ClsPad.svelte';
-	import InternalPaneInline from '../internal/InternalPaneInline.svelte';
-	import { getElementIndex, isRootPane } from '../utils.js';
-	import { BROWSER } from 'esm-env';
-	import { getContext, onDestroy, onMount, setContext } from 'svelte';
-	import { writable } from 'svelte/store';
-	export let disabled = false;
-	export let selectedIndex = 0;
-	export let theme = void 0;
-	const parentStore = getContext('parentStore');
-	const tabGroupStore = writable();
-	setContext('tabGroupStore', tabGroupStore);
-	const tabIndexStore = writable();
-	setContext('tabIndexStore', tabIndexStore);
-	const userCreatedPane = getContext('userCreatedPane');
-	let indexElement;
+	import ClsPad from '../internal/ClsPad.svelte'
+	import InternalPaneInline from '../internal/InternalPaneInline.svelte'
+	import { getElementIndex, isRootPane } from '../utils.js'
+	import { BROWSER } from 'esm-env'
+	import { getContext, onDestroy, onMount, setContext } from 'svelte'
+	import { writable } from 'svelte/store'
+	export let disabled = false
+	export let selectedIndex = 0
+	export let theme = void 0
+	const parentStore = getContext('parentStore')
+	const tabGroupStore = writable()
+	setContext('tabGroupStore', tabGroupStore)
+	const tabIndexStore = writable()
+	setContext('tabIndexStore', tabIndexStore)
+	const userCreatedPane = getContext('userCreatedPane')
+	let indexElement
 	onMount(() => {
-		$tabIndexStore = userCreatedPane ? getElementIndex(indexElement) : 0;
-	});
+		$tabIndexStore = userCreatedPane ? getElementIndex(indexElement) : 0
+	})
 	onDestroy(() => {
-		$tabGroupStore?.dispose();
-	});
+		$tabGroupStore?.dispose()
+	})
 	function setUpListeners(t) {
 		t?.on('select', (event) => {
-			selectedIndex = event.index;
-		});
+			selectedIndex = event.index
+		})
 	}
 	function setSelectedIndex(index) {
-		const tabPageApi = $tabGroupStore?.pages.at(index);
-		if (tabPageApi && !tabPageApi.selected) tabPageApi.selected = true;
+		const tabPageApi = $tabGroupStore?.pages.at(index)
+		if (tabPageApi && !tabPageApi.selected) tabPageApi.selected = true
 	}
-	$: setUpListeners($tabGroupStore);
-	$: setSelectedIndex(selectedIndex);
-	$: $tabGroupStore && ($tabGroupStore.disabled = disabled);
+	$: setUpListeners($tabGroupStore)
+	$: setSelectedIndex(selectedIndex)
+	$: $tabGroupStore && ($tabGroupStore.disabled = disabled)
 	$: theme &&
 		$parentStore &&
 		(userCreatedPane || !isRootPane($parentStore)) &&
 		console.warn(
-			'Set theme on the <Pane> component, not on its children! (Check nested <TabGroup> components for a theme prop.)'
-		);
+			'Set theme on the <Pane> component, not on its children! (Check nested <TabGroup> components for a theme prop.)',
+		)
 </script>
 
 {#if parentStore}

package/dist/core/TabGroup.svelte.d.ts

@@ -1,11 +1,11 @@
-import { SvelteComponent } from 'svelte';
-import type { Theme } from '../theme.js';
+import { SvelteComponent } from 'svelte'
+import type { Theme } from '../theme.js'
 declare const __propDef: {
 	props: {
 		/**
 		 * Prevent interactivity and gray out the control.
 		 * @default `false`
-		 * */ disabled?: boolean;
+		 * */ disabled?: boolean
 		/**
 		 * Active page index.
 		 *
@@ -13,29 +13,29 @@ declare const __propDef: {
 		 * index.
 		 * @default `0`
 		 * @bindable
-		 * */ selectedIndex?: number;
+		 * */ selectedIndex?: number
 		/**
 		 * Custom color scheme.
 		 * @default `undefined`  \
 		 * Inherits default Tweakpane theme equivalent to `ThemeUtils.presets.standard`, or the theme
 		 * set with `setGlobalDefaultTheme()`.
-		 * */ theme?: Theme | undefined;
-	};
+		 * */ theme?: Theme | undefined
+	}
 	events: {
-		[evt: string]: CustomEvent<any>;
-	};
+		[evt: string]: CustomEvent<any>
+	}
 	slots: {
 		/**
 		 * A `<TabPage>` component.
 		 */
-		default: {};
-	};
-	exports?: {} | undefined;
-	bindings?: string | undefined;
-};
-export type TabGroupProps = typeof __propDef.props;
-export type TabGroupEvents = typeof __propDef.events;
-export type TabGroupSlots = typeof __propDef.slots;
+		default: {}
+	}
+	exports?: {} | undefined
+	bindings?: string | undefined
+}
+export type TabGroupProps = typeof __propDef.props
+export type TabGroupEvents = typeof __propDef.events
+export type TabGroupSlots = typeof __propDef.slots
 /**
  * Contains a collection of `<TabPage>` components to be presented as a tabs.
  *
@@ -50,7 +50,7 @@ export type TabGroupSlots = typeof __propDef.slots;
  * @example
  * ```svelte
  * <script lang="ts">
- * import { Button, TabGroup, TabPage } from 'svelte-tweakpane-ui';
+ * import { Button, TabGroup, TabPage } from 'svelte-tweakpane-ui'
  * </script>
  *
  * <TabGroup>
@@ -71,4 +71,4 @@ export default class TabGroup extends SvelteComponent<
 	TabGroupEvents,
 	TabGroupSlots
 > {}
-export {};
+export {}