cbvirtua 1.0.41 → 1.0.42

package/canvas-event-system/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "canvas-event-system",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "start": "webpack-dev-server"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/JS-Hao/canvas-event-system.git"
+  },
+  "keywords": [
+    "canvas",
+    "event",
+    "system",
+    "listeners"
+  ],
+  "author": "JS-Hao",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/JS-Hao/canvas-event-system/issues"
+  },
+  "homepage": "https://github.com/JS-Hao/canvas-event-system#readme",
+  "devDependencies": {
+    "@babel/core": "^7.12.3",
+    "@babel/plugin-proposal-class-properties": "^7.12.1",
+    "@babel/plugin-transform-runtime": "^7.12.1",
+    "@babel/preset-env": "^7.12.1",
+    "@babel/preset-typescript": "^7.12.1",
+    "babel-loader": "^8.1.0",
+    "typescript": "^4.0.3",
+    "webpack": "^4.44.2",
+    "webpack-cli": "^3.3.2",
+    "webpack-dev-server": "^3.3.1"
+  },
+  "dependencies": {
+    "uuid": "^8.3.1"
+  }
+}

package/canvas-event-system/readme.md

@@ -0,0 +1,13 @@
+## 一个简易的 Canvas 事件系统
+
+### 食用方法
+
+执行如下命令行：
+
+```
+npm start
+```
+
+访问`http://localhost:9000`即可
+
+![](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/a54e80ebb2184f0fa5fddbde16b60bd3~tplv-k3u1fbpfcp-watermark.image)

package/canvas-event-system/src/canvas-event-system/EventSimulator.ts

@@ -0,0 +1,75 @@
+import { Listener, EventNames } from './shapes';
+
+export interface Action {
+  type: ActionType;
+  id: string;
+}
+
+export enum ActionType {
+  Down = 'DOWN',
+  Up = 'Up',
+  Move = 'MOVE',
+}
+
+export default class EventSimulator {
+  private listenersMap: {
+    [id: string]: {
+      [eventName: string]: Listener[];
+    };
+  } = {};
+
+  private lastDownId: string;
+  private lastMoveId: string;
+
+  addAction(action: Action, evt: MouseEvent) {
+    const { type, id } = action;
+
+    // mousemove
+    if (type === ActionType.Move) {
+      this.fire(id, EventNames.mousemove, evt);
+    }
+
+    // mouseover
+    // mouseenter
+    if (type === ActionType.Move && (!this.lastMoveId || this.lastMoveId !== id)) {
+      this.fire(id, EventNames.mouseenter, evt);
+      this.fire(this.lastMoveId, EventNames.mouseleave, evt);
+    }
+
+    // mousedown
+    if (type === ActionType.Down) {
+      this.fire(id, EventNames.mousedown, evt);
+    }
+
+    // mouseup
+    if (type === ActionType.Up) {
+      this.fire(id, EventNames.mouseup, evt);
+    }
+
+    // click
+    if (type === ActionType.Up && this.lastDownId === id) {
+      this.fire(id, EventNames.click, evt);
+    }
+
+    if (type === ActionType.Move) {
+      this.lastMoveId = action.id;
+    } else if (type === ActionType.Down) {
+      this.lastDownId = action.id;
+    }
+  }
+
+  addListeners(
+    id: string,
+    listeners: {
+      [eventName: string]: Listener[];
+    },
+  ) {
+    this.listenersMap[id] = listeners;
+  }
+
+  fire(id: string, eventName: EventNames, evt: MouseEvent) {
+    if (this.listenersMap[id] && this.listenersMap[id][eventName]) {
+      this.listenersMap[id][eventName].forEach((listener) => listener(evt));
+    }
+  }
+}

package/canvas-event-system/src/canvas-event-system/helpers.ts

