windmill-components 1.305.7 → 1.306.8

package/package/assets/app.css

@@ -117,3 +117,24 @@
 		}
 	}
 }
+
+.grid-cell-centered {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+.grid-cell-centered .svelte-select {
+	height: 32px !important;
+}
+
+.grid-cell-centered .selected-item {
+	margin-top: -4px;
+}
+
+.ol-overlaycontainer-stopevent {
+	@apply flex flex-col justify-start items-end;
+}
+.ol-control button {
+	@apply w-7 h-7 center-center bg-surface border  text-secondary 
+	rounded mt-1 mr-1 shadow duration-200 hover:bg-surface-hover focus:bg-surface-hover;
+}

package/package/components/apps/components/display/AppMap.svelte

@@ -1,6 +1,5 @@
 <script>import { getContext } from 'svelte';
 import { initCss } from '../../utils';
-import { InputValue } from '../helpers';
 import { twMerge } from 'tailwind-merge';
 import { Map, View, Feature } from 'ol';
 import { useGeographic } from 'ol/proj';
@@ -8,9 +7,12 @@ import { OSM, Vector as VectorSource } from 'ol/source';
 import { Vector as VectorLayer, Tile as TileLayer } from 'ol/layer';
 import { Point } from 'ol/geom';
 import { defaults as defaultControls } from 'ol/control';
-import { findGridItem, initOutput } from '../../editor/appUtils';
+import { findGridItem, initConfig, initOutput } from '../../editor/appUtils';
 import InitializeComponent from '../helpers/InitializeComponent.svelte';
 import ResolveStyle from '../helpers/ResolveStyle.svelte';
+import { components } from '../../editor/component';
+import ResolveConfig from '../helpers/ResolveConfig.svelte';
+import { Style, Circle, Fill, Stroke, Text } from 'ol/style';
 const LAYER_NAME = {
     MARKER: 'Marker'
 };
@@ -18,7 +20,9 @@ export let id;
 export let configuration;
 export let customCss = undefined;
 export let render;
+export let extraKey = undefined;
 const { app, worldStore, selectedComponent, connectingInput, focusedGrid, mode } = getContext('AppViewerContext');
+const resolvedConfig = initConfig(components['mapcomponent'].initialData.configuration, configuration);
 let outputs = initOutput($worldStore, id, {
     mapRegion: {
         topLeft: { lat: 0, lon: 0 },
@@ -27,18 +31,13 @@ let outputs = initOutput($worldStore, id, {
 });
 let map = undefined;
 let mapElement = undefined;
-let longitude = undefined;
-let latitude = undefined;
-let zoom = undefined;
-// If string, it's a JSON file read as text
-let markers = undefined;
-$: if (map && longitude && latitude) {
-    map.getView().setCenter([longitude, latitude]);
+$: if (map && resolvedConfig.longitude && resolvedConfig.latitude) {
+    map.getView().setCenter([resolvedConfig.longitude, resolvedConfig.latitude]);
 }
-$: if (map && zoom) {
-    map.getView().setZoom(zoom);
+$: if (map && resolvedConfig.zoom) {
+    map.getView().setZoom(resolvedConfig.zoom);
 }
-$: if (map && markers) {
+$: if (map && resolvedConfig.markers) {
     updateMarkers();
 }
 function selectComponent() {
@@ -56,12 +55,12 @@ function getLayersByName(name) {
 function getMarkerArray() {
     let array = undefined;
     try {
-        if (typeof markers === 'string') {
-            const json = JSON.parse(markers);
+        if (typeof resolvedConfig.markers === 'string') {
+            const json = JSON.parse(resolvedConfig.markers);
             array = Array.isArray(json) ? json : [json];
         }
         else {
-            array = markers;
+            array = resolvedConfig.markers;
         }
         return array?.filter((m) => !isNaN(+m.lat) && !isNaN(+m.lon));
     }
@@ -73,24 +72,34 @@ function getMarkerArray() {
 function createMarkerLayers() {
     const markerArray = getMarkerArray();
     return markerArray?.map((m) => {
+        const feature = new Feature({
+            geometry: new Point([+m.lon, +m.lat]),
+            name: m.title
+        });
+        feature.setStyle(new Style({
+            image: new Circle({
+                radius: m.radius ?? 7,
+                fill: new Fill({ color: m.color ?? '#dc2626' }),
+                stroke: new Stroke({ width: m.strokeWidth ?? 3, color: m.strokeColor ?? '#fca5a5' })
+            }),
+            text: new Text({
+                text: m.title,
+                font: '12px Calibri,sans-serif',
+                fill: new Fill({ color: '#000' }),
+                stroke: new Stroke({
+                    color: '#fff',
+                    width: 2
+                }),
+                offsetY: -15
+            })
+        }));
         return new VectorLayer({
             properties: {
                 name: LAYER_NAME.MARKER
             },
             source: new VectorSource({
-                features: [
-                    new Feature({
-                        geometry: new Point([+m.lon, +m.lat]),
-                        name: m.title
-                    })
-                ]
-            }),
-            style: {
-                'circle-radius': m.radius ?? 7,
-                'circle-fill-color': m.color ?? '#dc2626',
-                'circle-stroke-width': m.strokeWidth ?? 3,
-                'circle-stroke-color': m.strokeColor ?? '#fca5a5'
-            }
+                features: [feature]
+            })
         });
     });
 }
@@ -116,8 +125,8 @@ $: if (!map && mapElement) {
             ...(createMarkerLayers() || [])
         ],
         view: new View({
-            center: [longitude ?? 0, latitude ?? 0],
-            zoom: zoom ?? 2
+            center: [resolvedConfig.longitude ?? 0, resolvedConfig.latitude ?? 0],
+            zoom: resolvedConfig.zoom ?? 2
         }),
         controls: defaultControls({
             attribution: false
@@ -125,9 +134,21 @@ $: if (!map && mapElement) {
     });
     updateRegionOutput();
 }
+let previousLock = undefined;
+function updateInteractions(map) {
+    if (previousLock === resolvedConfig.lock) {
+        return;
+    }
+    previousLock = resolvedConfig.lock;
+    map.getInteractions().forEach((i) => {
+        i.setActive(!resolvedConfig.lock);
+    });
+    map.changed();
+}
+$: map && resolvedConfig && updateInteractions(map);
 let css = initCss($app.css?.mapcomponent, customCss);
 function updateRegionOutput() {
-    if (map) {
+    if (map && !resolvedConfig.lock) {
         let extent = map.getView().calculateExtent(map.getSize());
         const [left, bottom, right, top] = extent;
         if (outputs?.mapRegion) {
@@ -162,10 +183,16 @@ function handleSyncRegion() {
 }
 </script>
 
-<InputValue key="longitude" {id} input={configuration.longitude} bind:value={longitude} />
-<InputValue key="latitude" {id} input={configuration.latitude} bind:value={latitude} />
-<InputValue key="zoom" {id} input={configuration.zoom} bind:value={zoom} />
-<InputValue key="markers" {id} input={configuration.markers} bind:value={markers} />
+{#each Object.entries(components['mapcomponent'].initialData.configuration) as [key, initialConfig] (key)}
+	<ResolveConfig
+		{id}
+		{extraKey}
+		{key}
+		bind:resolvedConfig={resolvedConfig[key]}
+		configuration={configuration[key]}
+		{initialConfig}
+	/>
+{/each}
 
 <InitializeComponent {id} />
 
@@ -201,38 +228,3 @@ function handleSyncRegion() {
 		{/if}
 	</div>
 {/if}
-
-<style global>
-	:global(.ol-overlaycontainer-stopevent) {
-    display: flex;
-    flex-direction: column;
-    align-items: flex-end;
-    justify-content: flex-start
-}
-	:global(.ol-control) :global(button) {
-    margin-top: 0.25rem;
-    margin-right: 0.25rem;
-    height: 1.75rem;
-    width: 1.75rem;
-    border-radius: 0.25rem;
-    border-width: 1px;
-    --tw-bg-opacity: 1;
-    background-color: rgb(var(--color-surface) / var(--tw-bg-opacity));
-    --tw-text-opacity: 1;
-    color: rgb(var(--color-text-secondary) / var(--tw-text-opacity));
-    --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
-    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-    transition-duration: 200ms;
-    display: flex;
-    justify-content: center;
-    align-items: center
-}
-	:global(.ol-control) :global(button:hover) {
-    --tw-bg-opacity: 1;
-    background-color: rgb(var(--color-surface-hover) / var(--tw-bg-opacity))
-}
-	:global(.ol-control) :global(button:focus) {
-    --tw-bg-opacity: 1;
-    background-color: rgb(var(--color-surface-hover) / var(--tw-bg-opacity))
-}</style>

package/package/components/apps/components/display/AppMap.svelte.d.ts

@@ -6,6 +6,7 @@ declare const __propDef: {
         configuration: RichConfigurations;
         customCss?: ComponentCustomCSS<'mapcomponent'> | undefined;
         render: boolean;
+        extraKey?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/package/components/apps/components/display/table/AppAggridTable.svelte

@@ -1,6 +1,6 @@
 <script>import { GridApi, createGrid } from 'ag-grid-community';
 import { isObject, sendUserToast } from '../../../../../utils';
-import { getContext } from 'svelte';
+import { SvelteComponent, getContext, onDestroy } from 'svelte';
 import RunnableWrapper from '../../helpers/RunnableWrapper.svelte';
 import { initConfig, initOutput } from '../../../editor/appUtils';
 import { components } from '../../../editor/component';
@@ -13,6 +13,7 @@ import { Loader2 } from 'lucide-svelte';
 import { twMerge } from 'tailwind-merge';
 import { initCss } from '../../../utils';
 import ResolveStyle from '../../helpers/ResolveStyle.svelte';
+import AppAggridTableActions from './AppAggridTableActions.svelte';
 // import 'ag-grid-community/dist/styles/ag-theme-alpine-dark.css'
 export let id;
 export let componentInput;
@@ -20,7 +21,11 @@ export let configuration;
 export let initializing = undefined;
 export let render;
 export let customCss = undefined;
-const { app, worldStore, selectedComponent, componentControl, darkMode } = getContext('AppViewerContext');
+export let actions = undefined;
+const context = getContext('AppViewerContext');
+const iterContext = getContext('ListWrapperContext');
+const listInputs = getContext('ListInputs');
+const { app, worldStore, selectedComponent, componentControl, darkMode } = context;
 const rowHeights = {
     normal: 40,
     compact: 30,
@@ -59,6 +64,7 @@ let outputs = initOutput($worldStore, id, {
     page: 0,
     newChange: { row: 0, column: '', value: undefined },
     ready: undefined,
+    inputs: {},
     filters: {},
     displayedRowCount: 0
 });
@@ -75,8 +81,14 @@ function toggleRow(row) {
         if (!deepEqual(outputs?.selectedRow?.peak(), data)) {
             outputs?.selectedRow.set(data);
         }
+        if (iterContext && listInputs) {
+            listInputs.set(id, { selectedRow: data, selectedRowIndex: selectedRowIndex });
+        }
     }
 }
+onDestroy(() => {
+    listInputs?.remove(id);
+});
 function toggleRows(rows) {
     if (rows.length === 0) {
         outputs?.selectedRows.set([]);
@@ -111,16 +123,93 @@ function onCellValueChanged(event) {
 let extraConfig = resolvedConfig.extraConfig;
 let api = undefined;
 let eGui;
-$: loaded && eGui && mountGrid();
 let state = undefined;
+$: loaded && eGui && mountGrid();
+const cachedDivs = new Map();
+function refreshActions(actions) {
+    if (!deepEqual(actions, lastActions)) {
+        lastActions = [...actions];
+        cachedDivs.forEach((cachedDiv) => {
+            cachedDiv.svelteComponent.$destroy();
+            cachedDiv.div.remove();
+        });
+        cachedDivs.clear();
+        updateOptions();
+    }
+}
+let lastActions = undefined;
+$: actions && refreshActions(actions);
+let inputs = {};
+function actionRenderer(params) {
+    const { rowIndex, data: row } = params;
+    if (rowIndex === -1 || actions == undefined || actions?.length == 0) {
+        return null;
+    }
+    if (cachedDivs.has(rowIndex)) {
+        return cachedDivs.get(rowIndex)?.div;
+    }
+    const div = document.createElement('div');
+    div.classList.add('flex', 'flex-row', 'items-center', 'w-full', 'h-full');
+    const svelteComponent = new AppAggridTableActions({
+        target: div,
+        props: {
+            id: id,
+            actions,
+            rowIndex,
+            row,
+            render,
+            wrapActions: resolvedConfig.wrapActions,
+            onSet: (id, value) => {
+                if (!inputs[id]) {
+                    inputs[id] = { [rowIndex]: value };
+                }
+                else {
+                    inputs[id] = { ...inputs[id], [rowIndex]: value };
+                }
+                outputs?.inputs.set(inputs, true);
+            },
+            onRemove: (id) => {
+                if (inputs?.[id] == undefined) {
+                    return;
+                }
+                delete inputs[id][rowIndex];
+                inputs[id] = { ...inputs[id] };
+                if (Object.keys(inputs?.[id] ?? {}).length == 0) {
+                    delete inputs[id];
+                    inputs = { ...inputs };
+                }
+                outputs?.inputs.set(inputs, true);
+            }
+        },
+        context: new Map([['AppViewerContext', context]])
+    });
+    cachedDivs.set(rowIndex, {
+        div,
+        actions,
+        svelteComponent
+    });
+    return div;
+}
 function mountGrid() {
     if (eGui) {
         try {
+            let columnDefs = Array.isArray(resolvedConfig?.columnDefs) && resolvedConfig.columnDefs.every(isObject)
+                ? [...resolvedConfig?.columnDefs] // Clone to avoid direct mutation
+                : [];
+            // Add the action column if actions are defined
+            if (actions && actions.length > 0) {
+                columnDefs.push({
+                    headerName: 'Actions',
+                    cellRenderer: actionRenderer,
+                    autoHeight: true,
+                    cellStyle: { textAlign: 'center' },
+                    cellClass: 'grid-cell-centered',
+                    ...(!resolvedConfig?.wrapActions ? { minWidth: 130 * actions?.length } : {})
+                });
+            }
             createGrid(eGui, {
                 rowData: value,
-                columnDefs: Array.isArray(resolvedConfig?.columnDefs) && resolvedConfig.columnDefs.every(isObject)
-                    ? resolvedConfig?.columnDefs
-                    : [],
+                columnDefs: columnDefs,
                 pagination: resolvedConfig?.pagination,
                 paginationAutoPageSize: resolvedConfig?.pagination,
                 defaultColDef: {
@@ -215,11 +304,23 @@ function updateValue() {
 }
 function updateOptions() {
     try {
+        const columnDefs = Array.isArray(resolvedConfig?.columnDefs) && resolvedConfig.columnDefs.every(isObject)
+            ? [...resolvedConfig?.columnDefs] // Clone to avoid direct mutation
+            : [];
+        // Add the action column if actions are defined
+        if (actions && actions.length > 0) {
+            columnDefs.push({
+                headerName: 'Actions',
+                cellRenderer: actionRenderer,
+                autoHeight: true,
+                cellStyle: { textAlign: 'center' },
+                cellClass: 'grid-cell-centered',
+                ...(!resolvedConfig?.wrapActions ? { minWidth: 130 * actions?.length } : {})
+            });
+        }
         api?.updateGridOptions({
             rowData: value,
-            columnDefs: Array.isArray(resolvedConfig?.columnDefs) && resolvedConfig.columnDefs.every(isObject)
-                ? resolvedConfig?.columnDefs
-                : undefined,
+            columnDefs: columnDefs,
             pagination: resolvedConfig?.pagination,
             paginationAutoPageSize: resolvedConfig?.pagination,
             defaultColDef: {

package/package/components/apps/components/display/table/AppAggridTable.svelte.d.ts

@@ -1,6 +1,7 @@
 import { SvelteComponent } from "svelte";
 import type { AppInput } from '../../../inputType';
 import type { ComponentCustomCSS, RichConfigurations } from '../../../types';
+import { type TableAction } from '../../../editor/component';
 import 'ag-grid-community/styles/ag-grid.css';
 import 'ag-grid-community/styles/ag-theme-alpine.css';
 declare const __propDef: {
@@ -11,6 +12,7 @@ declare const __propDef: {
         initializing?: boolean | undefined;
         render: boolean;
         customCss?: ComponentCustomCSS<'aggridcomponent'> | undefined;
+        actions?: TableAction[] | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/package/components/apps/components/display/table/AppAggridTableActions.svelte

@@ -0,0 +1,232 @@
+<script>import { createEventDispatcher, getContext } from 'svelte';
+import 'ag-grid-community/styles/ag-grid.css';
+import 'ag-grid-community/styles/ag-theme-alpine.css';
+import AppButton from '../../buttons/AppButton.svelte';
+import { AppCheckbox, AppSelect } from '../..';
+import { twMerge } from 'tailwind-merge';
+import { Popup } from '../../../../common';
+import { Plug2 } from 'lucide-svelte';
+import ComponentOutputViewer from '../../../editor/contextPanel/ComponentOutputViewer.svelte';
+import { connectOutput } from '../../../editor/appUtils';
+import RowWrapper from '../../layout/RowWrapper.svelte';
+export let id;
+export let render;
+export let actions = [];
+export let rowIndex;
+export let row;
+export let onSet;
+export let onRemove;
+export let wrapActions = undefined;
+const dispatch = createEventDispatcher();
+const { selectedComponent, hoverStore, mode, connectingInput } = getContext('AppViewerContext');
+</script>
+
+<RowWrapper value={row} index={rowIndex} {onSet} {onRemove}>
+	<div
+		class={twMerge(
+			'flex flex-row justify-center items-center gap-4 h-full px-4 py-1',
+			!wrapActions ? 'flex-wrap' : ''
+		)}
+	>
+		{#each actions as action, actionIndex}
+			<!-- svelte-ignore a11y-mouse-events-have-key-events -->
+			<!-- svelte-ignore missing-declaration -->
+			<!-- svelte-ignore a11y-no-static-element-interactions -->
+			<div
+				on:mouseover|stopPropagation={() => {
+					if (action.id !== $hoverStore) {
+						$hoverStore = action.id
+					}
+				}}
+				on:mouseout|stopPropagation={() => {
+					if ($hoverStore !== undefined) {
+						$hoverStore = undefined
+					}
+				}}
+				on:pointerdown|stopPropagation={() => {
+					$selectedComponent = [action.id]
+				}}
+				class={twMerge(
+					($selectedComponent?.includes(action.id) || $hoverStore === action.id) &&
+						$mode !== 'preview'
+						? 'outline outline-indigo-500 outline-1 outline-offset-1 relative z-50'
+						: 'relative'
+				)}
+			>
+				{#if $mode !== 'preview'}
+					<!-- svelte-ignore a11y-click-events-have-key-events -->
+					<!-- svelte-ignore a11y-no-static-element-interactions -->
+					<div
+						title={`Id: ${action.id}`}
+						class={twMerge(
+							'px-2 text-2xs font-bold absolute shadow  -top-2 -left-4 border z-50 rounded-sm w-8 !h-5 flex justify-center items-center',
+							'bg-indigo-500/90 border-indigo-600 text-white',
+							$selectedComponent?.includes(action.id) || $hoverStore === action.id
+								? 'opacity-100'
+								: 'opacity-0'
+						)}
+						on:click|stopPropagation={() => {
+							$selectedComponent = [action.id]
+						}}
+					>
+						{action.id}
+					</div>
+
+					{#if $connectingInput.opened}
+						<div class="absolute z-50 left-8 -top-[10px]">
+							<Popup
+								floatingConfig={{
+									strategy: 'absolute',
+									placement: 'bottom-start'
+								}}
+							>
+								<svelte:fragment slot="button">
+									<button
+										class="bg-red-500/70 border border-red-600 px-1 py-0.5"
+										title="Outputs"
+										aria-label="Open output"><Plug2 size={12} /></button
+									>
+								</svelte:fragment>
+								<ComponentOutputViewer
+									suffix="table"
+									on:select={({ detail }) =>
+										connectOutput(connectingInput, 'buttoncomponent', action.id, detail)}
+									componentId={action.id}
+								/>
+							</Popup>
+						</div>
+					{/if}
+				{/if}
+				{#if rowIndex === 0}
+					{@const controls = {
+						left: () => {
+							if (actionIndex === 0) {
+								$selectedComponent = [id]
+								return true
+							} else if (actionIndex > 0) {
+								$selectedComponent = [actions[actionIndex - 1].id]
+								return true
+							}
+							return false
+						},
+						right: () => {
+							if (actionIndex === actions.length - 1) {
+								return id
+							} else if (actionIndex < actions.length - 1) {
+								$selectedComponent = [actions[actionIndex + 1].id]
+								return true
+							}
+							return false
+						}
+					}}
+					{#if action.type == 'buttoncomponent'}
+						<AppButton
+							noInitialize
+							extraKey={'idx' + rowIndex}
+							{render}
+							noWFull
+							preclickAction={async () => {
+								dispatch('toggleRow')
+							}}
+							id={action.id}
+							customCss={action.customCss}
+							configuration={action.configuration}
+							recomputeIds={action.recomputeIds}
+							extraQueryParams={{
+								row
+							}}
+							componentInput={action.componentInput}
+							verticalAlignment="center"
+							{controls}
+						/>
+					{:else if action.type == 'checkboxcomponent'}
+						<AppCheckbox
+							noInitialize
+							extraKey={'idx' + rowIndex}
+							{render}
+							id={action.id}
+							customCss={action.customCss}
+							configuration={action.configuration}
+							recomputeIds={action.recomputeIds}
+							onToggle={action.onToggle}
+							preclickAction={async () => {
+								dispatch('toggleRow')
+							}}
+							verticalAlignment="center"
+							{controls}
+						/>
+					{:else if action.type == 'selectcomponent'}
+						<div class="w-40">
+							<AppSelect
+								noDefault
+								noInitialize
+								extraKey={'idx' + rowIndex}
+								{render}
+								--font-size="10px"
+								id={action.id}
+								customCss={action.customCss}
+								configuration={action.configuration}
+								recomputeIds={action.recomputeIds}
+								onSelect={action.onSelect}
+								preclickAction={async () => {
+									dispatch('toggleRow')
+								}}
+								{controls}
+							/>
+						</div>
+					{/if}
+				{:else if action.type == 'buttoncomponent'}
+					<AppButton
+						noInitialize
+						extraKey={'idx' + rowIndex}
+						{render}
+						preclickAction={async () => {
+							dispatch('toggleRow')
+						}}
+						noWFull
+						id={action.id}
+						customCss={action.customCss}
+						configuration={action.configuration}
+						recomputeIds={action.recomputeIds}
+						extraQueryParams={{
+							row
+						}}
+						componentInput={action.componentInput}
+					/>
+				{:else if action.type == 'checkboxcomponent'}
+					<AppCheckbox
+						noInitialize
+						extraKey={'idx' + rowIndex}
+						{render}
+						id={action.id}
+						customCss={action.customCss}
+						configuration={action.configuration}
+						recomputeIds={action.recomputeIds}
+						onToggle={action.onToggle}
+						preclickAction={async () => {
+							dispatch('toggleRow')
+						}}
+					/>
+				{:else if action.type == 'selectcomponent'}
+					<div class="w-40">
+						<AppSelect
+							noDefault
+							noInitialize
+							extraKey={'idx' + rowIndex}
+							{render}
+							--font-size="10px"
+							id={action.id}
+							customCss={action.customCss}
+							configuration={action.configuration}
+							recomputeIds={action.recomputeIds}
+							onSelect={action.onSelect}
+							preclickAction={async () => {
+								dispatch('toggleRow')
+							}}
+						/>
+					</div>
+				{/if}
+			</div>
+		{/each}
+	</div>
+</RowWrapper>

package/package/components/apps/components/display/table/AppAggridTableActions.svelte.d.ts

@@ -0,0 +1,30 @@
+import { SvelteComponent } from "svelte";
+import type { TableAction } from '../../../editor/component';
+import 'ag-grid-community/styles/ag-grid.css';
+import 'ag-grid-community/styles/ag-theme-alpine.css';
+declare const __propDef: {
+    props: {
+        id: string;
+        render: boolean;
+        actions?: TableAction[] | undefined;
+        rowIndex: number;
+        row: {
+            original: Record<string, any>;
+        };
+        onSet: (id: string, value: any) => void;
+        onRemove: (id: string) => void;
+        wrapActions?: boolean | undefined;
+    };
+    events: {
+        toggleRow: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type AppAggridTableActionsProps = typeof __propDef.props;
+export type AppAggridTableActionsEvents = typeof __propDef.events;
+export type AppAggridTableActionsSlots = typeof __propDef.slots;
+export default class AppAggridTableActions extends SvelteComponent<AppAggridTableActionsProps, AppAggridTableActionsEvents, AppAggridTableActionsSlots> {
+}
+export {};