From 9e02faa5cbd4f5e529a1a58647afd519b0672d3b Mon Sep 17 00:00:00 2001 From: Daybrush Date: Sun, 17 Jul 2022 01:46:15 +0900 Subject: [PATCH] docs: add hideChildMoveableDefaultLines docs --- .../src/react-moveable/MoveableGroup.tsx | 22 +++++++++++++++++-- .../src/react-moveable/ables/Clippable.tsx | 19 ++++++++++------ .../src/react-moveable/ables/Default.ts | 1 - .../src/react-moveable/ables/Groupable.tsx | 7 +++--- .../src/react-moveable/types.ts | 10 ++++----- .../react-moveable/stories/controls/group.ts | 2 +- 6 files changed, 42 insertions(+), 19 deletions(-) diff --git a/packages/react-moveable/src/react-moveable/MoveableGroup.tsx b/packages/react-moveable/src/react-moveable/MoveableGroup.tsx index f38fde483..8ffe33f68 100644 --- a/packages/react-moveable/src/react-moveable/MoveableGroup.tsx +++ b/packages/react-moveable/src/react-moveable/MoveableGroup.tsx @@ -248,8 +248,9 @@ class MoveableGroup extends MoveableManager { } /** - * Sets the initial rotation of the group. (default 0) + * Sets the initial rotation of the group. * @name Moveable.Group#defaultGroupRotate + * @default 0 * @example * import Moveable from "moveable"; * @@ -262,8 +263,9 @@ class MoveableGroup extends MoveableManager { */ /** - * Sets the initial origin of the group. (default 0) + * Sets the initial origin of the group. * @name Moveable.Group#defaultGroupOrigin + * @default 0 * @example * import Moveable from "moveable"; * @@ -274,4 +276,20 @@ class MoveableGroup extends MoveableManager { * * moveable.defaultGroupOrigin = "20% 40%"; */ + + +/** + * Whether to hide the line in child moveable for group corresponding to the rect of the target. + * @name Moveable.Group#hideChildMoveableDefaultLines + * @default false + * @example + * import Moveable from "moveable"; + * + * const moveable = new Moveable(document.body, { + * target: [].slice.call(document.querySelectorAll(".target")), + * hideChildMoveableDefaultLines: false, + * }); + * + * moveable.hideChildMoveableDefaultLines = true; + */ export default MoveableGroup; diff --git a/packages/react-moveable/src/react-moveable/ables/Clippable.tsx b/packages/react-moveable/src/react-moveable/ables/Clippable.tsx index 78b2c14e0..84d11c48f 100644 --- a/packages/react-moveable/src/react-moveable/ables/Clippable.tsx +++ b/packages/react-moveable/src/react-moveable/ables/Clippable.tsx @@ -1236,8 +1236,9 @@ export default { */ /** - * You can drag the clip by setting clipArea. (default: false) + * You can drag the clip by setting clipArea. * @name Moveable.Clippable#clipArea + * @default false * @example * import Moveable from "moveable"; * @@ -1263,8 +1264,9 @@ export default { */ /** -* Whether the clip is bound to the target. (default: false) +* Whether the clip is bound to the target. * @name Moveable.Clippable#clipTargetBounds +* @default false * @example * import Moveable from "moveable"; * @@ -1291,9 +1293,10 @@ export default { */ /** -* Add clip guidelines in the vertical direction. (default: []) -* @name Moveable.Clippable#clipVerticalGuidelines -* @example + * Add clip guidelines in the vertical direction. + * @name Moveable.Clippable#clipVerticalGuidelines + * @default 0 + * @example * import Moveable from "moveable"; * * const moveable = new Moveable(document.body, { @@ -1310,8 +1313,9 @@ export default { */ /** -* Add clip guidelines in the horizontal direction. (default: []) +* Add clip guidelines in the horizontal direction. * @name Moveable.Clippable#clipHorizontalGuidelines +* @default [] * @example * import Moveable from "moveable"; * @@ -1328,8 +1332,9 @@ export default { * }); */ /** -* istance value that can snap to clip guidelines. (default: 5) +* istance value that can snap to clip guidelines. * @name Moveable.Clippable#clipSnapThreshold +* @default 5 * @example * import Moveable from "moveable"; * diff --git a/packages/react-moveable/src/react-moveable/ables/Default.ts b/packages/react-moveable/src/react-moveable/ables/Default.ts index 17913167f..ab03e7143 100644 --- a/packages/react-moveable/src/react-moveable/ables/Default.ts +++ b/packages/react-moveable/src/react-moveable/ables/Default.ts @@ -19,7 +19,6 @@ export default { cspNonce: String, translateZ: Number, hideDefaultLines: Boolean, - hideChildMoveableDefaultLines: Boolean, props: Object, flushSync: Function, } as const, diff --git a/packages/react-moveable/src/react-moveable/ables/Groupable.tsx b/packages/react-moveable/src/react-moveable/ables/Groupable.tsx index 08933a961..32b3a5982 100644 --- a/packages/react-moveable/src/react-moveable/ables/Groupable.tsx +++ b/packages/react-moveable/src/react-moveable/ables/Groupable.tsx @@ -1,6 +1,6 @@ import { refs } from "framework-utils"; import MoveableManager from "../MoveableManager"; -import { Renderer, MoveableGroupInterface } from "../types"; +import { Renderer, MoveableGroupInterface, GroupableProps } from "../types"; export default { name: "groupable", @@ -8,9 +8,10 @@ export default { defaultGroupRotate: Number, defaultGroupOrigin: String, groupable: Boolean, + hideChildMoveableDefaultLines: Boolean, } as const, events: {} as const, - render(moveable: MoveableGroupInterface, React: Renderer): any[] { + render(moveable: MoveableGroupInterface, React: Renderer): any[] { const targets = moveable.props.targets || []; moveable.moveables = []; @@ -19,7 +20,7 @@ export default { const props = moveable.props; return targets.map((target, i) => { - return key={"moveable" + i} ref={refs(moveable, "moveables", i)} target={target} diff --git a/packages/react-moveable/src/react-moveable/types.ts b/packages/react-moveable/src/react-moveable/types.ts index c7b928e6e..d84bc6111 100644 --- a/packages/react-moveable/src/react-moveable/types.ts +++ b/packages/react-moveable/src/react-moveable/types.ts @@ -126,11 +126,6 @@ export interface DefaultOptions { * @default false */ hideDefaultLines?: boolean; - /** - * Whether to hide the line in child moveable for group corresponding to the rect of the target. - * @default false - */ - hideChildMoveableDefaultLines?: boolean; /** * You can use props in object format or custom props. * @default empty object @@ -1889,6 +1884,11 @@ export interface GroupableOptions { * @private */ groupable?: boolean; + /** + * Whether to hide the line in child moveable for group corresponding to the rect of the target. + * @default false + */ + hideChildMoveableDefaultLines?: boolean; } diff --git a/packages/react-moveable/stories/controls/group.ts b/packages/react-moveable/stories/controls/group.ts index 7463fcb3a..065a07a90 100644 --- a/packages/react-moveable/stories/controls/group.ts +++ b/packages/react-moveable/stories/controls/group.ts @@ -6,7 +6,7 @@ export const DEFAULT_GROUPPABLE_GROUP_CONTROLS = { description: makeLink("Grouppable", "hideChildMoveableDefaultLines"), defaultValue: false, }), -} +}; export const DEFAULT_RESIZABLE_GROUP_CONTROLS = { maxWidth: makeArgType({ type: "number",