svelte-tweakpane-ui 1.5.2 → 1.5.4

package/dist/control/File.svelte.d.ts

@@ -1,7 +1,7 @@
-import { SvelteComponent } from 'svelte';
-import type { ValueChangeEvent } from '../utils.js';
-export type FileValue = File | undefined;
-export type FileChangeEvent = ValueChangeEvent<FileValue>;
+import { SvelteComponent } from 'svelte'
+import type { ValueChangeEvent } from '../utils.js'
+export type FileValue = File | undefined
+export type FileChangeEvent = ValueChangeEvent<FileValue>
 declare const __propDef: {
 	props: {
 		/**
@@ -9,22 +9,22 @@ declare const __propDef: {
 		 * @default `undefined`
 		 * @bindable
 		 */
-		value?: FileValue;
+		value?: FileValue
 		/**
 		 * Array of valid file extensions.
 		 * @default Any file extension
 		 */
-		extensions?: string[] | undefined;
+		extensions?: string[] | undefined
 		/**
 		 * String shown when the user tries to upload an invalid filetype.
 		 * @default `'Unaccepted file type.'`
 		 */
-		invalidExtensionMessage?: string | undefined;
+		invalidExtensionMessage?: string | undefined
 		/**
 		 * Height of the file input drop zone, in rows.
 		 * @default `3`
 		 */
-		rows?: number | undefined;
+		rows?: number | undefined
 	} & Omit<
 		{
 			/**
@@ -32,26 +32,26 @@ declare const __propDef: {
 			 * @default `undefined`
 			 * @bindable
 			 */
-			value: string | File | null;
+			value: string | File | null
 		} & Omit<
 			{
 				/**
 				 * The binding's target object with values to manipulate.
 				 * @bindable
 				 */
-				object: import('@tweakpane/core').Bindable & Record<string, string | File | null>;
+				object: import('@tweakpane/core').Bindable & Record<string, string | File | null>
 				/** The key for the value in the target `object` that the control should manipulate. */
-				key: string;
+				key: string
 				/**
 				 * Prevent interactivity and gray out the control.
 				 * @default `false`
 				 */
-				disabled?: boolean;
+				disabled?: boolean
 				/**
 				 * Text displayed next to control.
 				 * @default `undefined`
 				 */
-				label?: string | undefined;
+				label?: string | undefined
 				/**
 				 * Tweakpane's internal options object.
 				 *
@@ -64,7 +64,7 @@ declare const __propDef: {
 				 * Tweakpane UI_.
 				 * @default `undefined`
 				 */
-				options?: import('@tweakpane/core').BaseInputParams | undefined;
+				options?: import('@tweakpane/core').BaseInputParams | undefined
 				/**
 				 * Custom color scheme.
 				 *
@@ -72,7 +72,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
 				/**
 				 * Reference to internal Tweakpane
 				 * [`BindingApi`](https://tweakpane.github.io/docs/api/classes/_internal_.BindingApi.html) for
@@ -86,7 +86,7 @@ declare const __propDef: {
 				 * @bindable
 				 * @readonly
 				 */
-				ref?: import('../internal/GenericInput.svelte').GenericInputRef | undefined;
+				ref?: import('../internal/GenericInput.svelte').GenericInputRef | undefined
 				/**
 				 * Imported Tweakpane `TpPluginBundle` (aliased as `Plugin`) module to automatically register in
 				 * the `<Binding>`'s containing `<Pane>`.
@@ -98,13 +98,13 @@ declare const __propDef: {
 				 *
 				 * @default `undefined`
 				 */
-				plugin?: import('../utils.js').Plugin | undefined;
+				plugin?: import('../utils.js').Plugin | undefined
 			},
 			'object' | 'key'
 		>,
 		'ref' | 'plugin' | 'value'
-	>;
-	slots: {};
+	>
+	slots: {}
 	events: {
 		/**
 		 * Fires when `value` changes.
@@ -117,12 +117,12 @@ declare const __propDef: {
 		 * @extends ValueChangeEvent
 		 * @event
 		 * */
-		change: FileChangeEvent;
-	};
-};
-export type FileProps = typeof __propDef.props;
-export type FileEvents = typeof __propDef.events;
-export type FileSlots = typeof __propDef.slots;
+		change: FileChangeEvent
+	}
+}
+export type FileProps = typeof __propDef.props
+export type FileEvents = typeof __propDef.events
+export type FileSlots = typeof __propDef.slots
 /**
  * A file input control.
  *
@@ -144,26 +144,26 @@ export type FileSlots = typeof __propDef.slots;
  * @example
  * ```svelte
  * <script lang="ts">
- *  import { File, type FileValue } from '..';
+ *  import { File, type FileValue } from '..'
  *
- *  let file: FileValue;
+ *  let file: FileValue
  *
  *  async function getFileBase64(file: FileValue): Promise<string> {
- *    if (file === undefined) return 'Your bytes here...';
+ *    if (file === undefined) return 'Your bytes here...'
  *    return new Promise((resolve, reject) => {
- *      const reader = new FileReader();
+ *      const reader = new FileReader()
  *      reader.addEventListener('load', () => {
- *        const { result } = reader;
- *        if (result && typeof result === 'string') resolve(result);
- *        else reject(new Error('Empty result'));
- *      });
- *      reader.addEventListener('error', reject);
- *      reader.readAsDataURL(file);
- *    });
+ *        const { result } = reader
+ *        if (result && typeof result === 'string') resolve(result)
+ *        else reject(new Error('Empty result'))
+ *      })
+ *      reader.addEventListener('error', reject)
+ *      reader.readAsDataURL(file)
+ *    })
  *  }
  *
  *  function truncate(text: string, length: number) {
- *    return text.length > length ? text.slice(0, length - 1) + '...' : text;
+ *    return text.length > length ? text.slice(0, length - 1) + '...' : text
  *  }
  * </script>
  *
@@ -201,4 +201,4 @@ export type FileSlots = typeof __propDef.slots;
  * [File.svelte](https://github.com/kitschpatrol/svelte-tweakpane-ui/blob/main/src/lib/control/File.svelte)
  */
 export default class File extends SvelteComponent<FileProps, FileEvents, FileSlots> {}
