@lavalogic/scoria 0.0.1

package/dist/Components/Table/Misc/TableHorizontalBar.svelte

@@ -0,0 +1,171 @@
+<svelte:options runes />
+
+<script lang="ts" generics="T extends object">
+	import Button from '../../Button.svelte';
+	import { Side } from '../../../Types/Internal/Side.js';
+	import { Size } from '../../../Types/Internal/Size.js';
+	import { Variant } from '../../../Types/Internal/Variant.js';
+	import { getContext } from 'svelte';
+	import { TableContext } from '../Types/Context/TableContext.svelte.js';
+	import { ExpandedPanel } from '../Types/ExpandedPanel.js';
+	import ColumnPanelModal from './ColumnPanelModal.svelte';
+	import FilterPanelModal from './FilterPanelModal.svelte';
+	import ToolboxPanelModal from './FilterPanelModal.svelte';
+
+	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+
+	const panels = {
+		[ExpandedPanel.None]: null,
+		[ExpandedPanel.Column]: ColumnPanelModal,
+		[ExpandedPanel.Filter]: FilterPanelModal,
+		[ExpandedPanel.Toolbox]: ToolboxPanelModal
+	} as const;
+
+	let expandedPanel: ExpandedPanel | null = $state(null as ExpandedPanel | null);
+
+	let ExpandedPanelElement = $derived(expandedPanel ? panels[expandedPanel] : null);
+</script>
+
+{#if ExpandedPanelElement != null}
+	<ExpandedPanelElement
+		onclose={() => {
+			expandedPanel = null;
+		}}
+	/>
+{/if}
+<div class="sidebar">
+	<Button
+		side={Side.Bottom}
+		onclick={() => {
+			tableContext.toggleQuickFiltering();
+		}}
+		toggled={tableContext.showQuickFiltering}
+		size={Size.Small}
+		disabled={!tableContext.allowQuickFiltering}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'assessment'
+		}}>Quick Filter</Button
+	>
+	<Button
+		side={Side.Bottom}
+		disabled={!tableContext.allowAdvancedFiltering}
+		toggled={expandedPanel === ExpandedPanel.Filter}
+		onclick={() => {
+			expandedPanel = expandedPanel === ExpandedPanel.Filter ? null : ExpandedPanel.Filter;
+		}}
+		size={Size.Small}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'filter-bars'
+		}}>Advanced Filter</Button
+	>
+	<Button
+		side={Side.Bottom}
+		onclick={() => {
+			expandedPanel = expandedPanel === ExpandedPanel.Column ? null : ExpandedPanel.Column;
+		}}
+		size={Size.Small}
+		variant={Variant.Toolbar}
+		toggled={expandedPanel === ExpandedPanel.Column}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'columns'
+		}}>Modify Columns</Button
+	>
+	<Button
+		size={Size.Small}
+		side={Side.Bottom}
+		toggled={expandedPanel === ExpandedPanel.Toolbox}
+		onclick={() => {
+			expandedPanel = expandedPanel === ExpandedPanel.Toolbox ? null : ExpandedPanel.Toolbox;
+		}}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'category'
+		}}>My Tool Box</Button
+	>
+	{#if tableContext.dataRepo?.addEmptyRow}
+		<Button
+			size={Size.Small}
+			side={Side.Bottom}
+			onclick={() => {
+				tableContext.dataRepo?.addEmptyRow?.();
+			}}
+			variant={Variant.Toolbar}
+			iconTop={{
+				// colour: Colour.$alt,
+				name: 'plus'
+			}}>Add a Row</Button
+		>
+	{/if}
+
+	{#if tableContext.paginationRepo?.reload}
+		<Button
+			side={Side.Bottom}
+			onclick={() => {
+				tableContext.paginationRepo?.reload?.();
+			}}
+			toggled={tableContext.dataRepo?.isLoading}
+			size={Size.Small}
+			disabled={!tableContext.allowQuickFiltering}
+			variant={Variant.Toolbar}
+			iconTop={{
+				// colour: Colour.$alt,
+				name: 'refresh'
+			}}>Refresh</Button
+		>
+	{/if}
+
+	<div class="filler"></div>
+
+	<!-- <Button
+		size={Size.Small}
+		side={Side.Bottom}
+		toggled={expandedPanel === ExpandedPanel.Toolbox}
+		onclick={() => {
+			expandedPanel = expandedPanel === ExpandedPanel.Toolbox ? null : ExpandedPanel.Toolbox;
+		}}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'database-download'
+		}}>Export Records</Button
+	>
+	<Button
+		size={Size.Small}
+		side={Side.Bottom}
+		toggled={expandedPanel === ExpandedPanel.Toolbox}
+		onclick={() => {
+			expandedPanel = expandedPanel === ExpandedPanel.Toolbox ? null : ExpandedPanel.Toolbox;
+		}}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'setting-cog'
+		}}>Table Configuration</Button
+	> -->
+</div>
+
+<style>.sidebar {
+  flex-flow: row nowrap;
+  text-orientation: sideways;
+  align-self: stretch;
+  box-shadow: 0px 0px 0px 3px #d5dbe0 inset;
+  display: flex;
+  justify-content: start;
+  border-radius: 4px;
+  gap: 1px;
+  background-color: #cbd4da;
+  overflow-y: auto;
+  flex-shrink: 0;
+  z-index: 1;
+  width: 100%;
+}
+.sidebar .filler {
+  flex-grow: 2;
+  background-color: #ffffff;
+}</style>

