@univerjs-pro/shape-editor-ui 0.25.0-insiders.20260604-29ebbff

package/lib/types/locale/en-US.d.ts

@@ -0,0 +1,340 @@
+declare const locale: {
+    'shape-editor-ui': {
+        title: string;
+        insertShape: string;
+        openPanel: string;
+        deleteShape: string;
+        hidePanel: string;
+        formatShape: string;
+        shapeStyle: string;
+        shapePosition: string;
+        toggleFlipH: string;
+        toggleFlipV: string;
+        rotateRight90: string;
+        rotateLeft90: string;
+        toggleTextVertical: string;
+        fill: {
+            title: string;
+            noFill: string;
+            solidFill: string;
+            gradientFill: string;
+            pictureFill: string;
+            patternFill: string;
+            color: string;
+            transparency: string;
+            picture: {
+                source: string;
+                insert: string;
+                tileAsTexture: string;
+                offsetX: string;
+                offsetY: string;
+                scaleX: string;
+                scaleY: string;
+                alignment: string;
+                rotateWithShape: string;
+                align: {
+                    tl: string;
+                    t: string;
+                    tr: string;
+                    l: string;
+                    ctr: string;
+                    r: string;
+                    bl: string;
+                    b: string;
+                    br: string;
+                };
+            };
+        };
+        line: {
+            title: string;
+            noLine: string;
+            solidLine: string;
+            gradientLine: string;
+            color: string;
+            transparency: string;
+            width: string;
+            dashType: {
+                title: string;
+                solid: string;
+                roundDot: string;
+                squareDot: string;
+                dash: string;
+                dashDot: string;
+                longDash: string;
+                longDashDot: string;
+                longDashDotDot: string;
+            };
+            capType: {
+                title: string;
+                flat: string;
+                round: string;
+                square: string;
+            };
+            joinType: {
+                title: string;
+                miter: string;
+                round: string;
+                bevel: string;
+            };
+            beginArrowType: string;
+            beginArrowSize: string;
+            endArrowType: string;
+            endArrowSize: string;
+            arrowType: {
+                none: string;
+                arrow: string;
+                openArrow: string;
+                stealthArrow: string;
+                diamondArrow: string;
+                ovalArrow: string;
+            };
+            arrowSize: {
+                small: string;
+                medium: string;
+                large: string;
+            };
+            sketchType: {
+                title: string;
+                none: string;
+                curved: string;
+                freehand: string;
+                handDrawn: string;
+            };
+        };
+        shape: {
+            group: {
+                line: string;
+                rectangle: string;
+                basicShape: string;
+                blockArrow: string;
+                equationShape: string;
+                flowchart: string;
+                starAndBanner: string;
+                callout: string;
+                other: string;
+            };
+            type: {
+                line: string;
+                'straight-connector1': string;
+                'straight-connector2': string;
+                'bent-connector3': string;
+                'bent-connector3-arrow1': string;
+                'bent-connector3-arrow2': string;
+                'curved-connector3': string;
+                'curved-connector3-arrow1': string;
+                'curved-connector3-arrow2': string;
+                rect: string;
+                'round-rect': string;
+                'snip1-rect': string;
+                'snip2-same-rect': string;
+                'snip2-diag-rect': string;
+                'snip-round-rect': string;
+                'round1-rect': string;
+                'round2-same-rect': string;
+                'round2-diag-rect': string;
+                'rect-textbox-horizontal': string;
+                'rect-textbox-vertical': string;
+                ellipse: string;
+                triangle: string;
+                'rt-triangle': string;
+                parallelogram: string;
+                trapezoid: string;
+                'non-isosceles-trapezoid': string;
+                diamond: string;
+                pentagon: string;
+                hexagon: string;
+                heptagon: string;
+                octagon: string;
+                decagon: string;
+                dodecagon: string;
+                pie: string;
+                chord: string;
+                teardrop: string;
+                frame: string;
+                'half-frame': string;
+                corner: string;
+                'diag-stripe': string;
+                plus: string;
+                plaque: string;
+                can: string;
+                cube: string;
+                bevel: string;
+                donut: string;
+                'no-smoking': string;
+                'block-arc': string;
+                'folder-corner': string;
+                'smiley-face': string;
+                heart: string;
+                'lightning-bolt': string;
+                sun: string;
+                moon: string;
+                cloud: string;
+                arc: string;
+                'bracket-pair': string;
+                'brace-pair': string;
+                'left-bracket': string;
+                'right-bracket': string;
+                'left-brace': string;
+                'right-brace': string;
+                'right-arrow': string;
+                'left-arrow': string;
+                'up-arrow': string;
+                'down-arrow': string;
+                'left-right-arrow': string;
+                'up-down-arrow': string;
+                'quad-arrow': string;
+                'left-right-up-arrow': string;
+                'bent-arrow': string;
+                'uturn-arrow': string;
+                'left-up-arrow': string;
+                'bent-up-arrow': string;
+                'curved-right-arrow': string;
+                'curved-left-arrow': string;
+                'curved-up-arrow': string;
+                'curved-down-arrow': string;
+                'striped-right-arrow': string;
+                'notched-right-arrow': string;
+                'home-plate': string;
+                chevron: string;
+                'right-arrow-callout': string;
+                'down-arrow-callout': string;
+                'left-arrow-callout': string;
+                'up-arrow-callout': string;
+                'left-right-arrow-callout': string;
+                'quad-arrow-callout': string;
+                'circular-arrow': string;
+                'math-plus': string;
+                'math-minus': string;
+                'math-multiply': string;
+                'math-divide': string;
+                'math-equal': string;
+                'math-not-equal': string;
+                'flow-chart-process': string;
+                'flow-chart-alternate-process': string;
+                'flow-chart-decision': string;
+                'flow-chart-input-output': string;
+                'flow-chart-predefined-process': string;
+                'flow-chart-internal-storage': string;
+                'flow-chart-document': string;
+                'flow-chart-multidocument': string;
+                'flow-chart-terminator': string;
+                'flow-chart-preparation': string;
+                'flow-chart-manual-input': string;
+                'flow-chart-manual-operation': string;
+                'flow-chart-connector': string;
+                'flow-chart-offpage-connector': string;
+                'flow-chart-punched-card': string;
+                'flow-chart-punched-tape': string;
+                'flow-chart-summing-junction': string;
+                'flow-chart-or': string;
+                'flow-chart-collate': string;
+                'flow-chart-sort': string;
+                'flow-chart-extract': string;
+                'flow-chart-merge': string;
+                'flow-chart-online-storage': string;
+                'flow-chart-delay': string;
+                'flow-chart-magnetic-tape': string;
+                'flow-chart-magnetic-disk': string;
+                'flow-chart-magnetic-drum': string;
+                'flow-chart-display': string;
+                'irregular-seal1': string;
+                'irregular-seal2': string;
+                star4: string;
+                star5: string;
+                star6: string;
+                star7: string;
+                star8: string;
+                star10: string;
+                star12: string;
+                star16: string;
+                star24: string;
+                star32: string;
+                ribbon2: string;
+                ribbon: string;
+                'ellipse-ribbon2': string;
+                'ellipse-ribbon': string;
+                'vertical-scroll': string;
+                'horizontal-scroll': string;
+                wave: string;
+                'double-wave': string;
+                'wedge-rect-callout': string;
+                'wedge-round-rect-callout': string;
+                'wedge-ellipse-callout': string;
+                'cloud-callout': string;
+                'border-callout1': string;
+                'border-callout2': string;
+                'border-callout3': string;
+                'accent-callout1': string;
+                'accent-callout2': string;
+                'accent-callout3': string;
+                callout1: string;
+                callout2: string;
+                callout3: string;
+                'accent-border-callout1': string;
+                'accent-border-callout2': string;
+                'accent-border-callout3': string;
+                'left-circular-arrow': string;
+                'left-right-circular-arrow': string;
+                'swoosh-arrow': string;
+                'left-right-ribbon': string;
+                'pie-wedge': string;
+                funnel: string;
+                gear6: string;
+                gear9: string;
+                'corner-tabs': string;
+                'action-button-back-previous': string;
+                'action-button-forward-next': string;
+                'action-button-beginning': string;
+                'action-button-end': string;
+                'action-button-home': string;
+                'action-button-information': string;
+                'action-button-return': string;
+                'action-button-movie': string;
+                'action-button-document': string;
+                'action-button-sound': string;
+                'action-button-help': string;
+                'action-button-blank': string;
+                'chart-plus': string;
+                'chart-star': string;
+                'chart-x': string;
+                'flow-chart-offline-storage': string;
+                'line-inv': string;
+                'plaque-tabs': string;
+                'square-tabs': string;
+                'up-down-arrow-callout': string;
+            };
+        };
+        toolbar: {
+            alignLeft: string;
+            alignCenter: string;
+            alignRight: string;
+            alignJustify: string;
+            bold: string;
+            italic: string;
+            underline: string;
+            strikethrough: string;
+            subscript: string;
+            superscript: string;
+            textColor: string;
+            textBackgroundColor: string;
+            fillColor: string;
+            resetColor: string;
+        };
+        align: {
+            top: string;
+            middle: string;
+            bottom: string;
+        };
+        textWrap: {
+            inline: string;
+            square: string;
+            topAndBottom: string;
+            behindText: string;
+            inFrontText: string;
+        };
+        crop: {
+            shape: string;
+        };
+    };
+};
+export default locale;

package/lib/types/locale/es-ES.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/fa-IR.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/fr-FR.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/id-ID.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/it-IT.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/ja-JP.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/ko-KR.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/pl-PL.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/pt-BR.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/ru-RU.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/sk-SK.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/vi-VN.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/zh-CN.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/zh-HK.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/locale/zh-TW.d.ts

@@ -0,0 +1,3 @@
+import type enUS from './en-US';
+declare const locale: typeof enUS;
+export default locale;

package/lib/types/views/shape-editor-panel/ShapeEditorPanel.d.ts

@@ -0,0 +1,13 @@
+import type { IShapeData, ShapeTypeEnum } from '@univerjs-pro/engine-shape';
+import type { ReactNode } from 'react';
+import type { IShapeEditorUpdateHandlers } from './types';
+export interface IShapeEditPanelProps extends IShapeEditorUpdateHandlers {
+    shapeId: string;
+    shapeData: IShapeData;
+    shapeType: ShapeTypeEnum;
+    version: number;
+    disableShapeOption: boolean;
+    positionEditor?: ReactNode;
+    onUpdateShapeFillImage?: (image: HTMLImageElement) => void;
+}
+export declare function ShapeEditPanel(props: IShapeEditPanelProps): import("react/jsx-runtime").JSX.Element;

package/lib/types/views/shape-editor-panel/ShapeFillEditor.d.ts

@@ -0,0 +1,9 @@
+import type { IShapeData } from '@univerjs-pro/engine-shape';
+import type { IShapeEditorBaseProps } from './types';
+import { ShapeFillEnum } from '@univerjs-pro/engine-shape';
+export interface IShapeFillEditorProps extends IShapeEditorBaseProps {
+    isLineShape: boolean;
+    onUpdateShapeFillImage?: (image: HTMLImageElement) => void;
+}
+export declare function getInitialShapeFillType(shapeData: IShapeData): ShapeFillEnum;
+export declare function ShapeFillEditor(props: IShapeFillEditorProps): import("react/jsx-runtime").JSX.Element | null;

package/lib/types/views/shape-editor-panel/ShapeImageFillEditor.d.ts

@@ -0,0 +1,5 @@
+import type { IShapeEditorBaseProps } from './types';
+export interface IShapeImageFillEditorProps extends IShapeEditorBaseProps {
+    onUpdateShapeFillImage?: (image: HTMLImageElement) => void;
+}
+export declare function ShapeImageFillEditor(props: IShapeImageFillEditorProps): import("react/jsx-runtime").JSX.Element;

package/lib/types/views/shape-editor-panel/ShapeLineEditor.d.ts

@@ -0,0 +1,5 @@
+import type { IShapeEditorBaseProps } from './types';
+export interface IShapeLineEditorProps extends IShapeEditorBaseProps {
+    isLineShape: boolean;
+}
+export declare function ShapeLineEditor(props: IShapeLineEditorProps): import("react/jsx-runtime").JSX.Element;

package/lib/types/views/shape-editor-panel/types.d.ts

@@ -0,0 +1,13 @@
+import type { ICxnShapeData, IShapeData } from '@univerjs-pro/engine-shape';
+export interface IOldShapeData {
+    oldShapeData?: IShapeData;
+}
+export interface IShapeEditorUpdateHandlers {
+    onUpdateShapeData: (oldShapeJSON: IOldShapeData, shapeData?: IShapeData) => void;
+    onUpdateLineShapeData?: (oldShapeJSON: IOldShapeData, shapeData?: ICxnShapeData) => void;
+}
+export interface IShapeEditorBaseProps extends IShapeEditorUpdateHandlers {
+    shapeId: string;
+    shapeData: IShapeData;
+    disableShapeOption: boolean;
+}

