alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

extract all logic to system

Browse Source
This commit is contained in:
peterkogo
2024-01-08 15:37:34 +01:00
parent da47117585
commit 4a1d5be831
9 changed files with 452 additions and 328 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/react/package.json
View File

@@ -49,12 +49,8 @@
},
"dependencies": {
"@types/d3": "^7.4.0",
"@types/d3-drag": "^3.0.1",
"@types/d3-selection": "^3.0.3",
"@xyflow/system": "workspace:*",
"classcat": "^5.0.3",
"d3-drag": "^3.0.0",
"d3-selection": "^3.0.0",
"zustand": "^4.4.0"
},
"peerDependencies": {

189
packages/react/src/additional-components/NodeResizer/ResizeControl.tsx
View File

@@ -1,28 +1,11 @@
import { useRef, useEffect, memo } from 'react';
import cc from 'classcat';
import { drag } from 'd3-drag';
import { select } from 'd3-selection';
import {
getPointerPosition,
getControlDirection,
getDimensionsAfterResize,
getPositionAfterResize,
} from '@xyflow/system';
import { XYResizerInstance, XYResizer, XYResizeChange } from '@xyflow/system';
import { ResizeControlVariant } from '@xyflow/system';
import { useStoreApi } from '../../hooks/useStore';
import { useNodeId } from '../../contexts/NodeIdContext';
import type { NodeChange, NodeDimensionChange, NodePositionChange } from '../../types';
import { type ResizeDragEvent, type ResizeControlProps, type ResizeControlLineProps } from './types';
import { getResizeDirection, ResizeControlVariant } from '@xyflow/system';
const initPrevValues = { width: 0, height: 0, x: 0, y: 0 };
const initStartValues = {
...initPrevValues,
pointerX: 0,
pointerY: 0,
aspectRatio: 1,
};
import { type ResizeControlProps, type ResizeControlLineProps } from './types';
function ResizeControl({
nodeId,
@@ -46,146 +29,93 @@ function ResizeControl({
const id = typeof nodeId === 'string' ? nodeId : contextNodeId;
const store = useStoreApi();
const resizeControlRef = useRef<HTMLDivElement>(null);
const startValues = useRef<typeof initStartValues>(initStartValues);
const prevValues = useRef<typeof initPrevValues>(initPrevValues);
const defaultPosition = variant === ResizeControlVariant.Line ? 'right' : 'bottom-right';
const controlPosition = position ?? defaultPosition;
const resizer = useRef<XYResizerInstance | null>(null);
useEffect(() => {
if (!resizeControlRef.current || !id) {
return;
}
const selection = select(resizeControlRef.current);
if (!resizer.current) {
resizer.current = XYResizer({
domNode: resizeControlRef.current,
nodeId: id,
getStoreItems: () => {
const { nodeLookup, transform, snapGrid, snapToGrid } = store.getState();
return {
nodeLookup,
transform,
snapGrid,
snapToGrid,
};
},
onChange: (change: XYResizeChange) => {
const { triggerNodeChanges } = store.getState();
const controlDirection = getControlDirection(controlPosition);
const dragHandler = drag<HTMLDivElement, unknown>()
.on('start', (event: ResizeDragEvent) => {
const { nodeLookup, transform, snapGrid, snapToGrid } = store.getState();
const node = nodeLookup.get(id);
const { xSnapped, ySnapped } = getPointerPosition(event.sourceEvent, { transform, snapGrid, snapToGrid });
prevValues.current = {
width: node?.computed?.width ?? 0,
height: node?.computed?.height ?? 0,
x: node?.position.x ?? 0,
y: node?.position.y ?? 0,
};
startValues.current = {
...prevValues.current,
pointerX: xSnapped,
pointerY: ySnapped,
aspectRatio: prevValues.current.width / prevValues.current.height,
};
onResizeStart?.(event, { ...prevValues.current });
})
.on('drag', (event: ResizeDragEvent) => {
const { nodeLookup, transform, snapGrid, snapToGrid, triggerNodeChanges } = store.getState();
const pointerPosition = getPointerPosition(event.sourceEvent, { transform, snapGrid, snapToGrid });
const node = nodeLookup.get(id);
if (node) {
const changes: NodeChange[] = [];
const { x: prevX, y: prevY, width: prevWidth, height: prevHeight } = prevValues.current;
if (change.isXPosChange || change.isYPosChange) {
const positionChange: NodePositionChange = {
id,
type: 'position',
position: {
x: change.x,
y: change.y,
},
};
const { width, height } = getDimensionsAfterResize(
startValues.current,
controlDirection,
pointerPosition,
{ minWidth, minHeight, maxWidth, maxHeight },
keepAspectRatio
);
const isWidthChange = width !== prevWidth;
const isHeightChange = height !== prevHeight;
if (controlDirection.affectsX || controlDirection.affectsY) {
const { x, y } = getPositionAfterResize(startValues.current, controlDirection, width, height);
// only transform the node if the width or height changes
const isXPosChange = x !== prevX && isWidthChange;
const isYPosChange = y !== prevY && isHeightChange;
if (isXPosChange || isYPosChange) {
const positionChange: NodePositionChange = {
id: node.id,
type: 'position',
position: {
x: isXPosChange ? x : prevX,
y: isYPosChange ? y : prevY,
},
};
changes.push(positionChange);
prevValues.current.x = positionChange.position!.x;
prevValues.current.y = positionChange.position!.y;
}
changes.push(positionChange);
}
if (isWidthChange || isHeightChange) {
if (change.isWidthChange || change.isHeightChange) {
const dimensionChange: NodeDimensionChange = {
id: id,
id,
type: 'dimensions',
updateStyle: true,
resizing: true,
dimensions: {
width: width,
height: height,
width: change.width,
height: change.height,
},
};
changes.push(dimensionChange);
prevValues.current.width = width;
prevValues.current.height = height;
}
if (changes.length === 0) {
return;
}
const direction = getResizeDirection({
width: prevValues.current.width,
prevWidth,
height: prevValues.current.height,
prevHeight,
affectsX: controlDirection.affectsX,
affectsY: controlDirection.affectsY,
});
const nextValues = { ...prevValues.current, direction };
const callResize = shouldResize?.(event, nextValues);
if (callResize === false) {
return;
}
onResize?.(event, nextValues);
triggerNodeChanges(changes);
}
})
.on('end', (event: ResizeDragEvent) => {
const dimensionChange: NodeDimensionChange = {
id: id,
type: 'dimensions',
resizing: false,
};
onResizeEnd?.(event, { ...prevValues.current });
store.getState().triggerNodeChanges([dimensionChange]);
},
onEnd: () => {
const dimensionChange: NodeDimensionChange = {
id: id,
type: 'dimensions',
resizing: false,
};
store.getState().triggerNodeChanges([dimensionChange]);
},
});
}
selection.call(dragHandler);
resizer.current.update({
controlPosition,
boundries: {
minWidth,
minHeight,
maxWidth,
maxHeight,
},
keepAspectRatio,
onResizeStart,
onResize,
onResizeEnd,
shouldResize,
});
return () => {
selection.on('.drag', null);
resizer.current?.destroy();
};
}, [
id,
controlPosition,
minWidth,
minHeight,
@@ -195,6 +125,7 @@ function ResizeControl({
onResizeStart,
onResize,
onResizeEnd,
shouldResize,
]);
const positionClassNames = controlPosition.split('-');

15
packages/react/src/additional-components/NodeResizer/types.ts
View File

@@ -1,21 +1,14 @@
import type { CSSProperties, ReactNode } from 'react';
import type { D3DragEvent, SubjectPosition } from 'd3-drag';
import type {
XYResizeParams,
XYResizeParamsWithDirection,
XYResizeControlPosition,
XYResizeControlLinePosition,
ResizeControlVariant,
ShouldResize,
OnResizeStart,
OnResize,
OnResizeEnd,
} from '@xyflow/system';
type OnResizeHandler<Params = XYResizeParams, Result = void> = (event: ResizeDragEvent, params: Params) => Result;
export type ResizeDragEvent = D3DragEvent<HTMLDivElement, null, SubjectPosition>;
export type ShouldResize = OnResizeHandler<XYResizeParamsWithDirection, boolean>;
export type OnResizeStart = OnResizeHandler;
export type OnResize = OnResizeHandler<XYResizeParamsWithDirection>;
export type OnResizeEnd = OnResizeHandler;
export type NodeResizerProps = {
nodeId?: string;
color?: string;

6
packages/svelte/package.json
View File

@@ -42,12 +42,8 @@
},
"dependencies": {
"@svelte-put/shortcut": "^3.1.0",
"@types/d3-drag": "^3.0.1",
"@types/d3-selection": "^3.0.3",
"@xyflow/system": "workspace:*",
"classcat": "^5.0.4",
"d3-drag": "^3.0.0",
"d3-selection": "^3.0.0"
"classcat": "^5.0.4"
},
"devDependencies": {
"@sveltejs/adapter-auto": "^2.1.0",

208
packages/svelte/src/lib/plugins/NodeResizer/ResizeControl.svelte
View File

@@ -1,17 +1,14 @@
<script lang="ts">
import { getContext, onMount } from 'svelte';
import { drag } from 'd3-drag';
import { select } from 'd3-selection';
import { get } from 'svelte/store';
import cc from 'classcat';
import type { ResizeControlProps, ResizeDragEvent } from './types';
import type { ResizeControlProps } from './types';
import {
ResizeControlVariant,
getPointerPosition,
getResizeDirection,
getControlDirection,
type XYResizeControlPosition,
getDimensionsAfterResize,
getPositionAfterResize
type XYResizerInstance,
XYResizer,
type XYResizeChange
} from '@xyflow/system';
import { useStore } from '$lib/store';
@@ -38,22 +35,13 @@
let className: $$Props['class'] = '';
export { className as class };
const initPrevValues = { width: 0, height: 0, x: 0, y: 0 };
const initStartValues = {
...initPrevValues,
pointerX: 0,
pointerY: 0,
aspectRatio: 1
};
const { nodeLookup, snapGrid, viewport, nodes } = useStore();
const contextNodeId = getContext<string>('svelteflow__node_id');
$: id = typeof nodeId === 'string' ? nodeId : contextNodeId;
let resizeControlRef: HTMLDivElement;
let startValues = { ...initStartValues };
let prevValues = { ...initPrevValues };
let resizeControlRef: HTMLDivElement;
let resizer: XYResizerInstance | null = null;
$: defaultPosition = (
variant === ResizeControlVariant.Line ? 'right' : 'bottom-right'
@@ -61,133 +49,75 @@
$: controlPosition = position ?? defaultPosition;
$: positionClassNames = controlPosition.split('-');
$: colorStyleProp = variant === ResizeControlVariant.Line ? 'border-color' : 'background-color';
$: colorStyleProp = variant === ResizeControlVariant.Line ? 'border-color' : 'background-color';
$: _style = style ?? '';
$: controlStyle = !!color ? `${_style} ${colorStyleProp}: ${color};` : _style;
function updateNodes() {
$nodes = $nodes;
}
onMount(() => {
if (!resizeControlRef || !id) {
return;
}
const selection = select(resizeControlRef);
const controlDirection = getControlDirection(controlPosition);
const dragHandler = drag<HTMLDivElement, unknown>()
.on('start', (event: ResizeDragEvent) => {
const node = $nodeLookup.get(id);
const { xSnapped, ySnapped } = getPointerPosition(event.sourceEvent, {
transform: [$viewport.x, $viewport.y, $viewport.zoom],
snapGrid: $snapGrid ?? undefined,
snapToGrid: !!$snapGrid
});
prevValues = {
width: node?.computed?.width ?? 0,
height: node?.computed?.height ?? 0,
x: node?.position.x ?? 0,
y: node?.position.y ?? 0
};
startValues = {
...prevValues,
pointerX: xSnapped,
pointerY: ySnapped,
aspectRatio: prevValues.width / prevValues.height
};
onResizeStart?.(event, { ...prevValues });
})
.on('drag', (event: ResizeDragEvent) => {
const pointerPosition = getPointerPosition(event.sourceEvent, {
transform: [$viewport.x, $viewport.y, $viewport.zoom],
snapGrid: $snapGrid ?? undefined,
snapToGrid: !!$snapGrid
});
const node = $nodeLookup.get(id);
if (node) {
const { x: prevX, y: prevY, width: prevWidth, height: prevHeight } = prevValues;
const { width, height } = getDimensionsAfterResize(
startValues,
controlDirection,
pointerPosition,
{
minWidth: _minWidth,
minHeight: _minHeight,
maxWidth: _maxWidth,
maxHeight: _maxHeight
},
!!keepAspectRatio
);
const isWidthChange = width !== prevWidth;
const isHeightChange = height !== prevHeight;
let changes = false;
if (controlDirection.affectsX || controlDirection.affectsY) {
const { x, y } = getPositionAfterResize(startValues, controlDirection, width, height);
// only transform the node if the width or height changes
const isXPosChange = x !== prevX && isWidthChange;
const isYPosChange = y !== prevY && isHeightChange;
if (isXPosChange || isYPosChange) {
let newX = isXPosChange ? x : prevX;
let newY = isYPosChange ? y : prevY;
node.position = { x: newX, y: newY };
prevValues.x = newX;
prevValues.y = newY;
changes = true;
}
}
if (isWidthChange || isHeightChange) {
node.width = width;
node.height = height;
prevValues.width = width;
prevValues.height = height;
changes = true;
}
if (!changes) {
return;
}
const direction = getResizeDirection({
width: prevValues.width,
prevWidth,
height: prevValues.height,
prevHeight,
affectsX: controlDirection.affectsX,
affectsY: controlDirection.affectsY
});
const nextValues = { ...prevValues, direction };
const callResize = shouldResize?.(event, nextValues);
if (callResize === false) {
return;
}
onResize?.(event, nextValues);
$nodes = $nodes;
}
});
selection.call(dragHandler);
return () => {
selection.on('.drag', null);
resizer?.destroy();
};
});
$: {
if (resizeControlRef) {
if (!resizer) {
const _snapGrid = get(snapGrid);
const _viewport = get(viewport);
resizer = XYResizer({
domNode: resizeControlRef,
nodeId: id,
getStoreItems: () => {
return {
nodeLookup: get(nodeLookup),
transform: [_viewport.x, _viewport.y, _viewport.zoom],
snapGrid: _snapGrid ?? undefined,
snapToGrid: !!_snapGrid
};
},
onChange: (change: XYResizeChange) => {
const _nodeLookup = get(nodeLookup);
const node = _nodeLookup.get(id);
if (node) {
if (change.isHeightChange) {
node.height = change.height;
}
if (change.isWidthChange) {
node.width = change.width;
}
if (change.isXPosChange || change.isYPosChange) {
node.position = { x: change.x, y: change.y };
}
// This needs to be a function to prevent unnecessary updates
updateNodes();
}
}
});
}
resizer.update({
controlPosition,
boundries: {
minWidth: _minWidth,
minHeight: _minHeight,
maxWidth: _maxWidth,
maxHeight: _maxHeight
},
keepAspectRatio: !!keepAspectRatio,
onResizeStart,
onResize,
onResizeEnd,
shouldResize
});
}
}
</script>
<div

199
packages/system/src/xyresizer/XYResizer.ts Normal file
View File

@@ -0,0 +1,199 @@
import { drag } from 'd3-drag';
import { select } from 'd3-selection';
import { NodeLookup, Transform } from '../types';
import { OnResize, OnResizeEnd, OnResizeStart, ResizeDragEvent, ShouldResize, XYResizeControlPosition } from './types';
import { getControlDirection, getDimensionsAfterResize, getPositionAfterResize, getResizeDirection } from './utils';
import { getPointerPosition } from '../utils';
const initPrevValues = { width: 0, height: 0, x: 0, y: 0 };
const initStartValues = {
...initPrevValues,
pointerX: 0,
pointerY: 0,
aspectRatio: 1,
};
const initChange = {
x: 0,
y: 0,
width: 0,
height: 0,
isXPosChange: false,
isYPosChange: false,
isWidthChange: false,
isHeightChange: false,
};
export type XYResizeChange = {
x: number;
y: number;
width: number;
height: number;
isXPosChange: boolean;
isYPosChange: boolean;
isWidthChange: boolean;
isHeightChange: boolean;
};
type XYResizerParams = {
domNode: HTMLDivElement;
nodeId: string;
getStoreItems: () => {
nodeLookup: NodeLookup;
transform: Transform;
snapGrid?: [number, number];
snapToGrid: boolean;
};
onChange: (changes: XYResizeChange) => void;
onEnd?: () => void;
};
type XYResizerUpdateParams = {
controlPosition: XYResizeControlPosition;
boundries: {
minWidth: number;
minHeight: number;
maxWidth: number;
maxHeight: number;
};
keepAspectRatio: boolean;
onResizeStart: OnResizeStart | undefined;
onResize: OnResize | undefined;
onResizeEnd: OnResizeEnd | undefined;
shouldResize: ShouldResize | undefined;
};
export type XYResizerInstance = {
update: (params: XYResizerUpdateParams) => void;
destroy: () => void;
};
export function XYResizer({ domNode, nodeId, getStoreItems, onChange }: XYResizerParams): XYResizerInstance {
const selection = select(domNode);
function update({
controlPosition,
boundries,
keepAspectRatio,
onResizeStart,
onResize,
onResizeEnd,
shouldResize,
}: XYResizerUpdateParams) {
console.log('updated');
let prevValues = { ...initPrevValues };
let startValues = { ...initStartValues };
const controlDirection = getControlDirection(controlPosition);
const dragHandler = drag<HTMLDivElement, unknown>()
.on('start', (event: ResizeDragEvent) => {
const { nodeLookup, transform, snapGrid, snapToGrid } = getStoreItems();
const node = nodeLookup.get(nodeId);
const { xSnapped, ySnapped } = getPointerPosition(event.sourceEvent, { transform, snapGrid, snapToGrid });
prevValues = {
width: node?.computed?.width ?? 0,
height: node?.computed?.height ?? 0,
x: node?.position.x ?? 0,
y: node?.position.y ?? 0,
};
startValues = {
...prevValues,
pointerX: xSnapped,
pointerY: ySnapped,
aspectRatio: prevValues.width / prevValues.height,
};
onResizeStart?.(event, { ...prevValues });
})
.on('drag', (event: ResizeDragEvent) => {
const { nodeLookup, transform, snapGrid, snapToGrid } = getStoreItems();
const pointerPosition = getPointerPosition(event.sourceEvent, { transform, snapGrid, snapToGrid });
const node = nodeLookup.get(nodeId);
if (node) {
const change = { ...initChange };
const { x: prevX, y: prevY, width: prevWidth, height: prevHeight } = prevValues;
const { width, height } = getDimensionsAfterResize(
startValues,
controlDirection,
pointerPosition,
boundries,
keepAspectRatio
);
const isWidthChange = width !== prevWidth;
const isHeightChange = height !== prevHeight;
if (controlDirection.affectsX || controlDirection.affectsY) {
const { x, y } = getPositionAfterResize(startValues, controlDirection, width, height);
// only transform the node if the width or height changes
const isXPosChange = x !== prevX && isWidthChange;
const isYPosChange = y !== prevY && isHeightChange;
if (isXPosChange || isYPosChange) {
change.isXPosChange = isXPosChange;
change.isYPosChange = isYPosChange;
change.x = isXPosChange ? x : prevX;
change.y = isYPosChange ? y : prevY;
prevValues.x = change.x;
prevValues.y = change.y;
}
}
if (isWidthChange || isHeightChange) {
change.isWidthChange = isWidthChange;
change.isHeightChange = isHeightChange;
change.width = width;
change.height = height;
prevValues.width = width;
prevValues.height = height;
}
if (!change.isXPosChange && !change.isYPosChange && !isWidthChange && !isHeightChange) {
return;
}
const direction = getResizeDirection({
width: prevValues.width,
prevWidth,
height: prevValues.height,
prevHeight,
affectsX: controlDirection.affectsX,
affectsY: controlDirection.affectsY,
});
const nextValues = { ...prevValues, direction };
const callResize = shouldResize?.(event, nextValues);
if (callResize === false) {
return;
}
onResize?.(event, nextValues);
onChange(change);
}
})
.on('end', (event: ResizeDragEvent) => {
onResizeEnd?.(event, { ...prevValues });
});
selection.call(dragHandler);
}
function destroy() {
selection.on('.drag', null);
}
return {
update,
destroy,
};
}

2
packages/system/src/xyresizer/index.ts
View File

@@ -1,2 +1,2 @@
export * from './types';
export * from './utils';
export * from './XYResizer';

10
packages/system/src/xyresizer/types.ts
View File

@@ -1,4 +1,4 @@
export type { D3DragEvent, SubjectPosition } from 'd3-drag';
import type { D3DragEvent, SubjectPosition } from 'd3-drag';
export type XYResizeParams = {
x: number;
@@ -32,3 +32,11 @@ export const XY_RESIZER_HANDLE_CONTROLS: XYResizeControlPosition[] = [
'bottom-right',
];
export const XY_RESIZER_LINE_CONTROLS: XYResizeControlLinePosition[] = ['top', 'right', 'bottom', 'left'];
type OnResizeHandler<Params = XYResizeParams, Result = void> = (event: ResizeDragEvent, params: Params) => Result;
export type ResizeDragEvent = D3DragEvent<HTMLDivElement, null, SubjectPosition>;
export type ShouldResize = OnResizeHandler<XYResizeParamsWithDirection, boolean>;
export type OnResizeStart = OnResizeHandler;
export type OnResize = OnResizeHandler<XYResizeParamsWithDirection>;
export type OnResizeEnd = OnResizeHandler;

147
pnpm-lock.yaml generated
View File

@@ -208,24 +208,12 @@ importers:
'@types/d3':
specifier: ^7.4.0
version: 7.4.0
'@types/d3-drag':
specifier: ^3.0.1
version: 3.0.1
'@types/d3-selection':
specifier: ^3.0.3
version: 3.0.3
'@xyflow/system':
specifier: workspace:*
version: link:../system
classcat:
specifier: ^5.0.3
version: 5.0.4
d3-drag:
specifier: ^3.0.0
version: 3.0.0
d3-selection:
specifier: ^3.0.0
version: 3.0.0
react-dom:
specifier: '>=17'
version: 18.2.0(react@18.2.0)
@@ -287,31 +275,19 @@ importers:
'@svelte-put/shortcut':
specifier: ^3.1.0
version: 3.1.0
'@types/d3-drag':
specifier: ^3.0.1
version: 3.0.1
'@types/d3-selection':
specifier: ^3.0.3
version: 3.0.3
'@xyflow/system':
specifier: workspace:*
version: link:../system
classcat:
specifier: ^5.0.4
version: 5.0.4
d3-drag:
specifier: ^3.0.0
version: 3.0.0
d3-selection:
specifier: ^3.0.0
version: 3.0.0
devDependencies:
'@sveltejs/adapter-auto':
specifier: ^2.1.0
version: 2.1.0(@sveltejs/kit@1.22.6)
'@sveltejs/kit':
specifier: ^1.22.6
version: 1.22.6(svelte@4.2.1)(vite@4.5.0)
version: 1.22.6(svelte@4.2.1)(vite@4.5.1)
'@sveltejs/package':
specifier: ^2.2.1
version: 2.2.1(svelte@4.2.1)(typescript@5.1.3)
@@ -1656,7 +1632,7 @@ packages:
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dependencies:
ajv: 6.12.6
debug: 4.3.4(supports-color@8.1.1)
debug: 4.3.4
espree: 9.6.1
globals: 13.23.0
ignore: 5.2.4
@@ -1714,7 +1690,7 @@ packages:
engines: {node: '>=10.10.0'}
dependencies:
'@humanwhocodes/object-schema': 2.0.1
debug: 4.3.4(supports-color@8.1.1)
debug: 4.3.4
minimatch: 3.1.2
transitivePeerDependencies:
- supports-color
@@ -1980,7 +1956,7 @@ packages:
peerDependencies:
'@sveltejs/kit': ^1.0.0
dependencies:
'@sveltejs/kit': 1.22.6(svelte@4.2.1)(vite@4.5.0)
'@sveltejs/kit': 1.22.6(svelte@4.2.1)(vite@4.5.1)
import-meta-resolve: 3.0.0
dev: true
@@ -1993,7 +1969,7 @@ packages:
import-meta-resolve: 4.0.0
dev: true
/@sveltejs/kit@1.22.6(svelte@4.2.1)(vite@4.5.0):
/@sveltejs/kit@1.22.6(svelte@4.2.1)(vite@4.5.1):
resolution: {integrity: sha512-SDKxI/QpsReCwIn5czjT53fKlPBybbmMk67d317gUqfeORroBAFN1Z6s/x0E1JYi+04i7kKllS+Sz9wVfmUkAQ==}
engines: {node: ^16.14 || >=18}
hasBin: true
@@ -2002,7 +1978,7 @@ packages:
svelte: ^3.54.0 || ^4.0.0-next.0
vite: ^4.0.0
dependencies:
'@sveltejs/vite-plugin-svelte': 2.4.6(svelte@4.2.1)(vite@4.5.0)
'@sveltejs/vite-plugin-svelte': 2.4.6(svelte@4.2.1)(vite@4.5.1)
'@types/cookie': 0.5.3
cookie: 0.5.0
devalue: 4.3.2
@@ -2015,7 +1991,7 @@ packages:
sirv: 2.0.3
svelte: 4.2.1
undici: 5.23.0
vite: 4.5.0(@types/node@18.7.16)
vite: 4.5.1
transitivePeerDependencies:
- supports-color
dev: true
@@ -2079,6 +2055,23 @@ packages:
vite: 4.5.0(@types/node@18.7.16)
transitivePeerDependencies:
- supports-color
dev: false
/@sveltejs/vite-plugin-svelte-inspector@1.0.4(@sveltejs/vite-plugin-svelte@2.4.6)(svelte@4.2.1)(vite@4.5.1):
resolution: {integrity: sha512-zjiuZ3yydBtwpF3bj0kQNV0YXe+iKE545QGZVTaylW3eAzFr+pJ/cwK8lZEaRp4JtaJXhD5DyWAV4AxLh6DgaQ==}
engines: {node: ^14.18.0 || >= 16}
peerDependencies:
'@sveltejs/vite-plugin-svelte': ^2.2.0
svelte: ^3.54.0 || ^4.0.0
vite: ^4.0.0
dependencies:
'@sveltejs/vite-plugin-svelte': 2.4.6(svelte@4.2.1)(vite@4.5.1)
debug: 4.3.4
svelte: 4.2.1
vite: 4.5.1
transitivePeerDependencies:
- supports-color
dev: true
/@sveltejs/vite-plugin-svelte-inspector@1.0.4(@sveltejs/vite-plugin-svelte@2.4.6)(svelte@4.2.2)(vite@4.5.0):
resolution: {integrity: sha512-zjiuZ3yydBtwpF3bj0kQNV0YXe+iKE545QGZVTaylW3eAzFr+pJ/cwK8lZEaRp4JtaJXhD5DyWAV4AxLh6DgaQ==}
@@ -2114,6 +2107,27 @@ packages:
vitefu: 0.2.5(vite@4.5.0)
transitivePeerDependencies:
- supports-color
dev: false
/@sveltejs/vite-plugin-svelte@2.4.6(svelte@4.2.1)(vite@4.5.1):
resolution: {integrity: sha512-zO79p0+DZnXPnF0ltIigWDx/ux7Ni+HRaFOw720Qeivc1azFUrJxTl0OryXVibYNx1hCboGia1NRV3x8RNv4cA==}
engines: {node: ^14.18.0 || >= 16}
peerDependencies:
svelte: ^3.54.0 || ^4.0.0
vite: ^4.0.0
dependencies:
'@sveltejs/vite-plugin-svelte-inspector': 1.0.4(@sveltejs/vite-plugin-svelte@2.4.6)(svelte@4.2.1)(vite@4.5.1)
debug: 4.3.4
deepmerge: 4.3.1
kleur: 4.1.5
magic-string: 0.30.5
svelte: 4.2.1
svelte-hmr: 0.15.3(svelte@4.2.1)
vite: 4.5.1
vitefu: 0.2.5(vite@4.5.1)
transitivePeerDependencies:
- supports-color
dev: true
/@sveltejs/vite-plugin-svelte@2.4.6(svelte@4.2.2)(vite@4.5.0):
resolution: {integrity: sha512-zO79p0+DZnXPnF0ltIigWDx/ux7Ni+HRaFOw720Qeivc1azFUrJxTl0OryXVibYNx1hCboGia1NRV3x8RNv4cA==}
@@ -2691,7 +2705,7 @@ packages:
'@typescript-eslint/scope-manager': 5.60.0
'@typescript-eslint/type-utils': 5.60.0(eslint@8.43.0)(typescript@5.1.3)
'@typescript-eslint/utils': 5.60.0(eslint@8.43.0)(typescript@5.1.3)
debug: 4.3.4(supports-color@8.1.1)
debug: 4.3.4
eslint: 8.43.0
grapheme-splitter: 1.0.4
ignore: 5.2.4
@@ -2774,7 +2788,7 @@ packages:
'@typescript-eslint/scope-manager': 5.60.0
'@typescript-eslint/types': 5.60.0
'@typescript-eslint/typescript-estree': 5.60.0(typescript@5.1.3)
debug: 4.3.4(supports-color@8.1.1)
debug: 4.3.4
eslint: 8.43.0
typescript: 5.1.3
transitivePeerDependencies:
@@ -2859,7 +2873,7 @@ packages:
dependencies:
'@typescript-eslint/typescript-estree': 5.60.0(typescript@5.1.3)
'@typescript-eslint/utils': 5.60.0(eslint@8.43.0)(typescript@5.1.3)
debug: 4.3.4(supports-color@8.1.1)
debug: 4.3.4
eslint: 8.43.0
tsutils: 3.21.0(typescript@5.1.3)
typescript: 5.1.3
@@ -2933,7 +2947,7 @@ packages:
dependencies:
'@typescript-eslint/types': 5.60.0
'@typescript-eslint/visitor-keys': 5.60.0
debug: 4.3.4(supports-color@8.1.1)
debug: 4.3.4
globby: 11.1.0
is-glob: 4.0.3
semver: 7.5.4
@@ -4260,6 +4274,18 @@ packages:
ms: 2.1.3
supports-color: 8.1.1
/debug@4.3.4:
resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
engines: {node: '>=6.0'}
peerDependencies:
supports-color: '*'
peerDependenciesMeta:
supports-color:
optional: true
dependencies:
ms: 2.1.2
dev: true
/debug@4.3.4(supports-color@8.1.1):
resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
engines: {node: '>=6.0'}
@@ -4768,7 +4794,7 @@ packages:
dependencies:
'@eslint-community/eslint-utils': 4.4.0(eslint@8.43.0)
'@jridgewell/sourcemap-codec': 1.4.15
debug: 4.3.4(supports-color@8.1.1)
debug: 4.3.4
eslint: 8.43.0
esutils: 2.0.3
known-css-properties: 0.27.0
@@ -4858,7 +4884,7 @@ packages:
ajv: 6.12.6
chalk: 4.1.2
cross-spawn: 7.0.3
debug: 4.3.4(supports-color@8.1.1)
debug: 4.3.4
doctrine: 3.0.0
escape-string-regexp: 4.0.0
eslint-scope: 7.2.2
@@ -7872,7 +7898,6 @@ packages:
nanoid: 3.3.7
picocolors: 1.0.0
source-map-js: 1.0.2
dev: false
/prebuild-install@7.1.1:
resolution: {integrity: sha512-jAXscXWMcCK8GgCoHOfIr0ODh5ai8mj63L2nWrjuAgXE6tDyYGnx4/8o/rCgU+B4JSyZBKbeZqzhtwtC3ovxjw==}
@@ -9943,6 +9968,41 @@ packages:
optionalDependencies:
fsevents: 2.3.3
/vite@4.5.1:
resolution: {integrity: sha512-AXXFaAJ8yebyqzoNB9fu2pHoo/nWX+xZlaRwoeYUxEqBO+Zj4msE5G+BhGBll9lYEKv9Hfks52PAF2X7qDYXQA==}
engines: {node: ^14.18.0 || >=16.0.0}
hasBin: true
peerDependencies:
'@types/node': '>= 14'
less: '*'
lightningcss: ^1.21.0
sass: '*'
stylus: '*'
sugarss: '*'
terser: ^5.4.0
peerDependenciesMeta:
'@types/node':
optional: true
less:
optional: true
lightningcss:
optional: true
sass:
optional: true
stylus:
optional: true
sugarss:
optional: true
terser:
optional: true
dependencies:
esbuild: 0.18.20
postcss: 8.4.32
rollup: 3.29.4
optionalDependencies:
fsevents: 2.3.3
dev: true
/vite@4.5.1(@types/node@18.7.16):
resolution: {integrity: sha512-AXXFaAJ8yebyqzoNB9fu2pHoo/nWX+xZlaRwoeYUxEqBO+Zj4msE5G+BhGBll9lYEKv9Hfks52PAF2X7qDYXQA==}
engines: {node: ^14.18.0 || >=16.0.0}
@@ -9989,6 +10049,17 @@ packages:
dependencies:
vite: 4.5.0(@types/node@18.7.16)
/vitefu@0.2.5(vite@4.5.1):
resolution: {integrity: sha512-SgHtMLoqaeeGnd2evZ849ZbACbnwQCIwRH57t18FxcXoZop0uQu0uzlIhJBlF/eWVzuce0sHeqPcDo+evVcg8Q==}
peerDependencies:
vite: ^3.0.0 || ^4.0.0 || ^5.0.0
peerDependenciesMeta:
vite:
optional: true
dependencies:
vite: 4.5.1
dev: true
/vscode-oniguruma@1.7.0:
resolution: {integrity: sha512-L9WMGRfrjOhgHSdOYgCt/yRMsXzLDJSL7BPrOZt73gU0iWO4mpqzqQzOz5srxqTvMBaR0XZTSrVWo4j55Rc6cA==}
dev: false