@@ -0,0 +1,27 @@
+export function idToRgba(id: string) {
+  return id.split("-");
+}
+
+export function rgbaToId(rgba: [number, number, number, number]) {
+  return rgba.join("-");
+}
+
+const idPool = {};
+
+export function createId(): string {
+  let id = createOnceId();
+
+  while (idPool[id]) {
+    id = createOnceId();
+  }
+
+  return id;
+}
+
+function createOnceId(): string {
+  return Array(3)
+    .fill(0)
+    .map(() => Math.ceil(Math.random() * 255))
+    .concat(255)
+    .join("-");
+}

package/canvas-event-system/src/canvas-event-system/index.ts

@@ -0,0 +1,64 @@
+import { rgbaToId } from './helpers';
+import { Shape } from './shapes/types';
+import EventSimulator, { ActionType } from './EventSimulator';
+export * from './shapes';
+
+export class Stage {
+  private canvas: HTMLCanvasElement;
+  private osCanvas: OffscreenCanvas;
+  private ctx: CanvasRenderingContext2D;
+  private osCtx: OffscreenCanvasRenderingContext2D;
+  private dpr: number;
+  private shapes: Set<string>;
+  private eventSimulator: EventSimulator;
+
+  constructor(canvas: HTMLCanvasElement) {
+    const dpr = window.devicePixelRatio;
+    canvas.width = parseInt(canvas.style.width) * dpr;
+    canvas.height = parseInt(canvas.style.height) * dpr;
+
+    this.canvas = canvas;
+    this.osCanvas = new OffscreenCanvas(canvas.width, canvas.height);
+
+    this.ctx = this.canvas.getContext('2d');
+    this.osCtx = this.osCanvas.getContext('2d');
+
+    this.ctx.scale(dpr, dpr);
+    this.osCtx.scale(dpr, dpr);
+    this.dpr = dpr;
+
+    this.canvas.addEventListener('mousedown', this.handleCreator(ActionType.Down));
+    this.canvas.addEventListener('mouseup', this.handleCreator(ActionType.Up));
+    this.canvas.addEventListener('mousemove', this.handleCreator(ActionType.Move));
+
+    this.shapes = new Set();
+    this.eventSimulator = new EventSimulator();
+  }
+
+  add(shape: Shape) {
+    const id = shape.getId();
+    this.eventSimulator.addListeners(id, shape.getListeners());
+    this.shapes.add(id);
+
+    shape.draw(this.ctx, this.osCtx);
+  }
+
+  private handleCreator = (type: ActionType) => (evt: MouseEvent) => {
+    const x = evt.offsetX;
+    const y = evt.offsetY;
+    const id = this.hitJudge(x, y);
+    this.eventSimulator.addAction({ type, id }, evt);
+  };
+
+  /**
+   * Determine whether the current position is inside a certain shape, if it is, then return its id
+   * @param x
+   * @param y
+   */
+  private hitJudge(x: number, y: number): string {
+    const rgba = Array.from(this.osCtx.getImageData(x * this.dpr, y * this.dpr, 1, 1).data);
+
+    const id = rgbaToId(rgba as [number, number, number, number]);
+    return this.shapes.has(id) ? id : undefined;
+  }
+}

package/canvas-event-system/src/canvas-event-system/shapes/Base.ts

@@ -0,0 +1,32 @@
+import { EventNames, Listener, Shape } from './types';
+import { createId } from '../helpers';
+
+export default class Base implements Shape {
+  private listeners: { [eventName: string]: Listener[] };
+  public id: string;
+
+  constructor() {
+    this.id = createId();
+    this.listeners = {};
+  }
+
+  draw(ctx: CanvasRenderingContext2D, osCtx: OffscreenCanvasRenderingContext2D): void {
+    throw new Error('Method not implemented.');
+  }
+
+  on(eventName: EventNames, listener: Listener): void {
+    if (this.listeners[eventName]) {
+      this.listeners[eventName].push(listener);
+    } else {
+      this.listeners[eventName] = [listener];
+    }
+  }
+
+  getListeners(): { [name: string]: Listener[] } {
+    return this.listeners;
+  }
+
+  getId(): string {
+    return this.id;
+  }
+}

package/canvas-event-system/src/canvas-event-system/shapes/Circle.ts

