ice-render 1.0.3 → 1.0.5

package/dist/types/graphic/shape/ICEIsogon.d.ts

@@ -1,54 +1,52 @@
-import ICEDotPath from '../ICEDotPath';
-/**
- *
- * @class ICEIsogon
- *
- * 正N边形
- *
- * @author 大漠穷秋<damoqiongqiu@126.com>
- */
-declare class ICEIsogon extends ICEDotPath {
-    /**
-     * @method constructor
-     * radius, edges 会暴露给 AnimationManager ，可能会动态变化。
-     * @param props
-     */
-    constructor(props?: any);
-    /**
-     * @overwrite
-     * @method calcDots
-     *
-     * 计算路径上的关键点:
-     * - 默认的坐标原点是 (0,0) 位置。
-     * - 这些点没有经过 transform 矩阵变换。
-     *
-     * @returns
-     */
-    protected calcDots(): any;
-    /**
-     * @overwrite
-     * @method calcComponentParams
-     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
-     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
-     * - 此方法不能依赖原点位置和 transform 矩阵。
-     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
-     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
-     * - 子类可以覆盖此方法，实现自己的计算逻辑。
-     * @returns
-     */
-    protected calcComponentParams(): {
-        width: any;
-        height: any;
-    };
-    /**
-     * @overwrite
-     * @method setState
-     * setState 仅仅修改参数，不会立即导致重新渲染，需要等待 FrameManager 调度，最小延迟时间约为 1/60=16.67 ms 。
-     *
-     * - 如果 setState 时指定了 radius 参数，则 width 会被重新计算，如果指定了 radius 参数则 height 会被重新计算。
-     * - 如果 setState 时仅仅指定 width 参数，则 radius 会被重新计算，如果仅仅指定了 height 参数，则 radius 会被重新计算。
-     * @param newState
-     */
-    setState(newState: any): void;
-}
-export default ICEIsogon;
+import ICEDotPath from '../ICEDotPath';
+/**
+ *
+ * @class ICEIsogon 正N边形
+ *
+ * @author 大漠穷秋<damoqiongqiu@126.com>
+ */
+declare class ICEIsogon extends ICEDotPath {
+    /**
+     * @method constructor
+     * radius, edges 会暴露给 AnimationManager ，可能会动态变化。
+     * @param props
+     */
+    constructor(props?: any);
+    /**
+     * @overwrite
+     * @method __calcDots
+     *
+     * 计算路径上的关键点:
+     * - 默认的坐标原点是 (0,0) 位置。
+     * - 这些点没有经过 transform 矩阵变换。
+     *
+     * @returns
+     */
+    protected __calcDots(): any;
+    /**
+     * @overwrite
+     * @method calcComponentParams
+     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
+     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
+     * - 此方法不能依赖原点位置和 transform 矩阵。
+     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
+     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
+     * - 子类可以覆盖此方法，实现自己的计算逻辑。
+     * @returns
+     */
+    protected calcComponentParams(): {
+        width: any;
+        height: any;
+    };
+    /**
+     * @overwrite
+     * @method setState
+     * setState 仅仅修改参数，不会立即导致重新渲染，需要等待 FrameManager 调度，最小延迟时间约为 1/60=16.67 ms 。
+     *
+     * - 如果 setState 时指定了 radius 参数，则 width 会被重新计算，如果指定了 radius 参数则 height 会被重新计算。
+     * - 如果 setState 时仅仅指定 width 参数，则 radius 会被重新计算，如果仅仅指定了 height 参数，则 radius 会被重新计算。
+     * @param newState
+     */
+    setState(newState: any): void;
+}
+export default ICEIsogon;

package/dist/types/graphic/shape/ICERect.d.mts

@@ -0,0 +1,10 @@
+import ICEPath from '../ICEPath.mjs';
+/**
+ * @class ICERect 矩形
+ * @author 大漠穷秋<damoqiongqiu@126.com>
+ */
+declare class ICERect extends ICEPath {
+    constructor(props?: any);
+    protected createPathObject(): any;
+}
+export default ICERect;

