windmill-components 1.35.1 → 1.35.43

package/components/FlowPreview.svelte

@@ -1,107 +0,0 @@
-<script>import { sendUserToast, truncateRev } from '../utils';
-import { faChevronDown, faChevronUp } from '@fortawesome/free-solid-svg-icons';
-import Icon from 'svelte-awesome';
-import { flowStateStore, flowStateToFlow } from './flows/flowState';
-import { mapJobResultsToFlowState } from './flows/flowStateUtils';
-import { runFlowPreview } from './flows/utils';
-import FlowStatusViewer from './FlowStatusViewer.svelte';
-import RunForm from './RunForm.svelte';
-import Tab from './common/tabs/Tab.svelte';
-import TabContent from './common/tabs/TabContent.svelte';
-import Tabs from './common/tabs/Tabs.svelte';
-export let i;
-export let flow;
-export let schema;
-export let args = {};
-let stepArgs = {};
-let tab = 'upto';
-let viewPreview = false;
-let uptoText = i >= flow.value.modules.length - 1 ? 'Preview whole flow' : 'Preview up to this step';
-let jobId;
-export async function runPreview(args) {
-    viewPreview = true;
-    flow = flowStateToFlow($flowStateStore, flow);
-    let newFlow = tab == 'upto' ? truncateFlow(flow) : setInputTransformFromArgs(extractStep(flow), args);
-    jobId = await runFlowPreview(args, newFlow);
-    sendUserToast(`started preview ${truncateRev(jobId, 10)}`);
-}
-function truncateFlow(flow) {
-    const localFlow = JSON.parse(JSON.stringify(flow));
-    localFlow.value.modules = flow.value.modules.slice(0, i + 1);
-    return localFlow;
-}
-function extractStep(flow) {
-    const localFlow = JSON.parse(JSON.stringify(flow));
-    localFlow.value.modules = flow.value.modules.slice(i, i + 1);
-    localFlow.schema = schema;
-    return localFlow;
-}
-function setInputTransformFromArgs(flow, args) {
-    let input_transforms = {};
-    Object.entries(args).forEach(([key, value]) => {
-        input_transforms[key] = {
-            type: 'static',
-            value: value
-        };
-    });
-    flow.value.modules[0].input_transforms = input_transforms;
-    return flow;
-}
-</script>
-
-<button
-	class="w-full rounded border-1 border border-gray-200"
-	on:click={() => {
-		viewPreview = !viewPreview
-	}}
->
-	<h2 class="flex justify-center text-gray-600">
-		<div>
-			Preview
-			<Icon class="ml-1" data={viewPreview ? faChevronUp : faChevronDown} scale={1} />
-		</div>
-	</h2>
-</button>
-
-{#if viewPreview}
-	{#if i != flow.value.modules.length}
-		<div class="mt-2">
-			<Tabs bind:selected={tab}>
-				<Tab value="upto">{uptoText}</Tab>
-				<Tab value="justthis">Preview just this step</Tab>
-				<svelte:fragment slot="content">
-					<TabContent value="upto">
-						<RunForm
-							runnable={truncateFlow(flow)}
-							runAction={(_, args) => runPreview(args)}
-							schedulable={false}
-							buttonText={uptoText}
-							detailed={false}
-							bind:args
-						/>
-					</TabContent>
-					<TabContent value="justthis">
-						<RunForm
-							runnable={extractStep(flow)}
-							runAction={(_, args) => runPreview(args)}
-							schedulable={false}
-							buttonText="Preview just this step"
-							detailed={false}
-							args={stepArgs}
-						/>
-					</TabContent>
-				</svelte:fragment>
-			</Tabs>
-		</div>
-	{/if}
-
-	{#if jobId}
-		<div class="w-full flex justify-center">
-			<FlowStatusViewer
-				{jobId}
-				on:jobsLoaded={(e) => mapJobResultsToFlowState(e.detail, tab, i)}
-				root={true}
-			/>
-		</div>
-	{/if}
-{/if}

package/components/FlowPreview.svelte.d.ts

@@ -1,23 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Schema } from '../common';
-import type { Flow } from '../gen';
-declare const __propDef: {
-    props: {
-        i: number;
-        flow: Flow;
-        schema: Schema;
-        args?: Record<string, any> | undefined;
-        runPreview?: ((args: any) => Promise<void>) | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export declare type FlowPreviewProps = typeof __propDef.props;
-export declare type FlowPreviewEvents = typeof __propDef.events;
-export declare type FlowPreviewSlots = typeof __propDef.slots;
-export default class FlowPreview extends SvelteComponentTyped<FlowPreviewProps, FlowPreviewEvents, FlowPreviewSlots> {
-    get runPreview(): (args: any) => Promise<void>;
-}
-export {};

package/components/ModuleStep.svelte

@@ -1,131 +0,0 @@
-<script>import { RawScript } from '../gen';
-import { faChevronDown, faChevronUp } from '@fortawesome/free-solid-svg-icons';
-import Icon from 'svelte-awesome';
-import Editor from './Editor.svelte';
-import EditorBar from './EditorBar.svelte';
-import FlowPreview from './FlowPreview.svelte';
-import FlowBox from './flows/FlowBox.svelte';
-import FlowInputs from './flows/FlowInputs.svelte';
-import FlowModuleHeader from './flows/FlowModuleHeader.svelte';
-import { flowStore } from './flows/flowStore';
-import { createInlineScriptModule, createLoop, fork, loadFlowModuleSchema, pickScript, createScriptFromInlineScript, isEmptyFlowModule, getStepPropPicker } from './flows/flowStateUtils';
-import SchemaForm from './SchemaForm.svelte';
-import { flowStateStore } from './flows/flowState';
-import { stepOpened } from './flows/stepOpenedStore';
-export let indexes;
-export let mod;
-export let args = {};
-export let schema;
-export let childFlowModules = undefined;
-let editor;
-let websocketAlive = { pyright: false, black: false, deno: false };
-let bigEditor = false;
-const i = indexes[0];
-$: shouldPick = isEmptyFlowModule(mod);
-$: stepPropPicker = getStepPropPicker(indexes, $flowStore.schema, $flowStateStore, args);
-async function apply(fn, arg) {
-    const flowModuleSchema = await fn(arg);
-    mod = flowModuleSchema.flowModule;
-    schema = flowModuleSchema.schema;
-    if (flowModuleSchema.childFlowModules) {
-        childFlowModules = flowModuleSchema.childFlowModules;
-    }
-}
-async function reload(flowModule) {
-    apply(loadFlowModuleSchema, flowModule);
-}
-async function applyCreateLoop() {
-    await apply(createLoop, null);
-    stepOpened.update(() => `${indexes[0]}-0`);
-}
-$: opened = $stepOpened === String(indexes.join('-'));
-</script>
-
-<FlowBox
-	headerClickable={true}
-	on:clickheader={() => ($stepOpened = !opened ? String(indexes.join('-')) : undefined)}
->
-	<svelte:fragment slot="header">
-		<FlowModuleHeader
-			bind:mod
-			bind:indexes
-			on:delete
-			on:fork={() => apply(fork, mod)}
-			on:createScriptFromInlineScript={() => {
-				apply(createScriptFromInlineScript, {
-					flowModule: mod,
-					suffix: indexes.join('-'),
-					schema
-				})
-			}}
-		/>
-	</svelte:fragment>
-
-	<div slot="content">
-		{#if opened}
-			<div class="p-6 border-t border-gray-300">
-				{#if shouldPick}
-					<FlowInputs
-						shouldDisableTriggerScripts={i != 0}
-						shouldDisableLoopCreation={indexes.length > 1 || i == 0}
-						on:pick={(e) => apply(pickScript, e.detail.path)}
-						on:new={(e) =>
-							apply(createInlineScriptModule, {
-								language: e.detail.language,
-								type: e.detail.type
-							})}
-						on:loop={() => applyCreateLoop()}
-					/>
-				{/if}
-				{#if mod.value.type === 'rawscript'}
-					<div class="mb-2 overflow-hidden">
-						<EditorBar {editor} {websocketAlive} lang={mod.value.language ?? 'deno'} />
-					</div>
-					<div on:mouseleave={() => reload(mod)}>
-						<Editor
-							bind:websocketAlive
-							bind:this={editor}
-							class="{bigEditor ? 'h-2/3' : 'h-80'} border p-2 rounded"
-							bind:code={mod.value.content}
-							deno={mod.value.language === RawScript.language.DENO}
-							automaticLayout={true}
-							formatAction={() => reload(mod)}
-						/>
-						<button
-							class="w-full text-center"
-							on:click={() => {
-								bigEditor = !bigEditor
-							}}
-						>
-							<Icon data={bigEditor ? faChevronUp : faChevronDown} scale={1.0} />
-						</button>
-					</div>
-					<div class="mt-2 mb-8">
-						<p class="text-gray-500 italic">
-							Move the focus outside of the text editor to recompute the input schema or press
-							Ctrl/Cmd+S
-						</p>
-					</div>
-				{/if}
-				{#if !shouldPick}
-					<p class="text-lg font-bold text-gray-900 mb-2">Step inputs</p>
-					<SchemaForm
-						{schema}
-						inputTransform={true}
-						importPath={String(indexes.join('-'))}
-						bind:pickableProperties={stepPropPicker.pickableProperties}
-						bind:args={mod.input_transforms}
-						bind:extraLib={stepPropPicker.extraLib}
-					/>
-				{/if}
-
-				{#if !shouldPick}
-					<div class="border-b border-gray-200" />
-					<div class="pt-2">
-						<FlowPreview bind:args flow={$flowStore} {i} {schema} />
-					</div>
-				{/if}
-			</div>
-		{/if}
-	</div>
-</FlowBox>

package/components/ModuleStep.svelte.d.ts

@@ -1,25 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import { type FlowModule } from '../gen';
-import type { Schema } from '../common';
-import { type FlowModuleSchema } from './flows/flowState';
-declare const __propDef: {
-    props: {
-        indexes: number[];
-        mod: FlowModule;
-        args?: Record<string, any> | undefined;
-        schema: Schema;
-        childFlowModules?: FlowModuleSchema[] | undefined;
-    };
-    events: {
-        delete: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export declare type ModuleStepProps = typeof __propDef.props;
-export declare type ModuleStepEvents = typeof __propDef.events;
-export declare type ModuleStepSlots = typeof __propDef.slots;
-export default class ModuleStep extends SvelteComponentTyped<ModuleStepProps, ModuleStepEvents, ModuleStepSlots> {
-}
-export {};

package/components/flows/CopyFirstStepSchema.svelte

@@ -1,13 +0,0 @@
-<script>import { Button } from 'flowbite-svelte';
-import { isCopyFirstStepSchemaDisabled } from './flowState';
-import { copyFirstStepSchema } from './flowStore';
-</script>
-
-<Button
-	color="light"
-	size="xs"
-	disabled={$isCopyFirstStepSchemaDisabled}
-	on:click={copyFirstStepSchema}
->
-	Copy from first step schema
-</Button>

package/components/flows/FlowBox.svelte

@@ -1,16 +0,0 @@
-<script>import { createEventDispatcher } from 'svelte';
-import FlowBoxHeader from './FlowBoxHeader.svelte';
-export let title = undefined;
-export let headerClickable = false;
-const dispatch = createEventDispatcher();
-let slots = $$props.$$slots;
-</script>
-
-<div class="bg-white border border-gray-300 rounded-md shadow-md">
-	<FlowBoxHeader clickable={headerClickable} on:click={() => dispatch('clickheader')} {title}>
-		<slot name="header" />
-	</FlowBoxHeader>
-	{#if slots.content}
-		<slot name="content" />
-	{/if}
-</div>

package/components/flows/FlowBox.svelte.d.ts

@@ -1,23 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: any;
-        title?: string | undefined;
-        headerClickable?: boolean | undefined;
-    };
-    events: {
-        clickheader: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        header: {};
-        content: {};
-    };
-};
-export declare type FlowBoxProps = typeof __propDef.props;
-export declare type FlowBoxEvents = typeof __propDef.events;
-export declare type FlowBoxSlots = typeof __propDef.slots;
-export default class FlowBox extends SvelteComponentTyped<FlowBoxProps, FlowBoxEvents, FlowBoxSlots> {
-}
-export {};

package/components/flows/FlowBoxHeader.svelte

@@ -1,16 +0,0 @@
-<script>import { createEventDispatcher } from 'svelte';
-export let title = undefined;
-export let clickable = false;
-const dispatch = createEventDispatcher();
-</script>
-
-<div
-	on:click={() => dispatch('click')}
-	class="flex items-center justify-between flex-wrap px-6 py-2"
-	class:cursor-pointer={clickable}
->
-	{#if title}
-		<h3 class="text-sm font-bold text-gray-900">{title}</h3>
-	{/if}
-	<slot />
-</div>

package/components/flows/FlowBoxHeader.svelte.d.ts

@@ -1,21 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        title?: string | undefined;
-        clickable?: boolean | undefined;
-    };
-    events: {
-        click: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export declare type FlowBoxHeaderProps = typeof __propDef.props;
-export declare type FlowBoxHeaderEvents = typeof __propDef.events;
-export declare type FlowBoxHeaderSlots = typeof __propDef.slots;
-export default class FlowBoxHeader extends SvelteComponentTyped<FlowBoxHeaderProps, FlowBoxHeaderEvents, FlowBoxHeaderSlots> {
-}
-export {};

package/components/flows/FlowInput.svelte

@@ -1,22 +0,0 @@
-<script>import { emptySchema } from '../../utils';
-import SchemaEditor from '../SchemaEditor.svelte';
-import { flowStore } from './../flows/flowStore';
-import CopyFirstStepSchema from './CopyFirstStepSchema.svelte';
-import FlowBox from './FlowBox.svelte';
-</script>
-
-<FlowBox title="Flow Inputs">
-	<div slot="header">
-		<CopyFirstStepSchema />
-	</div>
-	<div slot="content">
-		<div class="p-6 border-t border-gray-300">
-			<SchemaEditor
-				on:change={() => {
-					$flowStore = $flowStore
-				}}
-				schema={$flowStore?.schema ?? emptySchema()}
-			/>
-		</div>
-	</div>
-</FlowBox>

package/components/flows/FlowModuleHeader.svelte

@@ -1,109 +0,0 @@
-<script>import { getScriptByPath } from '../../utils';
-import { faArrowDown, faClose, faCode, faCodeBranch, faSave, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
-import { Button } from 'flowbite-svelte';
-import { createEventDispatcher } from 'svelte';
-import Icon from 'svelte-awesome';
-import { Highlight } from 'svelte-highlight';
-import python from 'svelte-highlight/languages/python';
-import typescript from 'svelte-highlight/languages/typescript';
-import IconedPath from '../IconedPath.svelte';
-import Modal from '../Modal.svelte';
-import { isEmptyFlowModule } from './flowStateUtils';
-import { stepOpened } from './stepOpenedStore';
-export let indexes;
-export let mod;
-$: shouldPick = isEmptyFlowModule(mod);
-let modalViewer;
-let modalViewerContent = '';
-let modalViewerLanguage = 'deno';
-async function viewCode() {
-    if (mod.value.type == 'script') {
-        const { content, language } = await getScriptByPath(mod.value.path);
-        modalViewerContent = content;
-        modalViewerLanguage = language;
-        modalViewer.openModal();
-    }
-    else {
-        throw Error('Not a script');
-    }
-}
-const dispatch = createEventDispatcher();
-$: opened = $stepOpened === String(indexes.join('-'));
-</script>
-
-<div>
-	<h3 class="text-sm font-bold text-gray-900 flex flex-col">
-		<span class="text-xs shrink">
-			{#if 'path' in mod.value && mod.value.path}
-				<IconedPath path={mod.value.path} />
-			{:else if 'language' in mod.value && mod.value.language}
-				Inline {mod.value.language}
-			{:else}
-				Select a script
-			{/if}
-		</span>
-		{#if ('path' in mod.value && mod.value.path) || ('language' in mod.value && mod.value.language)}
-			<input
-				on:click|stopPropagation={() => undefined}
-				class="overflow-x-auto"
-				type="text"
-				bind:value={mod.summary}
-				placeholder="Summary"
-			/>
-		{/if}
-	</h3>
-</div>
-
-<div class="flex flex-row space-x-2" on:click|stopPropagation={() => undefined}>
-	{#if mod.value.type === 'script' && !shouldPick}
-		<Button size="xs" color="alternative" on:click={() => dispatch('fork')}>
-			<Icon data={faCodeBranch} class="mr-2" />
-			Fork
-		</Button>
-		<Button size="xs" color="alternative" on:click={viewCode}>
-			<Icon data={faCode} class="mr-2" />
-			View code
-		</Button>
-	{/if}
-
-	{#if mod.value.type === 'rawscript' && !shouldPick}
-		<Button size="xs" color="alternative" on:click={() => dispatch('createScriptFromInlineScript')}>
-			<Icon data={faSave} class="mr-2" />
-			Save to workspace
-		</Button>
-	{/if}
-	<Button
-		size="xs"
-		color="alternative"
-		on:click={() => {
-			dispatch('delete')
-		}}
-	>
-		<Icon data={faTrashAlt} class="mr-2" />
-		Remove step
-	</Button>
-	{#if opened}
-		<Button size="xs" color="dark" on:click={() => stepOpened.update(() => undefined)}>
-			<Icon data={faClose} />
-		</Button>
-	{:else}
-		<Button
-			size="xs"
-			color="light"
-			on:click={() => stepOpened.update(() => String(indexes.join('-')))}
-		>
-			<Icon data={faArrowDown} />
-		</Button>
-	{/if}
-</div>
-
-<Modal bind:this={modalViewer}>
-	<div slot="title">Script {'path' in mod?.value ? mod?.value.path : ''}</div>
-	<div slot="content">
-		{#if modalViewerLanguage === 'python3'}
-			<Highlight language={python} code={modalViewerContent} />
-		{:else if modalViewerLanguage === 'deno'}
-			<Highlight language={typescript} code={modalViewerContent} />
-		{/if}
-	</div>
-</Modal>

package/components/flows/FlowSettings.svelte

@@ -1,165 +0,0 @@
-<script>import { sendUserToast } from '../../utils';
-import { faFileExport, faFileImport, faGlobe } from '@fortawesome/free-solid-svg-icons';
-import { Button } from 'flowbite-svelte';
-import Icon from 'svelte-awesome';
-import Menu from '../common/menu/Menu.svelte';
-import MenuItem from '../common/menu/MenuItem.svelte';
-import Editor from '../Editor.svelte';
-import FlowViewer from '../FlowViewer.svelte';
-import Modal from '../Modal.svelte';
-import CollapseLink from './../CollapseLink.svelte';
-import CronInput from './../CronInput.svelte';
-import FlowBox from './../flows/FlowBox.svelte';
-import { flowStore, initFlow } from './../flows/flowStore';
-import Path from './../Path.svelte';
-import Required from './../Required.svelte';
-import SchemaForm from './../SchemaForm.svelte';
-import Toggle from './../Toggle.svelte';
-import Tooltip from './../Tooltip.svelte';
-import { stepOpened } from './stepOpenedStore';
-import { cleanInputs } from './utils';
-export let pathError = '';
-export let initialPath = '';
-export let previewArgs = {};
-export let scheduleArgs = {};
-export let scheduleEnabled = false;
-export let scheduleCron = '0 */5 * * *';
-let jsonSetter;
-let jsonViewer;
-let jsonValue = '';
-</script>
-
-<Modal bind:this={jsonSetter}>
-	<div slot="title">Import JSON</div>
-	<div slot="content" class="h-full">
-		<Editor bind:code={jsonValue} lang={'json'} class="h-full" />
-	</div>
-	<div slot="submission">
-		<button
-			class="default-button px-4 py-2 font-semibold"
-			on:click={() => {
-				Object.assign($flowStore, JSON.parse(jsonValue))
-				initFlow($flowStore)
-				stepOpened.update(() => undefined)
-				sendUserToast('OpenFlow imported from JSON')
-				jsonSetter.closeModal()
-			}}
-		>
-			Import
-		</button>
-	</div>
-</Modal>
-
-<Modal bind:this={jsonViewer}>
-	<div slot="title">See JSON</div>
-	<div slot="content" class="h-full">
-		<FlowViewer flow={cleanInputs($flowStore)} tab="json" />
-	</div>
-</Modal>
-
-<FlowBox title="Flow Settings">
-	<div slot="header">
-		<div class="flex flex-row-reverse">
-			<Menu placement="bottom-end">
-				<button slot="trigger" class="text-gray-900 bg-white dark:text-white dark:bg-gray-800">
-					...
-				</button>
-				<div class="divide-y divide-gray-200">
-					<MenuItem
-						on:click={() => {
-							jsonSetter.openModal()
-						}}
-					>
-						<Icon data={faFileImport} scale={0.6} class="inline mr-2" />
-						Import from a JSON OpenFlow
-					</MenuItem>
-					<MenuItem
-						on:click={() => {
-							jsonViewer.openModal()
-						}}
-					>
-						<Icon data={faFileExport} scale={0.6} class="inline mr-2" />
-						Export to a JSON OpenFlow
-					</MenuItem>
-					<MenuItem
-						on:click={() => {
-							const url = new URL('https://hub.windmill.dev/flows/add')
-							const openFlow = {
-								value: $flowStore.value,
-								summary: $flowStore.summary,
-								description: $flowStore.description,
-								schema: $flowStore.schema
-							}
-							url.searchParams.append('flow', btoa(JSON.stringify(openFlow)))
-							window.open(url, '_blank')?.focus()
-						}}
-					>
-						<Icon data={faGlobe} scale={0.6} class="inline mr-2" />
-						Publish to Hub
-					</MenuItem>
-				</div>
-			</Menu>
-		</div>
-	</div>
-
-	<div slot="content">
-		<div class="p-6 border-t border-gray-300">
-			<Path
-				bind:error={pathError}
-				bind:path={$flowStore.path}
-				{initialPath}
-				namePlaceholder="my_flow"
-				kind="flow"
-			>
-				<div slot="ownerToolkit">
-					Flow permissions depend on their path. Select the group <span class="font-mono">all</span>
-					to share your flow, and <span class="font-mono">user</span> to keep it private.
-					<a href="https://docs.windmill.dev/docs/reference/namespaces">docs</a>
-				</div>
-			</Path>
-
-			<label class="block mt-4">
-				<span class="text-gray-700">Summary <Required required={false} /></span>
-				<textarea
-					bind:value={$flowStore.summary}
-					class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
-					placeholder="A very short summary of the flow displayed when the flow is listed"
-					rows="1"
-				/>
-			</label>
-
-			<CollapseLink text="set primary schedule" open={true}>
-				<Tooltip>
-					The primary schedule of a flow is simply a schedule that has the same name as a flow. It
-					can be set and enabled directly within the flow editor. "Watching for new changes" flows
-					are meant to be watching regularly for new items in an external systems. The primary
-					schedule purpose is there to set the periodicity at which you want this watcher to
-					operate.
-				</Tooltip>
-				<Toggle
-					bind:checked={scheduleEnabled}
-					options={{
-						left: 'disabled',
-						right: 'enabled'
-					}}
-				/>
-				<div class="p-2 my-2 rounded" class:bg-gray-300={!scheduleEnabled}>
-					{#if !scheduleEnabled}
-						<span class="font-black">No next scheduled run when disabled</span>
-					{/if}
-					<CronInput bind:schedule={scheduleCron} />
-				</div>
-				<div class="flex flex-row-reverse">
-					<Button
-						color="alternative"
-						size="sm"
-						on:click={() => (scheduleArgs = JSON.parse(JSON.stringify(previewArgs)))}
-					>
-						Copy from preview arguments
-					</Button>
-				</div>
-				<SchemaForm schema={$flowStore.schema} bind:args={scheduleArgs} />
-			</CollapseLink>
-		</div>
-	</div>
-</FlowBox>