windmill-components 1.379.3 → 1.382.1

package/package/components/graph/svelvet/container/controllers/middleware.js

@@ -1,87 +0,0 @@
-/*
-This file contains "middleware" functions that sanitize user input (UserNodeType and UserEdgeType). Put functions that
-maintain consistency between previous
-
-*/
-import { bottomCb, leftCb, rightCb, topCb } from '../../edges/controllers/anchorCbUser';
-/**
- * sanitizeUserNodesAndEdges will sanitize the data initially passed in to Svelvet component. For example, the node that user specified have an integar as its id but to instantiate a Node and be compatible with uuid we will need to convert the integar id to a string.
- * @param userNodes The array of nodes that have a UserNodeType
- * @param userEdges The array of edges that have a UserEdgeType
- * @returns An object of sanitized userNodes and userEdges
- */
-export function sanitizeUserNodesAndEdges(userNodes, userEdges) {
-    convertIdToString(userNodes);
-    convertEdgeIdsToString(userEdges);
-    convertAnchorPositionsToCallbacks(userNodes, userEdges);
-    setDefaultEdgeType(userEdges);
-    return { userNodes, userEdges };
-}
-/**
- * setDefaultEdgeType ensures a default edge type of 'bezier' if the user does not set one, or sets a nonsense type.
- * @param userEdges The array of edges that have a UserEdgeType
- * @returns No return, the function edits the objects in place
- */
-function setDefaultEdgeType(userEdges) {
-    for (let userEdge of userEdges) {
-        if (!['smoothstep', 'step', 'bezier', 'straight'].includes(userEdge.type))
-            userEdge.type = 'bezier';
-    }
-}
-/**
- * convertAnchorPositionsToCallbacks
- * @description
- * WHY: This function is in order to maintain compliance with earlier versions of Svelvet.
- * HISTORY: In Svelvet<=5, anchor points were hard-coded onto each node. Each node had a "sourcePosition"
- * "targetPosition" where the edges would be attached. In Svelvet6, the store was re-designed
- * from the ground up into an object-relational data model where anchor points could be attached
- * at any point on the node using callbacks. This enabled features such as custom edge position,
- * adaptive edge positioning, and dynamic edges.
- * The purpose of this function is to parse the old way of specifying edge positions (as two source/target
- * anchors on the node) into the Svelvet6 (where anchors are separate objects) in order to maintain a
- * consistent user experience. However, we suggest that this functionality (parsing Svelvet5 syntax into
- * Svelvet6 syntax) be removed completely in favor of only using Svelvet6 syntax in order to reduce edge cases.
- */
-function convertAnchorPositionsToCallbacks(userNodes, userEdges) {
-    // convert userNodes array into object for constant time lookup by id
-    const userNodesObj = {};
-    for (let userNode of userNodes)
-        userNodesObj[userNode.id] = userNode;
-    // iterate through userEdges, and check the source/target nodes.
-    for (let userEdge of userEdges) {
-        const userNodeSource = userNodesObj[userEdge.source];
-        const userNodeTarget = userNodesObj[userEdge.target];
-        if (!userNodeSource || !userNodeTarget)
-            continue;
-        const sourcePosition = userNodeSource.sourcePosition;
-        const targetPosition = userNodeTarget.targetPosition;
-        const cbs = { left: leftCb, right: rightCb, top: topCb, bottom: bottomCb };
-        if (sourcePosition)
-            userEdge.sourceAnchorCb = cbs[sourcePosition];
-        if (targetPosition)
-            userEdge.targetAnchorCb = cbs[targetPosition];
-    }
-}
-/**
- * Converts node id's to strings. For Svelvet<6, node id's were numbers. These were switched to strings for compatibility with uuid. This function does not return a new array, instead it mutates and sanitizes the original array.
- * @param userNodes The array of userNodes (not yet sanitized)
- */
-function convertIdToString(userNodes) {
-    userNodes = userNodes.map((node) => {
-        node.id = node.id.toString();
-        node.childNodes =
-            node.childNodes === undefined ? [] : node.childNodes.map((childId) => childId.toString());
-        return node;
-    });
-}
-/**
- * Converts source/target node id's to string. For Svelvet<6, id's were numbers. These were switched to strings for compatibility with uuid. This function does not return a new array, instead it mutates and sanitizes the original array.
- * @param userEdges The array of userEdges (not yet sanitized)
- */
-function convertEdgeIdsToString(userEdges) {
-    userEdges = userEdges.map((edge) => {
-        edge.source = edge.source.toString();
-        edge.target = edge.target.toString();
-        return edge;
-    });
-}