package/dist/types/graphic/shape/ICERect.d.ts

@@ -1,17 +1,10 @@
-/**
- * Copyright (c) 2022 大漠穷秋.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-import ICEPath from '../ICEPath';
-/**
- * @class ICERect 矩形
- * @author 大漠穷秋<damoqiongqiu@126.com>
- */
-declare class ICERect extends ICEPath {
-    constructor(props?: any);
-    protected createPathObject(): Path2D;
-}
-export default ICERect;
+import ICEPath from '../ICEPath';
+/**
+ * @class ICERect 矩形
+ * @author 大漠穷秋<damoqiongqiu@126.com>
+ */
+declare class ICERect extends ICEPath {
+    constructor(props?: any);
+    protected createPathObject(): any;
+}
+export default ICERect;

package/dist/types/graphic/shape/ICERose.d.mts

@@ -0,0 +1,41 @@
+import ICEDotPath from '../ICEDotPath.mjs';
+declare class ICERose extends ICEDotPath {
+    constructor(props?: any);
+    /**
+     * @overwrite
+     * @method __calcDots
+     *
+     * 计算路径上的关键点:
+     * - 默认的坐标原点是 (0,0) 位置。
+     * - 这些点没有经过 transform 矩阵变换。
+     *
+     * @returns
+     */
+    protected __calcDots(): any;
+    /**
+     * @overwrite
+     * @method calcComponentParams
+     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
+     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
+     * - 此方法不能依赖原点位置和 transform 矩阵。
+     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
+     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
+     * - 子类可以覆盖此方法，实现自己的计算逻辑。
+     * @returns
+     */
+    protected calcComponentParams(): {
+        width: any;
+        height: any;
+    };
+    /**
+     * @overwrite
+     * @method setState
+     * setState 仅仅修改参数，不会立即导致重新渲染，需要等待 FrameManager 调度，最小延迟时间约为 1/60=16.67 ms 。
+     *
+     * - 如果 setState 时指定了 radius 参数，则 width 会被重新计算，如果指定了 radius 参数则 height 会被重新计算。
+     * - 如果 setState 时仅仅指定 width 参数，则 radius 会被重新计算，如果仅仅指定了 height 参数，则 radius 会被重新计算。
+     * @param newState
+     */
+    setState(newState: any): void;
+}
+export default ICERose;

package/dist/types/graphic/shape/ICERose.d.ts

@@ -1,41 +1,41 @@
-import ICEDotPath from '../ICEDotPath';
-declare class ICERose extends ICEDotPath {
-    constructor(props?: any);
-    /**
-     * @overwrite
-     * @method calcDots
-     *
-     * 计算路径上的关键点:
-     * - 默认的坐标原点是 (0,0) 位置。
-     * - 这些点没有经过 transform 矩阵变换。
-     *
-     * @returns
-     */
-    protected calcDots(): any;
-    /**
-     * @overwrite
-     * @method calcComponentParams
-     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
-     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
-     * - 此方法不能依赖原点位置和 transform 矩阵。
-     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
-     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
-     * - 子类可以覆盖此方法，实现自己的计算逻辑。
-     * @returns
-     */
-    protected calcComponentParams(): {
-        width: any;
-        height: any;
-    };
-    /**
-     * @overwrite
-     * @method setState
-     * setState 仅仅修改参数，不会立即导致重新渲染，需要等待 FrameManager 调度，最小延迟时间约为 1/60=16.67 ms 。
-     *
-     * - 如果 setState 时指定了 radius 参数，则 width 会被重新计算，如果指定了 radius 参数则 height 会被重新计算。
-     * - 如果 setState 时仅仅指定 width 参数，则 radius 会被重新计算，如果仅仅指定了 height 参数，则 radius 会被重新计算。
-     * @param newState
-     */
-    setState(newState: any): void;
-}
-export default ICERose;
+import ICEDotPath from '../ICEDotPath';
+declare class ICERose extends ICEDotPath {
+    constructor(props?: any);
+    /**
+     * @overwrite
+     * @method __calcDots
+     *
+     * 计算路径上的关键点:
+     * - 默认的坐标原点是 (0,0) 位置。
+     * - 这些点没有经过 transform 矩阵变换。
+     *
+     * @returns
+     */
+    protected __calcDots(): any;
+    /**
+     * @overwrite
+     * @method calcComponentParams
+     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
+     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
+     * - 此方法不能依赖原点位置和 transform 矩阵。
+     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
+     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
+     * - 子类可以覆盖此方法，实现自己的计算逻辑。
+     * @returns
+     */
+    protected calcComponentParams(): {
+        width: any;
+        height: any;
+    };
+    /**
+     * @overwrite
+     * @method setState
+     * setState 仅仅修改参数，不会立即导致重新渲染，需要等待 FrameManager 调度，最小延迟时间约为 1/60=16.67 ms 。
+     *
+     * - 如果 setState 时指定了 radius 参数，则 width 会被重新计算，如果指定了 radius 参数则 height 会被重新计算。
+     * - 如果 setState 时仅仅指定 width 参数，则 radius 会被重新计算，如果仅仅指定了 height 参数，则 radius 会被重新计算。
+     * @param newState
+     */
+    setState(newState: any): void;
+}
+export default ICERose;