package/dist/Components/Table/Misc/TableHorizontalBar.svelte.d.ts

@@ -0,0 +1,24 @@
+declare function $$render<T extends object>(): {
+    props: Record<string, never>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends object> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends object>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends object>(internal: unknown, props: {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const TableHorizontalBar: $$IsomorphicComponent;
+type TableHorizontalBar<T extends object> = InstanceType<typeof TableHorizontalBar<T>>;
+export default TableHorizontalBar;

package/dist/Components/Table/Misc/TableSidebar.svelte

@@ -0,0 +1,186 @@
+<svelte:options runes />
+
+<script lang="ts" generics="T extends object">
+	import Button from '../../Button.svelte';
+	import { Side } from '../../../Types/Internal/Side.js';
+	import { Size } from '../../../Types/Internal/Size.js';
+	import { Variant } from '../../../Types/Internal/Variant.js';
+	import { getContext } from 'svelte';
+	import { TableContext } from '../Types/Context/TableContext.svelte.js';
+	import { ExpandedPanel } from '../Types/ExpandedPanel.js';
+	import { ToolbarPosition } from '../Types/Toolbar/ToolbarPosition.js';
+	import ColumnPanel from './ColumnPanel.svelte';
+	import FilterPanel from './FilterPanel.svelte';
+	import ToolboxPanel from './ToolboxPanel.svelte';
+	import SidePanel from './SidePanel.svelte';
+	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+
+	const panels = {
+		[ExpandedPanel.None]: null,
+		[ExpandedPanel.Column]: ColumnPanel,
+		[ExpandedPanel.Filter]: FilterPanel,
+		[ExpandedPanel.Toolbox]: ToolboxPanel
+	};
+
+	let expandedPanel = $state<ExpandedPanel | null>(null);
+
+	$effect(() => {
+		tableContext.limitFooter = !!expandedPanel;
+	});
+
+	let ExpandedPanelElement = $derived(expandedPanel ? panels[expandedPanel] : null);
+
+	function handleClickOutside(e: MouseEvent) {
+		if (
+			(e.target as HTMLElement).isConnected &&
+			(e.target as HTMLElement).closest('.side-content') == null &&
+			(e.target as HTMLElement).closest('.sidebar') == null
+		) {
+			expandedPanel = null;
+		}
+	}
+
+	function handleEscKey(e: KeyboardEvent) {
+		if (e.key === 'Escape') {
+			expandedPanel = null;
+		}
+	}
+</script>
+
+<svelte:window onclick={handleClickOutside} onkeydown={handleEscKey} />
+
+{#if ExpandedPanelElement != null}
+	<SidePanel toolbarPosition={tableContext.toolbarPosition}>
+		<ExpandedPanelElement />
+	</SidePanel>
+{/if}
+<div class="sidebar">
+	<!-- TODO may have to disable the sidebar class when it is not toggled -->
+
+	<Button
+		side={tableContext.toolbarPosition === ToolbarPosition.Left ? Side.Left : Side.Right}
+		onclick={() => {
+			tableContext.toggleQuickFiltering();
+		}}
+		toggled={tableContext.showQuickFiltering}
+		disabled={!tableContext.allowQuickFiltering}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'assessment',
+			size: Size.Medium
+		}}
+		label="Quick Filter"
+	/>
+	<Button
+		side={tableContext.toolbarPosition === ToolbarPosition.Left ? Side.Left : Side.Right}
+		disabled={!tableContext.allowAdvancedFiltering}
+		toggled={expandedPanel === ExpandedPanel.Filter}
+		onclick={() => {
+			expandedPanel = expandedPanel === ExpandedPanel.Filter ? null : ExpandedPanel.Filter;
+		}}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'filter-bars',
+			size: Size.Medium
+		}}
+		label="Advanced Filter"
+	/>
+	<Button
+		side={tableContext.toolbarPosition === ToolbarPosition.Left ? Side.Left : Side.Right}
+		onclick={() => {
+			expandedPanel = expandedPanel === ExpandedPanel.Column ? null : ExpandedPanel.Column;
+		}}
+		variant={Variant.Toolbar}
+		toggled={expandedPanel === ExpandedPanel.Column}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'columns',
+			size: Size.Medium
+		}}
+		label="Modify Columns"
+	/>
+	<Button
+		side={tableContext.toolbarPosition === ToolbarPosition.Left ? Side.Left : Side.Right}
+		toggled={expandedPanel === ExpandedPanel.Toolbox}
+		onclick={() => {
+			expandedPanel = expandedPanel === ExpandedPanel.Toolbox ? null : ExpandedPanel.Toolbox;
+		}}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'category',
+			size: Size.Medium
+		}}
+		label="My Tool Box"
+	/>
+
+	{#if tableContext.paginationRepo?.reload}
+		<Button
+			side={tableContext.toolbarPosition === ToolbarPosition.Left ? Side.Left : Side.Right}
+			onclick={() => {
+				tableContext.paginationRepo?.reload?.();
+			}}
+			disabled={!tableContext.allowQuickFiltering}
+			variant={Variant.Toolbar}
+			toggled={tableContext.dataRepo?.isLoading}
+			iconTop={{
+				// colour: Colour.$alt,
+				name: 'refresh',
+				size: Size.Medium
+			}}
+			label="Refresh"
+		/>
+	{/if}
+
+	<div class="filler"></div>
+	<!-- <Button
+		side={tableContext.toolbarPosition === ToolbarPosition.Left ? Side.Left : Side.Right}
+		toggled={expandedPanel === ExpandedPanel.Toolbox}
+		onclick={(e) => {
+			expandedPanel = expandedPanel === ExpandedPanel.Toolbox ? null : ExpandedPanel.Toolbox;
+		}}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'database-download',
+			size: Size.Medium
+		}}
+		label="Export Records"
+	/>
+	<Button
+		side={tableContext.toolbarPosition === ToolbarPosition.Left ? Side.Left : Side.Right}
+		toggled={expandedPanel === ExpandedPanel.Toolbox}
+		onclick={(e) => {
+			expandedPanel = expandedPanel === ExpandedPanel.Toolbox ? null : ExpandedPanel.Toolbox;
+		}}
+		variant={Variant.Toolbar}
+		iconTop={{
+			// colour: Colour.$alt,
+			name: 'setting-cog',
+			size: Size.Medium
+		}}
+		label="Table Configuration"
+	/> -->
+</div>
+
+<style>.sidebar {
+  flex-flow: column nowrap;
+  text-orientation: sideways;
+  align-self: stretch;
+  box-shadow: 0px 0px 0px 3px #d5dbe0 inset;
+  display: flex;
+  justify-content: start;
+  gap: 1px;
+  background-color: #cbd4da;
+  border-radius: 4px;
+  overflow-y: auto;
+  flex-shrink: 0;
+  z-index: 1;
+  height: 100%;
+}
+.sidebar .filler {
+  flex-grow: 2;
+  background-color: #ffffff;
+}</style>