-export {};
+export {}

package/dist/control/Image.svelte

@@ -1,48 +1,48 @@
 <script context="module"></script>
 
 <script>
-	import ClsPad from '../internal/ClsPad.svelte';
-	import GenericInput from '../internal/GenericInput.svelte';
-	import { fillWith } from '../utils';
-	import * as pluginModule from '@kitschpatrol/tweakpane-plugin-image';
-	import { BROWSER } from 'esm-env';
-	import { shallowEqual } from 'fast-equals';
-	export let value = void 0;
-	export let fit = void 0;
-	export let extensions = void 0;
-	let internalValue = 'placeholder';
+	import ClsPad from '../internal/ClsPad.svelte'
+	import GenericInput from '../internal/GenericInput.svelte'
+	import { fillWith } from '../utils'
+	import * as pluginModule from '@kitschpatrol/tweakpane-plugin-image'
+	import { BROWSER } from 'esm-env'
+	import { shallowEqual } from 'fast-equals'
+	export let value = void 0
+	export let fit = void 0
+	export let extensions = void 0
+	let internalValue = 'placeholder'
 	function updateInternalValueFromValue() {
-		const newInternalValue = value ?? 'placeholder';
+		const newInternalValue = value ?? 'placeholder'
 		if (!shallowEqual(internalValue, newInternalValue)) {
-			internalValue = newInternalValue;
+			internalValue = newInternalValue
 		}
 	}
 	function updateValueFromInternalValue() {
 		if (internalValue === 'placeholder') {
 			if (value !== void 0) {
-				value = void 0;
+				value = void 0
 			}
 		} else if (internalValue instanceof HTMLImageElement) {
 			if (value !== internalValue.src) {
-				value = internalValue.src;
+				value = internalValue.src
 			}
 		} else if (internalValue instanceof File) {
-			console.warn('Image control does not support File objects.');
+			console.warn('Image control does not support File objects.')
 			if (value !== void 0) {
-				value = void 0;
+				value = void 0
 			}
 		} else if (value !== internalValue) {
-			value = internalValue;
+			value = internalValue
 		}
 	}
-	let options;
+	let options
 	$: options = {
 		extensions,
 		imageFit: fit,
-		view: 'input-image'
-	};
-	$: value, updateInternalValueFromValue();
-	$: internalValue, updateValueFromInternalValue();
+		view: 'input-image',
+	}
+	$: value, updateInternalValueFromValue()
+	$: internalValue, updateValueFromInternalValue()
 </script>
 
 <GenericInput

package/dist/control/Image.svelte.d.ts

