svelte-tweakpane-ui 1.5.3 → 1.5.4

package/dist/theme.d.ts

@@ -1,89 +1,89 @@
-import type { Simplify } from './utils';
-import { type RgbaColorObject, type RgbColorObject } from '@tweakpane/core';
-export type ThemeColorValue = Simplify<RgbaColorObject | RgbColorObject | string>;
-export type Theme = CustomThemeKeys & ThemeKeys;
+import type { Simplify } from './utils'
+import { type RgbaColorObject, type RgbColorObject } from '@tweakpane/core'
+export type ThemeColorValue = Simplify<RgbaColorObject | RgbColorObject | string>
+export type Theme = CustomThemeKeys & ThemeKeys
 type ThemeKeys = {
-	baseBackgroundColor?: ThemeColorValue;
-	baseBorderRadius?: string;
-	baseFontFamily?: string;
-	baseShadowColor?: ThemeColorValue;
-	bladeBorderRadius?: string;
-	bladeHorizontalPadding?: string;
-	bladeValueWidth?: string;
-	buttonBackgroundColor?: ThemeColorValue;
-	buttonBackgroundColorActive?: ThemeColorValue;
-	buttonBackgroundColorFocus?: ThemeColorValue;
-	buttonBackgroundColorHover?: ThemeColorValue;
-	buttonForegroundColor?: ThemeColorValue;
-	containerBackgroundColor?: ThemeColorValue;
-	containerBackgroundColorActive?: ThemeColorValue;
-	containerBackgroundColorFocus?: ThemeColorValue;
-	containerBackgroundColorHover?: ThemeColorValue;
-	containerForegroundColor?: ThemeColorValue;
-	containerHorizontalPadding?: string;
-	containerUnitSize?: string;
-	containerUnitSpacing?: string;
-	containerVerticalPadding?: string;
-	grooveForegroundColor?: ThemeColorValue;
-	inputBackgroundColor?: ThemeColorValue;
-	inputBackgroundColorActive?: ThemeColorValue;
-	inputBackgroundColorFocus?: ThemeColorValue;
-	inputBackgroundColorHover?: ThemeColorValue;
-	inputForegroundColor?: ThemeColorValue;
-	labelForegroundColor?: ThemeColorValue;
-	monitorBackgroundColor?: ThemeColorValue;
-	monitorForegroundColor?: ThemeColorValue;
-	pluginImageDraggingColor?: ThemeColorValue;
-};
-type CustomThemeKeys = Record<string, ThemeColorValue>;
-export declare const keys: Record<string, string>;
+	baseBackgroundColor?: ThemeColorValue
+	baseBorderRadius?: string
+	baseFontFamily?: string
+	baseShadowColor?: ThemeColorValue
+	bladeBorderRadius?: string
+	bladeHorizontalPadding?: string
+	bladeValueWidth?: string
+	buttonBackgroundColor?: ThemeColorValue
+	buttonBackgroundColorActive?: ThemeColorValue
+	buttonBackgroundColorFocus?: ThemeColorValue
+	buttonBackgroundColorHover?: ThemeColorValue
+	buttonForegroundColor?: ThemeColorValue
+	containerBackgroundColor?: ThemeColorValue
+	containerBackgroundColorActive?: ThemeColorValue
+	containerBackgroundColorFocus?: ThemeColorValue
+	containerBackgroundColorHover?: ThemeColorValue
+	containerForegroundColor?: ThemeColorValue
+	containerHorizontalPadding?: string
+	containerUnitSize?: string
+	containerUnitSpacing?: string
+	containerVerticalPadding?: string
+	grooveForegroundColor?: ThemeColorValue
+	inputBackgroundColor?: ThemeColorValue
+	inputBackgroundColorActive?: ThemeColorValue
+	inputBackgroundColorFocus?: ThemeColorValue
+	inputBackgroundColorHover?: ThemeColorValue
+	inputForegroundColor?: ThemeColorValue
+	labelForegroundColor?: ThemeColorValue
+	monitorBackgroundColor?: ThemeColorValue
+	monitorForegroundColor?: ThemeColorValue
+	pluginImageDraggingColor?: ThemeColorValue
+}
+type CustomThemeKeys = Record<string, ThemeColorValue>
+export declare const keys: Record<string, string>
 export declare const presets: {
 	/** Dark blue theme. */
-	iceberg: Theme;
+	iceberg: Theme
 	/** Extra dark theme. */
-	jetblack: Theme;
+	jetblack: Theme
 	/** Standard Tweakpane light theme. */
-	light: Theme;
+	light: Theme
 	/** Light theme with CRT vibes. */
-	retro: Theme;
+	retro: Theme
 	/** Standard Tweakpane dark theme. This is the default theme. */
-	standard: Theme;
+	standard: Theme
 	/** Dark translucent theme. */
-	translucent: Theme;
+	translucent: Theme
 	/** Red theme. */
-	vivid: Theme;
-};
+	vivid: Theme
+}
 /**
  * Used during SSR to calculate metrics Returns CSS string.
  */
