@vit-foundation/ui 0.25.0 → 0.27.0

package/dist/contract.d.ts

@@ -17,9 +17,13 @@
  * is what makes it a promise rather than a description: adding a `.svelte`
  * anywhere beneath it fails here rather than in a consumer's server build.
  *
- * It adds nothing. Every name below is already exported from a semantic
- * subpath and stays there — this is a second door into the same rooms, not a
- * new floor, and the barrel remains the surface a component host reads.
+ * It adds almost nothing. Every name below is already exported from a
+ * semantic subpath and stays there — this is a second door into the same
+ * rooms, not a new floor, and the barrel remains the surface a component host
+ * reads. `contract-names.test.ts` holds that to be true, name by name and from
+ * the same source module; its `CONTRACT_ONLY` list names the three exceptions
+ * (the two destination classifiers and the title format), each with its
+ * reason, so a fourth cannot arrive unexplained.
  *
  * It was cut to fit ONE consumer, and the second one did not fit through it.
  * vit-brain's four restatements were the motive, so the first version carried
@@ -38,7 +42,7 @@
  * the guard walks them like the rest.
  */
 export { LOCALES, BASE_LOCALE } from './config/types.js';
-export type { Locale, NotParameterized, ParameterizedKey, ParameterlessKey, SiteLink, UiMessages } from './config/types.js';
+export type { Locale, NotParameterized, ParameterlessKey, SiteLink, UiMessages } from './config/types.js';
 export { localize } from './edit/types.js';
 export type { CollectionRef, ContentRef, EditableEntity, EditDescriptor, EntityOp, LocalizedText, PropertyDescriptor, PropertyOption, PropertyType, PropertyValue } from './edit/types.js';
 export { REACTIONS } from './content/types.js';

package/dist/contract.js

@@ -17,9 +17,13 @@
  * is what makes it a promise rather than a description: adding a `.svelte`
  * anywhere beneath it fails here rather than in a consumer's server build.
  *
- * It adds nothing. Every name below is already exported from a semantic
- * subpath and stays there — this is a second door into the same rooms, not a
- * new floor, and the barrel remains the surface a component host reads.
+ * It adds almost nothing. Every name below is already exported from a
+ * semantic subpath and stays there — this is a second door into the same
+ * rooms, not a new floor, and the barrel remains the surface a component host
+ * reads. `contract-names.test.ts` holds that to be true, name by name and from
+ * the same source module; its `CONTRACT_ONLY` list names the three exceptions
+ * (the two destination classifiers and the title format), each with its
+ * reason, so a fourth cannot arrive unexplained.
  *
  * It was cut to fit ONE consumer, and the second one did not fit through it.
  * vit-brain's four restatements were the motive, so the first version carried

package/dist/edit/Editable.svelte

@@ -1,14 +1,11 @@
 <script lang="ts">
-	import type { Snippet } from 'svelte';
-	import { getUiConfig } from '../config/context.js';
-	import { getEditAdapter } from './context.js';
-	import { commitState } from './commit.svelte.js';
-	import type { EditDescriptor } from './types.js';
+	import type { EditableProps } from './chrome-props.js';
+	import { getEditAdapter, getEditChrome } from './context.js';
 
 	/**
-	 * The inline-edit primitive. It renders no element of its own: the child
-	 * snippet receives the text and a bag of attributes, and spreads both onto
-	 * whatever semantic element the call site owns —
+	 * The inline-edit primitive's GATE. It renders no element of its own: the
+	 * child snippet receives the text and a bag of attributes, and spreads
+	 * both onto whatever semantic element the call site owns —
 	 *
 	 *   <Editable edit={descriptor} value={title}>
 	 *     {#snippet children(text, attrs)}<h3 {...attrs}>{text}</h3>{/snippet}
@@ -20,164 +17,23 @@
 	 *
 	 * Inactive — no `edit` descriptor, no adapter in context (a read-only
 	 * app), or the adapter's `isEditing` off — it renders the child with an
-	 * empty attribute bag: no listeners, no wrapper, no cost.
-	 *
-	 * Active, it makes the element a plain-text `contenteditable` textbox.
-	 * The DOM owns the draft while the reader types; this component reads it
-	 * back on commit. Enter commits single-line fields (Cmd/Ctrl+Enter for
-	 * 'multiline'), Escape reverts to the last saved value, blur commits a
-	 * dirty draft. A failed save keeps the draft on screen in the error state
-	 * so nothing typed is lost. State is announced through a visually hidden
-	 * `role="status"` region, the pattern ShareRow set for its copy action.
-	 *
-	 * Styling for the affordance lives in base.css (`[data-vit-editing]`):
-	 * the element is rendered by the *caller's* markup, which scoped styles
-	 * here could never reach.
+	 * empty attribute bag: no listeners, no wrapper, no cost. Active, it
+	 * mounts the LIVE half the host installed (`edit/live/Editable.svelte`,
+	 * through `setEditAdapter`'s chrome), which owns the contenteditable, the
+	 * commit lifecycle and the announcements. This file imports none of that,
+	 * so a renderer that imports it ships none of that (`chrome-props.ts`).
 	 */