package/dist/types/graphic/shape/ICEStar.d.mts

@@ -0,0 +1,45 @@
+import ICEDotPath from '../ICEDotPath.mjs';
+/**
+ * @class ICEStar 正N角星
+ * @author 大漠穷秋<damoqiongqiu@126.com>
+ */
+declare class ICEStar extends ICEDotPath {
+    constructor(props?: any);
+    /**
+     * @overwrite
+     * @method __calcDots
+     *
+     * 计算路径上的关键点:
+     * - 默认的坐标原点是 (0,0) 位置。
+     * - 这些点没有经过 transform 矩阵变换。
+     *
+     * @returns
+     */
+    protected __calcDots(): any;
+    /**
+     * @overwrite
+     * @method calcComponentParams
+     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
+     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
+     * - 此方法不能依赖原点位置和 transform 矩阵。
+     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
+     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
+     * - 子类可以覆盖此方法，实现自己的计算逻辑。
+     * @returns
+     */
+    protected calcComponentParams(): {
+        width: any;
+        height: any;
+    };
+    /**
+     * @overwrite
+     * @method setState
+     * setState 仅仅修改参数，不会立即导致重新渲染，需要等待 FrameManager 调度，最小延迟时间约为 1/60=16.67 ms 。
+     *
+     * - 如果 setState 时指定了 radius 参数，则 width 会被重新计算，如果指定了 radius 参数则 height 会被重新计算。
+     * - 如果 setState 时仅仅指定 width 参数，则 radius 会被重新计算，如果仅仅指定了 height 参数，则 radius 会被重新计算。
+     * @param newState
+     */
+    setState(newState: any): void;
+}
+export default ICEStar;

package/dist/types/graphic/shape/ICEStar.d.ts

