chore(markdown): Restructuring dev docs
This commit is contained in:
Joost De Cock
parent
9ef46c502a
commit
d42d9a9377
114 changed files with 246 additions and 1462 deletions
|
|
@ -1,27 +1,26 @@
|
|||
---
|
||||
title: bartack
|
||||
title: "@freesewing/plugin-bartack"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-bartack)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-bartack)
|
||||
The **@freesewing/plugin-bartack** plugin provides
|
||||
[the bartack macro](/reference/api/macros/bartack).
|
||||
This macro allows you to add bartacks — a set of
|
||||
tight zig-zag stitches used to enforce a seam — to your design.
|
||||
|
||||
The [@freesewing/plugin-bartack](/reference/packages/plugin-bartack) packages provides a plugin to help bartack points and/or paths around a given bartack line.
|
||||
## Example
|
||||
|
||||
<Example part="plugin_bartack">Example of the bartack macro provided by this plugin</Example>
|
||||
|
||||
## Installation
|
||||
|
||||
```bash
|
||||
```sh
|
||||
npm install @freesewing/plugin-bartack
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -32,8 +31,8 @@ const Pattern = new freesewing.Design(config, bartack);
|
|||
```
|
||||
|
||||
Now you can use the
|
||||
[bartack](/reference/macros/bartack/),
|
||||
[bartackAlong](/reference/macros/bartackalong/), and
|
||||
[bartackFractionAlong](/reference/macros/bartackfractionalong/) macros in your parts.
|
||||
[bartack](/reference/api/macros/bartack/),
|
||||
[bartackAlong](/reference/api/macros/bartackalong/), and
|
||||
[bartackFractionAlong](/reference/api/macros/bartackfractionalong/) macros in your parts:
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,26 +1,17 @@
|
|||
---
|
||||
title: bundle
|
||||
title: "@freesewing/plugin-bundle"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-bundle)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-bundle)
|
||||
The **@freesewing/plugin-bundle** plugin bundles the most common FreeSewing build-time plugins:
|
||||
|
||||
|
||||
The bundle plugin bundles the most common FreeSewing build-time plugins:
|
||||
|
||||
1. [plugin-cutonfold](/reference/plugins/cutonfold) : Add cut-on-fold indicators to your patterns
|
||||
2. [plugin-dimension](/reference/plugins/dimension) : Add dimensions to your (paperless) patterns
|
||||
3. [plugin-grainline](/reference/plugins/grainline) : Add grainline indicators to your patterns
|
||||
4. [plugin-logo](/reference/plugins/logo) : Add a scalebox to your patterns
|
||||
5. [plugin-scalebox](/reference/plugins/scalebox) : Add pretty titles to your pattern parts
|
||||
6. [plugin-title](/reference/plugins/title) : Add pretty titles to your pattern parts
|
||||
7. [plugin-round](/reference/plugins/round) : Rounds corners
|
||||
8. [plugin-sprinkle](/reference/plugins/sprinkle) : Add multiple snippets to your pattern
|
||||
- [plugin-cutonfold](/reference/plugins/cutonfold) : Add cut-on-fold indicators to your patterns
|
||||
- [plugin-dimension](/reference/plugins/dimension) : Add dimensions to your (paperless) patterns
|
||||
- [plugin-grainline](/reference/plugins/grainline) : Add grainline indicators to your patterns
|
||||
- [plugin-logo](/reference/plugins/logo) : Add a scalebox to your patterns
|
||||
- [plugin-scalebox](/reference/plugins/scalebox) : Add pretty titles to your pattern parts
|
||||
- [plugin-title](/reference/plugins/title) : Add pretty titles to your pattern parts
|
||||
- [plugin-round](/reference/plugins/round) : Rounds corners
|
||||
- [plugin-sprinkle](/reference/plugins/sprinkle) : Add multiple snippets to your pattern
|
||||
|
||||
Almost all patterns use these plugins, so it made sense to bundle them.
|
||||
|
||||
|
|
@ -32,8 +23,8 @@ npm install @freesewing/plugin-bundle
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
|
|||
|
|
@ -1,19 +1,15 @@
|
|||
---
|
||||
title: bust
|
||||
title: "@freesewing/plugin-bust"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-bust)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-bust)
|
||||
|
||||
The [@freesewing/plugin-bust](/reference/packages/plugin-bust) packages provides a plugin to help you adapt menswear patterns for breasts.
|
||||
|
||||
The **@freesewing/plugin-bust** plugin helps you adapt menswear patterns for breasts.
|
||||
If you are designing a womenswear pattern, you won't need this plugin. But if you're adapting
|
||||
a menswear pattern for breasts, this plugin can help you.
|
||||
a menswear pattern for breasts, or merely want to accomodate both people with and without
|
||||
breasts, this plugin can help you accomplish that.
|
||||
|
||||
<Note>
|
||||
|
||||
##### Understanding the use-case for this plugin
|
||||
|
||||
Almost all menswear patterns use the chest circumference to draft the garment.
|
||||
|
||||
|
|
@ -27,10 +23,18 @@ This plugin helps you by:
|
|||
- Storing the chest circumference in `measurements.bust`
|
||||
- Changing `measurments.chestCircumference` to the value of `measurements.highBust`
|
||||
|
||||
</Note>
|
||||
|
||||
## Use when extending breastless patterns into a with-breasts version
|
||||
|
||||
One way this plugin is used is to extend a menswear pattern into a womenswear pattern.
|
||||
In this case, the plugin will always be loaded since the pattern assumes breasts will be present.
|
||||
|
||||
This way you can extend a menswear pattern and have it drafted with the high bust measurement
|
||||
as chest measurment, after which you can create room for the breasts.
|
||||
|
||||
It's used by our [Carlita](/reference/packages/carlita) pattern, which extends the menswear [Carlton](/reference/packages/carlton) pattern.
|
||||
You can see this in practice in our [Carlita][1] pattern,
|
||||
which extends the menswear [Carlton][2] pattern.
|
||||
|
||||
<Tip>
|
||||
|
||||
|
|
@ -38,6 +42,22 @@ To learn more about extending a pattern, see [Design inheritance](/howtos/code/i
|
|||
|
||||
</Tip>
|
||||
|
||||
## Use when creating gender-neutral patterns
|
||||
|
||||
To create a truly gender-neutral pattern — one that will adapt to breasts only if they are
|
||||
present — you can use this plugin, but you'll also need a few other things:
|
||||
|
||||
- You'll need to mark the breast measurements as [optional measurements](/reference/api/config/optionalmeasurements)
|
||||
- You'll need to [conditionally load this plugin](/guides/plugins/conditionally-loading-build-time-plugins)
|
||||
|
||||
You can see an example of this in [our Teagan design][3].
|
||||
|
||||
<Fixme>
|
||||
|
||||
**TODO**: Write a tutorial on gender-neutral desing
|
||||
|
||||
</Fixme>
|
||||
|
||||
## Installation
|
||||
|
||||
```bash
|
||||
|
|
@ -46,8 +66,8 @@ npm install @freesewing/plugin-bust
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -58,3 +78,6 @@ const Pattern = new freesewing.Design(config, bust);
|
|||
```
|
||||
|
||||
|
||||
[1]: https://github.com/freesewing/freesewing/blob/develop/packages/carlita/src/index.js#L12
|
||||
[2]: https://github.com/freesewing/freesewing/blob/develop/packages/carlton
|
||||
[3]: https://github.com/freesewing/freesewing/blob/develop/packages/teagan/src/index.js
|
||||
|
|
|
|||
|
|
@ -1,32 +1,19 @@
|
|||
---
|
||||
title: buttons
|
||||
title: "@freesewing/plugin-buttons"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-buttons)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-buttons)
|
||||
The **@freesewing/plugin-buttons** plugin provides the following [snippets](/reference/api/snippets):
|
||||
|
||||
The **buttons** plugin provides the following [snippets](/reference/snippets/):
|
||||
- [button](/reference/api/snippets/button)
|
||||
- [buttonhole](/reference/api/snippets/buttonhole)
|
||||
- [buttonhole-start](/reference/api/snippets/buttonhole-start)
|
||||
- [buttonhole-end](/reference/api/snippets/buttonhole-end)
|
||||
- [snap-stud](/reference/api/snippets/snap-stud)
|
||||
- [snap-socket](/reference/api/snippets/snap-socket)
|
||||
|
||||
- `button`
|
||||
- `buttonhole`
|
||||
- `buttonhole-start`
|
||||
- `buttonhole-end`
|
||||
- `snap-stud`
|
||||
- `snap-socket`
|
||||
|
||||
<Example part="plugin_buttons" caption="An example of the button, buttonhole, buttonhole-start, buttonhole-end, snap-stud, and snap-socket snippets" design={false} />
|
||||
|
||||
```js
|
||||
let { Point, snippets, Snippet } = part.shorthand();
|
||||
|
||||
snippets.button = new Snippet('button', new Point(40, 10));
|
||||
snippets.buttonhole = new Snippet('buttonhole', new Point(80, 10));
|
||||
```
|
||||
<Example part="plugin_buttons">
|
||||
An example of the button, buttonhole, buttonhole-start, buttonhole-end, snap-stud, and snap-socket snippets
|
||||
</Example>
|
||||
|
||||
<Tip>
|
||||
|
||||
|
|
@ -42,8 +29,8 @@ npm install @freesewing/plugin-buttons
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -53,3 +40,12 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, buttons);
|
||||
```
|
||||
|
||||
Now you can use the
|
||||
[button](/reference/api/snippets/button),
|
||||
[buttonhole](/reference/api/snippets/buttonhole),
|
||||
[buttonhole-start](/reference/api/snippets/buttonhole-start),
|
||||
[buttonhole-end](/reference/api/snippets/buttonhole-end),
|
||||
[snap-stud](/reference/api/snippets/snap-stud), and
|
||||
[snap-socket](/reference/api/snippets/snap-socket)
|
||||
snippets in your designs.
|
||||
|
||||
|
|
|
|||
|
|
@ -1,52 +1,20 @@
|
|||
---
|
||||
title: cutonfold
|
||||
title: "@freesewing/plugin-cutonfold"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-cutonfold)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-cutonfold)
|
||||
The **@freesewing/plugin-cutonfold** plugin provides
|
||||
[the cutonfold macro](/reference/api/macros/cutonfold) which adds a cut-on-fold
|
||||
indicator to your design.
|
||||
|
||||
The **cutonfold** plugin provides [the cutonfold macro](/reference/macros/cutonfold/):
|
||||
<Example part="plugin_cutonfold">
|
||||
|
||||
<Example part="plugin_cutonfold" caption="An example of the cutonfold macro" design={false} />
|
||||
An example of the cutonfold macro
|
||||
|
||||
```js
|
||||
let { Point, points, Path, paths, macro } = part.shorthand();
|
||||
|
||||
points.topLeft = new Point(0, 0);
|
||||
points.topRight = new Point(150, 0);
|
||||
points.bottomRight = new Point(150, 50);
|
||||
points.bottomLeft = new Point(0, 50);
|
||||
|
||||
paths.box = new Path()
|
||||
.move(points.topLeft)
|
||||
.line(points.topRight)
|
||||
.line(points.bottomRight)
|
||||
.line(points.bottomLeft)
|
||||
.close();
|
||||
|
||||
macro("cutonfold", {
|
||||
from: points.bottomLeft,
|
||||
to: points.bottomRight,
|
||||
grainline: true
|
||||
});
|
||||
```
|
||||
<Note>
|
||||
|
||||
###### It's safe to use a corner of your pattern part for this
|
||||
|
||||
Since this is typically used on corners, the generated cut-on-fold indicator
|
||||
will not go all the way to the `to` and `from` points.
|
||||
|
||||
</Note>
|
||||
</Example>
|
||||
|
||||
<Tip>
|
||||
|
||||
The cutonfold plugin is part of our [plugin-bundle](/reference/plugins/bundle/)
|
||||
The cutonfold plugin is part of our [plugin-bundle](/reference/plugins/bundle)
|
||||
|
||||
</Tip>
|
||||
|
||||
|
|
@ -58,8 +26,8 @@ npm install @freesewing/plugin-cutonfold
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -69,4 +37,4 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, cutonfold);
|
||||
```
|
||||
|
||||
Now you can use [the cutonfold macro](/reference/macros/cutonfold/) in your parts.
|
||||
Now you can use [the cutonfold macro](/reference/api/macros/cutonfold/) in your parts.
|
||||
|
|
|
|||
|
|
@ -1,73 +1,26 @@
|
|||
---
|
||||
title: dimension
|
||||
title: "@freesewing/plugin-dimension"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-dimension)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-dimension)
|
||||
The **@freesewing/plugin-dimension** plugin provides a variety of macros
|
||||
to facilitate adding *dimensions* to your design. By *dimensions* we mean
|
||||
the indicators for distance that are added to patterns
|
||||
in [paperless mode](/reference/api/settings/paperless).
|
||||
|
||||
The **dimension** plugin provides the following [macros](/plugins#macros):
|
||||
The following macors are provided by this plugin:
|
||||
|
||||
- [hd](/reference/macros/hd/) : Adds a horizontal dimension
|
||||
- [vd](/reference/macros/vd/) : Adds a vertical dimension
|
||||
- [ld](/reference/macros/ld/) : Adds a linear dimension
|
||||
- [pd](/reference/macros/pd/) : Adds a dimension along a path
|
||||
- [rmd](/reference/macros/rmd/) : Removes a dimension
|
||||
- [rmad](/reference/macros/rmad/) : Removes all dimensions with a default prefix
|
||||
- [hd](/reference/api/macros/hd) : Adds a horizontal dimension
|
||||
- [vd](/reference/api/macros/vd) : Adds a vertical dimension
|
||||
- [ld](/reference/api/macros/ld) : Adds a linear dimension
|
||||
- [pd](/reference/api/macros/pd) : Adds a dimension along a path
|
||||
- [rmd](/reference/api/macros/rmd) : Removes a dimension
|
||||
- [rmad](/reference/api/macros/rmad) : Removes all dimensions with a default prefix
|
||||
|
||||
<Example part="plugin_dimension" caption="An example of the different dimensinon macros" design={false} />
|
||||
<Example part="plugin_dimension">
|
||||
|
||||
```js
|
||||
let { Point, points, Path, paths, macro } = part.shorthand();
|
||||
An example of the different dimensinon macros
|
||||
|
||||
points.A = new Point(0, 0);
|
||||
points.B = new Point(0, 100);
|
||||
points.C = new Point(50, 100);
|
||||
points.D = new Point(100, 50);
|
||||
points.DCp1 = new Point(100, 0);
|
||||
|
||||
paths.box = new Path()
|
||||
.move(points.A)
|
||||
.line(points.B)
|
||||
.line(points.C)
|
||||
.line(points.D)
|
||||
.curve(points.DCp1, points.A, points.A)
|
||||
.close();
|
||||
|
||||
macro("vd", {
|
||||
from: points.A,
|
||||
to: points.B,
|
||||
x: points.A.x - 15
|
||||
});
|
||||
|
||||
macro("hd", {
|
||||
from: points.B,
|
||||
to: points.C,
|
||||
y: points.B.y + 15
|
||||
});
|
||||
|
||||
macro("ld", {
|
||||
from: points.C,
|
||||
to: points.D,
|
||||
d: -15
|
||||
});
|
||||
|
||||
macro("ld", {
|
||||
from: points.C,
|
||||
to: points.D,
|
||||
d: -30,
|
||||
text: "Custom text"
|
||||
});
|
||||
|
||||
macro("pd", {
|
||||
path: new Path().move(points.A).curve(points.A, points.DCp1, points.D),
|
||||
d: -15
|
||||
});
|
||||
```
|
||||
</Example>
|
||||
|
||||
<Tip>
|
||||
|
||||
|
|
@ -83,8 +36,8 @@ npm install @freesewing/plugin-dimension
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -94,9 +47,12 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, dimension);
|
||||
```
|
||||
|
||||
Now you can use the following macros in your parts:
|
||||
Now you can use the
|
||||
[hd](/reference/api/macros/hd/),
|
||||
[vd](/reference/api/macros/vd/),
|
||||
[ld](/reference/api/macros/ld/),
|
||||
[pd](/reference/api/macros/pd/),
|
||||
[rmd](/reference/api/macros/rmd/), and
|
||||
[rmad](/reference/api/macros/rmad/)
|
||||
macros in your parts.
|
||||
|
||||
- [hd](/reference/macros/hd/)
|
||||
- [vd](/reference/macros/vd/)
|
||||
- [ld](/reference/macros/ld/)
|
||||
- [pd](/reference/macros/pd/)
|
||||
|
|
|
|||
|
|
@ -1,9 +1,13 @@
|
|||
---
|
||||
title: Plugins
|
||||
for: developers
|
||||
about: Complete list of all the plugins available for FreeSewing core
|
||||
---
|
||||
|
||||
The following FreeSewing plugins are available:
|
||||
FreeSewing uses a modular approach where functionality can be extended with
|
||||
plugins. Plugins can provide macros, or use any of the lifecycle hooks.
|
||||
Refer to [the plugin guide](/guides/plugins) for an in-depth look into plugins.
|
||||
|
||||
We maintain the following plugins for @freesewing/core:
|
||||
|
||||
<ReadMore />
|
||||
|
||||
|
||||
<ReadMore list />
|
||||
|
|
|
|||
|
|
@ -1,22 +1,12 @@
|
|||
---
|
||||
title: flip
|
||||
title: "@freesewing/plugin-flip"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-flip)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-flip)
|
||||
|
||||
The **flip** plugin provides [the flip macro](/reference/macros/flip/) which flips (mirrors) an entire part vertically around the Y-axis.
|
||||
|
||||
```js
|
||||
let { macro } = part.shorthand();
|
||||
|
||||
macro("flip");
|
||||
```
|
||||
The **@freesewing/plugin-flip** plugin provides [the flip
|
||||
macro](/reference/apis/macros/flip/) which flips (mirrors)
|
||||
an entire part vertically around the Y-axis.
|
||||
It's typically used to create a right and left pattern part from
|
||||
the same basis.
|
||||
|
||||
## Installation
|
||||
|
||||
|
|
@ -26,8 +16,8 @@ npm install @freesewing/plugin-flip
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -37,4 +27,4 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, flip);
|
||||
```
|
||||
|
||||
Now you can use [the flip macro](/reference/macros/flip) in your parts.
|
||||
Now you can use [the flip macro](/reference/api/macros/flip) in your parts.
|
||||
|
|
|
|||
|
|
@ -1,30 +1,12 @@
|
|||
---
|
||||
title: grainline
|
||||
title: "@freesewing/plugin-grainline"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-grainline)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-grainline)
|
||||
The **@freesewing/plugin-grainline** plugin provides [the grainline
|
||||
macro](/reference/macros/grainline/) which adds a *grainline* indicator
|
||||
to your design.
|
||||
|
||||
The **grainline** plugin provides [the grainline macro](/reference/macros/grainline/):
|
||||
|
||||
<Example part="plugin_grainline" caption="An example of the grainline macro" design={false} />
|
||||
|
||||
```js
|
||||
let { Point, points, macro } = part.shorthand();
|
||||
|
||||
points.grainlineFrom = new Point(10, 10);
|
||||
points.grainlineTo = new Point(100, 10);
|
||||
|
||||
macro("grainline", {
|
||||
from: points.grainlineFrom,
|
||||
to: points.grainlineTo
|
||||
});
|
||||
```
|
||||
<Example part="plugin_grainline">An example of the grainline macro</Example>
|
||||
|
||||
<Tip>
|
||||
|
||||
|
|
@ -40,8 +22,8 @@ npm install @freesewing/plugin-grainline
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -51,4 +33,4 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, grainline);
|
||||
```
|
||||
|
||||
Now you can use [the grainline macro](/reference/macros/grainline) in your parts.
|
||||
Now you can use [the grainline macro](/reference/api/macros/grainline) in your parts.
|
||||
|
|
|
|||
|
|
@ -1,21 +1,11 @@
|
|||
---
|
||||
title: i18n
|
||||
title: "@freesewing/plugin-i18n"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-i18n)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-i18n)
|
||||
|
||||
The **i18n** plugin provides translation for your pattern:
|
||||
|
||||
<Example part="path_attr" caption="An example in English" design={false} options={{locale: 'en'}} />
|
||||
<Example part="path_attr" caption="An example in French" design={false} options={{locale: 'fr'}} />
|
||||
|
||||
It uses the [`insertText`](/plugins#inserttext) hook to do so.
|
||||
The **@freesewing/plugin-i18n** plugin provides a mechanism to translate your designs.
|
||||
It does that by attaching to [the insertText lifecycle hook](/reference/api/hooks/inserttext) to
|
||||
intercept all operations that add text to a design and attempt to translate the text
|
||||
prior to insertion.
|
||||
|
||||
<Note>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,24 +1,13 @@
|
|||
---
|
||||
title: logo
|
||||
title: "@freesewing/plugin-logo"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-logo)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-logo)
|
||||
The **@freesewing/plugin-logo** plugin provides the FreeSewing logo
|
||||
as [the logo snippet](/reference/api/snippets/logo).
|
||||
It's a plugin you most likely want to replace with your own version
|
||||
if you want to generate patterns with your own branding.
|
||||
|
||||
The **logo** plugin provides [the logo snippet](/reference/snippets/):
|
||||
|
||||
<Example part="plugin_logo" caption="An example of the logo snippet" design={false} />
|
||||
|
||||
```js
|
||||
let { Point, snippets, Snippet } = part.shorthand();
|
||||
|
||||
snippets.logo = new Snippet("logo", new Point(50, 30));
|
||||
```
|
||||
<Example part="plugin_logo">An example of the logo snippet</Example>
|
||||
|
||||
<Tip>
|
||||
|
||||
|
|
@ -34,8 +23,8 @@ npm install @freesewing/plugin-logo
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -45,3 +34,5 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, logo);
|
||||
```
|
||||
|
||||
You can now use the [logo](/reference/api/snippets/logo) snippet in your parts.
|
||||
|
||||
|
|
|
|||
|
|
@ -1,16 +1,12 @@
|
|||
---
|
||||
title: mirror
|
||||
title: "@freesewing/plugin-mirror"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-mirror)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-mirror)
|
||||
The **@freesewing/plugin-mirror** plugin provides [the mirror
|
||||
macro](/reference/api/macros/mirror) which facilitates mirroring
|
||||
a number of points and/or paths around a given mirror line.
|
||||
|
||||
The [@freesewing/plugin-mirror](/reference/packages/plugin-mirror) packages provides a plugin to help mirror points and/or paths around a given mirror line.
|
||||
<Example part="plugin_mirror">Example of the mirror plugin</Example>
|
||||
|
||||
## Installation
|
||||
|
||||
|
|
@ -20,8 +16,8 @@ npm install @freesewing/plugin-mirror
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -31,6 +27,6 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, mirror);
|
||||
```
|
||||
|
||||
Now you can use [the mirror macro](/reference/macros/mirror) in your parts.
|
||||
You can now use the [mirror](/reference/api/macros/mirror) macro in your parts.
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,50 +1,21 @@
|
|||
---
|
||||
title: round
|
||||
title: "@freesewing/plugin-round"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-round)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-round)
|
||||
The **@freesewing/plugin-round** plugin provides [the
|
||||
round macro](/reference/api/macros/round) which helps you round
|
||||
corners on your designs.
|
||||
|
||||
The **round** plugin provides [the round macro](/reference/macros/round/):
|
||||
<Warning>
|
||||
|
||||
<Example part="plugin_round" caption="An example of the round macro" design={false} />
|
||||
##### Straight corners only
|
||||
|
||||
```js
|
||||
points.topLeft = new Point(0, 0);
|
||||
points.bottomLeft = new Point(0, 30);
|
||||
points.topRight = new Point(100, 0);
|
||||
points.bottomRight = new Point(100, 30);
|
||||
The round macro is intended for rounding 90° angles.
|
||||
It does not support rounding other angles/corners.
|
||||
|
||||
paths.demo = new Path()
|
||||
.move(points.topLeft)
|
||||
.line(points.bottomLeft)
|
||||
.line(points.bottomRight)
|
||||
.line(points.topRight)
|
||||
.close()
|
||||
.attr("class", "note dashed");
|
||||
</Warning>
|
||||
|
||||
macro("round", {
|
||||
from: points.topLeft,
|
||||
to: points.bottomRight,
|
||||
via: points.bottomLeft,
|
||||
radius: 10,
|
||||
prefix: 'bl',
|
||||
render: true
|
||||
});
|
||||
macro("round", {
|
||||
from: points.bottomRight,
|
||||
to: points.topLeft,
|
||||
via: points.topRight,
|
||||
radius: 20,
|
||||
prefix: 'tr',
|
||||
render: true
|
||||
});
|
||||
```
|
||||
<Example part="plugin_round">An example of the round macro</Example>
|
||||
|
||||
<Tip>
|
||||
|
||||
|
|
@ -60,8 +31,8 @@ npm install @freesewing/plugin-round
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -73,9 +44,4 @@ const Pattern = new freesewing.Design(config, round);
|
|||
|
||||
Now you can use [the round macro](/reference/macros/round/): in your parts.
|
||||
|
||||
<Warning>
|
||||
|
||||
The round macro is intended for rounding 90° angles
|
||||
|
||||
</Warning>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,34 +1,21 @@
|
|||
---
|
||||
title: scalebox
|
||||
title: "@freesewing/plugin-scalebox"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-scalebox)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-scalebox)
|
||||
The **@freesewing/plugin-scalebox** plugin provides [the
|
||||
scalebox macro](/reference/api/macros/scalebox/) with facilitates
|
||||
adding a scalebox to your design, so users can verify that the pattern
|
||||
is printed at the correct scale.
|
||||
|
||||
The **scalebox** plugin provides [the scalebox macro](/reference/macros/scalebox/):
|
||||
|
||||
<Example part="plugin_scalebox" caption="An example of the scalebox" design={false} />
|
||||
|
||||
```js
|
||||
let { Point, points, macro } = part.shorthand();
|
||||
|
||||
points.anchor = new Point(0, 0);
|
||||
|
||||
macro("scalebox", {
|
||||
at: points.anchor
|
||||
});
|
||||
```
|
||||
<Example part="plugin_scalebox">An example of the scalebox</Example>
|
||||
|
||||
<Note>
|
||||
|
||||
###### Purpose of a scale box
|
||||
##### FreeSewing branding can be overruled at runtime
|
||||
|
||||
A scalebox allows people to verify the pattern is printed at the correct scale
|
||||
This plugin by default includes FreeSewing branding, but you can
|
||||
override that when calling the scalebox macro in case you want to
|
||||
generate your own branded designs.
|
||||
|
||||
</Note>
|
||||
|
||||
|
|
@ -46,8 +33,8 @@ npm install @freesewing/plugin-scalebox
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -57,4 +44,4 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, scalebox);
|
||||
```
|
||||
|
||||
Now you can use [the scalebox macro](/reference/macros/scalebox/) the macro in your parts.
|
||||
Now you can use the [scalebox](/reference/api/macros/scalebox/) macro in your parts.
|
||||
|
|
|
|||
|
|
@ -1,37 +1,13 @@
|
|||
---
|
||||
title: sprinkle
|
||||
title: "@freesewing/plugin-sprinkle"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-sprinkle)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-sprinkle)
|
||||
The **@freesewing/plugin-sprinkle** plugin provides [the
|
||||
sprinkle macro](/reference/api/macros/sprinkle/) which is a faster way
|
||||
to add several of the same snippets to your designs (think of it as
|
||||
*sprinkling* them onto your parts).
|
||||
|
||||
The **sprinkle** plugin provides [the sprinkle macro](/reference/macros/sprinkle/):
|
||||
|
||||
<Example part="plugin_sprinkle" caption="An example of the sprinkle macro" design={false} />
|
||||
|
||||
```js
|
||||
let { Point, points, macro } = part.shorthand();
|
||||
|
||||
points.a = new Point(10, 10);
|
||||
points.b = new Point(20, 15);
|
||||
points.c = new Point(30, 10);
|
||||
points.d = new Point(40, 15);
|
||||
points.e = new Point(50, 10);
|
||||
points.f = new Point(60, 15);
|
||||
points.g = new Point(70, 10);
|
||||
points.h = new Point(80, 15);
|
||||
points.i = new Point(90, 10);
|
||||
|
||||
macro("sprinkle", {
|
||||
snippet: "button",
|
||||
on: ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i']
|
||||
});
|
||||
```
|
||||
<Example part="plugin_sprinkle">An example of the sprinkle macro</Example>
|
||||
|
||||
<Tip>
|
||||
|
||||
|
|
@ -47,8 +23,8 @@ npm install @freesewing/plugin-sprinkle
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -58,4 +34,4 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, sprinkle);
|
||||
```
|
||||
|
||||
Now you can use [the sprinkle macro](/reference/macros/sprinkle/) in your parts.
|
||||
Now you can use the [sprinkle](/reference/api/macros/sprinkle) macro in your parts.
|
||||
|
|
|
|||
|
|
@ -1,18 +1,10 @@
|
|||
---
|
||||
title: svgattr
|
||||
title: "@freesewing/plugin-svgattr"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-svgattr)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-svgattr)
|
||||
|
||||
The **svgattr** plugin takes an object of key-value pairs and adds them to the SVG tag on render.
|
||||
|
||||
It uses the [`preRender`](/plugins#preRender) hook to do so.
|
||||
The **@freesewing/plugin-svgattr** plugin takes an object of key-value
|
||||
pairs and adds them ass attributes to your SVG document on render.
|
||||
It leverages [the preRender lifecycle hook](/reference/api/hooks/prerender) to do so.
|
||||
|
||||
## Installation
|
||||
|
||||
|
|
@ -22,16 +14,16 @@ npm install @freesewing/plugin-svgattr
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import Aaron from "@freesewing/aaron";
|
||||
import i18n from "@freesewing/plugin-i18n";
|
||||
import svgAttr from "@freesewing/plugin-svgattr";
|
||||
import translations from "@freesewing/i18n";
|
||||
|
||||
const myAaron = new Aaron()
|
||||
.use(i18nPlugin, { class: "freesewing draft" });
|
||||
.use(svgAttr, { class: "freesewing pattern" });
|
||||
```
|
||||
|
||||
You should pass a second argument which holds key-value pairs of the attributes you want to add to the SVG tag.
|
||||
|
|
|
|||
|
|
@ -1,25 +1,20 @@
|
|||
---
|
||||
title: theme
|
||||
title: "@freesewing/plugin-theme"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-theme)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-theme)
|
||||
The **@freesewing-plugin-theme** plugin provides CSS styling for SVG output.
|
||||
It leverages [the preRender lifecycle hook](/reference/api/hooks/prerender) to
|
||||
accomplish this.
|
||||
|
||||
The **theme** plugin provides CSS styling for SVG output:
|
||||
|
||||
<Example pattern="rendertest" part="test" caption="An example of the styles provided by this plugin" design={false} />
|
||||
|
||||
It uses the [`preRender`](/plugins#prerender) hook to do so.
|
||||
|
||||
<Note>
|
||||
|
||||
This plugin only applies to rendered SVG output. If you use our React component to display
|
||||
patterns, you should style our component or use our [css-theme](/reference/packages/css-theme) package.
|
||||
##### Only applies to SVG/PS/PDF output
|
||||
|
||||
This plugin will inject CSS in the SVG document when rendering to SVG.
|
||||
|
||||
If you use other ways to render your pattern (like our React component)
|
||||
you will need to apply your own styles.
|
||||
|
||||
</Note>
|
||||
|
||||
|
|
@ -31,14 +26,15 @@ npm install @freesewing/plugin-theme
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [run-time plugins](/guides/plugins/types-of-plugins#run-time-plugins), you
|
||||
load them by by passing them to the `use()` method of an instatiated pattern.
|
||||
|
||||
That method is chainable, so if you have multiple plugins you can just chain them together.
|
||||
|
||||
```js
|
||||
import Aaron from "@freesewing/aaron";
|
||||
import theme from "@freesewing/plugin-theme";
|
||||
|
||||
const myAaron = new Aaron()
|
||||
.use(theme);
|
||||
const myAaron = new Aaron().use(theme);
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,12 @@
|
|||
---
|
||||
title: title
|
||||
title: "@freesewing/plugin-title"
|
||||
---
|
||||
|
||||
[](/plugins)
|
||||
|
||||
[](https://www.npmjs.com/package/@freesewing/plugin-title)
|
||||
|
||||
[](https://deepscan.io/dashboard#view=project&tid=2114&pid=2993&bid=23256)
|
||||
|
||||
[](https://github.com/freesewing/freesewing/issues?q=is%3Aissue+is%3Aopen+label%3Apkg%3Aplugin-title)
|
||||
The **@freesewing/plugin-title** plugin provides [the
|
||||
title macro](/reference/api/macros/title/) which facilitates adding part titles
|
||||
to your desings.
|
||||
|
||||
The **title** plugin provides [the title macro](/reference/macros/title/):
|
||||
|
||||
<Example part="plugin_title" caption="An example of the title macro" design={false} />
|
||||
|
||||
```js
|
||||
let { Point, points, macro } = part.shorthand();
|
||||
|
||||
points.title = new Point(90, 45);
|
||||
|
||||
macro("title", {
|
||||
at: points.title,
|
||||
nr: 4,
|
||||
title: "sleeve"
|
||||
});
|
||||
```
|
||||
<Example part="plugin_title">An example of the title macro</Example>
|
||||
|
||||
<Tip>
|
||||
|
||||
|
|
@ -40,8 +22,8 @@ npm install @freesewing/plugin-title
|
|||
|
||||
## Usage
|
||||
|
||||
Like all [build-time plugins](/guides/plugins/#build-time-plugins), you load them
|
||||
by passing them to the [`freesewing.Design`](/reference/api#design) constructor:
|
||||
Like all [build-time plugins](/guides/plugins/types-of-plugins#build-time-plugins), you
|
||||
load them by passing them to the [freesewing.Design](/reference/api/design) super-constructor:
|
||||
|
||||
```js
|
||||
import freesewing from "@freesewing/core";
|
||||
|
|
@ -51,5 +33,5 @@ import config from "../config";
|
|||
const Pattern = new freesewing.Design(config, title);
|
||||
```
|
||||
|
||||
Now you can use [the title macro](/reference/macros/title/) in your parts.
|
||||
Now you can use the [title](/reference/api/macros/title/) macro in your parts.
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue