@tmagic/stage 1.0.0-beta.7 → 1.0.0-rc.1

package/src/types.ts

@@ -1,10 +1,31 @@
+/*
+ * Tencent is pleased to support the open source community by making TMagicEditor available.
+ *
+ * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
+ *
+ * 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 { MoveableOptions } from 'react-moveable/declaration/types';
 
 import { Id, MApp, MNode } from '@tmagic/schema';
 
+import { GuidesType } from './const';
 import StageCore from './StageCore';
+import StageDragResize from './StageDragResize';
+import StageMask from './StageMask';
 
-export type CanSelect = (el: HTMLElement, stop: () => boolean) => boolean | Promise<boolean>;
+export type CanSelect = (el: HTMLElement, event: MouseEvent, stop: () => boolean) => boolean | Promise<boolean>;
 
 export type StageCoreConfig = {
   /** 需要对齐的dom节点的CSS选择器字符串 */
@@ -35,29 +56,15 @@ export type Rect = {
   width: number;
   height: number;
 } & Offset;
-
 export interface Offset {
   left: number;
   top: number;
 }
 
-/*
- * Tencent is pleased to support the open source community by making TMagicEditor available.
- *
- * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
- *
- * 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 interface GuidesEventData {
+  type: GuidesType;
+  guides: number[];
+}
 
 export interface UpdateEventData {
   el: HTMLElement;
@@ -88,7 +95,7 @@ export interface RemoveData {
 
 export interface Runtime {
   beforeSelect?: (el: HTMLElement) => Promise<boolean> | boolean;
-  getSnapElements?: (el: HTMLElement) => HTMLElement[];
+  getSnapElements?: (el?: HTMLElement) => HTMLElement[];
   updateRootConfig: (config: MApp) => void;
   updatePageId?: (id: Id) => void;
   select?: (id: Id) => Promise<HTMLElement> | HTMLElement;
@@ -109,13 +116,13 @@ export interface RuntimeWindow extends Window {
   magic: Magic;
 }
 
-export enum ZIndex {
-  MASK = '99999',
-  GHOST_EL = '99998',
+export interface StageHighlightConfig {
+  core: StageCore;
+  container: HTMLElement;
 }
 
-export enum MouseButton {
-  LEFT = 0,
-  MIDDLE = 1,
-  RIGHT = 2,
+export interface TargetCalibrateConfig {
+  parent: HTMLElement;
+  mask: StageMask;
+  dr: StageDragResize;
 }

package/src/util.ts

@@ -16,14 +16,9 @@
  * limitations under the License.
  */
 
+import { Mode, SELECTED_CLASS } from './const';
 import type { Offset } from './types';
 
-export enum Mode {
-  ABSOLUTE = 'absolute',
-  FIXED = 'fixed',
-  SORTABLE = 'sortable',
-}
-
 export const getOffset = (el: HTMLElement): Offset => {
   const { transform } = getComputedStyle(el);
   const { offsetParent } = el;
@@ -113,8 +108,63 @@ export const isFixed = (el?: HTMLElement): boolean => {
   return getComputedStyle(el).position === 'fixed';
 };
 
+export const isFixedParent = (el: HTMLElement) => {
+  let fixed = false;
+  let dom = el;
+  while (dom) {
+    fixed = isFixed(dom);
+    if (fixed) {
+      break;
+    }
+    const { parentElement } = dom;
+    if (!parentElement || parentElement.tagName === 'BODY') {
+      break;
+    }
+    dom = parentElement;
+  }
+  return fixed;
+};
+
 export const getMode = (el: HTMLElement): Mode => {
-  if (isFixed(el)) return Mode.FIXED;
+  if (isFixedParent(el)) return Mode.FIXED;
   if (isStatic(el) || isRelative(el)) return Mode.SORTABLE;
   return Mode.ABSOLUTE;
 };
+
+export const getScrollParent = (element: HTMLElement, includeHidden = false): HTMLElement | null => {
+  let style = getComputedStyle(element);
+  const overflowRegex = includeHidden ? /(auto|scroll|hidden)/ : /(auto|scroll)/;
+
+  if (isFixed(element)) return null;
+  for (let parent = element; parent.parentElement; ) {
+    parent = parent.parentElement;
+    style = getComputedStyle(parent);
+    if (isAbsolute(element) && isStatic(element)) {
+      continue;
+    }
+    if (overflowRegex.test(style.overflow + style.overflowY + style.overflowX)) return parent;
+  }
+
+  return null;
+};
+
+export const createDiv = ({ className, cssText }: { className: string; cssText: string }) => {
+  const el = globalThis.document.createElement('div');
+  el.className = className;
+  el.style.cssText = cssText;
+  return el;
+};
+
+export const removeSelectedClassName = (doc: Document) => {
+  const oldEl = doc.querySelector(`.${SELECTED_CLASS}`);
+
+  if (oldEl) {
+    oldEl.classList.remove(SELECTED_CLASS);
+    (oldEl.parentNode as HTMLDivElement)?.classList.remove(`${SELECTED_CLASS}-parent`);
+  }
+};
+
+export const addSelectedClassName = (el: Element) => {
+  el.classList.add(SELECTED_CLASS);
+  (el.parentNode as Element)?.classList.add(`${SELECTED_CLASS}-parent`);
+};

package/tsconfig.json

@@ -1,9 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "baseUrl": "../..",
-  },
-  "exclude": [
-    "**/dist/**/*"
-  ],
-}

package/vite.config.ts

@@ -1,27 +0,0 @@
-/*
- * Tencent is pleased to support the open source community by making TMagicEditor available.
- *
- * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
- *
- * 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 { defineConfig } from 'vite';
-
-import { getBaseConfig } from '../vite-config';
-
-import pkg from './package.json';
-
-const deps = Object.keys(pkg.dependencies);
-
-export default defineConfig(getBaseConfig(deps, 'TMagicStage'));