@pixerate/editor-svelte 0.23.0 → 0.24.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 +2 -2
- package/dist/StylesGallery.svelte +169 -0
- package/dist/StylesGallery.svelte.d.ts +27 -0
- package/dist/StylesGallery.svelte.d.ts.map +1 -0
- package/dist/canvas/TokenBindingPicker.svelte +93 -0
- package/dist/canvas/TokenBindingPicker.svelte.d.ts +20 -0
- package/dist/canvas/TokenBindingPicker.svelte.d.ts.map +1 -0
- package/dist/canvas/TokenModeSwitcher.svelte +55 -0
- package/dist/canvas/TokenModeSwitcher.svelte.d.ts +18 -0
- package/dist/canvas/TokenModeSwitcher.svelte.d.ts.map +1 -0
- package/dist/canvas/createCanvasArrange.svelte.d.ts +4 -0
- package/dist/canvas/createCanvasArrange.svelte.d.ts.map +1 -1
- package/dist/canvas/createCanvasAutoLayout.svelte.d.ts.map +1 -1
- package/dist/canvas/createCanvasTokens.svelte.d.ts +31 -0
- package/dist/canvas/createCanvasTokens.svelte.d.ts.map +1 -0
- package/dist/canvas/createCanvasTokens.svelte.js +50 -0
- package/dist/canvas/index.d.ts +5 -0
- package/dist/canvas/index.d.ts.map +1 -1
- package/dist/canvas/index.js +7 -0
- package/dist/fileImport.svelte.d.ts +8 -1
- package/dist/fileImport.svelte.d.ts.map +1 -1
- package/dist/fileImport.svelte.js +11 -1
- package/dist/generation/AssetMentionChips.svelte +130 -0
- package/dist/generation/AssetMentionChips.svelte.d.ts +21 -0
- package/dist/generation/AssetMentionChips.svelte.d.ts.map +1 -0
- package/dist/generation/GenerationHistory.svelte +161 -0
- package/dist/generation/GenerationHistory.svelte.d.ts +28 -0
- package/dist/generation/GenerationHistory.svelte.d.ts.map +1 -0
- package/dist/generation/index.d.ts +7 -0
- package/dist/generation/index.d.ts.map +1 -1
- package/dist/generation/index.js +3 -0
- package/dist/generation/records.svelte.d.ts +18 -0
- package/dist/generation/records.svelte.d.ts.map +1 -0
- package/dist/generation/records.svelte.js +66 -0
- package/dist/image-editor/ImageEditor.svelte +72 -1
- package/dist/image-editor/ImageEditor.svelte.d.ts.map +1 -1
- package/dist/image-editor/RefineEdgePanel.svelte +180 -0
- package/dist/image-editor/RefineEdgePanel.svelte.d.ts +13 -0
- package/dist/image-editor/RefineEdgePanel.svelte.d.ts.map +1 -0
- package/dist/image-editor/SelectionOptionsBar.svelte +135 -0
- package/dist/image-editor/SelectionOptionsBar.svelte.d.ts +15 -0
- package/dist/image-editor/SelectionOptionsBar.svelte.d.ts.map +1 -0
- package/dist/image-editor/index.d.ts +6 -0
- package/dist/image-editor/index.d.ts.map +1 -1
- package/dist/image-editor/index.js +2 -0
- package/dist/index.d.ts +4 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/paragraphStyles.svelte.d.ts +30 -0
- package/dist/paragraphStyles.svelte.d.ts.map +1 -0
- package/dist/paragraphStyles.svelte.js +44 -0
- package/dist/review/TrackedChangesList.svelte +67 -0
- package/dist/review/TrackedChangesList.svelte.d.ts +13 -0
- package/dist/review/TrackedChangesList.svelte.d.ts.map +1 -0
- package/dist/review/index.d.ts +3 -0
- package/dist/review/index.d.ts.map +1 -1
- package/dist/review/index.js +1 -0
- package/dist/review/review.svelte.d.ts +6 -0
- package/dist/review/review.svelte.d.ts.map +1 -1
- package/dist/review/review.svelte.js +3 -0
- package/dist/spreadsheet/FormulaBar.svelte +13 -4
- package/dist/spreadsheet/FormulaBar.svelte.d.ts.map +1 -1
- package/dist/spreadsheet/FormulaHints.svelte +7 -5
- package/dist/spreadsheet/FormulaHints.svelte.d.ts +3 -0
- package/dist/spreadsheet/FormulaHints.svelte.d.ts.map +1 -1
- package/dist/spreadsheet/NameManager.svelte +165 -0
- package/dist/spreadsheet/NameManager.svelte.d.ts +11 -0
- package/dist/spreadsheet/NameManager.svelte.d.ts.map +1 -0
- package/dist/spreadsheet/SheetTabs.svelte +161 -0
- package/dist/spreadsheet/SheetTabs.svelte.d.ts +10 -0
- package/dist/spreadsheet/SheetTabs.svelte.d.ts.map +1 -0
- package/dist/spreadsheet/SpreadsheetConditionalFormatPanel.svelte +184 -0
- package/dist/spreadsheet/SpreadsheetConditionalFormatPanel.svelte.d.ts +9 -0
- package/dist/spreadsheet/SpreadsheetConditionalFormatPanel.svelte.d.ts.map +1 -0
- package/dist/spreadsheet/SpreadsheetContextMenu.svelte +9 -4
- package/dist/spreadsheet/SpreadsheetContextMenu.svelte.d.ts +5 -1
- package/dist/spreadsheet/SpreadsheetContextMenu.svelte.d.ts.map +1 -1
- package/dist/spreadsheet/SpreadsheetDataValidationPanel.svelte +141 -0
- package/dist/spreadsheet/SpreadsheetDataValidationPanel.svelte.d.ts +9 -0
- package/dist/spreadsheet/SpreadsheetDataValidationPanel.svelte.d.ts.map +1 -0
- package/dist/spreadsheet/SpreadsheetEditor.svelte +197 -13
- package/dist/spreadsheet/SpreadsheetEditor.svelte.d.ts +2 -0
- package/dist/spreadsheet/SpreadsheetEditor.svelte.d.ts.map +1 -1
- package/dist/spreadsheet/SpreadsheetValidationDialog.svelte +92 -0
- package/dist/spreadsheet/SpreadsheetValidationDialog.svelte.d.ts +9 -0
- package/dist/spreadsheet/SpreadsheetValidationDialog.svelte.d.ts.map +1 -0
- package/dist/spreadsheet/index.d.ts +9 -0
- package/dist/spreadsheet/index.d.ts.map +1 -1
- package/dist/spreadsheet/index.js +5 -0
- package/dist/spreadsheet/spreadsheet.svelte.d.ts +55 -2
- package/dist/spreadsheet/spreadsheet.svelte.d.ts.map +1 -1
- package/dist/spreadsheet/spreadsheet.svelte.js +105 -6
- package/dist/tokens/TokenSwatch.svelte +14 -0
- package/dist/tokens/TokenSwatch.svelte.d.ts +8 -0
- package/dist/tokens/TokenSwatch.svelte.d.ts.map +1 -0
- package/dist/tokens/TokensPanel.svelte +323 -0
- package/dist/tokens/TokensPanel.svelte.d.ts +14 -0
- package/dist/tokens/TokensPanel.svelte.d.ts.map +1 -0
- package/dist/tokens/createTokens.svelte.d.ts +31 -0
- package/dist/tokens/createTokens.svelte.d.ts.map +1 -0
- package/dist/tokens/createTokens.svelte.js +43 -0
- package/dist/tokens/index.d.ts +7 -0
- package/dist/tokens/index.d.ts.map +1 -0
- package/dist/tokens/index.js +3 -0
- package/package.json +10 -2
package/README.md
CHANGED
|
@@ -76,8 +76,8 @@ Requires **Svelte 5** (the components use runes). Components ship as `.svelte` s
|
|
|
76
76
|
| Import | Exports |
|
|
77
77
|
| :--- | :--- |
|
|
78
78
|
| `@pixerate/editor-svelte` | `EditableTextNodeEditor`, `BubbleMenu`, `TemplateRenderer`, `initiateEditor`, `createReactiveEditor`, `createHistory`, `createHistoryDirty`, `createHistoryShortcuts`, `navigationGuard` (action), `createNavigationGuard`, `SpreadsheetEditor`, `FormulaBar`, `FormulaHints`, `createReactiveSpreadsheet`, `DirtyTracker` |
|
|
79
|
-
| `@pixerate/editor-svelte/spreadsheet` | `SpreadsheetEditor`, `FormulaBar`, `FormulaHints`, `SpreadsheetContextMenu`, `SpreadsheetGroupRow`, `createReactiveSpreadsheet` (also re-exported from the root entry) |
|
|
80
|
-
| `@pixerate/editor-svelte/image-editor` | `ImageEditor`, `createReactiveImageEditor`: crop, rotate/flip, adjustments, annotations, depth masks, and `onInpaint` / `onRemoveBackground` AI hooks |
|
|
79
|
+
| `@pixerate/editor-svelte/spreadsheet` | `SpreadsheetEditor`, `FormulaBar`, `FormulaHints`, `SpreadsheetContextMenu`, `SpreadsheetGroupRow`, `SheetTabs`, `NameManager`, `createReactiveSpreadsheet` (also re-exported from the root entry) |
|
|
80
|
+
| `@pixerate/editor-svelte/image-editor` | `ImageEditor`, `createReactiveImageEditor`: crop, rotate/flip, adjustments, annotations, depth masks, Select & Mask (`SelectionOptionsBar`, `RefineEdgePanel`: magic wand, marquees, lasso, Refine Edge, layer masks), and `onInpaint` / `onRemoveBackground` AI hooks |
|
|
81
81
|
| `@pixerate/editor-svelte/commands` | `CommandPalette`, `createCommandPalette` (`hotkey: "Mod+K"`; call `destroy()` when done), `createCommandShortcuts`, `useRegisterCommands` over a `CommandRegistry` from `@pixerate/editor/commands` (also re-exported from the root entry) |
|
|
82
82
|
| `@pixerate/editor-svelte/persistence` | `createAutosave` (crash-recovery snapshots bound to a history / dirty flag, flushed on `pagehide`; call `destroy()` when done) and `<RecoveryPrompt>` (also re-exported from the root entry) |
|
|
83
83
|
| `@pixerate/editor-svelte/generation` | `GenerationSettings` (controls generated from a model's capabilities, reference slots by role, plan adjustments; `onchange` / `onaddreference`), `createGenerationPlan(() => request, () => caps)`, `JobProgress`, `createJobProgress` (call `destroy()` when done) over `@pixerate/editor/generation` (also re-exported from the root entry) |
|
|
@@ -0,0 +1,169 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { Editor } from "@tiptap/core";
|
|
3
|
+
import { createParagraphStyles, type SvelteParagraphStyles } from "./paragraphStyles.svelte.js";
|
|
4
|
+
|
|
5
|
+
interface Props {
|
|
6
|
+
editor?: Editor | null;
|
|
7
|
+
/**
|
|
8
|
+
* `dropdown` (default): a button showing the current style that opens the
|
|
9
|
+
* list. `gallery`: the styles are always shown, in a row.
|
|
10
|
+
*/
|
|
11
|
+
variant?: "dropdown" | "gallery";
|
|
12
|
+
/** List every available paragraph style instead of the gallery (quick) styles. */
|
|
13
|
+
showAllStyles?: boolean;
|
|
14
|
+
/** Show the "Update to match selection" and "New style from selection" actions. Defaults to `true`. */
|
|
15
|
+
showActions?: boolean;
|
|
16
|
+
/** Preview each style's font, weight, style and color in its entry. Defaults to `true`. */
|
|
17
|
+
preview?: boolean;
|
|
18
|
+
class?: string;
|
|
19
|
+
itemClass?: string;
|
|
20
|
+
activeItemClass?: string;
|
|
21
|
+
/** Called after a style is applied, updated or created. */
|
|
22
|
+
onchange?: (event: { type: "apply" | "update" | "create"; id: string }) => void;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
let {
|
|
26
|
+
editor = null,
|
|
27
|
+
variant = "dropdown",
|
|
28
|
+
showAllStyles = false,
|
|
29
|
+
showActions = true,
|
|
30
|
+
preview = true,
|
|
31
|
+
class: className = "relative inline-flex flex-wrap items-center gap-1 text-sm",
|
|
32
|
+
itemClass = "rounded px-2 py-1 text-left text-xs text-foreground hover:bg-muted",
|
|
33
|
+
activeItemClass = "bg-primary/10 text-primary",
|
|
34
|
+
onchange,
|
|
35
|
+
}: Props = $props();
|
|
36
|
+
|
|
37
|
+
let styles = $state.raw<SvelteParagraphStyles>(createParagraphStyles(null));
|
|
38
|
+
$effect(() => {
|
|
39
|
+
const s = createParagraphStyles(editor);
|
|
40
|
+
styles = s;
|
|
41
|
+
return () => s.destroy();
|
|
42
|
+
});
|
|
43
|
+
|
|
44
|
+
let open = $state(false);
|
|
45
|
+
let creating = $state(false);
|
|
46
|
+
let name = $state("");
|
|
47
|
+
|
|
48
|
+
let list = $derived(showAllStyles ? styles.current.styles : styles.current.gallery);
|
|
49
|
+
let current = $derived(styles.currentStyle);
|
|
50
|
+
let expanded = $derived(variant === "gallery" || open);
|
|
51
|
+
|
|
52
|
+
function close() {
|
|
53
|
+
if (variant === "dropdown") open = false;
|
|
54
|
+
creating = false;
|
|
55
|
+
name = "";
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
function previewStyle(id: string): string | undefined {
|
|
59
|
+
if (!preview || !styles.registry) return undefined;
|
|
60
|
+
return Object.entries(styles.registry.previewDeclarations(id))
|
|
61
|
+
.map(([property, value]) => `${property}: ${value}`)
|
|
62
|
+
.join("; ");
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
function apply(id: string) {
|
|
66
|
+
if (styles.apply(id)) onchange?.({ type: "apply", id });
|
|
67
|
+
close();
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
function update() {
|
|
71
|
+
if (current && styles.updateFromSelection(current.id)) {
|
|
72
|
+
onchange?.({ type: "update", id: current.id });
|
|
73
|
+
}
|
|
74
|
+
close();
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
function create(event: SubmitEvent) {
|
|
78
|
+
event.preventDefault();
|
|
79
|
+
const id = name.trim() ? styles.createFromSelection(name) : null;
|
|
80
|
+
if (id) onchange?.({ type: "create", id });
|
|
81
|
+
close();
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
const keepSelection = (event: MouseEvent) => event.preventDefault();
|
|
85
|
+
</script>
|
|
86
|
+
|
|
87
|
+
<div class={className} role="group" aria-label="Paragraph styles" data-styles-gallery={variant}>
|
|
88
|
+
{#if variant === "dropdown"}
|
|
89
|
+
<button
|
|
90
|
+
type="button"
|
|
91
|
+
class={itemClass}
|
|
92
|
+
aria-haspopup="listbox"
|
|
93
|
+
aria-expanded={open}
|
|
94
|
+
disabled={!editor || !styles.registry}
|
|
95
|
+
onmousedown={keepSelection}
|
|
96
|
+
onclick={() => (open = !open)}
|
|
97
|
+
>
|
|
98
|
+
{current?.name ?? "Styles"} ▾
|
|
99
|
+
</button>
|
|
100
|
+
{/if}
|
|
101
|
+
{#if expanded}
|
|
102
|
+
<div
|
|
103
|
+
class={variant === "dropdown"
|
|
104
|
+
? "absolute left-0 top-full z-20 mt-1 flex min-w-[12rem] flex-col gap-0.5 rounded-md border border-border bg-background p-1 shadow-md"
|
|
105
|
+
: "flex flex-wrap items-center gap-1"}
|
|
106
|
+
>
|
|
107
|
+
<div
|
|
108
|
+
role="listbox"
|
|
109
|
+
aria-label="Styles"
|
|
110
|
+
class={variant === "dropdown" ? "flex flex-col gap-0.5" : "flex flex-wrap gap-1"}
|
|
111
|
+
>
|
|
112
|
+
{#each list as style (style.id)}
|
|
113
|
+
{@const active = style.id === styles.current.currentStyleId}
|
|
114
|
+
<button
|
|
115
|
+
type="button"
|
|
116
|
+
role="option"
|
|
117
|
+
aria-selected={active}
|
|
118
|
+
data-style-id={style.id}
|
|
119
|
+
class={active ? `${itemClass} ${activeItemClass}` : itemClass}
|
|
120
|
+
style={previewStyle(style.id)}
|
|
121
|
+
onmousedown={keepSelection}
|
|
122
|
+
onclick={() => apply(style.id)}
|
|
123
|
+
>
|
|
124
|
+
{style.name}
|
|
125
|
+
</button>
|
|
126
|
+
{/each}
|
|
127
|
+
</div>
|
|
128
|
+
{#if showActions}
|
|
129
|
+
<div
|
|
130
|
+
class={variant === "dropdown"
|
|
131
|
+
? "mt-1 flex flex-col gap-0.5 border-t border-border pt-1"
|
|
132
|
+
: "flex items-center gap-1"}
|
|
133
|
+
>
|
|
134
|
+
<button
|
|
135
|
+
type="button"
|
|
136
|
+
class={itemClass}
|
|
137
|
+
disabled={!current}
|
|
138
|
+
onmousedown={keepSelection}
|
|
139
|
+
onclick={update}
|
|
140
|
+
>
|
|
141
|
+
{current ? `Update ${current.name} to match selection` : "Update to match selection"}
|
|
142
|
+
</button>
|
|
143
|
+
{#if creating}
|
|
144
|
+
<form class="flex items-center gap-1" onsubmit={create}>
|
|
145
|
+
<!-- svelte-ignore a11y_autofocus -->
|
|
146
|
+
<input
|
|
147
|
+
aria-label="New style name"
|
|
148
|
+
class="w-32 rounded border border-border bg-background px-1 py-0.5 text-xs"
|
|
149
|
+
bind:value={name}
|
|
150
|
+
autofocus
|
|
151
|
+
/>
|
|
152
|
+
<button type="submit" class={itemClass} disabled={!name.trim()}>Create</button>
|
|
153
|
+
</form>
|
|
154
|
+
{:else}
|
|
155
|
+
<button
|
|
156
|
+
type="button"
|
|
157
|
+
class={itemClass}
|
|
158
|
+
disabled={!editor || !styles.registry}
|
|
159
|
+
onmousedown={keepSelection}
|
|
160
|
+
onclick={() => (creating = true)}
|
|
161
|
+
>
|
|
162
|
+
New style from selection
|
|
163
|
+
</button>
|
|
164
|
+
{/if}
|
|
165
|
+
</div>
|
|
166
|
+
{/if}
|
|
167
|
+
</div>
|
|
168
|
+
{/if}
|
|
169
|
+
</div>
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import type { Editor } from "@tiptap/core";
|
|
2
|
+
interface Props {
|
|
3
|
+
editor?: Editor | null;
|
|
4
|
+
/**
|
|
5
|
+
* `dropdown` (default): a button showing the current style that opens the
|
|
6
|
+
* list. `gallery`: the styles are always shown, in a row.
|
|
7
|
+
*/
|
|
8
|
+
variant?: "dropdown" | "gallery";
|
|
9
|
+
/** List every available paragraph style instead of the gallery (quick) styles. */
|
|
10
|
+
showAllStyles?: boolean;
|
|
11
|
+
/** Show the "Update to match selection" and "New style from selection" actions. Defaults to `true`. */
|
|
12
|
+
showActions?: boolean;
|
|
13
|
+
/** Preview each style's font, weight, style and color in its entry. Defaults to `true`. */
|
|
14
|
+
preview?: boolean;
|
|
15
|
+
class?: string;
|
|
16
|
+
itemClass?: string;
|
|
17
|
+
activeItemClass?: string;
|
|
18
|
+
/** Called after a style is applied, updated or created. */
|
|
19
|
+
onchange?: (event: {
|
|
20
|
+
type: "apply" | "update" | "create";
|
|
21
|
+
id: string;
|
|
22
|
+
}) => void;
|
|
23
|
+
}
|
|
24
|
+
declare const StylesGallery: import("svelte").Component<Props, {}, "">;
|
|
25
|
+
type StylesGallery = ReturnType<typeof StylesGallery>;
|
|
26
|
+
export default StylesGallery;
|
|
27
|
+
//# sourceMappingURL=StylesGallery.svelte.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StylesGallery.svelte.d.ts","sourceRoot":"","sources":["../src/StylesGallery.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAIzC,UAAU,KAAK;IACb,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IACjC,kFAAkF;IAClF,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,uGAAuG;IACvG,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2FAA2F;IAC3F,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,QAAQ,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CACjF;AAgHH,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
bindCanvasToken,
|
|
4
|
+
getBindableTokenProperties,
|
|
5
|
+
getEffectiveTokenModes,
|
|
6
|
+
getNodeTokenBindings,
|
|
7
|
+
getTokensForProperty,
|
|
8
|
+
type CanvasTokenOptions
|
|
9
|
+
} from '@pixerate/editor/canvas';
|
|
10
|
+
import { resolveToken, type TokenState } from '@pixerate/editor/tokens';
|
|
11
|
+
import type { CanvasNode } from './types.js';
|
|
12
|
+
|
|
13
|
+
interface Props {
|
|
14
|
+
state: TokenState;
|
|
15
|
+
nodes: CanvasNode[];
|
|
16
|
+
/** Nodes to bind (the first one decides which properties are listed). */
|
|
17
|
+
selectedIds: readonly string[];
|
|
18
|
+
/** Receives the nodes with the binding applied and resolved. */
|
|
19
|
+
onchange: (nodes: CanvasNode[]) => void;
|
|
20
|
+
options?: CanvasTokenOptions;
|
|
21
|
+
/** Limit to these property keys (in this order). */
|
|
22
|
+
properties?: readonly string[];
|
|
23
|
+
onerror?: (error: Error) => void;
|
|
24
|
+
class?: string;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
let { state, nodes, selectedIds, onchange, options = {}, properties, onerror, class: className = '' }: Props = $props();
|
|
28
|
+
|
|
29
|
+
const selected = $derived(nodes.filter((n) => selectedIds.includes(n.id)));
|
|
30
|
+
const first = $derived(selected[0]);
|
|
31
|
+
const rows = $derived.by(() => {
|
|
32
|
+
if (!first) return [];
|
|
33
|
+
const all = getBindableTokenProperties(first as any, options);
|
|
34
|
+
return properties ? properties.map((key) => all.find((p) => p.key === key)).filter((p) => !!p) : all;
|
|
35
|
+
});
|
|
36
|
+
const modes = $derived(first ? getEffectiveTokenModes(first as any, nodes as any, state, options) : {});
|
|
37
|
+
|
|
38
|
+
function valueOf(key: string) {
|
|
39
|
+
const ids = new Set(selected.map((n) => getNodeTokenBindings(n as any)[key] ?? ''));
|
|
40
|
+
return ids.size === 1 ? [...ids][0] : '__mixed';
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
function change(key: string, id: string) {
|
|
44
|
+
try {
|
|
45
|
+
onchange(bindCanvasToken(nodes as any[], selectedIds, key, id || null, state, options));
|
|
46
|
+
} catch (error) {
|
|
47
|
+
onerror?.(error as Error);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
</script>
|
|
51
|
+
|
|
52
|
+
{#if first}
|
|
53
|
+
<div data-token-binding-picker="" class="flex flex-col gap-1 text-xs text-foreground {className}">
|
|
54
|
+
{#each rows as property (property!.key)}
|
|
55
|
+
{@const value = valueOf(property!.key)}
|
|
56
|
+
{@const resolved = value && value !== '__mixed' ? resolveToken(state, value, modes) : null}
|
|
57
|
+
<label class="flex items-center gap-2" data-token-property={property!.key}>
|
|
58
|
+
<span class="w-28 shrink-0 text-muted-foreground">{property!.label}</span>
|
|
59
|
+
<select
|
|
60
|
+
aria-label="{property!.label} variable"
|
|
61
|
+
class="min-w-0 flex-1 rounded border border-border bg-background px-1 py-0.5 text-xs"
|
|
62
|
+
{value}
|
|
63
|
+
onchange={(e) => change(property!.key, e.currentTarget.value)}
|
|
64
|
+
>
|
|
65
|
+
{#if value === '__mixed'}<option value="__mixed">Mixed</option>{/if}
|
|
66
|
+
<option value="">None</option>
|
|
67
|
+
{#each getTokensForProperty(state, property!, first as any) as v (v.id)}
|
|
68
|
+
{@const collection = state.collections.find((c) => c.id === v.collectionId)}
|
|
69
|
+
<option value={v.id}>{v.name}{collection && state.collections.length > 1 ? ` (${collection.name})` : ''}</option>
|
|
70
|
+
{/each}
|
|
71
|
+
</select>
|
|
72
|
+
<span class="w-16 shrink-0 truncate text-right text-muted-foreground" data-token-resolved="">
|
|
73
|
+
{#if resolved?.ok}
|
|
74
|
+
{#if property!.type === 'color'}
|
|
75
|
+
<span
|
|
76
|
+
class="inline-block h-3 w-3 rounded border border-border align-middle"
|
|
77
|
+
style:background={String(resolved.value)}
|
|
78
|
+
title={String(resolved.value)}
|
|
79
|
+
></span>
|
|
80
|
+
{:else}
|
|
81
|
+
{String(resolved.value)}
|
|
82
|
+
{/if}
|
|
83
|
+
{:else if resolved}
|
|
84
|
+
<span title={resolved.message}>⚠</span>
|
|
85
|
+
{/if}
|
|
86
|
+
</span>
|
|
87
|
+
</label>
|
|
88
|
+
{/each}
|
|
89
|
+
{#if state.collections.length === 0}
|
|
90
|
+
<p class="text-muted-foreground">No variables yet.</p>
|
|
91
|
+
{/if}
|
|
92
|
+
</div>
|
|
93
|
+
{/if}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { type CanvasTokenOptions } from '@pixerate/editor/canvas';
|
|
2
|
+
import { type TokenState } from '@pixerate/editor/tokens';
|
|
3
|
+
import type { CanvasNode } from './types.js';
|
|
4
|
+
interface Props {
|
|
5
|
+
state: TokenState;
|
|
6
|
+
nodes: CanvasNode[];
|
|
7
|
+
/** Nodes to bind (the first one decides which properties are listed). */
|
|
8
|
+
selectedIds: readonly string[];
|
|
9
|
+
/** Receives the nodes with the binding applied and resolved. */
|
|
10
|
+
onchange: (nodes: CanvasNode[]) => void;
|
|
11
|
+
options?: CanvasTokenOptions;
|
|
12
|
+
/** Limit to these property keys (in this order). */
|
|
13
|
+
properties?: readonly string[];
|
|
14
|
+
onerror?: (error: Error) => void;
|
|
15
|
+
class?: string;
|
|
16
|
+
}
|
|
17
|
+
declare const TokenBindingPicker: import("svelte").Component<Props, {}, "">;
|
|
18
|
+
type TokenBindingPicker = ReturnType<typeof TokenBindingPicker>;
|
|
19
|
+
export default TokenBindingPicker;
|
|
20
|
+
//# sourceMappingURL=TokenBindingPicker.svelte.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TokenBindingPicker.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/TokenBindingPicker.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAML,KAAK,kBAAkB,EACvB,MAAM,yBAAyB,CAAC;AAClC,OAAO,EAAgB,KAAK,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAG5C,UAAU,KAAK;IACd,KAAK,EAAE,UAAU,CAAC;IAClB,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,yEAAyE;IACzE,WAAW,EAAE,SAAS,MAAM,EAAE,CAAC;IAC/B,gEAAgE;IAChE,QAAQ,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACxC,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,oDAAoD;IACpD,UAAU,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC/B,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;CACf;AAoEF,QAAA,MAAM,kBAAkB,2CAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
getEffectiveTokenModes,
|
|
4
|
+
getNodeTokenModes,
|
|
5
|
+
setCanvasTokenMode,
|
|
6
|
+
type CanvasTokenOptions
|
|
7
|
+
} from '@pixerate/editor/canvas';
|
|
8
|
+
import { getCurrentMode, type TokenState } from '@pixerate/editor/tokens';
|
|
9
|
+
import type { CanvasNode } from './types.js';
|
|
10
|
+
|
|
11
|
+
interface Props {
|
|
12
|
+
state: TokenState;
|
|
13
|
+
nodes: CanvasNode[];
|
|
14
|
+
/** Frames / groups whose explicit mode is set (the first one's choice is shown). */
|
|
15
|
+
nodeIds: readonly string[];
|
|
16
|
+
onchange: (nodes: CanvasNode[]) => void;
|
|
17
|
+
options?: CanvasTokenOptions;
|
|
18
|
+
/** Show collections with a single mode too (default `false`). */
|
|
19
|
+
showSingleMode?: boolean;
|
|
20
|
+
class?: string;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
let { state, nodes, nodeIds, onchange, options = {}, showSingleMode = false, class: className = '' }: Props = $props();
|
|
24
|
+
|
|
25
|
+
const first = $derived(nodes.find((n) => nodeIds.includes(n.id)));
|
|
26
|
+
const own = $derived(first ? getNodeTokenModes(first as any) : {});
|
|
27
|
+
const inherited = $derived.by(() => {
|
|
28
|
+
const parent = first?.parentId ? nodes.find((n) => n.id === first!.parentId) : undefined;
|
|
29
|
+
return parent ? getEffectiveTokenModes(parent as any, nodes as any, state, options) : { ...options.modes };
|
|
30
|
+
});
|
|
31
|
+
const collections = $derived(state.collections.filter((c) => showSingleMode || c.modes.length > 1));
|
|
32
|
+
</script>
|
|
33
|
+
|
|
34
|
+
{#if first}
|
|
35
|
+
<div data-token-mode-switcher="" class="flex flex-col gap-1 text-xs text-foreground {className}">
|
|
36
|
+
{#each collections as collection (collection.id)}
|
|
37
|
+
{@const explicit = collection.modes.some((m) => m.id === own[collection.id]) ? own[collection.id] : ''}
|
|
38
|
+
<label class="flex items-center gap-2" data-token-collection={collection.id}>
|
|
39
|
+
<span class="w-28 shrink-0 truncate text-muted-foreground">{collection.name}</span>
|
|
40
|
+
<select
|
|
41
|
+
aria-label="{collection.name} mode"
|
|
42
|
+
class="min-w-0 flex-1 rounded border border-border bg-background px-1 py-0.5 text-xs"
|
|
43
|
+
value={explicit}
|
|
44
|
+
onchange={(e) =>
|
|
45
|
+
onchange(setCanvasTokenMode(nodes as any[], nodeIds, collection.id, e.currentTarget.value || null, state, options))}
|
|
46
|
+
>
|
|
47
|
+
<option value="">Auto ({getCurrentMode(collection, inherited).name})</option>
|
|
48
|
+
{#each collection.modes as m (m.id)}
|
|
49
|
+
<option value={m.id}>{m.name}</option>
|
|
50
|
+
{/each}
|
|
51
|
+
</select>
|
|
52
|
+
</label>
|
|
53
|
+
{/each}
|
|
54
|
+
</div>
|
|
55
|
+
{/if}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { type CanvasTokenOptions } from '@pixerate/editor/canvas';
|
|
2
|
+
import { type TokenState } from '@pixerate/editor/tokens';
|
|
3
|
+
import type { CanvasNode } from './types.js';
|
|
4
|
+
interface Props {
|
|
5
|
+
state: TokenState;
|
|
6
|
+
nodes: CanvasNode[];
|
|
7
|
+
/** Frames / groups whose explicit mode is set (the first one's choice is shown). */
|
|
8
|
+
nodeIds: readonly string[];
|
|
9
|
+
onchange: (nodes: CanvasNode[]) => void;
|
|
10
|
+
options?: CanvasTokenOptions;
|
|
11
|
+
/** Show collections with a single mode too (default `false`). */
|
|
12
|
+
showSingleMode?: boolean;
|
|
13
|
+
class?: string;
|
|
14
|
+
}
|
|
15
|
+
declare const TokenModeSwitcher: import("svelte").Component<Props, {}, "">;
|
|
16
|
+
type TokenModeSwitcher = ReturnType<typeof TokenModeSwitcher>;
|
|
17
|
+
export default TokenModeSwitcher;
|
|
18
|
+
//# sourceMappingURL=TokenModeSwitcher.svelte.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TokenModeSwitcher.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/TokenModeSwitcher.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAIL,KAAK,kBAAkB,EACvB,MAAM,yBAAyB,CAAC;AAClC,OAAO,EAAkB,KAAK,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC1E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAG5C,UAAU,KAAK;IACd,KAAK,EAAE,UAAU,CAAC;IAClB,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,oFAAoF;IACpF,OAAO,EAAE,SAAS,MAAM,EAAE,CAAC;IAC3B,QAAQ,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACxC,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,iEAAiE;IACjE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;CACf;AAsCF,QAAA,MAAM,iBAAiB,2CAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}
|
|
@@ -51,6 +51,10 @@ export declare function createCanvasArrange<TNode extends CanvasNode = CanvasNod
|
|
|
51
51
|
exclude: (ids?: Iterable<string>, o?: import("@pixerate/editor/canvas").CombineShapeNodesOptions) => import("@pixerate/editor/canvas").CombineShapeNodesResult<any>;
|
|
52
52
|
divide: (ids?: Iterable<string>, o?: import("@pixerate/editor/canvas").CombineShapeNodesOptions) => import("@pixerate/editor/canvas").CombineShapeNodesResult<any>;
|
|
53
53
|
canCombineShapes: (ids?: Iterable<string>) => boolean;
|
|
54
|
+
offsetShapes(distance: number, ids?: Iterable<string>, offsetOptions?: import("@pixerate/editor/canvas").OffsetShapeNodesOptions): import("@pixerate/editor/canvas").ShapePathEditResult<any>;
|
|
55
|
+
canOffsetShapes: (ids?: Iterable<string>) => boolean;
|
|
56
|
+
outlineStroke(ids?: Iterable<string>, outlineOptions?: import("@pixerate/editor/canvas").OutlineShapeStrokesOptions): import("@pixerate/editor/canvas").ShapePathEditResult<any>;
|
|
57
|
+
canOutlineStroke: (ids?: Iterable<string>) => boolean;
|
|
54
58
|
runAction(action: CanvasArrangeAction): boolean;
|
|
55
59
|
beginDrag(ids?: Iterable<string>): void;
|
|
56
60
|
drag(ids?: Iterable<string>): import("@pixerate/editor/canvas").SnapNodeDragResult | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createCanvasArrange.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasArrange.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAGN,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,8BAA8B,EACnC,KAAK,SAAS,EACd,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,8BAA8B,CAAC,GAAG,CAAC,CAAC;AAEvD,MAAM,WAAW,0BAA0B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CAChF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACrE,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EACxE,OAAO,EAAE,0BAA0B,CAAC,KAAK,CAAC;;IAkBzC;;;;;OAKG;wBACiB,MAAM;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"createCanvasArrange.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasArrange.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAGN,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,8BAA8B,EACnC,KAAK,SAAS,EACd,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,8BAA8B,CAAC,GAAG,CAAC,CAAC;AAEvD,MAAM,WAAW,0BAA0B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CAChF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACrE,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EACxE,OAAO,EAAE,0BAA0B,CAAC,KAAK,CAAC;;IAkBzC;;;;;OAKG;wBACiB,MAAM;;;;;;;;;;sBAoDu6hF,CAAC;sBAAiE,CAAC;sBAAiE,CAAC;oBAA+D,CAAC;cAAyD,CAAC;gBAAiD,CAAC;;;;;;;;;0BAA8tC,CAAC;;yBAA6kB,CAAC;;0BAAgf,CAAC;;;;;;;;;;EAxCjhnF;AAED,MAAM,MAAM,aAAa,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,OAAO,mBAAmB,CAAC,KAAK,CAAC,CAAC,CAAC;AAEjH,MAAM,WAAW,6BAA6B;IAC7C,OAAO,EAAE;QAAE,SAAS,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,OAAO,CAAA;KAAE,CAAC;IACjE,uEAAuE;IACvE,MAAM,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,OAAO,CAAC;QAAC,QAAQ,EAAE,MAAM,OAAO,CAAA;KAAE,CAAC;IAC1D,aAAa,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IACrC,QAAQ,CAAC,EAAE,SAAS,sBAAsB,EAAE,CAAC;CAC7C;AAED;;;;;GAKG;AACH,wBAAgB,4BAA4B,CAAC,OAAO,EAAE,6BAA6B,GAAG,MAAM,IAAI,CAqB/F"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createCanvasAutoLayout.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasAutoLayout.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,iCAAiC,EACtC,KAAK,SAAS,EACd,KAAK,kBAAkB,EACvB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,iCAAiC,CAAC,GAAG,CAAC,CAAC;AAE1D,MAAM,WAAW,6BAA6B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CACnF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACrE,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,6BAA6B,CAAC,KAAK,CAAC;;;IA+BzH,2FAA2F;kBAC7E,OAAO,SAAS,kBAAkB,WAAW,OAAO,EAAE,GAAG,OAAO,EAAE;IAKhF,gFAAgF;0BAC1D,QAAQ,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAIjE,4EAA4E;iBAC/D,MAAM;IAInB;;;OAGG;wBACiB,MAAM;;;;;;;;
|
|
1
|
+
{"version":3,"file":"createCanvasAutoLayout.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasAutoLayout.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,iCAAiC,EACtC,KAAK,SAAS,EACd,KAAK,kBAAkB,EACvB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,iCAAiC,CAAC,GAAG,CAAC,CAAC;AAE1D,MAAM,WAAW,6BAA6B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CACnF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACrE,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,6BAA6B,CAAC,KAAK,CAAC;;;IA+BzH,2FAA2F;kBAC7E,OAAO,SAAS,kBAAkB,WAAW,OAAO,EAAE,GAAG,OAAO,EAAE;IAKhF,gFAAgF;0BAC1D,QAAQ,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAIjE,4EAA4E;iBAC/D,MAAM;IAInB;;;OAGG;wBACiB,MAAM;;;;;;;;aAiBsk/F,CAAC;;;;aAAiX,CAAC;cAAwB,CAAC;;;;;;;;;;gBAAqrD,CAAC;;;;EAHnqjG;AAED,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,OAAO,sBAAsB,CAAC,KAAK,CAAC,CAAC,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { type CanvasTokenOptions } from '@pixerate/editor/canvas';
|
|
2
|
+
import type { TokenModeContext, TokenState, TokenStore } from '@pixerate/editor/tokens';
|
|
3
|
+
import type { CanvasNode } from './types.js';
|
|
4
|
+
export interface CreateCanvasTokensOptions<TNode extends CanvasNode = CanvasNode> extends Omit<CanvasTokenOptions, 'modes'> {
|
|
5
|
+
store: TokenStore;
|
|
6
|
+
getNodes: () => TNode[];
|
|
7
|
+
setNodes: (nodes: TNode[]) => void;
|
|
8
|
+
/** Modes for nodes without an explicit mode up their tree, or a getter for reactive modes. */
|
|
9
|
+
modes?: TokenModeContext | (() => TokenModeContext | undefined);
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Headless Svelte 5 rune keeping token-bound node properties resolved. Token edits, undo and
|
|
13
|
+
* redo re-resolve the nodes; deleting a variable detaches the nodes bound to it, keeping their
|
|
14
|
+
* values. Call `resolve()` after changing the nodes yourself (e.g. pasting bound nodes, or
|
|
15
|
+
* switching the root `modes`); `bind` and `setMode` resolve on their own.
|
|
16
|
+
*/
|
|
17
|
+
export declare function createCanvasTokens<TNode extends CanvasNode = CanvasNode>(options: CreateCanvasTokensOptions<TNode>): {
|
|
18
|
+
/** The token store's state (reactive). */
|
|
19
|
+
readonly state: TokenState;
|
|
20
|
+
/** Binds (or with `null` unbinds) a property of the nodes; throws `TokenError` when refused. */
|
|
21
|
+
bind(ids: Iterable<string>, propertyKey: string, variableId: string | null): void;
|
|
22
|
+
/** Sets (or with `null` clears) an explicit mode on frames / groups; descendants follow. */
|
|
23
|
+
setMode(ids: Iterable<string>, collectionId: string, modeId: string | null): void;
|
|
24
|
+
/** The modes a node is in (its own, inherited, then the root `modes`). */
|
|
25
|
+
modesOf(nodeId: string): Record<string, string>;
|
|
26
|
+
/** Re-resolves every bound property (after changing nodes or root modes). */
|
|
27
|
+
resolve: () => void;
|
|
28
|
+
destroy: () => void;
|
|
29
|
+
};
|
|
30
|
+
export type SvelteCanvasTokens = ReturnType<typeof createCanvasTokens>;
|
|
31
|
+
//# sourceMappingURL=createCanvasTokens.svelte.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"createCanvasTokens.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasTokens.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAMN,KAAK,kBAAkB,EACvB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACxF,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAE7C,MAAM,WAAW,yBAAyB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CAAE,SAAQ,IAAI,CAAC,kBAAkB,EAAE,OAAO,CAAC;IAC1H,KAAK,EAAE,UAAU,CAAC;IAClB,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,8FAA8F;IAC9F,KAAK,CAAC,EAAE,gBAAgB,GAAG,CAAC,MAAM,gBAAgB,GAAG,SAAS,CAAC,CAAC;CAChE;AAED;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,yBAAyB,CAAC,KAAK,CAAC;IAoBjH,0CAA0C;;IAI1C,gGAAgG;cACtF,QAAQ,CAAC,MAAM,CAAC,eAAe,MAAM,cAAc,MAAM,GAAG,IAAI;IAG1E,4FAA4F;iBAC/E,QAAQ,CAAC,MAAM,CAAC,gBAAgB,MAAM,UAAU,MAAM,GAAG,IAAI;IAG1E,0EAA0E;oBAC1D,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;IAK/C,6EAA6E;;;EAI9E;AAED,MAAM,MAAM,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { bindCanvasToken, detachTokenBindings, getEffectiveTokenModes, resolveCanvasTokens, setCanvasTokenMode } from '@pixerate/editor/canvas';
|
|
2
|
+
/**
|
|
3
|
+
* Headless Svelte 5 rune keeping token-bound node properties resolved. Token edits, undo and
|
|
4
|
+
* redo re-resolve the nodes; deleting a variable detaches the nodes bound to it, keeping their
|
|
5
|
+
* values. Call `resolve()` after changing the nodes yourself (e.g. pasting bound nodes, or
|
|
6
|
+
* switching the root `modes`); `bind` and `setMode` resolve on their own.
|
|
7
|
+
*/
|
|
8
|
+
export function createCanvasTokens(options) {
|
|
9
|
+
const { store } = options;
|
|
10
|
+
let state = $state.raw(store.getState());
|
|
11
|
+
const opts = () => ({
|
|
12
|
+
modes: typeof options.modes === 'function' ? options.modes() : options.modes,
|
|
13
|
+
properties: options.properties
|
|
14
|
+
});
|
|
15
|
+
const commit = (next) => {
|
|
16
|
+
if (next !== options.getNodes())
|
|
17
|
+
options.setNodes(next);
|
|
18
|
+
};
|
|
19
|
+
const resolve = () => commit(resolveCanvasTokens(options.getNodes(), store.getState(), opts()));
|
|
20
|
+
const unsubscribe = store.subscribe((event) => {
|
|
21
|
+
state = event.state;
|
|
22
|
+
let nodes = options.getNodes();
|
|
23
|
+
if (event.deletedVariableIds.length > 0)
|
|
24
|
+
nodes = detachTokenBindings(nodes, event.previous, event.deletedVariableIds, opts());
|
|
25
|
+
commit(resolveCanvasTokens(nodes, event.state, opts()));
|
|
26
|
+
});
|
|
27
|
+
return {
|
|
28
|
+
/** The token store's state (reactive). */
|
|
29
|
+
get state() {
|
|
30
|
+
return state;
|
|
31
|
+
},
|
|
32
|
+
/** Binds (or with `null` unbinds) a property of the nodes; throws `TokenError` when refused. */
|
|
33
|
+
bind(ids, propertyKey, variableId) {
|
|
34
|
+
commit(bindCanvasToken(options.getNodes(), ids, propertyKey, variableId, store.getState(), opts()));
|
|
35
|
+
},
|
|
36
|
+
/** Sets (or with `null` clears) an explicit mode on frames / groups; descendants follow. */
|
|
37
|
+
setMode(ids, collectionId, modeId) {
|
|
38
|
+
commit(setCanvasTokenMode(options.getNodes(), ids, collectionId, modeId, store.getState(), opts()));
|
|
39
|
+
},
|
|
40
|
+
/** The modes a node is in (its own, inherited, then the root `modes`). */
|
|
41
|
+
modesOf(nodeId) {
|
|
42
|
+
const nodes = options.getNodes();
|
|
43
|
+
const node = nodes.find((n) => n.id === nodeId);
|
|
44
|
+
return node ? getEffectiveTokenModes(node, nodes, store.getState(), opts()) : {};
|
|
45
|
+
},
|
|
46
|
+
/** Re-resolves every bound property (after changing nodes or root modes). */
|
|
47
|
+
resolve,
|
|
48
|
+
destroy: unsubscribe
|
|
49
|
+
};
|
|
50
|
+
}
|
package/dist/canvas/index.d.ts
CHANGED
|
@@ -22,7 +22,12 @@ export { measureBetween, measureToLine, measureSelection, measureLabel, isMeasur
|
|
|
22
22
|
export { alignNodes, distributeNodes, matchSize, reorderNodes, applyNodeUpdates, invertNodeUpdates, lockNodes, unlockNodes, toggleLockNodes, isLocked, getNodeSize, getNodeRect, getAbsolutePosition, readStyleSize, withStyleSize, computeSnapGuides, createGuideIndex, createNodeGuideIndex, snapNodeDrag, findConnectorSnap, nearestHandlePositions, handlePoint, positionToSide, sideToPosition, oppositePosition, CONNECTION_LINE_TYPES, CanvasScenesStore, createCanvasScenesStore, parseCanvasScenes, fitViewportToRect, fitViewportToNodes, matchArrangeShortcut, DEFAULT_ARRANGE_SHORTCUTS, type AlignEdge, type DistributeAxis, type DistributeMode, type SizeDimension, type ZOrderOperation, type CanvasNodeUpdate, type GuideLine, type GuideIndex, type SnapGuidesOptions, type SnapResult, type ConnectorSnap, type ConnectorSnapTarget, type CanvasConnectionLineType, type CanvasScene, type CanvasScenesState, type CanvasViewport, type CanvasArrangeAction, type ArrangeShortcutBinding } from '@pixerate/editor/canvas';
|
|
23
23
|
export { default as ShapeNode } from './ShapeNode.svelte';
|
|
24
24
|
export { combineShapeNodes, canCombineShapeNodes, applyShapeCombination, revertShapeCombination, shapeNodeToPolygon, isShapeNode, getNodeShape, SHAPE_DATA_KEY, SHAPE_NODE_TYPE, SHAPE_OPERATIONS, SHAPE_KINDS, isShapeDescription, shapeToPolygon, getShapeSvg, getShapeRenderData, parseSvgPath, flattenSvgPath, polygonToSvgPath, simplifyRing, polygonBoolean, unionPolygons, intersectPolygons, subtractPolygons, xorPolygons, dividePolygons, polygonArea, multiPolygonArea, multiPolygonBounds, ringSignedArea, pointInRings, pointInMultiPolygon, type ShapeOperation, type ShapeDescription, type ShapeKind, type ShapePaint, type ShapeSize, type ShapeRenderData, type RectShape, type EllipseShape, type RegularPolygonShape, type StarShape, type PathShape, type PathCommand, type FlattenOptions, type PolygonToPathOptions, type CombineShapeNodesOptions, type CombineShapeNodesResult, type CombineShapeNodesRefusal, type ShapeNodePolygonOptions, type MultiPolygon, type PolygonWithHoles, type PolygonRing, type PolygonFillRule, type PolygonOperand, type PolygonInput, type PolygonPiece, type PolygonBooleanOperation, type PolygonBooleanOptions } from '@pixerate/editor/canvas';
|
|
25
|
+
export { offsetShapeNodes, outlineShapeNodeStrokes, canOffsetShapeNodes, canOutlineShapeNodeStrokes, applyShapeReplacement, hasVisibleStroke, shapeToBezierPath, shapeNodeToBezierPath, pathBoolean, unitePaths, intersectPaths, subtractPaths, excludePaths, dividePaths, normalizeBezierPath, bezierPathArea, offsetPath, outlineStroke, strokeOutlineRings, dashContours, toBezierPath, bezierPathToSvg, transformBezierPath, bezierPathBounds, bezierPathSignedArea, bezierPathLength, bezierPathPointAtLength, pointInBezierPath, distanceToBezierPath, countPathSegments, type BezierCommand, type BezierPath, type BezierPathInput, type PathOperand, type PathOperandInput, type PathOpsOptions, type PathBooleanResult, type DividePathsResult, type StrokeJoin, type StrokeCap, type OutlineStrokeOptions, type OffsetPathOptions, type OffsetShapeNodesOptions, type OutlineShapeStrokesOptions, type ShapePathEditResult, type ShapePathEditRefusal, type ShapePathEditOperation } from '@pixerate/editor/canvas';
|
|
25
26
|
export { realClock, ManualClock, layoutBounds, canvasHeight, estimateCanvasHeight, blendLayout, connectedOnly, type Clock, type CanvasHeightOptions } from '@pixerate/editor/canvas';
|
|
26
27
|
export { layoutFrame, layoutAll, layoutUp, layoutUpMany, applyConstraints, getAutoLayout, getChildLayout, getLayoutSizing, getAutoLayoutGrid, getAutoLayoutInsertTarget, getFlowChildren, getLayoutParent, isAutoLayoutFrame, makeSizingCoherent, moveLayoutChild, mergeNodeUpdates, relayoutUpdates, resolvePadding, clampLayoutSize, createCanvasAutoLayoutController, AUTO_LAYOUT_DATA_KEY, CHILD_LAYOUT_DATA_KEY, type AutoLayout, type AutoLayoutChild, type AutoLayoutMode, type AutoLayoutSizing, type AutoLayoutSizingPair, type AutoLayoutSize, type AutoLayoutAlignMain, type AutoLayoutAlignCross, type AutoLayoutAlignContent, type AutoLayoutPadding, type AutoLayoutGrid, type AutoLayoutGridTrack, type AutoLayoutGridArea, type AutoLayoutGridCell, type AutoLayoutGridGeometry, type AutoLayoutCellAlign, type AutoLayoutConstraints, type AutoLayoutHorizontalConstraint, type AutoLayoutVerticalConstraint, type AutoLayoutMeasure, type AutoLayoutOptions, type AutoLayoutInsertTarget, type CanvasAutoLayoutController, type CanvasAutoLayoutControllerOptions } from '@pixerate/editor/canvas';
|
|
27
28
|
export { createCanvasAutoLayout, type CanvasAutoLayout, type CreateCanvasAutoLayoutOptions } from './createCanvasAutoLayout.svelte.js';
|
|
29
|
+
export { createCanvasTokens, type CreateCanvasTokensOptions, type SvelteCanvasTokens } from './createCanvasTokens.svelte.js';
|
|
30
|
+
export { default as TokenBindingPicker } from './TokenBindingPicker.svelte';
|
|
31
|
+
export { default as TokenModeSwitcher } from './TokenModeSwitcher.svelte';
|
|
32
|
+
export { bindCanvasToken, setCanvasTokenMode, resolveCanvasTokens, detachTokenBindings, pruneCanvasTokenModes, inspectNodeTokens, getNodeTokenBindings, getNodeTokenModes, getEffectiveTokenModes, getBindableTokenProperties, getCanvasTokenProperty, getTokenPropertyScope, getTokensForProperty, readNodeStyleProperty, writeNodeStyleProperty, CANVAS_TOKEN_PROPERTIES, TOKEN_BINDINGS_DATA_KEY, TOKEN_MODES_DATA_KEY, type CanvasTokenProperty, type CanvasTokenOptions, type CanvasTokenBindingInfo } from '@pixerate/editor/canvas';
|
|
28
33
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/canvas/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/canvas/index.ts"],"names":[],"mappings":"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"}
|
package/dist/canvas/index.js
CHANGED
|
@@ -41,8 +41,15 @@ export { alignNodes, distributeNodes, matchSize, reorderNodes, applyNodeUpdates,
|
|
|
41
41
|
export { default as ShapeNode } from './ShapeNode.svelte';
|
|
42
42
|
// Shape nodes and boolean operations (Unite / Intersect / Subtract / Exclude / Divide)
|
|
43
43
|
export { combineShapeNodes, canCombineShapeNodes, applyShapeCombination, revertShapeCombination, shapeNodeToPolygon, isShapeNode, getNodeShape, SHAPE_DATA_KEY, SHAPE_NODE_TYPE, SHAPE_OPERATIONS, SHAPE_KINDS, isShapeDescription, shapeToPolygon, getShapeSvg, getShapeRenderData, parseSvgPath, flattenSvgPath, polygonToSvgPath, simplifyRing, polygonBoolean, unionPolygons, intersectPolygons, subtractPolygons, xorPolygons, dividePolygons, polygonArea, multiPolygonArea, multiPolygonBounds, ringSignedArea, pointInRings, pointInMultiPolygon } from '@pixerate/editor/canvas';
|
|
44
|
+
// Curve-preserving path operations, Offset Path and Outline Stroke
|
|
45
|
+
export { offsetShapeNodes, outlineShapeNodeStrokes, canOffsetShapeNodes, canOutlineShapeNodeStrokes, applyShapeReplacement, hasVisibleStroke, shapeToBezierPath, shapeNodeToBezierPath, pathBoolean, unitePaths, intersectPaths, subtractPaths, excludePaths, dividePaths, normalizeBezierPath, bezierPathArea, offsetPath, outlineStroke, strokeOutlineRings, dashContours, toBezierPath, bezierPathToSvg, transformBezierPath, bezierPathBounds, bezierPathSignedArea, bezierPathLength, bezierPathPointAtLength, pointInBezierPath, distanceToBezierPath, countPathSegments } from '@pixerate/editor/canvas';
|
|
44
46
|
// Clock and view helpers from core
|
|
45
47
|
export { realClock, ManualClock, layoutBounds, canvasHeight, estimateCanvasHeight, blendLayout, connectedOnly } from '@pixerate/editor/canvas';
|
|
46
48
|
// Auto layout (Figma-style stacks, wrap, grid, hug / fill / fixed) and constraints
|
|
47
49
|
export { layoutFrame, layoutAll, layoutUp, layoutUpMany, applyConstraints, getAutoLayout, getChildLayout, getLayoutSizing, getAutoLayoutGrid, getAutoLayoutInsertTarget, getFlowChildren, getLayoutParent, isAutoLayoutFrame, makeSizingCoherent, moveLayoutChild, mergeNodeUpdates, relayoutUpdates, resolvePadding, clampLayoutSize, createCanvasAutoLayoutController, AUTO_LAYOUT_DATA_KEY, CHILD_LAYOUT_DATA_KEY } from '@pixerate/editor/canvas';
|
|
48
50
|
export { createCanvasAutoLayout } from './createCanvasAutoLayout.svelte.js';
|
|
51
|
+
// Design tokens: bindings, per-frame modes and inspector controls
|
|
52
|
+
export { createCanvasTokens } from './createCanvasTokens.svelte.js';
|
|
53
|
+
export { default as TokenBindingPicker } from './TokenBindingPicker.svelte';
|
|
54
|
+
export { default as TokenModeSwitcher } from './TokenModeSwitcher.svelte';
|
|
55
|
+
export { bindCanvasToken, setCanvasTokenMode, resolveCanvasTokens, detachTokenBindings, pruneCanvasTokenModes, inspectNodeTokens, getNodeTokenBindings, getNodeTokenModes, getEffectiveTokenModes, getBindableTokenProperties, getCanvasTokenProperty, getTokenPropertyScope, getTokensForProperty, readNodeStyleProperty, writeNodeStyleProperty, CANVAS_TOKEN_PROPERTIES, TOKEN_BINDINGS_DATA_KEY, TOKEN_MODES_DATA_KEY } from '@pixerate/editor/canvas';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { Editor } from "@tiptap/core";
|
|
2
|
-
import { type FileImportControllerOptions } from "@pixerate/editor";
|
|
2
|
+
import { type FileImportControllerOptions, type ImportStructureSummary } from "@pixerate/editor";
|
|
3
3
|
/**
|
|
4
4
|
* Imports markdown, HTML, plain-text and RTF files (or anything registered
|
|
5
5
|
* with `registerImportAdapter` for the `document` target) into an editor,
|
|
@@ -13,6 +13,13 @@ export declare function createFileImport(getEditor: () => Editor | null | undefi
|
|
|
13
13
|
readonly isImporting: boolean;
|
|
14
14
|
readonly error: Error | null;
|
|
15
15
|
readonly lastOutcomes: import("@pixerate/editor").ImportOutcome<import("@pixerate/editor").DocumentImport>[];
|
|
16
|
+
/**
|
|
17
|
+
* Structures detected in the last import (headings, lists, tables,
|
|
18
|
+
* columns), or `null` when no adapter reported any (only structure-aware
|
|
19
|
+
* adapters such as PDF do). Turn PDF detection off with
|
|
20
|
+
* `setOptions({ adapterOptions: { pdf: { structure: false } } })`.
|
|
21
|
+
*/
|
|
22
|
+
readonly structureSummary: ImportStructureSummary | null;
|
|
16
23
|
/** Value for `<input type="file" accept={…}>`. */
|
|
17
24
|
readonly accept: string;
|
|
18
25
|
/** Opens the browser file picker and imports the chosen files at the selection. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fileImport.svelte.d.ts","sourceRoot":"","sources":["../src/fileImport.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,
|
|
1
|
+
{"version":3,"file":"fileImport.svelte.d.ts","sourceRoot":"","sources":["../src/fileImport.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAGL,KAAK,2BAA2B,EAEhC,KAAK,sBAAsB,EAC5B,MAAM,kBAAkB,CAAC;AAE1B;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAC9B,SAAS,EAAE,MAAM,MAAM,GAAG,IAAI,GAAG,SAAS,EAC1C,OAAO,GAAE,2BAAgC;;;;IAsBvC;;;;;OAKG;+BACqB,sBAAsB,GAAG,IAAI;IAGrD,kDAAkD;;IAIlD,mFAAmF;;IAEnF,0FAA0F;;uBAEvE,2BAA2B;EAEjD;AAED,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC"}
|