chore(svelte): use prettier

This commit is contained in:
moklick
2023-06-06 15:46:19 +02:00
parent c4e98dd420
commit 84603bd966
34 changed files with 335 additions and 330 deletions
@@ -20,7 +20,7 @@
import { useStore } from '$lib/store';
import { BackgroundVariant, type BackgroundProps } from './types';
type $$Props = BackgroundProps;
type $$Props = BackgroundProps;
export let variant: $$Props['variant'] = BackgroundVariant.Dots;
export let gap: $$Props['gap'] = 20;
@@ -47,7 +47,11 @@
: [patternDimensions[0] / 2, patternDimensions[1] / 2];
</script>
<svg class={cc(['svelte-flow__background', className])} {style} data-testid="svelte-flow__background">
<svg
class={cc(['svelte-flow__background', className])}
{style}
data-testid="svelte-flow__background"
>
<pattern
id={patternId}
x={$transform[0] % scaledGap[0]}
@@ -18,7 +18,15 @@
export let showInteractive: $$Props['showInteractive'] = true;
const {
zoomIn, zoomOut, fitView, transform, minZoom, maxZoom, nodesDraggable, nodesConnectable, elementsSelectable
zoomIn,
zoomOut,
fitView,
transform,
minZoom,
maxZoom,
nodesDraggable,
nodesConnectable,
elementsSelectable
} = useStore();
$: isInteractive = $nodesDraggable || $nodesConnectable || $elementsSelectable;
@@ -45,7 +53,7 @@
elementsSelectable.set(isInteractive);
};
</script>
<Panel class="svelte-flow__controls" {position} data-testid="svelte-flow__controls">
{#if showZoom}
<ControlButton
@@ -12,12 +12,12 @@
import { useStore } from '$lib/store';
import { Panel } from '$lib/container/Panel';
import MinimapNode from './MinimapNode.svelte';
import interactive from './interactive'
import interactive from './interactive';
import type { GetMiniMapNodeAttribute, MiniMapProps } from './types';
type $$Props = MiniMapProps;
let position: $$Props['position'] = 'bottom-right';
let position: $$Props['position'] = 'bottom-right';
let ariaLabel: $$Props['ariaLabel'] = 'Mini map';
let style: $$Props['style'] = '';
let nodeStrokeColor: $$Props['nodeStrokeColor'] = 'transparent';
@@ -32,7 +32,7 @@
let width: $$Props['width'] = undefined;
let height: $$Props['height'] = undefined;
let pannable: $$Props['pannable'] = true;
let zoomable: $$Props['zoomable'] = true;
let zoomable: $$Props['zoomable'] = true;
let inversePan: $$Props['inversePan'] = undefined;
let zoomStep: $$Props['zoomStep'] = undefined;
@@ -41,8 +41,16 @@
const defaultWidth = 200;
const defaultHeight = 150;
const { nodes, transform, width: containerWidth, height: containerHeight, flowId, panZoom, translateExtent } = useStore();
const {
nodes,
transform,
width: containerWidth,
height: containerHeight,
flowId,
panZoom,
translateExtent
} = useStore();
const nodeColorFunc = getAttrFunction(nodeColor);
const nodeStrokeColorFunc = getAttrFunction(nodeStrokeColor);
const nodeClassNameFunc = getAttrFunction(nodeClassName);
@@ -56,8 +64,7 @@
width: $containerWidth / $transform[2],
height: $containerHeight / $transform[2]
};
$: boundingRect =
$nodes.length > 0 ? getBoundsOfRects(getRectOfNodes($nodes), viewBB) : viewBB;
$: boundingRect = $nodes.length > 0 ? getBoundsOfRects(getRectOfNodes($nodes), viewBB) : viewBB;
$: elementWidth = width ?? defaultWidth;
$: elementHeight = height ?? defaultHeight;
$: scaledWidth = boundingRect.width / elementWidth;
@@ -97,7 +104,7 @@
inversePan,
zoomStep,
pannable,
zoomable,
zoomable
}}
>
{#if ariaLabel}<title id={labelledBy}>{ariaLabel}</title>{/if}
@@ -122,9 +129,9 @@
{/each}
<path
class="svelte-flow__minimap-mask"
d={`M${x - offset},${y - offset}h${viewboxWidth + offset * 2}v${viewboxHeight + offset * 2}h${
-viewboxWidth - offset * 2
}z
d={`M${x - offset},${y - offset}h${viewboxWidth + offset * 2}v${
viewboxHeight + offset * 2
}h${-viewboxWidth - offset * 2}z
M${viewBB.x},${viewBB.y}h${viewBB.width}v${viewBB.height}h${-viewBB.width}z`}
fill={maskColor}
fill-rule="evenodd"