@univerjs-pro/shape-editor-ui 1.0.0-alpha.8 → 1.0.0-beta.1

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

@@ -1,5 +1,9 @@
+import type { IShapeRect } from '@univerjs-pro/engine-shape';
+import type { IDocumentData, Nullable } from '@univerjs/core';
 import type { DocumentSkeleton } from '@univerjs/engine-render';
-import { VerticalAlign } from '@univerjs/core';
+import type { CSSProperties } from 'react';
+import type { IShapeTextEditingParams, IShapeTextEditorAdapter, IShapeTextEditorModel } from './types';
+import { HorizontalAlign, VerticalAlign } from '@univerjs/core';
 export interface IResolveShapeTextVerticalOffsetOptions {
     contentHeight: number;
     verticalAlign?: VerticalAlign;
@@ -17,8 +21,193 @@ export interface IResolveShapeTextDocumentRenderLayoutOptions extends IResolveSh
     opticalVerticalOffset?: number;
     verticalOffset?: number;
 }
+export declare function normalizeShapeTextRect(textRect: IShapeRect, fallbackRect: IShapeRect): IShapeRect;
 export declare function isShapeTextOpticalVerticalAlignEnabled(value: unknown): boolean;
+export declare function getShapeTextVisibleInkHeight(skeleton: DocumentSkeleton): number | undefined;
 export declare function resolveShapeTextVerticalOffset(options: IResolveShapeTextVerticalOffsetOptions): number;
 export declare function resolveShapeTextDocumentRenderLayout(options: IResolveShapeTextDocumentRenderLayoutOptions): IShapeTextDocumentRenderLayout;
 export declare function getShapeTextContentHeight(skeleton: DocumentSkeleton, fallbackHeight?: number): number;
 export declare function getShapeTextOpticalVerticalOffset(skeleton: DocumentSkeleton, targetHeight: number, verticalAlign?: VerticalAlign): number;