@@ -1,48 +1,45 @@
-import ICEDotPath from '../ICEDotPath';
-/**
- * @class ICEStar
- *
- * 正 N 角星
- *
- * @author 大漠穷秋<damoqiongqiu@126.com>
- */
-declare class ICEStar extends ICEDotPath {
-    constructor(props?: any);
-    /**
-     * @overwrite
-     * @method calcDots
-     *
-     * 计算路径上的关键点:
-     * - 默认的坐标原点是 (0,0) 位置。
-     * - 这些点没有经过 transform 矩阵变换。
-     *
-     * @returns
-     */
-    protected calcDots(): any;
-    /**
-     * @overwrite
-     * @method calcComponentParams
-     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
-     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
-     * - 此方法不能依赖原点位置和 transform 矩阵。
-     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
-     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
-     * - 子类可以覆盖此方法，实现自己的计算逻辑。
-     * @returns
-     */
-    protected calcComponentParams(): {
-        width: any;
-        height: any;
-    };
-    /**
-     * @overwrite
-     * @method setState
-     * setState 仅仅修改参数，不会立即导致重新渲染，需要等待 FrameManager 调度，最小延迟时间约为 1/60=16.67 ms 。
-     *
-     * - 如果 setState 时指定了 radius 参数，则 width 会被重新计算，如果指定了 radius 参数则 height 会被重新计算。
-     * - 如果 setState 时仅仅指定 width 参数，则 radius 会被重新计算，如果仅仅指定了 height 参数，则 radius 会被重新计算。
-     * @param newState
-     */
-    setState(newState: any): void;
-}
-export default ICEStar;
+import ICEDotPath from '../ICEDotPath';
+/**
+ * @class ICEStar 正N角星
+ * @author 大漠穷秋<damoqiongqiu@126.com>
+ */
+declare class ICEStar extends ICEDotPath {
+    constructor(props?: any);
+    /**
+     * @overwrite
+     * @method __calcDots
+     *
+     * 计算路径上的关键点:
+     * - 默认的坐标原点是 (0,0) 位置。
+     * - 这些点没有经过 transform 矩阵变换。
+     *
+     * @returns
+     */
+    protected __calcDots(): any;
+    /**
+     * @overwrite
+     * @method calcComponentParams
+     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
+     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
+     * - 此方法不能依赖原点位置和 transform 矩阵。
+     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
+     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
+     * - 子类可以覆盖此方法，实现自己的计算逻辑。
+     * @returns
+     */
+    protected calcComponentParams(): {
+        width: any;
+        height: any;
+    };
+    /**
+     * @overwrite
+     * @method setState
+     * setState 仅仅修改参数，不会立即导致重新渲染，需要等待 FrameManager 调度，最小延迟时间约为 1/60=16.67 ms 。
+     *
+     * - 如果 setState 时指定了 radius 参数，则 width 会被重新计算，如果指定了 radius 参数则 height 会被重新计算。
+     * - 如果 setState 时仅仅指定 width 参数，则 radius 会被重新计算，如果仅仅指定了 height 参数，则 radius 会被重新计算。
+     * @param newState
+     */
+    setState(newState: any): void;
+}
+export default ICEStar;

package/dist/types/graphic/text/ICEText.d.mts