package/lib/types/views/shape-floating-toolbar/ShapeFloatingToolbar.d.ts

@@ -0,0 +1,48 @@
+import type { IShapeData, ShapeTypeEnum } from '@univerjs-pro/engine-shape';
+import type { ITextStyle } from '@univerjs/core';
+import type { ReactNode } from 'react';
+import type { IShapeTextUpdateOptions } from './shape-floating-toolbar-utils';
+import { HorizontalAlign, VerticalAlign } from '@univerjs/core';
+export type IShapeFloatingToolbarWrappingStyle = string | number;
+export interface IShapeFloatingToolbarTextModel {
+    ha?: HorizontalAlign;
+    va?: VerticalAlign;
+}
+export interface IToolbarDropdownOption<T extends string | number> {
+    label: string;
+    value: T;
+    icon: ReactNode;
+}
+export interface IShapeFloatingToolbarProps {
+    shapeData: IShapeData;
+    shapeType: ShapeTypeEnum;
+    textStyle: ITextStyle;
+    textModel?: IShapeFloatingToolbarTextModel | null;
+    fontOptions: Array<{
+        label: string;
+        value: string;
+    }>;
+    wrappingStyle?: IShapeFloatingToolbarWrappingStyle;
+    wrappingStyleOptions?: Array<IToolbarDropdownOption<IShapeFloatingToolbarWrappingStyle>>;
+    enableShapeFillReset?: boolean;
+    enableShapeStrokeReset?: boolean;
+    enableTextBackgroundReset?: boolean;
+    deferUntilCollapsedStateLoaded?: boolean;
+    localePrefix?: string;
+    onUpdateShapeData: (oldShapeJSON: {
+        oldShapeData?: IShapeData;
+    }, shapeData?: IShapeData) => void;
+    onUpdateText: (params: IShapeTextUpdateOptions) => void;
+    onUpdateWrappingStyle?: (value: IShapeFloatingToolbarWrappingStyle) => void;
+    onOpenPanel?: () => void;
+    onDelete?: () => void;
+}
+declare function TextWrapShapeIcon(): import("react/jsx-runtime").JSX.Element;
+export declare function TextFillButton(props: {
+    title: string;
+    textStyle: ITextStyle;
+    fallbackColor: string;
+    onChange: (textStyle: ITextStyle) => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ShapeFloatingToolbar(props: IShapeFloatingToolbarProps): import("react/jsx-runtime").JSX.Element | null;
+export { TextWrapShapeIcon };

package/lib/types/views/shape-floating-toolbar/shape-floating-toolbar-utils.d.ts

@@ -0,0 +1,16 @@
+import type { IShapeData } from '@univerjs-pro/engine-shape';
+import type { IDocumentData, ITextStyle } from '@univerjs/core';
+import { HorizontalAlign, VerticalAlign } from '@univerjs/core';
+export interface IShapeTextModel {
+    va?: VerticalAlign;
+    ha?: HorizontalAlign;
+    doc: IDocumentData;
+}
+export interface IShapeTextUpdateOptions {
+    textStyle?: ITextStyle;
+    verticalAlign?: VerticalAlign;
+    horizontalAlign?: HorizontalAlign;
+}
+export declare function createDefaultShapeTextDocument(textStyle?: ITextStyle, horizontalAlign?: HorizontalAlign): IDocumentData;
+export declare function getShapeTextModel(shapeData: IShapeData, options: IShapeTextUpdateOptions): IShapeTextModel;
+export declare function buildShapeTextDataUpdate(shapeData: IShapeData, options: IShapeTextUpdateOptions): IShapeData;

package/lib/types/views/shape-text-editor/DocParagraphTypeDropdown.d.ts

@@ -0,0 +1,11 @@
+import type { MouseEvent as ReactMouseEvent } from 'react';
+export interface IDocParagraphTypeDropdownProps {
+    buttonClassName?: string;
+    className?: string;
+    popupDataComponent?: string;
+    title?: string;
+    onAfterCommand?: () => void;
+    onBeforeCommand?: () => void;
+    onMouseDown?: (event: ReactMouseEvent<HTMLButtonElement>) => void;
+}
+export declare function DocParagraphTypeDropdown(props: IDocParagraphTypeDropdownProps): import("react/jsx-runtime").JSX.Element;

package/lib/types/views/shape-text-editor/ShapeTextEditor.d.ts

@@ -0,0 +1,61 @@
+import type { Nullable } from '@univerjs/core';
+import type { IKeyboardEventConfig } from '@univerjs/docs-ui';
+import type { CSSProperties } from 'react';
+import type { IShapeTextEditingParams, IShapeTextEditingServiceLike, IShapeTextEditorAdapter } from './types';
+import { ICommandService, VerticalAlign } from '@univerjs/core';
+export interface IShapeTextEditorProps {
+    adapter: IShapeTextEditorAdapter;
+    containerWidth: number;
+    containerHeight: number;
+    editingParams: Nullable<IShapeTextEditingParams>;
+    editingService: IShapeTextEditingServiceLike;
+    editorUnitId: string;
+    scaleX: number;
+    scaleY: number;
+    verticalAlignCommandId?: string;
+}
+interface IShapeTextEditorLayoutOptions {
+    actualHeight: number;
+    scaleX: number;
+    scaleY: number;
+    textRect: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    };
+    verticalAlign: VerticalAlign;
+}
+interface IShapeTextEditorLayout {
+    documentMarginTop: number;
+    editorLeft: number;
+    editorTop: number;
+    editorWidth: number;
+    editorHeight: number;
+    pageHeight: number;
+}
+interface IShapeTextEditorHostHeightOptions {
+    hostHeight: number;
+    textRect: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    };
+    contentHeight: number;
+}
+export declare function resolveShapeTextEditorLayout(options: IShapeTextEditorLayoutOptions): IShapeTextEditorLayout;
+export declare function resolveShapeTextEditorHostHeight(options: IShapeTextEditorHostHeightOptions): number;
+export declare function getShapeTextEditorContentStyle(leftOrWidth: number, topOrHeight: number, width?: number, height?: number): CSSProperties;
+export declare function applyShapeTextEditorCanvasTransparency(renderer: {
+    engine?: {
+        getCanvasElement?: () => HTMLElement | null;
+    };
+} | null | undefined | void): void;
+export declare function getShapeTextEditorKeyboardConfig(commandService: Pick<ICommandService, 'executeCommand'>): IKeyboardEventConfig;
+/**
+ * Shape editor component - second layer DOM.
+ * Handles document editing, content height tracking, and vertical alignment.
+ */
+export declare const ShapeTextEditor: (props: IShapeTextEditorProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/types/views/shape-text-editor/ShapeTextEditorContainer.d.ts

@@ -0,0 +1,9 @@
+import type { IShapeTextEditingServiceLike, IShapeTextEditorAdapter, IShapeTextEditorPositionOptions } from './types';
+export interface IShapeTextEditorContainerProps {
+    adapter: IShapeTextEditorAdapter;
+    editorUnitId: string;
+    editingService: IShapeTextEditingServiceLike;
+    positionOptions: IShapeTextEditorPositionOptions;
+    verticalAlignCommandId?: string;
+}
+export declare const ShapeTextEditorContainer: import("react").MemoExoticComponent<(props: IShapeTextEditorContainerProps) => import("react/jsx-runtime").JSX.Element | null>;

package/lib/types/views/shape-text-editor/ShapeTextFloatToolbar.d.ts

@@ -0,0 +1,4 @@
+export interface IShapeTextFloatToolbarProps {
+    localePrefix?: string;
+}
+export declare function ShapeTextFloatToolbar(props: IShapeTextFloatToolbarProps): import("react/jsx-runtime").JSX.Element;

package/lib/types/views/shape-text-editor/ShapeTextPositionWrapper.d.ts

@@ -0,0 +1,19 @@
+import type { Nullable } from '@univerjs/core';
+import type { ReactNode } from 'react';
+import type { IShapeTextEditingParams, IShapeTextEditorPositionOptions } from './types';
+export interface IShapePositionWrapperProps {
+    children: ReactNode;
+    editingParams: Nullable<IShapeTextEditingParams>;
+    positionOptions: IShapeTextEditorPositionOptions;
+    onPositionUpdate?: (position: {
+        width: number;
+        height: number;
+        scaleX: number;
+        scaleY: number;
+    }) => void;
+}
+/**
+ * Position wrapper component that handles shape positioning in DOM.
+ * This is the first layer DOM that tracks shape position with scroll.
+ */
+export declare const ShapeTextPositionWrapper: import("react").MemoExoticComponent<(props: IShapePositionWrapperProps) => import("react/jsx-runtime").JSX.Element>;