@@ -1,7 +1,7 @@
-import { SvelteComponent } from 'svelte';
-import type { ValueChangeEvent } from '../utils.js';
-export type ImageValue = string | undefined;
-export type ImageChangeEvent = ValueChangeEvent<ImageValue>;
+import { SvelteComponent } from 'svelte'
+import type { ValueChangeEvent } from '../utils.js'
+export type ImageValue = string | undefined
+export type ImageChangeEvent = ValueChangeEvent<ImageValue>
 declare const __propDef: {
 	props: {
 		/**
@@ -9,19 +9,19 @@ declare const __propDef: {
 		 * @default `'undefined'`
 		 * @bindable
 		 */
-		value?: ImageValue;
+		value?: ImageValue
 		/**
 		 * Array of image extension types to accept.
 		 * @default `['.jpg', '.png', '.gif']`
 		 */
-		extensions?: string[];
+		extensions?: string[]
 		/**
 		 * How to display the image in the preview pane.
 		 *
 		 * Renamed from `imageFit` in `tweakpane-image-plugin` for concision.
 		 * @default `'cover'`
 		 */
-		fit?: 'contain' | 'cover';
+		fit?: 'contain' | 'cover'
 	} & Omit<
 		{
 			/**
@@ -29,7 +29,7 @@ declare const __propDef: {
 			 * @default `'undefined'`
 			 * @bindable
 			 */
-			value: string | HTMLImageElement | File | undefined;
+			value: string | HTMLImageElement | File | undefined
 		} & Omit<
 			{
 				/**
@@ -37,19 +37,19 @@ declare const __propDef: {
 				 * @bindable
 				 */
 				object: import('@tweakpane/core').Bindable &
-					Record<string, string | HTMLImageElement | File | undefined>;
+					Record<string, string | HTMLImageElement | File | undefined>
 				/** The key for the value in the target `object` that the control should manipulate. */
-				key: string;
+				key: string
 				/**
 				 * Prevent interactivity and gray out the control.
 				 * @default `false`
 				 */
-				disabled?: boolean;
+				disabled?: boolean
 				/**
 				 * Text displayed next to control.
 				 * @default `undefined`
 				 */
-				label?: string | undefined;
+				label?: string | undefined
 				/**
 				 * Tweakpane's internal options object.
 				 *
@@ -62,7 +62,7 @@ declare const __propDef: {
 				 * Tweakpane UI_.
 				 * @default `undefined`
 				 */
-				options?: import('@tweakpane/core').BaseInputParams | undefined;
+				options?: import('@tweakpane/core').BaseInputParams | undefined
 				/**
 				 * Custom color scheme.
 				 *
@@ -70,7 +70,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
 				/**
 				 * Reference to internal Tweakpane
 				 * [`BindingApi`](https://tweakpane.github.io/docs/api/classes/_internal_.BindingApi.html) for
@@ -84,7 +84,7 @@ declare const __propDef: {
 				 * @bindable
 				 * @readonly
 				 */
-				ref?: import('../internal/GenericInput.svelte').GenericInputRef | undefined;
+				ref?: import('../internal/GenericInput.svelte').GenericInputRef | undefined
 				/**
 				 * Imported Tweakpane `TpPluginBundle` (aliased as `Plugin`) module to automatically register in
 				 * the `<Binding>`'s containing `<Pane>`.
@@ -96,13 +96,13 @@ declare const __propDef: {
 				 *
 				 * @default `undefined`
 				 */
-				plugin?: import('../utils.js').Plugin | undefined;
+				plugin?: import('../utils.js').Plugin | undefined
 			},
 			'object' | 'key'
 		>,
 		'ref' | 'plugin' | 'value'
-	>;
-	slots: {};
+	>
+	slots: {}
 	events: {
 		/**
 		 * Fires when `value` changes.
@@ -115,12 +115,12 @@ declare const __propDef: {
 		 * @extends ValueChangeEvent
 		 * @event
 		 * */
-		change: ImageChangeEvent;
-	};
-};
-export type ImageProps = typeof __propDef.props;
-export type ImageEvents = typeof __propDef.events;
-export type ImageSlots = typeof __propDef.slots;
+		change: ImageChangeEvent
+	}
+}
+export type ImageProps = typeof __propDef.props
+export type ImageEvents = typeof __propDef.events
+export type ImageSlots = typeof __propDef.slots
 /**
  * An image input control.
  *
@@ -145,23 +145,23 @@ export type ImageSlots = typeof __propDef.slots;
  * @example
  * ```svelte
  * <script lang="ts">
- * import { Button, Image, type ImageValue } from '..';
+ * import { Button, Image, type ImageValue } from '..'
  *
- * let source: ImageValue;
+ * let source: ImageValue
  *
  * async function getRandomKittenUrl() {
  *   const { url } = await fetch('https://loremflickr.com/800/800/kitten', {
  *     method: 'HEAD',
- *     redirect: 'follow'
- *   });
- *   return url;
+ *     redirect: 'follow',
+ *   })
+ *   return url
  * }
  * </script>
  *
  * <Image bind:value={source} fit="contain" label="Image" />
  * <Button
  * on:click={async () => {
- *   source = await getRandomKittenUrl();
+ *   source = await getRandomKittenUrl()
  * }}
  * label="Random Placeholder"
  * title="Load Kitten"
@@ -202,4 +202,4 @@ export type ImageSlots = typeof __propDef.slots;
  * [Image.svelte](https://github.com/kitschpatrol/svelte-tweakpane-ui/blob/main/src/lib/control/Image.svelte)
  */
 export default class Image extends SvelteComponent<ImageProps, ImageEvents, ImageSlots> {}