-export declare function getValueOrFallback(theme: Theme | undefined, key: keyof ThemeKeys): string;
-export declare function applyTheme(element: HTMLElement, theme: Theme | undefined): void;
+export declare function getValueOrFallback(theme: Theme | undefined, key: keyof ThemeKeys): string
+export declare function applyTheme(element: HTMLElement, theme: Theme | undefined): void
 /**
  * Sets a default theme for all Tweakpane components on the page. Useful if you have a light / dark
  * mode toggle.
  */
-export declare function setGlobalDefaultTheme(theme: Theme | undefined): void;
+export declare function setGlobalDefaultTheme(theme: Theme | undefined): void
 declare const _default: {
 	/**
 	 * A collection of default theme color schemes, matching those provided in the Tweakpane
 	 * [Panebuilder presets](https://tweakpane.github.io/docs/theming/#builder).
-	 * */
+	 */
 	presets: {
 		/** Dark blue theme. */
-		iceberg: Theme;
+		iceberg: Theme
 		/** Extra dark theme. */
-		jetblack: Theme;
+		jetblack: Theme
 		/** Standard Tweakpane light theme. */
-		light: Theme;
+		light: Theme
 		/** Light theme with CRT vibes. */
-		retro: Theme;
+		retro: Theme
 		/** Standard Tweakpane dark theme. This is the default theme. */
-		standard: Theme;
+		standard: Theme
 		/** Dark translucent theme. */
-		translucent: Theme;
+		translucent: Theme
 		/** Red theme. */
-		vivid: Theme;
-	};
-	setGlobalDefaultTheme: typeof setGlobalDefaultTheme;
-};
-export default _default;
+		vivid: Theme
+	}
+	setGlobalDefaultTheme: typeof setGlobalDefaultTheme
+}
+export default _default

package/dist/theme.js