@@ -0,0 +1,46 @@
+import { idToRgba } from '../helpers';
+import Base from './Base';
+
+interface RectProps {
+  x: number;
+  y: number;
+  radius: number;
+  strokeWidth?: number;
+  strokeColor?: string;
+  fillColor?: string;
+}
+
+export default class Circle extends Base {
+  constructor(private props: RectProps) {
+    super();
+    this.props.fillColor = this.props.fillColor || '#fff';
+    this.props.strokeColor = this.props.strokeColor || '#000';
+    this.props.strokeWidth = this.props.strokeWidth || 1;
+  }
+
+  draw(ctx: CanvasRenderingContext2D, osCtx: OffscreenCanvasRenderingContext2D) {
+    const { x, y, radius, strokeColor, strokeWidth, fillColor } = this.props;
+
+    ctx.save();
+    ctx.beginPath();
+    ctx.fillStyle = fillColor;
+    ctx.strokeStyle = strokeColor;
+    ctx.lineWidth = strokeWidth;
+    ctx.arc(x, y, radius, 0, Math.PI * 2);
+    ctx.fill();
+    ctx.stroke();
+    ctx.restore();
+
+    const [r, g, b, a] = idToRgba(this.id);
+
+    osCtx.save();
+    osCtx.beginPath();
+    osCtx.fillStyle = `rgba(${r}, ${g}, ${b}, ${a})`;
+    osCtx.strokeStyle = `rgba(${r}, ${g}, ${b}, ${a})`;
+    osCtx.lineWidth = strokeWidth;
+    osCtx.arc(x, y, radius, 0, Math.PI * 2);
+    osCtx.fill();
+    osCtx.stroke();
+    osCtx.restore();
+  }
+}

package/canvas-event-system/src/canvas-event-system/shapes/Rect.ts

@@ -0,0 +1,46 @@
+import { idToRgba } from '../helpers';
+import Base from './Base';
+
+interface RectProps {
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+  strokeWidth?: number;
+  strokeColor?: string;
+  fillColor?: string;
+}
+
+export default class Rect extends Base {
+  constructor(private props: RectProps) {
+    super();
+    this.props.fillColor = this.props.fillColor || '#fff';
+    this.props.strokeColor = this.props.strokeColor || '#000';
+    this.props.strokeWidth = this.props.strokeWidth || 1;
+  }
+
+  draw(ctx: CanvasRenderingContext2D, osCtx: OffscreenCanvasRenderingContext2D) {
+    const { x, y, width, height, strokeColor, strokeWidth, fillColor } = this.props;
+
+    ctx.save();
+    ctx.beginPath();
+    ctx.strokeStyle = strokeColor;
+    ctx.lineWidth = strokeWidth;
+    ctx.fillStyle = fillColor;
+    ctx.rect(x, y, width, height);
+    ctx.fill();
+    ctx.stroke();
+    ctx.restore();
+
+    const [r, g, b, a] = idToRgba(this.id);
+
+    osCtx.save();
+    osCtx.beginPath();
+    osCtx.strokeStyle = `rgba(${r}, ${g}, ${b}, ${a})`;
+    osCtx.fillStyle = `rgba(${r}, ${g}, ${b}, ${a})`;
+    osCtx.rect(x, y, width, height);
+    osCtx.fill();
+    osCtx.stroke();
+    osCtx.restore();
+  }
+}

package/canvas-event-system/src/canvas-event-system/shapes/index.ts

@@ -0,0 +1,5 @@
+import Rect from './Rect';
+import Circle from './Circle';
+
+export * from './types';
+export { Rect, Circle };

package/canvas-event-system/src/canvas-event-system/shapes/types.ts

@@ -0,0 +1,22 @@
+export interface Shape {
+  draw(ctx: CanvasRenderingContext2D, osCtx: OffscreenCanvasRenderingContext2D): void;
+
+  on(name: string, listener: Listener): void;
+
+  getListeners(): { [name: string]: Listener[] };
+
+  getId(): string;
+}
+
+export interface Listener {
+  (evt: MouseEvent): void;
+}
+
+export enum EventNames {
+  click = 'click',
+  mousedown = 'mousedown',
+  mousemove = 'mousemove',
+  mouseup = 'mouseup',
+  mouseenter = 'mouseenter',
+  mouseleave = 'mouseleave',
+}

