@fulate/echart 1.0.0

package/README.md

@@ -0,0 +1,70 @@
+# `@fulate/echart`
+
+> 文档角色：`GUIDE`。权威来源：ECharts adapter 源码 TSDoc 与测试；Core/UI 场景生命周期见各自指南。
+
+`@fulate/echart` 提供 `EChartsShape`、`EChartsProperties`、`EChartsPool` 和 clipboard plugin。图表实例在 Worker surface
+中运行，Fulate 场景只保存 authored/runtime 图表配置，不把 Worker pool 或 surface identity 写入
+JSON、History 或 clipboard。
+
+## 配置 Worker pool
+
+每个 Root 提供一个 `EChartsPool`：
+
+```ts
+import { EChartsPool, eChartsPoolKey } from "@fulate/echart";
+
+const pool = new EChartsPool({
+  echartsUrl: "https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.esm.min.js",
+  size: 2
+});
+root.provide(eChartsPoolKey, pool);
+```
+
+`size` 省略时使用默认 Worker 数量。应用负责在 Root 生命周期结束时调用 `pool.dispose()`。
+
+## EChartsShape
+
+```ts
+const chart = new EChartsShape({
+  width: 640,
+  height: 360,
+  echarts: { option: { series: [] } }
+});
+```
+
+`echarts` 是 whole-value authored/runtime 字段。`setOptions({ echarts })` 替换持久配置；
+`setRuntimeOptions({ echarts })` 只覆盖当前运行态，`clearRuntimeOptions(["echarts"])` 恢复最新
+持久值。有效`theme`引用变化会重建surface；`option`、`notMerge`或`lazyUpdate`变化且theme未变时
+复用当前surface并发送一次`set-option`。width、height、DPR或Viewport scale变化只发送`resize`；
+ECharts逻辑宽高始终等于authored宽高，字号、间距、线宽和原始option保持不变。Shape按
+`Viewport scale × DPR × 2`计算`renderPixelRatio`，再按单图`8 × 1024 × 1024`像素预算裁剪上限；
+该倍率没有固定下限。Worker把最终倍率映射到ECharts的`devicePixelRatio`渲染参数，输出
+`authored尺寸 × renderPixelRatio`的位图。Layer把位图绘制到authored宽高，经过Viewport后按固定
+质量倍率下采样。Viewport CSS preview和animated focus期间复用已有frame，settle后的真实重绘只按
+最终倍率发送一次`resize`。DPR变化复用当前ECharts实例。相同有效字段为noop；Shape尚未激活时
+不创建surface，激活时直接采用当前有效配置。
+`setOption()`仍可直接调用当前Worker内原生ECharts的增量更新，不改变authored配置。
+
+`EChartsProperties`是公开的properties基类；`EChartsShape<Properties, Option>`与Rectangle/Image一样
+提供默认类型参数，并允许子类通过构造器第二参数交付扩展properties。surface始终由EChartsShape内部
+唯一持有，不属于公开properties或子类配置。
+
+## Action 与事件
+
+`dispatchAction(payload, options?)` 将可 structured-clone 的 action 发给 Worker。通过
+`addEChartsEventListener(name, listener)` 订阅原生或扩展事件；返回 cleanup，订阅会跨 surface
+重建保持。custom action 由 ECharts 扩展自己注册，Fulate 不重复注册。
+
+Scene鼠标坐标转成图元authored-local后原样进入Worker；Viewport scale、DPR和超采样质量都不参与
+坐标换算。custom action返回的坐标同样是authored-local，可直接交回Scene几何。
+
+## Clipboard
+
+`eChartsClipboardPlugin` 按 `Select` 实例显式安装：
+
+```ts
+const select = new Select().useClipboard(eChartsClipboardPlugin);
+```
+
+复制数据只包含图表配置和几何选项；恢复前应先在目标 Root 提供 pool。该 adapter 不引入旧格式
+迁移或第二套运行路径。

package/dist/clipboard.d.ts

@@ -0,0 +1,5 @@
+import { EChartsShape } from "./shape";
+export declare const eChartsClipboardPlugin: {
+    readonly type: "echarts";
+    readonly deserialize: (data: Record<string, any>) => EChartsShape<import("./shape").EChartsProperties, import("./shape").EChartsShapeOption<any>>;
+};

