@bygga.dev/editor 1.1.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +32 -4
- package/{TextEditor-CJ2hChsq.js → TextEditor-JwRYUlJJ.js} +543 -484
- package/bygga-editor.js +2609 -2124
- package/element.d.ts +8 -2
- package/package.json +1 -1
- package/{vue.runtime.esm-bundler-C8OyVIE3.js → providerKeys-BrTFiegH.js} +2 -2
- package/{urls-BO2HiDHB.js → urls-B4ECLEvt.js} +3302 -3133
package/README.md
CHANGED
|
@@ -2,11 +2,14 @@
|
|
|
2
2
|
|
|
3
3
|
`<bygga-editor>` — a visual builder for content **documents**, shipped as a native
|
|
4
4
|
[custom element](https://developer.mozilla.org/en-US/docs/Web/API/Web_components).
|
|
5
|
-
|
|
5
|
+
Two document kinds share one model: **email** (compiled to Outlook-safe sending HTML)
|
|
6
|
+
and **page** (the same blocks compiled to a standalone web page). Built from Vue 3 and
|
|
6
7
|
bundled with everything it needs, it embeds directly in any web page — no framework,
|
|
7
8
|
no iframe — and renders into a shadow root, so host CSS can't leak in and editor
|
|
8
9
|
styles can't leak out.
|
|
9
10
|
|
|
11
|
+
The editor is built and maintained by [Memlist CRM](https://memlist.se)
|
|
12
|
+
|
|
10
13
|
## Install
|
|
11
14
|
|
|
12
15
|
```sh
|
|
@@ -103,6 +106,30 @@ per-locale labels (`{ firstName: { en: 'First name', sv: 'Förnamn' } }`). Popul
|
|
|
103
106
|
the merge-tag picker; your backend must later resolve every id it sees. A missing
|
|
104
107
|
locale label falls back to the default locale, then to the bare id.
|
|
105
108
|
|
|
109
|
+
### `brand` property
|
|
110
|
+
The colours and fonts your embed permits — a menu for the pickers, never a rewrite of a
|
|
111
|
+
document. All halves are optional; an absent one is unrestricted.
|
|
112
|
+
|
|
113
|
+
```js
|
|
114
|
+
editor.brand = {
|
|
115
|
+
colors: ['#2f2a72', '#a28c67'], // replaces the free spectrum with swatches
|
|
116
|
+
fonts: ['georgia', 'arial'], // narrows the email-safe faces; first seeds new documents
|
|
117
|
+
customFonts: [ // appends your own faces after the email-safe set
|
|
118
|
+
{
|
|
119
|
+
name: 'Acme Sans', // picker label; @font-face family for a font-file href
|
|
120
|
+
href: 'https://static.example.com/fonts/acme-sans.css', // stylesheet URL (e.g. a Google Fonts embed), or a .woff2/.ttf file
|
|
121
|
+
fontFamily: "'Acme Sans', Arial, sans-serif", // optional exact stack to write
|
|
122
|
+
},
|
|
123
|
+
],
|
|
124
|
+
}
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
A custom face renders in the editor and wherever the compiled HTML is shown in a real
|
|
128
|
+
browser engine (a view-online page, Apple Mail); most email clients strip remote fonts
|
|
129
|
+
and fall back through the stack, so give `fontFamily` sensible fallbacks. The document
|
|
130
|
+
carries what it uses (`customFonts` in its JSON), so it keeps rendering even if you later
|
|
131
|
+
change the registration. Only http(s) hrefs register.
|
|
132
|
+
|
|
106
133
|
### `license-key` attribute
|
|
107
134
|
Your licence key (see [You need a licence key](#you-need-a-licence-key)). Reactive: changing it
|
|
108
135
|
re-activates, so a host that fetches its key can set it after the element is connected. Omit it on
|
|
@@ -140,7 +167,8 @@ Opaque by design: persist it (it's plain JSON — `JSON.stringify` it) and hand
|
|
|
140
167
|
back, but don't reach into it, since the shape is the editor's to evolve. Two ways to
|
|
141
168
|
get one:
|
|
142
169
|
|
|
143
|
-
- **`createEmptyDocument()`** — a fresh blank document
|
|
170
|
+
- **`createEmptyDocument(kind?)`** — a fresh blank document; `'email'` (the default) or
|
|
171
|
+
`'page'` decides what it compiles to.
|
|
144
172
|
- **`parseDocument(json)`** — the supported path from stored JSON back to a
|
|
145
173
|
`Document`. Throws if the editor can't open it, so a corrupt row fails at your load
|
|
146
174
|
boundary rather than deep inside the editor. Use what it returns, not what you
|
|
@@ -161,8 +189,8 @@ The package augments `HTMLElementTagNameMap`, so
|
|
|
161
189
|
properties, methods, and a typed `addEventListener` for `change` / `dirtychange`
|
|
162
190
|
included.
|
|
163
191
|
|
|
164
|
-
- **Types:** `Document`, `EditorConfig`, `
|
|
165
|
-
`ByggaEditorElement`, `ByggaEditorEventMap`.
|
|
192
|
+
- **Types:** `Document`, `EditorConfig`, `Brand`, `BrandFont`, `BrandCustomFont`,
|
|
193
|
+
`MergeTags`, `MergeTagLabels`, `Locale`, `ByggaEditorElement`, `ByggaEditorEventMap`.
|
|
166
194
|
- **Values:** `createEmptyDocument`, `parseDocument`, `SUPPORTED_LOCALES`,
|
|
167
195
|
`DEFAULT_LOCALE`, `EDITOR_TAG`, and `ByggaEditor` (the element constructor,
|
|
168
196
|
already registered on import).
|