1
0
Fork 0

fix(react-components): Paperless grid in Pattern

This commit is contained in:
joostdecock 2023-06-04 17:28:02 +02:00
parent 5716b69e58
commit 17725ff941
4 changed files with 14 additions and 15 deletions

View file

@ -11,14 +11,13 @@ export const Defs = (props) => {
let defs = props.svg.defs.forSvg
if (props.settings[0].paperless) {
defs += grids[props.settings[0].units || 'metric']
for (let p in props.parts[0]) {
for (let stack in props.stacks) {
const part = props.stacks[stack].parts[0]
let anchor = { x: 0, y: 0 }
if (typeof props.parts[0][p].points.gridAnchor !== 'undefined')
anchor = props.parts[0][p].points.gridAnchor
else if (typeof props.parts[0][p].points.anchor !== 'undefined')
anchor = props.parts[0][p].points.anchor
if (typeof part.points.gridAnchor !== 'undefined') anchor = part.points.gridAnchor
else if (typeof part.points.anchor !== 'undefined') anchor = part.points.anchor
defs += `<pattern id="grid-${p}" key="grid-${p}" xlink:href="#grid" x="${anchor.x}" y="${anchor.y}" />`
defs += `<pattern id="grid-${stack}" key="grid-${stack}" xlink:href="#grid" x="${anchor.x}" y="${anchor.y}" />`
}
}

View file

@ -1,12 +1,12 @@
import React from 'react'
export const Grid = ({ part, partName, settings }) => (
export const Grid = ({ stack, stackName }) => (
<rect
x={part.topLeft.x}
y={part.topLeft.y}
width={part.width}
height={part.height}
x={stack.topLeft.x}
y={stack.topLeft.y}
width={stack.width}
height={stack.height}
className="grid"
fill={'url(#grid-' + partName + ')'}
fill={'url(#grid-' + stackName + ')'}
/>
)

View file

@ -3,11 +3,10 @@ import { getId, getProps } from './utils.mjs'
export const PartInner = forwardRef(
({ stackName, partName, part, settings, components, t }, ref) => {
const { Group, Grid, Path, Point, Snippet } = components
const { Group, Path, Point, Snippet } = components
return (
<Group ref={ref} id={getId({ settings, stackName, partName, name: 'inner' })}>
{settings.paperless ? <Grid /> : null}
{Object.keys(part.paths).map((pathName) => (
<Path
key={pathName}

View file

@ -2,10 +2,11 @@ import React from 'react'
import { getProps } from './utils.mjs'
export const Stack = ({ stackName, stack, settings, components, t }) => {
const { Group, Part } = components
const { Group, Part, Grid } = components
return (
<Group {...getProps(stack)}>
{settings[0].paperless ? <Grid {...{ stack, stackName }} /> : null}
{[...stack.parts].map((part, key) => (
<Part {...{ settings, components, t, part, stackName, key }} />
))}