package/dist/echart-worker.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/echart-worker.js

@@ -0,0 +1,106 @@
+import { BitmapFrameEmitter, runWorkerSurfaceHost } from "@fulate/ui/worker-surface-worker";
+
+//#region packages/echart/src/worker-surface.ts
+/** ECharts-specific renderer state owned by one Worker surface. */
+var EChartsWorkerSurface = class {
+	canvas;
+	chart;
+	frames;
+	chartRenderPixelRatio;
+	frameRenderPixelRatio;
+	eventListeners = /* @__PURE__ */ new Map();
+	constructor(echarts, input, emitFrame, emitOutput) {
+		this.emitOutput = emitOutput;
+		const { authoredWidth, authoredHeight, renderPixelRatio, theme, option, notMerge, lazyUpdate } = input;
+		this.canvas = new OffscreenCanvas(authoredWidth * renderPixelRatio, authoredHeight * renderPixelRatio);
+		this.chartRenderPixelRatio = this.frameRenderPixelRatio = renderPixelRatio;
+		this.chart = echarts.init(this.canvas, theme ?? null, {
+			width: authoredWidth,
+			height: authoredHeight,
+			devicePixelRatio: renderPixelRatio
+		});
+		this.frames = new BitmapFrameEmitter(() => this.getFrameCanvas(), emitFrame);
+		this.chart.on("rendered", () => this.frames.request());
+		this.chart.setOption(option, notMerge, lazyUpdate);
+	}
+	receive(command) {
+		switch (command.type) {
+			case "set-option":
+				this.chart.setOption(command.option, command.notMerge, command.lazyUpdate);
+				break;
+			case "dispatch-action":
+				this.chart.dispatchAction(command.payload, command.opt);
+				break;
+			case "event":
+				this.chart.getZr().handler.dispatch(command.name, {
+					zrX: command.x,
+					zrY: command.y,
+					clientX: command.x,
+					clientY: command.y,
+					preventDefault: () => {},
+					stopPropagation: () => {}
+				});
+				break;
+			case "add-event-listener": {
+				const listener = (params) => {
+					this.emitOutput({
+						type: "event",
+						name: command.name,
+						params
+					});
+				};
+				this.eventListeners.set(command.name, listener);
+				this.chart.on(command.name, listener);
+				break;
+			}
+			case "remove-event-listener":
+				this.chart.off(command.name, this.eventListeners.get(command.name));
+				this.eventListeners.delete(command.name);
+				break;
+			case "resize":
+				this.frameRenderPixelRatio = command.renderPixelRatio;
+				this.chart.resize({
+					width: command.authoredWidth,
+					height: command.authoredHeight
+				});
+				break;
+			case "visibility":
+				if (command.visible) {
+					this.chart.getZr().animation.resume();
+					this.frames.resume();
+				} else {
+					this.frames.pause();
+					this.chart.getZr().animation.pause();
+				}
+				break;
+		}
+	}
+	dispose() {
+		this.frames.dispose();
+		this.eventListeners.clear();
+		this.chart.dispose();
+	}
+	getFrameCanvas() {
+		if (this.frameRenderPixelRatio === this.chartRenderPixelRatio) return this.canvas;
+		return this.chart.renderToCanvas({ pixelRatio: this.frameRenderPixelRatio });
+	}
+};
+
+//#endregion
+//#region packages/echart/src/echart-worker.ts
+runWorkerSurfaceHost({
+	async initialize(input) {
+		const module = await import(
+			/* @vite-ignore */
+			input.echartsUrl
+);
+		const echarts = module.default ?? module;
+		echarts.setPlatformAPI({ createCanvas: () => new OffscreenCanvas(1, 1) });
+		return echarts;
+	},
+	create(echarts, input, emitFrame, emitOutput) {
+		return new EChartsWorkerSurface(echarts, input, emitFrame, emitOutput);
+	}
+});
+
+//#endregion

package/dist/index.d.ts

@@ -0,0 +1,6 @@
+export { EChartsPool, eChartsPoolKey } from "./pool";
+export type { EChartsPoolOptions } from "./pool";
+export { EChartsProperties, EChartsShape } from "./shape";
+export type { EChartsEventListener, EChartsShapeOption, EChartsShapeOptionPatch } from "./shape";
+export type { EChartsActionPayload, EChartsDispatchActionOptions, EChartsInitOpts } from "./protocol";
+export { eChartsClipboardPlugin } from "./clipboard";

