@threadlabs/looma 0.28.3 → 0.28.5
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/components/ui-editor-image-toolbar/ui-editor-image-toolbar.html +96 -0
- package/components/ui-editor-image-toolbar/ui-editor-image-toolbar.js +56 -0
- package/dist/index.js +34 -33
- package/package.json +1 -1
- package/styles/ui-editor-image-toolbar.css +1 -0
- package/vanilla/UiEditorImageToolbar.d.ts +19 -0
- package/vanilla/UiEditorImageToolbar.js +171 -0
- package/vanilla/index.js +1 -0
- package/vue/UiEditorImageToolbar.d.ts +54 -0
- package/vue/UiEditorImageToolbar.js +2 -0
- package/vue/UiEditorImageToolbar.vue +625 -0
- package/vue/UiText.d.ts +1 -1
- package/vue/chunks/UiEditorImageToolbar.js +584 -0
- package/vue/components.css +2142 -2142
- package/vue/editor/index.js +56 -174
- package/vue/editor/primitives.d.ts +9 -1
- package/vue/index.d.ts +1 -0
- package/vue/index.js +9 -8
- package/vue/editor/image-controls.d.ts +0 -19
package/vue/editor/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { computed, createApp, defineComponent, h, nextTick, onBeforeUnmount, onMounted, reactive, ref, shallowRef, useId, watch } from "vue";
|
|
2
2
|
import { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_CHIP_COLORS, LOOMA_ICONS, createLoomaMentionExtension, createLoomaSlashCommandExtension, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getTableOfContentsEntries, getVisualViewportRect, handleTableAction, handleTableOverlayAction, measureTableOverlayGeometry, normalizeActiveTableColumnWidths, normalizeLoomaChipColor, normalizeTableOfContentsConfig, resolveTableCellAt, siteRelativeHref } from "@threadlabs/looma/editor";
|
|
3
|
-
import { Button, Callout, Card, Checkbox, Cluster, Combobox, Disclosure, EditorInsertTableGrid, EditorMentionMenu, EditorMentionMenuItem, EditorSlashMenu, EditorSlashMenuGroup, EditorSlashMenuItem, EditorSurface, EditorTableContextMenu, EditorTableOverlay, EditorTableToolbar, EditorToolbar,
|
|
3
|
+
import { Button, Callout, Card, Checkbox, Cluster, Combobox, Disclosure, EditorImageToolbar, EditorInsertTableGrid, EditorMentionMenu, EditorMentionMenuItem, EditorSlashMenu, EditorSlashMenuGroup, EditorSlashMenuItem, EditorSurface, EditorTableContextMenu, EditorTableOverlay, EditorTableToolbar, EditorToolbar, FormField, Icon, IconButton, Image, Input, InputGroup, List, Menu, MenuItem, Popover, ScrollArea, SearchResultRow, Separator, Stack, Text, Tooltip } from "@threadlabs/looma/vue";
|
|
4
4
|
import { Editor, Extension, Node as Node$1, getText, getTextSerializersFromSchema, isNodeSelection, mergeAttributes, nodeInputRule, posToDOMRect } from "@tiptap/core";
|
|
5
5
|
import { Editor as Editor$1 } from "@tiptap/vue-3";
|
|
6
6
|
import { closeHistory } from "@tiptap/pm/history";
|
|
@@ -21,7 +21,8 @@ var EDITOR_ADAPTER_COMPONENT_TAG_MAP = {
|
|
|
21
21
|
EditorTableContextMenu: "ui-editor-table-context-menu",
|
|
22
22
|
EditorTableToolbar: "ui-editor-table-toolbar",
|
|
23
23
|
EditorInsertTableGrid: "ui-editor-insert-table-grid",
|
|
24
|
-
EditorTableOverlay: "ui-editor-table-overlay"
|
|
24
|
+
EditorTableOverlay: "ui-editor-table-overlay",
|
|
25
|
+
EditorImageToolbar: "ui-editor-image-toolbar"
|
|
25
26
|
};
|
|
26
27
|
//#endregion
|
|
27
28
|
//#region src/components/shared/overlay.js
|
|
@@ -2188,172 +2189,6 @@ var calloutNodeView = ({ node }) => {
|
|
|
2188
2189
|
};
|
|
2189
2190
|
};
|
|
2190
2191
|
//#endregion
|
|
2191
|
-
//#region src/vue/editor/image-controls.ts
|
|
2192
|
-
var placements = [
|
|
2193
|
-
{
|
|
2194
|
-
value: "block",
|
|
2195
|
-
label: "Image in line",
|
|
2196
|
-
icon: "panel-top"
|
|
2197
|
-
},
|
|
2198
|
-
{
|
|
2199
|
-
value: "center",
|
|
2200
|
-
label: "Center image",
|
|
2201
|
-
icon: "align-center"
|
|
2202
|
-
},
|
|
2203
|
-
{
|
|
2204
|
-
value: "wrap-left",
|
|
2205
|
-
label: "Wrap text to the right",
|
|
2206
|
-
icon: "panel-left"
|
|
2207
|
-
},
|
|
2208
|
-
{
|
|
2209
|
-
value: "wrap-right",
|
|
2210
|
-
label: "Wrap text to the left",
|
|
2211
|
-
icon: "panel-right"
|
|
2212
|
-
}
|
|
2213
|
-
];
|
|
2214
|
-
/** One contextual editing bar; sizing belongs to the image's corner handles.
|
|
2215
|
-
* @contract Placement applies immediately. Alt text is a secondary draft with
|
|
2216
|
-
* Save/Cancel; editing another node cancels it rather than changing that node.
|
|
2217
|
-
*/
|
|
2218
|
-
var ImageControls = defineComponent({
|
|
2219
|
-
props: { editor: {
|
|
2220
|
-
type: Object,
|
|
2221
|
-
required: true
|
|
2222
|
-
} },
|
|
2223
|
-
setup(props) {
|
|
2224
|
-
const id = `looma-image-${useId()}`;
|
|
2225
|
-
const open = ref(false);
|
|
2226
|
-
const alt = ref("");
|
|
2227
|
-
const placement = ref("block");
|
|
2228
|
-
let target = null;
|
|
2229
|
-
const selected = () => props.editor.state.selection instanceof NodeSelection && props.editor.state.selection.node.type.name === "image" ? props.editor.state.selection : null;
|
|
2230
|
-
const refresh = () => {
|
|
2231
|
-
const selection = selected();
|
|
2232
|
-
placement.value = normalizeImagePlacement(selection?.node.attrs.placement);
|
|
2233
|
-
if (open.value && selection?.node !== target) open.value = false;
|
|
2234
|
-
};
|
|
2235
|
-
props.editor.on("transaction", refresh);
|
|
2236
|
-
onBeforeUnmount(() => props.editor.off("transaction", refresh));
|
|
2237
|
-
const begin = () => {
|
|
2238
|
-
const selection = selected();
|
|
2239
|
-
if (!selection) return;
|
|
2240
|
-
target = selection.node;
|
|
2241
|
-
alt.value = selection.node.attrs.alt ?? "";
|
|
2242
|
-
open.value = true;
|
|
2243
|
-
};
|
|
2244
|
-
const update = (attrs) => {
|
|
2245
|
-
const selection = selected();
|
|
2246
|
-
if (!selection || !props.editor.isEditable) return;
|
|
2247
|
-
props.editor.view.dispatch(props.editor.state.tr.setNodeMarkup(selection.from, void 0, {
|
|
2248
|
-
...selection.node.attrs,
|
|
2249
|
-
...attrs
|
|
2250
|
-
}));
|
|
2251
|
-
props.editor.view.focus();
|
|
2252
|
-
};
|
|
2253
|
-
return () => h(Text, {
|
|
2254
|
-
as: "div",
|
|
2255
|
-
font: "sans"
|
|
2256
|
-
}, () => [
|
|
2257
|
-
h(EditorToolbar$1, {
|
|
2258
|
-
floating: true,
|
|
2259
|
-
"aria-label": "Image actions"
|
|
2260
|
-
}, () => [
|
|
2261
|
-
...placements.map((option) => h(IconButton, {
|
|
2262
|
-
id: `${id}-${option.value}`,
|
|
2263
|
-
label: option.label,
|
|
2264
|
-
size: "sm",
|
|
2265
|
-
variant: placement.value === option.value ? "outline" : "ghost",
|
|
2266
|
-
"aria-pressed": placement.value === option.value,
|
|
2267
|
-
onClick: () => update({
|
|
2268
|
-
placement: option.value,
|
|
2269
|
-
...option.value.startsWith("wrap-") ? {
|
|
2270
|
-
width: null,
|
|
2271
|
-
height: null
|
|
2272
|
-
} : {}
|
|
2273
|
-
})
|
|
2274
|
-
}, () => h(Icon, {
|
|
2275
|
-
name: option.icon,
|
|
2276
|
-
size: "sm"
|
|
2277
|
-
}))),
|
|
2278
|
-
h(IconButton, {
|
|
2279
|
-
id,
|
|
2280
|
-
label: "Image description",
|
|
2281
|
-
size: "sm",
|
|
2282
|
-
variant: "ghost"
|
|
2283
|
-
}, () => h(Icon, {
|
|
2284
|
-
name: "file-text",
|
|
2285
|
-
size: "sm"
|
|
2286
|
-
})),
|
|
2287
|
-
h(IconButton, {
|
|
2288
|
-
id: `${id}-delete`,
|
|
2289
|
-
label: "Delete image",
|
|
2290
|
-
size: "sm",
|
|
2291
|
-
variant: "ghost",
|
|
2292
|
-
onClick: () => {
|
|
2293
|
-
if (selected() && props.editor.isEditable) props.editor.chain().focus().deleteSelection().run();
|
|
2294
|
-
}
|
|
2295
|
-
}, () => h(Icon, {
|
|
2296
|
-
name: "trash",
|
|
2297
|
-
size: "sm"
|
|
2298
|
-
}))
|
|
2299
|
-
]),
|
|
2300
|
-
...placements.map((option) => h(Tooltip, { for: `${id}-${option.value}` }, () => option.label)),
|
|
2301
|
-
h(Tooltip, { for: id }, () => "Image description"),
|
|
2302
|
-
h(Tooltip, { for: `${id}-delete` }, () => "Delete image"),
|
|
2303
|
-
h(Popover, {
|
|
2304
|
-
for: id,
|
|
2305
|
-
open: open.value,
|
|
2306
|
-
size: "sm",
|
|
2307
|
-
"aria-label": "Image description",
|
|
2308
|
-
onOpen: begin,
|
|
2309
|
-
onClose: () => {
|
|
2310
|
-
open.value = false;
|
|
2311
|
-
}
|
|
2312
|
-
}, () => h("form", {
|
|
2313
|
-
"aria-label": "Image description",
|
|
2314
|
-
onSubmit: (event) => {
|
|
2315
|
-
event.preventDefault();
|
|
2316
|
-
if (selected()?.node !== target) return;
|
|
2317
|
-
open.value = false;
|
|
2318
|
-
update({ alt: alt.value });
|
|
2319
|
-
}
|
|
2320
|
-
}, [h(Stack, { gap: "s" }, () => [
|
|
2321
|
-
h(FormField, {}, {
|
|
2322
|
-
label: () => h("label", { for: `${id}-alt` }, "Alt text"),
|
|
2323
|
-
default: () => h(Input, {
|
|
2324
|
-
id: `${id}-alt`,
|
|
2325
|
-
size: "sm",
|
|
2326
|
-
value: alt.value,
|
|
2327
|
-
onInput: (event) => {
|
|
2328
|
-
alt.value = event.target.value;
|
|
2329
|
-
}
|
|
2330
|
-
})
|
|
2331
|
-
}),
|
|
2332
|
-
h(Text, {
|
|
2333
|
-
size: "xs",
|
|
2334
|
-
tone: "secondary"
|
|
2335
|
-
}, () => "Describe the image for people using a screen reader."),
|
|
2336
|
-
h(Cluster, {
|
|
2337
|
-
justify: "end",
|
|
2338
|
-
gap: "xs"
|
|
2339
|
-
}, () => [h(Button, {
|
|
2340
|
-
type: "button",
|
|
2341
|
-
variant: "ghost",
|
|
2342
|
-
tone: "neutral",
|
|
2343
|
-
size: "sm",
|
|
2344
|
-
onClick: () => {
|
|
2345
|
-
open.value = false;
|
|
2346
|
-
}
|
|
2347
|
-
}, () => "Cancel"), h(Button, {
|
|
2348
|
-
type: "submit",
|
|
2349
|
-
variant: "solid",
|
|
2350
|
-
size: "sm"
|
|
2351
|
-
}, () => "Save")])
|
|
2352
|
-
])]))
|
|
2353
|
-
]);
|
|
2354
|
-
}
|
|
2355
|
-
});
|
|
2356
|
-
//#endregion
|
|
2357
2192
|
//#region src/vue/editor/image.ts
|
|
2358
2193
|
/** Projects the shared image's resize intent into a single document transaction.
|
|
2359
2194
|
* @ownership Delivery decorations belong to the inner image, never the figure;
|
|
@@ -3640,6 +3475,11 @@ var LoomaEditor = defineComponent({
|
|
|
3640
3475
|
const tableToolbarRef = popupRef(tableToolbarShell);
|
|
3641
3476
|
const codeLanguageRef = popupRef(codeLanguageShell, true);
|
|
3642
3477
|
const mobileToolbarRef = popupRef(mobileToolbarShell, true);
|
|
3478
|
+
const presentTableOverlay = popupRef(tableOverlayShell);
|
|
3479
|
+
const tableOverlayRef = (node) => {
|
|
3480
|
+
presentTableOverlay(node);
|
|
3481
|
+
if (node instanceof HTMLElement) node.hidden = !tableUi.overlayOpen;
|
|
3482
|
+
};
|
|
3643
3483
|
const onDocumentPointerDown = (event) => {
|
|
3644
3484
|
const path = typeof event.composedPath === "function" ? event.composedPath() : [];
|
|
3645
3485
|
const inElement = (element) => Boolean(element && (path.includes(element) || event.target instanceof Node && element.contains(event.target)));
|
|
@@ -3726,6 +3566,42 @@ var LoomaEditor = defineComponent({
|
|
|
3726
3566
|
related: editorRoot,
|
|
3727
3567
|
onDismiss: (reason) => reason === "escape" ? dismissFormatting() : linkPopup?.hide()
|
|
3728
3568
|
}));
|
|
3569
|
+
const imageTargets = /* @__PURE__ */ new WeakMap();
|
|
3570
|
+
let imageTargetSequence = 0;
|
|
3571
|
+
const selectedImage = (instance) => instance.state.selection instanceof NodeSelection && instance.state.selection.node.type.name === "image" ? instance.state.selection : null;
|
|
3572
|
+
const updateSelectedImage = (instance, attrs) => {
|
|
3573
|
+
const selection = selectedImage(instance);
|
|
3574
|
+
if (!selection || !instance.isEditable) return;
|
|
3575
|
+
instance.view.dispatch(instance.state.tr.setNodeMarkup(selection.from, void 0, {
|
|
3576
|
+
...selection.node.attrs,
|
|
3577
|
+
...attrs
|
|
3578
|
+
}));
|
|
3579
|
+
instance.view.focus();
|
|
3580
|
+
};
|
|
3581
|
+
const renderImageToolbar = (instance) => {
|
|
3582
|
+
const node = selectedImage(instance)?.node;
|
|
3583
|
+
let target = "";
|
|
3584
|
+
if (node) {
|
|
3585
|
+
target = imageTargets.get(node) ?? `image-${++imageTargetSequence}`;
|
|
3586
|
+
imageTargets.set(node, target);
|
|
3587
|
+
}
|
|
3588
|
+
return h(EditorImageToolbar, {
|
|
3589
|
+
placement: normalizeImagePlacement(node?.attrs.placement),
|
|
3590
|
+
alt: node?.attrs.alt ?? "",
|
|
3591
|
+
target,
|
|
3592
|
+
onPlacement: (event) => updateSelectedImage(instance, {
|
|
3593
|
+
placement: event.detail.placement,
|
|
3594
|
+
...event.detail.placement.startsWith("wrap-") ? {
|
|
3595
|
+
width: null,
|
|
3596
|
+
height: null
|
|
3597
|
+
} : {}
|
|
3598
|
+
}),
|
|
3599
|
+
onDescribe: (event) => updateSelectedImage(instance, { alt: event.detail.alt }),
|
|
3600
|
+
onDelete: () => {
|
|
3601
|
+
if (selectedImage(instance) && instance.isEditable) instance.chain().focus().deleteSelection().run();
|
|
3602
|
+
}
|
|
3603
|
+
});
|
|
3604
|
+
};
|
|
3729
3605
|
const imageSurfaceRef = surfaceRef((surface) => {
|
|
3730
3606
|
imagePopup = surface;
|
|
3731
3607
|
}, (element, instance) => ({
|
|
@@ -4312,9 +4188,10 @@ var LoomaEditor = defineComponent({
|
|
|
4312
4188
|
ref: imageSurfaceRef,
|
|
4313
4189
|
class: "looma-editor__floating-shell looma-editor__image-shell",
|
|
4314
4190
|
hidden: true
|
|
4315
|
-
}, [
|
|
4191
|
+
}, [renderImageToolbar(instance)])]) : null,
|
|
4316
4192
|
instance ? h(EditorSurface, { density: props.editable ? "comfortable" : props.contentDensity }, () => h("div", { ref: attachDocument })) : null,
|
|
4317
4193
|
codeUi.open ? h("div", {
|
|
4194
|
+
key: "looma-code-language-shell",
|
|
4318
4195
|
ref: codeLanguageRef,
|
|
4319
4196
|
class: "looma-editor__code-language",
|
|
4320
4197
|
style: codeUi.style,
|
|
@@ -4329,6 +4206,7 @@ var LoomaEditor = defineComponent({
|
|
|
4329
4206
|
onValueChange: (event) => chooseCodeLanguage(event.detail)
|
|
4330
4207
|
}, () => codeLanguageOptions.value.map((option) => h("option", { value: option.value }, option.label)))]) : null,
|
|
4331
4208
|
instance && (props.editable || props.selectionActions.length && !instance.state.selection.empty || activeRangeActions(instance).length > 0) && mobile.value && (editorFocused.value || linkOpen.value || !props.editable) ? h("div", {
|
|
4209
|
+
key: "looma-mobile-toolbar-shell",
|
|
4332
4210
|
ref: mobileToolbarRef,
|
|
4333
4211
|
class: "looma-editor__mobile-toolbar-shell",
|
|
4334
4212
|
"data-mode": mobileToolbarMode.value,
|
|
@@ -4509,17 +4387,20 @@ var LoomaEditor = defineComponent({
|
|
|
4509
4387
|
}
|
|
4510
4388
|
}) : null,
|
|
4511
4389
|
tableUi.toolbarOpen ? h("div", {
|
|
4390
|
+
key: "looma-table-toolbar-shell",
|
|
4512
4391
|
ref: tableToolbarRef,
|
|
4513
4392
|
class: "looma-editor__table-toolbar-shell",
|
|
4514
4393
|
style: tableUi.toolbarStyle
|
|
4515
4394
|
}, [h(EditorTableToolbar, tableProps)]) : null,
|
|
4516
|
-
|
|
4517
|
-
|
|
4395
|
+
instance && props.editable && !mobile.value ? h("div", {
|
|
4396
|
+
key: "looma-table-overlay-shell",
|
|
4397
|
+
ref: tableOverlayRef,
|
|
4518
4398
|
class: "looma-editor__table-overlay-shell",
|
|
4519
4399
|
style: tableUi.overlayStyle,
|
|
4400
|
+
hidden: !tableUi.overlayOpen,
|
|
4520
4401
|
onMousedown: onTableOverlayMouseDown,
|
|
4521
4402
|
onPointerleave: onTableOverlayPointerLeave
|
|
4522
|
-
}, [h(EditorTableOverlay, {
|
|
4403
|
+
}, [tableUi.overlayOpen ? h(EditorTableOverlay, {
|
|
4523
4404
|
open: true,
|
|
4524
4405
|
geometry: tableUi.geometry,
|
|
4525
4406
|
onAddRowBefore: (event) => runOverlayAction({
|
|
@@ -4566,8 +4447,9 @@ var LoomaEditor = defineComponent({
|
|
|
4566
4447
|
action: "open-column-menu",
|
|
4567
4448
|
...event.detail
|
|
4568
4449
|
})
|
|
4569
|
-
})]) : null,
|
|
4450
|
+
}) : null]) : null,
|
|
4570
4451
|
tableUi.menuOpen ? h("div", {
|
|
4452
|
+
key: "looma-table-menu-shell",
|
|
4571
4453
|
ref: tableMenuShell,
|
|
4572
4454
|
class: "looma-editor__table-menu-shell"
|
|
4573
4455
|
}, [h(EditorTableContextMenu, {
|
|
@@ -4580,4 +4462,4 @@ var LoomaEditor = defineComponent({
|
|
|
4580
4462
|
}
|
|
4581
4463
|
});
|
|
4582
4464
|
//#endregion
|
|
4583
|
-
export { EDITOR_ADAPTER_COMPONENT_TAG_MAP, EditorInsertTableGrid, EditorMentionMenu, EditorMentionMenuItem, EditorSlashMenu, EditorSlashMenuGroup, EditorSlashMenuItem, EditorTableContextMenu, EditorTableOverlay, EditorTableToolbar, EditorToolbar, LoomaEditor };
|
|
4465
|
+
export { EDITOR_ADAPTER_COMPONENT_TAG_MAP, EditorImageToolbar, EditorInsertTableGrid, EditorMentionMenu, EditorMentionMenuItem, EditorSlashMenu, EditorSlashMenuGroup, EditorSlashMenuItem, EditorTableContextMenu, EditorTableOverlay, EditorTableToolbar, EditorToolbar, LoomaEditor };
|
|
@@ -3,13 +3,20 @@
|
|
|
3
3
|
* `@threadlabs/looma/vue`, re-exported beside the editor that composes them.
|
|
4
4
|
*/
|
|
5
5
|
import type { InsertTableEventDetail, MentionMenuHighlightEventDetail, MentionMenuSelectEventDetail, SlashMenuHighlightEventDetail, SlashMenuSelectEventDetail, TableContextMenuActionEventDetail } from "@threadlabs/looma/editor";
|
|
6
|
-
export { EditorInsertTableGrid, EditorMentionMenu, EditorMentionMenuItem, EditorSlashMenu, EditorSlashMenuGroup, EditorSlashMenuItem, EditorTableContextMenu, EditorTableOverlay, EditorTableToolbar, EditorToolbar, } from "@threadlabs/looma/vue";
|
|
6
|
+
export { EditorImageToolbar, EditorInsertTableGrid, EditorMentionMenu, EditorMentionMenuItem, EditorSlashMenu, EditorSlashMenuGroup, EditorSlashMenuItem, EditorTableContextMenu, EditorTableOverlay, EditorTableToolbar, EditorToolbar, } from "@threadlabs/looma/vue";
|
|
7
7
|
/** The editor components' event details, by event name. */
|
|
8
8
|
export interface VueEditorAdapterEventMap {
|
|
9
9
|
highlight: MentionMenuHighlightEventDetail | SlashMenuHighlightEventDetail;
|
|
10
10
|
select: MentionMenuSelectEventDetail | SlashMenuSelectEventDetail;
|
|
11
11
|
action: TableContextMenuActionEventDetail;
|
|
12
12
|
insert: InsertTableEventDetail;
|
|
13
|
+
placement: {
|
|
14
|
+
placement: "block" | "center" | "wrap-left" | "wrap-right";
|
|
15
|
+
};
|
|
16
|
+
describe: {
|
|
17
|
+
alt: string;
|
|
18
|
+
};
|
|
19
|
+
delete: Record<string, never>;
|
|
13
20
|
"add-row-before": {
|
|
14
21
|
boundaryIndex: number;
|
|
15
22
|
};
|
|
@@ -73,4 +80,5 @@ export declare const EDITOR_ADAPTER_COMPONENT_TAG_MAP: {
|
|
|
73
80
|
readonly EditorTableToolbar: "ui-editor-table-toolbar";
|
|
74
81
|
readonly EditorInsertTableGrid: "ui-editor-insert-table-grid";
|
|
75
82
|
readonly EditorTableOverlay: "ui-editor-table-overlay";
|
|
83
|
+
readonly EditorImageToolbar: "ui-editor-image-toolbar";
|
|
76
84
|
};
|
package/vue/index.d.ts
CHANGED
|
@@ -19,6 +19,7 @@ export { default as DescriptionList } from "./UiDescriptionList.js";
|
|
|
19
19
|
export { default as Dialog } from "./UiDialog.js";
|
|
20
20
|
export { default as Disclosure } from "./UiDisclosure.js";
|
|
21
21
|
export { default as Editable } from "./UiEditable.js";
|
|
22
|
+
export { default as EditorImageToolbar } from "./UiEditorImageToolbar.js";
|
|
22
23
|
export { default as EditorInsertTableGrid } from "./UiEditorInsertTableGrid.js";
|
|
23
24
|
export { default as EditorMentionMenu } from "./UiEditorMentionMenu.js";
|
|
24
25
|
export { default as EditorMentionMenuItem } from "./UiEditorMentionMenuItem.js";
|
package/vue/index.js
CHANGED
|
@@ -23,6 +23,14 @@ import { t as UiScrollArea_default } from "./chunks/UiScrollArea.js";
|
|
|
23
23
|
import { t as UiDialog_default } from "./chunks/UiDialog.js";
|
|
24
24
|
import { t as UiDisclosure_default } from "./chunks/UiDisclosure.js";
|
|
25
25
|
import { t as UiEditable_default } from "./chunks/UiEditable.js";
|
|
26
|
+
import { t as UiEditorToolbar_default } from "./chunks/UiEditorToolbar.js";
|
|
27
|
+
import { t as UiFormField_default } from "./chunks/UiFormField.js";
|
|
28
|
+
import { t as UiIconButton_default } from "./chunks/UiIconButton.js";
|
|
29
|
+
import { t as UiInput_default } from "./chunks/UiInput.js";
|
|
30
|
+
import { t as UiPopover_default } from "./chunks/UiPopover.js";
|
|
31
|
+
import { t as UiStack_default } from "./chunks/UiStack.js";
|
|
32
|
+
import { t as UiText_default } from "./chunks/UiText.js";
|
|
33
|
+
import { t as UiEditorImageToolbar_default } from "./chunks/UiEditorImageToolbar.js";
|
|
26
34
|
import { t as UiEditorInsertTableGrid_default } from "./chunks/UiEditorInsertTableGrid.js";
|
|
27
35
|
import { t as UiEditorMentionMenu_default } from "./chunks/UiEditorMentionMenu.js";
|
|
28
36
|
import { t as UiEditorMentionMenuItem_default } from "./chunks/UiEditorMentionMenuItem.js";
|
|
@@ -33,13 +41,9 @@ import { t as UiEditorSurface_default } from "./chunks/UiEditorSurface.js";
|
|
|
33
41
|
import { t as UiEditorTableContextMenu_default } from "./chunks/UiEditorTableContextMenu.js";
|
|
34
42
|
import { t as UiEditorTableOverlay_default } from "./chunks/UiEditorTableOverlay.js";
|
|
35
43
|
import { t as UiEditorTableToolbar_default } from "./chunks/UiEditorTableToolbar.js";
|
|
36
|
-
import { t as UiEditorToolbar_default } from "./chunks/UiEditorToolbar.js";
|
|
37
44
|
import { t as UiFloatingActionButton_default } from "./chunks/UiFloatingActionButton.js";
|
|
38
|
-
import { t as UiFormField_default } from "./chunks/UiFormField.js";
|
|
39
45
|
import { t as UiGrid_default } from "./chunks/UiGrid.js";
|
|
40
|
-
import { t as UiIconButton_default } from "./chunks/UiIconButton.js";
|
|
41
46
|
import { t as UiImage_default } from "./chunks/UiImage.js";
|
|
42
|
-
import { t as UiInput_default } from "./chunks/UiInput.js";
|
|
43
47
|
import { t as UiInputGroup_default } from "./chunks/UiInputGroup.js";
|
|
44
48
|
import { t as UiList_default } from "./chunks/UiList.js";
|
|
45
49
|
import { t as UiListItem_default } from "./chunks/UiListItem.js";
|
|
@@ -50,7 +54,6 @@ import { t as UiMenuItem_default } from "./chunks/UiMenuItem.js";
|
|
|
50
54
|
import { t as UiMeter_default } from "./chunks/UiMeter.js";
|
|
51
55
|
import { t as UiNavItem_default } from "./chunks/UiNavItem.js";
|
|
52
56
|
import { t as UiPageHeader_default } from "./chunks/UiPageHeader.js";
|
|
53
|
-
import { t as UiPopover_default } from "./chunks/UiPopover.js";
|
|
54
57
|
import { t as UiRadio_default } from "./chunks/UiRadio.js";
|
|
55
58
|
import { t as UiRadioGroup_default } from "./chunks/UiRadioGroup.js";
|
|
56
59
|
import { t as UiReel_default } from "./chunks/UiReel.js";
|
|
@@ -60,13 +63,11 @@ import { t as UiSection_default } from "./chunks/UiSection.js";
|
|
|
60
63
|
import { t as UiSelect_default } from "./chunks/UiSelect.js";
|
|
61
64
|
import { t as UiSeparator_default } from "./chunks/UiSeparator.js";
|
|
62
65
|
import { t as UiSidebar_default } from "./chunks/UiSidebar.js";
|
|
63
|
-
import { t as UiStack_default } from "./chunks/UiStack.js";
|
|
64
66
|
import { t as UiStatusMessage_default } from "./chunks/UiStatusMessage.js";
|
|
65
67
|
import { t as UiSwitch_default } from "./chunks/UiSwitch.js";
|
|
66
68
|
import { t as UiSwitcher_default } from "./chunks/UiSwitcher.js";
|
|
67
69
|
import { t as UiTable_default } from "./chunks/UiTable.js";
|
|
68
70
|
import { t as UiTabs_default } from "./chunks/UiTabs.js";
|
|
69
|
-
import { t as UiText_default } from "./chunks/UiText.js";
|
|
70
71
|
import { t as UiTextarea_default } from "./chunks/UiTextarea.js";
|
|
71
72
|
import { t as UiToast_default } from "./chunks/UiToast.js";
|
|
72
73
|
import { t as UiToastRegion_default } from "./chunks/UiToastRegion.js";
|
|
@@ -74,4 +75,4 @@ import { t as UiTopBar_default } from "./chunks/UiTopBar.js";
|
|
|
74
75
|
import { t as UiTree_default } from "./chunks/UiTree.js";
|
|
75
76
|
import { t as UiTreeItem_default } from "./chunks/UiTreeItem.js";
|
|
76
77
|
import { trackInputModality } from "@threadlabs/looma/components/shared/input-modality.js";
|
|
77
|
-
export { UiActionBar_default as ActionBar, UiAffordanceScope_default as AffordanceScope, UiAvatar_default as Avatar, UiAvatarGroup_default as AvatarGroup, UiBadge_default as Badge, UiBreadcrumbItem_default as BreadcrumbItem, UiBreadcrumbs_default as Breadcrumbs, UiButton_default as Button, UiCallout_default as Callout, UiCard_default as Card, UiCheckbox_default as Checkbox, UiCluster_default as Cluster, UiCombobox_default as Combobox, UiContainer_default as Container, UiContextMenu_default as ContextMenu, UiCover_default as Cover, UiDescriptionItem_default as DescriptionItem, UiDescriptionList_default as DescriptionList, UiDialog_default as Dialog, UiDisclosure_default as Disclosure, UiEditable_default as Editable, UiEditorInsertTableGrid_default as EditorInsertTableGrid, UiEditorMentionMenu_default as EditorMentionMenu, UiEditorMentionMenuItem_default as EditorMentionMenuItem, UiEditorSlashMenu_default as EditorSlashMenu, UiEditorSlashMenuGroup_default as EditorSlashMenuGroup, UiEditorSlashMenuItem_default as EditorSlashMenuItem, UiEditorSurface_default as EditorSurface, UiEditorTableContextMenu_default as EditorTableContextMenu, UiEditorTableOverlay_default as EditorTableOverlay, UiEditorTableToolbar_default as EditorTableToolbar, UiEditorToolbar_default as EditorToolbar, UiFloatingActionButton_default as FloatingActionButton, UiFormField_default as FormField, UiGrid_default as Grid, UiIcon_default as Icon, UiIconButton_default as IconButton, UiImage_default as Image, UiInput_default as Input, UiInputGroup_default as InputGroup, UiList_default as List, UiListItem_default as ListItem, UiListbox_default as Listbox, UiMenu_default as Menu, UiMenuGroup_default as MenuGroup, UiMenuItem_default as MenuItem, UiMeter_default as Meter, UiNavItem_default as NavItem, UiPageHeader_default as PageHeader, UiPopover_default as Popover, UiRadio_default as Radio, UiRadioGroup_default as RadioGroup, UiReel_default as Reel, UiScrollArea_default as ScrollArea, UiSearchResultRow_default as SearchResultRow, UiSearchShell_default as SearchShell, UiSection_default as Section, UiSelect_default as Select, UiSeparator_default as Separator, UiSidebar_default as Sidebar, UiSpinner_default as Spinner, UiStack_default as Stack, UiStatusMessage_default as StatusMessage, UiSwitch_default as Switch, UiSwitcher_default as Switcher, UiTable_default as Table, UiTabs_default as Tabs, UiText_default as Text, UiTextarea_default as Textarea, UiToast_default as Toast, UiToastRegion_default as ToastRegion, UiTooltip_default as Tooltip, UiTopBar_default as TopBar, UiTree_default as Tree, UiTreeItem_default as TreeItem, trackInputModality };
|
|
78
|
+
export { UiActionBar_default as ActionBar, UiAffordanceScope_default as AffordanceScope, UiAvatar_default as Avatar, UiAvatarGroup_default as AvatarGroup, UiBadge_default as Badge, UiBreadcrumbItem_default as BreadcrumbItem, UiBreadcrumbs_default as Breadcrumbs, UiButton_default as Button, UiCallout_default as Callout, UiCard_default as Card, UiCheckbox_default as Checkbox, UiCluster_default as Cluster, UiCombobox_default as Combobox, UiContainer_default as Container, UiContextMenu_default as ContextMenu, UiCover_default as Cover, UiDescriptionItem_default as DescriptionItem, UiDescriptionList_default as DescriptionList, UiDialog_default as Dialog, UiDisclosure_default as Disclosure, UiEditable_default as Editable, UiEditorImageToolbar_default as EditorImageToolbar, UiEditorInsertTableGrid_default as EditorInsertTableGrid, UiEditorMentionMenu_default as EditorMentionMenu, UiEditorMentionMenuItem_default as EditorMentionMenuItem, UiEditorSlashMenu_default as EditorSlashMenu, UiEditorSlashMenuGroup_default as EditorSlashMenuGroup, UiEditorSlashMenuItem_default as EditorSlashMenuItem, UiEditorSurface_default as EditorSurface, UiEditorTableContextMenu_default as EditorTableContextMenu, UiEditorTableOverlay_default as EditorTableOverlay, UiEditorTableToolbar_default as EditorTableToolbar, UiEditorToolbar_default as EditorToolbar, UiFloatingActionButton_default as FloatingActionButton, UiFormField_default as FormField, UiGrid_default as Grid, UiIcon_default as Icon, UiIconButton_default as IconButton, UiImage_default as Image, UiInput_default as Input, UiInputGroup_default as InputGroup, UiList_default as List, UiListItem_default as ListItem, UiListbox_default as Listbox, UiMenu_default as Menu, UiMenuGroup_default as MenuGroup, UiMenuItem_default as MenuItem, UiMeter_default as Meter, UiNavItem_default as NavItem, UiPageHeader_default as PageHeader, UiPopover_default as Popover, UiRadio_default as Radio, UiRadioGroup_default as RadioGroup, UiReel_default as Reel, UiScrollArea_default as ScrollArea, UiSearchResultRow_default as SearchResultRow, UiSearchShell_default as SearchShell, UiSection_default as Section, UiSelect_default as Select, UiSeparator_default as Separator, UiSidebar_default as Sidebar, UiSpinner_default as Spinner, UiStack_default as Stack, UiStatusMessage_default as StatusMessage, UiSwitch_default as Switch, UiSwitcher_default as Switcher, UiTable_default as Table, UiTabs_default as Tabs, UiText_default as Text, UiTextarea_default as Textarea, UiToast_default as Toast, UiToastRegion_default as ToastRegion, UiTooltip_default as Tooltip, UiTopBar_default as TopBar, UiTree_default as Tree, UiTreeItem_default as TreeItem, trackInputModality };
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import type { Editor } from "@tiptap/core";
|
|
2
|
-
import { type PropType } from "vue";
|
|
3
|
-
/** One contextual editing bar; sizing belongs to the image's corner handles.
|
|
4
|
-
* @contract Placement applies immediately. Alt text is a secondary draft with
|
|
5
|
-
* Save/Cancel; editing another node cancels it rather than changing that node.
|
|
6
|
-
*/
|
|
7
|
-
export declare const ImageControls: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
8
|
-
editor: {
|
|
9
|
-
type: PropType<Editor>;
|
|
10
|
-
required: true;
|
|
11
|
-
};
|
|
12
|
-
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
|
13
|
-
[key: string]: any;
|
|
14
|
-
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
15
|
-
editor: {
|
|
16
|
-
type: PropType<Editor>;
|
|
17
|
-
required: true;
|
|
18
|
-
};
|
|
19
|
-
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|