windmill-components 1.82.4 → 1.82.6

package/components/common/button/ButtonPopupItem.svelte

@@ -8,7 +8,6 @@ export let target = '_self';
 export let iconOnly = false;
 export let startIcon = undefined;
 export let endIcon = undefined;
-export let wrapperClasses = '';
 const props = getContext(ButtonType.ItemContextKey);
 const iconWidthClass = {
     xs: '!w-[12px]',
@@ -41,7 +40,7 @@ $: buttonProps = {
 };
 </script>
 
-<li class="mt-1 {wrapperClasses}">
+<li class="mt-1">
 	<Button {...buttonProps} on:click>
 		<slot />
 	</Button>

package/components/common/button/ButtonPopupItem.svelte.d.ts

@@ -9,7 +9,6 @@ declare const __propDef: {
         iconOnly?: boolean | undefined;
         startIcon?: ButtonType.Icon | undefined;
         endIcon?: ButtonType.Icon | undefined;
-        wrapperClasses?: string | undefined;
     };
     events: {
         click: CustomEvent<any>;

package/components/common/index.d.ts

@@ -5,7 +5,6 @@ export { default as Button } from './button/Button.svelte';
 export { default as ButtonPopup } from './button/ButtonPopup.svelte';
 export { default as ButtonPopupItem } from './button/ButtonPopupItem.svelte';
 export { default as UndoRedo } from './button/UndoRedo.svelte';
-export { default as ClearableInput } from './clearableInput/ClearableInput.svelte';
 export { default as Drawer } from './drawer/Drawer.svelte';
 export { default as DrawerContent } from './drawer/DrawerContent.svelte';
 export { default as Kbd } from './kbd/Kbd.svelte';

package/components/common/index.js

@@ -5,7 +5,6 @@ export { default as Button } from './button/Button.svelte';
 export { default as ButtonPopup } from './button/ButtonPopup.svelte';
 export { default as ButtonPopupItem } from './button/ButtonPopupItem.svelte';
 export { default as UndoRedo } from './button/UndoRedo.svelte';
-export { default as ClearableInput } from './clearableInput/ClearableInput.svelte';
 export { default as Drawer } from './drawer/Drawer.svelte';
 export { default as DrawerContent } from './drawer/DrawerContent.svelte';
 export { default as Kbd } from './kbd/Kbd.svelte';

package/components/common/kbd/Kbd.svelte

@@ -1,10 +1,7 @@
-<script>export let kbdClass = '';
-</script>
-
 <span
 	class="{$$props.class} rounded border bg-white/70 px-1.5 !text-xs text-gray-600 shadow-sm font-light transition-all group-hover:border-primary-500 group-hover:text-primary-500"
 >
-	<kbd class={kbdClass}>
+	<kbd>
 		<slot />
 	</kbd>
 </span>

package/components/common/kbd/Kbd.svelte.d.ts

@@ -1,8 +1,21 @@
+/** @typedef {typeof __propDef.props}  KbdProps */
+/** @typedef {typeof __propDef.events}  KbdEvents */
+/** @typedef {typeof __propDef.slots}  KbdSlots */
+export default class Kbd extends SvelteComponentTyped<{
+    [x: string]: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}> {
+}
+export type KbdProps = typeof __propDef.props;
+export type KbdEvents = typeof __propDef.events;
+export type KbdSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
-        kbdClass?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;
@@ -11,9 +24,4 @@ declare const __propDef: {
         default: {};
     };
 };
-export type KbdProps = typeof __propDef.props;
-export type KbdEvents = typeof __propDef.events;
-export type KbdSlots = typeof __propDef.slots;
-export default class Kbd extends SvelteComponentTyped<KbdProps, KbdEvents, KbdSlots> {
-}
 export {};

package/components/common/menu/Menu.svelte

@@ -4,12 +4,8 @@ let current = undefined;
 
 <script>import { classNames } from '../../../utils';
 import { onMount } from 'svelte';
-import { fade } from 'svelte/transition';
 export let noMinW = false;
 export let show = false;
-export let wrapperClasses = '';
-export let popupClasses = '';
-export let transitionDuration = 100;
 let menu;
 export let placement = 'bottom-start';
 function handleOutsideClick(event) {
@@ -44,7 +40,7 @@ const placementsClasses = {
 };
 </script>
 
-<div class="relative {wrapperClasses}" bind:this={menu}>
+<div class="relative" bind:this={menu}>
 	<!-- svelte-ignore a11y-click-events-have-key-events -->
 	<div
 		on:click|stopPropagation={() => {
@@ -60,12 +56,10 @@ const placementsClasses = {
 	</div>
 	{#if show}
 		<div
-			transition:fade|local={{ duration: transitionDuration }}
 			class={classNames(
 				'z-50 absolute mt-2 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none',
 				placementsClasses[placement],
-				noMinW ? 'min-w-0' : 'w-60',
-				popupClasses
+				noMinW ? 'min-w-0' : 'w-60'
 			)}
 			role="menu"
 			tabindex="-1"

package/components/common/menu/Menu.svelte.d.ts

@@ -3,10 +3,7 @@ declare const __propDef: {
     props: {
         noMinW?: boolean | undefined;
         show?: boolean | undefined;
-        wrapperClasses?: string | undefined;
-        popupClasses?: string | undefined;
-        transitionDuration?: number | undefined;
-        placement?: "top-start" | "top-end" | "bottom-start" | "bottom-end" | "top-center" | "bottom-center" | undefined;
+        placement?: "top-start" | "top-end" | "top-center" | "bottom-start" | "bottom-end" | "bottom-center" | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/components/flows/map/MapItem.svelte

@@ -63,9 +63,9 @@ let openMenu2 = undefined;
 	<div class="relative">
 		{#if moving == mod.id}
 			<div class="absolute z-10 right-20 top-0.5 center-center">
-				<Button color="dark" on:click={() => dispatch('move')} size="xs" variant="border">
-					Cancel move
-				</Button>
+				<Button color="dark" on:click={() => dispatch('move')} size="xs" variant="border"
+					>Cancel move</Button
+				>
 			</div>
 		{/if}
 

package/components/propertyPicker/ObjectViewer.svelte

@@ -118,6 +118,9 @@ function selectProp(key, value) {
 			{pluralize(Object.keys(json).length, Array.isArray(json) ? 'item' : 'key')}
 		</span>
 	{/if}
+	{#if !isLast && collapsed}
+		<span class="text-black">,</span>
+	{/if}
 {:else if topBrackets}
 	<span class="text-black">{openBracket}{closeBracket}</span>
 {:else}

package/components/scriptEditor/LogPanel.svelte

@@ -76,10 +76,10 @@ function closeDrawer() {
 						/>
 					</Pane>
 					<Pane>
-						{#if previewJob != undefined && 'result' in previewJob}
-							<div class="relative w-full h-full p-2"
+						{#if previewJob != undefined && 'result' in previewJob && previewJob.result != undefined}
+							<pre class="relative w-full h-full p-2"
 								><DisplayResult result={previewJob.result} />
-							</div>
+						</pre>
 						{:else}
 							<div class="text-sm text-gray-600 p-2">
 								{#if previewIsLoading}

package/infer.js

@@ -113,9 +113,6 @@ function argSigToJsonSchemaType(t, oldS) {
         else if (t.list === 'bytes') {
             newS.items = { type: 'string', contentEncoding: 'base64' };
         }
-        else if (t.list && typeof t.list == 'object' && `object` in t.list) {
-            newS.items = { type: 'object' };
-        }
         else {
             newS.items = { type: 'string' };
         }
@@ -125,14 +122,12 @@ function argSigToJsonSchemaType(t, oldS) {
     }
     if (oldS.type != newS.type) {
         for (const prop of Object.getOwnPropertyNames(newS)) {
-            if (prop != 'description') {
+            if (prop != "description") {
                 delete oldS[prop];
             }
         }
     }
-    let oldDescription = oldS.description;
     Object.assign(oldS, newS);
-    oldS.description = oldDescription;
     if (oldS.format?.startsWith('resource-') && newS.type != 'object') {
         oldS.format = undefined;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "windmill-components",
-	"version": "1.82.4",
+	"version": "1.82.6",
 	"devDependencies": {
 		"@playwright/test": "^1.31.1",
 		"@sveltejs/adapter-static": "^1.0.0",
@@ -31,7 +31,6 @@
 		"prettier": "^2.8.3",
 		"prettier-plugin-svelte": "^2.9.0",
 		"simple-svelte-autocomplete": "^2.5.1",
-		"style-to-object": "^0.4.1",
 		"stylelint-config-recommended": "^9.0.0",
 		"svelte": "^3.55.1",
 		"svelte-awesome": "^3.0.0",
@@ -263,10 +262,7 @@
 		"./components/apps/editor/componentsPanel/CssProperty.svelte": "./components/apps/editor/componentsPanel/CssProperty.svelte",
 		"./components/apps/editor/componentsPanel/CssSettings.svelte": "./components/apps/editor/componentsPanel/CssSettings.svelte",
 		"./components/apps/editor/componentsPanel/ListItem.svelte": "./components/apps/editor/componentsPanel/ListItem.svelte",
-		"./components/apps/editor/componentsPanel/QuickStyleMenu.svelte": "./components/apps/editor/componentsPanel/QuickStyleMenu.svelte",
-		"./components/apps/editor/componentsPanel/QuickStyleProperty.svelte": "./components/apps/editor/componentsPanel/QuickStyleProperty.svelte",
 		"./components/apps/editor/componentsPanel/componentDefaultProps": "./components/apps/editor/componentsPanel/componentDefaultProps.js",
-		"./components/apps/editor/componentsPanel/quickStyleProperties": "./components/apps/editor/componentsPanel/quickStyleProperties.js",
 		"./components/apps/editor/componentsPanel/store": "./components/apps/editor/componentsPanel/store.js",
 		"./components/apps/editor/contextPanel/ComponentOutput.svelte": "./components/apps/editor/contextPanel/ComponentOutput.svelte",
 		"./components/apps/editor/contextPanel/ComponentOutputViewer.svelte": "./components/apps/editor/contextPanel/ComponentOutputViewer.svelte",
@@ -274,6 +270,7 @@
 		"./components/apps/editor/contextPanel/SubGridOutput.svelte": "./components/apps/editor/contextPanel/SubGridOutput.svelte",
 		"./components/apps/editor/contextPanel/components/BackgroundScriptOutput.svelte": "./components/apps/editor/contextPanel/components/BackgroundScriptOutput.svelte",
 		"./components/apps/editor/contextPanel/components/BackgroundScriptsOutput.svelte": "./components/apps/editor/contextPanel/components/BackgroundScriptsOutput.svelte",
+		"./components/apps/editor/contextPanel/components/MinMaxButton.svelte": "./components/apps/editor/contextPanel/components/MinMaxButton.svelte",
 		"./components/apps/editor/contextPanel/components/OutputHeader.svelte": "./components/apps/editor/contextPanel/components/OutputHeader.svelte",
 		"./components/apps/editor/contextPanel/components/TableActionOutput.svelte": "./components/apps/editor/contextPanel/components/TableActionOutput.svelte",
 		"./components/apps/editor/contextPanel/components/TableActionsOutput.svelte": "./components/apps/editor/contextPanel/components/TableActionsOutput.svelte",
@@ -298,7 +295,6 @@
 		"./components/apps/editor/settingsPanel/PickInlineScript.svelte": "./components/apps/editor/settingsPanel/PickInlineScript.svelte",
 		"./components/apps/editor/settingsPanel/Recompute.svelte": "./components/apps/editor/settingsPanel/Recompute.svelte",
 		"./components/apps/editor/settingsPanel/SelectedRunnable.svelte": "./components/apps/editor/settingsPanel/SelectedRunnable.svelte",
-		"./components/apps/editor/settingsPanel/StylePanel.svelte": "./components/apps/editor/settingsPanel/StylePanel.svelte",
 		"./components/apps/editor/settingsPanel/SubTypeEditor.svelte": "./components/apps/editor/settingsPanel/SubTypeEditor.svelte",
 		"./components/apps/editor/settingsPanel/TableActionLabel.svelte": "./components/apps/editor/settingsPanel/TableActionLabel.svelte",
 		"./components/apps/editor/settingsPanel/TableActions.svelte": "./components/apps/editor/settingsPanel/TableActions.svelte",
@@ -317,9 +313,6 @@
 		"./components/apps/editor/settingsPanel/mainInput/RunnableSelector.svelte": "./components/apps/editor/settingsPanel/mainInput/RunnableSelector.svelte",
 		"./components/apps/editor/settingsPanel/mainInput/WorkspaceFlowList.svelte": "./components/apps/editor/settingsPanel/mainInput/WorkspaceFlowList.svelte",
 		"./components/apps/editor/settingsPanel/mainInput/WorkspaceScriptList.svelte": "./components/apps/editor/settingsPanel/mainInput/WorkspaceScriptList.svelte",
-		"./components/apps/editor/settingsPanel/secondaryMenu/SecondaryMenu.svelte": "./components/apps/editor/settingsPanel/secondaryMenu/SecondaryMenu.svelte",
-		"./components/apps/editor/settingsPanel/secondaryMenu": "./components/apps/editor/settingsPanel/secondaryMenu/index.js",
-		"./components/apps/editor/settingsPanel/secondaryMenu/menuStore": "./components/apps/editor/settingsPanel/secondaryMenu/menuStore.js",
 		"./components/apps/editor/settingsPanel/triggerLists/BackgroundScriptTriggerList.svelte": "./components/apps/editor/settingsPanel/triggerLists/BackgroundScriptTriggerList.svelte",
 		"./components/apps/editor/settingsPanel/triggerLists/ComponentTriggerList.svelte": "./components/apps/editor/settingsPanel/triggerLists/ComponentTriggerList.svelte",
 		"./components/apps/editor/settingsPanel/triggerLists/TriggerBadgesList.svelte": "./components/apps/editor/settingsPanel/triggerLists/TriggerBadgesList.svelte",
@@ -350,7 +343,6 @@
 		"./components/common/button/ButtonPopupItem.svelte": "./components/common/button/ButtonPopupItem.svelte",
 		"./components/common/button/UndoRedo.svelte": "./components/common/button/UndoRedo.svelte",
 		"./components/common/button/model": "./components/common/button/model.js",
-		"./components/common/clearableInput/ClearableInput.svelte": "./components/common/clearableInput/ClearableInput.svelte",
 		"./components/common/confirmationModal/ConfirmationModal.svelte": "./components/common/confirmationModal/ConfirmationModal.svelte",
 		"./components/common/confirmationModal/UnsavedConfirmationModal.svelte": "./components/common/confirmationModal/UnsavedConfirmationModal.svelte",
 		"./components/common/confirmationModal/dirtyStore": "./components/common/confirmationModal/dirtyStore.js",
@@ -369,7 +361,6 @@
 		"./components/common/languageIcons": "./components/common/languageIcons/index.js",
 		"./components/common/menu/Menu.svelte": "./components/common/menu/Menu.svelte",
 		"./components/common/menu/MenuItem.svelte": "./components/common/menu/MenuItem.svelte",
-		"./components/common/modal/AlwaysMountedModal.svelte": "./components/common/modal/AlwaysMountedModal.svelte",
 		"./components/common/modal/Modal.svelte": "./components/common/modal/Modal.svelte",
 		"./components/common/popup/Popup.svelte": "./components/common/popup/Popup.svelte",
 		"./components/common/skeleton/Skeleton.svelte": "./components/common/skeleton/Skeleton.svelte",

package/utils.d.ts

@@ -116,4 +116,3 @@ export declare function debounce(func: (...args: any[]) => any, wait: number): (
 export declare function throttle<T>(func: (...args: any[]) => T, wait: number): (...args: any[]) => void;
 export declare function isMac(): boolean;
 export declare function getModifierKey(): string;
-export declare function isValidHexColor(color: string): boolean;

package/utils.js

@@ -607,6 +607,3 @@ export function isMac() {
 export function getModifierKey() {
     return isMac() ? '⌘' : 'CTRL';
 }
-export function isValidHexColor(color) {
-    return /^#(([A-F0-9]{2}){3,4}|[A-F0-9]{3})$/i.test(color);
-}

package/components/apps/editor/componentsPanel/QuickStyleMenu.svelte

@@ -1,170 +0,0 @@
-<script>import { getContext, onMount, setContext } from 'svelte';
-import parse from 'style-to-object';
-import { isValidHexColor } from '../../../../utils';
-import { createStyleStore, StylePropertyType, StylePropertyUnits, STYLE_STORE_KEY } from './quickStyleProperties';
-import QuickStyleProperty from './QuickStyleProperty.svelte';
-export let value = '';
-export let properties;
-const { app } = getContext('AppViewerContext');
-const styleStore = createStyleStore(properties);
-setContext(STYLE_STORE_KEY, styleStore);
-let multiValues = initiateMultiValues();
-let mounted = false;
-$: mounted && $styleStore && writeStyle();
-$: mounted && (!value || value) && parseStyle();
-$: $app && setTopColors();
-function parseStyle() {
-    styleStore.resetStyle();
-    if (!value) {
-        multiValues = initiateMultiValues();
-        return;
-    }
-    try {
-        const current = parse(value) || {};
-        Object.entries(current).forEach(([k, v]) => {
-            styleStore.updatePropValue(k, v);
-            const { prop, index } = styleStore.getProp(k);
-            if (Array.isArray(prop?.prop?.value) && index !== undefined) {
-                const valueArray = v.split(' ');
-                multiValues[index] = multiValues[index].map((v, i) => valueArray[i] || v);
-            }
-        });
-        setTopColors();
-    }
-    catch { }
-}
-function writeStyle() {
-    const current = parse(value) || {};
-    $styleStore.style.forEach((s) => {
-        current[s.prop.key] = convertValue(s.value);
-    });
-    const entries = Object.entries(current);
-    value = entries.reduce((style, [k, v]) => {
-        return v ? `${style} ${k}: ${v}; `.trim() : style;
-    }, '');
-}
-function convertValue(value) {
-    switch (typeof value) {
-        case 'number':
-            return value + '';
-        case 'string':
-            return value;
-        default:
-            return '';
-    }
-}
-function setTopColors() {
-    const styles = collectStyles();
-    const parsedStyles = styles.map((style) => parse(style) || {});
-    const usedColors = {};
-    parsedStyles.forEach((style) => {
-        Object.values(style).reduce((colors, v) => {
-            // TODO: support RGB and HSL colors as well
-            // Splitting is needed so colors can be extracted
-            // from values like '1px solid #000000'
-            v.split(' ').forEach((v) => {
-                if (isValidHexColor(v)) {
-                    colors[v] = (colors[v] || 0) + 1;
-                }
-            });
-            return colors;
-        }, usedColors);
-    });
-    const colors = Object.entries(usedColors)
-        .sort((a, b) => b[1] - a[1])
-        .slice(0, 3)
-        .map(([color]) => color);
-    styleStore.setTopColors(colors);
-}
-function collectStyles() {
-    const styles = [];
-    // Getting global app styles
-    Object.values($app.css || {}).forEach((element) => {
-        Object.values(element).filter(({ style }) => style && styles.push(style));
-    });
-    // Getting styles from individual components
-    $app.grid.map((component) => {
-        Object.values(component.data.customCss || {}).forEach(({ style }) => {
-            style && styles.push(style);
-        });
-    });
-    // Getting style from subgrids
-    Object.values($app.subgrids || {}).forEach((grid) => {
-        grid.map((component) => {
-            Object.values(component.data.customCss || {}).forEach(({ style }) => {
-                style && styles.push(style);
-            });
-        });
-    });
-    return styles;
-}
-function initiateMultiValues() {
-    return $styleStore.style.reduce((acc, curr, i) => {
-        if (Array.isArray(curr.prop.value)) {
-            acc[i] = Array.from({ length: curr.prop.value.length }, () => {
-                return '';
-            });
-        }
-        return acc;
-    }, {});
-}
-function setMultiValueProperty(index) {
-    if (multiValues[index].every((v) => !v || +v === 0 || StylePropertyUnits.includes(v))) {
-        $styleStore.style[index].value = '';
-        return;
-    }
-    const values = multiValues[index].map((v, i) => {
-        v = StylePropertyUnits.includes(v) ? '' : v;
-        const type = $styleStore.style[index].prop.value[i].type;
-        if (v) {
-            multiValues[index][i] = v;
-            return v;
-        }
-        else if (type === StylePropertyType.color) {
-            return '#000000';
-        }
-        else if (type === StylePropertyType.number) {
-            return 0;
-        }
-        else if (type === StylePropertyType.unit) {
-            return 0;
-        }
-        else if (type === StylePropertyType.text) {
-            const options = $styleStore.style[index].prop.value[i].options;
-            return options ? options[0].text : '';
-        }
-        else {
-            return '';
-        }
-    });
-    $styleStore.style[index].value = values.join(' ').trim();
-}
-onMount(() => {
-    parseStyle();
-    mounted = true;
-});
-</script>
-
-<div class="bg-gray-200/60 rounded-md p-2">
-	{#each $styleStore.style as { prop }, index}
-		<div class="pb-3 last:pb-0">
-			<div class="text-sm font-medium text-gray-600 pb-0.5"> {prop.key} </div>
-			<div class="flex items-center gap-1 w-full">
-				{#if Array.isArray(prop.value)}
-					<div class="flex justify-start items-center flex-wrap gap-x-4 gap-y-1">
-						{#each prop.value as value, i}
-							<QuickStyleProperty
-								prop={{ ...prop, value }}
-								inline
-								bind:value={multiValues[index][i]}
-								on:change={() => setMultiValueProperty(index)}
-							/>
-						{/each}
-					</div>
-				{:else}
-					<QuickStyleProperty {prop} bind:value={$styleStore.style[index].value} />
-				{/if}
-			</div>
-		</div>
-	{/each}
-</div>

package/components/apps/editor/componentsPanel/QuickStyleMenu.svelte.d.ts

@@ -1,18 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import { type StylePropertyKey } from './quickStyleProperties';
-declare const __propDef: {
-    props: {
-        value?: string | undefined;
-        properties: StylePropertyKey[];
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type QuickStyleMenuProps = typeof __propDef.props;
-export type QuickStyleMenuEvents = typeof __propDef.events;
-export type QuickStyleMenuSlots = typeof __propDef.slots;
-export default class QuickStyleMenu extends SvelteComponentTyped<QuickStyleMenuProps, QuickStyleMenuEvents, QuickStyleMenuSlots> {
-}
-export {};

package/components/apps/editor/componentsPanel/QuickStyleProperty.svelte

@@ -1,130 +0,0 @@
-<script>import { createEventDispatcher, getContext } from 'svelte';
-import { Button, ClearableInput, Menu } from '../../../common';
-import Popover from '../../../Popover.svelte';
-import ColorInput from '../settingsPanel/inputEditor/ColorInput.svelte';
-import { StylePropertyType, StylePropertyUnits, STYLE_STORE_KEY } from './quickStyleProperties';
-export let prop;
-export let value;
-export let inline = false;
-const styleStore = getContext(STYLE_STORE_KEY);
-const dispatch = createEventDispatcher();
-const key = prop.key;
-const type = prop.value?.['type'];
-let unit = StylePropertyUnits[0];
-let internalValue;
-$: internalValue = value ? +value.replace(unit, '') : '';
-$: dispatch('change', value);
-function updateValue(next) {
-    value = next ? next + unit : '';
-}
-function updateUnit(next) {
-    value = value?.replace(unit, next) || '';
-    unit = next;
-}
-</script>
-
-<div class={inline && type !== StylePropertyType.color ? '' : 'w-full'}>
-	{#if prop.value['title']}
-		<div class="font-medium text-xs text-gray-500">
-			{prop.value['title']}
-		</div>
-	{/if}
-	<div class="flex gap-1">
-		{#if type === StylePropertyType.color}
-			<ColorInput bind:value />
-			{#each $styleStore.topColors as color}
-				<Popover placement="bottom" notClickable disapperTimoout={0} class="flex">
-					<Button
-						color="light"
-						size="xs"
-						variant="border"
-						btnClasses="!p-0 !w-[34px] !h-[34px]"
-						aria-label="Set {key} to {color}"
-						style={`background-color: ${color};`}
-						on:click={() => (value = color)}
-					/>
-					<svelte:fragment slot="text">{color}</svelte:fragment>
-				</Popover>
-			{/each}
-		{:else if type === StylePropertyType.number}
-			<ClearableInput
-				type="number"
-				bind:value
-				step={prop.value?.['step'] || 1}
-				min={prop.value?.['min']}
-				max={prop.value?.['max']}
-			/>
-		{:else if type === StylePropertyType.unit}
-			<ClearableInput
-				wrapperClass="flex items-center {inline ? '!grow-0' : ''}"
-				inputClass="!border-r-0 !rounded-r-none {inline ? '!w-[90px]' : ''}"
-				buttonClass="!right-9"
-				type="number"
-				value={internalValue}
-				on:change={({ detail }) => updateValue(detail)}
-			>
-				<Menu
-					let:close
-					noMinW
-					wrapperClasses="h-full bg-white rounded-r-md border-y border-r border-gray-300 pr-0.5"
-					popupClasses="!mt-0"
-				>
-					<button
-						slot="trigger"
-						type="button"
-						class="font-normal text-xs px-1 py-1.5 w-8 rounded mt-0.5 duration-200 hover:bg-gray-200/90"
-					>
-						{unit}
-					</button>
-					<ul class="bg-white rounded border py-1 overflow-auto">
-						{#each StylePropertyUnits as u}
-							<li class="w-full">
-								<Button
-									type="button"
-									color="light"
-									size="xs"
-									variant="contained"
-									btnClasses="!justify-start !rounded-none !w-full !px-3 !py-1.5"
-									on:click={() => {
-										updateUnit(u)
-										close()
-									}}
-								>
-									{u}
-								</Button>
-							</li>
-						{/each}
-					</ul>
-				</Menu>
-			</ClearableInput>
-		{:else if type === StylePropertyType.text}
-			{#each prop.value?.['options'] || [] as option}
-				<Popover placement="bottom" notClickable disapperTimoout={0}>
-					<Button
-						color={value === option.text ? 'dark' : 'light'}
-						size="xs"
-						variant={value === option.text ? 'contained' : 'border'}
-						btnClasses="!p-1 !min-w-[34px] !h-[34px]"
-						aria-label="Set {key} to {option.text}"
-						on:click={() => {
-							if (value === option.text) {
-								value = ''
-							} else {
-								value = option.text
-							}
-						}}
-					>
-						{#if typeof option.icon === 'string'}
-							{option.icon}
-						{:else}
-							<svelte:component this={option.icon} size={18} />
-						{/if}
-					</Button>
-					<svelte:fragment slot="text">{option.text}</svelte:fragment>
-				</Popover>
-			{:else}
-				<ClearableInput inputClass="min-w-[32px]" bind:value />
-			{/each}
-		{/if}
-	</div>
-</div>

package/components/apps/editor/componentsPanel/QuickStyleProperty.svelte.d.ts

@@ -1,21 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import { type StyleStoreValue } from './quickStyleProperties';
-declare const __propDef: {
-    props: {
-        prop: StyleStoreValue['style'][number]['prop'];
-        value: string | undefined;
-        inline?: boolean | undefined;
-    };
-    events: {
-        change: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type QuickStylePropertyProps = typeof __propDef.props;
-export type QuickStylePropertyEvents = typeof __propDef.events;
-export type QuickStylePropertySlots = typeof __propDef.slots;
-export default class QuickStyleProperty extends SvelteComponentTyped<QuickStylePropertyProps, QuickStylePropertyEvents, QuickStylePropertySlots> {
-}
-export {};