@cool-office/drawing-ui 0.0.0-stage → 1.2.0

package/lib/types/views/object-list-panel/ObjectListPanelBase.d.ts

@@ -0,0 +1,174 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { ComponentProps, ComponentType, FocusEvent, KeyboardEvent, ReactNode } from 'react';
+import { Input } from '@cool-office/design';
+export interface IObjectListPanelCapabilities {
+    arrange?: boolean;
+    description?: boolean;
+    locate?: boolean;
+    name?: boolean;
+    reorder?: boolean;
+    selectable?: boolean;
+    visible?: boolean;
+}
+type ObjectListFilterMode = 'all' | 'hidden' | 'locked';
+export interface IObjectListPanelItem {
+    id: string;
+    name: string;
+    description?: string;
+    visible: boolean;
+    selectable?: boolean;
+    disabled?: boolean;
+    level?: number;
+    isGroup?: boolean;
+    expanded?: boolean;
+    canMoveForward?: boolean;
+    canMoveBackward?: boolean;
+    canReorder?: boolean;
+    parentId?: string;
+    sectionId?: string;
+    sectionTitle?: string;
+    capabilities?: IObjectListPanelCapabilities;
+}
+export interface IObjectListPanelLabels {
+    title: string;
+    empty: string;
+    showAll: string;
+    hideAll: string;
+    lockAll?: string;
+    unlockAll?: string;
+    moveForward: string;
+    moveBackward: string;
+    close: string;
+    show: string;
+    hide: string;
+    lock: string;
+    unlock: string;
+    lockHint?: string;
+    unlockHint?: string;
+    name: string;
+    nameInput: string;
+    description: string;
+    descriptionPlaceholder: string;
+    details: string;
+    noSelection: string;
+    locate: string;
+    expand: string;
+    collapse: string;
+    dragToReorder: string;
+    search: string;
+    filterAll: string;
+    filterHidden: string;
+    filterLocked: string;
+    sectionCanvas: string;
+    sectionFloating: string;
+}
+export type ObjectListPanelTypeNameKey = 'chart' | 'connector' | 'container' | 'dom' | 'group' | 'image' | 'object' | 'placeholder' | 'shape' | 'smartArt' | 'table' | 'text' | 'unit' | 'video';
+export interface IObjectListPanelBaseProps {
+    items: IObjectListPanelItem[];
+    selectedIds: string[];
+    allObjectIds?: string[];
+    allItems?: Pick<IObjectListPanelItem, 'id' | 'visible' | 'selectable' | 'disabled' | 'capabilities'>[];
+    focusedId?: string | null;
+    renderPermissionAction?: (item: IObjectListPanelItem) => ReactNode;
+    labels: IObjectListPanelLabels;
+    showHeader?: boolean;
+    capabilities?: IObjectListPanelCapabilities;
+    onSelect: (objectId: string, multiSelect: boolean) => void;
+    onSetVisible: (objectIds: string[], visible: boolean) => void;
+    onCommitName: (objectId: string, value: string) => void;
+    onCommitDescription: (objectId: string, value: string) => void;
+    onMoveForward?: (objectId: string) => void;
+    onMoveBackward?: (objectId: string) => void;
+    onToggleExpanded?: (objectId: string) => void;
+    onToggleSelectable?: (objectId: string) => void;
+    onSetSelectable?: (objectIds: string[], selectable: boolean) => void;
+    onLocate?: (objectId: string) => void;
+    onReorder?: (sourceObjectId: string, targetObjectId: string) => void;
+}
+export declare function hasCapability(panelCapabilities: IObjectListPanelCapabilities | undefined, item: Pick<IObjectListPanelItem, 'capabilities'> | null | undefined, key: keyof IObjectListPanelCapabilities, fallback?: boolean): boolean;
+export declare function useObjectListPanel(props: IObjectListPanelBaseProps): {
+    selectedIdSet: Set<string>;
+    draggingId: string | null;
+    setDraggingId: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+    searchQuery: string;
+    setSearchQuery: import("react").Dispatch<import("react").SetStateAction<string>>;
+    filterMode: ObjectListFilterMode;
+    setFilterMode: import("react").Dispatch<import("react").SetStateAction<ObjectListFilterMode>>;
+    collapsedSectionIds: Set<string>;
+    selectedItem: IObjectListPanelItem | null;
+    visibleItems: IObjectListPanelItem[];
+    visibleItemSections: {
+        id: string;
+        title: string;
+        items: IObjectListPanelItem[];
+    }[];
+    showSectionHeaders: boolean;
+    visibilityItems: Pick<IObjectListPanelItem, "id" | "disabled" | "selectable" | "visible" | "capabilities">[];
+    selectableItems: Pick<IObjectListPanelItem, "id" | "disabled" | "selectable" | "visible" | "capabilities">[];
+    allVisible: boolean;
+    allLocked: boolean;
+    canMoveForward: boolean;
+    canMoveBackward: boolean;
+    showArrangeControls: boolean;
+    showLocateControl: boolean;
+    canReorder: boolean;
+    handleDrop: (targetId: string) => void;
+    toggleSectionCollapsed: (sectionId: string) => void;
+};
+export declare function ObjectListPanelBase(props: IObjectListPanelBaseProps): import("react").JSX.Element;
+export interface IObjectListRowProps {
+    permissionAction?: ReactNode;
+    item: IObjectListPanelItem;
+    selected: boolean;
+    labels: IObjectListPanelLabels;
+    showLock: boolean;
+    showName: boolean;
+    showVisible: boolean;
+    draggable: boolean;
+    dragging: boolean;
+    onSelect: (multiSelect: boolean) => void;
+    onToggleExpanded: () => void;
+    onToggleVisible: () => void;
+    onToggleSelectable: () => void;
+    onCommitName: (value: string) => void;
+    onDragStart: () => void;
+    onDragEnd: () => void;
+    onDrop: () => void;
+}
+export declare function ObjectDetailsEditor(props: {
+    item: IObjectListPanelItem | null;
+    InputComponent?: ComponentType<ComponentProps<typeof Input>>;
+    descriptionClassName?: string;
+    labels: IObjectListPanelLabels;
+    showName: boolean;
+    showDescription: boolean;
+    onCommitName: (value: string) => void;
+    onCommitDescription: (value: string) => void;
+}): import("react").JSX.Element;
+export type IDrawingObjectListItem = IObjectListPanelItem;
+export type IDrawingObjectListPanelLabels = IObjectListPanelLabels;
+export type IDrawingObjectListPanelProps = IObjectListPanelBaseProps;
+export declare function useObjectListRow({ item, onCommitName }: Pick<IObjectListRowProps, 'item' | 'onCommitName'>): {
+    draftName: string;
+    setDraftName: import("react").Dispatch<import("react").SetStateAction<string>>;
+    disabled: boolean;
+    level: number;
+    locked: boolean;
+    handleBlur: (event: FocusEvent<HTMLInputElement>) => void;
+    handleKeyDown: (event: KeyboardEvent<HTMLInputElement>) => void;
+};
+export {};