@@ -1,4 +1,4 @@
-import { getWindowDocument, isRgbaColorObject, isRgbColorObject } from '@tweakpane/core';
+import { getWindowDocument, isRgbaColorObject, isRgbColorObject } from '@tweakpane/core'
 // Standard Tweakpane themes from https://tweakpane.github.io/docs/theming/#builder Must be kept in
 // sync with TP...
 const standard = {
@@ -32,14 +32,15 @@ const standard = {
 	labelForegroundColor: 'rgba(187, 188, 196, 0.7)',
 	monitorBackgroundColor: 'rgba(0, 0, 0, 0.2)',
 	monitorForegroundColor: 'rgba(187, 188, 196, 0.7)',
-	pluginImageDraggingColor: 'hsla(230, 100%, 66%, 1)'
+	pluginImageDraggingColor: 'hsla(230, 100%, 66%, 1)',
 	// PluginThumbnailListHeight: '400px', pluginThumbnailListThumbSize: '20px',
 	// pluginThumbnailListWidth: '200px'
-};
+}
+// eslint-disable-next-line unicorn/no-array-reduce
 export const keys = Object.keys(standard).reduce((acc, key) => {
-	acc[key] = key;
-	return acc;
-}, {});
+	acc[key] = key
+	return acc
+}, {})
 const light = {
 	baseBackgroundColor: 'hsla(230, 5%, 90%, 1.00)',
 	baseShadowColor: 'hsla(0, 0%, 0%, 0.10)',
@@ -61,8 +62,8 @@ const light = {
 	inputForegroundColor: 'hsla(230, 10%, 30%, 1.00)',
 	labelForegroundColor: 'hsla(230, 10%, 30%, 0.70)',
 	monitorBackgroundColor: 'hsla(230, 15%, 30%, 0.10)',
-	monitorForegroundColor: 'hsla(230, 10%, 30%, 0.50)'
-};
+	monitorForegroundColor: 'hsla(230, 10%, 30%, 0.50)',
+}
 const iceberg = {
 	baseBackgroundColor: 'hsla(230, 20%, 11%, 1.00)',
 	baseShadowColor: 'hsla(0, 0%, 0%, 0.20)',
@@ -84,8 +85,8 @@ const iceberg = {
 	inputForegroundColor: 'hsla(230, 10%, 80%, 1.00)',
 	labelForegroundColor: 'hsla(230, 12%, 48%, 1.00)',
 	monitorBackgroundColor: 'hsla(230, 20%, 8%, 1.00)',
-	monitorForegroundColor: 'hsla(230, 12%, 48%, 1.00)'
-};
+	monitorForegroundColor: 'hsla(230, 12%, 48%, 1.00)',
+}
 const jetblack = {
 	baseBackgroundColor: 'hsla(0, 0%, 0%, 1.00)',
 	baseShadowColor: 'hsla(0, 0%, 0%, 0.2)',
@@ -107,8 +108,8 @@ const jetblack = {
 	inputForegroundColor: 'hsla(0, 0%, 70%, 1.00)',
 	labelForegroundColor: 'hsla(0, 0%, 50%, 1.00)',
 	monitorBackgroundColor: 'hsla(0, 0%, 8%, 1.00)',
-	monitorForegroundColor: 'hsla(0, 0%, 48%, 1.00)'
-};
+	monitorForegroundColor: 'hsla(0, 0%, 48%, 1.00)',
+}
 const retro = {
 	baseBackgroundColor: 'hsla(40, 3%, 90%, 1.00)',
 	baseShadowColor: 'hsla(0, 0%, 0%, 0.30)',
@@ -130,8 +131,8 @@ const retro = {
 	inputForegroundColor: 'hsla(120, 40%, 60%, 1.00)',
 	labelForegroundColor: 'hsla(40, 3%, 50%, 1.00)',
 	monitorBackgroundColor: 'hsla(120, 3%, 20%, 1.00)',
-	monitorForegroundColor: 'hsla(120, 40%, 60%, 0.80)'
-};
+	monitorForegroundColor: 'hsla(120, 40%, 60%, 0.80)',
+}
 const translucent = {
 	baseBackgroundColor: 'hsla(0, 0%, 10%, 0.80)',
 	baseShadowColor: 'hsla(0, 0%, 0%, 0.20)',
@@ -153,8 +154,8 @@ const translucent = {
 	inputForegroundColor: 'hsla(0, 0%, 100%, 0.50)',
 	labelForegroundColor: 'hsla(0, 0%, 100%, 0.50)',
 	monitorBackgroundColor: 'hsla(0, 0%, 0%, 0.30)',
-	monitorForegroundColor: 'hsla(0, 0%, 100%, 0.30)'
-};
+	monitorForegroundColor: 'hsla(0, 0%, 100%, 0.30)',
+}
 const vivid = {
 	baseBackgroundColor: 'hsla(0, 80%, 40%, 1)',
 	baseShadowColor: 'hsla(0, 0%, 0%, 0.2)',
@@ -176,8 +177,8 @@ const vivid = {
 	inputForegroundColor: 'hsla(0, 0%, 100%, 0.9)',
 	labelForegroundColor: 'hsla(0, 0%, 100%, 0.9)',
 	monitorBackgroundColor: 'hsla(0, 0%, 0%, 0.5)',
-	monitorForegroundColor: 'hsla(0, 0%, 100%, 0.5)'
-};
+	monitorForegroundColor: 'hsla(0, 0%, 100%, 0.5)',
+}
 export const presets = {
 	/** Dark blue theme. */
 	iceberg,
@@ -192,8 +193,8 @@ export const presets = {
 	/** Dark translucent theme. */
 	translucent,
 	/** Red theme. */
-	vivid
-};
+	vivid,
+}
 // More humane theme names... Note that the shorthand variables don't work
 const keyToCssVariableMap = new Map([
 	// Tweakpane
@@ -228,76 +229,70 @@ const keyToCssVariableMap = new Map([
 	['monitorBackgroundColor', '--tp-monitor-background-color'],
 	['monitorForegroundColor', '--tp-monitor-foreground-color'],
 	// Plugins
-	['pluginImageDraggingColor', '--tp-plugin-image-dragging-color']
+	['pluginImageDraggingColor', '--tp-plugin-image-dragging-color'],
 	// ['pluginThumbnailListHeight', '--tp-plugin-thumbnail-list-height'],
 	// ['pluginThumbnailListThumbSize', '--tp-plugin-thumbnail-list-thumb-size'],
 	// ['pluginThumbnailListWidth', '--tp-plugin-thumbnail-list-width']
-]);
+])
 // Just do it dynamically instead of the map? function transformToCustomProperty(str: string):
 // string { return '--tp-' + str.replace(/([a-zA-Z])(?=[A-Z])/g, '$1-').toLowerCase();
 // }
 function stringToCssValue(v) {
 	if (v === undefined) {
-		return undefined;
+		return undefined
 	}
 	if (typeof v === 'string') {
-		return v;
+		return v
 	}
 	if (isRgbaColorObject(v)) {
-		return `rgba(${v.r}, ${v.g}, ${v.b}, ${v.a})`;
+		return `rgba(${v.r}, ${v.g}, ${v.b}, ${v.a})`
 	}
 	if (isRgbColorObject(v)) {
-		return `rgb(${v.r}, ${v.g}, ${v.b})`;
+		return `rgb(${v.r}, ${v.g}, ${v.b})`
 	}
 }
 function expandVariableKey(name) {
 	// Pass explicit variables through
 	if (name.startsWith('--tp-')) {
-		return name;
+		return name
 	}
-	const variableName = keyToCssVariableMap.get(name);
+	const variableName = keyToCssVariableMap.get(name)
 	if (variableName) {
-		return variableName;
+		return variableName
 	}
-	throw new Error(`Unknown Tweakpane CSS theme map variable key: "${name}"`);
+	throw new Error(`Unknown Tweakpane CSS theme map variable key: "${name}"`)
 }
 /**
  * Used during SSR to calculate metrics Returns CSS string.
  */
 export function getValueOrFallback(theme, key) {
-	return theme?.[key] === undefined
-		? stringToCssValue(standard[key])
-		: stringToCssValue(theme[key]);
+	return theme?.[key] === undefined ? stringToCssValue(standard[key]) : stringToCssValue(theme[key])
 }
 export function applyTheme(element, theme) {
-	const rootDocument = getWindowDocument().documentElement;
+	const rootDocument = getWindowDocument().documentElement
 	if (theme === undefined) {
 		for (const k of Object.keys(standard)) {
-			const key = expandVariableKey(k);
+			const key = expandVariableKey(k)
 			if (element.style.getPropertyValue(key).length > 0) {
-				element.style.removeProperty(key);
+				element.style.removeProperty(key)
 			}
 		}
 	} else {
 		for (const [k, v] of Object.entries(theme)) {
-			const key = expandVariableKey(k);
-			const value = stringToCssValue(v);
+			const key = expandVariableKey(k)
+			const value = stringToCssValue(v)
 			// Only set the variable if it deviates from the standard theme or  the root theme (set
 			// by setGlobalDefaultTheme).... but if theme is explicitly standard and not undefined,
 			// then apply it anyway so that any global theme is overridden TODO normalize color
 			// representation for comparison? TODO tests for this logic
-			const standardValue = standard[k] || undefined;
-			const rootValue = rootDocument.style.getPropertyValue(key) || undefined;
-			const isDeviationFromRoot = (rootValue && value !== rootValue) ?? false;
-			const isDeviationFromStandard = (standardValue && value !== standardValue) ?? false;
-			if (
-				theme !== undefined &&
-				value !== undefined &&
-				(isDeviationFromRoot || (!rootValue && isDeviationFromStandard))
-			) {
-				element.style.setProperty(key, value);
+			const standardValue = standard[k] || undefined
+			const rootValue = rootDocument.style.getPropertyValue(key) || undefined
+			const isDeviationFromRoot = (rootValue && value !== rootValue) ?? false
+			const isDeviationFromStandard = (standardValue && value !== standardValue) ?? false
+			if (value !== undefined && (isDeviationFromRoot || (!rootValue && isDeviationFromStandard))) {
+				element.style.setProperty(key, value)
 			} else if (element.style.getPropertyValue(key).length > 0) {
-				element.style.removeProperty(key);
+				element.style.removeProperty(key)
 			}
 		}
 	}
@@ -308,8 +303,9 @@ export function applyTheme(element, theme) {
  */
 export function setGlobalDefaultTheme(theme) {
 	// Wait for dom ready... better outside?
+	// eslint-disable-next-line unicorn/prefer-global-this, ts/no-unnecessary-condition
 	if (window?.document) {
-		applyTheme(getWindowDocument().documentElement, theme);
+		applyTheme(getWindowDocument().documentElement, theme)
 	}
 }
 // Library exports
@@ -317,7 +313,7 @@ export default {
 	/**
 	 * A collection of default theme color schemes, matching those provided in the Tweakpane
 	 * [Panebuilder presets](https://tweakpane.github.io/docs/theming/#builder).
-	 * */
+	 */
 	presets,
-	setGlobalDefaultTheme
-};
+	setGlobalDefaultTheme,
+}

package/dist/utils.d.ts

@@ -1,33 +1,33 @@
-import type { Theme } from './theme';
-import type { FolderApi, Pane, TabPageApi } from 'tweakpane';
-export type Container = FolderApi | Pane | TabPageApi;
-export type Simplify<T> = {
-	[KeyType in keyof T]: T[KeyType];
-} & NonNullable<unknown>;
+import type { Theme } from './theme'
+import type { FolderApi, Pane, TabPageApi } from 'tweakpane'
+export type Container = FolderApi | Pane | TabPageApi
+export type Simplify<T> = NonNullable<unknown> & {
+	[KeyType in keyof T]: T[KeyType]
+}
 export type SimplifyDeep<Type> = Type extends Theme
 	? Type
 	: {
-			[TypeKey in keyof Type]: SimplifyDeep<Type[TypeKey]>;
-		};
-export type HasKey<U, V extends PropertyKey> = V extends keyof U ? U[V] : unknown;
-import type { Bindable, BladeApi, BladeController, TpPluginBundle, View } from '@tweakpane/core';
-export type BindingObject = Bindable;
-export type Plugin = TpPluginBundle;
+			[TypeKey in keyof Type]: SimplifyDeep<Type[TypeKey]>
+		}
+export type HasKey<U, V extends PropertyKey> = V extends keyof U ? U[V] : unknown
+import type { Bindable, BladeApi, BladeController, TpPluginBundle, View } from '@tweakpane/core'
+export type BindingObject = Bindable
+export type Plugin = TpPluginBundle
 /**
  * The base event type for value change notification events emitted by various controls.
  */
 export type ValueChangeEvent<V> = CustomEvent<{
-	/**
-	 * A copy of the value at the time of the event.
-	 */
-	value: V;
 	/**
 	 * The origin of the event.
 	 * Changes resulting from the user's direct manipulation of the control will are marked as `internal`.
 	 * Changes resulting from manipulation of the bound value from _outside_ the component are marked as `external`.
 	 */
-	origin: 'external' | 'internal';
-}>;
+	origin: 'external' | 'internal'
+	/**
+	 * A copy of the value at the time of the event.
+	 */
+	value: V
+}>
 /**
  * Needed to conveniently use $$Events as the single source of truth for component events Performs
  * the transformation necessary (extracting detail types) to pass the $$Events type into
@@ -39,20 +39,16 @@ export type ValueChangeEvent<V> = CustomEvent<{
  *
  */
 export type UnwrapCustomEvents<T> = {
-	[P in keyof T]: T[P] extends CustomEvent<infer detail> ? detail : never;
-};
+	[P in keyof T]: T[P] extends CustomEvent<infer detail> ? detail : never
+}
 /**
  * For CLS SSR calculation
  */
