mirror of
https://github.com/windmill-labs/windmill.git
synced 2026-09-07 08:02:40 +00:00
Diego ImbertandClaude Opus 4.6
5d79f33590
* Remove $$props.field usage * Rename slots to ensure no hyphen * _props * _trigger * OnSelectedIteration type correct capitalization * rename _content * Remove afterUpdate * Migrate everything to svelte 5 * array bind * Fix popover * type never * nit fixes * Fixed many trivial errors * onClick * Fix errors * use let: * nit typing * fix: wrap state_referenced_locally vars with untrack() Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Add untrack import * Fix all syntax errors due to untrack migration * Fix undefined errors * Fix more undefined errors * untrack(() => initialOpen) * svelte-ignore * Fix state_descriptors_fixed error in Chart.svelte Use $state.snapshot() to pass plain copies of data/options to Chart.js instead of $state proxies. Chart.js's listenArrayEvents tries to define property descriptors on data arrays, which Svelte 5 proxies reject. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * nit typing * Merge issue * Fix "path is not set" error in resource picker / editor * Fix InputTransformForm error when rerunning some flows * fix npm run check --------- Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
81 lines
1.9 KiB
Svelte
81 lines
1.9 KiB
Svelte
<script lang="ts">
|
|
import { untrack } from 'svelte'
|
|
import { enterpriseLicense } from '$lib/stores'
|
|
import { ChevronDown, ChevronRight } from 'lucide-svelte'
|
|
import Tooltip from './Tooltip.svelte'
|
|
import { twMerge } from 'tailwind-merge'
|
|
import EEOnly from './EEOnly.svelte'
|
|
|
|
interface Props {
|
|
label?: string | undefined
|
|
tooltip?: string | undefined
|
|
eeOnly?: boolean
|
|
collapsable?: boolean
|
|
collapsed?: boolean
|
|
openInitially?: boolean
|
|
headless?: boolean
|
|
class?: string | undefined
|
|
header?: import('svelte').Snippet
|
|
action?: import('svelte').Snippet
|
|
badge?: import('svelte').Snippet
|
|
children?: import('svelte').Snippet
|
|
}
|
|
|
|
let {
|
|
label = undefined,
|
|
tooltip = undefined,
|
|
eeOnly = false,
|
|
collapsable = false,
|
|
collapsed = $bindable(true),
|
|
openInitially = false,
|
|
headless = false,
|
|
class: clazz = undefined,
|
|
header,
|
|
action,
|
|
badge,
|
|
children
|
|
}: Props = $props()
|
|
|
|
if (untrack(() => openInitially) && untrack(() => collapsable) && collapsed) {
|
|
collapsed = false
|
|
}
|
|
</script>
|
|
|
|
<div class="w-full">
|
|
{#if !headless}
|
|
<div class="flex flex-row justify-between items-center mb-1">
|
|
<h3 class={twMerge('font-semibold flex flex-row items-center gap-2', 'text-sm')}>
|
|
{#if collapsable}
|
|
<button class="flex items-center gap-1" onclick={() => (collapsed = !collapsed)}>
|
|
{#if collapsed}
|
|
<ChevronRight size={16} />
|
|
{:else}
|
|
<ChevronDown size={16} />
|
|
{/if}
|
|
{label}
|
|
</button>
|
|
{:else}
|
|
{label}
|
|
{/if}
|
|
|
|
{@render header?.()}
|
|
{#if tooltip}
|
|
<Tooltip>{tooltip}</Tooltip>
|
|
{/if}
|
|
{#if eeOnly}
|
|
{#if !$enterpriseLicense}
|
|
<EEOnly />
|
|
{/if}
|
|
{/if}
|
|
</h3>
|
|
{@render action?.()}
|
|
{#if collapsable && collapsed}
|
|
{@render badge?.()}
|
|
{/if}
|
|
</div>
|
|
{/if}
|
|
<div class={collapsable && collapsed ? `hidden ${clazz ?? ''}` : `${clazz ?? ''}`}>
|
|
{@render children?.()}
|
|
</div>
|
|
</div>
|