diff --git a/frontend/src/lib/components/apps/components/buttons/AppButton.svelte b/frontend/src/lib/components/apps/components/buttons/AppButton.svelte index b9fbe48a10..eb59d736c1 100644 --- a/frontend/src/lib/components/apps/components/buttons/AppButton.svelte +++ b/frontend/src/lib/components/apps/components/buttons/AppButton.svelte @@ -23,7 +23,7 @@ export let verticalAlignment: 'top' | 'center' | 'bottom' | undefined = undefined export let noWFull = false export let preclickAction: (() => Promise) | undefined = undefined - export let customCss: ComponentCustomCSS<'button'> | undefined = undefined + export let customCss: ComponentCustomCSS<'buttoncomponent'> | undefined = undefined export let render: boolean export let initializing: boolean | undefined = true @@ -158,10 +158,10 @@ + {/if} + + + {#each search != '' ? entries.filter((x) => x.name + .toLowerCase() + .includes(search.toLowerCase())) : entries as { type, name, icon, ids } (name)} {#if ids.length > 0} - + { + if ($app.css != undefined) { + if (e.detail && $app.css[type] == undefined) { + $app.css[type] = Object.fromEntries(ids.map(({ id }) => [id, {}])) + } + } + }} + >
@@ -140,13 +123,14 @@
- {#each ids as id} + {#each ids as { id, forceStyle, forceClass }}
- {#if $app?.css?.[type][id]} + {#if $app?.css?.[type]} (isCustom[type] = true)} /> {/if}
@@ -155,43 +139,6 @@ {/if} {/each} -
- -
- {#if $isOpenStore[SHOW_UNUSED_ID]} -
- {#each unusedComponents as { type, name, icon, ids }} - {#if ids.length > 0} - -
- - - {name} - -
-
- {#each ids as id} -
- {#if $app?.css?.[type][id]} - (isCustom[type] = true)} - /> - {/if} -
- {/each} -
- - {/if} - {/each} -
- {/if} {#if !emptyString(jsonError)} diff --git a/frontend/src/lib/components/apps/editor/componentsPanel/ListItem.svelte b/frontend/src/lib/components/apps/editor/componentsPanel/ListItem.svelte index 5930ec7b68..f6340580a6 100644 --- a/frontend/src/lib/components/apps/editor/componentsPanel/ListItem.svelte +++ b/frontend/src/lib/components/apps/editor/componentsPanel/ListItem.svelte @@ -2,12 +2,17 @@ import { slide } from 'svelte/transition' import { ChevronDown } from 'lucide-svelte' import { isOpenStore } from './store' + import { createEventDispatcher } from 'svelte' export let title: string export let prefix: string | undefined = undefined + const dispatch = createEventDispatcher() + $: storeTitle = prefix + title $: isOpen = prefix ? $isOpenStore[storeTitle] : true + + $: dispatch('open', isOpen)
diff --git a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte index 8b64cfa158..5bfb5cb850 100644 --- a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte +++ b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte @@ -206,6 +206,8 @@
+ +
{#if inlineScript.language != 'frontend'} { + inlineScript.content = editor?.getCode() ?? '' runLoading = true await $runnableComponents[id]?.() runLoading = false diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/ArrayStaticInputEditor.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/ArrayStaticInputEditor.svelte index 7b5f43c340..ac74ca0f23 100644 --- a/frontend/src/lib/components/apps/editor/settingsPanel/ArrayStaticInputEditor.svelte +++ b/frontend/src/lib/components/apps/editor/settingsPanel/ArrayStaticInputEditor.svelte @@ -2,41 +2,48 @@ import { Button } from '$lib/components/common' import { faPlus, faTrashAlt } from '@fortawesome/free-solid-svg-icons' import { createEventDispatcher } from 'svelte' - import type { StaticAppInput } from '../../inputType' + import type { InputType, StaticAppInput, StaticInput } from '../../inputType' import { staticValues } from '../componentsPanel/componentStaticValues' import SubTypeEditor from './SubTypeEditor.svelte' - type ArrayComponentInput = Extract + export let componentInput: StaticInput + export let subFieldType: InputType | undefined = undefined + export let optionValuesKey: keyof typeof staticValues | undefined = undefined - export let componentInput: ArrayComponentInput const dispatch = createEventDispatcher() function addElementByType() { + console.log('ADD') if (!Array.isArray(componentInput.value)) { componentInput.value = [] } - if (componentInput.subFieldType && componentInput.value) { - if (componentInput.subFieldType === 'boolean') { - componentInput.value.push(false) - } else if (componentInput.subFieldType === 'number') { - componentInput.value.push(0) - } else if (componentInput.subFieldType === 'object') { - componentInput.value.push({}) - } else if (componentInput.subFieldType === 'labeledresource') { - componentInput.value.push({ value: '', label: '' }) + let value: any[] = componentInput.value + if (subFieldType) { + if (subFieldType === 'boolean') { + value.push(false) + } else if (subFieldType === 'number') { + value.push(0) + } else if (subFieldType === 'object') { + value.push({}) + } else if (subFieldType === 'labeledresource') { + value.push({ value: '', label: '' }) } else if ( - componentInput.subFieldType === 'text' || - componentInput.subFieldType === 'textarea' || + subFieldType === 'text' || + subFieldType === 'textarea' || // TODO: Add support for these types - componentInput.subFieldType === 'date' || - componentInput.subFieldType === 'time' || - componentInput.subFieldType === 'datetime' + subFieldType === 'date' || + subFieldType === 'time' || + subFieldType === 'datetime' ) { - componentInput.value.push('') - } else if (componentInput.subFieldType === 'select') { - componentInput.value.push(staticValues[componentInput.optionValuesKey][0]) + value.push('') + } else if (subFieldType === 'select' && optionValuesKey) { + value.push(staticValues[optionValuesKey][0]) } + } else { + value.push('') } + + console.log(value, componentInput.value) componentInput = componentInput } @@ -55,7 +62,7 @@ {#if Array.isArray(componentInput.value)} {#each componentInput.value as value, index (index)}
- +