@instructure/platform-block-content-editor 3.3.1 → 3.5.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 +11 -1
- package/dist/editor/BlockContentEditor.d.ts +9 -1
- package/dist/editor/BlockContentEditor.d.ts.map +1 -1
- package/dist/editor/ai/BlockAIMenu.d.ts +16 -5
- package/dist/editor/ai/BlockAIMenu.d.ts.map +1 -1
- package/dist/editor/ai/aiMenuStyles.d.ts +12 -7
- package/dist/editor/ai/aiMenuStyles.d.ts.map +1 -1
- package/dist/editor/canvas/GridItemChild.d.ts.map +1 -1
- package/dist/editor/sidebar/form/fieldRenderers.d.ts.map +1 -1
- package/dist/editor/sidebar/form/uploaders/VideoUploader.d.ts.map +1 -1
- package/dist/editor/sidebar/sidebarTranslations.d.ts +2 -0
- package/dist/editor/sidebar/sidebarTranslations.d.ts.map +1 -1
- package/dist/editor/sidebar/tray/BlockTray.d.ts +6 -1
- package/dist/editor/sidebar/tray/BlockTray.d.ts.map +1 -1
- package/dist/editor/sidebar/tray/SharedTrayComponents.d.ts +19 -6
- package/dist/editor/sidebar/tray/SharedTrayComponents.d.ts.map +1 -1
- package/dist/editor/sidebar/tray/TrayBlockAIButton.d.ts +17 -0
- package/dist/editor/sidebar/tray/TrayBlockAIButton.d.ts.map +1 -0
- package/dist/editor/sidebar/tray/blockDefinitions.d.ts.map +1 -1
- package/dist/editor/sidebar/useDesignerSelectionFocus.d.ts +17 -3
- package/dist/editor/sidebar/useDesignerSelectionFocus.d.ts.map +1 -1
- package/dist/index.js +4517 -4414
- package/locales/en.json +3 -2
- package/package.json +7 -3
package/README.md
CHANGED
|
@@ -84,6 +84,16 @@ registry-driven insertion trays, hoists a single DnD context so blocks can be **
|
|
|
84
84
|
tray onto the canvas, coordinates canvas↔panel selection focus, and routes a selected block to its
|
|
85
85
|
settings form. It is **authoring-only** — see Preview below.
|
|
86
86
|
|
|
87
|
+
**RCE overlays and selection.** If the RCE you inject (via `RichTextEditorContext`, below) renders
|
|
88
|
+
overlays that portal outside the editor and take focus — the Canvas RCE's dialogs, trays, and menus
|
|
89
|
+
(word count, accessibility checker, content tray, keyboard shortcuts) all mount to `document.body` —
|
|
90
|
+
pass `isEditorOverlayOpen` to `BlockContentEditor`: a predicate that returns true while one is open.
|
|
91
|
+
Without it, opening one reads as "focus left the editor" and deselects the block, unmounting its
|
|
92
|
+
settings form (and your RCE). Only the host knows its RCE's overlay DOM, so the host owns the check
|
|
93
|
+
— the Canvas host queries canvas-rce's `[data-mce-component]` marker plus TinyMCE's
|
|
94
|
+
`.tox-menu` / `.tox-dialog` / `.tox-pop` floating-UI classes. A hand-composed sidebar passes the
|
|
95
|
+
same predicate to `useDesignerSelectionFocus`.
|
|
96
|
+
|
|
87
97
|
### Or compose the primitives yourself
|
|
88
98
|
|
|
89
99
|
Every arrangement above is reproducible. Wrap your own layout in one `GridDndProvider` and drop a
|
|
@@ -138,7 +148,7 @@ Blocks and the editor read only from context; the host provides the implementati
|
|
|
138
148
|
| `BrandColorContext` | the brand color (hex/`rgb()`), or `undefined` |
|
|
139
149
|
| `BlockTranslationsProvider` | resolved strings per block + designer chrome (bundled English is the fallback) |
|
|
140
150
|
| `RichTextRendererContext` | a renderer for RCE-authored HTML (read path); unset → sanitized fallback |
|
|
141
|
-
| `RichTextEditorContext` | the RCE editor component (write path); unset → plain `TextArea` |
|
|
151
|
+
| `RichTextEditorContext` | the RCE editor component (write path); unset → plain `TextArea`. An RCE with overlays that portal outside the editor also needs `BlockContentEditor`'s `isEditorOverlayOpen` (see Write path) |
|
|
142
152
|
| `AIActionContext` | the AI executor; **presence enables** the block-level AI, unset → hidden |
|
|
143
153
|
| `BlockEditorApiProvider` | host data hooks — image/video/widget URLs and the settings-form file upload/delete |
|
|
144
154
|
|
|
@@ -27,6 +27,14 @@ export interface BlockContentEditorProps<HostToolId extends string = never> {
|
|
|
27
27
|
height?: number | string;
|
|
28
28
|
/** Shows the sidebar's rail collapse/expand toggle once a tool has been opened. */
|
|
29
29
|
hasExpandPanelButton?: boolean;
|
|
30
|
+
/**
|
|
31
|
+
* Reports whether a host rich-text-editor overlay (a dialog, tray, or menu the RCE portals to
|
|
32
|
+
* `document.body` and gives focus to) is open. While it returns true, the canvas↔panel selection
|
|
33
|
+
* coordination holds the block rather than reading the overlay's focus-grab as "left the editor"
|
|
34
|
+
* and deselecting it. Wire it to the host's RCE overlay state. Without it, opening such an overlay
|
|
35
|
+
* deselects the block and unmounts its settings form. See `useDesignerSelectionFocus`.
|
|
36
|
+
*/
|
|
37
|
+
isEditorOverlayOpen?: () => boolean;
|
|
30
38
|
}
|
|
31
39
|
/**
|
|
32
40
|
* The authoring editor: the tool-panel sidebar over the drag-and-drop canvas, wired to the
|
|
@@ -39,5 +47,5 @@ export interface BlockContentEditorProps<HostToolId extends string = never> {
|
|
|
39
47
|
* sources reach the canvas droppables. It is authoring-only — the student preview
|
|
40
48
|
* (`PreviewArea`) is a separate export the host presents however it wants.
|
|
41
49
|
*/
|
|
42
|
-
export declare function BlockContentEditor<HostToolId extends string = never>({ engine, registry, tools: hostTools, builtInToolIds, initialToolId, height, hasExpandPanelButton, }: BlockContentEditorProps<HostToolId>): import("react/jsx-runtime").JSX.Element;
|
|
50
|
+
export declare function BlockContentEditor<HostToolId extends string = never>({ engine, registry, tools: hostTools, builtInToolIds, initialToolId, height, hasExpandPanelButton, isEditorOverlayOpen, }: BlockContentEditorProps<HostToolId>): import("react/jsx-runtime").JSX.Element;
|
|
43
51
|
//# sourceMappingURL=BlockContentEditor.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlockContentEditor.d.ts","sourceRoot":"","sources":["../../src/editor/BlockContentEditor.tsx"],"names":[],"mappings":"AA4BA,OAAO,EAAE,KAAK,aAAa,EAAqB,MAAM,aAAa,CAAA;AAOnE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAQjD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AAE5E,6FAA6F;AAC7F,eAAO,MAAM,iBAAiB,+DAAgE,CAAA;AAC9F,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAA;AAmC9D,MAAM,WAAW,uBAAuB,CAAC,UAAU,SAAS,MAAM,GAAG,KAAK;IACxE;+FAC2F;IAC3F,MAAM,EAAE,yBAAyB,CAAA;IACjC,qGAAqG;IACrG,QAAQ,EAAE,aAAa,CAAA;IACvB;;;;wEAIoE;IACpE,KAAK,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC,EAAE,CAAA;IAC1B;;sCAEkC;IAClC,cAAc,CAAC,EAAE,aAAa,EAAE,CAAA;IAChC;qDACiD;IACjD,aAAa,CAAC,EAAE,aAAa,GAAG,UAAU,CAAA;IAC1C,yEAAyE;IACzE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,mFAAmF;IACnF,oBAAoB,CAAC,EAAE,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"BlockContentEditor.d.ts","sourceRoot":"","sources":["../../src/editor/BlockContentEditor.tsx"],"names":[],"mappings":"AA4BA,OAAO,EAAE,KAAK,aAAa,EAAqB,MAAM,aAAa,CAAA;AAOnE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAQjD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AAE5E,6FAA6F;AAC7F,eAAO,MAAM,iBAAiB,+DAAgE,CAAA;AAC9F,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAA;AAmC9D,MAAM,WAAW,uBAAuB,CAAC,UAAU,SAAS,MAAM,GAAG,KAAK;IACxE;+FAC2F;IAC3F,MAAM,EAAE,yBAAyB,CAAA;IACjC,qGAAqG;IACrG,QAAQ,EAAE,aAAa,CAAA;IACvB;;;;wEAIoE;IACpE,KAAK,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC,EAAE,CAAA;IAC1B;;sCAEkC;IAClC,cAAc,CAAC,EAAE,aAAa,EAAE,CAAA;IAChC;qDACiD;IACjD,aAAa,CAAC,EAAE,aAAa,GAAG,UAAU,CAAA;IAC1C,yEAAyE;IACzE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,mFAAmF;IACnF,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAA;CACpC;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAAC,UAAU,SAAS,MAAM,GAAG,KAAK,EAAE,EACpE,MAAM,EACN,QAAQ,EACR,KAAK,EAAE,SAAS,EAChB,cAAuC,EACvC,aAAa,EACb,MAAM,EACN,oBAAoB,EACpB,mBAAmB,GACpB,EAAE,uBAAuB,CAAC,UAAU,CAAC,2CAgQrC"}
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { Popover } from '@instructure/ui-popover';
|
|
2
|
+
import { ComponentProps } from 'react';
|
|
1
3
|
import { BlockRegistry } from '../../registry';
|
|
2
4
|
export interface BlockAIMenuProps {
|
|
3
5
|
componentType: string;
|
|
@@ -31,11 +33,20 @@ export interface BlockAIMenuProps {
|
|
|
31
33
|
*/
|
|
32
34
|
targetLabel?: string;
|
|
33
35
|
/**
|
|
34
|
-
* Surface the trigger sits on. `dark` (the default) is the canvas item toolbar's bar
|
|
35
|
-
*
|
|
36
|
-
*
|
|
36
|
+
* Surface the trigger sits on. `dark` (the default) is the canvas item toolbar's bar (white
|
|
37
|
+
* icon, violet swatch when open); `light` is the sidebar panel header (gradient icon, gradient
|
|
38
|
+
* outline when open); `card` is an insertion-tray block card (gradient icon, white highlight
|
|
39
|
+
* when open).
|
|
37
40
|
*/
|
|
38
|
-
triggerSurface?: 'dark' | 'light';
|
|
41
|
+
triggerSurface?: 'dark' | 'light' | 'card';
|
|
42
|
+
/**
|
|
43
|
+
* Overrides the trigger's accessible label. Defaults to "AI assist for <target>". Supply this
|
|
44
|
+
* where that reads wrong — e.g. an insertion-tray card, which generates a *new* block rather
|
|
45
|
+
* than assisting an existing one, and would otherwise collide with the placed block's trigger.
|
|
46
|
+
*/
|
|
47
|
+
triggerLabel?: string;
|
|
48
|
+
/** Where the menu pops relative to its trigger. Defaults to `bottom start`. */
|
|
49
|
+
placement?: ComponentProps<typeof Popover>['placement'];
|
|
39
50
|
}
|
|
40
|
-
export declare const BlockAIMenu: ({ componentType, componentData, componentId, isOpen, onOpen, onApply, onClose, componentRegistry, onActiveChange, instructionScope, isEmpty, targetLabel, triggerSurface, }: BlockAIMenuProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
51
|
+
export declare const BlockAIMenu: ({ componentType, componentData, componentId, isOpen, onOpen, onApply, onClose, componentRegistry, onActiveChange, instructionScope, isEmpty, targetLabel, triggerSurface, triggerLabel: triggerLabelProp, placement, }: BlockAIMenuProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
41
52
|
//# sourceMappingURL=BlockAIMenu.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlockAIMenu.d.ts","sourceRoot":"","sources":["../../../src/editor/ai/BlockAIMenu.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BlockAIMenu.d.ts","sourceRoot":"","sources":["../../../src/editor/ai/BlockAIMenu.tsx"],"names":[],"mappings":"AA4BA,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAA;AACjD,OAAO,EAAE,KAAK,cAAc,EAA4C,MAAM,OAAO,CAAA;AAErF,OAAO,KAAK,EAAE,aAAa,EAA4B,MAAM,gBAAgB,CAAA;AAS7E,MAAM,WAAW,gBAAgB;IAC/B,aAAa,EAAE,MAAM,CAAA;IACrB,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACtC,mFAAmF;IACnF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,EAAE,OAAO,CAAA;IACf,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,OAAO,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAA;IACpD,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,iGAAiG;IACjG,iBAAiB,EAAE,aAAa,CAAA;IAChC,kGAAkG;IAClG,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IAC1C;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAA;IAC1C;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,+EAA+E;IAC/E,SAAS,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;CACxD;AAED,eAAO,MAAM,WAAW,GAAI,wNAgBzB,gBAAgB,mDAiMlB,CAAA"}
|
|
@@ -36,17 +36,22 @@ export declare const AI_CLASS: {
|
|
|
36
36
|
/** Wrapper around the menu trigger when it sits on a light surface (the sidebar panel header). */
|
|
37
37
|
readonly lightTrigger: "bce-ai-menu-light-trigger";
|
|
38
38
|
readonly lightTriggerOpen: "bce-ai-menu-light-trigger-open";
|
|
39
|
+
/** Wrapper around the menu trigger when it sits on the dark canvas item toolbar. */
|
|
40
|
+
readonly darkTrigger: "bce-ai-menu-dark-trigger";
|
|
41
|
+
readonly darkTriggerOpen: "bce-ai-menu-dark-trigger-open";
|
|
42
|
+
/** Wrapper around the menu trigger when it sits on an insertion-tray block card. */
|
|
43
|
+
readonly cardTrigger: "bce-ai-menu-card-trigger";
|
|
44
|
+
readonly cardTriggerOpen: "bce-ai-menu-card-trigger-open";
|
|
39
45
|
};
|
|
40
46
|
/** Mounts the AI menu chrome stylesheet once, under the menu popover. */
|
|
41
47
|
export declare function AIMenuStyles(): import("react/jsx-runtime").JSX.Element;
|
|
42
48
|
/**
|
|
43
|
-
* The menu trigger
|
|
44
|
-
* gradient icon; open, that icon sits in a rounded square
|
|
45
|
-
* gradient over a light tint of it.
|
|
46
|
-
*
|
|
47
|
-
*
|
|
48
|
-
*
|
|
49
|
-
* reads as a container, so it swaps a monochrome icon for a colored one instead.
|
|
49
|
+
* The menu trigger highlight, for both surfaces it sits on. On the **light** sidebar panel
|
|
50
|
+
* header: closed, it is the bare gradient icon; open, that icon sits in a rounded square
|
|
51
|
+
* outlined in the same violet→sea gradient over a light tint of it. On the **dark** canvas item
|
|
52
|
+
* toolbar: the icon stays white (monochrome, matching the toolbar's other actions) in both
|
|
53
|
+
* states, and the open state fills a rounded violet swatch behind it. Either way the icon itself
|
|
54
|
+
* is unchanged between states — the highlight is what moves.
|
|
50
55
|
*
|
|
51
56
|
* Separate from `AIMenuStyles` because that stylesheet mounts with the *open* popover's content,
|
|
52
57
|
* and this has to be present while the trigger is merely rendered. Kept out of `AIMenuStyles`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"aiMenuStyles.d.ts","sourceRoot":"","sources":["../../../src/editor/ai/aiMenuStyles.tsx"],"names":[],"mappings":"AAoBA;;;;;;;GAOG;AAEH;;;;;GAKG;AACH,eAAO,MAAM,cAAc,YAAY,CAAA;AAEvC;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,WAAW,CAAA;AAEzC,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;IAcnB,kGAAkG;;;
|
|
1
|
+
{"version":3,"file":"aiMenuStyles.d.ts","sourceRoot":"","sources":["../../../src/editor/ai/aiMenuStyles.tsx"],"names":[],"mappings":"AAoBA;;;;;;;GAOG;AAEH;;;;;GAKG;AACH,eAAO,MAAM,cAAc,YAAY,CAAA;AAEvC;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,WAAW,CAAA;AAEzC,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;IAcnB,kGAAkG;;;IAGlG,oFAAoF;;;IAGpF,oFAAoF;;;CAG5E,CAAA;AAyBV,yEAAyE;AACzE,wBAAgB,YAAY,4CA8J3B;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,eAAe,4CAkF9B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GridItemChild.d.ts","sourceRoot":"","sources":["../../../src/editor/canvas/GridItemChild.tsx"],"names":[],"mappings":"AA+BA,OAAO,EAAc,KAAK,SAAS,EAAY,MAAM,OAAO,CAAA;AAG5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAEnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAA;AAInE,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAA;IACnB,aAAa,EAAE,MAAM,CAAA;IACrB,wDAAwD;IACxD,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,sFAAsF;IACtF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,qFAAqF;IACrF,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,6EAA6E;IAC7E,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,WAAW,EAAE,CAAC,CAAC,EAAE;QAAE,eAAe,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAA;IACzD,gBAAgB,EAAE,CAAC,CAAC,EAAE;QAAE,eAAe,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAA;IAC9D,6EAA6E;IAC7E,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACvC,wDAAwD;IACxD,SAAS,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAA;IACvD,iGAAiG;IACjG,iBAAiB,CAAC,EAAE,aAAa,CAAA;IACjC,kDAAkD;IAClD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,8DAA8D;IAC9D,eAAe,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACzC;;;OAGG;IACH,aAAa,CAAC,EAAE,kBAAkB,EAAE,CAAA;IACpC,mFAAmF;IACnF,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,mEAAmE;IACnE,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B;AAED,eAAO,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"GridItemChild.d.ts","sourceRoot":"","sources":["../../../src/editor/canvas/GridItemChild.tsx"],"names":[],"mappings":"AA+BA,OAAO,EAAc,KAAK,SAAS,EAAY,MAAM,OAAO,CAAA;AAG5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAEnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAA;AAInE,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAA;IACnB,aAAa,EAAE,MAAM,CAAA;IACrB,wDAAwD;IACxD,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,sFAAsF;IACtF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,qFAAqF;IACrF,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,6EAA6E;IAC7E,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,WAAW,EAAE,CAAC,CAAC,EAAE;QAAE,eAAe,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAA;IACzD,gBAAgB,EAAE,CAAC,CAAC,EAAE;QAAE,eAAe,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAA;IAC9D,6EAA6E;IAC7E,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACvC,wDAAwD;IACxD,SAAS,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAA;IACvD,iGAAiG;IACjG,iBAAiB,CAAC,EAAE,aAAa,CAAA;IACjC,kDAAkD;IAClD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,8DAA8D;IAC9D,eAAe,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACzC;;;OAGG;IACH,aAAa,CAAC,EAAE,kBAAkB,EAAE,CAAA;IACpC,mFAAmF;IACnF,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,mEAAmE;IACnE,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B;AAED,eAAO,MAAM,cAAc,gHAqJ1B,CAAA;AAID,eAAe,cAAc,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fieldRenderers.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/form/fieldRenderers.tsx"],"names":[],"mappings":"AAoCA,OAAO,EAAE,KAAK,iBAAiB,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAEvE,OAAO,EAAE,KAAK,aAAa,EAA2C,MAAM,sBAAsB,CAAA;AAQlG,YAAY,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;
|
|
1
|
+
{"version":3,"file":"fieldRenderers.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/form/fieldRenderers.tsx"],"names":[],"mappings":"AAoCA,OAAO,EAAE,KAAK,iBAAiB,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAEvE,OAAO,EAAE,KAAK,aAAa,EAA2C,MAAM,sBAAsB,CAAA;AAQlG,YAAY,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AA+gB3E,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,aAAa,EAAE,aAAa,CAiBtE,CAAA;AAED,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,aAAa,EAAE,QAAQ,CAAC,EAAE,iBAAiB,GAAG,aAAa,CAKjG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoUploader.d.ts","sourceRoot":"","sources":["../../../../../src/editor/sidebar/form/uploaders/VideoUploader.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAE,KAAK,OAAO,EAAc,KAAK,WAAW,EAAiB,MAAM,iBAAiB,CAAA;AAS3F,UAAU,kBAAkB;IAC1B,OAAO,EAAE,OAAO,CAAC,WAAW,CAAC,CAAA;IAC7B,aAAa,EAAE,MAAM,IAAI,CAAA;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"VideoUploader.d.ts","sourceRoot":"","sources":["../../../../../src/editor/sidebar/form/uploaders/VideoUploader.tsx"],"names":[],"mappings":"AAwBA,OAAO,EAAE,KAAK,OAAO,EAAc,KAAK,WAAW,EAAiB,MAAM,iBAAiB,CAAA;AAS3F,UAAU,kBAAkB;IAC1B,OAAO,EAAE,OAAO,CAAC,WAAW,CAAC,CAAA;IAC7B,aAAa,EAAE,MAAM,IAAI,CAAA;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,EAAE,kBAAkB,2CAqF3E"}
|
|
@@ -43,6 +43,8 @@ export interface DesignerSidebarTranslations {
|
|
|
43
43
|
interactiveBlocksIntro: string;
|
|
44
44
|
/** Block-row add-button screen-reader label; `%{name}` is the block's label. */
|
|
45
45
|
addBlock: string;
|
|
46
|
+
/** Block-card AI-button screen-reader label; opens a prompt to generate the block. `%{name}` is the block's label. */
|
|
47
|
+
generateBlockWithAi: string;
|
|
46
48
|
/** Skip link that jumps focus to the selected block on the canvas. */
|
|
47
49
|
skipToSelectedComponent: string;
|
|
48
50
|
/** Placeholder copy in the (not yet built) templates tray panel. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidebarTranslations.d.ts","sourceRoot":"","sources":["../../../src/editor/sidebar/sidebarTranslations.ts"],"names":[],"mappings":"AAkBA;;;;;;;;;GASG;AACH,MAAM,WAAW,2BAA2B;IAC1C,sDAAsD;IACtD,OAAO,EAAE,MAAM,CAAA;IACf,gEAAgE;IAChE,QAAQ,EAAE,MAAM,CAAA;IAChB,+DAA+D;IAC/D,MAAM,EAAE,MAAM,CAAA;IACd,wEAAwE;IACxE,QAAQ,EAAE,MAAM,CAAA;IAChB,6EAA6E;IAC7E,WAAW,EAAE,MAAM,CAAA;IACnB,0EAA0E;IAC1E,aAAa,EAAE,MAAM,CAAA;IACrB,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAA;IACZ,wFAAwF;IACxF,UAAU,EAAE,MAAM,CAAA;IAClB,8CAA8C;IAC9C,eAAe,EAAE,MAAM,CAAA;IACvB,kEAAkE;IAClE,eAAe,EAAE,MAAM,CAAA;IACvB,uDAAuD;IACvD,qBAAqB,EAAE,MAAM,CAAA;IAC7B,kDAAkD;IAClD,gBAAgB,EAAE,MAAM,CAAA;IACxB,+CAA+C;IAC/C,aAAa,EAAE,MAAM,CAAA;IACrB,8CAA8C;IAC9C,gBAAgB,EAAE,MAAM,CAAA;IACxB,+CAA+C;IAC/C,iBAAiB,EAAE,MAAM,CAAA;IACzB,oDAAoD;IACpD,sBAAsB,EAAE,MAAM,CAAA;IAC9B,gFAAgF;IAChF,QAAQ,EAAE,MAAM,CAAA;IAChB,sEAAsE;IACtE,uBAAuB,EAAE,MAAM,CAAA;IAC/B,oEAAoE;IACpE,mBAAmB,EAAE,MAAM,CAAA;CAC5B;AAED,iFAAiF;AACjF,eAAO,MAAM,sBAAsB,EAAE,
|
|
1
|
+
{"version":3,"file":"sidebarTranslations.d.ts","sourceRoot":"","sources":["../../../src/editor/sidebar/sidebarTranslations.ts"],"names":[],"mappings":"AAkBA;;;;;;;;;GASG;AACH,MAAM,WAAW,2BAA2B;IAC1C,sDAAsD;IACtD,OAAO,EAAE,MAAM,CAAA;IACf,gEAAgE;IAChE,QAAQ,EAAE,MAAM,CAAA;IAChB,+DAA+D;IAC/D,MAAM,EAAE,MAAM,CAAA;IACd,wEAAwE;IACxE,QAAQ,EAAE,MAAM,CAAA;IAChB,6EAA6E;IAC7E,WAAW,EAAE,MAAM,CAAA;IACnB,0EAA0E;IAC1E,aAAa,EAAE,MAAM,CAAA;IACrB,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAA;IACZ,wFAAwF;IACxF,UAAU,EAAE,MAAM,CAAA;IAClB,8CAA8C;IAC9C,eAAe,EAAE,MAAM,CAAA;IACvB,kEAAkE;IAClE,eAAe,EAAE,MAAM,CAAA;IACvB,uDAAuD;IACvD,qBAAqB,EAAE,MAAM,CAAA;IAC7B,kDAAkD;IAClD,gBAAgB,EAAE,MAAM,CAAA;IACxB,+CAA+C;IAC/C,aAAa,EAAE,MAAM,CAAA;IACrB,8CAA8C;IAC9C,gBAAgB,EAAE,MAAM,CAAA;IACxB,+CAA+C;IAC/C,iBAAiB,EAAE,MAAM,CAAA;IACzB,oDAAoD;IACpD,sBAAsB,EAAE,MAAM,CAAA;IAC9B,gFAAgF;IAChF,QAAQ,EAAE,MAAM,CAAA;IAChB,sHAAsH;IACtH,mBAAmB,EAAE,MAAM,CAAA;IAC3B,sEAAsE;IACtE,uBAAuB,EAAE,MAAM,CAAA;IAC/B,oEAAoE;IACpE,mBAAmB,EAAE,MAAM,CAAA;CAC5B;AAED,iFAAiF;AACjF,eAAO,MAAM,sBAAsB,EAAE,2BAqBpC,CAAA"}
|
|
@@ -9,6 +9,11 @@ export interface BlockTrayProps {
|
|
|
9
9
|
registry: BlockRegistry;
|
|
10
10
|
/** Insert a block by wire name (click-to-add; drag-and-drop goes through the DnD context). */
|
|
11
11
|
onAddComponent: (componentName: string) => void;
|
|
12
|
+
/**
|
|
13
|
+
* Insert a block by wire name with AI-generated props, once the author accepts a result from a
|
|
14
|
+
* card's generate prompt. Omitted hides each card's AI button (nothing to insert into).
|
|
15
|
+
*/
|
|
16
|
+
onAiGenerate?: (componentName: string, props: Record<string, unknown>) => void;
|
|
12
17
|
/** The selected block's type — when set with an id and a non-`main` view, shows the form. */
|
|
13
18
|
selectedComponentType?: string;
|
|
14
19
|
selectedComponentId?: string | null;
|
|
@@ -25,6 +30,6 @@ interface BlockTrayInternalProps extends BlockTrayProps {
|
|
|
25
30
|
* stays mounted across its own sub-navigations (item edit, manage layer), which is why the
|
|
26
31
|
* swap keys on `selectedComponentId` and hinges on the nav view rather than remounting.
|
|
27
32
|
*/
|
|
28
|
-
export declare function BlockTray({ registry, onAddComponent, selectedComponentType, selectedComponentId, selectedComponentData, onComponentChange, category, intro, }: BlockTrayInternalProps): import("react/jsx-runtime").JSX.Element;
|
|
33
|
+
export declare function BlockTray({ registry, onAddComponent, onAiGenerate, selectedComponentType, selectedComponentId, selectedComponentData, onComponentChange, category, intro, }: BlockTrayInternalProps): import("react/jsx-runtime").JSX.Element;
|
|
29
34
|
export {};
|
|
30
35
|
//# sourceMappingURL=BlockTray.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlockTray.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/tray/BlockTray.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AACrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;
|
|
1
|
+
{"version":3,"file":"BlockTray.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/tray/BlockTray.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AACrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;AAOpE;;;GAGG;AACH,MAAM,WAAW,cAAc;IAC7B,kFAAkF;IAClF,QAAQ,EAAE,aAAa,CAAA;IACvB,8FAA8F;IAC9F,cAAc,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/C;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAA;IAC9E,6FAA6F;IAC7F,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACnC,qBAAqB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAA;IACtD,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9E;AAED,UAAU,sBAAuB,SAAQ,cAAc;IACrD,QAAQ,EAAE,aAAa,CAAA;IACvB,KAAK,EAAE,MAAM,CAAA;CACd;AAED;;;;;GAKG;AACH,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,cAAc,EACd,YAAY,EACZ,qBAAqB,EACrB,mBAAmB,EACnB,qBAAqB,EACrB,iBAAiB,EACjB,QAAQ,EACR,KAAK,GACN,EAAE,sBAAsB,2CAyCxB"}
|
|
@@ -23,12 +23,23 @@ export interface TrayBlockDefinition {
|
|
|
23
23
|
/** Props merged on top of the block's defaults when it is added. */
|
|
24
24
|
propsOverride?: Record<string, unknown>;
|
|
25
25
|
description?: string;
|
|
26
|
+
/**
|
|
27
|
+
* Whether this block offers the tray's AI-edit affordance — the same host `hiddenActions`
|
|
28
|
+
* gate the canvas toolbar and settings panel read. The `aiButton` node must also be supplied
|
|
29
|
+
* (and the AI seam present), so an un-AI'd host shows nothing regardless.
|
|
30
|
+
*/
|
|
31
|
+
supportsAi?: boolean;
|
|
32
|
+
/** The block's registry defaults — the empty starting content for a card's generate prompt. */
|
|
33
|
+
defaultProps?: Record<string, unknown>;
|
|
26
34
|
}
|
|
27
35
|
export interface BlockRowProps {
|
|
28
36
|
block: TrayBlockDefinition;
|
|
29
37
|
onAdd: () => void;
|
|
30
38
|
/** When set, wraps the row in a tooltip (e.g. explaining a disabled row). */
|
|
31
39
|
tooltip?: string;
|
|
40
|
+
/** The card's "edit with AI" trigger (a `TrayBlockAIButton`). Rendered at the row's trailing
|
|
41
|
+
* edge for an AI-capable block on an AI-enabled host; omitted, the card shows no AI button. */
|
|
42
|
+
aiButton?: ReactNode;
|
|
32
43
|
}
|
|
33
44
|
/** Scroll container the tray panels sit in. Mounts the tray stylesheet once. */
|
|
34
45
|
export declare function TrayContainer({ children }: {
|
|
@@ -39,13 +50,15 @@ export declare function BlockList({ children }: {
|
|
|
39
50
|
children: ReactNode;
|
|
40
51
|
}): import("react/jsx-runtime").JSX.Element;
|
|
41
52
|
/**
|
|
42
|
-
* One block in a tray: a drag anchor (pointer/keyboard drag source)
|
|
43
|
-
*
|
|
44
|
-
*
|
|
45
|
-
*
|
|
46
|
-
*
|
|
53
|
+
* One block in a tray: a drag anchor (pointer/keyboard drag source), an accessible "Add"
|
|
54
|
+
* button, and — for an AI-capable block on an AI-enabled host — a trailing "edit with AI"
|
|
55
|
+
* button (its own menu trigger) that opens a generate prompt. The drag handle is hidden from
|
|
56
|
+
* assistive tech (`aria-hidden`, `tabIndex=-1`) — dragging is pointer/keyboard-DnD only — so the
|
|
57
|
+
* row exposes at most two labelled buttons: add, and (optionally) the AI trigger. The dnd-kit id
|
|
58
|
+
* is `tray-<dragId ?? component>` and the drag `data` carries the wire name + optional
|
|
59
|
+
* `propsOverride`, which is what `TrayDragLayer` and the grid consume.
|
|
47
60
|
*/
|
|
48
|
-
export declare function BlockRow({ block, onAdd, tooltip }: BlockRowProps): import("react/jsx-runtime").JSX.Element;
|
|
61
|
+
export declare function BlockRow({ block, onAdd, tooltip, aiButton }: BlockRowProps): import("react/jsx-runtime").JSX.Element;
|
|
49
62
|
/**
|
|
50
63
|
* The lightweight card shown under the cursor while a block is dragged out of the tray.
|
|
51
64
|
* Non-interactive — it mirrors `BlockRow`'s look via the same classes.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SharedTrayComponents.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/tray/SharedTrayComponents.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"SharedTrayComponents.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/tray/SharedTrayComponents.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAA;AAMrD;;;;GAIG;AAEH,uDAAuD;AACvD,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,aAAa,GAAG,QAAQ,CAAA;AAEvF,uFAAuF;AACvF,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAAC,kBAAkB,EAAE,MAAM,CAM1E,CAAA;AAED,gEAAgE;AAChE,MAAM,WAAW,mBAAmB;IAClC,kEAAkE;IAClE,SAAS,EAAE,MAAM,CAAA;IACjB,mEAAmE;IACnE,WAAW,EAAE,MAAM,CAAA;IACnB,kEAAkE;IAClE,IAAI,EAAE,SAAS,CAAA;IACf,aAAa,EAAE,kBAAkB,CAAA;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wEAAwE;IACxE,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,oEAAoE;IACpE,aAAa,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACvC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,+FAA+F;IAC/F,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;CACvC;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,mBAAmB,CAAA;IAC1B,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,6EAA6E;IAC7E,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;mGAC+F;IAC/F,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAwBD,gFAAgF;AAChF,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAOlE;AAED,6CAA6C;AAC7C,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAE9D;AAWD;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,aAAa,2CA8D1E;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,mBAAmB,CAAA;CAAE,2CAmBxE;AAED;;;;GAIG;AACH,wBAAgB,2BAA2B,CAAC,EAC1C,mBAAmB,GACpB,EAAE;IACD,mBAAmB,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAA;CAC/C,kDAoBA"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { BlockRegistry } from '../../../registry/blockRegistry';
|
|
2
|
+
import { TrayBlockDefinition } from './SharedTrayComponents';
|
|
3
|
+
/**
|
|
4
|
+
* The "edit with AI" affordance on a tray block card. It mounts the same `BlockAIMenu` the canvas
|
|
5
|
+
* toolbar and settings panel use, but for a block that does not exist yet: the card's block type
|
|
6
|
+
* with its registry defaults as the (empty) starting content, so the menu opens straight on the
|
|
7
|
+
* "Generate with an idea" prompt. Nothing is inserted on click — only when the author accepts a
|
|
8
|
+
* generated result does `onGenerate` fire with the AI-authored props, which the composition turns
|
|
9
|
+
* into a real block. The light trigger surface gives the gradient pencil-sparkles button the card
|
|
10
|
+
* shows.
|
|
11
|
+
*/
|
|
12
|
+
export declare function TrayBlockAIButton({ block, registry, onGenerate, }: {
|
|
13
|
+
block: TrayBlockDefinition;
|
|
14
|
+
registry: BlockRegistry;
|
|
15
|
+
onGenerate: (componentType: string, props: Record<string, unknown>) => void;
|
|
16
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
//# sourceMappingURL=TrayBlockAIButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TrayBlockAIButton.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/tray/TrayBlockAIButton.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;AAGpE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAA;AAEjE;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,UAAU,GACX,EAAE;IACD,KAAK,EAAE,mBAAmB,CAAA;IAC1B,QAAQ,EAAE,aAAa,CAAA;IACvB,UAAU,EAAE,CAAC,aAAa,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAA;CAC5E,2CAuBA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"blockDefinitions.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/tray/blockDefinitions.tsx"],"names":[],"mappings":"AAkCA,OAAO,EAAmB,KAAK,aAAa,EAAE,MAAM,kCAAkC,CAAA;AACtF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;
|
|
1
|
+
{"version":3,"file":"blockDefinitions.d.ts","sourceRoot":"","sources":["../../../../src/editor/sidebar/tray/blockDefinitions.tsx"],"names":[],"mappings":"AAkCA,OAAO,EAAmB,KAAK,aAAa,EAAE,MAAM,kCAAkC,CAAA;AACtF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;AAGpE,OAAO,KAAK,EAAsB,mBAAmB,EAAE,MAAM,wBAAwB,CAAA;AAmFrF,gGAAgG;AAChG,wBAAgB,iCAAiC,CAC/C,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,aAAa,GACtB,mBAAmB,EAAE,CAIvB;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,CAAC,QAAQ,EAAE,aAAa,GAAG,mBAAmB,EAAE,CAGtF"}
|
|
@@ -11,8 +11,12 @@ import { FocusEvent, RefObject } from 'react';
|
|
|
11
11
|
* - Focus enters a canvas item → clear `data-selected`, let `:focus-within` show the border.
|
|
12
12
|
* - Focus leaves the canvas into the panel (or an open popover) → re-assert `data-selected`
|
|
13
13
|
* on the last-focused item, so the selection stays visible while editing.
|
|
14
|
-
* - Focus leaves both canvas and panel → deselect (clears `data-selected` and calls
|
|
15
|
-
*
|
|
14
|
+
* - Focus leaves both canvas and panel → deselect (clears `data-selected` and calls `onDeselect`,
|
|
15
|
+
* which the caller wires to the engine's selection), UNLESS an editor-owned overlay is open. The
|
|
16
|
+
* package's own portaled popovers are matched by a DOM marker; a host rich-text editor's overlays
|
|
17
|
+
* (a dialog, tray, or menu canvas-rce portals to `document.body`, unmarked, and gives focus to)
|
|
18
|
+
* are reported by the host through `isEditorOverlayOpen`. While one is open the leave is held, so
|
|
19
|
+
* opening it keeps the block selected and its settings form mounted.
|
|
16
20
|
* - Escape inside the canvas → deselect and blur.
|
|
17
21
|
*
|
|
18
22
|
* Spread `canvasProps` on the canvas wrapper (the element `canvasRef` points at) and
|
|
@@ -45,7 +49,17 @@ interface Options {
|
|
|
45
49
|
canvasRef: RefObject<HTMLElement | null>;
|
|
46
50
|
/** Called when focus leaves the editor entirely (or Escape) — clear the engine selection. */
|
|
47
51
|
onDeselect: () => void;
|
|
52
|
+
/**
|
|
53
|
+
* Optional host predicate: true while an editor-owned overlay that lives outside the canvas and
|
|
54
|
+
* panel is open — a rich-text editor's dialog, tray, or menu that the host's RCE portals to
|
|
55
|
+
* `document.body` (unmarked, and takes focus). While it returns true a focus-leave is held rather
|
|
56
|
+
* than read as "left the editor", so opening such an overlay keeps the block selected. Only the
|
|
57
|
+
* host knows its RCE's overlay DOM, so only the host can report this. It is read a frame after
|
|
58
|
+
* focus leaves; a DOM query for the open overlay is reliable because the focus-leave that matters
|
|
59
|
+
* fires only once the overlay has taken focus, so the overlay's element is already in the DOM.
|
|
60
|
+
*/
|
|
61
|
+
isEditorOverlayOpen?: () => boolean;
|
|
48
62
|
}
|
|
49
|
-
export declare function useDesignerSelectionFocus({ canvasRef, onDeselect, }: Options): DesignerSelectionFocusHandlers;
|
|
63
|
+
export declare function useDesignerSelectionFocus({ canvasRef, onDeselect, isEditorOverlayOpen, }: Options): DesignerSelectionFocusHandlers;
|
|
50
64
|
export {};
|
|
51
65
|
//# sourceMappingURL=useDesignerSelectionFocus.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDesignerSelectionFocus.d.ts","sourceRoot":"","sources":["../../../src/editor/sidebar/useDesignerSelectionFocus.ts"],"names":[],"mappings":"AAkBA,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,SAAS,EAAkC,MAAM,OAAO,CAAA;AAIvF
|
|
1
|
+
{"version":3,"file":"useDesignerSelectionFocus.d.ts","sourceRoot":"","sources":["../../../src/editor/sidebar/useDesignerSelectionFocus.ts"],"names":[],"mappings":"AAkBA,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,SAAS,EAAkC,MAAM,OAAO,CAAA;AAIvF;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,MAAM,WAAW,8BAA8B;IAC7C,WAAW,EAAE;QACX,cAAc,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;QACvC,aAAa,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;KACvC,CAAA;IACD,UAAU,EAAE;QACV,aAAa,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;QACtC,iBAAiB,EAAE,MAAM,CAAA;KAC1B,CAAA;IACD;;;;;;;;;OASG;IACH,oBAAoB,EAAE,MAAM,IAAI,CAAA;CACjC;AAED,UAAU,OAAO;IACf,4EAA4E;IAC5E,SAAS,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IACxC,6FAA6F;IAC7F,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB;;;;;;;;OAQG;IACH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAA;CACpC;AAkBD,wBAAgB,yBAAyB,CAAC,EACxC,SAAS,EACT,UAAU,EACV,mBAAmB,GACpB,EAAE,OAAO,GAAG,8BAA8B,CA8J1C"}
|