1
0
Fork 0

fix(docs) Add custom attributes and Snippets documentation

This commit is contained in:
Benjamin F 2022-12-14 21:24:28 -08:00
parent 265833d419
commit b53f62c4d1
8 changed files with 116 additions and 17 deletions

View file

@ -2,21 +2,22 @@
title: Snippet
---
A Snippet is a reuseable bit of markup for your pattern. They are added to the
A Snippet is a reusable bit of markup for your pattern. Snippets are added to the
SVG `defs` section, and rendered with the SVG `use` tag.
## Signature
```js
Snippet new Snippet(def, Point);
Snippet new Snippet(String def, Point anchor);
```
The snippet constructor takes two arguments:
- `def` : The `xlink:href` id that links to the relevant entry in the SVG `defs` section
- `def` : The `xlink:href` id that links to the relevant entry in the SVG `defs` section.
This is also the common name of the snippet (`logo`, `notch`, `button`, etc.)
- `anchor` : A [`Point`](/reference/api/point) on which to anchor the snippet
## Attributes
## Properties
A Snippet object comes with the following properties:
@ -24,6 +25,11 @@ A Snippet object comes with the following properties:
- `anchor` : A [`Point`](/reference/api/point) on which to anchor the snippet
- `attributes` : An [`Attributes`](/reference/api/attributes) instance holding the snippet's attributes
<Related>
See [Using Attributes](/howtos/code/attributes)
for information about custom Attributes that can be used with Snippets.
</Related>
## Example
<Example caption="Example of the Snippet constructor">