package/lib/types/views/object-list-panel/object-list-panel-layer.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { DrawingType } from '@cool-office/core';
+export declare const OBJECT_LIST_FLOATING_SECTION_ID = "floating";
+export declare const OBJECT_LIST_CANVAS_SECTION_ID = "canvas";
+export type ObjectListPanelSectionId = typeof OBJECT_LIST_FLOATING_SECTION_ID | typeof OBJECT_LIST_CANVAS_SECTION_ID;
+export declare function isFloatingObjectListDrawingType(drawingType: DrawingType | null | undefined): boolean;
+export declare function getObjectListPanelSectionIdForDrawingType(drawingType: DrawingType | null | undefined): ObjectListPanelSectionId;

package/lib/types/views/panel/DrawingAlign.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+export interface IDrawingAlignProps {
+    drawings: IDrawingParam[];
+    alignShow: boolean;
+}
+export declare const DrawingAlign: (props: IDrawingAlignProps) => import("react").JSX.Element;

package/lib/types/views/panel/DrawingArrange.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+export interface IDrawingArrangeProps {
+    arrangeShow: boolean;
+    drawings: IDrawingParam[];
+}
+export declare const DrawingArrange: (props: IDrawingArrangeProps) => import("react").JSX.Element;

package/lib/types/views/panel/DrawingCommonPanel.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+export interface IDrawingCommonPanelProps {
+    drawings: IDrawingParam[];
+    hasArrange?: boolean;
+    hasTransform?: boolean;
+    hasAlign?: boolean;
+    hasCropper?: boolean;
+    hasGroup?: boolean;
+    onCropStart?: () => void;
+}
+export declare const DrawingCommonPanel: (props: IDrawingCommonPanelProps) => import("react").JSX.Element | null;