-	interface EditableAttrs {
-		contenteditable?: 'plaintext-only' | 'true';
-		role?: 'textbox';
-		'aria-label'?: string;
-		'aria-multiline'?: 'true';
-		'data-vit-editing'?: 'idle' | 'dirty' | 'saving' | 'error';
-		onbeforeinput?: (event: InputEvent) => void;
-		oninput?: (event: Event) => void;
-		onblur?: (event: FocusEvent) => void;
-		onkeydown?: (event: KeyboardEvent) => void;
-		onpaste?: (event: ClipboardEvent) => void;
-	}
-
-	interface Props {
-		/** Identity of the string. Omit it and this is a passthrough. */
-		edit?: EditDescriptor;
-		value: string;
-		children: Snippet<[string, EditableAttrs]>;
-	}
-
-	let { edit, value, children }: Props = $props();
+	let { edit, value, children }: EditableProps = $props();
 
 	const adapter = getEditAdapter();
-	const config = getUiConfig();
-
-	/**
-	 * The commit lifecycle — the four states, the announcements, the last
-	 * persisted value and the follow-the-prop rule — is shared with
-	 * `PropertyRow` (see `./commit.svelte.js`). What stays here is where the
-	 * DRAFT lives: in the DOM, because this is a contenteditable.
-	 */
-	// svelte-ignore state_referenced_locally
-	const commit_ = commitState(value, config.editMessages);
-	/** What the child snippet renders. Only rewritten while the DOM is not
-	 * being typed in — Svelte and the reader must not fight over the node. */
-	// svelte-ignore state_referenced_locally
-	let renderText = $state(value);
-
-	$effect(() => {
-		const adopted = commit_.follow(value);
-		if (adopted !== null) renderText = adopted;
-	});
+	const chrome = getEditChrome();
 
 	const active = $derived(edit !== undefined && (adapter?.isEditing ?? false));
-	const multiline = $derived(edit?.format === 'multiline' || edit?.format === 'richtext');
-
-	/** contenteditable text, innerText keeps line breaks; NBSPs become spaces. */
-	function textOf(element: HTMLElement): string {
-		return (element.innerText ?? element.textContent ?? '').replace(/\u00a0/g, ' ');
-	}
-
-	function handleBeforeInput(event: InputEvent): void {
-		// 'plaintext-only' is not universal (Firefox); strip rich insertions.
-		if (event.inputType === 'insertFromPaste' || event.inputType === 'insertFromDrop') return;
-		if (!multiline && event.inputType === 'insertParagraph') event.preventDefault();
-	}
-
-	function handlePaste(event: ClipboardEvent): void {
-		// Plain text only, whatever the clipboard holds.
-		event.preventDefault();
-		const text = event.clipboardData?.getData('text/plain') ?? '';
-		const selection = window.getSelection();
-		if (!selection || selection.rangeCount === 0) return;
-		const range = selection.getRangeAt(0);
-		range.deleteContents();
-		range.insertNode(document.createTextNode(multiline ? text : text.replace(/\s*\n\s*/g, ' ')));
-		selection.collapseToEnd();
-		commit_.markDirty();
-	}
-
-	function handleInput(): void {
-		commit_.markDirty();
-	}
-
-	async function commit(element: HTMLElement): Promise<void> {
-		if (!edit || !adapter) return;
-		const draft = textOf(element).trim();
-		if (draft === commit_.saved) {
-			commit_.settle();
-			return;
-		}
-		// A failed save leaves the draft in the DOM; the reader decides whether
-		// to retry.
-		await commit_.commit(draft, () => adapter.save(edit, draft));
-	}
-
-	function handleBlur(event: FocusEvent): void {
-		const status = commit_.status;
-		if (status === 'dirty' || status === 'error') void commit(event.currentTarget as HTMLElement);
-	}
-
-	function handleKeydown(event: KeyboardEvent): void {
-		const element = event.currentTarget as HTMLElement;
-		if (event.key === 'Escape') {
-			// Svelte's cached text still equals renderText, so a state write
-			// alone cannot repaint a node the reader has mutated: restore the
-			// DOM directly, then settle.
-			element.textContent = commit_.saved;
-			commit_.revert();
-			element.blur();
-			return;
-		}
-		const commitKey = multiline
-			? event.key === 'Enter' && (event.metaKey || event.ctrlKey)
-			: event.key === 'Enter';
-		if (commitKey) {
-			event.preventDefault();
-			void commit(element);
-		}
-	}
-
-	const attrs = $derived<EditableAttrs>(
-		active
-			? {
-					contenteditable: 'plaintext-only',
-					role: 'textbox',
-					'aria-label': edit?.label,
-					'aria-multiline': multiline ? 'true' : undefined,
-					'data-vit-editing': commit_.status,
-					onbeforeinput: handleBeforeInput,
-					oninput: handleInput,
-					onblur: handleBlur,
-					onkeydown: handleKeydown,
-					onpaste: handlePaste
-				}
-			: {}
-	);
 </script>
 
