@oh-just-another/react-ui 0.57.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/CHANGELOG.md +22 -0
- package/LICENSE +21 -0
- package/README.md +54 -0
- package/dist/.tsbuildinfo +1 -0
- package/dist/bottom-sheet.d.ts +26 -0
- package/dist/bottom-sheet.d.ts.map +1 -0
- package/dist/bottom-sheet.js +87 -0
- package/dist/bottom-sheet.js.map +1 -0
- package/dist/button-group.d.ts +14 -0
- package/dist/button-group.d.ts.map +1 -0
- package/dist/button-group.js +3 -0
- package/dist/button-group.js.map +1 -0
- package/dist/color-palette.d.ts +34 -0
- package/dist/color-palette.d.ts.map +1 -0
- package/dist/color-palette.js +77 -0
- package/dist/color-palette.js.map +1 -0
- package/dist/color-swatch-picker.d.ts +29 -0
- package/dist/color-swatch-picker.d.ts.map +1 -0
- package/dist/color-swatch-picker.js +56 -0
- package/dist/color-swatch-picker.js.map +1 -0
- package/dist/command-palette.d.ts +13 -0
- package/dist/command-palette.d.ts.map +1 -0
- package/dist/command-palette.js +146 -0
- package/dist/command-palette.js.map +1 -0
- package/dist/comments-panel.d.ts +27 -0
- package/dist/comments-panel.d.ts.map +1 -0
- package/dist/comments-panel.js +139 -0
- package/dist/comments-panel.js.map +1 -0
- package/dist/constants.d.ts +112 -0
- package/dist/constants.d.ts.map +1 -0
- package/dist/constants.js +119 -0
- package/dist/constants.js.map +1 -0
- package/dist/context-menu-controller.d.ts +41 -0
- package/dist/context-menu-controller.d.ts.map +1 -0
- package/dist/context-menu-controller.js +26 -0
- package/dist/context-menu-controller.js.map +1 -0
- package/dist/context-menu.d.ts +53 -0
- package/dist/context-menu.d.ts.map +1 -0
- package/dist/context-menu.js +333 -0
- package/dist/context-menu.js.map +1 -0
- package/dist/context.d.ts +44 -0
- package/dist/context.d.ts.map +1 -0
- package/dist/context.js +95 -0
- package/dist/context.js.map +1 -0
- package/dist/diagram-bars.d.ts +21 -0
- package/dist/diagram-bars.d.ts.map +1 -0
- package/dist/diagram-bars.js +4 -0
- package/dist/diagram-bars.js.map +1 -0
- package/dist/diagram-canvas.d.ts +39 -0
- package/dist/diagram-canvas.d.ts.map +1 -0
- package/dist/diagram-canvas.js +9 -0
- package/dist/diagram-canvas.js.map +1 -0
- package/dist/diagram-root.d.ts +70 -0
- package/dist/diagram-root.d.ts.map +1 -0
- package/dist/diagram-root.js +180 -0
- package/dist/diagram-root.js.map +1 -0
- package/dist/diff-panel.d.ts +25 -0
- package/dist/diff-panel.d.ts.map +1 -0
- package/dist/diff-panel.js +77 -0
- package/dist/diff-panel.js.map +1 -0
- package/dist/edge-style-panel.d.ts +19 -0
- package/dist/edge-style-panel.d.ts.map +1 -0
- package/dist/edge-style-panel.js +120 -0
- package/dist/edge-style-panel.js.map +1 -0
- package/dist/frame-name-editor-overlay.d.ts +13 -0
- package/dist/frame-name-editor-overlay.d.ts.map +1 -0
- package/dist/frame-name-editor-overlay.js +84 -0
- package/dist/frame-name-editor-overlay.js.map +1 -0
- package/dist/frame-panel.d.ts +19 -0
- package/dist/frame-panel.d.ts.map +1 -0
- package/dist/frame-panel.js +66 -0
- package/dist/frame-panel.js.map +1 -0
- package/dist/help-button.d.ts +16 -0
- package/dist/help-button.d.ts.map +1 -0
- package/dist/help-button.js +14 -0
- package/dist/help-button.js.map +1 -0
- package/dist/help-dialog.d.ts +56 -0
- package/dist/help-dialog.d.ts.map +1 -0
- package/dist/help-dialog.js +142 -0
- package/dist/help-dialog.js.map +1 -0
- package/dist/hooks.d.ts +54 -0
- package/dist/hooks.d.ts.map +1 -0
- package/dist/hooks.js +85 -0
- package/dist/hooks.js.map +1 -0
- package/dist/icon-button.d.ts +28 -0
- package/dist/icon-button.d.ts.map +1 -0
- package/dist/icon-button.js +14 -0
- package/dist/icon-button.js.map +1 -0
- package/dist/index.d.ts +45 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +46 -0
- package/dist/index.js.map +1 -0
- package/dist/layer-panel.d.ts +13 -0
- package/dist/layer-panel.d.ts.map +1 -0
- package/dist/layer-panel.js +109 -0
- package/dist/layer-panel.js.map +1 -0
- package/dist/library-panel.d.ts +33 -0
- package/dist/library-panel.d.ts.map +1 -0
- package/dist/library-panel.js +37 -0
- package/dist/library-panel.js.map +1 -0
- package/dist/link-caption-editor.d.ts +8 -0
- package/dist/link-caption-editor.d.ts.map +1 -0
- package/dist/link-caption-editor.js +65 -0
- package/dist/link-caption-editor.js.map +1 -0
- package/dist/link-drop-shape-menu.d.ts +12 -0
- package/dist/link-drop-shape-menu.d.ts.map +1 -0
- package/dist/link-drop-shape-menu.js +55 -0
- package/dist/link-drop-shape-menu.js.map +1 -0
- package/dist/link-hover-popup.d.ts +2 -0
- package/dist/link-hover-popup.d.ts.map +1 -0
- package/dist/link-hover-popup.js +96 -0
- package/dist/link-hover-popup.js.map +1 -0
- package/dist/main-menu.d.ts +67 -0
- package/dist/main-menu.d.ts.map +1 -0
- package/dist/main-menu.js +243 -0
- package/dist/main-menu.js.map +1 -0
- package/dist/markdown.d.ts +10 -0
- package/dist/markdown.d.ts.map +1 -0
- package/dist/markdown.js +131 -0
- package/dist/markdown.js.map +1 -0
- package/dist/merge-dialog.d.ts +22 -0
- package/dist/merge-dialog.d.ts.map +1 -0
- package/dist/merge-dialog.js +46 -0
- package/dist/merge-dialog.js.map +1 -0
- package/dist/modal.d.ts +19 -0
- package/dist/modal.d.ts.map +1 -0
- package/dist/modal.js +87 -0
- package/dist/modal.js.map +1 -0
- package/dist/palette.d.ts +73 -0
- package/dist/palette.d.ts.map +1 -0
- package/dist/palette.js +330 -0
- package/dist/palette.js.map +1 -0
- package/dist/popover.d.ts +33 -0
- package/dist/popover.d.ts.map +1 -0
- package/dist/popover.js +107 -0
- package/dist/popover.js.map +1 -0
- package/dist/property-panel.d.ts +32 -0
- package/dist/property-panel.d.ts.map +1 -0
- package/dist/property-panel.js +728 -0
- package/dist/property-panel.js.map +1 -0
- package/dist/reset-to-content-button.d.ts +10 -0
- package/dist/reset-to-content-button.d.ts.map +1 -0
- package/dist/reset-to-content-button.js +62 -0
- package/dist/reset-to-content-button.js.map +1 -0
- package/dist/segmented-control.d.ts +23 -0
- package/dist/segmented-control.d.ts.map +1 -0
- package/dist/segmented-control.js +5 -0
- package/dist/segmented-control.js.map +1 -0
- package/dist/selection-floating-panel.d.ts +56 -0
- package/dist/selection-floating-panel.d.ts.map +1 -0
- package/dist/selection-floating-panel.js +251 -0
- package/dist/selection-floating-panel.js.map +1 -0
- package/dist/sidebar.d.ts +31 -0
- package/dist/sidebar.d.ts.map +1 -0
- package/dist/sidebar.js +66 -0
- package/dist/sidebar.js.map +1 -0
- package/dist/slider.d.ts +20 -0
- package/dist/slider.d.ts.map +1 -0
- package/dist/slider.js +9 -0
- package/dist/slider.js.map +1 -0
- package/dist/text-editor-overlay.d.ts +16 -0
- package/dist/text-editor-overlay.d.ts.map +1 -0
- package/dist/text-editor-overlay.js +112 -0
- package/dist/text-editor-overlay.js.map +1 -0
- package/dist/toast.d.ts +34 -0
- package/dist/toast.d.ts.map +1 -0
- package/dist/toast.js +89 -0
- package/dist/toast.js.map +1 -0
- package/dist/toolbar.d.ts +149 -0
- package/dist/toolbar.d.ts.map +1 -0
- package/dist/toolbar.js +282 -0
- package/dist/toolbar.js.map +1 -0
- package/dist/tooltip.d.ts +21 -0
- package/dist/tooltip.d.ts.map +1 -0
- package/dist/tooltip.js +217 -0
- package/dist/tooltip.js.map +1 -0
- package/dist/ui-layer.d.ts +22 -0
- package/dist/ui-layer.d.ts.map +1 -0
- package/dist/ui-layer.js +3 -0
- package/dist/ui-layer.js.map +1 -0
- package/dist/versioning.d.ts +32 -0
- package/dist/versioning.d.ts.map +1 -0
- package/dist/versioning.js +206 -0
- package/dist/versioning.js.map +1 -0
- package/package.json +81 -0
- package/src/styles.css +1502 -0
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Tooltip } from "./tooltip.js";
|
|
3
|
+
export const IconButton = ({ label, active, size = "default", className, children, ...rest }) => {
|
|
4
|
+
const cls = [
|
|
5
|
+
"du-icon-button",
|
|
6
|
+
size === "sm" ? "du-icon-button-sm" : "",
|
|
7
|
+
active ? "is-active" : "",
|
|
8
|
+
className ?? "",
|
|
9
|
+
]
|
|
10
|
+
.filter(Boolean)
|
|
11
|
+
.join(" ");
|
|
12
|
+
return (_jsx(Tooltip, { content: label, children: _jsx("button", { type: "button", className: cls, "aria-label": label, "aria-pressed": active ?? undefined, ...rest, children: children }) }));
|
|
13
|
+
};
|
|
14
|
+
//# sourceMappingURL=icon-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../src/icon-button.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AA6BvC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,KAAK,EACL,MAAM,EACN,IAAI,GAAG,SAAS,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACS,EAAE,EAAE;IACpB,MAAM,GAAG,GAAG;QACV,gBAAgB;QAChB,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE;QACxC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE;QACzB,SAAS,IAAI,EAAE;KAChB;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IACb,OAAO,CACL,KAAC,OAAO,IAAC,OAAO,EAAE,KAAK,YACrB,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,GAAG,gBACF,KAAK,kBACH,MAAM,IAAI,SAAS,KAC7B,IAAI,YAEP,QAAQ,GACF,GACD,CACX,CAAC;AACJ,CAAC,CAAC"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export { DiagramProvider, useDiagramContext, useDiagramContextOptional, useEditorSelector, } from "./context.js";
|
|
2
|
+
export { IconButton, type IconButtonProps } from "./icon-button.js";
|
|
3
|
+
export { ButtonGroup, type ButtonGroupProps } from "./button-group.js";
|
|
4
|
+
export { SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, } from "./segmented-control.js";
|
|
5
|
+
export { Slider, type SliderProps } from "./slider.js";
|
|
6
|
+
export { UILayer, type UILayerProps } from "./ui-layer.js";
|
|
7
|
+
export { TopBar, BottomBar, type DiagramBarProps } from "./diagram-bars.js";
|
|
8
|
+
export { HelpButton, type HelpButtonProps } from "./help-button.js";
|
|
9
|
+
export { ResetToContentButton } from "./reset-to-content-button.js";
|
|
10
|
+
export { LibraryPanel, type LibraryPanelProps } from "./library-panel.js";
|
|
11
|
+
export { SelectionFloatingPanel, type SelectionFloatingPanelProps, } from "./selection-floating-panel.js";
|
|
12
|
+
export { Popover, type PopoverProps } from "./popover.js";
|
|
13
|
+
export { ColorSwatchPicker, type ColorSwatchPickerProps, } from "./color-swatch-picker.js";
|
|
14
|
+
export { ELEMENT_PALETTE_LIGHT, ELEMENT_PALETTE_DARK, CANVAS_PALETTE_LIGHT, CANVAS_PALETTE_DARK, resolvePaletteTheme, } from "./color-palette.js";
|
|
15
|
+
export { DiagramRoot, DiagramSurface, type DiagramRootProps, type DiagramSurfaceProps, } from "./diagram-root.js";
|
|
16
|
+
export { DiagramCanvas, type DiagramCanvasProps } from "./diagram-canvas.js";
|
|
17
|
+
export { useDiagram, useDiagramOptional, useScene, useSelection, useMode, useHistory, useLayers, useActiveLayerId, useAnnotations, useSelectedAnnotation, useSelectedLink, useMobileLayout, } from "./hooks.js";
|
|
18
|
+
export { LayerPanel, type LayerPanelProps } from "./layer-panel.js";
|
|
19
|
+
export { CommentsPanel, CommentsPopover, type CommentsPanelProps, type CommentsPopoverProps, } from "./comments-panel.js";
|
|
20
|
+
export { VersionPanel, useSnapshotStore, type VersionPanelProps } from "./versioning.js";
|
|
21
|
+
export { MergeDialog, type MergeDialogProps } from "./merge-dialog.js";
|
|
22
|
+
export { BottomSheet, type BottomSheetProps } from "./bottom-sheet.js";
|
|
23
|
+
export { FramePanel, type FramePanelProps } from "./frame-panel.js";
|
|
24
|
+
export { Markdown, type MarkdownProps } from "./markdown.js";
|
|
25
|
+
export { TextEditorOverlay } from "./text-editor-overlay.js";
|
|
26
|
+
export { FrameNameEditorOverlay } from "./frame-name-editor-overlay.js";
|
|
27
|
+
export { LinkHoverPopup } from "./link-hover-popup.js";
|
|
28
|
+
export { LinkDropShapeMenu } from "./link-drop-shape-menu.js";
|
|
29
|
+
export { LinkCaptionEditor } from "./link-caption-editor.js";
|
|
30
|
+
export { Toolbar, DEFAULT_TOOLBAR, DEFAULT_VERTICAL_TOOLBAR, openImageFilePicker, ZoomWidget, ZoomInButton, ZoomOutButton, ResetZoomButton, ZoomToFitButton, ZoomDisplay, FloatingZoomControls, type ToolbarItem, type ToolbarProps, type ZoomButtonProps, } from "./toolbar.js";
|
|
31
|
+
export { Palette, usePaletteDropHandler, usePalettePlacement, usePaletteDrag, getActivePaletteDrag, subscribePaletteDrag, type PaletteProps, } from "./palette.js";
|
|
32
|
+
export { PropertyPanel, type PropertyPanelProps } from "./property-panel.js";
|
|
33
|
+
export { LinkStylePanel, type LinkStylePanelProps } from "./edge-style-panel.js";
|
|
34
|
+
export { DiffPanel, type DiffPanelProps } from "./diff-panel.js";
|
|
35
|
+
export { ContextMenu, DEFAULT_CONTEXT_MENU, type ContextMenuItem, type ContextMenuContext, type ContextMenuProps, } from "./context-menu.js";
|
|
36
|
+
export { ContextMenuControllerProvider, useContextMenuController, type ContextMenuController, type ContextMenuOpenRequest, } from "./context-menu-controller.js";
|
|
37
|
+
export { HelpDialog, useHelpDialogHotkey, type HelpDialogProps, type HelpRow, type HelpSection, } from "./help-dialog.js";
|
|
38
|
+
export { CommandPalette } from "./command-palette.js";
|
|
39
|
+
export { ToastHost, useToast, useToastOptional, useEphemeralToast, type Toast, type ToastApi, type ToastKind, type ToastHostProps, } from "./toast.js";
|
|
40
|
+
export { MainMenu, type MainMenuProps, type MainMenuItemProps, type MainMenuItemLinkProps, type MainMenuSubmenuProps, } from "./main-menu.js";
|
|
41
|
+
export { Modal, type ModalProps } from "./modal.js";
|
|
42
|
+
export { Sidebar, type SidebarProps } from "./sidebar.js";
|
|
43
|
+
export { Tooltip, TooltipProvider, type TooltipProps, type TooltipSide, } from "./tooltip.js";
|
|
44
|
+
export { PALETTE_WIDTH, PALETTE_ITEM_SIZE, PROPERTY_PANEL_WIDTH, PROPERTY_SWATCH_SIZE, LAYER_PANEL_WIDTH, LAYER_TOGGLE_ICON_SIZE, LAYER_SWATCH_SIZE, COMMENTS_PANEL_WIDTH, TOOLBAR_SEPARATOR_HEIGHT, } from "./constants.js";
|
|
45
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
export { DiagramProvider, useDiagramContext, useDiagramContextOptional, useEditorSelector, } from "./context.js";
|
|
2
|
+
export { IconButton } from "./icon-button.js";
|
|
3
|
+
export { ButtonGroup } from "./button-group.js";
|
|
4
|
+
export { SegmentedControl, } from "./segmented-control.js";
|
|
5
|
+
export { Slider } from "./slider.js";
|
|
6
|
+
export { UILayer } from "./ui-layer.js";
|
|
7
|
+
export { TopBar, BottomBar } from "./diagram-bars.js";
|
|
8
|
+
export { HelpButton } from "./help-button.js";
|
|
9
|
+
export { ResetToContentButton } from "./reset-to-content-button.js";
|
|
10
|
+
export { LibraryPanel } from "./library-panel.js";
|
|
11
|
+
export { SelectionFloatingPanel, } from "./selection-floating-panel.js";
|
|
12
|
+
export { Popover } from "./popover.js";
|
|
13
|
+
export { ColorSwatchPicker, } from "./color-swatch-picker.js";
|
|
14
|
+
export { ELEMENT_PALETTE_LIGHT, ELEMENT_PALETTE_DARK, CANVAS_PALETTE_LIGHT, CANVAS_PALETTE_DARK, resolvePaletteTheme, } from "./color-palette.js";
|
|
15
|
+
export { DiagramRoot, DiagramSurface, } from "./diagram-root.js";
|
|
16
|
+
export { DiagramCanvas } from "./diagram-canvas.js";
|
|
17
|
+
export { useDiagram, useDiagramOptional, useScene, useSelection, useMode, useHistory, useLayers, useActiveLayerId, useAnnotations, useSelectedAnnotation, useSelectedLink, useMobileLayout, } from "./hooks.js";
|
|
18
|
+
export { LayerPanel } from "./layer-panel.js";
|
|
19
|
+
export { CommentsPanel, CommentsPopover, } from "./comments-panel.js";
|
|
20
|
+
export { VersionPanel, useSnapshotStore } from "./versioning.js";
|
|
21
|
+
export { MergeDialog } from "./merge-dialog.js";
|
|
22
|
+
export { BottomSheet } from "./bottom-sheet.js";
|
|
23
|
+
export { FramePanel } from "./frame-panel.js";
|
|
24
|
+
export { Markdown } from "./markdown.js";
|
|
25
|
+
export { TextEditorOverlay } from "./text-editor-overlay.js";
|
|
26
|
+
export { FrameNameEditorOverlay } from "./frame-name-editor-overlay.js";
|
|
27
|
+
export { LinkHoverPopup } from "./link-hover-popup.js";
|
|
28
|
+
export { LinkDropShapeMenu } from "./link-drop-shape-menu.js";
|
|
29
|
+
export { LinkCaptionEditor } from "./link-caption-editor.js";
|
|
30
|
+
export { Toolbar, DEFAULT_TOOLBAR, DEFAULT_VERTICAL_TOOLBAR, openImageFilePicker, ZoomWidget, ZoomInButton, ZoomOutButton, ResetZoomButton, ZoomToFitButton, ZoomDisplay, FloatingZoomControls, } from "./toolbar.js";
|
|
31
|
+
export { Palette, usePaletteDropHandler, usePalettePlacement, usePaletteDrag, getActivePaletteDrag, subscribePaletteDrag, } from "./palette.js";
|
|
32
|
+
export { PropertyPanel } from "./property-panel.js";
|
|
33
|
+
export { LinkStylePanel } from "./edge-style-panel.js";
|
|
34
|
+
export { DiffPanel } from "./diff-panel.js";
|
|
35
|
+
export { ContextMenu, DEFAULT_CONTEXT_MENU, } from "./context-menu.js";
|
|
36
|
+
export { ContextMenuControllerProvider, useContextMenuController, } from "./context-menu-controller.js";
|
|
37
|
+
export { HelpDialog, useHelpDialogHotkey, } from "./help-dialog.js";
|
|
38
|
+
export { CommandPalette } from "./command-palette.js";
|
|
39
|
+
export { ToastHost, useToast, useToastOptional, useEphemeralToast, } from "./toast.js";
|
|
40
|
+
export { MainMenu, } from "./main-menu.js";
|
|
41
|
+
export { Modal } from "./modal.js";
|
|
42
|
+
export { Sidebar } from "./sidebar.js";
|
|
43
|
+
export { Tooltip, TooltipProvider, } from "./tooltip.js";
|
|
44
|
+
// Tunable layout sizes for the built-in panels and toolbar.
|
|
45
|
+
export { PALETTE_WIDTH, PALETTE_ITEM_SIZE, PROPERTY_PANEL_WIDTH, PROPERTY_SWATCH_SIZE, LAYER_PANEL_WIDTH, LAYER_TOGGLE_ICON_SIZE, LAYER_SWATCH_SIZE, COMMENTS_PANEL_WIDTH, TOOLBAR_SEPARATOR_HEIGHT, } from "./constants.js";
|
|
46
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type CSSProperties } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Read-write list of scene layers. Click a row to make it active; click
|
|
4
|
+
* the eye / lock icons to toggle visibility / lock; double-click the
|
|
5
|
+
* name to rename; trash to delete (the panel guards against removing
|
|
6
|
+
* the last layer). "+" at the top creates a new layer.
|
|
7
|
+
*/
|
|
8
|
+
export interface LayerPanelProps {
|
|
9
|
+
readonly style?: CSSProperties;
|
|
10
|
+
readonly className?: string;
|
|
11
|
+
}
|
|
12
|
+
export declare const LayerPanel: ({ style, className }: LayerPanelProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
//# sourceMappingURL=layer-panel.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layer-panel.d.ts","sourceRoot":"","sources":["../src/layer-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAcrD;;;;;GAKG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAC;IAC/B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,eAAO,MAAM,UAAU,GAAI,sBAAsB,eAAe,4CA6E/D,CAAC"}
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState } from "react";
|
|
3
|
+
import { Eye, EyeOff, Lock, Trash2, Unlock } from "lucide-react";
|
|
4
|
+
const LAYER_GLYPH_SIZE = 14;
|
|
5
|
+
const LAYER_GLYPH_STROKE = 1.75;
|
|
6
|
+
import { useActiveLayerId, useDiagramOptional, useLayers } from "./hooks.js";
|
|
7
|
+
import { LAYER_PANEL_WIDTH, LAYER_SWATCH_SIZE, LAYER_TOGGLE_ICON_SIZE, } from "./constants.js";
|
|
8
|
+
export const LayerPanel = ({ style, className }) => {
|
|
9
|
+
const editor = useDiagramOptional();
|
|
10
|
+
const layers = useLayers();
|
|
11
|
+
const activeId = useActiveLayerId();
|
|
12
|
+
const [renamingId, setRenamingId] = useState(null);
|
|
13
|
+
const containerStyle = {
|
|
14
|
+
width: LAYER_PANEL_WIDTH,
|
|
15
|
+
padding: 0,
|
|
16
|
+
background: "var(--panel, #161616)",
|
|
17
|
+
color: "var(--text, #ddd)",
|
|
18
|
+
borderLeft: "1px solid var(--border, #2a2a2a)",
|
|
19
|
+
display: "flex",
|
|
20
|
+
flexDirection: "column",
|
|
21
|
+
minHeight: 0,
|
|
22
|
+
fontSize: 12,
|
|
23
|
+
...style,
|
|
24
|
+
};
|
|
25
|
+
return (_jsxs("aside", { className: className, style: containerStyle, children: [_jsxs("header", { style: {
|
|
26
|
+
margin: 0,
|
|
27
|
+
padding: "10px 12px",
|
|
28
|
+
fontSize: 11,
|
|
29
|
+
textTransform: "uppercase",
|
|
30
|
+
letterSpacing: 0.5,
|
|
31
|
+
color: "var(--muted, #888)",
|
|
32
|
+
borderBottom: "1px solid var(--border, #2a2a2a)",
|
|
33
|
+
display: "flex",
|
|
34
|
+
justifyContent: "space-between",
|
|
35
|
+
alignItems: "center",
|
|
36
|
+
}, children: [_jsx("span", { children: "Layers" }), _jsx("button", { type: "button", title: "New layer", disabled: !editor, onClick: () => editor?.createLayer(`Layer ${layers.length + 1}`), style: iconButtonStyle, children: "+" })] }), _jsx("div", { style: { flex: "1 1 auto", overflowY: "auto", padding: "4px 0" }, children: [...layers].reverse().map((layer) => (_jsx(LayerRow, { layer: layer, active: layer.id === activeId, renaming: renamingId === layer.id, onActivate: () => editor?.setActiveLayer(layer.id), onToggleVisible: () => editor?.toggleLayerVisibility(layer.id), onToggleLock: () => editor?.toggleLayerLock(layer.id), onStartRename: () => { setRenamingId(layer.id); }, onCommitRename: (name) => {
|
|
37
|
+
editor?.renameLayer(layer.id, name);
|
|
38
|
+
setRenamingId(null);
|
|
39
|
+
}, onCancelRename: () => { setRenamingId(null); }, onDelete: layers.length > 1
|
|
40
|
+
? () => {
|
|
41
|
+
if (window.confirm(`Delete layer "${layer.name}" and everything in it?`)) {
|
|
42
|
+
editor?.removeLayer(layer.id);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
: null }, layer.id))) })] }));
|
|
46
|
+
};
|
|
47
|
+
const LayerRow = ({ layer, active, renaming, onActivate, onToggleVisible, onToggleLock, onStartRename, onCommitRename, onCancelRename, onDelete, }) => {
|
|
48
|
+
return (_jsxs("div", { style: {
|
|
49
|
+
display: "flex",
|
|
50
|
+
alignItems: "center",
|
|
51
|
+
gap: 6,
|
|
52
|
+
padding: "6px 10px",
|
|
53
|
+
background: active ? "var(--cursor-bg, rgba(26,115,232,0.14))" : "transparent",
|
|
54
|
+
borderLeft: `3px solid ${active ? "var(--accent, #1a73e8)" : "transparent"}`,
|
|
55
|
+
cursor: "pointer",
|
|
56
|
+
}, onClick: onActivate, children: [_jsx(IconBtn, { title: layer.visible ? "Hide layer" : "Show layer", onClick: (ev) => {
|
|
57
|
+
ev.stopPropagation();
|
|
58
|
+
onToggleVisible();
|
|
59
|
+
}, muted: !layer.visible, children: layer.visible ? (_jsx(Eye, { size: LAYER_GLYPH_SIZE, strokeWidth: LAYER_GLYPH_STROKE })) : (_jsx(EyeOff, { size: LAYER_GLYPH_SIZE, strokeWidth: LAYER_GLYPH_STROKE })) }), _jsx(IconBtn, { title: layer.locked ? "Unlock layer" : "Lock layer", onClick: (ev) => {
|
|
60
|
+
ev.stopPropagation();
|
|
61
|
+
onToggleLock();
|
|
62
|
+
}, muted: !layer.locked, children: layer.locked ? (_jsx(Lock, { size: LAYER_GLYPH_SIZE, strokeWidth: LAYER_GLYPH_STROKE })) : (_jsx(Unlock, { size: LAYER_GLYPH_SIZE, strokeWidth: LAYER_GLYPH_STROKE })) }), renaming ? (_jsx("input", { autoFocus: true, defaultValue: layer.name, onClick: (ev) => { ev.stopPropagation(); }, onBlur: (ev) => { onCommitRename(ev.currentTarget.value); }, onKeyDown: (ev) => {
|
|
63
|
+
if (ev.key === "Enter")
|
|
64
|
+
onCommitRename(ev.target.value);
|
|
65
|
+
else if (ev.key === "Escape")
|
|
66
|
+
onCancelRename();
|
|
67
|
+
}, style: {
|
|
68
|
+
flex: 1,
|
|
69
|
+
background: "var(--button-bg, #2a2a2a)",
|
|
70
|
+
color: "var(--text, #ddd)",
|
|
71
|
+
border: "1px solid var(--accent, #1a73e8)",
|
|
72
|
+
borderRadius: 3,
|
|
73
|
+
padding: "2px 4px",
|
|
74
|
+
font: "inherit",
|
|
75
|
+
minWidth: 0,
|
|
76
|
+
} })) : (_jsx("span", { style: {
|
|
77
|
+
flex: 1,
|
|
78
|
+
minWidth: 0,
|
|
79
|
+
overflow: "hidden",
|
|
80
|
+
textOverflow: "ellipsis",
|
|
81
|
+
whiteSpace: "nowrap",
|
|
82
|
+
opacity: layer.visible ? 1 : 0.5,
|
|
83
|
+
}, onDoubleClick: (ev) => {
|
|
84
|
+
ev.stopPropagation();
|
|
85
|
+
onStartRename();
|
|
86
|
+
}, children: layer.name })), onDelete ? (_jsx(IconBtn, { title: "Delete layer", onClick: (ev) => {
|
|
87
|
+
ev.stopPropagation();
|
|
88
|
+
onDelete();
|
|
89
|
+
}, children: _jsx(Trash2, { size: LAYER_GLYPH_SIZE, strokeWidth: LAYER_GLYPH_STROKE }) })) : null] }));
|
|
90
|
+
};
|
|
91
|
+
const iconButtonStyle = {
|
|
92
|
+
background: "transparent",
|
|
93
|
+
color: "var(--text, #ddd)",
|
|
94
|
+
border: "1px solid var(--border, #2a2a2a)",
|
|
95
|
+
borderRadius: 3,
|
|
96
|
+
width: LAYER_TOGGLE_ICON_SIZE,
|
|
97
|
+
height: LAYER_TOGGLE_ICON_SIZE,
|
|
98
|
+
cursor: "pointer",
|
|
99
|
+
font: "inherit",
|
|
100
|
+
fontSize: 12,
|
|
101
|
+
padding: 0,
|
|
102
|
+
};
|
|
103
|
+
const IconBtn = ({ title, onClick, children, muted, }) => (_jsx("button", { type: "button", title: title, onClick: onClick, style: {
|
|
104
|
+
...iconButtonStyle,
|
|
105
|
+
opacity: muted ? 0.4 : 1,
|
|
106
|
+
width: LAYER_SWATCH_SIZE,
|
|
107
|
+
height: LAYER_SWATCH_SIZE,
|
|
108
|
+
}, children: children }));
|
|
109
|
+
//# sourceMappingURL=layer-panel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layer-panel.js","sourceRoot":"","sources":["../src/layer-panel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { type CSSProperties } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Slide-in side library panel. Opened by a host button, closed by the
|
|
4
|
+
* panel's own ✕ — it does NOT auto-close on canvas clicks. A floating
|
|
5
|
+
* overlay (no dock / pin). Header carries:
|
|
6
|
+
*
|
|
7
|
+
* • a live search input that filters templates by name / category /
|
|
8
|
+
* tags (case-insensitive substring);
|
|
9
|
+
* • optional Import button + Close.
|
|
10
|
+
*
|
|
11
|
+
* Default `side="right"`; hosts that prefer a left layout override.
|
|
12
|
+
*/
|
|
13
|
+
export interface LibraryPanelProps {
|
|
14
|
+
readonly open: boolean;
|
|
15
|
+
readonly onClose: () => void;
|
|
16
|
+
/** Side the panel anchors to. Default `"right"`. */
|
|
17
|
+
readonly side?: "left" | "right";
|
|
18
|
+
/**
|
|
19
|
+
* Sheet mode: render as plain flex content that fills its parent
|
|
20
|
+
* (no fixed floating-pill chrome) — for hosting inside a `BottomSheet`
|
|
21
|
+
* on mobile. The parent provides the surface / position.
|
|
22
|
+
*/
|
|
23
|
+
readonly sheet?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* Called when the user clicks "Import". Hosts wire this to a file
|
|
26
|
+
* picker / OS dialog. Skipped when omitted (button hidden).
|
|
27
|
+
*/
|
|
28
|
+
readonly onImport?: () => void;
|
|
29
|
+
/** Override panel width (default 240 px via CSS). */
|
|
30
|
+
readonly style?: CSSProperties;
|
|
31
|
+
}
|
|
32
|
+
export declare const LibraryPanel: ({ open, onClose, side, sheet, onImport, style, }: LibraryPanelProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
33
|
+
//# sourceMappingURL=library-panel.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"library-panel.d.ts","sourceRoot":"","sources":["../src/library-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAQxE;;;;;;;;;;GAUG;AACH,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC;IAC7B,oDAAoD;IACpD,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACjC;;;;OAIG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,qDAAqD;IACrD,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAC;CAChC;AAED,eAAO,MAAM,YAAY,GAAI,kDAO1B,iBAAiB,mDA8DnB,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef, useState } from "react";
|
|
3
|
+
import { Search, Upload, X } from "lucide-react";
|
|
4
|
+
import { Palette } from "./palette.js";
|
|
5
|
+
import { IconButton } from "./icon-button.js";
|
|
6
|
+
const SIDE_PANEL_ICON_SIZE = 14;
|
|
7
|
+
const SIDE_PANEL_ICON_STROKE = 1.75;
|
|
8
|
+
export const LibraryPanel = ({ open, onClose, side = "right", sheet = false, onImport, style, }) => {
|
|
9
|
+
// Search query, cleared when the panel closes. Passed to the Palette,
|
|
10
|
+
// which switches to flat-match mode.
|
|
11
|
+
const [search, setSearch] = useState("");
|
|
12
|
+
useEffect(() => {
|
|
13
|
+
if (!open)
|
|
14
|
+
setSearch("");
|
|
15
|
+
}, [open]);
|
|
16
|
+
// Focus the search input on open so the user can start typing immediately.
|
|
17
|
+
const searchRef = useRef(null);
|
|
18
|
+
useEffect(() => {
|
|
19
|
+
if (open)
|
|
20
|
+
searchRef.current?.focus();
|
|
21
|
+
}, [open]);
|
|
22
|
+
if (!open)
|
|
23
|
+
return null;
|
|
24
|
+
// Sheet mode fills its parent (BottomSheet) — no side anchoring / pill chrome.
|
|
25
|
+
const variantClass = sheet
|
|
26
|
+
? "du-side-panel-sheet"
|
|
27
|
+
: side === "right"
|
|
28
|
+
? "du-side-panel-right"
|
|
29
|
+
: "du-side-panel-left";
|
|
30
|
+
return (_jsxs("aside", { className: `du-side-panel ${variantClass}`, style: style, children: [_jsx("header", { className: "du-side-panel-header", children: _jsxs("div", { style: { display: "inline-flex", gap: 4 }, children: [onImport ? (_jsx(IconButton, { label: "Import templates", size: "sm", onClick: onImport, children: _jsx(Upload, { size: SIDE_PANEL_ICON_SIZE, strokeWidth: SIDE_PANEL_ICON_STROKE }) })) : null, _jsx(IconButton, { label: "Close library", size: "sm", onClick: onClose, children: _jsx(X, { size: SIDE_PANEL_ICON_SIZE, strokeWidth: SIDE_PANEL_ICON_STROKE }) })] }) }), _jsxs("div", { className: "du-side-panel-search", children: [_jsx(Search, { size: SIDE_PANEL_ICON_SIZE, strokeWidth: SIDE_PANEL_ICON_STROKE, className: "du-side-panel-search-icon", "aria-hidden": true }), _jsx("input", { ref: searchRef, type: "search", value: search, placeholder: "Search templates\u2026", "aria-label": "Search templates", onChange: (ev) => { setSearch(ev.target.value); }, onKeyDown: (ev) => {
|
|
31
|
+
if (ev.key === "Escape" && search) {
|
|
32
|
+
ev.stopPropagation();
|
|
33
|
+
setSearch("");
|
|
34
|
+
}
|
|
35
|
+
} })] }), _jsx("div", { className: "du-side-panel-body du-side-panel-body-flush", children: _jsx(Palette, { searchQuery: search, layout: "list" }) })] }));
|
|
36
|
+
};
|
|
37
|
+
//# sourceMappingURL=library-panel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"library-panel.js","sourceRoot":"","sources":["../src/library-panel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAsB,MAAM,OAAO,CAAC;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C,MAAM,oBAAoB,GAAG,EAAE,CAAC;AAChC,MAAM,sBAAsB,GAAG,IAAI,CAAC;AAiCpC,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,IAAI,EACJ,OAAO,EACP,IAAI,GAAG,OAAO,EACd,KAAK,GAAG,KAAK,EACb,QAAQ,EACR,KAAK,GACa,EAAE,EAAE;IACtB,sEAAsE;IACtE,qCAAqC;IACrC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACzC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,IAAI;YAAE,SAAS,CAAC,EAAE,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,2EAA2E;IAC3E,MAAM,SAAS,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACjD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI;YAAE,SAAS,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IACvC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IACvB,+EAA+E;IAC/E,MAAM,YAAY,GAAG,KAAK;QACxB,CAAC,CAAC,qBAAqB;QACvB,CAAC,CAAC,IAAI,KAAK,OAAO;YAChB,CAAC,CAAC,qBAAqB;YACvB,CAAC,CAAC,oBAAoB,CAAC;IAC3B,OAAO,CACL,iBAAO,SAAS,EAAE,iBAAiB,YAAY,EAAE,EAAE,KAAK,EAAE,KAAK,aAC7D,iBAAQ,SAAS,EAAC,sBAAsB,YACtC,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,EAAE,CAAC,EAAE,aAC3C,QAAQ,CAAC,CAAC,CAAC,CACV,KAAC,UAAU,IAAC,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAE,QAAQ,YAC9D,KAAC,MAAM,IAAC,IAAI,EAAE,oBAAoB,EAAE,WAAW,EAAE,sBAAsB,GAAI,GAChE,CACd,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,UAAU,IAAC,KAAK,EAAC,eAAe,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAE,OAAO,YAC1D,KAAC,CAAC,IAAC,IAAI,EAAE,oBAAoB,EAAE,WAAW,EAAE,sBAAsB,GAAI,GAC3D,IACT,GACC,EACT,eAAK,SAAS,EAAC,sBAAsB,aACnC,KAAC,MAAM,IACL,IAAI,EAAE,oBAAoB,EAC1B,WAAW,EAAE,sBAAsB,EACnC,SAAS,EAAC,2BAA2B,wBAErC,EACF,gBACE,GAAG,EAAE,SAAS,EACd,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,MAAM,EACb,WAAW,EAAC,wBAAmB,gBACpB,kBAAkB,EAC7B,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EACjD,SAAS,EAAE,CAAC,EAAE,EAAE,EAAE;4BAChB,IAAI,EAAE,CAAC,GAAG,KAAK,QAAQ,IAAI,MAAM,EAAE,CAAC;gCAClC,EAAE,CAAC,eAAe,EAAE,CAAC;gCACrB,SAAS,CAAC,EAAE,CAAC,CAAC;4BAChB,CAAC;wBACH,CAAC,GACD,IACE,EACN,cAAK,SAAS,EAAC,6CAA6C,YAC1D,KAAC,OAAO,IAAC,WAAW,EAAE,MAAM,EAAE,MAAM,EAAC,MAAM,GAAG,GAC1C,IACA,CACT,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Inline editor for a link's caption. Opens on double-click of a link
|
|
3
|
+
* (state layer sets `editor.editingLinkCaption`). Renders a small input at
|
|
4
|
+
* the link's label point (midpoint of its path). Enter / blur commits,
|
|
5
|
+
* Escape cancels. Empty text removes the label. Portaled to body.
|
|
6
|
+
*/
|
|
7
|
+
export declare const LinkCaptionEditor: () => import("react").ReactPortal | null;
|
|
8
|
+
//# sourceMappingURL=link-caption-editor.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"link-caption-editor.d.ts","sourceRoot":"","sources":["../src/link-caption-editor.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,0CAkE7B,CAAC"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useReducer, useRef, useState } from "react";
|
|
3
|
+
import { createPortal } from "react-dom";
|
|
4
|
+
import { useDiagramOptional } from "./hooks.js";
|
|
5
|
+
/**
|
|
6
|
+
* Inline editor for a link's caption. Opens on double-click of a link
|
|
7
|
+
* (state layer sets `editor.editingLinkCaption`). Renders a small input at
|
|
8
|
+
* the link's label point (midpoint of its path). Enter / blur commits,
|
|
9
|
+
* Escape cancels. Empty text removes the label. Portaled to body.
|
|
10
|
+
*/
|
|
11
|
+
export const LinkCaptionEditor = () => {
|
|
12
|
+
const editor = useDiagramOptional();
|
|
13
|
+
const [, bump] = useReducer((x) => x + 1, 0);
|
|
14
|
+
const [value, setValue] = useState("");
|
|
15
|
+
const inputRef = useRef(null);
|
|
16
|
+
useEffect(() => {
|
|
17
|
+
if (!editor)
|
|
18
|
+
return undefined;
|
|
19
|
+
return editor.on("change", () => { bump(); });
|
|
20
|
+
}, [editor]);
|
|
21
|
+
const editingId = editor?.editingLinkCaption ?? null;
|
|
22
|
+
// Seed the field and focus whenever a new caption edit begins.
|
|
23
|
+
useEffect(() => {
|
|
24
|
+
if (!editor || editingId === null)
|
|
25
|
+
return;
|
|
26
|
+
const edge = editor.scene.links.get(editingId);
|
|
27
|
+
setValue(edge?.label?.text ?? "");
|
|
28
|
+
const t = setTimeout(() => {
|
|
29
|
+
inputRef.current?.focus();
|
|
30
|
+
inputRef.current?.select();
|
|
31
|
+
}, 0);
|
|
32
|
+
return () => { clearTimeout(t); };
|
|
33
|
+
}, [editor, editingId]);
|
|
34
|
+
if (!editor || editingId === null)
|
|
35
|
+
return null;
|
|
36
|
+
const host = editor.hostElement;
|
|
37
|
+
if (!host)
|
|
38
|
+
return null;
|
|
39
|
+
const world = editor.linkLabelWorld(editingId);
|
|
40
|
+
if (!world)
|
|
41
|
+
return null;
|
|
42
|
+
const v = editor.scene.viewport;
|
|
43
|
+
const hostRect = host.getBoundingClientRect();
|
|
44
|
+
const sx = (world.x - v.pan.x) * v.zoom + hostRect.left;
|
|
45
|
+
const sy = (world.y - v.pan.y) * v.zoom + hostRect.top;
|
|
46
|
+
const commit = () => { editor.commitLinkCaptionEdit(value); };
|
|
47
|
+
return createPortal(_jsx("input", { ref: inputRef, className: "du-link-caption-input", value: value, placeholder: "Label", style: {
|
|
48
|
+
position: "fixed",
|
|
49
|
+
left: sx,
|
|
50
|
+
top: sy,
|
|
51
|
+
transform: "translate(-50%, -50%)",
|
|
52
|
+
zIndex: 1602,
|
|
53
|
+
}, onChange: (e) => { setValue(e.target.value); }, onBlur: commit, onKeyDown: (e) => {
|
|
54
|
+
if (e.key === "Enter") {
|
|
55
|
+
e.preventDefault();
|
|
56
|
+
commit();
|
|
57
|
+
}
|
|
58
|
+
else if (e.key === "Escape") {
|
|
59
|
+
e.preventDefault();
|
|
60
|
+
editor.cancelLinkCaptionEdit();
|
|
61
|
+
}
|
|
62
|
+
e.stopPropagation();
|
|
63
|
+
} }), document.body);
|
|
64
|
+
};
|
|
65
|
+
//# sourceMappingURL=link-caption-editor.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"link-caption-editor.js","sourceRoot":"","sources":["../src/link-caption-editor.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Shape picker shown after a link is dropped on empty canvas. The
|
|
3
|
+
* dropped link keeps a free end; picking a shape here creates it at the
|
|
4
|
+
* drop point and re-points the link end to it (one undo step).
|
|
5
|
+
* Dismissing (Esc / click-away) leaves the free-ended link.
|
|
6
|
+
*
|
|
7
|
+
* Reuses the global template registry's `basic` category — same
|
|
8
|
+
* factories and icons as the main palette. Positioned in screen space
|
|
9
|
+
* from the drop world-point and viewport, portaled to body.
|
|
10
|
+
*/
|
|
11
|
+
export declare const LinkDropShapeMenu: () => import("react").ReactPortal | null;
|
|
12
|
+
//# sourceMappingURL=link-drop-shape-menu.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"link-drop-shape-menu.d.ts","sourceRoot":"","sources":["../src/link-drop-shape-menu.tsx"],"names":[],"mappings":"AAKA;;;;;;;;;GASG;AACH,eAAO,MAAM,iBAAiB,0CAmE7B,CAAC"}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useReducer } from "react";
|
|
3
|
+
import { createPortal } from "react-dom";
|
|
4
|
+
import { defaultRegistry } from "@oh-just-another/templates";
|
|
5
|
+
import { useDiagramOptional } from "./hooks.js";
|
|
6
|
+
/**
|
|
7
|
+
* Shape picker shown after a link is dropped on empty canvas. The
|
|
8
|
+
* dropped link keeps a free end; picking a shape here creates it at the
|
|
9
|
+
* drop point and re-points the link end to it (one undo step).
|
|
10
|
+
* Dismissing (Esc / click-away) leaves the free-ended link.
|
|
11
|
+
*
|
|
12
|
+
* Reuses the global template registry's `basic` category — same
|
|
13
|
+
* factories and icons as the main palette. Positioned in screen space
|
|
14
|
+
* from the drop world-point and viewport, portaled to body.
|
|
15
|
+
*/
|
|
16
|
+
export const LinkDropShapeMenu = () => {
|
|
17
|
+
const editor = useDiagramOptional();
|
|
18
|
+
const [, bump] = useReducer((x) => x + 1, 0);
|
|
19
|
+
useEffect(() => {
|
|
20
|
+
if (!editor)
|
|
21
|
+
return undefined;
|
|
22
|
+
// Reflect open/close and follow pan/zoom while open.
|
|
23
|
+
const off = editor.on("change", () => { bump(); });
|
|
24
|
+
const onKey = (ev) => {
|
|
25
|
+
if (ev.key === "Escape" && editor.linkDropMenu)
|
|
26
|
+
editor.dismissLinkDropMenu();
|
|
27
|
+
};
|
|
28
|
+
window.addEventListener("keydown", onKey);
|
|
29
|
+
return () => {
|
|
30
|
+
off();
|
|
31
|
+
window.removeEventListener("keydown", onKey);
|
|
32
|
+
};
|
|
33
|
+
}, [editor]);
|
|
34
|
+
if (!editor)
|
|
35
|
+
return null;
|
|
36
|
+
const menu = editor.linkDropMenu;
|
|
37
|
+
if (!menu)
|
|
38
|
+
return null;
|
|
39
|
+
const host = editor.hostElement;
|
|
40
|
+
if (!host)
|
|
41
|
+
return null;
|
|
42
|
+
const v = editor.scene.viewport;
|
|
43
|
+
const hostRect = host.getBoundingClientRect();
|
|
44
|
+
const sx = (menu.world.x - v.pan.x) * v.zoom + hostRect.left;
|
|
45
|
+
const sy = (menu.world.y - v.pan.y) * v.zoom + hostRect.top;
|
|
46
|
+
const templates = defaultRegistry.byCategory("basic");
|
|
47
|
+
return createPortal(_jsxs(_Fragment, { children: [_jsx("div", { className: "du-link-drop-backdrop", style: { position: "fixed", inset: 0, zIndex: 1600 }, onPointerDown: () => { editor.dismissLinkDropMenu(); } }), _jsx("div", { className: "du-link-drop-menu", role: "menu", "aria-label": "Create shape", style: {
|
|
48
|
+
position: "fixed",
|
|
49
|
+
left: sx,
|
|
50
|
+
top: sy,
|
|
51
|
+
transform: "translate(-50%, -100%)",
|
|
52
|
+
zIndex: 1601,
|
|
53
|
+
}, onPointerDown: (e) => { e.stopPropagation(); }, children: templates.map((t) => (_jsx("button", { type: "button", className: "du-link-drop-item", title: t.name, "aria-label": `Create ${t.name}`, onClick: () => { editor.placeShapeAtLinkDrop((ctx) => t.factory(ctx)); }, dangerouslySetInnerHTML: { __html: t.icon } }, t.id))) })] }), document.body);
|
|
54
|
+
};
|
|
55
|
+
//# sourceMappingURL=link-drop-shape-menu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"link-drop-shape-menu.js","sourceRoot":"","sources":["../src/link-drop-shape-menu.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,eAAe,EAAiB,MAAM,4BAA4B,CAAC;AAC5E,OAAO,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAEhD;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IACpC,MAAM,CAAC,EAAE,IAAI,CAAC,GAAG,UAAU,CAAC,CAAC,CAAS,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IAErD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,MAAM;YAAE,OAAO,SAAS,CAAC;QAC9B,qDAAqD;QACrD,MAAM,GAAG,GAAG,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QACnD,MAAM,KAAK,GAAG,CAAC,EAAiB,EAAE,EAAE;YAClC,IAAI,EAAE,CAAC,GAAG,KAAK,QAAQ,IAAI,MAAM,CAAC,YAAY;gBAAE,MAAM,CAAC,mBAAmB,EAAE,CAAC;QAC/E,CAAC,CAAC;QACF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;QAC1C,OAAO,GAAG,EAAE;YACV,GAAG,EAAE,CAAC;YACN,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;QAC/C,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IACzB,MAAM,IAAI,GAAG,MAAM,CAAC,YAAY,CAAC;IACjC,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IACvB,MAAM,IAAI,GAAG,MAAM,CAAC,WAAiC,CAAC;IACtD,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IAEvB,MAAM,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;IAChC,MAAM,QAAQ,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC9C,MAAM,EAAE,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC;IAC7D,MAAM,EAAE,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,QAAQ,CAAC,GAAG,CAAC;IAE5D,MAAM,SAAS,GAAwB,eAAe,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;IAE3E,OAAO,YAAY,CACjB,8BAEE,cACE,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,EACpD,aAAa,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC,mBAAmB,EAAE,CAAC,CAAC,CAAC,GACtD,EACF,cACE,SAAS,EAAC,mBAAmB,EAC7B,IAAI,EAAC,MAAM,gBACA,cAAc,EACzB,KAAK,EAAE;oBACL,QAAQ,EAAE,OAAO;oBACjB,IAAI,EAAE,EAAE;oBACR,GAAG,EAAE,EAAE;oBACP,SAAS,EAAE,wBAAwB;oBACnC,MAAM,EAAE,IAAI;iBACb,EACD,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,eAAe,EAAE,CAAC,CAAC,CAAC,YAE7C,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACpB,iBAEE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,mBAAmB,EAC7B,KAAK,EAAE,CAAC,CAAC,IAAI,gBACD,UAAU,CAAC,CAAC,IAAI,EAAE,EAC9B,OAAO,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC,oBAAoB,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,EACxE,uBAAuB,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC,IAAI,EAAE,IANtC,CAAC,CAAC,EAAE,CAOT,CACH,CAAC,GACE,IACL,EACH,QAAQ,CAAC,IAAI,CACd,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"link-hover-popup.d.ts","sourceRoot":"","sources":["../src/link-hover-popup.tsx"],"names":[],"mappings":"AAqBA,eAAO,MAAM,cAAc,0CA+F1B,CAAC"}
|