package/lib/types/views/panel/DrawingGroup.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+export interface IDrawingGroupProps {
+    drawings: IDrawingParam[];
+    hasGroup: boolean;
+}
+export declare const DrawingGroup: (props: IDrawingGroupProps) => import("react").JSX.Element;

package/lib/types/views/panel/DrawingTransform.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+export interface IDrawingTransformProps {
+    transformShow: boolean;
+    drawings: IDrawingParam[];
+}
+export declare const DrawingTransform: (props: IDrawingTransformProps) => import("react").JSX.Element | null;

package/lib/types/views/panel/ImageCropper.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+export interface IImageCropperProps {
+    drawings: IDrawingParam[];
+    cropperShow: boolean;
+    onCropStart?: () => void;
+}
+export declare const ImageCropper: (props: IImageCropperProps) => import("react").JSX.Element | null;

package/lib/types/views/panel/MobileDrawingArrange.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+interface IMobileDrawingArrangeProps {
+    arrangeShow: boolean;
+    drawings: IDrawingParam[];
+}
+export declare function MobileDrawingArrange(props: IMobileDrawingArrangeProps): import("react").JSX.Element;
+export {};

package/lib/types/views/panel/MobileDrawingControls.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+interface IMobileDrawingTransformProps {
+    transformShow: boolean;
+    drawings: IDrawingParam[];
+}
+interface IMobileDrawingAlignProps {
+    drawings: IDrawingParam[];
+    alignShow: boolean;
+}
+interface IMobileDrawingGroupProps {
+    drawings: IDrawingParam[];
+    hasGroup: boolean;
+}
+export declare function MobileDrawingTransform(props: IMobileDrawingTransformProps): import("react").JSX.Element | null;
+export declare function MobileDrawingAlign(props: IMobileDrawingAlignProps): import("react").JSX.Element;
+export declare function MobileDrawingGroup(props: IMobileDrawingGroupProps): import("react").JSX.Element;
+export {};

package/lib/types/views/panel/MobileImageCropper.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IImageCropperProps } from './ImageCropper';
+export declare function MobileImageCropper(props: IImageCropperProps): import("react").JSX.Element | null;

package/lib/types/views/panel/component-name.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export declare const DRAWING_ARRANGE_COMPONENT = "drawing-ui.arrange";
+export declare const IMAGE_CROPPER_COMPONENT = "drawing-ui.cropper";
+export declare const DRAWING_TRANSFORM_COMPONENT = "drawing-ui.transform";
+export declare const DRAWING_ALIGN_COMPONENT = "drawing-ui.align";
+export declare const DRAWING_GROUP_COMPONENT = "drawing-ui.group";

package/lib/types/views/panel/drawing-transform-rotation.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IDrawingParam } from '@cool-office/core';
+interface IDrawingTransformRotationChangeHandlerOptions {
+    rotateEnabled: boolean;
+    drawingParam: Pick<IDrawingParam, 'unitId' | 'subUnitId' | 'drawingId' | 'drawingType'>;
+    setRotation: (rotation: number) => void;
+    emitUpdate: (updateParams: IDrawingParam[]) => void;
+    notifyChange: () => void;
+}
+export declare function isDrawingTransformRotationDisabled(rotateEnabled: boolean): boolean;
+export declare function createDrawingTransformRotationChangeHandler(options: IDrawingTransformRotationChangeHandlerOptions): (val: number | null) => void;
+export {};

package/lib/types/views/panel/use-image-cropper.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Copyright 2023-present DreamNum Co., Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { IImageCropperProps } from './ImageCropper';
+import { LocaleService } from '@cool-office/core';
+import { CropType } from '../../commands/operations/image-crop.operation';
+export declare function useImageCropper(props: IImageCropperProps): {
+    drawingParam: import("@cool-office/core").IDrawingParam;
+    cropperShow: boolean;
+    localeService: LocaleService;
+    cropValue: CropType;
+    cropOptions: {
+        label: string;
+        value: CropType;
+    }[];
+    handleCropChange: (value: string | number | boolean) => void;
+    onCropperBtnClick: (val: CropType) => Promise<void>;
+    ShapeClipPicker: any;
+};