-export {};
+export {}

package/dist/control/IntervalSlider.svelte

@@ -1,52 +1,52 @@
 <script context="module"></script>
 
 <script>
-	import GenericSlider from '../internal/GenericSlider.svelte';
-	import * as pluginModule from '@kitschpatrol/tweakpane-plugin-essentials';
-	import { shallowEqual } from 'fast-equals';
-	export let value;
-	export let meanValue = void 0;
-	export let wide = void 0;
-	let internalValue;
+	import GenericSlider from '../internal/GenericSlider.svelte'
+	import * as pluginModule from '@kitschpatrol/tweakpane-plugin-essentials'
+	import { shallowEqual } from 'fast-equals'
+	export let value
+	export let meanValue = void 0
+	export let wide = void 0
+	let internalValue
 	function updateInternalValueFromValue() {
-		const newInternalValue = Array.isArray(value) ? { min: value[0], max: value[1] } : value;
+		const newInternalValue = Array.isArray(value) ? { min: value[0], max: value[1] } : value
 		if (!shallowEqual(internalValue, newInternalValue)) {
-			internalValue = { ...newInternalValue };
+			internalValue = { ...newInternalValue }
 		}
 	}
 	function updateValueFromInternalValue() {
 		if (Array.isArray(value)) {
-			const newValue = [internalValue.min, internalValue.max];
+			const newValue = [internalValue.min, internalValue.max]
 			if (!shallowEqual(value, newValue)) {
-				value = newValue;
+				value = newValue
 			}
 		} else if (!shallowEqual(value, internalValue)) {
-			value = { ...internalValue };
+			value = { ...internalValue }
 		}
 	}
 	function updateValueFromMean() {
 		if (meanValue !== void 0) {
-			const r = internalValue.max - internalValue.min;
-			const valueFromMean = { min: meanValue - r / 2, max: meanValue + r / 2 };
+			const r = internalValue.max - internalValue.min
+			const valueFromMean = { min: meanValue - r / 2, max: meanValue + r / 2 }
 			if (!shallowEqual(valueFromMean, internalValue)) {
-				internalValue = valueFromMean;
+				internalValue = valueFromMean
 			}
 		}
 	}
-	let ref;
+	let ref
 	function updateWide(wide2) {
-		const inputField = ref?.element.querySelector('div.tp-rsltxtv_t');
+		const inputField = ref?.element.querySelector('div.tp-rsltxtv_t')
 		if (wide2) {
-			inputField?.style.setProperty('display', 'none');
+			inputField?.style.setProperty('display', 'none')
 		} else {
-			inputField?.style.removeProperty('display');
+			inputField?.style.removeProperty('display')
 		}
 	}
-	$: ref && wide !== void 0 && updateWide(wide);
-	$: value, updateInternalValueFromValue();
-	$: internalValue, updateValueFromInternalValue();
-	$: meanValue = (internalValue.min + internalValue.max) / 2;
-	$: meanValue, updateValueFromMean();
+	$: ref && wide !== void 0 && updateWide(wide)
+	$: value, updateInternalValueFromValue()
+	$: internalValue, updateValueFromInternalValue()
+	$: meanValue = (internalValue.min + internalValue.max) / 2
+	$: meanValue, updateValueFromMean()
 </script>
 
 <GenericSlider