package/canvas-event-system/src/index.html

@@ -0,0 +1,12 @@
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>canvas-event-system</title>
+  </head>
+  <body>
+    <canvas id="canvas" style="width: 500px; height: 350px; border: 1px solid #000;"></canvas>
+
+    <script src="./index.js"></script>
+    <script></script>
+  </body>
+</html>

package/canvas-event-system/src/index.ts

@@ -0,0 +1,30 @@
+import { Stage, Rect, Circle, EventNames } from './canvas-event-system';
+
+const canvas = document.querySelector('#canvas') as HTMLCanvasElement;
+const stage = new Stage(canvas);
+
+const rect = new Rect({
+  x: 50,
+  y: 50,
+  width: 250,
+  height: 175,
+  fillColor: 'green',
+});
+
+const circle = new Circle({
+  x: 200,
+  y: 200,
+  radius: 100,
+  fillColor: 'red',
+});
+
+rect.on(EventNames.mousedown, () => console.log('rect mousedown'));
+rect.on(EventNames.mouseup, () => console.log('rect mouseup'));
+rect.on(EventNames.mouseenter, () => console.log('rect mouseenter'));
+rect.on(EventNames.click, () => console.log('rect click'));
+
+circle.on(EventNames.click, () => console.log('circle click!!'));
+circle.on(EventNames.mouseleave, () => console.log('circle mouseleave!'));
+
+stage.add(rect);
+stage.add(circle);

package/canvas-event-system/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "ESNext",
+    "jsx": "react",
+    "jsxFactory": "h",
+    "importHelpers": true,
+    "moduleResolution": "node",
+    "declaration": true,
+    "allowSyntheticDefaultImports": true,
+    //json
+    "resolveJsonModule": true,
+    "esModuleInterop": true,
+    "baseUrl": ".",
+    "outDir": "./build"
+  }
+}

package/canvas-event-system/webpack.config.js

@@ -0,0 +1,28 @@
+const path = require("path");
+
+module.exports = {
+  entry: {
+    index: "./src/index.ts",
+  },
+  output: {
+    filename: "[name].js",
+    path: path.resolve(__dirname, "dist"),
+  },
+  module: {
+    rules: [
+      {
+        test: /\.(ts|tsx)$/,
+        use: "babel-loader",
+      },
+    ],
+  },
+  devServer: {
+    contentBase: path.join(__dirname, "src"),
+    compress: true,
+    port: 9000,
+    host: "0.0.0.0",
+  },
+  resolve: {
+    extensions: [".ts", ".tsx", ".js", ".jsx"],
+  },
+};

package/hanzi-writer/.prettierrc.json

@@ -0,0 +1,7 @@
+{
+  "trailingComma": "all",
+  "tabWidth": 2,
+  "semi": true,
+  "singleQuote": true,
+  "printWidth": 90
+}

package/hanzi-writer/COPYING.md