@@ -0,0 +1,137 @@
+import ICEComponent from '../ICEComponent.mjs';
+/**
+ * TODO:draw text along Path2D
+ * @class ICEText 文本
+ * @author 大漠穷秋<damoqiongqiu@126.com>
+ */
+declare class ICEText extends ICEComponent {
+    /**
+     * @cfg
+     * {
+     *   text:'文本内容',
+     *   left:0,
+     *   top:0,
+     *   style:{
+     *       fontWeight:24,
+     *       fontSize:48,
+     *       fontFamily:'Arial',
+     *       lineWidth:1,
+     *       textBaseline:'bottom',
+     *       paddingTop:0,    //number 型，不可加单位
+     *       paddingBottom:0, //number 型，不可加单位
+     *       paddingLeft:0,   //number 型，不可加单位
+     *       paddingRight:0,  //number 型，不可加单位
+     *   }
+     * }
+     * @param props
+     */
+    constructor(props?: any);
+    protected static arrangeParam(props: any): any;
+    /**
+     * @overwrite
+     * 双击进入内联编辑态。
+     */
+    protected initEvents(): void;
+    /**
+     * 进入编辑前的 draggable 原值，退出编辑时恢复。
+     */
+    private __originalDraggable;
+    /**
+     * 编辑态叠加的 HTML input（用于支持中文 IME 输入）。浏览器环境下存在；
+     * 无 document 的运行时（Node/小程序）为 null，降级为 canvas keydown 输入。
+     */
+    private __editInput;
+    /**
+     * 进入内联编辑态：光标定位到文本末尾，隐藏变换面板、禁用拖拽（避免编辑时误拖动）。
+     */
+    startEditing(): void;
+    /**
+     * 退出内联编辑态（提交文本）。退出后不自动恢复变换面板——用户若需再变换组件，重新点击组件即可。
+     */
+    stopEditing(): void;
+    /**
+     * 创建透明的 HTML input 覆盖在文本上，捕获输入（含中文 IME）。
+     * input 文字设为透明（canvas 负责显示），只保留可见光标。
+     */
+    private __mountEditInput;
+    /**
+     * 移除编辑态的 HTML input。
+     */
+    private __unmountEditInput;
+    /**
+     * 全局 mousedown 处理器：点击的组件不是自身时，退出编辑（失焦退出）。
+     */
+    private __globalMouseDownHandler;
+    /**
+     * 设置文本内容（会重新测量宽高）。
+     */
+    setText(text: string): this;
+    getText(): string;
+    /**
+     * @overwrite
+     * 编辑态下接管键盘输入：字符插入 / Backspace / Delete / 方向键移动光标 / Enter 提交。
+     */
+    protected keyboardEvtHandler(evt: any): void;
+    /**
+     * 在编辑态下渲染光标（垂直竖线），位置由 caretIndex + ctx.measureText 计算。
+     */
+    private renderCaret;
+    /**
+     * @overwrite
+     * @method calcComponentParams
+     * - 计算组件最原始的宽高和位置，此时没有经过任何变换，也没有移动坐标原点。
+     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
+     * - 此方法不能依赖原点位置和 transform 矩阵。
+     * - 此方法会在 render() 中调用，所以不需要在构造函数中调用。
+     * - 此方法中不能使用 setState() ，如果需要修改状态，直接赋值，如：this.state.width = 100;
+     * - 子类可以覆盖此方法，实现自己的计算逻辑。
+     * @returns
+     */
+    protected calcComponentParams(): {
+        width: any;
+        height: any;
+    };
+    /**
+     * @method measureText
+     *
+     * - Canvas 中没有提供原生的计算文本高度的有效方法，文本宽高的计算需要使用特殊的方法，这里使用的方法来自 https://longviewcoder.com/2021/02/11/html5-canvas-text-line-height-measurement/
+     * - 计算原始的宽高、位置，此时没有经过任何变换，也没有移动坐标原点。
+     * - 在计算组件的原始尺寸时还没有确定原点坐标，所以只能基于组件本地坐标系的左上角 (0,0) 点进行计算。
+     *
+     * FIXME:这里有性能瓶颈，需要进一步优化
+     * FIXME:某些运行时环境可能不支持动态插入 HTML 标签，以上测量文本宽高的方法可能存在兼容性问题。
+     * FIXME:对文本位置的控制需要更精细的计算方法。
+     */
+    private measureText;
+    /**
+     * 计算换行后的行数组；返回 null 表示「不换行，按 \n 拆」。
+     */
+    private __computeWrappedLines;
+    /** 统一的测宽函数：优先 ctx.measureText；无 ctx 时按 fontSize 粗估。 */
+    private __measureFn;
+    /**
+     * 按 grapheme cluster 切分。
+     * 优先 Intl.Segmenter（Baseline 2024），能把 emoji / ZWJ 序列 / 组合字符合成一个单元；
+     * 不可用时退化为码点切分（至少不会把代理对拆开）。
+     */
+    private __graphemes;
+    /** 贪心换行：逐 grapheme 累加，超过可用宽度即断行。保留段落自身的 \n。 */
+    private __wrapText;
+    /**
+     * 超过 maxLines 时截断末行并追加省略号；逐 grapheme 回退直到「内容+省略号」放得下。
+     */
+    private __truncateLines;
+    /** 用 Canvas TextMetrics.actualBoundingBox* 测量文本真实宽高；不支持则返回 null 降级。 */
+    private __measureByCanvas;
+    private __applyMeasuredSize;
+    /** DOM 降级测量：line-height 归一为 1，减少 leading 干扰（旧环境/小程序）。 */
+    private __measureByDOM;
+    /**
+     * @method doRender
+     * @overwrite
+     * 文本是基于 baseline 绘制的，文本是从 y 坐标向屏幕上方绘制的，48 是文本高度，这里需要补偿文本高度。
+     * 同时把移动坐标轴原点的偏移量计算进去。
+     */
+    protected doRender(): void;
+}
+export default ICEText;