Skip to main content

Pattern

Components​

The Pattern component family provides the following components:

Components​

Circle​

A component to render a circle inside a FreeSewing pattern

You can import the Circle component from the pattern component family in the @freesewing/react package:

Javascript
import { Circle } from "@freesewing/react/components/Pattern"

Defs​

A component to render the defs section of an SVG element inside a FreeSewing pattern

You can import the Defs component from the pattern component family in the @freesewing/react package:

Javascript
import { Defs } from "@freesewing/react/components/Pattern"

Grid​

A component to render the grid for a paperless FreeSewing pattern' stack

You can import the Grid component from the pattern component family in the @freesewing/react package:

Javascript
import { Grid } from "@freesewing/react/components/Pattern"

Group​

A component to render an SVG group

You can import the Group component from the pattern component family in the @freesewing/react package:

Javascript
import { Group } from "@freesewing/react/components/Pattern"

Part​

A component to render a FreeSewing Part (group) in a pattern

You can import the Part component from the pattern component family in the @freesewing/react package:

Javascript
import { Part } from "@freesewing/react/components/Pattern"

Path​

A component to render a FreeSewing Path in a pattern

You can import the Path component from the pattern component family in the @freesewing/react package:

Javascript
import { Path } from "@freesewing/react/components/Pattern"

Pattern​

A component to render a FreeSewing pattern based on its renderProps

You can import the Pattern component from the pattern component family in the @freesewing/react package:

Javascript
import { Pattern } from "@freesewing/react/components/Pattern"

Point​

A component to render a FreeSewing Point in a pattern

You can import the Point component from the pattern component family in the @freesewing/react package:

Javascript
import { Point } from "@freesewing/react/components/Pattern"

Snippet​

A component to render a FreeSewing Snippet in a pattern

You can import the Snippet component from the pattern component family in the @freesewing/react package:

Javascript
import { Snippet } from "@freesewing/react/components/Pattern"

Stack​

A component to render a FreeSewing Stack inside a pattern

You can import the Stack component from the pattern component family in the @freesewing/react package:

Javascript
import { Stack } from "@freesewing/react/components/Pattern"

Svg​

A component to render an SVG tag to hold a FreeSewing pattern

You can import the Svg component from the pattern component family in the @freesewing/react package:

Javascript
import { Svg } from "@freesewing/react/components/Pattern"

Text​

A component to render a text tag in a FreeSewing pattern

You can import the Text component from the pattern component family in the @freesewing/react package:

Javascript
import { Text } from "@freesewing/react/components/Pattern"

TextOnPath​

A component to render a text along a path in a FreeSewing pattern

You can import the TextOnPath component from the pattern component family in the @freesewing/react package:

Javascript
import { TextOnPath } from "@freesewing/react/components/Pattern"

Constants​

The Pattern family exports the following constants:

defaultComponents​

Default Pattern components that you can override

You can import the defaultComponents constant from the pattern family in the @freesewing/react package:

Javascript
import { defaultComponents } from "@freesewing/react/components/Pattern"

Functions​

The Pattern family exports the following functions:

getId​

A method to generated an ID for an object part of a FreeSewing pattern

You can import the getId function from the pattern family in the @freesewing/react package:

Javascript
import { getId } from "@freesewing/react/components/Pattern"

getProps​

A method to extract React props from an classic object

You can import the getProps function from the pattern family in the @freesewing/react package:

Javascript
import { getProps } from "@freesewing/react/components/Pattern"

translateStrings​

A method to translate strings for a FreeSewing pattern

You can import the translateStrings function from the pattern family in the @freesewing/react package:

Javascript
import { translateStrings } from "@freesewing/react/components/Pattern"

withinPartBounds​

A method to determine whether a FreeSewing point is within the bounding box of a FreeSewing part

You can import the withinPartBounds function from the pattern family in the @freesewing/react package:

Javascript
import { withinPartBounds } from "@freesewing/react/components/Pattern"