+export interface IContentLayout {
+    documentMarginTop: number;
+    editorLeft: number;
+    editorTop: number;
+    editorWidth: number;
+    editorHeight: number;
+    editorSurfaceWidth?: number;
+}
+export declare function resolveShapeTextEditingContentHeight(measuredContentHeight: number, caretHeight?: number): number;
+export declare function getShapeTextEditingCaretHeight(activeRange?: {
+    getAbsolutePosition(): Nullable<{
+        height?: number;
+    }>;
+}): number | undefined;
+export declare function areShapeTextEditorLayoutsEqual(a: IContentLayout, b: IContentLayout): boolean;
+interface IShapeTextEditorLayoutOptions {
+    actualHeight: number;
+    contentWidth?: number;
+    scaleX: number;
+    scaleY: number;
+    textRect: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    };
+    verticalAlign: VerticalAlign;
+    opticalVerticalOffset?: number;
+}
+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;
+}
+interface IShapeTextEditorHostSizeOptions {
+    hostWidth: number;
+    hostHeight: number;
+    textRect: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    };
+    contentWidth: number;
+    contentHeight: number;
+    allowShrink?: boolean;
+}
+interface IShapeTextEditorHostSizeChangeOptions {
+    nextWidth: number;
+    nextHeight: number;
+    baselineWidth: number;
+    baselineHeight: number;
+    tolerance?: number;
+}
+export declare function resolveShapeTextEditorTextRect(options: {
+    shapeModel: Pick<IShapeTextEditorModel, 'getShapeTextRect'>;
+    hostRect: IShapeRect;
+}): IShapeRect;
+export declare function resolveShapeTextEditorRenderScale(options: {
+    ancestorScale?: {
+        scaleX?: number;
+        scaleY?: number;
+    };
+    canvasClientWidth: number;
+    declaredCanvasWidth: number;
+    fallbackScaleX: number;
+    fallbackScaleY: number;
+}): {
+    scaleAdjust: number;
+    renderScaleX: number;
+    renderScaleY: number;
+};
+export declare function resolveShapeTextEditorEmptyTextBoxMinSize(options: {
+    isHorizontal: boolean;
+    placeholderWidth: number;
+}): {
+    width: number;
+    height: number;
+};
+export declare function measureShapeTextEditorPlaceholderWidth(documentData: IDocumentData, placeholder: string): number;
+export declare function resolveShapeTextEditorMeasurePageWidth(options: {
+    autoFitNoWrap: boolean;
+    maxAutoFitWidth?: number;
+    textRectWidth: number;
+}): number;
+export declare function measureShapeTextEditorNoWrapContentWidth(documentData: IDocumentData | null | undefined): number;
+export declare function resolveShapeTextEditorRenderedContentWidth(options: {
+    actualWidth: number;
+    autoFitNoWrap: boolean;
+    measuredContentWidth?: number;
+    textRectWidth: number;
+}): number;
+export declare function resolveShapeTextEditorHostContentWidth(options: {
+    actualWidth: number;
+    allowShrink: boolean;
+    autoFitNoWrap: boolean;
+    measuredContentWidth?: number;
+    renderedContentWidth: number;
+}): number;
+export declare function resolveShapeTextEditorFinalPageWidth(options: {
+    autoFitNoWrap: boolean;
+    measurePageWidth?: number;
+    renderedContentWidth: number;
+    textRectWidth: number;
+}): number;
+export declare function resolveShapeTextEditorRenderSurfaceWidth(options: {
+    autoFitNoWrap: boolean;
+    editorWidth: number;
+    measurePageWidth: number;
+    renderedContentWidth?: number;
+    scaleX: number;
+}): number;
+export declare function hasShapeTextEditorHostSizeChanged(options: IShapeTextEditorHostSizeChangeOptions): boolean;
+export declare function resolveShapeTextEditorShouldShrinkHostSize(options: {
+    adapter: Pick<IShapeTextEditorAdapter, 'allowHostSizeShrink' | 'updateHostSize'>;
+    editingParams: Nullable<IShapeTextEditingParams>;
+}): boolean;
+export declare function shouldDeferShapeTextEditorHostSizeUpdateDuringEditing(options: {
+    adapter: Pick<IShapeTextEditorAdapter, 'deferHostSizeUpdateDuringEditing'>;
+    editingParams: Nullable<IShapeTextEditingParams>;
+}): boolean;
+export declare function resolveShapeTextEditorDocumentVerticalAlign(options: {
+    opticalVerticalAlign: boolean;
+    verticalAlign: VerticalAlign;
+}): VerticalAlign;
+export declare function resolveShapeTextEditorLayout(options: IShapeTextEditorLayoutOptions): IShapeTextEditorLayout;
+export declare function resolveShapeTextEditorPlaceholderLayout(options: {
+    documentMarginTop: number;
+    editorLeft: number;
+    editorSurfaceWidth?: number;
+    editorTop: number;
+    editorWidth: number;
+    horizontalAlign: HorizontalAlign;
+}): {
+    left: number;
+    textAlign: 'center' | 'left' | 'right';
+    top: number;
+    width: number;
+};
+export declare function resolveShapeTextEditorHostHeight(options: IShapeTextEditorHostHeightOptions): number;
+export declare function resolveShapeTextEditorHostSize(options: IShapeTextEditorHostSizeOptions): {
+    width: number;
+    height: number;
+};
+export declare function resolveShapeTextEditorPhysicalContentSize(options: {
+    crossAxisLength: number;
+    flowAxis: 'width' | 'height';
+    flowAxisLength: number;
+}): {
+    height: number;
+    width: number;
+};
+export declare function getShapeTextEditorContentStyle(leftOrWidth: number, topOrHeight: number, width?: number, height?: number): CSSProperties;
+export declare function applyShapeTextEditorContentLayout(element: HTMLElement | null | undefined, layout: IContentLayout): void;
+export declare function applyShapeTextEditorCanvasTransparency(renderer: {
+    engine?: {
+        getCanvasElement?: () => HTMLElement | null;
+    };
+} | null | undefined | void): void;
+export declare function resetShapeTextEditorDocumentMargins(renderer: {
+    mainComponent?: unknown;
+    components?: {
+        forEach?: (callback: (component: unknown) => void) => void;
+    };
+} | null | undefined | void): void;
+export declare function refreshShapeTextEditorRenderer(renderer: {
+    mainComponent?: unknown;
+    scene?: unknown;
+} | null | undefined | void): void;
+export {};

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

