@vibesdotdev/platform 0.0.0-stage → 1.0.0-rc.2

package/dist/svelte/components/HostProvisionForm.svelte

@@ -0,0 +1,335 @@
+<script lang="ts">
+	import { settle } from '@vibesdotdev/kernel';
+	import { getRuntimeSvelteContext } from '@vibesdotdev/surface-sveltekit/svelte';
+	import { untrack } from 'svelte';
+	import { Badge } from '@vibesdotdev/kit/components/ui/badge';
+	import { Button } from '@vibesdotdev/kit/components/ui/button';
+	import { Icon } from '@vibesdotdev/kit/components/icon';
+	import { Input } from '@vibesdotdev/kit/components/ui/input';
+	import {
+		provisionHostFormSchema,
+		type ProvisionHostForm,
+		type ProvisionHostResponse
+	} from '@vibesdotdev/platform/hosts/schemas/provision';
+	import HostCapabilitySelector from './HostCapabilitySelector.svelte';
+	import { createHostsStore,type HostsStore } from '../stores/hosts.svelte.js';
+	import {
+		CODE_SESSION_REQUIRED_LABELS,
+		DEFAULT_HOST_PROVISION_DRAFT,
+		createProvisionHostFormFromDraft,
+		slugifyHostId,
+		uniqueHostCapabilityLabels,
+		type HostProvisionDraft,
+		type PlatformHostsClient
+	} from '../runtime.js';
+
+	interface Props {
+		client?: PlatformHostsClient;
+		store?: HostsStore;
+		defaultDraft?: HostProvisionDraft;
+		capabilityOptions?: string[];
+		submitLabel?: string;
+		onProvisioned?: (result: ProvisionHostResponse) => void;
+		onCancel?: () => void;
+		onError?: (error: Error) => void;
+	}
+
+	const runtimeStore=getRuntimeSvelteContext();
+	let {
+		client,
+		store=createHostsStore({ client,loadRuntime: () => runtimeStore.load() }),
+		defaultDraft=DEFAULT_HOST_PROVISION_DRAFT,
+		capabilityOptions=[
+			...CODE_SESSION_REQUIRED_LABELS,
+			'benchmark',
+			'gpu',
+			'windows',
+			'build:windows'
+		],
+		submitLabel='Provision host',
+		onProvisioned,
+		onCancel,
+		onError
+	}: Props=$props();
+
+	let name=$state(untrack(() => defaultDraft.name??''));
+	let hostId=$state(untrack(() => defaultDraft.hostId??''));
+	let hostIdEdited=$state(untrack(() => Boolean(defaultDraft.hostId)));
+	let description=$state(untrack(() => defaultDraft.description??''));
+	let provider=$state<ProvisionHostForm['provider']>(
+		untrack(() => defaultDraft.provider??'do')
+	);
+	let adapter=$state(untrack(() => defaultDraft.adapter??'digitalocean-droplet'));
+	let region=$state(untrack(() => defaultDraft.region??'sfo3'));
+	let dropletSize=$state(
+		untrack(() => defaultDraft.dropletSize??defaultDraft.size??'s-1vcpu-1gb')
+	);
+	let image=$state(untrack(() => defaultDraft.image??'ubuntu-24-04-x64'));
+	let tagsText=$state(untrack(() => (defaultDraft.tags??[]).join(', ')));
+	let sshKeyIdsText=$state(untrack(() => (defaultDraft.sshKeyIds??[]).join(', ')));
+	let expiresInHours=$state(untrack(() => String(defaultDraft.expiresInHours??24)));
+	let capabilityLabels=$state(
+		untrack(() => uniqueHostCapabilityLabels(defaultDraft.capabilityLabels??[]))
+	);
+	let restrictedWorkload=$state(untrack(() => defaultDraft.restrictedWorkload===true));
+	let ownerProviderCredentialKey=$state(
+		untrack(() => defaultDraft.ownerProviderCredentialKey??'')
+	);
+	let preset=$state(untrack(() => defaultDraft.preset??''));
+	let isSubmitting=$state(false);
+	let submitError=$state<string|null>(null);
+	let result=$state<ProvisionHostResponse|null>(null);
+
+	function parseCsv(value: string): string[] {
+		return value
+			.split(',')
+			.map((item) => item.trim())
+			.filter(Boolean);
+	}
+
+	function onNameInput(value: string): void {
+		name=value;
+		if(!hostIdEdited) hostId=slugifyHostId(value);
+	}
+
+	function buildDraft(): HostProvisionDraft {
+		return {
+			hostId,
+			name,
+			description,
+			environment: 'consumer',
+			provider,
+			adapter,
+			region,
+			dropletSize,
+			image,
+			tags: parseCsv(tagsText),
+			sshKeyIds: parseCsv(sshKeyIdsText),
+			expiresInHours: Number(expiresInHours),
+			capabilityLabels,
+			restrictedWorkload: preset==='game-server'? true:restrictedWorkload,
+			ownerProviderCredentialKey: ownerProviderCredentialKey.trim()||undefined,
+			preset: preset||undefined
+		};
+	}
+
+	async function submit(): Promise<void> {
+		isSubmitting=true;
+		submitError=null;
+		try {
+			const operation=await settle(async () => {
+				const input=provisionHostFormSchema.parse(createProvisionHostFormFromDraft(buildDraft()));
+				result=await store.provision(input);
+				onProvisioned?.(result);
+			});
+			if(!operation.ok) {
+				const err=operation.cause;
+				const error=err instanceof Error? err:new Error(String(err));
+				submitError=error.message;
+				onError?.(error);
+			}
+		} finally {
+			isSubmitting=false;
+		}
+	}
+</script>
+
+<form
+	class="border-border bg-background space-y-4 rounded-md border p-4"
+	onsubmit={(event) => {
+		event.preventDefault();
+		void submit();
+	}}
+>
+	<div class="flex items-center justify-between gap-3">
+		<div class="min-w-0">
+			<div class="text-sm font-medium">On-demand host</div>
+			<div class="text-muted-foreground text-xs">
+				Creates a ready-to-use cloud host and connects it to your workspace.
+			</div>
+		</div>
+		<Badge variant="outline" class="shrink-0">{capabilityLabels.length} labels</Badge>
+	</div>
+
+	{#if result}
+		<div class="border-border bg-muted/30 rounded-md border px-3 py-3 text-sm">
+			<div class="flex items-center gap-2">
+				<Icon icon="lucide:check-circle" class="size-4 text-green-600" />
+				<span class="font-medium">{result.host.name}</span>
+				<Badge>{result.host.status}</Badge>
+			</div>
+			<div class="text-muted-foreground mt-2 font-mono text-xs break-all">
+				{result.host.hostId} / {result.sandboxResourceId}
+			</div>
+		</div>
+	{/if}
+
+	<div class="grid gap-4 md:grid-cols-2">
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-name">Display name</label>
+			<Input
+				id="host-provision-name"
+				value={name}
+				oninput={(event) => onNameInput((event.target as HTMLInputElement).value)}
+				required
+				maxlength={120}
+				placeholder="Windows build host"
+			/>
+		</div>
+
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-id">Host ID</label>
+			<Input
+				id="host-provision-id"
+				bind:value={hostId}
+				oninput={() => {
+					hostIdEdited = true;
+				}}
+				required
+				pattern="[a-z0-9-]+"
+				maxlength={64}
+				placeholder="windows-build-host"
+			/>
+		</div>
+
+		<div class="space-y-1.5 md:col-span-2">
+			<label class="text-xs font-medium" for="host-provision-description">Description</label>
+			<Input
+				id="host-provision-description"
+				bind:value={description}
+				placeholder="Optional fleet note"
+			/>
+		</div>
+
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-provider">Provider</label>
+			<select
+				id="host-provision-provider"
+				bind:value={provider}
+				class="border-input bg-background ring-offset-background focus-visible:ring-ring h-9 w-full rounded-md border px-3 text-sm focus-visible:ring-2 focus-visible:outline-none"
+			>
+				<option value="do">DigitalOcean</option>
+				<option value="custom">Custom</option>
+				<option value="aws">AWS</option>
+				<option value="gcp">GCP</option>
+				<option value="azure">Azure</option>
+			</select>
+		</div>
+
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-adapter">Cloud setup</label>
+			<select
+				id="host-provision-adapter"
+				bind:value={adapter}
+				class="border-input bg-background ring-offset-background focus-visible:ring-ring h-9 w-full rounded-md border px-3 text-sm focus-visible:ring-2 focus-visible:outline-none"
+			>
+				<option value="digitalocean-droplet">digitalocean-droplet</option>
+				<option value="digitalocean-doks">digitalocean-doks</option>
+				<option value="cloudflare-worker">cloudflare-worker</option>
+			</select>
+		</div>
+
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-region">Region</label>
+			<Input id="host-provision-region" bind:value={region} required placeholder="sfo3" />
+		</div>
+
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-size">Host size</label>
+			<Input id="host-provision-size" bind:value={dropletSize} required placeholder="s-1vcpu-1gb" />
+		</div>
+
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-image">Image</label>
+			<Input id="host-provision-image" bind:value={image} required placeholder="ubuntu-24-04-x64" />
+		</div>
+
+		<div class="space-y-1.5 md:col-span-2">
+			<label class="flex items-start gap-2 text-sm" for="host-provision-restricted">
+				<input
+					id="host-provision-restricted"
+					type="checkbox"
+					class="mt-1"
+					checked={restrictedWorkload || preset === 'game-server'}
+					disabled={preset === 'game-server'}
+					onchange={(event) => {
+						restrictedWorkload = (event.target as HTMLInputElement).checked;
+					}}
+				/>
+				<span>
+					This host may run workloads providers restrict, including game servers. If
+					checked, compute bills to your cloud account, not Vibes credits.
+				</span>
+			</label>
+		</div>
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-preset">Preset</label>
+			<select
+				id="host-provision-preset"
+				bind:value={preset}
+				class="border-input bg-background h-9 w-full rounded-md border px-3 text-sm"
+			>
+				<option value="">None</option>
+				<option value="game-server">Game server (forces restricted)</option>
+			</select>
+		</div>
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-owner-key">Owner provider key</label>
+			<Input
+				id="host-provision-owner-key"
+				bind:value={ownerProviderCredentialKey}
+				placeholder="OMNIFRAME_PLAY_DIGITALOCEAN_API_TOKEN"
+				autocomplete="off"
+			/>
+		</div>
+
+		<div class="space-y-1.5">
+			<label class="text-xs font-medium" for="host-provision-ttl"
+				>Setup link expires after (hours)</label
+			>
+			<Input
+				id="host-provision-ttl"
+				type="number"
+				min="1"
+				max="168"
+				bind:value={expiresInHours}
+				required
+			/>
+		</div>
+
+		<div class="space-y-1.5 md:col-span-2">
+			<label class="text-xs font-medium" for="host-provision-tags">Tags</label>
+			<Input id="host-provision-tags" bind:value={tagsText} placeholder="env:prod, role:worker" />
+		</div>
+
+		<div class="space-y-1.5 md:col-span-2">
+			<label class="text-xs font-medium" for="host-provision-ssh">SSH key IDs</label>
+			<Input id="host-provision-ssh" bind:value={sshKeyIdsText} placeholder="Optional comma list" />
+		</div>
+	</div>
+
+	<div class="space-y-2">
+		<div class="text-xs font-medium">Capabilities</div>
+		<HostCapabilitySelector bind:selectedLabels={capabilityLabels} options={capabilityOptions} />
+	</div>
+
+	{#if submitError}
+		<div
+			class="border-destructive/30 bg-destructive/5 text-destructive rounded-md border px-3 py-2 text-sm"
+		>
+			{submitError}
+		</div>
+	{/if}
+
+	<div class="flex justify-end gap-2">
+		{#if onCancel}
+			<Button type="button" variant="outline" onclick={onCancel} disabled={isSubmitting}>
+				Cancel
+			</Button>
+		{/if}
+		<Button type="submit" disabled={isSubmitting}>
+			<Icon icon={isSubmitting ? 'lucide:loader-circle' : 'lucide:cloud'} class="size-4" />
+			{isSubmitting ? 'Provisioning' : submitLabel}
+		</Button>
+	</div>
+</form>

package/dist/svelte/components/HostProvisionForm.svelte.d.ts

@@ -0,0 +1,17 @@
+import { type ProvisionHostResponse } from '@vibesdotdev/platform/hosts/schemas/provision';
+import { type HostsStore } from '../stores/hosts.svelte.ts';
+import { type HostProvisionDraft, type PlatformHostsClient } from '../runtime.ts';
+interface Props {
+    client?: PlatformHostsClient;
+    store?: HostsStore;
+    defaultDraft?: HostProvisionDraft;
+    capabilityOptions?: string[];
+    submitLabel?: string;
+    onProvisioned?: (result: ProvisionHostResponse) => void;
+    onCancel?: () => void;
+    onError?: (error: Error) => void;
+}
+declare const HostProvisionForm: import("svelte").Component<Props, {}, "">;
+type HostProvisionForm = ReturnType<typeof HostProvisionForm>;
+export default HostProvisionForm;
+//# sourceMappingURL=HostProvisionForm.svelte.d.ts.map

package/dist/svelte/components/HostProvisionForm.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HostProvisionForm.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/components/HostProvisionForm.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,EAGL,KAAK,qBAAqB,EAC1B,MAAM,+CAA+C,CAAC;AAExD,OAAO,EAAmB,KAAK,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EAML,KAAK,kBAAkB,EACvB,KAAK,mBAAmB,EACxB,MAAM,eAAe,CAAC;AAGvB,UAAU,KAAK;IACd,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,YAAY,CAAC,EAAE,kBAAkB,CAAC;IAClC,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACxD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CACjC;AAoQF,QAAA,MAAM,iBAAiB,2CAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}

package/dist/svelte/components/HostSelector.svelte

@@ -0,0 +1,172 @@
+<script lang="ts">
+	import { settle } from '@vibesdotdev/kernel';
+	import { getRuntimeSvelteContext } from '@vibesdotdev/surface-sveltekit/svelte';
+	import { onMount } from 'svelte';
+	import { Badge } from '@vibesdotdev/kit/components/ui/badge';
+	import { Button } from '@vibesdotdev/kit/components/ui/button';
+	import { Icon } from '@vibesdotdev/kit/components/icon';
+	import { Input } from '@vibesdotdev/kit/components/ui/input';
+	import { Spinner } from '@vibesdotdev/kit/components/ui/spinner';
+	import { createHostsStore,type HostsStore } from '../stores/hosts.svelte.js';
+	import {
+		getHostCapabilityLabels,
+		hostSupportsLabels,
+		type HostOption,
+		type PlatformHostsClient,
+		type PlatformSvelteData
+	} from '../runtime.js';
+
+	interface Props {
+		hosts?: HostOption[];
+		initialData?: PlatformSvelteData|null;
+		client?: PlatformHostsClient;
+		store?: HostsStore;
+		loadOnMount?: boolean;
+		selectedHostId?: string;
+		requiredLabels?: string[];
+		includeInactive?: boolean;
+		onSelect?: (host: HostOption) => void;
+		placeholder?: string;
+		/** When set, the empty state links here to provision/enroll a host. */
+		provisionHref?: string;
+	}
+
+	const runtimeStore=getRuntimeSvelteContext();
+	let {
+		hosts=undefined,
+		initialData=null,
+		client,
+		store=createHostsStore({ client,initialData,initialHosts: hosts??[],loadRuntime: () => runtimeStore.load() }),
+		loadOnMount=hosts===undefined,
+		selectedHostId=$bindable(undefined),
+		requiredLabels=[],
+		includeInactive=false,
+		onSelect,
+		placeholder='Search hosts...',
+		provisionHref=undefined
+	}: Props=$props();
+
+	let searchQuery=$state('');
+	const hostItems=$derived(hosts??store.hosts);
+
+	const filteredHosts=$derived.by(() => {
+		const query=searchQuery.trim().toLowerCase();
+		return hostItems.filter((host: HostOption) => {
+			if(!includeInactive&&host.status!=='active') return false;
+			if(!hostSupportsLabels(host,requiredLabels)) return false;
+			if(!query) return true;
+			return [host.name,host.hostId,host.description,host.provider,host.region]
+				.filter(Boolean)
+				.join(' ')
+				.toLowerCase()
+				.includes(query);
+		});
+	});
+
+	function selectHost(host: HostOption) {
+		selectedHostId=host.hostId;
+		onSelect?.(host);
+	}
+
+	async function loadHosts() {
+		const operation=await settle(async () => {
+			await store.load();
+		});
+		if(!operation.ok) {
+			const failure=operation.cause;
+			store.error=failure instanceof Error? failure:new Error(String(failure));
+		}
+	}
+
+	onMount(() => {
+		if(!loadOnMount||store.loaded||store.loading) return;
+		void loadHosts();
+	});
+</script>
+
+<div class="space-y-3">
+	<div class="relative">
+		<Icon
+			icon="lucide:search"
+			class="absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground"
+		/>
+		<Input bind:value={searchQuery} {placeholder} class="h-9 pl-9" />
+	</div>
+
+	<div class="max-h-80 space-y-1 overflow-y-auto pr-1">
+		{#if store.loading && filteredHosts.length === 0}
+			<div class="flex items-center justify-center py-12 text-muted-foreground">
+				<Spinner class="size-5" />
+			</div>
+		{:else if store.error}
+			<div
+				class="space-y-3 rounded-md border border-destructive/30 bg-destructive/5 px-3 py-4 text-sm"
+			>
+				<div class="flex items-start gap-2">
+					<Icon icon="lucide:circle-alert" class="mt-0.5 size-4 shrink-0 text-destructive" />
+					<div class="min-w-0 space-y-1">
+						<p class="font-medium text-destructive">Could not load hosts</p>
+						<p class="break-words text-xs text-muted-foreground">{store.error.message}</p>
+					</div>
+				</div>
+				<Button
+					type="button"
+					size="sm"
+					variant="outline"
+					class="h-8 gap-1 text-xs"
+					onclick={() => void loadHosts()}
+				>
+					<Icon icon="lucide:refresh-cw" class="size-3.5" />
+					Retry
+				</Button>
+			</div>
+		{:else if filteredHosts.length === 0}
+			<div class="flex flex-col items-center gap-2 rounded-md border border-dashed border-border px-3 py-8 text-center text-sm text-muted-foreground">
+				<span>No hosts match the required capabilities.</span>
+				{#if provisionHref}
+					<a
+						href={provisionHref}
+						target="_blank"
+						rel="noopener noreferrer"
+						class="inline-flex items-center gap-1.5 text-xs font-medium text-primary hover:underline"
+					>
+						<Icon icon="lucide:plus" class="size-3.5" />
+						Enroll a host
+					</a>
+				{/if}
+			</div>
+		{:else}
+			{#each filteredHosts as host (host.id)}
+				{@const selected = selectedHostId === host.hostId}
+				<button
+					type="button"
+					class={`flex w-full items-start gap-3 rounded-md border px-3 py-2 text-left transition-colors hover:border-border hover:bg-muted/60 ${
+						selected ? 'border-primary bg-primary/5' : 'border-transparent'
+					}`}
+					onclick={() => selectHost(host)}
+				>
+					<span class="flex size-8 shrink-0 items-center justify-center rounded-md border border-border bg-background">
+						<Icon icon={selected ? 'lucide:check' : 'lucide:server'} class="size-4" />
+					</span>
+					<span class="min-w-0 flex-1 space-y-1">
+						<span class="flex min-w-0 items-center gap-2">
+							<span class="truncate text-sm font-medium">{host.name}</span>
+							<Badge variant={host.status === 'active' ? 'default' : 'secondary'} class="shrink-0 px-1.5 text-[10px]">
+								{host.status}
+							</Badge>
+							<Badge variant="outline" class="shrink-0 px-1.5 text-[10px] uppercase">{host.provider}</Badge>
+						</span>
+						<span class="block truncate text-xs text-muted-foreground">
+							{host.hostId}{host.region ? ` · ${host.region}` : ''}
+						</span>
+						<div class="flex flex-wrap gap-1">
+							{#each getHostCapabilityLabels(host).slice(0, 5) as label (label)}
+								<Badge variant="secondary" class="px-1 text-[10px]">{label}</Badge>
+							{/each}
+						</div>
+					</span>
+				</button>
+			{/each}
+		{/if}
+	</div>
+</div>

package/dist/svelte/components/HostSelector.svelte.d.ts

@@ -0,0 +1,20 @@
+import { type HostsStore } from '../stores/hosts.svelte.ts';
+import { type HostOption, type PlatformHostsClient, type PlatformSvelteData } from '../runtime.ts';
+interface Props {
+    hosts?: HostOption[];
+    initialData?: PlatformSvelteData | null;
+    client?: PlatformHostsClient;
+    store?: HostsStore;
+    loadOnMount?: boolean;
+    selectedHostId?: string;
+    requiredLabels?: string[];
+    includeInactive?: boolean;
+    onSelect?: (host: HostOption) => void;
+    placeholder?: string;
+    /** When set, the empty state links here to provision/enroll a host. */
+    provisionHref?: string;
+}
+declare const HostSelector: import("svelte").Component<Props, {}, "selectedHostId">;
+type HostSelector = ReturnType<typeof HostSelector>;
+export default HostSelector;
+//# sourceMappingURL=HostSelector.svelte.d.ts.map

package/dist/svelte/components/HostSelector.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HostSelector.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/components/HostSelector.svelte.ts"],"names":[],"mappings":"AAWA,OAAO,EAAmB,KAAK,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EAGL,KAAK,UAAU,EACf,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,MAAM,eAAe,CAAC;AAGvB,UAAU,KAAK;IACd,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC;IACrB,WAAW,CAAC,EAAE,kBAAkB,GAAC,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uEAAuE;IACvE,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB;AAwIF,QAAA,MAAM,YAAY,yDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}