package/dist/index.js

@@ -0,0 +1,266 @@
+import { Bitmap, RectangleProperties, RectangleTransform, WorkerSurfacePool } from "@fulate/ui";
+import { createPointView } from "@fulate/share";
+
+//#region packages/echart/src/pool.ts
+const eChartsPoolKey = Symbol();
+/** Configures one independent ECharts backend over the shared surface pool. */
+var EChartsPool = class {
+	surfaces;
+	constructor(options) {
+		const { echartsUrl, size = 2 } = options;
+		this.surfaces = new WorkerSurfacePool({
+			size,
+			initialize: { echartsUrl: String(echartsUrl) },
+			createWorker: () => new Worker(new URL("./echart-worker.js", import.meta.url), { type: "module" })
+		});
+	}
+	/** @internal Creates the renderer for one active EChartsShape. */
+	create(input, onFrame, onOutput) {
+		return this.surfaces.create(input, onFrame, onOutput);
+	}
+	dispose() {
+		this.surfaces.dispose();
+	}
+};
+
+//#endregion
+//#region packages/echart/src/shape.ts
+const RENDER_QUALITY = 2;
+const BITMAP_PIXEL_BUDGET = 8 * 1024 * 1024;
+/** Public properties base for typed EChartsShape subclasses. */
+var EChartsProperties = class extends RectangleProperties {
+	echarts;
+	constructor(options = {}) {
+		super(options);
+		this.echarts = options.echarts ?? { option: {} };
+	}
+};
+var EChartsTransform = class extends RectangleTransform {
+	hasInView() {
+		const inView = super.hasInView();
+		this.element.syncChartVisibility(inView);
+		return inView;
+	}
+};
+var EChartsShape = class extends Bitmap {
+	type = "echarts";
+	surface = null;
+	lastVisibility;
+	sentAuthoredWidth = 0;
+	sentAuthoredHeight = 0;
+	sentRenderPixelRatio = 0;
+	cleanups = [];
+	eChartsEventListeners = /* @__PURE__ */ new Map();
+	/** Current effective chart configuration, including runtime overrides. */
+	get echarts() {
+		return this.propertyState.echarts;
+	}
+	constructor(options, properties = new EChartsProperties(options), Transform = EChartsTransform) {
+		super(options, properties, Transform);
+	}
+	/** Sends one native incremental ECharts update outside authored state. */
+	setOption(option, notMerge, lazyUpdate) {
+		this.surface?.post({
+			type: "set-option",
+			option,
+			notMerge,
+			lazyUpdate
+		});
+	}
+	/**
+	* Dispatches one action to the current native ECharts instance in its Worker.
+	* Registered action events return through `addEChartsEventListener()`.
+	*/
+	dispatchAction(payload, opt) {
+		this.surface?.post({
+			type: "dispatch-action",
+			payload,
+			opt
+		});
+	}
+	/**
+	* Subscribes to one native ECharts instance event across the Worker boundary.
+	* Custom action events must be registered by the loaded ECharts extension.
+	* The returned cleanup survives chart restarts and removes this subscription.
+	*/
+	addEChartsEventListener(name, listener) {
+		let listeners = this.eChartsEventListeners.get(name);
+		if (!listeners) {
+			listeners = /* @__PURE__ */ new Set();
+			this.eChartsEventListeners.set(name, listeners);
+			this.surface?.post({
+				type: "add-event-listener",
+				name
+			});
+		}
+		listeners.add(listener);
+		return () => {
+			const current = this.eChartsEventListeners.get(name);
+			if (!current) return;
+			current.delete(listener);
+			if (current.size > 0) return;
+			this.eChartsEventListeners.delete(name);
+			this.surface?.post({
+				type: "remove-event-listener",
+				name
+			});
+		};
+	}
+	resizeChart() {
+		const surface = this.surface;
+		if (!surface) return;
+		const authoredWidth = this.width;
+		const authoredHeight = this.height;
+		const renderPixelRatio = this.chartRenderPixelRatio;
+		if (authoredWidth === this.sentAuthoredWidth && authoredHeight === this.sentAuthoredHeight && renderPixelRatio === this.sentRenderPixelRatio) return;
+		this.sentAuthoredWidth = authoredWidth;
+		this.sentAuthoredHeight = authoredHeight;
+		this.sentRenderPixelRatio = renderPixelRatio;
+		surface.post({
+			type: "resize",
+			authoredWidth,
+			authoredHeight,
+			renderPixelRatio
+		});
+	}
+	onPropertiesChanged(current, changes) {
+		super.onPropertiesChanged(current, changes);
+		if (!this.isActive) return;
+		if (changes.has("echarts")) {
+			const previous = changes.get("echarts");
+			const next = current.echarts;
+			if (!Object.is(previous.theme, next.theme)) {
+				this.restartChart();
+				return;
+			}
+			if (!Object.is(previous.option, next.option) || !Object.is(previous.notMerge, next.notMerge) || !Object.is(previous.lazyUpdate, next.lazyUpdate)) this.setOption(next.option, next.notMerge, next.lazyUpdate);
+		}
+		if (changes.has("width") || changes.has("height")) this.resizeChart();
+	}
+	onActivate(root, layer) {
+		super.onActivate(root, layer);
+		this.startChart(root.inject(eChartsPoolKey));
+	}
+	onDeactivate(root, layer) {
+		this.stopChart();
+		super.onDeactivate(root, layer);
+	}
+	onUnmount() {
+		this.stopChart();
+		this.eChartsEventListeners.clear();
+		super.onUnmount();
+	}
+	paintContent(ctx) {
+		this.resizeChart();
+		this.syncChartVisibility(true);
+		this.paintBitmap(ctx, this.width, this.height);
+	}
+	/** @internal Synchronizes ECharts animation with the actual paint path. */
+	syncChartVisibility(visible) {
+		const surface = this.surface;
+		if (!surface || visible === this.lastVisibility) return;
+		this.lastVisibility = visible;
+		surface.post({
+			type: "visibility",
+			visible
+		});
+	}
+	startChart(pool) {
+		const input = {
+			authoredWidth: this.width,
+			authoredHeight: this.height,
+			renderPixelRatio: this.chartRenderPixelRatio,
+			...this.echarts
+		};
+		this.sentAuthoredWidth = input.authoredWidth;
+		this.sentAuthoredHeight = input.authoredHeight;
+		this.sentRenderPixelRatio = input.renderPixelRatio;
+		this.lastVisibility = void 0;
+		this.surface = pool.create(input, (bitmap) => this.presentBitmap(bitmap), (output) => this.receiveEChartsOutput(output));
+		for (const name of this.eChartsEventListeners.keys()) this.surface.post({
+			type: "add-event-listener",
+			name
+		});
+		this.bindEvents();
+	}
+	restartChart() {
+		const pool = this.root.inject(eChartsPoolKey);
+		this.stopChart();
+		this.startChart(pool);
+	}
+	stopChart() {
+		this.surface?.dispose();
+		this.surface = null;
+		this.lastVisibility = void 0;
+		this.cleanups.forEach((cleanup) => cleanup());
+		this.cleanups = [];
+	}
+	toLocal(event) {
+		return this.transform.toLocal(createPointView(event.detail.x, event.detail.y)) ?? createPointView(-1e3, -1e3);
+	}
+	forwardEvent(name) {
+		return (event) => {
+			const local = this.toLocal(event);
+			this.surface?.post({
+				type: "event",
+				name,
+				x: local.x,
+				y: local.y
+			});
+		};
+	}
+	get chartRenderPixelRatio() {
+		const budgetRatio = Math.sqrt(BITMAP_PIXEL_BUDGET / (this.width * this.height));
+		return Math.min(this.renderPixelRatio * RENDER_QUALITY, budgetRatio);
+	}
+	receiveEChartsOutput(output) {
+		const listeners = this.eChartsEventListeners.get(output.name);
+		if (!listeners) return;
+		for (const listener of listeners) {
+			if (this.eChartsEventListeners.get(output.name) !== listeners) return;
+			listener(output.params);
+		}
+	}
+	bindEvents() {
+		const bind = (name, handler) => {
+			this.cleanups.push(this.addEventListener(name, handler));
+		};
+		bind("click", this.forwardEvent("click"));
+		bind("dblclick", this.forwardEvent("dblclick"));
+		bind("mouseenter", this.forwardEvent("mouseover"));
+		bind("pointermove", this.forwardEvent("mousemove"));
+		bind("pointerdown", this.forwardEvent("mousedown"));
+		bind("pointerup", this.forwardEvent("mouseup"));
+		bind("contextmenu", this.forwardEvent("contextmenu"));
+		bind("mouseleave", () => {
+			this.surface?.post({
+				type: "event",
+				name: "mouseout",
+				x: -1e3,
+				y: -1e3
+			});
+			this.surface?.post({
+				type: "event",
+				name: "globalout",
+				x: -1e3,
+				y: -1e3
+			});
+		});
+	}
+};
+
+//#endregion
+//#region packages/echart/src/clipboard.ts
+const eChartsClipboardPlugin = {
+	type: "echarts",
+	deserialize(data) {
+		const { type: _type, children: _children, echarts: echartsOptions, ...shapeOptions } = data;
+		return new EChartsShape({
+			...shapeOptions,
+			echarts: echartsOptions
+		});
+	}
+};
+
+//#endregion
+export { EChartsPool, EChartsProperties, EChartsShape, eChartsClipboardPlugin, eChartsPoolKey };