package/package/components/graph/svelvet/container/models/index.js

@@ -1 +0,0 @@
-"use strict";

package/package/components/graph/svelvet/container/views/GraphView.svelte

@@ -1,262 +0,0 @@
-<script>import { pointer, select, selectAll } from 'd3-selection';
-import { zoom, zoomIdentity, zoomTransform } from 'd3-zoom';
-import { createEventDispatcher, getContext, onMount } from 'svelte';
-import SimpleBezierEdge from '../../edges/views/Edges/SimpleBezierEdge.svelte';
-import SmoothStepEdge from '../../edges/views/Edges/SmoothStepEdge.svelte';
-import StepEdge from '../../edges/views/Edges/StepEdge.svelte';
-import Node from '../../nodes/views/Node.svelte';
-import { determineD3Instance } from '../..//d3/controllers/d3';
-import { findStore } from '../../store/models/store';
-import { Expand, Minus, Plus } from 'lucide-svelte';
-import Toggle from '../../../../Toggle.svelte';
-import { fade } from 'svelte/transition';
-//these are typscripted as any, however they have been transformed inside of store.ts
-export let canvasId;
-export let width;
-export let height;
-export let boundary = false;
-export let scroll = false;
-export let dataflow = false;
-export let download = false;
-export let showDataflowToggle = false;
-// here we lookup the store using the unique key
-const store = findStore(canvasId);
-const { edgesStore, nodesStore, nodeSelected, backgroundStore, movementStore, widthStore, heightStore, d3Scale } = store;
-$: nodes = Object.values($nodesStore);
-$: edges = Object.values($edgesStore);
-// declaring the grid and dot size for d3's transformations and zoom
-const gridSize = 15;
-const dotSize = 10;
-const dispatch = createEventDispatcher();
-// leveraging d3 library to zoom/pan
-let d3 = {
-    zoom,
-    zoomTransform,
-    zoomIdentity,
-    select,
-    selectAll,
-    pointer
-};
-let d3Zoom = determineD3Instance(boundary, d3, nodeSelected, width, height, movementStore, backgroundStore, gridSize, dotSize, canvasId, d3Scale, handleZoom);
-// d3Translate is used for the minimap
-onMount(() => {
-    // actualizes the d3 instance
-    const nodes = d3.select(`#zoomable-${canvasId}`).call(d3Zoom).on('dblclick.zoom', null);
-    if (!scroll) {
-        ;
-        [nodes].forEach((d3Instance) => {
-            d3Instance
-                .on('wheel.zoom', null)
-                .on('mousewheel.zoom', null)
-                .on('mousemove.zoom', null)
-                .on('DOMMouseScroll.zoom', null);
-        });
-    }
-    d3.select(`#zoom_in_${canvasId}`).on('click', function () {
-        try {
-            // @ts-ignore
-            d3Zoom.scaleBy(nodes.transition().duration(250), 1.4);
-        }
-        catch (e) {
-            console.log('error', e);
-        }
-    });
-    d3.select(`#zoom_out_${canvasId}`).on('click', function () {
-        try {
-            // @ts-ignore
-            d3Zoom.scaleBy(nodes.transition().duration(250), 0.714);
-        }
-        catch (e) {
-            console.log('error', e);
-        }
-    });
-});
-function handleZoom(e) {
-    if (!$movementStore)
-        return;
-    //add a store that contains the current value of the d3-zoom's scale to be used in onMouseMove function
-    d3Scale.set(e.transform.k);
-    // transform 'g' SVG elements (edge, edge text, edge anchor)
-    d3.select(`.Edges-${canvasId} g`).attr('transform', e.transform);
-    // transform div elements (nodes)
-    //@ts-ignore
-    let transform = d3.zoomTransform(this);
-    store.d3ZoomParameters.set({ ...transform }); // record x,y position of pan, and zoom level
-    // selects and transforms all node divs from class 'Node' and performs transformation
-    d3.select(`.Node-${canvasId}`)
-        .style('transform', 'translate(' + transform.x + 'px,' + transform.y + 'px) scale(' + transform.k + ')')
-        .style('transform-origin', '0 0');
-}
-const { currentStepStore: copilotCurrentStepStore } = getContext('FlowCopilotContext') || {};
-$: {
-    if ($copilotCurrentStepStore !== undefined) {
-        // reset zoom
-        d3.select(`#zoomable-${canvasId}`).call(d3Zoom.transform, d3.zoomIdentity);
-    }
-}
-</script>
-
-<div class="zoomable" id={`zoomable-${canvasId}`}>
-	<!-- This is the container that holds GraphView and we have disabled right click functionality to prevent a sticking behavior -->
-	<div id="graphview-container">
-		<!-- svelte-ignore a11y-no-static-element-interactions -->
-		<div class={`Nodes Nodes-${canvasId}`} on:contextmenu|preventDefault>
-			<!-- This container is transformed by d3zoom -->
-			<div class={`Node Node-${canvasId}`}>
-				{#if $copilotCurrentStepStore !== undefined}
-					<div transition:fade class="fixed inset-0 bg-gray-500 bg-opacity-75 z-[900] !m-0" />
-				{/if}
-				{#each nodes as node}
-					{#if node.data.html}
-						<Node {node} {canvasId}>{@html node.data.html}</Node>
-					{:else if node.data.custom}
-						<Node isCustom {node} {canvasId}>
-							<svelte:component
-								this={node.data.custom.component}
-								on:new={(e) => node?.data?.custom?.cb?.('new', e.detail)}
-								on:delete={(e) => node?.data?.custom?.cb?.('delete', e.detail)}
-								on:select={(e) => node?.data?.custom?.cb?.('select', e.detail)}
-								on:insert={(e) => node?.data?.custom?.cb?.('insert', e.detail)}
-								on:newBranch={(e) => node?.data?.custom?.cb?.('newBranch', e.detail)}
-								on:deleteBranch={(e) => node?.data?.custom?.cb?.('deleteBranch', e.detail)}
-								on:move={(e) => node?.data?.custom?.cb?.('move', e.detail)}
-								on:nodeInsert={(e) => node?.data?.custom?.cb?.('nodeInsert', e.detail)}
-								on:addBranch={(e) => node?.data?.custom?.cb?.('addBranch', e.detail)}
-								on:removeBranch={(e) => node?.data?.custom?.cb?.('removeBranch', e.detail)}
-								on:selectedIteration={(e) =>
-									node?.data?.custom?.cb?.('selectedIteration', e.detail)}
-								{...node.data.custom.props}
-							/>
-						</Node>
-					{:else}
-						<Node {node} {canvasId}>{node.data.label}</Node>
-					{/if}
-				{/each}
-			</div>
-		</div>
-	</div>
-	<!-- rendering dots on the background depending on the zoom level -->
-	<!-- svelte-ignore a11y-no-static-element-interactions -->
-	<svg
-		class={`Edges Edges-${canvasId}`}
-		viewBox="0 0 {$widthStore} {$heightStore}"
-		on:contextmenu|preventDefault
-	>
-		<defs>
-			<pattern
-				id={`background-${canvasId}`}
-				x="0"
-				y="0"
-				width={gridSize}
-				height={gridSize}
-				patternUnits="userSpaceOnUse"
-			>
-				<circle
-					id="dot"
-					cx={gridSize / 2 - dotSize / 2}
-					cy={gridSize / 2 - dotSize / 2}
-					r="0.5"
-					style="fill: gray"
-				/>
-			</pattern>
-		</defs>
-
-		<!-- <g> tag defines which edge type to render depending on properties of edge object -->
-		<g>
-			{#each edges as edge}
-				{#if edge.type === 'smoothstep'}
-					<SmoothStepEdge {edge} {canvasId} />
-				{:else if edge.type === 'step'}
-					<StepEdge {edge} {canvasId} />
-				{:else}
-					<SimpleBezierEdge edgeId={edge.id} {canvasId} />
-				{/if}
-			{/each}
-
-			<!-- {#each filteredAnchors as anchor} -->
-			<!-- note that these are SVG -->
-			<!-- <EdgeAnchor x={anchor.positionX} y={anchor.positionY} /> -->
-			<!-- {/each} -->
-		</g>
-	</svg>
-</div>
-{#if showDataflowToggle}
-	<div id="dataflow_toggle">
-		<Toggle
-			disabled={$copilotCurrentStepStore !== undefined}
-			textClass="!text-secondary"
-			size="xs"
-			bind:checked={dataflow}
-			options={{
-				right: 'dataflow'
-			}}
-		/>
-	</div>
-{/if}
-
-<div id="buttons">
-	<button
-		title="Zoom In"
-		id={`zoom_in_${canvasId}`}
-		class={'relative overflow-hidden ' +
-			($copilotCurrentStepStore !== undefined
-				? '!bg-gray-400/20 text-black/20 border-gray-400/20'
-				: '')}
-	>
-		<Plus size="14" class="flex justify-start m-1" />
-	</button>
-	<button
-		title="Zoom Out"
-		id={`zoom_out_${canvasId}`}
-		class={'relative overflow-hidden ' +
-			($copilotCurrentStepStore !== undefined
-				? '!bg-gray-400/20 text-black/20 border-gray-400/20'
-				: '')}
-	>
-		<Minus size="14" class="flex justify-start m-1" />
-	</button>
-
-	{#if download}
-		<button on:click={() => dispatch('expand')}>
-			<Expand size="14" class="flex justify-start m-1" />
-		</button>
-	{/if}
-</div>
-
-<style>
-	#dataflow_toggle {
-		position: absolute;
-		top: 3px;
-		left: 8px;
-	}
-	#buttons {
-		position: absolute;
-		top: 8px;
-		right: 8px;
-		z-index: 20;
-	}
-
-	#buttons > button {
-		border-radius: 4px;
-		--tw-bg-opacity: 1;
-		background-color: rgb(var(--color-surface) / var(--tw-bg-opacity));
-		border-width: 1px;
-		transition: all;
-	}
-
-	.Nodes {
-		position: absolute;
-		width: 100%;
-		height: 100%;
-	}
-	.Node {
-		color: black; /* remove this once color is set to default via types */
-		width: 100%;
-		height: 100%;
-	}
-	#graphview-container {
-		pointer-events: none;
-	}
-	.pointer-events-auto {
-		pointer-events: auto;
-	}</style>

package/package/components/graph/svelvet/container/views/GraphView.svelte.d.ts

@@ -1,26 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        canvasId: string;
-        width: number;
-        height: number;
-        boundary?: boolean | undefined;
-        scroll?: boolean | undefined;
-        dataflow?: boolean | undefined;
-        download?: boolean | undefined;
-        showDataflowToggle?: boolean | undefined;
-    };
-    events: {
-        contextmenu: MouseEvent;
-        expand: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type GraphViewProps = typeof __propDef.props;
-export type GraphViewEvents = typeof __propDef.events;
-export type GraphViewSlots = typeof __propDef.slots;
-export default class GraphView extends SvelteComponent<GraphViewProps, GraphViewEvents, GraphViewSlots> {
-}
-export {};

package/package/components/graph/svelvet/container/views/Svelvet.svelte

@@ -1,121 +0,0 @@
-<script>const pkStringGenerator = () => (Math.random() + 1).toString(36).substring(7);
-import { createStoreEmpty, populateSvelvetStoreFromUserInput } from '../../store/controllers/storeApi';
-import { afterUpdate, onMount } from 'svelte';
-import GraphView from './GraphView.svelte';
-import { sanitizeUserNodesAndEdges } from '../controllers/middleware';
-export let nodes;
-export let edges;
-export let width = 600;
-export let height = 600;
-export let background = true;
-export let movement = true;
-export let canvasId = pkStringGenerator();
-export let snap = false;
-export let snapTo = 30;
-export let nodeCreate = false;
-export let boundary = false;
-export let locked = false; // if true, node movement is disabled
-export let editable = false;
-export let highlightEdges = true;
-export let scroll = false;
-export let download = false;
-export let dataflow = false;
-export let nodeSelected = false;
-// generates a unique string for each svelvet component's unique store instance
-// creates a store that uses the unique sting as the key to create and look up the corresponding store
-// this way we can have multiple Svelvet Components on the same page and prevent overlap of information
-const store = createStoreEmpty(canvasId);
-// stores (state) within stores, so that we cannot access values from everywhere
-//   const { widthStore, heightStore, nodesStore, derivedEdges } = svelvetStore;
-let error = '';
-// sets the state of the store to the values passed in from the Svelvet Component on initial render
-onMount(() => {
-    try {
-        // sanitize user input
-        let output = sanitizeUserNodesAndEdges(nodes, edges);
-        const userNodes = output['userNodes'];
-        const userEdges = output['userEdges'];
-        // set canvas related stores. you need to do this before setting node/edge related stores because
-        // initializing nodes/edges might read relevant options from the store.
-        store.widthStore.set(width);
-        store.heightStore.set(height);
-        store.backgroundStore.set(background);
-        store.movementStore.set(movement);
-        const optionsObj = { snap, snapTo }; // TODO: rename to snap
-        store.options.set(optionsObj); //
-        store.nodeCreate.set(nodeCreate);
-        store.boundary.set(boundary);
-        store.lockedOption.set(locked);
-        store.editableOption.set(editable);
-        store.highlightEdgesOption.set(highlightEdges);
-        // set node/edge related stores
-        populateSvelvetStoreFromUserInput(canvasId, userNodes, userEdges);
-        error = '';
-    }
-    catch (e) {
-        error = 'There was an error displaying the flow. Please report the error.' + e.message;
-        console.error(e);
-    }
-});
-// // enables data reactivity. TODO: this needs to be added back in
-// Probably need to use findStore, not create store
-afterUpdate(() => {
-    try {
-        // sanitize user input
-        let output = sanitizeUserNodesAndEdges(nodes, edges);
-        const userNodes = output['userNodes'];
-        const userEdges = output['userEdges'];
-        // set canvas related stores. you need to do this before setting node/edge related stores because
-        // initializing nodes/edges might read relevant options from the store.
-        store.widthStore.set(width);
-        store.heightStore.set(height);
-        store.backgroundStore.set(background);
-        store.movementStore.set(movement);
-        const optionsObj = { snap, snapTo }; // TODO: rename to snap
-        store.options.set(optionsObj); //
-        store.nodeCreate.set(nodeCreate);
-        store.boundary.set(boundary);
-        store.lockedOption.set(locked);
-        store.editableOption.set(editable);
-        store.highlightEdgesOption.set(highlightEdges);
-        // set node/edge related stores
-        populateSvelvetStoreFromUserInput(canvasId, userNodes, userEdges);
-        error = '';
-    }
-    catch (e) {
-        error = 'There was an error displaying the flow. Please report the error.' + e.message;
-        console.error(e);
-    }
-});
-</script>
-
-<!-- Now that a store has been created from the initial nodes and initial edges we drill props from the store down to the D3 GraphView along with the unique key -->
-<div
-	class="Svelvet bg-surface-secondary"
-	style={`width: ${width}px; min-height: 100%; height: ${height}px;`}
->
-	{#if error != ''}
-		<div class="error text-red-600 center-center p-4">{error}</div>
-	{:else}
-		<GraphView
-			showDataflowToggle={nodeSelected}
-			bind:dataflow
-			on:expand
-			{download}
-			{scroll}
-			{canvasId}
-			{width}
-			{height}
-			{boundary}
-		/>
-	{/if}
-</div>
-
-<style>
-	.Svelvet {
-		position: relative;
-		overflow: hidden;
-		display: grid;
-		font-family: 'Segoe UI', sans-serif;
-		z-index: 1;
-	}</style>

package/package/components/graph/svelvet/container/views/Svelvet.svelte.d.ts

@@ -1,36 +0,0 @@
-import { SvelteComponent } from "svelte";
-import type { UserEdgeType, UserNodeType } from '../../types/types';
-declare const __propDef: {
-    props: {
-        nodes: UserNodeType[];
-        edges: UserEdgeType[];
-        width?: number | undefined;
-        height?: number | undefined;
-        background?: boolean | undefined;
-        movement?: boolean | undefined;
-        canvasId?: string | undefined;
-        snap?: boolean | undefined;
-        snapTo?: number | undefined;
-        nodeCreate?: boolean | undefined;
-        boundary?: boolean | undefined;
-        locked?: boolean | undefined;
-        editable?: boolean | undefined;
-        highlightEdges?: boolean | undefined;
-        scroll?: boolean | undefined;
-        download?: boolean | undefined;
-        dataflow?: boolean | undefined;
-        nodeSelected?: boolean | undefined;
-    };
-    events: {
-        expand: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type SvelvetProps = typeof __propDef.props;
-export type SvelvetEvents = typeof __propDef.events;
-export type SvelvetSlots = typeof __propDef.slots;
-export default class Svelvet extends SvelteComponent<SvelvetProps, SvelvetEvents, SvelvetSlots> {
-}
-export {};

package/package/components/graph/svelvet/customCss/controllers/getCss.d.ts

@@ -1,2 +0,0 @@
-import type { NodeType, StoreType } from '../../store/types/types';
-export declare const forceCssHeightAndWidth: (store: StoreType, node: NodeType) => void;

package/package/components/graph/svelvet/customCss/controllers/getCss.js

@@ -1,46 +0,0 @@
-// Required for "custom css" feature
-// WHAT: For a given node with a user-defined classname, see if there are any css properties for height and width
-//       Get that height and width and set properties in node store. This is necessary for
-export const forceCssHeightAndWidth = (store, node) => {
-    let width, height, innerText;
-    // Look through each CSS rule to find the one the user defined
-    for (let i = 0; i < document.styleSheets.length; i++) {
-        const styleSheet = document.styleSheets[i];
-        const styleRules = styleSheet.cssRules;
-        for (let j = 0; j < styleRules.length; j++) {
-            const rule = styleRules[j];
-            // this is necessary to get rid of typescript warning for rule.selectorText
-            if (!(rule instanceof CSSStyleRule))
-                continue;
-            if (rule.selectorText === `.${node.className}`) {
-                const initialText = rule.cssText; // getting the full text of the CSS rule
-                const i = initialText.indexOf('{'); // finding index of first bracket
-                innerText = initialText.substring(i + 1, initialText.length - 1); // extracting the CSS to insert into inline style
-                // Adjusting the width and height if they are set via the custom class
-                const arr = innerText.split(' ');
-                arr.forEach((str, i) => {
-                    if (str === 'width:') {
-                        width = str.concat(arr[i + 1]); // go through the array and join width and the number
-                        const w = parseInt(arr[i + 1]); // getting the number for the width
-                        width = w;
-                    }
-                    if (str === 'height:') {
-                        height = str.concat(arr[i + 1]); // same as with the width
-                        const h = parseInt(arr[i + 1]);
-                        height = h;
-                    }
-                });
-            }
-        }
-    }
-    // update the width/height of the node
-    store.nodesStore.update((nodes) => {
-        if (width !== undefined)
-            nodes[node.id].width = width;
-        if (height !== undefined)
-            nodes[node.id].height = height;
-        return { ...nodes };
-    });
-    // move the node a bit to force update to anchors, potential anchors
-    node.setPositionFromMovement(0, 0);
-};

package/package/components/graph/svelvet/d3/controllers/d3.d.ts

@@ -1,5 +0,0 @@
-import type { ZoomBehavior } from 'd3-zoom';
-export declare function zoomInit(d3: any, canvasId: any, d3Zoom: any, d3Translate: any, initialLocation: any, initialZoom: any, d3Scale: any): any;
-export declare function determineD3Instance(boundary: any, d3: {
-    zoom: () => ZoomBehavior<any, any>;
-}, nodeSelected: any, width: any, height: any, movementStore: any, backgroundStore: any, gridSize: any, dotSize: any, canvasId: any, d3Scale: any, handleZoom: any): ZoomBehavior<any, any>;

package/package/components/graph/svelvet/d3/controllers/d3.js

@@ -1,59 +0,0 @@
-import { get } from 'svelte/store';
-export function zoomInit(d3, canvasId, d3Zoom, d3Translate, initialLocation, initialZoom, d3Scale) {
-    //set default zoom logic
-    d3.select(`.Edges-${canvasId}`)
-        //makes sure translation is default at center coordinates
-        .transition()
-        .duration(0)
-        .call(d3Zoom.translateTo, 0, 0)
-        //moves camera to coordinates
-        .transition()
-        .duration(0)
-        .call(d3Zoom.translateTo, initialLocation.x / initialZoom, initialLocation.y / initialZoom)
-        // zooms in on selected point
-        .transition()
-        .duration(0)
-        .call(d3Zoom.scaleTo, initialZoom.toFixed(2));
-    // updates d3Translate with d3 object with x, y, and k values to be sent down to the minimap to be further calculated further
-    d3Translate = d3.zoomIdentity
-        .translate(initialLocation.x, initialLocation.y)
-        .scale(initialZoom.toFixed(2));
-    d3.select(`.Nodes-${canvasId}`)
-        .transition()
-        .duration(0)
-        .call(d3Zoom.translateTo, 0, 0)
-        .transition()
-        .duration(0)
-        .call(d3Zoom.translateTo, initialLocation.x / initialZoom, initialLocation.y / initialZoom)
-        .transition()
-        .duration(0)
-        .call(d3Zoom.scaleTo, initialZoom.toFixed(2));
-    // sets D3 scale to current k of object
-    d3Scale.set(d3.zoomTransform(d3.select(`.Nodes-${canvasId}`)).k);
-    return d3Translate;
-}
-// create d3 instance conditionally based on boundary prop
-export function determineD3Instance(boundary, d3, nodeSelected, width, height, movementStore, backgroundStore, gridSize, dotSize, canvasId, d3Scale, handleZoom) {
-    if (boundary) {
-        return d3
-            .zoom()
-            .filter(() => !get(nodeSelected))
-            .scaleExtent([0.4, 4]) // limits for zooming in/out
-            .translateExtent([
-            [0, 0],
-            [boundary.x, boundary.y],
-        ]) // world extent
-            .extent([
-            [0, 0],
-            [width, height],
-        ])
-            .on('zoom', handleZoom);
-    }
-    else {
-        return d3
-            .zoom()
-            .filter(() => !get(nodeSelected))
-            .scaleExtent([0.4, 2])
-            .on('zoom', handleZoom);
-    }
-}

package/package/components/graph/svelvet/edges/controllers/anchorCbDev.d.ts

@@ -1,4 +0,0 @@
-import type { AnchorCbType } from '../../edges/types/types';
-import type { StoreType } from '../../store/types/types';
-export declare function fixedCbCreator(store: StoreType, edgeId: string, anchorId: string, userNodeId: string, positionCb: Function): AnchorCbType;
-export declare function dynamicCbCreator(store: StoreType, edgeId: string, anchorId: string): AnchorCbType;