@@ -9,6 +9,7 @@ export interface IShapeTextEditingParams {
     shapeId: string;
     shapeKey: string;
     visible: boolean;
+    selectAllOnFocus?: boolean;
 }
 export interface IShapeTextEditingService {
     editingParams$: Observable<Nullable<IShapeTextEditingParams>>;
@@ -83,5 +84,5 @@ export interface IShapeTextEditorPositionOptions {
     viewportKeys: IShapeTextEditorViewportKeys;
     getSkeleton?: (renderUnit: IRender, editingParams: IShapeTextEditingParams) => unknown;
     getHostTransform?: (renderUnit: IRender, editingParams: IShapeTextEditingParams) => Nullable<ITransformState>;
-    getPositionOffset?: (renderUnit: IRender, editingParams: IShapeTextEditingParams) => Nullable<IShapeTextEditorPositionOffset>;
+    getPositionOffset?: (renderUnit: IRender, editingParams: IShapeTextEditingParams, positionRoot?: Element | null) => Nullable<IShapeTextEditorPositionOffset>;
 }

package/lib/types/views/smart-art/SmartArtColorGallery.d.ts

@@ -0,0 +1,6 @@
+import type { ISmartArtColorStyleCatalogItem } from '@univerjs-pro/engine-shape';
+export interface ISmartArtColorGalleryProps {
+    selectedColorStyleId?: string;
+    onSelect: (style: ISmartArtColorStyleCatalogItem) => void;
+}
+export declare function SmartArtColorGallery(props: ISmartArtColorGalleryProps): import("react").JSX.Element;

package/lib/types/views/smart-art/SmartArtLayoutGallery.d.ts

@@ -0,0 +1,6 @@
+import type { ISmartArtLayoutCatalogItem } from './smart-art-layout-catalog.generated';
+export interface ISmartArtLayoutGalleryProps {
+    selectedLayoutId?: string;
+    onSelect: (layout: ISmartArtLayoutCatalogItem) => void;
+}
+export declare function SmartArtLayoutGallery(props: ISmartArtLayoutGalleryProps): import("react").JSX.Element;

package/lib/types/views/smart-art/SmartArtLayoutIcon.d.ts

@@ -0,0 +1,6 @@
+import type { SmartArtLayoutIconElement } from './smart-art-layout-catalog.generated';
+export interface ISmartArtLayoutIconProps {
+    elements: readonly SmartArtLayoutIconElement[];
+    className?: string;
+}
+export declare function SmartArtLayoutIcon(props: ISmartArtLayoutIconProps): import("react").JSX.Element;

package/lib/types/views/smart-art/SmartArtQuickStyleGallery.d.ts

@@ -0,0 +1,10 @@
+import type { ISmartArtQuickStyleCatalogItem } from '@univerjs-pro/engine-shape';
+export interface ISmartArtQuickStyleGalleryProps {
+    selectedStyleId?: string;
+    onSelect: (style: ISmartArtQuickStyleCatalogItem) => void;
+}
+export declare function SmartArtQuickStyleGallery(props: ISmartArtQuickStyleGalleryProps): import("react").JSX.Element;
+export declare function SmartArtQuickStylePreview(props: {
+    style: ISmartArtQuickStyleCatalogItem;
+    compact?: boolean;
+}): import("react").JSX.Element;

package/lib/types/views/smart-art/SmartArtRibbonControl.d.ts

@@ -0,0 +1,33 @@
+import type { ISmartArtColorStyleCatalogItem, ISmartArtData, ISmartArtQuickStyleCatalogItem } from '@univerjs-pro/engine-shape';
+import type { ISmartArtLayoutCatalogItem } from './smart-art-layout-catalog.generated';
+import { SmartArtInsertPositionEnum } from '@univerjs-pro/engine-shape';
+export interface ISmartArtRibbonControlProps {
+    data: ISmartArtData;
+    onOpenTextPane: () => void;
+    onAddNode: (position: SmartArtInsertPositionEnum) => void;
+    onPromoteNode: () => void;
+    onDemoteNode: () => void;
+    onMoveNode: (position: SmartArtInsertPositionEnum.Before | SmartArtInsertPositionEnum.After) => void;
+    onDeleteNode: () => void;
+    onToggleDirection: () => void;
+    onReset: () => void;
+    onSelectLayout: (layout: ISmartArtLayoutCatalogItem) => void;
+    onSelectStyle: (style: ISmartArtQuickStyleCatalogItem) => void;
+    onSelectColor: (style: ISmartArtColorStyleCatalogItem) => void;
+    onConvertToShapes: () => void;
+    canAddAfter?: boolean;
+    canAddBelow?: boolean;
+    canAddAssistant?: boolean;
+    canPromote?: boolean;
+    canDemote?: boolean;
+    canMoveUp?: boolean;
+    canMoveDown?: boolean;
+    canDelete?: boolean;
+}
+type CreateGraphicProps = Pick<ISmartArtRibbonControlProps, 'data' | 'onOpenTextPane' | 'onAddNode' | 'onPromoteNode' | 'onDemoteNode' | 'onMoveNode' | 'onDeleteNode' | 'onToggleDirection' | 'canAddAfter' | 'canAddBelow' | 'canAddAssistant' | 'canPromote' | 'canDemote' | 'canMoveUp' | 'canMoveDown' | 'canDelete'>;
+export declare function SmartArtCreateGraphicRibbonControl(props: CreateGraphicProps): import("react").JSX.Element;
+export declare function SmartArtLayoutRibbonControl(props: Pick<ISmartArtRibbonControlProps, 'data' | 'onSelectLayout'>): import("react").JSX.Element;
+export declare function SmartArtStyleRibbonControl(props: Pick<ISmartArtRibbonControlProps, 'data' | 'onSelectStyle' | 'onSelectColor'>): import("react").JSX.Element;
+export declare function SmartArtResetRibbonControl(props: Pick<ISmartArtRibbonControlProps, 'onReset' | 'onConvertToShapes'>): import("react").JSX.Element;
+export declare function SmartArtRibbonControl(props: ISmartArtRibbonControlProps): import("react").JSX.Element;
+export {};

package/lib/types/views/smart-art/SmartArtTextPane.d.ts

@@ -0,0 +1,14 @@
+import type { ISmartArtData, ISmartArtDataNode, SmartArtOperation } from '@univerjs-pro/engine-shape';
+export interface ISmartArtTextPaneProps {
+    data: ISmartArtData;
+    onOperation: (operation: SmartArtOperation, focusedNodeId?: string) => void;
+    selectedNodeId?: string;
+    onSelectNode?: (nodeId: string | undefined) => void;
+    showToolbar?: boolean;
+}
+export interface ISmartArtTextPaneRow {
+    depth: number;
+    node: ISmartArtDataNode;
+}
+export declare function flattenSmartArtTextPaneRows(data: ISmartArtData): ISmartArtTextPaneRow[];
+export declare function SmartArtTextPane(props: ISmartArtTextPaneProps): import("react").JSX.Element;

package/lib/types/views/smart-art/smart-art-layout-catalog.generated.d.ts

@@ -0,0 +1,35 @@
+export type SmartArtLayoutIconElement = {
+    kind: 'ellipse';
+    cx: number;
+    cy: number;
+    rx: number;
+    ry: number;
+    transform?: string;
+} | {
+    kind: 'line';
+    x1: number;
+    y1: number;
+    x2: number;
+    y2: number;
+    transform?: string;
+} | {
+    kind: 'path';
+    d: string;
+    transform?: string;
+} | {
+    kind: 'rect';
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    rx?: number;
+    transform?: string;
+};
+export interface ISmartArtLayoutCatalogItem {
+    category: string;
+    iconElements: SmartArtLayoutIconElement[];
+    iconFile: string;
+    id: string;
+    name: string;
+}
+export declare const SMART_ART_LAYOUT_CATALOG: readonly ISmartArtLayoutCatalogItem[];

package/lib/types/views/smart-art/smart-art-layout-gallery-catalog.generated.d.ts

@@ -0,0 +1,5 @@
+import type { ISmartArtLayoutCatalogItem } from './smart-art-layout-catalog.generated';
+export interface ISmartArtLayoutGalleryItem extends ISmartArtLayoutCatalogItem {
+    galleryId: string;
+}
+export declare const SMART_ART_LAYOUT_GALLERY_CATALOG: readonly ISmartArtLayoutGalleryItem[];