package/dist/pool.d.ts

@@ -0,0 +1,15 @@
+import { type WorkerSurfaceHandle } from "@fulate/ui";
+import type { EChartsCommand, EChartsOutput, EChartsSurfaceCreate } from "./protocol";
+export interface EChartsPoolOptions {
+    echartsUrl: string | URL;
+    size?: number;
+}
+export declare const eChartsPoolKey: unique symbol;
+/** Configures one independent ECharts backend over the shared surface pool. */
+export declare class EChartsPool {
+    private readonly surfaces;
+    constructor(options: EChartsPoolOptions);
+    /** @internal Creates the renderer for one active EChartsShape. */
+    create(input: EChartsSurfaceCreate, onFrame: (bitmap: ImageBitmap) => void, onOutput?: (output: EChartsOutput) => void): WorkerSurfaceHandle<EChartsCommand>;
+    dispose(): void;
+}

package/dist/protocol.d.ts

@@ -0,0 +1,58 @@
+export interface EChartsInitOpts {
+    theme?: string | object;
+    option: any;
+    notMerge?: boolean;
+    lazyUpdate?: boolean;
+}
+export interface EChartsWorkerInitialize {
+    echartsUrl: string;
+}
+export interface EChartsSurfaceCreate extends EChartsInitOpts {
+    /** ECharts logical layout width in authored-local units. */
+    authoredWidth: number;
+    /** ECharts logical layout height in authored-local units. */
+    authoredHeight: number;
+    /** Physical bitmap pixels per authored-local unit. */
+    renderPixelRatio: number;
+}
+export interface EChartsActionPayload {
+    type: string;
+}
+export type EChartsDispatchActionOptions = boolean | Readonly<{
+    silent?: boolean;
+    flush?: boolean;
+}>;
+export type EChartsCommand = {
+    type: "set-option";
+    option: any;
+    notMerge?: boolean;
+    lazyUpdate?: boolean;
+} | {
+    type: "dispatch-action";
+    payload: EChartsActionPayload;
+    opt?: EChartsDispatchActionOptions;
+} | {
+    type: "resize";
+    authoredWidth: number;
+    authoredHeight: number;
+    renderPixelRatio: number;
+} | {
+    type: "event";
+    name: string;
+    x: number;
+    y: number;
+} | {
+    type: "add-event-listener";
+    name: string;
+} | {
+    type: "remove-event-listener";
+    name: string;
+} | {
+    type: "visibility";
+    visible: boolean;
+};
+export interface EChartsOutput {
+    type: "event";
+    name: string;
+    params: any;
+}