-export declare function rowsForMonitor(
-	buffer?: number | undefined,
-	rows?: number | undefined,
-	graph?: boolean | undefined
-): number;
+export declare function rowsForMonitor(buffer?: number, rows?: number, graph?: boolean): number
 /**
  * Fills an array of length `quantity` with a `value`
  */
-export declare function fillWith<T>(value: T, quantity: number): T[];
+export declare function fillWith<T>(value: T, quantity: number): T[]
 /**
  * There's no way to enforce readonly properties in Svelte components, so this is a workaround. See
  * [general approach](https://github.com/sveltejs/svelte/issues/7712#issuecomment-1642470141) and
@@ -81,21 +77,21 @@ export declare function enforceReadonly(
 	external: unknown,
 	componentName?: string,
 	propertyName?: string,
-	allowAssignmentToUndefined?: boolean
-): void;
-export declare function isRootPane(container: Container): boolean;
-export declare function clamp(value: number, min: number, max: number): number;
-export declare function getElementIndex(element: HTMLElement): number;
+	allowAssignmentToUndefined?: boolean,
+): void
+export declare function isRootPane(container: Container): boolean
+export declare function clamp(value: number, min: number, max: number): number
+export declare function getElementIndex(element: HTMLElement): number
 export declare function removeKeys<T extends Record<string, unknown>>(
 	object: T,
 	...keys: string[]
-): T;
+): T
 export declare function updateCollapsibility(
 	isUserExpandableEnabled: boolean,
-	element: HTMLElement,
+	element: HTMLElement | undefined,
 	titleBarClass: string,
-	iconClass?: string
-): void;
+	iconClass?: string,
+): void
 /**
  * Infers grid dimensions for a given number of items, respecting optional maximums for rows and
  * columns.
@@ -109,46 +105,46 @@ export declare function updateCollapsibility(
 export declare function getGridDimensions(
 	itemCount: number,
 	maxColumns?: number,
-	maxRows?: number
+	maxRows?: number,
 ): {
-	columns: number;
-	rows: number;
-};
+	columns: number
+	rows: number
+}
 export declare function tupleToObject<
 	T extends string,
 	O extends {
-		[K in T]: number;
-	}
->(tuple: number[], keys: T[]): O;
+		[K in T]: number
+	},
+>(tuple: number[], keys: T[]): O
 export declare function objectToTuple<T extends string, O extends Record<T, number>>(
 	object: O,
-	keys: [T]
-): [number];
+	keys: [T],
+): [number]
 export declare function objectToTuple<T extends string, O extends Record<T, number>>(
 	object: O,
-	keys: [T, T]
-): [number, number];
+	keys: [T, T],
+): [number, number]
 export declare function objectToTuple<T extends string, O extends Record<T, number>>(
 	object: O,
-	keys: [T, T, T]
-): [number, number, number];
+	keys: [T, T, T],
+): [number, number, number]
 export declare function objectToTuple<T extends string, O extends Record<T, number>>(
 	object: O,
-	keys: [T, T, T, T]
-): [number, number, number, number];
-export declare function pickerIsOpen(blade: BladeApi<BladeController<View>>): boolean;
+	keys: [T, T, T, T],
+): [number, number, number, number]
+export declare function pickerIsOpen(blade: BladeApi<BladeController<View>>): boolean
 export declare function getSwatchButton(
-	blade: BladeApi<BladeController<View>>
-): HTMLButtonElement | undefined;
-import type { CubicBezierValue } from './control/CubicBezier.svelte';
-import type { RotationEulerUnit, RotationEulerValue } from './control/RotationEuler.svelte';
-import type { RotationQuaternionValue } from './control/RotationQuaternion.svelte';
-declare function quaternionToCssTransform(quaternion: RotationQuaternionValue): string;
+	blade: BladeApi<BladeController<View>>,
+): HTMLButtonElement | undefined
+import type { CubicBezierValue } from './control/CubicBezier.svelte'
+import type { RotationEulerUnit, RotationEulerValue } from './control/RotationEuler.svelte'
+import type { RotationQuaternionValue } from './control/RotationQuaternion.svelte'
+declare function quaternionToCssTransform(quaternion: RotationQuaternionValue): string
 declare function eulerToCssTransform(
 	rotation: RotationEulerValue,
-	units?: RotationEulerUnit
-): string;
-declare function cubicBezierToEaseFunction(cubicBezier: CubicBezierValue): (t: number) => number;
+	units?: RotationEulerUnit,
+): string
+declare function cubicBezierToEaseFunction(cubicBezier: CubicBezierValue): (t: number) => number
 declare const _default: {
 	/**
 	 * Convenience function for creating easing functions ready for Svelte's tween and animation
@@ -156,20 +152,20 @@ declare const _default: {
 	 * @param cubicBezier - `CubicBezierValue`, probably from a `<CubicBezier>` component
 	 * @returns Tween function
 	 */
-	cubicBezierToEaseFunction: typeof cubicBezierToEaseFunction;
+	cubicBezierToEaseFunction: typeof cubicBezierToEaseFunction
 	/**
 	 * Convenience function for creating CSS-ready euler rotation transforms
 	 * @param rotation - `RotationEulerValue`, probably from a `<RotationEuler>` component
 	 * @param quaternion
-	 * @returns CSS rotateX/Y/Z string ready to be passed into a CSS transform
+	 * @returns CSS rotate X/Y/Z string ready to be passed into a CSS transform
 	 */
-	eulerToCssTransform: typeof eulerToCssTransform;
+	eulerToCssTransform: typeof eulerToCssTransform
 	/**
 	 * Convenience function for creating CSS-ready quaternion rotation transforms
 	 * @param rotation - RotationQuaternionValue, probably from a <RotationQuaternionValue>
 	 * component
 	 * @returns CSS matrix3d string ready to be passed into a CSS transform
 	 */
-	quaternionToCssTransform: typeof quaternionToCssTransform;
-};
-export default _default;
+	quaternionToCssTransform: typeof quaternionToCssTransform
+}
+export default _default