@@ -0,0 +1,11 @@
+Hanzi Writer uses data from the excellent [Make Me a Hanzi](https://github.com/skishore/makemeahanzi) project and fonts from [Arphic](http://www.arphic.com.tw/en/home/index). You can redistribute and/or modify the font data under the terms of the Arphic Public License as published by Arphic Technology Co., Ltd. You should have
+received a copy of this license (the directory "APL") in the data folder of this repository;
+if not, see <http://ftp.gnu.org/non-gnu/chinese-fonts-truetype/LICENSE>.
+
+Arphic PL KaitiM GB and UKai
+Copyright 1999 Arphic Technology Co., Ltd.; licensed under the Arphic Public License
+http://www.arphic.com.tw/en/home/index
+
+Make Me a Hanzi
+Copyright 1999 Arphic Technology Co., Ltd., copyright 2016 Shaunak Kishore; licensed under the Arphic Public License
+https://github.com/skishore/makemeahanzi

package/hanzi-writer/LICENSE

@@ -0,0 +1,20 @@
+The MIT License (MIT)
+
+Copyright (c) 2014 David Chanin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/hanzi-writer/README.md

@@ -0,0 +1,37 @@
+
+Hanzi Writer
+=====================
+
+[![CircleCI](https://img.shields.io/circleci/project/github/chanind/hanzi-writer/master.svg)](https://circleci.com/gh/chanind/hanzi-writer/tree/master)
+[![Codecov](https://img.shields.io/codecov/c/github/chanind/hanzi-writer/master.svg)](https://codecov.io/gh/chanind/hanzi-writer)
+[![npm](https://img.shields.io/npm/v/hanzi-writer.svg)](https://www.npmjs.com/package/hanzi-writer)
+
+https://chanind.github.io/hanzi-writer
+
+Hanzi Writer is a free and open-source javascript library for Chinese character stroke order animations and stroke order practice quizzes. Works with both simplified and traditional characters.
+
+[Live demo](https://chanind.github.io/hanzi-writer/demo.html)
+
+## Getting Started and Documentation
+
+For more info and instructions on getting started check out https://chanind.github.io/hanzi-writer
+
+## Data source
+
+The chinese character svg and stroke order data used by Hanzi Writer is derived from the [Make me a Hanzi](https://github.com/skishore/makemeahanzi) project with some slight tweaks. The data can be found in the [Hanzi Writer Data](https://github.com/chanind/hanzi-writer-data) repo. There's a visualizer for this data [here](https://chanind.github.io/hanzi-writer-data).
+
+## Contributing
+
+Pull requests are welcome! If you would like to contribute code, you'll need to be able to build the project locally. After cloning the Hanzi Writer repo, you can get it set up by running:
+
+```
+yarn install
+```
+
+You can run tests with `yarn test` and you can build the project with `yarn build`.
+
+## License
+
+Hanzi Writer is released under an [MIT](https://raw.githubusercontent.com/chanind/hanzi-writer/master/LICENSE) license.
+
+The Hanzi Writer data comes from the [Make Me A Hanzi](https://github.com/skishore/makemeahanzi) project, which extracted the data from fonts by [Arphic Technology](http://www.arphic.com/), a Taiwanese font forge that released their work under a permissive license in 1999. You can redistribute and/or modify this data under the terms of the Arphic Public License as published by Arphic Technology Co., Ltd. A copy of this license can be found in [ARPHICPL.TXT](https://raw.githubusercontent.com/chanind/hanzi-writer-data/master/ARPHICPL.TXT).

package/hanzi-writer/babel.config.js

@@ -0,0 +1,14 @@
+module.exports = {
+  presets: [
+    [
+      '@babel/preset-env',
+      {
+        targets: {
+          browsers: '>2%',
+          node: '12',
+        },
+      },
+    ],
+    '@babel/preset-typescript',
+  ],
+};

package/hanzi-writer/dist/types/HanziWriter.d.ts

@@ -0,0 +1,108 @@
+import RenderState from './RenderState';
+import Positioner from './Positioner';
+import Quiz from './Quiz';
+import LoadingManager from './LoadingManager';
+import Character from './models/Character';
+import HanziWriterRendererBase, { HanziWriterRendererConstructor } from './renderers/HanziWriterRendererBase';
+import RenderTargetBase from './renderers/RenderTargetBase';
+import { ColorOptions, DimensionOptions, HanziWriterOptions, LoadingManagerOptions, OnCompleteFunction, ParsedHanziWriterOptions, QuizOptions, RenderTargetInitFunction } from './typings/types';
+export * from './typings/types';
+export default class HanziWriter {
+    _options: ParsedHanziWriterOptions;
+    _loadingManager: LoadingManager;
+    /** Only set when calling .setCharacter() */
+    _char: string | undefined;
+    /** Only set when calling .setCharacter() */
+    _renderState: RenderState | undefined;
+    /** Only set when calling .setCharacter() */
+    _character: Character | undefined;
+    /** Only set when calling .setCharacter() */
+    _positioner: Positioner | undefined;
+    /** Only set when calling .setCharacter() */
+    _hanziWriterRenderer: HanziWriterRendererBase<HTMLElement, any> | null | undefined;
+    /** Only set when calling .setCharacter() */
+    _withDataPromise: Promise<void> | undefined;
+    _quiz: Quiz | undefined;
+    _renderer: {
+        HanziWriterRenderer: HanziWriterRendererConstructor;
+        createRenderTarget: RenderTargetInitFunction<any>;
+    };
+    target: RenderTargetBase;
+    /** Main entry point */
+    static create(element: string | HTMLElement, character: string, options?: Partial<HanziWriterOptions>): HanziWriter;
+    /** Singleton instance of LoadingManager. Only set in `loadCharacterData` */
+    static _loadingManager: LoadingManager | null;
+    /** Singleton loading options. Only set in `loadCharacterData` */
+    static _loadingOptions: Partial<HanziWriterOptions> | null;
+    static loadCharacterData(character: string, options?: Partial<LoadingManagerOptions>): Promise<void | import("./typings/types").CharacterJson>;
+    static getScalingTransform(width: number, height: number, padding?: number): {
+        x: number;
+        y: number;
+        scale: number;
+        transform: string;
+    };
+    constructor(element: string | HTMLElement, options?: Partial<HanziWriterOptions>);
+    showCharacter(options?: {
+        onComplete?: OnCompleteFunction;
+        duration?: number;
+    }): Promise<Promise<{
+        canceled: boolean;
+    }> | undefined>;
+    hideCharacter(options?: {
+        onComplete?: OnCompleteFunction;
+        duration?: number;
+    }): Promise<Promise<{
+        canceled: boolean;
+    }> | undefined>;
+    animateCharacter(options?: {
+        onComplete?: OnCompleteFunction;
+    }): Promise<Promise<{
+        canceled: boolean;
+    }> | undefined>;
+    animateStroke(strokeNum: number, options?: {
+        onComplete?: OnCompleteFunction;
+    }): Promise<Promise<{
+        canceled: boolean;
+    }> | undefined>;
+    highlightStroke(strokeNum: number, options?: {
+        onComplete?: OnCompleteFunction;
+    }): Promise<Promise<{
+        canceled: boolean;
+    }> | undefined>;
+    loopCharacterAnimation(): Promise<{
+        canceled: boolean;
+    } | undefined>;
+    pauseAnimation(): Promise<void | undefined>;
+    resumeAnimation(): Promise<void | undefined>;
+    showOutline(options?: {
+        duration?: number;
+        onComplete?: OnCompleteFunction;
+    }): Promise<Promise<{
+        canceled: boolean;
+    }> | undefined>;
+    hideOutline(options?: {
+        duration?: number;
+        onComplete?: OnCompleteFunction;
+    }): Promise<Promise<{
+        canceled: boolean;
+    }> | undefined>;
+    /** Updates the size of the writer instance without resetting render state */
+    updateDimensions({ width, height, padding }: Partial<DimensionOptions>): void;
+    updateColor(colorName: keyof ColorOptions, colorVal: string | null, options?: {
+        duration?: number;
+        onComplete?: OnCompleteFunction;
+    }): Promise<Promise<{
+        canceled: boolean;
+    }> | undefined>;
+    quiz(quizOptions?: Partial<QuizOptions>): Promise<Promise<void> | undefined>;
+    skipQuizStroke(): void;
+    cancelQuiz(): void;
+    setCharacter(char: string): Promise<void>;
+    _initAndMountHanziWriterRenderer(character: Character): HanziWriterRendererBase<any, any>;
+    getCharacterData(): Promise<Character>;
+    _assignOptions(options: Partial<HanziWriterOptions>): ParsedHanziWriterOptions;
+    /** returns a new options object with width and height filled in if missing */
+    _fillWidthAndHeight(options: HanziWriterOptions): ParsedHanziWriterOptions;
+    _withData<T>(func: () => T): Promise<T | undefined>;
+    _setupListeners(): void;
+}