-{@render children(renderText, attrs)}
-{#if active}
-	<span class="status" role="status">{commit_.announcement}</span>
+{#if active && chrome}
+	{@const Live = chrome.Editable}
+	<Live {edit} {value} {children} />
+{:else}
+	{@render children(value, {})}
 {/if}
-
-<style>
-	.status {
-		position: absolute;
-		width: 1px;
-		height: 1px;
-		padding: 0;
-		margin: -1px;
-		overflow: hidden;
-		clip-path: inset(50%);
-		white-space: nowrap;
-		border: 0;
-	}
-</style>

package/dist/edit/Editable.svelte.d.ts

@@ -1,52 +1,4 @@
-import type { Snippet } from 'svelte';
-import type { EditDescriptor } from './types.js';
-/**
- * The inline-edit primitive. It renders no element of its own: the child
- * snippet receives the text and a bag of attributes, and spreads both onto
- * whatever semantic element the call site owns —
- *
- *   <Editable edit={descriptor} value={title}>
- *     {#snippet children(text, attrs)}<h3 {...attrs}>{text}</h3>{/snippet}
- *   </Editable>
- *
- * — the same contract Field uses for its control attrs, and for the same
- * reason: the element (h1, p, span) is part of the document outline and
- * belongs to the caller, not behind a prop.
- *
- * Inactive — no `edit` descriptor, no adapter in context (a read-only
- * app), or the adapter's `isEditing` off — it renders the child with an
- * empty attribute bag: no listeners, no wrapper, no cost.
- *
- * Active, it makes the element a plain-text `contenteditable` textbox.
- * The DOM owns the draft while the reader types; this component reads it
- * back on commit. Enter commits single-line fields (Cmd/Ctrl+Enter for
- * 'multiline'), Escape reverts to the last saved value, blur commits a
- * dirty draft. A failed save keeps the draft on screen in the error state
- * so nothing typed is lost. State is announced through a visually hidden
- * `role="status"` region, the pattern ShareRow set for its copy action.
- *
- * Styling for the affordance lives in base.css (`[data-vit-editing]`):
- * the element is rendered by the *caller's* markup, which scoped styles
- * here could never reach.
- */
-interface EditableAttrs {
-    contenteditable?: 'plaintext-only' | 'true';
-    role?: 'textbox';
-    'aria-label'?: string;
-    'aria-multiline'?: 'true';
-    'data-vit-editing'?: 'idle' | 'dirty' | 'saving' | 'error';
-    onbeforeinput?: (event: InputEvent) => void;
-    oninput?: (event: Event) => void;
-    onblur?: (event: FocusEvent) => void;
-    onkeydown?: (event: KeyboardEvent) => void;
-    onpaste?: (event: ClipboardEvent) => void;
-}
-interface Props {
-    /** Identity of the string. Omit it and this is a passthrough. */
-    edit?: EditDescriptor;
-    value: string;
-    children: Snippet<[string, EditableAttrs]>;
-}
-declare const Editable: import("svelte").Component<Props, {}, "">;
+import type { EditableProps } from './chrome-props.js';
+declare const Editable: import("svelte").Component<EditableProps, {}, "">;
 type Editable = ReturnType<typeof Editable>;
 export default Editable;

package/dist/edit/chrome/AddSlot.svelte

@@ -1,89 +1,22 @@
 <script lang="ts">
-	import Icon from '../../components/ui/Icon.svelte';
-	import { getUiConfig } from '../../config/context.js';
-	import { getEditAdapter } from '../context.js';
-	import type { EntityOp } from '../types.js';
+	import type { AddSlotProps } from '../chrome-props.js';
+	import { getEditAdapter, getEditChrome } from '../context.js';
 
 	/**
-	 * The "+" affordance of an editable collection. Renders ONLY while the
-	 * adapter is editing AND implements `applyOp` — otherwise nothing, the
-	 * byte-identical invariant. The op resolves server-side and the host's
-	 * refresh brings the new row in; this control only shows pending/error.
+	 * The "+" affordance's GATE. Renders ONLY while the adapter is editing
+	 * AND implements `applyOp` — otherwise nothing, the byte-identical
+	 * invariant. The control itself, its pending state and its announcement
+	 * live in `edit/live/AddSlot.svelte`, installed by the host.
 	 */
-	interface Props {
-		op: Extract<EntityOp, { kind: 'create' }>;
-		/** The entity noun for the label, e.g. "una fita". */
-		label?: string;
-	}
-
-	let { op, label = '' }: Props = $props();
+	let { op, label = '' }: AddSlotProps = $props();
 
 	const adapter = getEditAdapter();
-	const config = getUiConfig();
-
-	let pending = $state(false);
-	let announcement = $state('');
+	const chrome = getEditChrome();
 
 	const active = $derived((adapter?.isEditing ?? false) && adapter?.applyOp !== undefined);
-	const text = $derived(config.editMessages.edit_add({ label }).trim());
-
-	async function add(): Promise<void> {
-		if (!adapter?.applyOp || pending) return;
-		pending = true;
-		announcement = '';
-		try {
-			await adapter.applyOp(op);
-		} catch {
-			announcement = config.editMessages.edit_addFailed();
-		} finally {
-			pending = false;
-		}
-	}
 </script>
 
-{#if active}
-	<button type="button" class="add" disabled={pending} onclick={() => void add()}>
-		<Icon name="plus" size={16} />
-		{text}
-	</button>
-	<span class="status" role="status">{announcement}</span>
+{#if active && chrome}
+	{@const Live = chrome.AddSlot}
+	<Live {op} {label} />
 {/if}
-
-<style>
-	.add {
-		display: inline-flex;
-		align-items: center;
-		gap: var(--space-1);
-		padding: var(--space-1) var(--space-3);
-		border: 1px dashed var(--color-ink-muted);
-		border-radius: 999px;
-		background: transparent;
-		color: var(--color-ink);
-		font: inherit;
-		font-size: var(--text-sm);
-		cursor: pointer;
-		transition: border-color var(--transition-fast);
-	}
-
-	.add:hover:not(:disabled) {
-		border-color: var(--color-brand);
-		color: var(--color-brand);
-	}
-
-	.add:disabled {
-		opacity: 0.5;
-		cursor: default;
-	}
-
-	.status {
-		position: absolute;
-		width: 1px;
-		height: 1px;
-		padding: 0;
-		margin: -1px;
-		overflow: hidden;
-		clip-path: inset(50%);
-		white-space: nowrap;
-		border: 0;
-	}
-</style>

package/dist/edit/chrome/AddSlot.svelte.d.ts

@@ -1,17 +1,4 @@
-import type { EntityOp } from '../types.js';
-/**
- * The "+" affordance of an editable collection. Renders ONLY while the
- * adapter is editing AND implements `applyOp` — otherwise nothing, the
- * byte-identical invariant. The op resolves server-side and the host's
- * refresh brings the new row in; this control only shows pending/error.
- */
-interface Props {
-    op: Extract<EntityOp, {
-        kind: 'create';
-    }>;
-    /** The entity noun for the label, e.g. "una fita". */
-    label?: string;
-}
-declare const AddSlot: import("svelte").Component<Props, {}, "">;
+import type { AddSlotProps } from '../chrome-props.js';
+declare const AddSlot: import("svelte").Component<AddSlotProps, {}, "">;
 type AddSlot = ReturnType<typeof AddSlot>;
 export default AddSlot;

package/dist/edit/chrome/EditFrame.svelte

@@ -1,171 +1,28 @@
 <script lang="ts">
-	import type { Snippet } from 'svelte';
-	import IconButton from '../../components/ui/IconButton.svelte';
-	import { getUiConfig } from '../../config/context.js';
-	import { getEditAdapter } from '../context.js';
-	import type { EntityOp } from '../types.js';
-	import ConfirmDialog from './ConfirmDialog.svelte';
-	import EditPopover from './EditPopover.svelte';
-
-	/** What one framed component tells the frame about itself. */
-	export interface EditFrameSpec {
-		/** Human name of the thing, e.g. "Fita: Neix la fundació". */
-		label: string;
-		/** Gates the gear — true when the panel snippet has rows to show. */
-		hasPanel?: boolean;
-		/** Gates the trash: removing this item from its collection. */
-		removeOp?: Extract<EntityOp, { kind: 'remove' }>;
-	}
+	import type { EditFrameProps } from '../chrome-props.js';
+	import { getEditAdapter, getEditChrome } from '../context.js';
 
 	/**
-	 * The page-builder wrapper: a corner toolbar (revealed on hover AND
-	 * :focus-within — never hover-only) with a gear that opens the property
-	 * panel and a trash that confirms, then applies the remove op.
-	 *
-	 * Triple-gated per affordance: spec present ∧ adapter editing ∧ the
-	 * capability method present. With nothing to offer it renders the children
-	 * ALONE — zero wrapper element, so an unadapted app's DOM is byte-identical
-	 * (pinned by test). Components mount it INSIDE their own root element, so
-	 * the wrapper never disturbs the parent's flex/grid.
+	 * The page-builder wrapper's GATE. With no spec, no adapter or editing
+	 * off it renders the children ALONE — zero wrapper element, so an
+	 * unadapted app's DOM is byte-identical (pinned by test). Editing, it
+	 * mounts the live frame the host installed (`edit/live/EditFrame.svelte`),
+	 * which owns the corner toolbar, the property popover and the confirmed
+	 * remove, and which applies the finer per-affordance gates itself.
+	 * Components mount this INSIDE their own root element, so the wrapper
+	 * never disturbs the parent's flex/grid.
 	 */
-	interface Props {
-		spec?: EditFrameSpec;
-		/** The panel content — an EditPanel with this component's rows. */
-		panel?: Snippet;
-		children: Snippet;
-	}
-
-	let { spec, panel, children }: Props = $props();
+	let { spec, panel, children }: EditFrameProps = $props();
 
 	const adapter = getEditAdapter();
-	const config = getUiConfig();
+	const chrome = getEditChrome();
 
 	const editing = $derived(spec !== undefined && (adapter?.isEditing ?? false));
-	const showGear = $derived(
-		editing && spec?.hasPanel === true && panel !== undefined && adapter?.saveProperty !== undefined
-	);
-	const showTrash = $derived(
-		editing && spec?.removeOp !== undefined && adapter?.applyOp !== undefined
-	);
-	const framed = $derived(showGear || showTrash);
-
-	let panelOpen = $state(false);
-	let confirming = $state(false);
-	let removing = $state(false);
-	let announcement = $state('');
-	let toolbar: HTMLDivElement | undefined = $state();
-
-	function closePanel(): void {
-		panelOpen = false;
-		// The popover owned focus; hand it back to the control that opened it.
-		toolbar?.querySelector('button')?.focus();
-	}
-
-	async function remove(): Promise<void> {
-		if (!adapter?.applyOp || !spec?.removeOp) return;
-		removing = true;
-		try {
-			await adapter.applyOp(spec.removeOp);
-			// The host's refresh unmounts this frame with the removed item.
-			confirming = false;
-		} catch {
-			confirming = false;
-			announcement = config.editMessages.edit_saveError();
-		} finally {
-			removing = false;
-		}
-	}
 </script>
 
-{#if framed && spec}
-	<div class="vit-edit-frame">
-		{@render children()}
-		<div class="toolbar" bind:this={toolbar}>
-			{#if showGear}
-				<IconButton
-					icon="gear"
-					label={config.editMessages.edit_properties({ label: spec.label })}
-					onclick={() => (panelOpen = !panelOpen)}
-				/>
-			{/if}
-			{#if showTrash}
-				<IconButton
-					icon="trash"
-					label={config.editMessages.edit_remove()}
-					onclick={() => (confirming = true)}
-				/>
-			{/if}
-		</div>
-		{#if panelOpen && panel}
-			<EditPopover
-				label={config.editMessages.edit_properties({ label: spec.label })}
-				onclose={closePanel}
-			>
-				{@render panel()}
-			</EditPopover>
-		{/if}
-		{#if showTrash}
-			<ConfirmDialog
-				open={confirming}
-				title={config.editMessages.edit_remove()}
-				message={config.editMessages.edit_removeConfirm({ label: spec.label })}
-				confirmLabel={config.editMessages.edit_remove()}
-				pending={removing}
-				onconfirm={() => void remove()}
-				oncancel={() => (confirming = false)}
-			/>
-		{/if}
-		<span class="status" role="status">{announcement}</span>
-	</div>
+{#if editing && chrome}
+	{@const Live = chrome.EditFrame}
+	<Live {spec} {panel} {children} />
 {:else}
 	{@render children()}
 {/if}
-
-<style>
-	.vit-edit-frame {
-		position: relative;
-		border-radius: var(--radius);
-		outline: 1px dashed transparent;
-		outline-offset: 4px;
-		transition: outline-color var(--transition-fast);
-	}
-
-	.vit-edit-frame:hover,
-	.vit-edit-frame:focus-within {
-		outline-color: var(--color-brand);
-	}
-
-	.toolbar {
-		position: absolute;
-		top: calc(-1 * var(--space-2));
-		right: 0;
-		display: flex;
-		gap: 2px;
-		z-index: var(--z-raised);
-		background: var(--color-surface);
-		border: 1px solid var(--color-hairline);
-		border-radius: var(--radius);
-		box-shadow: var(--shadow-1);
-		opacity: 0;
-		pointer-events: none;
-		transition: opacity var(--transition-fast);
-	}
-
-	.vit-edit-frame:hover .toolbar,
-	.vit-edit-frame:focus-within .toolbar {
-		opacity: 1;
-		pointer-events: auto;
-	}
-
-	.status {
-		position: absolute;
-		width: 1px;
-		height: 1px;
-		padding: 0;
-		margin: -1px;
-		overflow: hidden;
-		clip-path: inset(50%);
-		white-space: nowrap;
-		border: 0;
-	}
-</style>

package/dist/edit/chrome/EditFrame.svelte.d.ts

@@ -1,33 +1,4 @@
-import type { Snippet } from 'svelte';
-import type { EntityOp } from '../types.js';
-/** What one framed component tells the frame about itself. */
-export interface EditFrameSpec {
-    /** Human name of the thing, e.g. "Fita: Neix la fundació". */
-    label: string;
-    /** Gates the gear — true when the panel snippet has rows to show. */
-    hasPanel?: boolean;
-    /** Gates the trash: removing this item from its collection. */
-    removeOp?: Extract<EntityOp, {
-        kind: 'remove';
-    }>;
-}
-/**
- * The page-builder wrapper: a corner toolbar (revealed on hover AND
- * :focus-within — never hover-only) with a gear that opens the property
- * panel and a trash that confirms, then applies the remove op.
- *
- * Triple-gated per affordance: spec present ∧ adapter editing ∧ the
- * capability method present. With nothing to offer it renders the children
- * ALONE — zero wrapper element, so an unadapted app's DOM is byte-identical
- * (pinned by test). Components mount it INSIDE their own root element, so
- * the wrapper never disturbs the parent's flex/grid.
- */
-interface Props {
-    spec?: EditFrameSpec;
-    /** The panel content — an EditPanel with this component's rows. */
-    panel?: Snippet;
-    children: Snippet;
-}
-declare const EditFrame: import("svelte").Component<Props, {}, "">;
+import type { EditFrameProps } from '../chrome-props.js';
+declare const EditFrame: import("svelte").Component<EditFrameProps, {}, "">;
 type EditFrame = ReturnType<typeof EditFrame>;
 export default EditFrame;