package/dist/shape.d.ts

@@ -0,0 +1,57 @@
+import type { ElementTransformClass, Layer, PropertyChanges, Root } from "@fulate/core";
+import { Bitmap, RectangleProperties, type RectangleOption, type RectangleOptionPatch } from "@fulate/ui";
+import type { EChartsActionPayload, EChartsDispatchActionOptions, EChartsInitOpts } from "./protocol";
+export type EChartsEventListener<Params = any> = (params: Params) => void;
+/** Whole-value chart configuration owned by authored/runtime property state. */
+export interface EChartsShapeOption<T = EChartsShape> extends RectangleOption<T> {
+    echarts: EChartsInitOpts;
+}
+/** Authored/runtime patch; `echarts` is adopted as one whole value. */
+export type EChartsShapeOptionPatch<O extends EChartsShapeOption<any> = EChartsShapeOption> = RectangleOptionPatch<O>;
+/** Public properties base for typed EChartsShape subclasses. */
+export declare class EChartsProperties extends RectangleProperties {
+    echarts: EChartsInitOpts;
+    constructor(options?: Partial<EChartsShapeOption>);
+}
+export declare class EChartsShape<P extends EChartsProperties = EChartsProperties, O extends EChartsShapeOption<any> = EChartsShapeOption<any>> extends Bitmap<P, O> {
+    readonly type: string;
+    private surface;
+    private lastVisibility;
+    private sentAuthoredWidth;
+    private sentAuthoredHeight;
+    private sentRenderPixelRatio;
+    private cleanups;
+    private readonly eChartsEventListeners;
+    /** Current effective chart configuration, including runtime overrides. */
+    get echarts(): EChartsInitOpts;
+    constructor(options: NoInfer<O>, properties?: P, Transform?: ElementTransformClass);
+    /** Sends one native incremental ECharts update outside authored state. */
+    setOption(option: any, notMerge?: boolean, lazyUpdate?: boolean): void;
+    /**
+     * Dispatches one action to the current native ECharts instance in its Worker.
+     * Registered action events return through `addEChartsEventListener()`.
+     */
+    dispatchAction<Payload extends EChartsActionPayload>(payload: Payload, opt?: EChartsDispatchActionOptions): void;
+    /**
+     * Subscribes to one native ECharts instance event across the Worker boundary.
+     * Custom action events must be registered by the loaded ECharts extension.
+     * The returned cleanup survives chart restarts and removes this subscription.
+     */
+    addEChartsEventListener<Params = any>(name: string, listener: EChartsEventListener<Params>): () => void;
+    resizeChart(): void;
+    protected onPropertiesChanged(current: P, changes: PropertyChanges): void;
+    protected onActivate(root: Root | null, layer: Layer | null): void;
+    protected onDeactivate(root: Root | null, layer: Layer | null): void;
+    protected onUnmount(): void;
+    protected paintContent(ctx: CanvasRenderingContext2D): void;
+    /** @internal Synchronizes ECharts animation with the actual paint path. */
+    syncChartVisibility(visible: boolean): void;
+    private startChart;
+    private restartChart;
+    private stopChart;
+    private toLocal;
+    private forwardEvent;
+    private get chartRenderPixelRatio();
+    private receiveEChartsOutput;
+    private bindEvents;
+}

package/dist/worker-surface.d.ts

@@ -0,0 +1,16 @@
+import { type WorkerSurface } from "@fulate/ui/worker-surface-worker";
+import type { EChartsCommand, EChartsOutput, EChartsSurfaceCreate } from "./protocol";
+/** ECharts-specific renderer state owned by one Worker surface. */
+export declare class EChartsWorkerSurface implements WorkerSurface<EChartsCommand> {
+    private readonly emitOutput;
+    private readonly canvas;
+    private readonly chart;
+    private readonly frames;
+    private readonly chartRenderPixelRatio;
+    private frameRenderPixelRatio;
+    private readonly eventListeners;
+    constructor(echarts: any, input: EChartsSurfaceCreate, emitFrame: (bitmap: ImageBitmap) => void, emitOutput: (output: EChartsOutput) => void);
+    receive(command: EChartsCommand): void;
+    dispose(): void;
+    private getFrameCanvas;
+}

package/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@fulate/echart",
+  "version": "1.0.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "license": "MIT",
+  "scripts": {
+    "test": "vitest run --config vitest.config.ts"
+  },
+  "dependencies": {
+    "@fulate/share": "*",
+    "@fulate/core": "*",
+    "@fulate/ui": "*"
+  }
+}