package/dist/Components/Table/Misc/TableSidebar.svelte.d.ts

@@ -0,0 +1,24 @@
+declare function $$render<T extends object>(): {
+    props: Record<string, never>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends object> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends object>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends object>(internal: unknown, props: {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const TableSidebar: $$IsomorphicComponent;
+type TableSidebar<T extends object> = InstanceType<typeof TableSidebar<T>>;
+export default TableSidebar;

package/dist/Components/Table/Misc/ToolboxPanel.svelte

@@ -0,0 +1,84 @@
+<svelte:options runes />
+
+<script lang="ts" generics="T extends object">
+	import { getContext } from 'svelte';
+	import { TableContext } from '../Types/Context/TableContext.svelte.js';
+	import Checkbox from '../../Checkbox.svelte';
+
+	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+
+	const onCompactChange = (e: Event) => {
+		tableContext.setIsCompact((e.target as HTMLInputElement).checked);
+	};
+
+	const onSingleCLickChange = (e: Event) => {
+		tableContext.setSingleClickEditing((e.target as HTMLInputElement).checked);
+	};
+
+	const onAlternateRowColoursChange = (e: Event) => {
+		tableContext.setAlternateRowColours((e.target as HTMLInputElement).checked);
+	};
+
+	const onChangeColourOnHoverChange = (e: Event) => {
+		tableContext.setChangeColourOnHover((e.target as HTMLInputElement).checked);
+	};
+
+	const onCopyWithHeadersChange = (e: Event) => {
+		tableContext.setCopyWithHeaders((e.target as HTMLInputElement).checked);
+	};
+
+	const onCommaSeparatedCopyChange = (e: Event) => {
+		tableContext.setCommaSeparatedCopy((e.target as HTMLInputElement).checked);
+	};
+</script>
+
+<div class="column-panel">
+	<h3>Settings</h3>
+	<Checkbox
+		label="Compact"
+		id={`is-compact-${tableContext.tableName}`}
+		value={tableContext.isCompact}
+		onchange={onCompactChange}
+	/>
+	<Checkbox
+		label="Single Click Editing"
+		id={`single-click-editing-${tableContext.tableName}`}
+		value={tableContext.singleClickEditing}
+		onchange={onSingleCLickChange}
+	/>
+	<Checkbox
+		label="Alternate Row Colours"
+		id={`alternate-row-colours-${tableContext.tableName}`}
+		value={tableContext.alternateRowColours}
+		onchange={onAlternateRowColoursChange}
+	/>
+	<Checkbox
+		label="Change Colour on Hover"
+		id={`change-colour-on-hover-${tableContext.tableName}`}
+		value={tableContext.changeColourOnHover}
+		onchange={onChangeColourOnHoverChange}
+	/>
+	{#if tableContext.allowCopy}
+		<Checkbox
+			label="Include Headers When Copying"
+			id={`copy-with-headers-${tableContext.tableName}`}
+			value={tableContext.copyWithHeaders}
+			onchange={onCopyWithHeadersChange}
+		/>
+		<Checkbox
+			label="Copy as Comma Separated Values"
+			id={`comma-separated-copy-${tableContext.tableName}`}
+			value={tableContext.commaSeparatedCopy}
+			onchange={onCommaSeparatedCopyChange}
+		/>
+	{/if}
+</div>
+
+<style>div.column-panel {
+  padding: 0.5rem;
+  display: flex;
+  flex-flow: column nowrap;
+  gap: 0.5rem;
+  background-color: #ffffff;
+  height: 100%;
+}</style>

package/dist/Components/Table/Misc/ToolboxPanel.svelte.d.ts

@@ -0,0 +1,24 @@
+declare function $$render<T extends object>(): {
+    props: Record<string, never>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends object> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends object>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends object>(internal: unknown, props: {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const ToolboxPanel: $$IsomorphicComponent;
+type ToolboxPanel<T extends object> = InstanceType<typeof ToolboxPanel<T>>;
+export default ToolboxPanel;

package/dist/Components/Table/Misc/ToolboxPanelModal.svelte

@@ -0,0 +1,108 @@
+<svelte:options runes />
+
+<script lang="ts" module>
+	export interface ToolboxPanelModalProps {
+		onclose?: () => void;
+	}
+</script>
+
+<script lang="ts" generics="T extends object">
+	import Checkbox from '../../Checkbox.svelte';
+	import { getContext } from 'svelte';
+	import { TableContext } from '../Types/Context/TableContext.svelte.js';
+	import DesktopModal from '../../DesktopModal.svelte';
+
+	let { onclose }: ToolboxPanelModalProps = $props();
+
+	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+
+	const onCompactChange = (e: Event) => {
+		tableContext.setIsCompact((e.target as HTMLInputElement).checked);
+	};
+
+	const onSingleCLickChange = (e: Event) => {
+		tableContext.setSingleClickEditing((e.target as HTMLInputElement).checked);
+	};
+
+	const onAlternateRowColoursChange = (e: Event) => {
+		tableContext.setAlternateRowColours((e.target as HTMLInputElement).checked);
+	};
+
+	const onChangeColourOnHoverChange = (e: Event) => {
+		tableContext.setChangeColourOnHover((e.target as HTMLInputElement).checked);
+	};
+
+	const onCopyWithHeadersChange = (e: Event) => {
+		tableContext.setCopyWithHeaders((e.target as HTMLInputElement).checked);
+	};
+
+	const onCommaSeparatedCopyChange = (e: Event) => {
+		tableContext.setCommaSeparatedCopy((e.target as HTMLInputElement).checked);
+	};
+</script>
+
+<DesktopModal
+	headerLabel="Table Settings"
+	onclose={() => onclose?.()}
+	buttons={[{ label: 'Close', callback: () => onclose?.() }]}
+>
+	<div class="flex">
+		<div class="column-panel">
+			<Checkbox
+				label="Compact"
+				id={`is-compact-${tableContext.tableName}-modal`}
+				value={tableContext.isCompact}
+				onchange={onCompactChange}
+			/>
+			<Checkbox
+				label="Single Click Editing"
+				id={`single-click-editing-${tableContext.tableName}-modal`}
+				value={tableContext.singleClickEditing}
+				onchange={onSingleCLickChange}
+			/>
+			<Checkbox
+				label="Alternate Row Colours"
+				id={`alternate-row-colours-${tableContext.tableName}-modal`}
+				value={tableContext.alternateRowColours}
+				onchange={onAlternateRowColoursChange}
+			/>
+			<Checkbox
+				label="Change Colour on Hover"
+				id={`change-colour-on-hover-${tableContext.tableName}-modal`}
+				value={tableContext.changeColourOnHover}
+				onchange={onChangeColourOnHoverChange}
+			/>
+			{#if tableContext.allowCopy}
+				<Checkbox
+					label="Include Headers When Copying"
+					id={`copy-with-headers-${tableContext.tableName}-modal`}
+					value={tableContext.copyWithHeaders}
+					onchange={onCopyWithHeadersChange}
+				/>
+				<Checkbox
+					label="Copy as Comma Separated Values"
+					id={`comma-separated-copy-${tableContext.tableName}-modal`}
+					value={tableContext.commaSeparatedCopy}
+					onchange={onCommaSeparatedCopyChange}
+				/>
+			{/if}
+		</div>
+	</div>
+</DesktopModal>
+
+<style>.flex {
+  display: flex;
+  flex-flow: column nowrap;
+  height: 100%;
+  width: 100%;
+  flex: 1;
+}
+
+div.column-panel {
+  padding: 0.5rem;
+  display: flex;
+  flex-flow: column nowrap;
+  gap: 0.5rem;
+  background-color: #ffffff;
+  height: 100%;
+}</style>

package/dist/Components/Table/Misc/ToolboxPanelModal.svelte.d.ts

@@ -0,0 +1,27 @@
+export interface ToolboxPanelModalProps {
+    onclose?: () => void;
+}
+declare function $$render<T extends object>(): {
+    props: ToolboxPanelModalProps;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends object> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends object>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends object>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const ToolboxPanelModal: $$IsomorphicComponent;
+type ToolboxPanelModal<T extends object> = InstanceType<typeof ToolboxPanelModal<T>>;
+export default ToolboxPanelModal;