{#if migrationModalOpen}
Migrate to CSS editor
(migrationModalOpen = false)} />
{#if hasStyles(component?.customCss)}
ID
{component?.id}
{/if} {#if component?.type && $app.css} {#each Object.keys(component.customCss ?? {}) as cssKey} {#if component.customCss?.[cssKey].style != undefined && component.customCss[cssKey].style !== ''}
{cssKey}
{ if (component?.customCss?.[cssKey]?.style != undefined) { setOrUpdateMigration( cssKey, component.customCss[cssKey].style ?? '' ) component.customCss[cssKey].style = '' } }} endIcon={{ icon: MoveRight }} > Migrate
Preview
{/if} {/each} {/if} {#if hasStyles(component?.type ? $app.css?.[component?.type] : undefined)}
Global: {component?.type ? ccomponents[component.type]?.name : ''}
{/if} {#if component?.type && $app.css} {#each Object.keys($app.css[component?.type] ?? {}) as cssKey} {#if type && $app.css?.[type]?.[cssKey].style != undefined && $app.css[type]?.[cssKey].style !== ''}
{cssKey}
{ if (type && $app.css?.[type]) { setOrUpdateMigration(cssKey, $app.css[type][cssKey].style) $app.css[type][cssKey].style = '' } }} endIcon={{ icon: MoveRight }} > Migrate
Preview
{/if} {/each} {/if}
Current migrations
{#if migrations.size > 0}
{:else}
No migrations
{/if}
If the class is already present in the CSS editor, the migration will append the new values to the existing ones.
{ appendMigrationsToCss(migrations) migrationModalOpen = false }} disabled={migrations.size === 0} endIcon={{ icon: MoveRight }} > Apply migration
{/if}