@netless/telebox-insider 0.2.26 → 1.0.0-alpha.3

package/dist/TeleBoxManager/index.d.ts

@@ -1,37 +1,72 @@
-import type { TeleBoxConfig, TeleBoxRect, TeleBoxState } from "../TeleBox/typings";
+import { SideEffectManager } from "side-effect-manager";
+import type { ReadonlyVal, ValEnhancedResult, ReadonlyValEnhancedResult } from "value-enhancer";
+import { Val } from "value-enhancer";
+import Emittery from "emittery";
+import type { ReadonlyTeleBox, TeleBoxColorScheme, TeleBoxRect, TeleBoxState } from "../TeleBox";
+import { TeleBox } from "../TeleBox";
 import { TeleBoxCollector } from "../TeleBoxCollector";
-import { ReadonlyTeleBox, TeleBox } from "../TeleBox";
-import type { TeleBoxManagerConfig, TeleBoxManagerCreateConfig, TeleBoxManagerEvents, TeleBoxManagerQueryConfig, TeleBoxManagerUpdateConfig } from "./typings";
+import type { TeleBoxManagerConfig, TeleBoxManagerCreateConfig, TeleBoxManagerQueryConfig, TeleBoxManagerUpdateConfig } from "./typings";
 import { MaxTitleBar } from "./MaxTitleBar";
-import { TeleBoxColorScheme } from "..";
-import { SideEffectManager } from "side-effect-manager";
-import { Val, ValEnhancedResult } from "value-enhancer";
 export * from "./typings";
 export * from "./constants";
+declare type ReadonlyValConfig = {
+    darkMode: ReadonlyVal<boolean, boolean>;
+    state: ReadonlyVal<TeleBoxState, boolean>;
+    root: Val<HTMLElement | null>;
+    rootRect: Val<TeleBoxRect>;
+    stageRect: ReadonlyVal<TeleBoxRect>;
+};
 declare type ValConfig = {
     prefersColorScheme: Val<TeleBoxColorScheme, boolean>;
-    containerRect: Val<TeleBoxRect, boolean>;
-    collector: Val<TeleBoxCollector | null>;
-    collectorRect: Val<TeleBoxRect | undefined>;
     readonly: Val<boolean, boolean>;
     minimized: Val<boolean, boolean>;
     maximized: Val<boolean, boolean>;
     fence: Val<boolean, boolean>;
+    stageRatio: Val<number, boolean>;
+    highlightStage: Val<boolean, boolean>;
 };
-export interface TeleBoxManager extends ValEnhancedResult<ValConfig> {
+declare type CombinedValEnhancedResult = ValEnhancedResult<ValConfig> & ReadonlyValEnhancedResult<ReadonlyValConfig>;
+export interface TeleBoxManager extends CombinedValEnhancedResult {
 }
 export declare class TeleBoxManager {
-    constructor({ root, prefersColorScheme, minimized, maximized, fence, containerRect, collector, namespace, readonly, }?: TeleBoxManagerConfig);
+    constructor({ root, prefersColorScheme, minimized, maximized, fence, collector, namespace, readonly, stageRatio, highlightStage, }?: TeleBoxManagerConfig);
     get boxes(): ReadonlyArray<TeleBox>;
     get topBox(): TeleBox | undefined;
-    readonly events: TeleBoxManagerEvents;
+    readonly events: Emittery<{
+        focused: ReadonlyTeleBox | undefined;
+        blurred: ReadonlyTeleBox | undefined;
+        created: ReadonlyTeleBox;
+        removed: ReadonlyTeleBox[];
+        state: "normal" | "minimized" | "maximized";
+        maximized: boolean;
+        minimized: boolean;
+        move: ReadonlyTeleBox;
+        resize: ReadonlyTeleBox;
+        intrinsic_move: ReadonlyTeleBox;
+        intrinsic_resize: ReadonlyTeleBox;
+        visual_resize: ReadonlyTeleBox;
+        z_index: ReadonlyTeleBox;
+        prefers_color_scheme: "light" | "dark" | "auto";
+        dark_mode: boolean;
+    }, {
+        focused: ReadonlyTeleBox | undefined;
+        blurred: ReadonlyTeleBox | undefined;
+        created: ReadonlyTeleBox;
+        removed: ReadonlyTeleBox[];
+        state: "normal" | "minimized" | "maximized";
+        maximized: boolean;
+        minimized: boolean;
+        move: ReadonlyTeleBox;
+        resize: ReadonlyTeleBox;
+        intrinsic_move: ReadonlyTeleBox;
+        intrinsic_resize: ReadonlyTeleBox;
+        visual_resize: ReadonlyTeleBox;
+        z_index: ReadonlyTeleBox;
+        prefers_color_scheme: "light" | "dark" | "auto";
+        dark_mode: boolean;
+    }, never>;
     protected _sideEffect: SideEffectManager;
-    protected root: HTMLElement;
     readonly namespace: string;
-    _darkMode$: Val<boolean, boolean>;
-    get darkMode(): boolean;
-    _state$: Val<TeleBoxState, boolean>;
-    get state(): TeleBoxState;
     /** @deprecated use setMaximized and setMinimized instead */
     setState(state: TeleBoxState, skipUpdate?: boolean): this;
     create(config?: TeleBoxManagerCreateConfig, smartPosition?: boolean): ReadonlyTeleBox;
@@ -42,18 +77,28 @@ export declare class TeleBoxManager {
     remove(boxOrID: string | TeleBox, skipUpdate?: boolean): ReadonlyTeleBox | undefined;
     removeTopBox(): ReadonlyTeleBox | undefined;
     removeAll(skipUpdate?: boolean): ReadonlyTeleBox[];
+    /**
+     * Mount manager to a container element.
+     */
+    mount(root: HTMLElement): void;
+    /**
+     * Unmount manager from the container element.
+     */
+    unmount(): void;
     destroy(skipUpdate?: boolean): void;
     wrapClassName(className: string): string;
     focusBox(boxOrID: string | TeleBox, skipUpdate?: boolean): void;
     focusTopBox(): void;
     blurBox(boxOrID: string | TeleBox, skipUpdate?: boolean): void;
     blurAll(skipUpdate?: boolean): void;
-    protected maxTitleBar: MaxTitleBar;
+    collector: TeleBoxCollector;
+    titleBar: MaxTitleBar;
     protected boxes$: Val<TeleBox[]>;
     protected topBox$: Val<TeleBox | undefined>;
     protected teleBoxMatcher(config: TeleBoxManagerQueryConfig): (box: TeleBox) => boolean;
     protected updateBox(box: TeleBox, config: TeleBoxManagerUpdateConfig, skipUpdate?: boolean): void;
-    protected smartPosition(config?: TeleBoxConfig): TeleBoxConfig;
+    /** Keep new boxes staggered inside stage area */
+    protected smartPosition(rect: Partial<TeleBoxRect>): TeleBoxRect;
     protected makeBoxTop(box: TeleBox, skipUpdate?: boolean): void;
     protected getBoxIndex(boxOrID: TeleBox | string): number;
     protected getBox(boxOrID: TeleBox | string): TeleBox | undefined;

package/dist/TeleBoxManager/typings.d.ts

@@ -1,42 +1,49 @@
-import type EventEmitter from "eventemitter3";
-import { TeleBoxColorScheme } from "..";
+import type { TeleBoxColorScheme } from "..";
 import type { ReadonlyTeleBox, TeleBoxState } from "../TeleBox";
 import type { TeleBoxConfig } from "../TeleBox/typings";
 import type { TeleBoxCollector } from "../TeleBoxCollector";
 import type { TELE_BOX_MANAGER_EVENT } from "./constants";
-export interface TeleBoxManagerConfig extends Pick<TeleBoxConfig, "prefersColorScheme" | "fence" | "containerRect" | "maximized" | "minimized" | "namespace" | "readonly"> {
+export interface TeleBoxManagerConfig extends Pick<TeleBoxConfig, "namespace"> {
     /** Element to mount boxes. */
-    root?: HTMLElement;
+    readonly root?: HTMLElement | null;
+    /** Stage area height/with ratio. No ratio if <= 0. Default -1. */
+    readonly stageRatio?: number;
     /** Where the minimized boxes go. */
-    collector?: TeleBoxCollector;
+    readonly collector?: TeleBoxCollector;
+    /** Restrict box to always be within the stage area. Default false. */
+    readonly fence?: boolean;
+    /** Prefers Box color scheme. Default light. */
+    readonly prefersColorScheme?: TeleBoxColorScheme;
+    /** Maximize box. Default false. */
+    readonly maximized?: boolean;
+    /** Minimize box. Overwrites maximized state. Default false. */
+    readonly minimized?: boolean;
+    /** Is box readonly */
+    readonly readonly?: boolean;
+    /** Show stage frame and grey-out the non-stage area. Default true. */
+    readonly highlightStage?: boolean;
 }
-declare type TeleBoxManagerBoxConfigBaseProps = "title" | "visible" | "width" | "height" | "minWidth" | "minHeight" | "x" | "y" | "resizable" | "draggable" | "fixRatio" | "zIndex";
+declare type TeleBoxManagerBoxConfigBaseProps = "title" | "visible" | "width" | "height" | "minWidth" | "minHeight" | "x" | "y" | "resizable" | "draggable" | "ratio" | "zIndex";
 export declare type TeleBoxManagerCreateConfig = Pick<TeleBoxConfig, TeleBoxManagerBoxConfigBaseProps | "content" | "footer" | "id" | "focus">;
-export declare type TeleBoxManagerQueryConfig = Pick<TeleBoxConfig, TeleBoxManagerBoxConfigBaseProps | "id" | "focus">;
+export declare type TeleBoxManagerQueryConfig = Pick<TeleBoxConfig, "title" | "visible" | "resizable" | "draggable" | "ratio" | "zIndex" | "id" | "focus">;
 export declare type TeleBoxManagerUpdateConfig = Pick<TeleBoxConfig, TeleBoxManagerBoxConfigBaseProps | "content" | "footer">;
 declare type CheckTeleBoxManagerConfig<T extends Record<`${TELE_BOX_MANAGER_EVENT}`, any>> = T;
 export declare type TeleBoxManagerEventConfig = CheckTeleBoxManagerConfig<{
-    focused: [ReadonlyTeleBox | undefined];
-    blurred: [ReadonlyTeleBox | undefined];
-    created: [ReadonlyTeleBox];
-    removed: [ReadonlyTeleBox[]];
-    state: [TeleBoxState];
-    maximized: [boolean];
-    minimized: [boolean];
-    move: [ReadonlyTeleBox];
-    resize: [ReadonlyTeleBox];
-    intrinsic_move: [ReadonlyTeleBox];
-    intrinsic_resize: [ReadonlyTeleBox];
-    visual_resize: [ReadonlyTeleBox];
-    z_index: [ReadonlyTeleBox];
-    prefers_color_scheme: [TeleBoxColorScheme];
-    dark_mode: [boolean];
+    focused: ReadonlyTeleBox | undefined;
+    blurred: ReadonlyTeleBox | undefined;
+    created: ReadonlyTeleBox;
+    removed: ReadonlyTeleBox[];
+    state: TeleBoxState;
+    maximized: boolean;
+    minimized: boolean;
+    move: ReadonlyTeleBox;
+    resize: ReadonlyTeleBox;
+    intrinsic_move: ReadonlyTeleBox;
+    intrinsic_resize: ReadonlyTeleBox;
+    visual_resize: ReadonlyTeleBox;
+    z_index: ReadonlyTeleBox;
+    prefers_color_scheme: TeleBoxColorScheme;
+    dark_mode: boolean;
 }>;
 export declare type TeleBoxManagerEvent = keyof TeleBoxManagerEventConfig;
-export interface TeleBoxManagerEvents extends EventEmitter<TeleBoxManagerEvent> {
-    on<U extends TeleBoxManagerEvent>(event: U, listener: (...value: TeleBoxManagerEventConfig[U]) => void): this;
-    once<U extends TeleBoxManagerEvent>(event: U, listener: (...value: TeleBoxManagerEventConfig[U]) => void): this;
-    addListener<U extends TeleBoxManagerEvent>(event: U, listener: (...value: TeleBoxManagerEventConfig[U]) => void): this;
-    emit<U extends TeleBoxManagerEvent>(event: U, ...value: TeleBoxManagerEventConfig[U]): boolean;
-}
 export {};

package/dist/TeleStage/index.d.ts

@@ -0,0 +1,21 @@
+import "./style.scss";
+import type { ReadonlyVal } from "value-enhancer";
+import type { TeleBoxRect } from "../TeleBox/typings";
+export interface TeleStageConfig {
+    namespace: string;
+    root$: ReadonlyVal<HTMLElement | null>;
+    rootRect$: ReadonlyVal<TeleBoxRect>;
+    ratio$: ReadonlyVal<number>;
+    highlightStage$: ReadonlyVal<boolean>;
+}
+export declare class TeleStage {
+    private readonly _sideEffect;
+    readonly namespace: string;
+    readonly stageRect$: ReadonlyVal<TeleBoxRect>;
+    readonly highlightStage$: ReadonlyVal<boolean>;
+    $boxStage?: HTMLDivElement;
+    constructor({ namespace, rootRect$, ratio$, highlightStage$, root$, }: TeleStageConfig);
+    private render;
+    destroy(): void;
+    wrapClassName(className: string): string;
+}

package/dist/TeleTitleBar/DefaultTitleBar/index.d.ts

@@ -2,6 +2,7 @@ import "./style.scss";
 import { SideEffectManager } from "side-effect-manager";
 import type { TeleBoxState } from "../../TeleBox/typings";
 import type { TeleTitleBar, TeleTitleBarConfig, TeleTitleBarEvent } from "../typings";
+import { Val } from "value-enhancer";
 export declare type DefaultTitleBarButton = TeleTitleBarEvent & {
     readonly iconClassName: string;
     readonly isActive?: (state: TeleBoxState) => boolean;
@@ -10,14 +11,12 @@ export interface DefaultTitleBarConfig extends TeleTitleBarConfig {
     buttons?: ReadonlyArray<DefaultTitleBarButton>;
 }
 export declare class DefaultTitleBar implements TeleTitleBar {
-    constructor({ readonly, title, buttons, onEvent, onDragStart, namespace, state, }?: DefaultTitleBarConfig);
+    constructor({ readonly$, state$, title, buttons, onEvent, onDragStart, namespace, }: DefaultTitleBarConfig);
     readonly namespace: string;
     $titleBar: HTMLElement | undefined;
-    $title: HTMLElement | undefined;
     $dragArea: HTMLElement;
+    get title(): string;
     setTitle(title: string): void;
-    setState(state: TeleBoxState): void;
-    setReadonly(readonly: boolean): void;
     render(): HTMLElement;
     renderDragArea(): HTMLElement;
     dragHandle(): HTMLElement | undefined;
@@ -25,11 +24,10 @@ export declare class DefaultTitleBar implements TeleTitleBar {
     destroy(): void;
     onEvent?: TeleTitleBarConfig["onEvent"];
     onDragStart?: TeleTitleBarConfig["onDragStart"];
-    protected readonly: boolean;
-    protected title?: string;
+    protected readonly$: TeleTitleBarConfig["readonly$"];
+    protected title$: Val<string>;
     protected buttons: ReadonlyArray<DefaultTitleBarButton>;
-    protected state: TeleBoxState;
-    protected $btns: HTMLButtonElement[];
+    protected state$: TeleTitleBarConfig["state$"];
     protected sideEffect: SideEffectManager;
     protected lastTitleBarClick: {
         timestamp: number;

package/dist/TeleTitleBar/typings.d.ts

@@ -1,3 +1,4 @@
+import type { ReadonlyVal } from "value-enhancer";
 import type { TeleBoxDelegateEventConfig, TeleBoxState } from "../TeleBox";
 export declare type TeleTitleBarEvent<U = keyof TeleBoxDelegateEventConfig> = U extends keyof TeleBoxDelegateEventConfig ? TeleBoxDelegateEventConfig[U] extends void ? {
     type: U;
@@ -7,17 +8,14 @@ export declare type TeleTitleBarEvent<U = keyof TeleBoxDelegateEventConfig> = U
     value: TeleBoxDelegateEventConfig[U];
 } : never;
 export interface TeleTitleBarConfig {
-    readonly?: boolean;
+    readonly$: ReadonlyVal<boolean, boolean>;
     title?: string;
-    state?: TeleBoxState;
+    state$: ReadonlyVal<TeleBoxState, boolean>;
     namespace?: string;
     onEvent?: (event: TeleTitleBarEvent) => void;
     onDragStart?: (event: MouseEvent | TouchEvent) => void;
 }
 export interface TeleTitleBar {
-    setTitle(title: string): void;
-    setState(state: TeleBoxState): void;
-    setReadonly(readonly: boolean): void;
     render(): HTMLElement;
     destroy(): void;
 }

package/dist/index.d.ts

@@ -1,6 +1,5 @@
 import "./scss/fancy-scrollbar.scss";
 export * from "./TeleBox";
 export * from "./TeleTitleBar";
-export * from "./TeleBoxReact";
 export * from "./TeleBoxManager";
 export * from "./TeleBoxCollector";

package/dist/style.css

@@ -1 +1 @@
-.tele-fancy-scrollbar{overscroll-behavior:contain;overflow:auto;overflow-y:scroll;overflow-y:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.tele-fancy-scrollbar::-webkit-scrollbar{height:8px;width:8px}.tele-fancy-scrollbar::-webkit-scrollbar-track{background-color:transparent}.tele-fancy-scrollbar::-webkit-scrollbar-thumb{background-color:rgba(68,78,96,.1);background-color:transparent;border-radius:4px;transition:background-color .4s}.tele-fancy-scrollbar:hover::-webkit-scrollbar-thumb{background-color:rgba(68,78,96,.1)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:hover{background-color:rgba(68,78,96,.2)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:active{background-color:rgba(68,78,96,.2)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:vertical{min-height:50px}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-box{position:absolute;top:0;left:0;z-index:100;transition:width .4s cubic-bezier(.4, .9, .71, 1.02),height .4s cubic-bezier(.55, .82, .63, .95),opacity .6s cubic-bezier(.7, 0, .84, 0),transform .4s ease}.telebox-box-main{position:relative;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#f9f9fc;box-shadow:0 4px 10px 0 rgba(47,65,146,.15);border-radius:6px;border:1px solid #e3e3ec}.telebox-titlebar-wrap{flex-shrink:0;position:relative;z-index:1}.telebox-content-wrap{flex:1;width:100%;overflow:hidden;display:flex;justify-content:center;align-items:center}.telebox-content{width:100%;height:100%;position:relative}.telebox-footer-wrap{flex-shrink:0;display:flex;flex-direction:column}.telebox-footer-wrap::before{content:"";display:block;flex:1}.telebox-resize-handle{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;position:absolute;z-index:2147483647}.telebox-n{width:100%;height:5px;left:0;top:-5px;cursor:n-resize}.telebox-s{width:100%;height:5px;left:0;bottom:-5px;cursor:s-resize}.telebox-w{width:5px;height:100%;left:-5px;top:0;cursor:w-resize}.telebox-e{width:5px;height:100%;right:-5px;top:0;cursor:e-resize}.telebox-nw{width:15px;height:15px;top:-5px;left:-5px;cursor:nw-resize}.telebox-ne{width:15px;height:15px;top:-5px;right:-5px;cursor:ne-resize}.telebox-se{width:15px;height:15px;bottom:-5px;right:-5px;cursor:se-resize}.telebox-sw{width:15px;height:15px;bottom:-5px;left:-5px;cursor:sw-resize}.telebox-track-mask{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;position:fixed;top:0;left:0;z-index:2147483647;width:100%;height:100%;background:rgba(0,0,0,.0001);cursor:move}.telebox-cursor-n{cursor:n-resize}.telebox-cursor-s{cursor:s-resize}.telebox-cursor-w{cursor:w-resize}.telebox-cursor-e{cursor:e-resize}.telebox-cursor-nw{cursor:nw-resize}.telebox-cursor-ne{cursor:ne-resize}.telebox-cursor-se{cursor:se-resize}.telebox-cursor-sw{cursor:sw-resize}.telebox-maximized .telebox-resize-handles,.telebox-no-resize .telebox-resize-handles{display:none}.telebox-maximized{box-shadow:none;transition:none}.telebox-minimized{transition:width 50ms cubic-bezier(.4, .9, .71, 1.02),height 50ms cubic-bezier(.55, .82, .63, .95),opacity .6s cubic-bezier(.7, 0, .84, 0),transform .6s ease;opacity:0;pointer-events:none;user-select:none}.telebox-transforming{will-change:transform;transition:opacity .6s cubic-bezier(.7, 0, .84, 0)}.telebox-readonly .telebox-resize-handle{cursor:initial!important;pointer-events:none!important}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark .telebox-box-main{color:#e9e9e9;background:#212126;border-color:#43434d}.telebox-titlebar{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;box-sizing:border-box;height:26px;display:flex;align-items:center;background:#fff;user-select:none;border-bottom:1px solid #eeeef7;touch-action:manipulation}.telebox-title-area{padding-left:16px;overflow:hidden;position:relative;height:100%;flex:1;display:flex;align-items:center}.telebox-title{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;overflow:hidden;margin:0;padding:0;font-size:14px;font-weight:400;font-family:PingFangSC-Regular,PingFang SC;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;color:#191919}.telebox-drag-area{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;z-index:10}.telebox-titlebar-btns{padding-right:16px;white-space:nowrap;word-break:keep-all;margin-left:auto;font-size:0}.telebox-titlebar-btn{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;width:22px;height:22px;padding:0;outline:0;border:none;background:0 0;cursor:pointer}.telebox-titlebar-btn~.telebox-titlebar-btn{margin-left:10px}.telebox-titlebar-btn-icon{width:22px;height:22px}.telebox-readonly .telebox-titlebar-btn{cursor:not-allowed}.telebox-titlebar-icon-minimize{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPHBhdGggZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOSAxM2gxMHYxLjZIOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=")}.telebox-titlebar-icon-maximize{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPGcgZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBtYXNrPSJ1cmwoI2IpIj4KICAgICAgICAgICAgPHBhdGgKICAgICAgICAgICAgICAgIGQ9Ik0yMC40ODEgMTcuMWgxLjJ2NC41ODFIMTcuMXYtMS4yaDMuMzgxVjE3LjF6bS0xNC4xOTA1LS4wMDloMS4ydjMuMzgxaDMuMzgwOXYxLjJoLTQuNTgxdi00LjU4MXpNMTcuMSA2LjE5MDVoNC41ODF2NC41ODA5aC0xLjJ2LTMuMzgxSDE3LjF2LTEuMnptLTEwLjcwMDguMTA4N2g0Ljc5ODV2MS4ySDcuNTk5MnYzLjU5ODVoLTEuMlY2LjI5OTJ6IiAvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==")}.telebox-titlebar-icon-maximize.is-active{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjZ2MjZIMHoiIC8+CiAgICAgICAgPHBhdGggaWQ9ImMiIGQ9Ik0yNi44NjkgMEwyOCAxLjEzMVYyNi44N0wyNi44NjkgMjhIMS4xM0wwIDI2Ljg3VjEuMTMxTDEuMTMgMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPgogICAgICAgICAgICA8bWFzayBpZD0iYiIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNhIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tNC42NDI5LTQuNjQyOWgzNS4yODU4djM1LjI4NThILTQuNjQyOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8bWFzayBpZD0iZCIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNjIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tMTcuNTE2OCAxNEwxNC0xNy41MTY4IDQ1LjUxNjggMTQgMTQgNDUuNTE2OHoiIG1hc2s9InVybCgjZCkiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxwYXRoIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjIiCiAgICAgICAgICAgIGQ9Ik0xMC4wODg2IDIxLjQ4NjV2LTMuNjk2Nkg2LjM5Mk0yMS4zODU1IDEwLjE4OTVoLTMuNjk2NlY2LjQ5M00yMS40MDIgMTcuNzk4M2gtMy42OTY2djMuNjk2Nk0xMC4yNTAzIDYuMTQ5OHYzLjg5ODVINi4zNTE3IiAvPgogICAgPC9nPgo8L3N2Zz4K")}.telebox-titlebar-icon-close{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjQiPgogICAgICAgIDxwYXRoIGQ9Ik04LjM1MyAyMC4zMzIxTDIwLjMzMiA4LjM1M00yMC4zMzIyIDIwLjMzMjFMOC4zNTMgOC4zNTMiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=")}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark .telebox-title{color:#e9e9e9}.telebox-color-scheme-dark .telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-collector{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;visibility:hidden;display:block;position:absolute;z-index:200;width:40px;height:40px;margin:0;padding:0;border:none;outline:0;font-size:0;border-radius:50%;background:#fff;box-shadow:0 2px 6px 0 rgba(47,65,146,.15);cursor:pointer;user-select:none;pointer-events:none;background-repeat:no-repeat;background-size:18px 16px;background-position:center;-webkit-tap-highlight-color:transparent}.telebox-collector-visible{visibility:visible;pointer-events:initial}.telebox-collector-readonly{cursor:not-allowed}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark.telebox-collector{background-color:#43434d}.telebox-max-titlebar{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;display:none;position:absolute;top:0;left:0;z-index:50000}.telebox-max-titlebar .telebox-title{display:none}.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-titles{display:none}.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-title{display:block}.telebox-max-titlebar-maximized{display:flex}.telebox-titles{height:100%;margin:0;overflow-y:hidden;overflow-x:scroll;overflow-x:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.telebox-titles::-webkit-scrollbar{height:8px;width:8px}.telebox-titles::-webkit-scrollbar-track{background-color:transparent}.telebox-titles::-webkit-scrollbar-thumb{background-color:rgba(238,238,247,.8);background-color:transparent;border-radius:4px;transition:background-color .4s}.telebox-titles:hover::-webkit-scrollbar-thumb{background-color:rgba(238,238,247,.8)}.telebox-titles::-webkit-scrollbar-thumb:hover{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:active{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:vertical{min-height:50px}.telebox-titles::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-titles-content{height:100%;display:flex;flex-wrap:nowrap;align-items:center;padding:0}.telebox-titles-tab{height:100%;overflow:hidden;max-width:182px;min-width:50px;padding:0 26px 0 16px;outline:0;font-size:13px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all;border:none;border-right:1px solid #e5e5f0;color:#7b88a0;background:0 0;cursor:pointer;user-select:none}.telebox-titles-tab-focus{color:#357bf6}.telebox-readonly .telebox-titles-tab{cursor:not-allowed}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark.telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-color-scheme-dark .telebox-titles-tab{border-right-color:#7b88a0}.telebox-color-scheme-dark .telebox-title{color:#e9e9e9}
+.tele-fancy-scrollbar{overscroll-behavior:contain;overflow:auto;overflow-y:scroll;overflow-y:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.tele-fancy-scrollbar::-webkit-scrollbar{height:8px;width:8px}.tele-fancy-scrollbar::-webkit-scrollbar-track{background-color:transparent}.tele-fancy-scrollbar::-webkit-scrollbar-thumb{background-color:rgba(68,78,96,.1);background-color:transparent;border-radius:4px;transition:background-color .4s}.tele-fancy-scrollbar:hover::-webkit-scrollbar-thumb{background-color:rgba(68,78,96,.1)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:hover{background-color:rgba(68,78,96,.2)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:active{background-color:rgba(68,78,96,.2)}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:vertical{min-height:50px}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-box{position:absolute;top:0;left:0;z-index:100;transition:width .4s cubic-bezier(.4, .9, .71, 1.02),height .4s cubic-bezier(.55, .82, .63, .95),opacity .6s cubic-bezier(.7, 0, .84, 0),transform .4s ease}.telebox-box-main{position:relative;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#f9f9fc;box-shadow:0 4px 10px 0 rgba(47,65,146,.15);border-radius:6px;border:1px solid #e3e3ec}.telebox-titlebar-wrap{flex-shrink:0;position:relative;z-index:1}.telebox-content-wrap{flex:1;width:100%;overflow:hidden;display:flex;justify-content:center;align-items:center;position:relative}.telebox-content{width:100%;height:100%;position:relative}.telebox-footer-wrap{flex-shrink:0;display:flex;flex-direction:column}.telebox-footer-wrap::before{content:"";display:block;flex:1}.telebox-resize-handle{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;position:absolute;z-index:2147483647}.telebox-n{width:100%;height:5px;left:0;top:-5px;cursor:n-resize}.telebox-s{width:100%;height:5px;left:0;bottom:-5px;cursor:s-resize}.telebox-w{width:5px;height:100%;left:-5px;top:0;cursor:w-resize}.telebox-e{width:5px;height:100%;right:-5px;top:0;cursor:e-resize}.telebox-nw{width:15px;height:15px;top:-5px;left:-5px;cursor:nw-resize}.telebox-ne{width:15px;height:15px;top:-5px;right:-5px;cursor:ne-resize}.telebox-se{width:15px;height:15px;bottom:-5px;right:-5px;cursor:se-resize}.telebox-sw{width:15px;height:15px;bottom:-5px;left:-5px;cursor:sw-resize}.telebox-track-mask{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;position:fixed;top:0;left:0;z-index:2147483647;width:100%;height:100%;background:rgba(0,0,0,.0001);cursor:move}.telebox-cursor-n{cursor:n-resize}.telebox-cursor-s{cursor:s-resize}.telebox-cursor-w{cursor:w-resize}.telebox-cursor-e{cursor:e-resize}.telebox-cursor-nw{cursor:nw-resize}.telebox-cursor-ne{cursor:ne-resize}.telebox-cursor-se{cursor:se-resize}.telebox-cursor-sw{cursor:sw-resize}.telebox-maximized .telebox-resize-handles,.telebox-no-resize .telebox-resize-handles{display:none}.telebox-maximized{box-shadow:none;transition:none}.telebox-minimized{transition:width 50ms cubic-bezier(.4, .9, .71, 1.02),height 50ms cubic-bezier(.55, .82, .63, .95),opacity .6s cubic-bezier(.7, 0, .84, 0),transform .6s ease;opacity:0;pointer-events:none;user-select:none}.telebox-transforming{will-change:transform;transition:opacity .6s cubic-bezier(.7, 0, .84, 0)}.telebox-readonly .telebox-resize-handle{cursor:initial!important;pointer-events:none!important}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark .telebox-box-main{color:#e9e9e9;background:#212126;border-color:#43434d}.telebox-titlebar{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;box-sizing:border-box;height:26px;display:flex;align-items:center;background:#fff;user-select:none;border-bottom:1px solid #eeeef7;touch-action:manipulation}.telebox-title-area{padding-left:16px;overflow:hidden;position:relative;height:100%;flex:1;display:flex;align-items:center}.telebox-title{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;overflow:hidden;margin:0;padding:0;font-size:14px;font-weight:400;font-family:PingFangSC-Regular,PingFang SC;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;color:#191919}.telebox-drag-area{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;z-index:10}.telebox-titlebar-btns{padding-right:16px;white-space:nowrap;word-break:keep-all;margin-left:auto;font-size:0}.telebox-titlebar-btn{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;width:22px;height:22px;padding:0;outline:0;border:none;background:0 0;cursor:pointer}.telebox-titlebar-btn~.telebox-titlebar-btn{margin-left:10px}.telebox-titlebar-btn-icon{width:22px;height:22px}.telebox-readonly .telebox-titlebar-btn{cursor:not-allowed}.telebox-titlebar-icon-minimize{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPHBhdGggZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOSAxM2gxMHYxLjZIOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=")}.telebox-titlebar-icon-maximize{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPGcgZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBtYXNrPSJ1cmwoI2IpIj4KICAgICAgICAgICAgPHBhdGgKICAgICAgICAgICAgICAgIGQ9Ik0yMC40ODEgMTcuMWgxLjJ2NC41ODFIMTcuMXYtMS4yaDMuMzgxVjE3LjF6bS0xNC4xOTA1LS4wMDloMS4ydjMuMzgxaDMuMzgwOXYxLjJoLTQuNTgxdi00LjU4MXpNMTcuMSA2LjE5MDVoNC41ODF2NC41ODA5aC0xLjJ2LTMuMzgxSDE3LjF2LTEuMnptLTEwLjcwMDguMTA4N2g0Ljc5ODV2MS4ySDcuNTk5MnYzLjU5ODVoLTEuMlY2LjI5OTJ6IiAvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==")}.telebox-titlebar-icon-maximize.is-active{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjZ2MjZIMHoiIC8+CiAgICAgICAgPHBhdGggaWQ9ImMiIGQ9Ik0yNi44NjkgMEwyOCAxLjEzMVYyNi44N0wyNi44NjkgMjhIMS4xM0wwIDI2Ljg3VjEuMTMxTDEuMTMgMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPgogICAgICAgICAgICA8bWFzayBpZD0iYiIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNhIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tNC42NDI5LTQuNjQyOWgzNS4yODU4djM1LjI4NThILTQuNjQyOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8bWFzayBpZD0iZCIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNjIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tMTcuNTE2OCAxNEwxNC0xNy41MTY4IDQ1LjUxNjggMTQgMTQgNDUuNTE2OHoiIG1hc2s9InVybCgjZCkiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxwYXRoIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjIiCiAgICAgICAgICAgIGQ9Ik0xMC4wODg2IDIxLjQ4NjV2LTMuNjk2Nkg2LjM5Mk0yMS4zODU1IDEwLjE4OTVoLTMuNjk2NlY2LjQ5M00yMS40MDIgMTcuNzk4M2gtMy42OTY2djMuNjk2Nk0xMC4yNTAzIDYuMTQ5OHYzLjg5ODVINi4zNTE3IiAvPgogICAgPC9nPgo8L3N2Zz4K")}.telebox-titlebar-icon-close{background:center/cover no-repeat url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjQiPgogICAgICAgIDxwYXRoIGQ9Ik04LjM1MyAyMC4zMzIxTDIwLjMzMiA4LjM1M00yMC4zMzIyIDIwLjMzMjFMOC4zNTMgOC4zNTMiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=")}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark .telebox-title{color:#e9e9e9}.telebox-color-scheme-dark .telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-box-stage-container{display:none;position:absolute;z-index:2100;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none}.telebox-box-stage-container.is-active{display:flex}.telebox-box-stage-mask{background:rgba(0,0,0,.05)}.telebox-box-stage-frame{flex:1;position:relative}.telebox-box-stage-frame-corner{position:absolute;width:8px;height:8px}.telebox-box-stage-frame-corner.is-0{top:0;left:0}.telebox-box-stage-frame-corner.is-1{top:0;right:0}.telebox-box-stage-frame-corner.is-2{bottom:0;left:0}.telebox-box-stage-frame-corner.is-3{bottom:0;right:0}.telebox-collector{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;visibility:hidden;display:block;position:absolute;z-index:200;width:40px;height:40px;margin:0;padding:0;border:none;outline:0;font-size:0;border-radius:50%;background:#fff;box-shadow:0 2px 6px 0 rgba(47,65,146,.15);cursor:pointer;user-select:none;pointer-events:none;background-repeat:no-repeat;background-size:18px 16px;background-position:center;-webkit-tap-highlight-color:transparent}.telebox-collector-visible{visibility:visible;pointer-events:initial}.telebox-collector-readonly{cursor:not-allowed}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark.telebox-collector{background-color:#43434d}.telebox-max-titlebar{user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;display:none;position:absolute;top:0;left:0;z-index:50000}.telebox-max-titlebar .telebox-title{display:none}.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-titles{display:none}.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-title{display:block}.telebox-max-titlebar-maximized{display:flex}.telebox-titles{height:100%;margin:0;overflow-y:hidden;overflow-x:scroll;overflow-x:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.telebox-titles::-webkit-scrollbar{height:8px;width:8px}.telebox-titles::-webkit-scrollbar-track{background-color:transparent}.telebox-titles::-webkit-scrollbar-thumb{background-color:rgba(238,238,247,.8);background-color:transparent;border-radius:4px;transition:background-color .4s}.telebox-titles:hover::-webkit-scrollbar-thumb{background-color:rgba(238,238,247,.8)}.telebox-titles::-webkit-scrollbar-thumb:hover{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:active{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:vertical{min-height:50px}.telebox-titles::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-titles-content{height:100%;display:flex;flex-wrap:nowrap;align-items:center;padding:0}.telebox-titles-tab{height:100%;overflow:hidden;max-width:182px;min-width:50px;padding:0 26px 0 16px;outline:0;font-size:13px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all;border:none;border-right:1px solid #e5e5f0;color:#7b88a0;background:0 0;cursor:pointer;user-select:none}.telebox-titles-tab-focus{color:#357bf6}.telebox-readonly .telebox-titles-tab{cursor:not-allowed}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark.telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-color-scheme-dark .telebox-titles-tab{border-right-color:#7b88a0}.telebox-color-scheme-dark .telebox-title{color:#e9e9e9}

package/dist/telebox-insider.cjs.js

@@ -1,16 +1,2 @@
-"use strict";var e=Object.defineProperty,t=Object.defineProperties,i=Object.getOwnPropertyDescriptors,s=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,n=Object.prototype.propertyIsEnumerable,o=(t,i,s)=>i in t?e(t,i,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[i]=s,a=(e,t)=>{for(var i in t||(t={}))r.call(t,i)&&o(e,i,t[i]);if(s)for(var i of s(t))n.call(t,i)&&o(e,i,t[i]);return e},l=(e,s)=>t(e,i(s));Object.defineProperty(exports,"__esModule",{value:!0}),exports[Symbol.toStringTag]="Module";var h=require("react");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=c(h),u={exports:{}};!function(e){var t=Object.prototype.hasOwnProperty,i="~";function s(){}function r(e,t,i){this.fn=e,this.context=t,this.once=i||!1}function n(e,t,s,n,o){if("function"!=typeof s)throw new TypeError("The listener must be a function");var a=new r(s,n||e,o),l=i?i+t:t;return e._events[l]?e._events[l].fn?e._events[l]=[e._events[l],a]:e._events[l].push(a):(e._events[l]=a,e._eventsCount++),e}function o(e,t){0==--e._eventsCount?e._events=new s:delete e._events[t]}function a(){this._events=new s,this._eventsCount=0}Object.create&&(s.prototype=Object.create(null),(new s).__proto__||(i=!1)),a.prototype.eventNames=function(){var e,s,r=[];if(0===this._eventsCount)return r;for(s in e=this._events)t.call(e,s)&&r.push(i?s.slice(1):s);return Object.getOwnPropertySymbols?r.concat(Object.getOwnPropertySymbols(e)):r},a.prototype.listeners=function(e){var t=i?i+e:e,s=this._events[t];if(!s)return[];if(s.fn)return[s.fn];for(var r=0,n=s.length,o=new Array(n);r<n;r++)o[r]=s[r].fn;return o},a.prototype.listenerCount=function(e){var t=i?i+e:e,s=this._events[t];return s?s.fn?1:s.length:0},a.prototype.emit=function(e,t,s,r,n,o){var a=i?i+e:e;if(!this._events[a])return!1;var l,h,c=this._events[a],d=arguments.length;if(c.fn){switch(c.once&&this.removeListener(e,c.fn,void 0,!0),d){case 1:return c.fn.call(c.context),!0;case 2:return c.fn.call(c.context,t),!0;case 3:return c.fn.call(c.context,t,s),!0;case 4:return c.fn.call(c.context,t,s,r),!0;case 5:return c.fn.call(c.context,t,s,r,n),!0;case 6:return c.fn.call(c.context,t,s,r,n,o),!0}for(h=1,l=new Array(d-1);h<d;h++)l[h-1]=arguments[h];c.fn.apply(c.context,l)}else{var u,f=c.length;for(h=0;h<f;h++)switch(c[h].once&&this.removeListener(e,c[h].fn,void 0,!0),d){case 1:c[h].fn.call(c[h].context);break;case 2:c[h].fn.call(c[h].context,t);break;case 3:c[h].fn.call(c[h].context,t,s);break;case 4:c[h].fn.call(c[h].context,t,s,r);break;default:if(!l)for(u=1,l=new Array(d-1);u<d;u++)l[u-1]=arguments[u];c[h].fn.apply(c[h].context,l)}}return!0},a.prototype.on=function(e,t,i){return n(this,e,t,i,!1)},a.prototype.once=function(e,t,i){return n(this,e,t,i,!0)},a.prototype.removeListener=function(e,t,s,r){var n=i?i+e:e;if(!this._events[n])return this;if(!t)return o(this,n),this;var a=this._events[n];if(a.fn)a.fn!==t||r&&!a.once||s&&a.context!==s||o(this,n);else{for(var l=0,h=[],c=a.length;l<c;l++)(a[l].fn!==t||r&&!a[l].once||s&&a[l].context!==s)&&h.push(a[l]);h.length?this._events[n]=1===h.length?h[0]:h:o(this,n)}return this},a.prototype.removeAllListeners=function(e){var t;return e?(t=i?i+e:e,this._events[t]&&o(this,t)):(this._events=new s,this._eventsCount=0),this},a.prototype.off=a.prototype.removeListener,a.prototype.addListener=a.prototype.on,a.prefixed=i,a.EventEmitter=a,e.exports=a}(u);var f=u.exports,E=function(){return(E=Object.assign||function(e){for(var t,i=1,s=arguments.length;i<s;i++)for(var r in t=arguments[i])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e}).apply(this,arguments)};
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */function m(e,t){var i={};for(var s in e)Object.prototype.hasOwnProperty.call(e,s)&&t.indexOf(s)<0&&(i[s]=e[s]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(s=Object.getOwnPropertySymbols(e);r<s.length;r++)t.indexOf(s[r])<0&&Object.prototype.propertyIsEnumerable.call(e,s[r])&&(i[s[r]]=e[s[r]])}return i}var p=0,v="undefined"!=typeof window&&void 0!==window.requestAnimationFrame?function(e){return window.requestAnimationFrame(e)}:function(e){var t=Date.now(),i=Math.max(0,16.7-(t-p));p=t+i,setTimeout((function(){return e(p)}),i)},x=1/60*1e3,_=!0,g=!1,b=!1,T={delta:0,timestamp:0},B=["read","update","preRender","render","postRender"],y=function(e){return g=e},w=B.reduce((function(e,t){var i,s,r,n,o,a,l,h,c;return e[t]=(i=y,s=[],r=[],n=0,o=!1,a=0,l=new WeakSet,h=new WeakSet,c={cancel:function(e){var t=r.indexOf(e);l.add(e),-1!==t&&r.splice(t,1)},process:function(e){var t,d;if(o=!0,s=(t=[r,s])[0],(r=t[1]).length=0,n=s.length)for(a=0;a<n;a++)(d=s[a])(e),!0!==h.has(d)||l.has(d)||(c.schedule(d),i(!0));o=!1},schedule:function(e,t,i){void 0===t&&(t=!1),void 0===i&&(i=!1);var a=i&&o,c=a?s:r;l.delete(e),t&&h.add(e),-1===c.indexOf(e)&&(c.push(e),a&&(n=s.length))}}),e}),{}),L=B.reduce((function(e,t){var i=w[t];return e[t]=function(e,t,s){return void 0===t&&(t=!1),void 0===s&&(s=!1),g||$(),i.schedule(e,t,s),e},e}),{}),C=function(e){return w[e].process(T)},N=function(e){g=!1,T.delta=_?x:Math.max(Math.min(e-T.timestamp,40),1),_||(x=T.delta),T.timestamp=e,b=!0,B.forEach(C),b=!1,g&&(_=!1,v(N))},$=function(){g=!0,_=!0,b||v(N)},O=function(){return(O=Object.assign||function(e){for(var t,i=1,s=arguments.length;i<s;i++)for(var r in t=arguments[i])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e}).apply(this,arguments)},z=function(e,t){return function(i){return Math.max(Math.min(i,t),e)}},M=function(e){return e%1?Number(e.toFixed(5)):e},S=/^(#[0-9a-f]{3}|#(?:[0-9a-f]{2}){2,4}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2,3}\s*\/*\s*[\d\.]+%?\))$/i,R={test:function(e){return"number"==typeof e},parse:parseFloat,transform:function(e){return e}},A=O(O({},R),{transform:z(0,1)}),X=O(O({},R),{default:1}),k=function(e){return{test:function(t){return"string"==typeof t&&t.endsWith(e)&&1===t.split(" ").length},parse:parseFloat,transform:function(t){return""+t+e}}},V=k("deg"),D=k("%"),I=k("px"),H=O(O({},D),{parse:function(e){return D.parse(e)/100},transform:function(e){return D.transform(100*e)}}),W=z(0,255),j=function(e){return void 0!==e.red},G=function(e){return void 0!==e.hue};var P=function(e){return function(t){if("string"!=typeof t)return t;for(var i={},s=function(e){return e.substring(e.indexOf("(")+1,e.lastIndexOf(")"))}(t).replace(/(,|\/)/g," ").split(/ \s*/),r=0;r<4;r++)i[e[r]]=void 0!==s[r]?parseFloat(s[r]):1;return i}},Y=O(O({},R),{transform:function(e){return Math.round(W(e))}});function Z(e,t){return e.startsWith(t)&&S.test(e)}var F,q={test:function(e){return"string"==typeof e?Z(e,"rgb"):j(e)},parse:P(["red","green","blue","alpha"]),transform:function(e){var t=e.red,i=e.green,s=e.blue,r=e.alpha,n=void 0===r?1:r;return function(e){var t=e.red,i=e.green,s=e.blue,r=e.alpha;return"rgba("+t+", "+i+", "+s+", "+(void 0===r?1:r)+")"}({red:Y.transform(t),green:Y.transform(i),blue:Y.transform(s),alpha:M(A.transform(n))})}},U={test:function(e){return"string"==typeof e?Z(e,"hsl"):G(e)},parse:P(["hue","saturation","lightness","alpha"]),transform:function(e){var t=e.hue,i=e.saturation,s=e.lightness,r=e.alpha,n=void 0===r?1:r;return function(e){var t=e.hue,i=e.saturation,s=e.lightness,r=e.alpha;return"hsla("+t+", "+i+", "+s+", "+(void 0===r?1:r)+")"}({hue:Math.round(t),saturation:D.transform(M(i)),lightness:D.transform(M(s)),alpha:M(A.transform(n))})}},J=O(O({},q),{test:function(e){return"string"==typeof e&&Z(e,"#")},parse:function(e){var t="",i="",s="";return e.length>4?(t=e.substr(1,2),i=e.substr(3,2),s=e.substr(5,2)):(t=e.substr(1,1),i=e.substr(2,1),s=e.substr(3,1),t+=t,i+=i,s+=s),{red:parseInt(t,16),green:parseInt(i,16),blue:parseInt(s,16),alpha:1}}}),Q={test:function(e){return"string"==typeof e&&S.test(e)||j(e)||G(e)},parse:function(e){return q.test(e)?q.parse(e):U.test(e)?U.parse(e):J.test(e)?J.parse(e):e},transform:function(e){return j(e)?q.transform(e):G(e)?U.transform(e):e}},K=function(e){var t=e.onRead,i=e.onRender,s=e.uncachedValues,r=void 0===s?new Set:s,n=e.useCache,o=void 0===n||n;return function(e){void 0===e&&(e={});var s=m(e,[]),n={},a=[],l=!1;function h(e,t){e.startsWith("--")&&(s.hasCSSVariable=!0);var i=n[e];n[e]=t,n[e]!==i&&(-1===a.indexOf(e)&&a.push(e),l||(l=!0,L.render(c.render)))}var c={get:function(e,i){return void 0===i&&(i=!1),!i&&o&&!r.has(e)&&void 0!==n[e]?n[e]:t(e,s)},set:function(e,t){if("string"==typeof e)h(e,t);else for(var i in e)h(i,e[i]);return this},render:function(e){return void 0===e&&(e=!1),(l||!0===e)&&(i(n,s,a),l=!1,a.length=0),this}};return c}},ee=/([a-z])([A-Z])/g,te=function(e){return e.replace(ee,"$1-$2").toLowerCase()},ie=new Map,se=new Map,re=["Webkit","Moz","O","ms",""],ne=re.length,oe="undefined"!=typeof document,ae=function(e,t){return se.set(e,te(t))},le=function(e,t){void 0===t&&(t=!1);var i=t?se:ie;return i.has(e)||(oe?function(e){F=F||document.createElement("div");for(var t=0;t<ne;t++){var i=re[t],s=""===i,r=s?e:i+e.charAt(0).toUpperCase()+e.slice(1);if(r in F.style||s){if(s&&"clipPath"===e&&se.has(e))return;ie.set(e,r),ae(e,(s?"":"-")+te(r))}}}(e):function(e){ae(e,e)}(e)),i.get(e)||e},he=["","X","Y","Z"],ce=["translate","scale","rotate","skew","transformPerspective"].reduce((function(e,t){return he.reduce((function(e,i){return e.push(t+i),e}),e)}),["x","y","z"]),de=ce.reduce((function(e,t){return e[t]=!0,e}),{});function ue(e){return!0===de[e]}function fe(e,t){return ce.indexOf(e)-ce.indexOf(t)}var Ee=new Set(["originX","originY","originZ"]);function me(e){return Ee.has(e)}var pe=E(E({},R),{transform:Math.round}),ve={color:Q,backgroundColor:Q,outlineColor:Q,fill:Q,stroke:Q,borderColor:Q,borderTopColor:Q,borderRightColor:Q,borderBottomColor:Q,borderLeftColor:Q,borderWidth:I,borderTopWidth:I,borderRightWidth:I,borderBottomWidth:I,borderLeftWidth:I,borderRadius:I,radius:I,borderTopLeftRadius:I,borderTopRightRadius:I,borderBottomRightRadius:I,borderBottomLeftRadius:I,width:I,maxWidth:I,height:I,maxHeight:I,size:I,top:I,right:I,bottom:I,left:I,padding:I,paddingTop:I,paddingRight:I,paddingBottom:I,paddingLeft:I,margin:I,marginTop:I,marginRight:I,marginBottom:I,marginLeft:I,rotate:V,rotateX:V,rotateY:V,rotateZ:V,scale:X,scaleX:X,scaleY:X,scaleZ:X,skew:V,skewX:V,skewY:V,distance:I,translateX:I,translateY:I,translateZ:I,x:I,y:I,z:I,perspective:I,opacity:A,originX:H,originY:H,originZ:I,zIndex:pe,fillOpacity:A,strokeOpacity:A,numOctaves:pe},xe=function(e){return ve[e]},_e=function(e,t){return t&&"number"==typeof e?t.transform(e):e},ge=new Set(["scrollLeft","scrollTop"]),be=new Set(["scrollLeft","scrollTop","transform"]),Te={x:"translateX",y:"translateY",z:"translateZ"};function Be(e){return"function"==typeof e}function ye(e,t,i,s,r,n,o,a){void 0===t&&(t=!0),void 0===i&&(i={}),void 0===s&&(s={}),void 0===r&&(r={}),void 0===n&&(n=[]),void 0===o&&(o=!1),void 0===a&&(a=!0);var l=!0,h=!1,c=!1;for(var d in e){var u=e[d],f=xe(d),E=_e(u,f);ue(d)?(h=!0,s[d]=E,n.push(d),l&&(f.default&&u!==f.default||!f.default&&0!==u)&&(l=!1)):me(d)?(r[d]=E,c=!0):be.has(d)&&Be(E)||(i[le(d,o)]=E)}return(h||"function"==typeof e.transform)&&(i.transform=function(e,t,i,s,r,n){void 0===n&&(n=!0);var o="",a=!1;i.sort(fe);for(var l=i.length,h=0;h<l;h++){var c=i[h];o+=(Te[c]||c)+"("+t[c]+") ",a="z"===c||a}return!a&&r?o+="translateZ(0)":o=o.trim(),Be(e.transform)?o=e.transform(t,s?"":o):n&&s&&(o="none"),o}(e,s,n,l,t,a)),c&&(i.transformOrigin=(r.originX||"50%")+" "+(r.originY||"50%")+" "+(r.originZ||0)),i}function we(e){var t=void 0===e?{}:e,i=t.enableHardwareAcceleration,s=void 0===i||i,r=t.isDashCase,n=void 0===r||r,o=t.allowTransformNone,a=void 0===o||o,l={},h={},c={},d=[];return function(e){return d.length=0,ye(e,s,l,h,c,d,n,a),l}}var Le=K({onRead:function(e,t){var i=t.element,s=t.preparseOutput,r=xe(e);if(ue(e))return r&&r.default||0;if(ge.has(e))return i[e];var n=window.getComputedStyle(i,null).getPropertyValue(le(e,!0))||0;return s&&r&&r.test(n)&&r.parse?r.parse(n):n},onRender:function(e,t,i){var s=t.element,r=t.buildStyles,n=t.hasCSSVariable;if(Object.assign(s.style,r(e)),n)for(var o=i.length,a=0;a<o;a++){var l=i[a];l.startsWith("--")&&s.style.setProperty(l,e[l])}-1!==i.indexOf("scrollLeft")&&(s.scrollLeft=e.scrollLeft),-1!==i.indexOf("scrollTop")&&(s.scrollTop=e.scrollTop)},uncachedValues:ge});var Ce=new Set(["baseFrequency","diffuseConstant","kernelMatrix","kernelUnitLength","keySplines","keyTimes","limitingConeAngle","markerHeight","markerWidth","numOctaves","targetX","targetY","surfaceScale","specularConstant","specularExponent","stdDeviation","tableValues"]),Ne=function(e,t){return I.transform(e*t)},$e={x:0,y:0,width:0,height:0};function Oe(e,t,i){return"string"==typeof e?e:I.transform(t+i*e)}var ze={enableHardwareAcceleration:!1,isDashCase:!1};function Me(e,t,i,s,r,n){void 0===t&&(t=$e),void 0===s&&(s=we(ze)),void 0===r&&(r={style:{}}),void 0===n&&(n=!0);var o=e.attrX,a=e.attrY,l=e.originX,h=e.originY,c=e.pathLength,d=e.pathSpacing,u=void 0===d?1:d,f=e.pathOffset,E=void 0===f?0:f,p=s(m(e,["attrX","attrY","originX","originY","pathLength","pathSpacing","pathOffset"]));for(var v in p){if("transform"===v)r.style.transform=p[v];else r[n&&!Ce.has(v)?te(v):v]=p[v]}return(void 0!==l||void 0!==h||p.transform)&&(r.style.transformOrigin=function(e,t,i){return Oe(t,e.x,e.width)+" "+Oe(i,e.y,e.height)}(t,void 0!==l?l:.5,void 0!==h?h:.5)),void 0!==o&&(r.x=o),void 0!==a&&(r.y=a),void 0!==i&&void 0!==c&&(r[n?"stroke-dashoffset":"strokeDashoffset"]=Ne(-E,i),r[n?"stroke-dasharray":"strokeDasharray"]=Ne(c,i)+" "+Ne(u,i)),r}function Se(e,t,i){void 0===i&&(i=!0);var s={style:{}},r=we(ze);return function(n){return Me(n,e,t,r,s,i)}}var Re=K({onRead:function(e,t){var i=t.element;if(ue(e=Ce.has(e)?e:te(e))){var s=xe(e);return s&&s.default||0}return i.getAttribute(e)},onRender:function(e,t){var i=t.element,s=(0,t.buildAttrs)(e);for(var r in s)"style"===r?Object.assign(i.style,s.style):i.setAttribute(r,s[r])}}),Ae=K({useCache:!1,onRead:function(e){return"scrollTop"===e?window.pageYOffset:window.pageXOffset},onRender:function(e){var t=e.scrollTop,i=void 0===t?0:t,s=e.scrollLeft,r=void 0===s?0:s;return window.scrollTo(r,i)}}),Xe=new WeakMap,ke=function(e,t){var i,s,r,n;return e===window?i=Ae(e):!function(e){return e instanceof HTMLElement||"function"==typeof e.click}(e)?function(e){return e instanceof SVGElement||"ownerSVGElement"in e}(e)&&(r=function(e){try{return function(e){return"function"==typeof e.getBBox?e.getBBox():e.getBoundingClientRect()}(e)}catch(t){return{x:0,y:0,width:0,height:0}}}(s=e),n=function(e){return"path"===e.tagName}(s)&&s.getTotalLength?s.getTotalLength():void 0,i=Re({element:s,buildAttrs:Se(r,n)})):i=function(e,t){void 0===t&&(t={});var i=t.enableHardwareAcceleration,s=t.allowTransformNone,r=m(t,["enableHardwareAcceleration","allowTransformNone"]);return Le(E({element:e,buildStyles:we({enableHardwareAcceleration:i,allowTransformNone:s}),preparseOutput:!0},r))}(e,t),Xe.set(e,i),i};function Ve(e,t){return function(e,t){return Xe.has(e)?Xe.get(e):ke(e,t)}("string"==typeof e?document.querySelector(e):e,t)}var De=function(e,t,i,s){var r=i?i.call(s,e,t):void 0;if(void 0!==r)return!!r;if(e===t)return!0;if("object"!=typeof e||!e||"object"!=typeof t||!t)return!1;var n=Object.keys(e),o=Object.keys(t);if(n.length!==o.length)return!1;for(var a=Object.prototype.hasOwnProperty.bind(t),l=0;l<n.length;l++){var h=n[l];if(!a(h))return!1;var c=e[h],d=t[h];if(!1===(r=i?i.call(s,c,d,h):void 0)||void 0===r&&c!==d)return!1}return!0};const Ie="!#%()*+,-./:;=?@[]^_`{|}~ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",He=Ie.length,We=Array(20),je=()=>{for(let e=0;e<20;e++)We[e]=Ie.charAt(Math.random()*He);return We.join("")};class Ge{constructor(){this.disposers=new Map}add(e,t=je()){return this.flush(t),this.disposers.set(t,e()),t}addDisposer(e,t=je()){return this.flush(t),this.disposers.set(t,e),t}addEventListener(e,t,i,s,r=je()){return this.add((()=>(e.addEventListener(t,i,s),()=>e.removeEventListener(t,i,s))),r),r}setTimeout(e,t,i=je()){return this.add((()=>{const s=window.setTimeout((()=>{this.remove(i),e()}),t);return()=>window.clearTimeout(s)}),i)}setInterval(e,t,i=je()){return this.add((()=>{const i=window.setInterval(e,t);return()=>window.clearInterval(i)}),i)}remove(e){const t=this.disposers.get(e);return this.disposers.delete(e),t}flush(e){const t=this.remove(e);if(t)try{t()}catch(i){console.error(i)}}flushAll(){this.disposers.forEach((e=>{try{e()}catch(t){console.error(t)}})),this.disposers.clear()}}var Pe=Object.defineProperty,Ye=("undefined"!=typeof require&&require,(e,t,i)=>{return n=i,(r="symbol"!=typeof t?t+"":t)in(s=e)?Pe(s,r,{enumerable:!0,configurable:!0,writable:!0,value:n}):s[r]=n,i;var s,r,n});class Ze{constructor(e,t){Ye(this,"_value"),Ye(this,"_beforeDestroys"),Ye(this,"_subscribers"),this._value=e,t&&(this.compare=t)}get value(){return this._value}setValue(e,t){if(!this.compare(e,this._value)){const i=this._value;this._value=e,this._subscribers&&this._subscribers.forEach((s=>s(e,i,t)))}}reaction(e){return this._subscribers||(this._subscribers=new Set),this._subscribers.add(e),()=>{this._subscribers&&this._subscribers.delete(e)}}subscribe(e,t){const i=this.reaction(e);return e(this._value,void 0,t),i}derive(e,t,i){const s=new Ze(e(this.value,void 0,i),t),r=this.reaction(((t,i,r)=>{s.setValue(e(t,i,r))}));return s.addBeforeDestroy(r),s}destroy(){this._beforeDestroys&&(this._beforeDestroys.forEach((e=>e())),this._beforeDestroys.clear()),this._subscribers&&this._subscribers.clear()}addBeforeDestroy(e){return this._beforeDestroys||(this._beforeDestroys=new Set),this._beforeDestroys.add(e),()=>{this._beforeDestroys&&this._beforeDestroys.delete(e)}}compare(e,t){return e===t}}function Fe(e,t){Object.keys(t).forEach((i=>{!function(e,t,i){var s;Object.defineProperties(e,{[t]:{get:()=>i.value},[`_${t}$`]:{value:i},[`set${s=t,s[0].toUpperCase()+s.slice(1)}`]:{value:(e,t)=>i.setValue(e,t)}})}(e,i,t[i])}))}function qe(e){const t=t=>{const i=e.addDisposer((()=>{t.destroy()}));return t.addBeforeDestroy((()=>{e.remove(i)})),t};return{bindSideEffect:t,combine:(e,i,s,r)=>t(function(e,t,i,s){let r=e.map((e=>e.value));const n=new Ze(t(r,void 0,s),i);return e.forEach(((e,i)=>{const s=e.reaction(((e,s,o)=>{const a=r.slice();a[i]=e;const l=r;r=a,n.setValue(t(a,l,o),o)}));n.addBeforeDestroy(s)})),n}(e,i,s,r)),createVal:(e,i)=>t(new Ze(e,i))}}var Ue,Je,Qe,Ke,et;exports.TELE_BOX_COLOR_SCHEME=void 0,(Ue=exports.TELE_BOX_COLOR_SCHEME||(exports.TELE_BOX_COLOR_SCHEME={})).Light="light",Ue.Dark="dark",Ue.Auto="auto",exports.TELE_BOX_STATE=void 0,(Je=exports.TELE_BOX_STATE||(exports.TELE_BOX_STATE={})).Normal="normal",Je.Minimized="minimized",Je.Maximized="maximized",exports.TELE_BOX_EVENT=void 0,(Qe=exports.TELE_BOX_EVENT||(exports.TELE_BOX_EVENT={})).DarkMode="dark_mode",Qe.PrefersColorScheme="prefers_color_scheme",Qe.Close="close",Qe.Focus="focus",Qe.Blur="blur",Qe.Move="move",Qe.Resize="resize",Qe.IntrinsicMove="intrinsic_move",Qe.IntrinsicResize="intrinsic_resize",Qe.VisualResize="visual_resize",Qe.ZIndex="z_index",Qe.State="state",Qe.Minimized="minimized",Qe.Maximized="maximized",Qe.Readonly="readonly",Qe.Destroyed="destroyed",exports.TELE_BOX_DELEGATE_EVENT=void 0,(Ke=exports.TELE_BOX_DELEGATE_EVENT||(exports.TELE_BOX_DELEGATE_EVENT={})).Close="close",Ke.Maximize="maximize",Ke.Minimize="minimize",exports.TELE_BOX_RESIZE_HANDLE=void 0,(et=exports.TELE_BOX_RESIZE_HANDLE||(exports.TELE_BOX_RESIZE_HANDLE={})).North="n",et.South="s",et.West="w",et.East="e",et.NorthWest="nw",et.NorthEast="ne",et.SouthEast="se",et.SouthWest="sw";function tt(e,t,i){return Math.min(Math.max(e,t),i)}function it(e){e.stopPropagation(),e.cancelable&&e.preventDefault()}function st(e){return e.touches?e.touches[0]:e}function rt(){return Date.now().toString().slice(6)+Math.random().toString().slice(2,8)}let nt=1;function ot(){return"New Box "+nt++}function at(e){return Boolean(e)}function lt(e){return!e}class ht{constructor({readonly:e=!1,title:t,buttons:i,onEvent:s,onDragStart:r,namespace:n="telebox",state:o=exports.TELE_BOX_STATE.Normal}={}){this.$btns=[],this.sideEffect=new Ge,this.lastTitleBarClick={timestamp:0,clientX:-100,clientY:-100},this.handleTitleBarClick=e=>{var t;if(this.readonly)return;if(0!==e.button)return;if(null==(t=e.target.dataset)?void 0:t.teleTitleBarNoDblClick)return;it(e);const i=Date.now();i-this.lastTitleBarClick.timestamp<=500?Math.abs(e.clientX-this.lastTitleBarClick.clientX)<=5&&Math.abs(e.clientY-this.lastTitleBarClick.clientY)<=5&&this.onEvent&&this.onEvent({type:exports.TELE_BOX_DELEGATE_EVENT.Maximize}):this.onDragStart&&this.onDragStart(e),this.lastTitleBarClick.timestamp=i,this.lastTitleBarClick.clientX=e.clientX,this.lastTitleBarClick.clientY=e.clientY},this.lastTitleBarTouch={timestamp:0,clientX:-100,clientY:-100},this.handleTitleBarTouch=e=>{var t;if(this.readonly)return;if(null==(t=e.target.dataset)?void 0:t.teleTitleBarNoDblClick)return;it(e);const i=Date.now(),{clientX:s=this.lastTitleBarTouch.clientX+100,clientY:r=this.lastTitleBarTouch.clientY+100}=e.touches[0]||{};i-this.lastTitleBarTouch.timestamp<=500?Math.abs(s-this.lastTitleBarTouch.clientX)<=10&&Math.abs(r-this.lastTitleBarTouch.clientY)<=10&&this.onEvent&&this.onEvent({type:exports.TELE_BOX_DELEGATE_EVENT.Maximize}):this.onDragStart&&this.onDragStart(e),this.lastTitleBarTouch.timestamp=i,this.lastTitleBarTouch.clientX=s,this.lastTitleBarTouch.clientY=r},this.readonly=e,this.onEvent=s,this.onDragStart=r,this.namespace=n,this.title=t,this.state=o,this.buttons=i||[{type:exports.TELE_BOX_DELEGATE_EVENT.Minimize,iconClassName:this.wrapClassName("titlebar-icon-minimize")},{type:exports.TELE_BOX_DELEGATE_EVENT.Maximize,iconClassName:this.wrapClassName("titlebar-icon-maximize"),isActive:e=>e===exports.TELE_BOX_STATE.Maximized},{type:exports.TELE_BOX_DELEGATE_EVENT.Close,iconClassName:this.wrapClassName("titlebar-icon-close")}],this.$dragArea=this.renderDragArea()}setTitle(e){this.title=e,this.$title&&(this.$title.textContent=e,this.$title.title=e)}setState(e){this.state!==e&&(this.state=e,this.buttons.forEach(((t,i)=>{t.isActive&&this.$btns[i].classList.toggle("is-active",t.isActive(e))})))}setReadonly(e){this.readonly!==e&&(this.readonly=e)}render(){if(!this.$titleBar){this.$titleBar=document.createElement("div"),this.$titleBar.className=this.wrapClassName("titlebar");const e=document.createElement("div");e.className=this.wrapClassName("title-area"),e.dataset.teleBoxHandle="dh",this.$title=document.createElement("h1"),this.$title.className=this.wrapClassName("title"),this.$title.dataset.teleBoxHandle="dh",this.title&&(this.$title.textContent=this.title,this.$title.title=this.title),e.appendChild(this.$title),e.appendChild(this.$dragArea);const t=document.createElement("div");t.className=this.wrapClassName("titlebar-btns"),this.buttons.forEach((({iconClassName:e,isActive:i},s)=>{const r=String(s),n=document.createElement("button");n.className=`${this.wrapClassName("titlebar-btn")} ${e}`,n.dataset.teleTitleBarBtnIndex=r,n.dataset.teleTitleBarNoDblClick="true",i&&n.classList.toggle("is-active",i(this.state)),this.$btns.push(n),t.appendChild(n)})),this.sideEffect.addEventListener(t,"click",(e=>{var t;if(this.readonly)return;const i=e.target,s=Number(null==(t=i.dataset)?void 0:t.teleTitleBarBtnIndex);if(!Number.isNaN(s)&&s<this.buttons.length){it(e);const t=this.buttons[s];this.onEvent&&this.onEvent({type:t.type,value:t.value})}})),this.$titleBar.appendChild(e),this.$titleBar.appendChild(t)}return this.$titleBar}renderDragArea(){const e=document.createElement("div");return e.className=this.wrapClassName("drag-area"),e.dataset.teleBoxHandle="dh",this.sideEffect.addEventListener(e,"mousedown",this.handleTitleBarClick),this.sideEffect.addEventListener(e,"touchstart",this.handleTitleBarTouch,{passive:!0}),e}dragHandle(){return this.$titleBar}wrapClassName(e){return`${this.namespace}-${e}`}destroy(){this.sideEffect.flushAll(),this.$titleBar&&(this.$titleBar=void 0,this.$title=void 0,this.$btns.length=0,this.onDragStart=void 0,this.onEvent=void 0)}}class ct{constructor({id:e=rt(),title:t=ot(),prefersColorScheme:i=exports.TELE_BOX_COLOR_SCHEME.Light,darkMode:s,visible:r=!0,width:n=.5,height:o=.5,minWidth:a=0,minHeight:l=0,x:h=.1,y:c=.1,minimized:d=!1,maximized:u=!1,readonly:E=!1,resizable:m=!0,draggable:p=!0,fence:v=!0,fixRatio:x=!1,focus:_=!1,zIndex:g=100,namespace:b="telebox",titleBar:T,content:B,footer:y,styles:w,containerRect:L={x:0,y:0,width:window.innerWidth,height:window.innerHeight},collectorRect:C}={}){this._renderSideEffect=new Ge,this.handleTrackStart=e=>{var t;return null==(t=this._handleTrackStart)?void 0:t.call(this,e)},this._sideEffect=new Ge,this._valSideEffectBinder=qe(this._sideEffect);const{combine:N,createVal:$}=this._valSideEffectBinder;this.id=e,this.namespace=b,this.events=new f,this._delegateEvents=new f;const O=$(i);O.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.PrefersColorScheme,e)}));const z=$(Boolean(s));null==s&&O.subscribe(((e,t,i)=>{this._sideEffect.add((()=>{if("auto"===e){const e=window.matchMedia("(prefers-color-scheme: dark)");if(e){z.setValue(e.matches,i);const t=e=>{z.setValue(e.matches,i)};return e.addListener(t),()=>e.removeListener(t)}return dt}return z.setValue("dark"===e,i),dt}),"prefers-color-scheme")})),z.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.DarkMode,e)}));const M=$(L,De),S=$(C,De),R=$(t),A=$(r);A.reaction(((e,t,i)=>{i||e||this.events.emit(exports.TELE_BOX_EVENT.Close)}));const X=$(E);X.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.Readonly,e)}));const k=$(m),V=$(p),D=$(v),I=$(x),H=$(g);H.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.ZIndex,e)}));const W=$(_);W.reaction(((e,t,i)=>{i||this.events.emit(e?exports.TELE_BOX_EVENT.Focus:exports.TELE_BOX_EVENT.Blur)}));const j=$(d);j.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.Minimized,e)}));const G=$(u);G.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.Maximized,e)}));const P=N([j,G],(([e,t])=>e?exports.TELE_BOX_STATE.Minimized:t?exports.TELE_BOX_STATE.Maximized:exports.TELE_BOX_STATE.Normal));P.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.State,e)}));const Y=$({width:tt(a,0,1),height:tt(l,0,1)},De),Z=$({width:tt(n,Y.value.width,1),height:tt(o,Y.value.height,1)},De);Y.reaction(((e,t,i)=>{Z.setValue({width:tt(n,e.width,1),height:tt(o,e.height,1)},i)})),Z.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.IntrinsicResize,e)}));const F=N([Z,G],(([e,t])=>t?{width:1,height:1}:e),De);F.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.Resize,e)}));const q=N([F,j,M,S],(([e,t,i,s])=>t&&s?{width:s.width/e.width/i.width,height:s.height/e.height/i.height}:e),De);q.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.VisualResize,e)}));const U=$({x:tt(h,0,1),y:tt(c,0,1)},De);U.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.IntrinsicMove,e)}));const J=N([U,Z,M,S,j,G],(([e,t,i,s,r,n])=>r&&s?n?{x:(s.x+s.width/2)/i.width-.5,y:(s.y+s.height/2)/i.height-.5}:{x:(s.x+s.width/2)/i.width-t.width/2,y:(s.y+s.height/2)/i.height-t.height/2}:n?{x:0,y:0}:e),De);J.reaction(((e,t,i)=>{i||this.events.emit(exports.TELE_BOX_EVENT.Move,e)})),this.titleBar=T||new ht({readonly:X.value,title:R.value,namespace:this.namespace,onDragStart:e=>{var t;return null==(t=this._handleTrackStart)?void 0:t.call(this,e)},onEvent:e=>{if(this._delegateEvents.listeners.length>0)this._delegateEvents.emit(e.type);else switch(e.type){case exports.TELE_BOX_DELEGATE_EVENT.Maximize:G.setValue(!G.value);break;case exports.TELE_BOX_DELEGATE_EVENT.Minimize:j.setValue(!0);break;case exports.TELE_BOX_DELEGATE_EVENT.Close:A.setValue(!1);break;default:console.error("Unsupported titleBar event:",e)}}}),X.reaction((e=>{this.titleBar.setReadonly(e)}));const Q=$(B),K=$(y),ee=$(w);Fe(this,{prefersColorScheme:O,darkMode:z,containerRect:M,collectorRect:S,title:R,visible:A,readonly:X,resizable:k,draggable:V,fence:D,fixRatio:I,focus:W,zIndex:H,minimized:j,maximized:G,$userContent:Q,$userFooter:K,$userStyles:ee}),this._state$=P,this._minSize$=Y,this._size$=F,this._intrinsicSize$=Z,this._visualSize$=q,this._coord$=J,this._intrinsicCoord$=U,this.fixRatio&&this.transform(J.value.x,J.value.y,F.value.width,F.value.height,!0),this.$box=this.render()}get darkMode(){return this._darkMode$.value}get state(){return this._state$.value}setState(e,t=!1){switch(e){case exports.TELE_BOX_STATE.Maximized:this.setMinimized(!1,t),this.setMaximized(!0,t);break;case exports.TELE_BOX_STATE.Minimized:this.setMinimized(!0,t),this.setMaximized(!1,t);break;default:this.setMinimized(!1,t),this.setMaximized(!1,t)}return this}get minWidth(){return this._minSize$.value.width}get minHeight(){return this._minSize$.value.height}setMinWidth(e,t=!1){return this._minSize$.setValue({width:e,height:this.minHeight},t),this}setMinHeight(e,t=!1){return this._minSize$.setValue({width:this.minWidth,height:e},t),this}get intrinsicWidth(){return this._intrinsicSize$.value.width}get intrinsicHeight(){return this._intrinsicSize$.value.height}resize(e,t,i=!1){return this._intrinsicSize$.setValue({width:e,height:t},i),this}get width(){return this._size$.value.width}get height(){return this._size$.value.height}get absoluteWidth(){return this.width*this.containerRect.width}get absoluteHeight(){return this.height*this.containerRect.height}get visualWidth(){return this._visualSize$.value.width}get visualHeight(){return this._visualSize$.value.height}get intrinsicX(){return this._intrinsicCoord$.value.x}get intrinsicY(){return this._intrinsicCoord$.value.y}move(e,t,i=!1){return this._intrinsicCoord$.setValue({x:e,y:t},i),this}get x(){return this._coord$.value.x}get y(){return this._coord$.value.y}transform(e,t,i,s,r=!1){if(this.fixRatio){const e=this.intrinsicHeight/this.intrinsicWidth*i;t!==this.intrinsicY&&(t-=e-s),s=e}return t<0&&(t=0,s>this.intrinsicHeight&&(s=this.intrinsicHeight)),this._intrinsicCoord$.setValue({x:i>=this.minWidth?e:this.intrinsicX,y:s>=this.minHeight?t:this.intrinsicY},r),this._intrinsicSize$.setValue({width:tt(i,this.minWidth,1),height:tt(s,this.minHeight,1)},r),this}mount(e){return e.appendChild(this.render()),this}unmount(){return this.$box&&this.$box.remove(),this}mountContent(e){return this.set$userContent(e),this}unmountContent(){return this.set$userContent(void 0),this}mountFooter(e){return this.set$userFooter(e),this}unmountFooter(){return this.set$userFooter(void 0),this}getUserStyles(){return this.$userStyles}mountStyles(e){let t;return"string"==typeof e?(t=document.createElement("style"),t.textContent=e):t=e,this.set$userStyles(t),this}unmountStyles(){return this.set$userStyles(void 0),this}render(e){if(e){if(e===this.$box)return this.$box;this.$box=e}else{if(this.$box)return this.$box;this.$box=document.createElement("div")}this._renderSideEffect.flushAll(),this.$box.classList.add(this.wrapClassName("box"));const t=(e,t,i,s=at)=>this._renderSideEffect.add((()=>{const r=this.wrapClassName(i);return t.subscribe((t=>{e.classList.toggle(r,s(t))}))}));t(this.$box,this._readonly$,"readonly"),t(this.$box,this._draggable$,"no-drag",lt),t(this.$box,this._resizable$,"no-resize",lt),t(this.$box,this._focus$,"blur",lt),t(this.$box,this._darkMode$,"color-scheme-dark"),t(this.$box,this._darkMode$,"color-scheme-light",lt),this._renderSideEffect.add((()=>{const e=this.wrapClassName("minimized"),t=this.wrapClassName("maximized"),i="box-maximized-timer";return this._state$.subscribe((s=>{this.$box.classList.toggle(e,s===exports.TELE_BOX_STATE.Minimized),s===exports.TELE_BOX_STATE.Maximized?(this._renderSideEffect.flush(i),this.$box.classList.toggle(t,!0)):this._renderSideEffect.setTimeout((()=>{this.$box.classList.toggle(t,!1)}),0,i)}))})),this._renderSideEffect.add((()=>this._visible$.subscribe((e=>{this.$box.style.display=e?"block":"none"})))),this._renderSideEffect.add((()=>this._zIndex$.subscribe((e=>{this.$box.style.zIndex=String(e)}))));const i=Ve(this.$box);this.$box.dataset.teleBoxID=this.id,this.$box.style.width=this.absoluteWidth+"px",this.$box.style.height=this.absoluteHeight+"px";const s=this.x*this.containerRect.width+this.containerRect.x,r=this.y*this.containerRect.height+this.containerRect.y;this.$box.style.transform=`translate(${s-10}px,${r-10}px)`,this._valSideEffectBinder.combine([this._coord$,this._size$,this._minimized$,this._containerRect$,this._collectorRect$],(([e,t,i,s,r])=>{const n=t.width*s.width,o=t.height*s.height;return{width:n,height:o,x:e.x*s.width,y:e.y*s.height,scaleX:i&&r?r.width/n:1,scaleY:i&&r?r.height/o:1}}),De).subscribe((e=>{i.set(e)})),i.set({x:s,y:r});const n=document.createElement("div");n.className=this.wrapClassName("box-main"),this.$box.appendChild(n);const o=document.createElement("div");o.className=this.wrapClassName("titlebar-wrap"),o.appendChild(this.titleBar.render()),this.$titleBar=o;const a=document.createElement("div");a.className=this.wrapClassName("content-wrap");const l=document.createElement("div");l.className=this.wrapClassName("content")+" tele-fancy-scrollbar",this.$content=l,this._renderSideEffect.add((()=>{let e;return this._$userStyles$.subscribe((t=>{e&&e.remove(),e=t,t&&a.appendChild(t)}))})),this._renderSideEffect.add((()=>{let e;return this._$userContent$.subscribe((t=>{e&&e.remove(),e=t,t&&l.appendChild(t)}))})),a.appendChild(l);const h=document.createElement("div");return h.className=this.wrapClassName("footer-wrap"),this.$footer=h,this._renderSideEffect.add((()=>{let e;return this._$userFooter$.subscribe((t=>{e&&e.remove(),e=t,t&&h.appendChild(t)}))})),n.appendChild(o),n.appendChild(a),n.appendChild(h),this._renderResizeHandlers(),this.$box}_renderResizeHandlers(){const e=document.createElement("div");e.className=this.wrapClassName("resize-handles"),Object.values(exports.TELE_BOX_RESIZE_HANDLE).forEach((t=>{const i=document.createElement("div");i.className=this.wrapClassName(t)+" "+this.wrapClassName("resize-handle"),i.dataset.teleBoxHandle=t,e.appendChild(i)})),this.$box.appendChild(e);const t="handle-tracking-listener",i=this.wrapClassName("transforming");let s,r,n=0,o=0,a=0,l=0,h=0,c=0;const d=e=>{if(this.state!==exports.TELE_BOX_STATE.Normal)return;it(e);let{pageX:t,pageY:i}=st(e);i<0&&(i=0);const s=(t-h)/this.containerRect.width,d=(i-c)/this.containerRect.height;switch(r){case exports.TELE_BOX_RESIZE_HANDLE.North:this.transform(this.x,o+d,this.width,l-d);break;case exports.TELE_BOX_RESIZE_HANDLE.South:this.transform(this.x,this.y,this.width,l+d);break;case exports.TELE_BOX_RESIZE_HANDLE.West:this.transform(n+s,this.y,a-s,this.height);break;case exports.TELE_BOX_RESIZE_HANDLE.East:this.transform(this.x,this.y,a+s,this.height);break;case exports.TELE_BOX_RESIZE_HANDLE.NorthWest:this.transform(n+s,o+d,a-s,l-d);break;case exports.TELE_BOX_RESIZE_HANDLE.NorthEast:this.transform(this.x,o+d,a+s,l-d);break;case exports.TELE_BOX_RESIZE_HANDLE.SouthEast:this.transform(this.x,this.y,a+s,l+d);break;case exports.TELE_BOX_RESIZE_HANDLE.SouthWest:this.transform(n+s,this.y,a-s,l+d);break;default:if(this.fence)this.move(tt(n+s,0,1-this.width),tt(o+d,0,1-this.height));else{const e=20/this.containerRect.width,t=20/this.containerRect.height;this.move(tt(n+s,e-this.width,1-e),tt(o+d,0,1-t))}}},u=e=>{r=void 0,s&&(it(e),this.$box.classList.toggle(i,!1),this._sideEffect.flush(t),s.remove())},f=e=>{var f;if(this.readonly)return;if(null!=e.button&&0!==e.button)return;if(!this.draggable||r||this.state!==exports.TELE_BOX_STATE.Normal)return;const E=e.target;if(null==(f=E.dataset)?void 0:f.teleBoxHandle){it(e),n=this.x,o=this.y,a=this.width,l=this.height,({pageX:h,pageY:c}=st(e)),r=E.dataset.teleBoxHandle,s||(s=document.createElement("div"));const f=r?this.wrapClassName(`cursor-${r}`):"";s.className=this.wrapClassName("track-mask"+(f?` ${f}`:"")),this.$box.appendChild(s),this.$box.classList.add(i),this._sideEffect.add((()=>(window.addEventListener("mousemove",d),window.addEventListener("touchmove",d,{passive:!1}),window.addEventListener("mouseup",u),window.addEventListener("touchend",u,{passive:!1}),window.addEventListener("touchcancel",u,{passive:!1}),()=>{window.removeEventListener("mousemove",d),window.removeEventListener("touchmove",d),window.removeEventListener("mouseup",u),window.removeEventListener("touchend",u),window.removeEventListener("touchcancel",u)})),t)}};this._handleTrackStart=f,this._sideEffect.addEventListener(e,"mousedown",f,{},"box-resizeHandles-mousedown"),this._sideEffect.addEventListener(e,"touchstart",f,{passive:!1},"box-resizeHandles-touchstart")}destroy(){this.$box.remove(),this.events.emit(exports.TELE_BOX_EVENT.Destroyed),this._sideEffect.flushAll(),this._renderSideEffect.flushAll(),this.events.removeAllListeners(),this._delegateEvents.removeAllListeners()}wrapClassName(e){return`${this.namespace}-${e}`}}function dt(){}const ut=(e,t)=>{const i=h.useRef(!0);h.useEffect((()=>{if(!i.current)return e();i.current=!1}),t)};var ft;class Et{constructor({visible:e=!0,readonly:t=!1,darkMode:i=!1,namespace:s="telebox",styles:r={},onClick:n}={}){this.handleCollectorClick=()=>{!this._readonly&&this.onClick&&this.onClick()},this._visible=e,this._readonly=t,this._darkMode=i,this.namespace=s,this.styles=r,this.onClick=n}get visible(){return this._visible}get readonly(){return this._readonly}get darkMode(){return this._darkMode}mount(e){return e.appendChild(this.render()),this}unmount(){return this.$collector&&this.$collector.remove(),this}setVisible(e){return this._visible!==e&&(this._visible=e,this.$collector&&this.$collector.classList.toggle(this.wrapClassName("collector-visible"),e)),this}setReadonly(e){return this._readonly!==e&&(this._readonly=e,this.$collector&&this.$collector.classList.toggle(this.wrapClassName("collector-readonly"),e)),this}setDarkMode(e){return this._darkMode!==e&&(this._darkMode=e,this.$collector&&(this.$collector.classList.toggle(this.wrapClassName("color-scheme-dark"),e),this.$collector.classList.toggle(this.wrapClassName("color-scheme-light"),!e))),this}setStyles(e){if(Object.assign(this.styles,e),this.$collector){const t=this.$collector;Object.keys(e).forEach((i=>{const s=e[i];null!=s&&(t.style[i]=s)}))}return this}render(){return this.$collector||(this.$collector=document.createElement("button"),this.$collector.className=this.wrapClassName("collector"),this.$collector.style.backgroundImage="url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOCAxNiI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxwYXRoIHN0cm9rZT0iIzdCODhBMCIgc3Ryb2tlLXdpZHRoPSIxLjQiIGQ9Ik0uNyAxLjJoMTYuNnYxMy42SC43eiIgLz4KICAgICAgICA8cGF0aCBmaWxsPSIjN0I4OEEwIiBkPSJNNCA1LjVoNnYxLjRINHpNNCA5LjVoMTB2MS40SDR6IiAvPgogICAgPC9nPgo8L3N2Zz4K')",this.$collector.addEventListener("click",this.handleCollectorClick),this._visible&&this.$collector.classList.add(this.wrapClassName("collector-visible")),this._readonly&&this.$collector.classList.add(this.wrapClassName("collector-readonly")),this.$collector.classList.add(this.wrapClassName(this._darkMode?"color-scheme-dark":"color-scheme-light")),this.setStyles(this.styles)),this.$collector}destroy(){this.$collector&&(this.$collector.removeEventListener("click",this.handleCollectorClick),this.$collector.remove(),this.$collector=void 0),this.onClick=void 0}wrapClassName(e){return`${this.namespace}-${e}`}}exports.TELE_BOX_MANAGER_EVENT=void 0,(ft=exports.TELE_BOX_MANAGER_EVENT||(exports.TELE_BOX_MANAGER_EVENT={})).Focused="focused",ft.Blurred="blurred",ft.Created="created",ft.Removed="removed",ft.State="state",ft.Maximized="maximized",ft.Minimized="minimized",ft.Move="move",ft.Resize="resize",ft.IntrinsicMove="intrinsic_move",ft.IntrinsicResize="intrinsic_resize",ft.VisualResize="visual_resize",ft.ZIndex="z_index",ft.PrefersColorScheme="prefers_color_scheme",ft.DarkMode="dark_mode";class mt extends ht{constructor(e){super(e),this.boxes=e.boxes,this.focusedBox=e.focusedBox,this.containerRect=e.containerRect,this.darkMode=e.darkMode}focusBox(e){var t;if(!this.focusedBox||this.focusedBox!==e){if(this.$titles&&this.state===exports.TELE_BOX_STATE.Maximized){const{children:i}=this.$titles.firstElementChild;for(let s=i.length-1;s>=0;s-=1){const r=i[s],n=null==(t=r.dataset)?void 0:t.teleBoxID;n&&(e&&n===e.id?r.classList.toggle(this.wrapClassName("titles-tab-focus"),!0):this.focusedBox&&n===this.focusedBox.id&&r.classList.toggle(this.wrapClassName("titles-tab-focus"),!1))}}this.focusedBox=e}}setContainerRect(e){if(this.containerRect=e,this.$titleBar){const{x:t,y:i,width:s}=e;this.$titleBar.style.transform=`translate(${t}px, ${i}px)`,this.$titleBar.style.width=s+"px"}}setBoxes(e){this.boxes=e,this.updateTitles()}setState(e){super.setState(e),this.$titleBar&&this.$titleBar.classList.toggle(this.wrapClassName("max-titlebar-maximized"),e===exports.TELE_BOX_STATE.Maximized),this.updateTitles()}setReadonly(e){super.setReadonly(e),this.$titleBar&&this.$titleBar.classList.toggle(this.wrapClassName("readonly"),this.readonly)}setDarkMode(e){e!==this.darkMode&&(this.darkMode=e,this.$titleBar&&(this.$titleBar.classList.toggle(this.wrapClassName("color-scheme-dark"),e),this.$titleBar.classList.toggle(this.wrapClassName("color-scheme-light"),!e)))}render(){const e=super.render(),{x:t,y:i,width:s}=this.containerRect;e.style.transform=`translate(${t}px, ${i}px)`,e.style.width=s+"px",e.classList.add(this.wrapClassName("max-titlebar")),e.classList.toggle(this.wrapClassName("max-titlebar-maximized"),this.state===exports.TELE_BOX_STATE.Maximized),e.classList.toggle(this.wrapClassName("readonly"),this.readonly),e.classList.add(this.wrapClassName(this.darkMode?"color-scheme-dark":"color-scheme-light"));const r=document.createElement("div");return r.classList.add(this.wrapClassName("titles-area")),e.insertBefore(r,e.firstElementChild),this.updateTitles(),e}destroy(){super.destroy(),this.$titles=void 0,this.boxes.length=0,this.focusedBox=void 0}updateTitles(){this.$titleBar&&this.state===exports.TELE_BOX_STATE.Maximized&&(this.$titleBar.classList.toggle(this.wrapClassName("max-titlebar-single-title"),1===this.boxes.length),1===this.boxes.length?this.setTitle(this.boxes[0].title):this.$titleBar.replaceChild(this.renderTitles(),this.$titleBar.firstElementChild))}renderTitles(){this.$titles=document.createElement("div"),this.$titles.className=this.wrapClassName("titles"),this.$titles.addEventListener("wheel",(e=>{e.currentTarget.scrollBy({left:e.deltaY>0?250:-250,behavior:"smooth"})}),{passive:!1});const e=document.createElement("div");return e.className=this.wrapClassName("titles-content"),this.$titles.appendChild(e),this.boxes.forEach((t=>{const i=document.createElement("button");i.className=this.wrapClassName("titles-tab"),i.textContent=t.title,i.dataset.teleBoxID=t.id,i.dataset.teleTitleBarNoDblClick="true",this.focusedBox&&t.id===this.focusedBox.id&&i.classList.add(this.wrapClassName("titles-tab-focus")),e.appendChild(i)})),this.$titles}}exports.DefaultTitleBar=ht,exports.TeleBox=ct,exports.TeleBoxCollector=Et,exports.TeleBoxDragHandleType="dh",exports.TeleBoxManager=class{constructor({root:e=document.body,prefersColorScheme:t=exports.TELE_BOX_COLOR_SCHEME.Light,minimized:i=!1,maximized:s=!1,fence:r=!0,containerRect:n={x:0,y:0,width:window.innerWidth,height:window.innerHeight},collector:o,namespace:a="telebox",readonly:l=!1}={}){this.events=new f,this._sideEffect=new Ge;const{combine:h,createVal:c}=qe(this._sideEffect);this.root=e,this.namespace=a,this.boxes$=c([]),this.topBox$=this.boxes$.derive((e=>{if(e.length>0){return e.reduce(((e,t)=>e.zIndex>t.zIndex?e:t))}}));const d=window.matchMedia("(prefers-color-scheme: dark)"),u=c(!1);d&&(u.setValue(d.matches),this._sideEffect.add((()=>{const e=e=>{u.setValue(e.matches)};return d.addListener(e),()=>d.removeListener(e)})));const E=c(t);E.reaction(((e,t,i)=>{this.boxes.forEach((t=>t.setPrefersColorScheme(e,i))),i||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.PrefersColorScheme,e)})),this._darkMode$=h([u,E],(([e,t])=>"auto"===t?e:"dark"===t)),this._darkMode$.reaction(((e,t,i)=>{this.boxes.forEach((t=>t.setDarkMode(e,i))),i||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.DarkMode,e)}));const m=c(l);m.reaction(((e,t,i)=>{this.boxes.forEach((t=>t.setReadonly(e,i)))}));const p=c(i),v=c(s);v.reaction(((e,t,i)=>{this.boxes.forEach((t=>t.setMaximized(e,i))),i||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Maximized,e)}));const x=h([p,v],(([e,t])=>e?exports.TELE_BOX_STATE.Minimized:t?exports.TELE_BOX_STATE.Maximized:exports.TELE_BOX_STATE.Normal));x.reaction(((e,t,i)=>{this.maxTitleBar.setState(e),i||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.State,e)}));const _=c(r);_.subscribe(((e,t,i)=>{this.boxes.forEach((t=>t.setFence(e,i)))}));const g=c(n,De);g.reaction(((e,t,i)=>{this.boxes.forEach((t=>t.setContainerRect(e,i))),this.maxTitleBar.setContainerRect(e)}));const b=c(null===o?null:o||new Et({visible:i,readonly:l,namespace:a}).mount(e));b.subscribe((e=>{e&&(e.setVisible(p.value),e.setReadonly(m.value),e.setDarkMode(this._darkMode$.value),this._sideEffect.add((()=>(e.onClick=()=>{m.value||p.setValue(!1)},()=>e.destroy())),"collect-onClick"))})),m.subscribe((e=>{var t;return null==(t=b.value)?void 0:t.setReadonly(e)})),this._darkMode$.subscribe((e=>{var t;null==(t=b.value)||t.setDarkMode(e)}));const T=()=>{var e;if(null==(e=b.value)?void 0:e.$collector){const{x:e,y:t,width:i,height:s}=b.value.$collector.getBoundingClientRect(),r=this.root.getBoundingClientRect();return{x:e-r.x,y:t-r.y,width:i,height:s}}},B=c(p.value?T():void 0);B.subscribe(((e,t,i)=>{this.boxes.forEach((t=>{t.setCollectorRect(e,i)}))})),p.subscribe(((e,t,i)=>{var s,r;null==(s=b.value)||s.setVisible(e),e&&(null==(r=b.value)?void 0:r.$collector)&&B.setValue(T()),this.boxes.forEach((t=>t.setMinimized(e,i))),i||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Minimized,e)}));const y=this.wrapClassName("titlebar-icon-close"),w=e=>{var t;if(m.value)return;const i=e.target;if(i.tagName)for(let s=i;s;s=s.parentElement){if(s.classList&&s.classList.contains(y))return;const e=null==(t=s.dataset)?void 0:t.teleBoxID;if(e){const t=this.getBox(e);if(t)return this.focusBox(t),void this.makeBoxTop(t)}}};this._sideEffect.addEventListener(window,"mousedown",w,!0),this._sideEffect.addEventListener(window,"touchstart",w,!0),this.maxTitleBar=new mt({darkMode:this.darkMode,readonly:m.value,namespace:this.namespace,state:x.value,boxes:this.boxes$.value,containerRect:g.value,onEvent:e=>{switch(e.type){case exports.TELE_BOX_DELEGATE_EVENT.Maximize:v.setValue(!v.value);break;case exports.TELE_BOX_DELEGATE_EVENT.Minimize:p.setValue(!0);break;case exports.TELE_BOX_EVENT.Close:this.removeTopBox(),this.focusTopBox()}}}),m.subscribe((e=>this.maxTitleBar.setReadonly(e))),this._darkMode$.subscribe((e=>{this.maxTitleBar.setDarkMode(e)})),this.boxes$.reaction((e=>{this.maxTitleBar.setBoxes(e)}));Fe(this,{prefersColorScheme:E,containerRect:g,collector:b,collectorRect:B,readonly:m,fence:_,minimized:p,maximized:v}),this._state$=x,this.root.appendChild(this.maxTitleBar.render())}get boxes(){return this.boxes$.value}get topBox(){return this.topBox$.value}get darkMode(){return this._darkMode$.value}get state(){return this._state$.value}setState(e,t=!1){switch(e){case exports.TELE_BOX_STATE.Maximized:this.setMinimized(!1,t),this.setMaximized(!0,t);break;case exports.TELE_BOX_STATE.Minimized:this.setMinimized(!0,t),this.setMaximized(!1,t);break;default:this.setMinimized(!1,t),this.setMaximized(!1,t)}return this}create(e={},t=!0){const i=new ct(l(a({zIndex:this.topBox?this.topBox.zIndex+1:100},t?this.smartPosition(e):e),{darkMode:this.darkMode,prefersColorScheme:this.prefersColorScheme,maximized:this.maximized,minimized:this.minimized,fence:this.fence,namespace:this.namespace,containerRect:this.containerRect,readonly:this.readonly,collectorRect:this.collectorRect}));return i.mount(this.root),i.focus&&(this.focusBox(i),t&&this.makeBoxTop(i)),this.boxes$.setValue([...this.boxes,i]),i._delegateEvents.on(exports.TELE_BOX_DELEGATE_EVENT.Maximize,(()=>{this.setMaximized(!this.maximized)})),i._delegateEvents.on(exports.TELE_BOX_DELEGATE_EVENT.Minimize,(()=>{this.setMinimized(!0)})),i._delegateEvents.on(exports.TELE_BOX_DELEGATE_EVENT.Close,(()=>{this.remove(i),this.focusTopBox()})),i._coord$.reaction(((e,t,s)=>{s||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Move,i)})),i._size$.reaction(((e,t,s)=>{s||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Resize,i)})),i._intrinsicCoord$.reaction(((e,t,s)=>{s||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.IntrinsicMove,i)})),i._intrinsicSize$.reaction(((e,t,s)=>{s||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.IntrinsicResize,i)})),i._visualSize$.reaction(((e,t,s)=>{s||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.VisualResize,i)})),i._zIndex$.reaction(((e,t,s)=>{if(this.boxes.length>0){const e=this.boxes.reduce(((e,t)=>e.zIndex>t.zIndex?e:t));this.topBox$.setValue(e)}s||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.ZIndex,i)})),this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Created,i),i}query(e){return e?this.boxes.filter(this.teleBoxMatcher(e)):[...this.boxes]}queryOne(e){return e?this.boxes.find(this.teleBoxMatcher(e)):this.boxes[0]}update(e,t,i=!1){const s=this.boxes.find((t=>t.id===e));if(s)return this.updateBox(s,t,i)}updateAll(e,t=!1){this.boxes.forEach((i=>{this.updateBox(i,e,t)}))}remove(e,t=!1){const i=this.getBoxIndex(e);if(i>=0){const e=this.boxes.slice(),s=e.splice(i,1);return this.boxes$.setValue(e),s.forEach((e=>e.destroy())),t||(this.boxes.length<=0&&(this.setMaximized(!1),this.setMinimized(!1)),this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Removed,s)),s[0]}}removeTopBox(){if(this.topBox)return this.remove(this.topBox)}removeAll(e=!1){const t=this.boxes$.value;return this.boxes$.setValue([]),t.forEach((e=>e.destroy())),e||(this.boxes.length<=0&&(this.setMaximized(!1),this.setMinimized(!1)),this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Removed,t)),t}destroy(e=!1){this.events.removeAllListeners(),this._sideEffect.flushAll(),this.removeAll(e),Object.keys(this).forEach((e=>{const t=this[e];t instanceof Ze&&t.destroy()}))}wrapClassName(e){return`${this.namespace}-${e}`}focusBox(e,t=!1){const i=this.getBox(e);i&&(this.boxes.forEach((e=>{if(i===e){let e=!1;i.focus||(e=!0,i.setFocus(!0,t)),e&&!t&&this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Focused,i)}else e.focus&&this.blurBox(e,t)})),this.maxTitleBar.focusBox(i))}focusTopBox(){if(this.topBox&&!this.topBox.focus)return this.focusBox(this.topBox)}blurBox(e,t=!1){const i=this.getBox(e);i&&(i.focus&&(i.setFocus(!1,t),t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Blurred,i)),this.maxTitleBar.focusedBox===i&&this.maxTitleBar.focusBox())}blurAll(e=!1){this.boxes.forEach((t=>{t.focus&&(t.setFocus(!1,e),e||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Blurred,t))})),this.maxTitleBar.focusedBox&&this.maxTitleBar.focusBox()}teleBoxMatcher(e){const t=Object.keys(e);return i=>t.every((t=>e[t]===i[t]))}updateBox(e,t,i=!1){null==t.x&&null==t.y||e.move(null==t.x?e.intrinsicX:t.x,null==t.y?e.intrinsicY:t.y,i),null==t.width&&null==t.height||e.resize(null==t.width?e.intrinsicWidth:t.width,null==t.height?e.intrinsicHeight:t.height,i),null!=t.title&&(e.setTitle(t.title),this.maxTitleBar.updateTitles()),null!=t.visible&&e.setVisible(t.visible,i),null!=t.minHeight&&e.setMinHeight(t.minHeight,i),null!=t.minWidth&&e.setMinWidth(t.minWidth,i),null!=t.resizable&&e.setResizable(t.resizable,i),null!=t.draggable&&e.setDraggable(t.draggable,i),null!=t.fixRatio&&e.setFixRatio(t.fixRatio,i),null!=t.zIndex&&e.setZIndex(t.zIndex,i),null!=t.content&&e.mountContent(t.content),null!=t.footer&&e.mountFooter(t.footer)}smartPosition(e={}){let{x:t,y:i}=e;const{width:s=.5,height:r=.5}=e;if(null==t){let e=20;this.topBox&&(e=this.topBox.intrinsicX*this.containerRect.width+20,e>this.containerRect.width-s*this.containerRect.width&&(e=20)),t=e/this.containerRect.width}if(null==i){let e=20;this.topBox&&(e=this.topBox.intrinsicY*this.containerRect.height+20,e>this.containerRect.height-r*this.containerRect.height&&(e=20)),i=e/this.containerRect.height}return l(a({},e),{x:t,y:i,width:s,height:r})}makeBoxTop(e,t=!1){this.topBox&&e!==this.topBox&&e.setZIndex(this.topBox.zIndex+1,t)}getBoxIndex(e){return"string"==typeof e?this.boxes.findIndex((t=>t.id===e)):this.boxes.findIndex((t=>t===e))}getBox(e){return"string"==typeof e?this.boxes.find((t=>t.id===e)):e}},exports.TeleBoxReact=e=>{const[t]=h.useState((()=>new ct(e)));return ut((()=>{null!=e.prefersColorScheme&&t.setPrefersColorScheme(e.prefersColorScheme)}),[t,e.prefersColorScheme]),ut((()=>{null!=e.minWidth&&t.setMinWidth(e.minWidth)}),[t,e.minWidth]),ut((()=>{null!=e.minHeight&&t.setMinHeight(e.minHeight)}),[t,e.minHeight]),ut((()=>{var i,s;t.resize(null!=(i=e.width)?i:t.width,null!=(s=e.height)?s:t.height,!0)}),[t,e.width,e.height]),ut((()=>{var i,s;t.move(null!=(i=e.x)?i:t.x,null!=(s=e.y)?s:t.y,!0)}),[t,e.x,e.y]),ut((()=>{null!=e.title&&t.setTitle(e.title)}),[t,e.title]),ut((()=>{null!=e.visible&&t.setVisible(e.visible)}),[t,e.visible]),ut((()=>{null!=e.minimized&&t.setMinimized(e.minimized,!0)}),[t,e.minimized]),ut((()=>{null!=e.maximized&&t.setMaximized(e.maximized,!0)}),[t,e.maximized]),ut((()=>{null!=e.state&&t.setState(e.state,!0)}),[t,e.state]),ut((()=>{null!=e.draggable&&t.setDraggable(e.draggable)}),[t,e.draggable]),ut((()=>{null!=e.resizable&&t.setResizable(e.resizable)}),[t,e.resizable]),ut((()=>{null!=e.fence&&t.setFence(e.fence)}),[t,e.fence]),ut((()=>{null!=e.containerRect&&t.setContainerRect(e.containerRect)}),[t,e.containerRect]),ut((()=>{null!=e.fixRatio&&t.setFixRatio(e.fixRatio)}),[t,e.fixRatio]),h.useEffect((()=>{if(e.onResize)return t.events.on(exports.TELE_BOX_EVENT.Resize,e.onResize),()=>{t.events.off(exports.TELE_BOX_EVENT.Resize,e.onResize)}}),[t,e.onResize]),h.useEffect((()=>{if(e.onMove)return t.events.on(exports.TELE_BOX_EVENT.Move,e.onMove),()=>{t.events.off(exports.TELE_BOX_EVENT.Move,e.onMove)}}),[t,e.onMove]),h.useEffect((()=>{if(e.onClose)return t.events.on(exports.TELE_BOX_EVENT.Close,e.onClose),()=>{t.events.off(exports.TELE_BOX_EVENT.Close,e.onClose)}}),[t,e.onClose]),h.useEffect((()=>{if(e.onFocus)return t.events.on(exports.TELE_BOX_EVENT.Focus,e.onFocus),()=>{t.events.off(exports.TELE_BOX_EVENT.Focus,e.onFocus)}}),[t,e.onFocus]),h.useEffect((()=>{if(e.onBlur)return t.events.on(exports.TELE_BOX_EVENT.Blur,e.onBlur),()=>{t.events.off(exports.TELE_BOX_EVENT.Blur,e.onBlur)}}),[t,e.onBlur]),h.useEffect((()=>{if(e.onStateChanged)return t.events.on(exports.TELE_BOX_EVENT.State,e.onStateChanged),()=>{t.events.off(exports.TELE_BOX_EVENT.State,e.onStateChanged)}}),[t,e.onStateChanged]),d.default.createElement("div",{ref:e=>e&&t.render(e),className:t.wrapClassName("box")})};
+"use strict";var e=Object.defineProperty,t=Object.defineProperties,s=Object.getOwnPropertyDescriptors,i=Object.getOwnPropertySymbols,a=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable,o=(t,s,i)=>s in t?e(t,s,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[s]=i,n=(e,t)=>{for(var s in t||(t={}))a.call(t,s)&&o(e,s,t[s]);if(i)for(var s of i(t))r.call(t,s)&&o(e,s,t[s]);return e};Object.defineProperty(exports,"__esModule",{value:!0}),exports[Symbol.toStringTag]="Module";var l=require("emittery"),h=require("stylefire"),d=require("shallowequal"),c=require("side-effect-manager"),E=require("value-enhancer"),m=require("@juggle/resize-observer");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x,p,_,g,f,b=u(l),$=u(h),v=u(d);exports.TELE_BOX_COLOR_SCHEME=void 0,(x=exports.TELE_BOX_COLOR_SCHEME||(exports.TELE_BOX_COLOR_SCHEME={})).Light="light",x.Dark="dark",x.Auto="auto",exports.TELE_BOX_STATE=void 0,(p=exports.TELE_BOX_STATE||(exports.TELE_BOX_STATE={})).Normal="normal",p.Minimized="minimized",p.Maximized="maximized",exports.TELE_BOX_EVENT=void 0,(_=exports.TELE_BOX_EVENT||(exports.TELE_BOX_EVENT={})).DarkMode="dark_mode",_.PrefersColorScheme="prefers_color_scheme",_.Close="close",_.Focus="focus",_.Blur="blur",_.IntrinsicMove="intrinsic_move",_.IntrinsicResize="intrinsic_resize",_.ZIndex="z_index",_.State="state",_.Minimized="minimized",_.Maximized="maximized",_.Readonly="readonly",_.Destroyed="destroyed",exports.TELE_BOX_DELEGATE_EVENT=void 0,(g=exports.TELE_BOX_DELEGATE_EVENT||(exports.TELE_BOX_DELEGATE_EVENT={})).Close="close",g.Maximize="maximize",g.Minimize="minimize",exports.TELE_BOX_RESIZE_HANDLE=void 0,(f=exports.TELE_BOX_RESIZE_HANDLE||(exports.TELE_BOX_RESIZE_HANDLE={})).North="n",f.South="s",f.West="w",f.East="e",f.NorthWest="nw",f.NorthEast="ne",f.SouthEast="se",f.SouthWest="sw";function w(e,t,s){return Math.min(Math.max(e,t),s)}function T(e){e.stopPropagation(),e.cancelable&&e.preventDefault()}function B(e){return e.touches?e.touches[0]:e}let N=1;function C(){return"New Box "+N++}function L(e){return Boolean(e)}function y(e){return!e}class z{constructor({readonly$:e,state$:t,title:s="",buttons:i,onEvent:a,onDragStart:r,namespace:o="telebox"}){this.sideEffect=new c.SideEffectManager,this.lastTitleBarClick={timestamp:0,clientX:-100,clientY:-100},this.handleTitleBarClick=e=>{var t;if(this.readonly$.value)return;if(0!==e.button)return;if(null==(t=e.target.dataset)?void 0:t.teleTitleBarNoDblClick)return;T(e);const s=Date.now();s-this.lastTitleBarClick.timestamp<=500?Math.abs(e.clientX-this.lastTitleBarClick.clientX)<=5&&Math.abs(e.clientY-this.lastTitleBarClick.clientY)<=5&&this.onEvent&&this.onEvent({type:exports.TELE_BOX_DELEGATE_EVENT.Maximize}):this.onDragStart&&this.onDragStart(e),this.lastTitleBarClick.timestamp=s,this.lastTitleBarClick.clientX=e.clientX,this.lastTitleBarClick.clientY=e.clientY},this.lastTitleBarTouch={timestamp:0,clientX:-100,clientY:-100},this.handleTitleBarTouch=e=>{var t;if(this.readonly$.value)return;if(null==(t=e.target.dataset)?void 0:t.teleTitleBarNoDblClick)return;T(e);const s=Date.now(),{clientX:i=this.lastTitleBarTouch.clientX+100,clientY:a=this.lastTitleBarTouch.clientY+100}=e.touches[0]||{};s-this.lastTitleBarTouch.timestamp<=500?Math.abs(i-this.lastTitleBarTouch.clientX)<=10&&Math.abs(a-this.lastTitleBarTouch.clientY)<=10&&this.onEvent&&this.onEvent({type:exports.TELE_BOX_DELEGATE_EVENT.Maximize}):this.onDragStart&&this.onDragStart(e),this.lastTitleBarTouch.timestamp=s,this.lastTitleBarTouch.clientX=i,this.lastTitleBarTouch.clientY=a},this.readonly$=e,this.state$=t,this.title$=new E.Val(s),this.onEvent=a,this.onDragStart=r,this.namespace=o,this.buttons=i||[{type:exports.TELE_BOX_DELEGATE_EVENT.Minimize,iconClassName:this.wrapClassName("titlebar-icon-minimize")},{type:exports.TELE_BOX_DELEGATE_EVENT.Maximize,iconClassName:this.wrapClassName("titlebar-icon-maximize"),isActive:e=>e===exports.TELE_BOX_STATE.Maximized},{type:exports.TELE_BOX_DELEGATE_EVENT.Close,iconClassName:this.wrapClassName("titlebar-icon-close")}],this.$dragArea=this.renderDragArea()}get title(){return this.title$.value}setTitle(e){this.title$.setValue(e)}render(){if(!this.$titleBar){this.$titleBar=document.createElement("div"),this.$titleBar.className=this.wrapClassName("titlebar");const e=document.createElement("div");e.className=this.wrapClassName("title-area"),e.dataset.teleBoxHandle="dh";const t=document.createElement("h1");t.className=this.wrapClassName("title"),t.dataset.teleBoxHandle="dh",e.appendChild(t),e.appendChild(this.$dragArea);const s=document.createElement("div");s.className=this.wrapClassName("titlebar-btns"),this.buttons.forEach((({iconClassName:e},t)=>{const i=String(t),a=document.createElement("button");a.className=`${this.wrapClassName("titlebar-btn")} ${e}`,a.dataset.teleTitleBarBtnIndex=i,a.dataset.teleTitleBarNoDblClick="true",s.appendChild(a)})),this.sideEffect.addDisposer(this.title$.subscribe((e=>{t.textContent=e,t.title=e})),"render-title"),this.sideEffect.addDisposer(this.state$.subscribe((e=>{this.buttons.forEach(((t,i)=>{var a;t.isActive&&(null==(a=s.children[i])||a.classList.toggle("is-active",t.isActive(e)))}))})),"render-state-btns"),this.sideEffect.addEventListener(s,"click",(e=>{var t;if(this.readonly$.value)return;const s=e.target,i=Number(null==(t=s.dataset)?void 0:t.teleTitleBarBtnIndex);if(!Number.isNaN(i)&&i<this.buttons.length){T(e);const t=this.buttons[i];this.onEvent&&this.onEvent({type:t.type,value:t.value})}}),{},"render-btns-container-click"),this.$titleBar.appendChild(e),this.$titleBar.appendChild(s)}return this.$titleBar}renderDragArea(){const e=document.createElement("div");return e.className=this.wrapClassName("drag-area"),e.dataset.teleBoxHandle="dh",this.sideEffect.addEventListener(e,"mousedown",this.handleTitleBarClick),this.sideEffect.addEventListener(e,"touchstart",this.handleTitleBarTouch,{passive:!0}),e}dragHandle(){return this.$titleBar}wrapClassName(e){return`${this.namespace}-${e}`}destroy(){this.sideEffect.flushAll(),this.$titleBar&&(this.$titleBar=void 0,this.onDragStart=void 0,this.onEvent=void 0)}}class S{constructor({namespace:e,rootRect$:t,ratio$:s,highlightStage$:i,root$:a}){this._sideEffect=new c.SideEffectManager,this.namespace=e,this.highlightStage$=i,this.stageRect$=E.combine([t,i,s],(([e,t,s])=>{if(!t)return e;if(s<=0||e.width<=0||e.height<=0)return e;const i=e.width*s;if(i===e.height)return e;if(i<e.height)return{x:0,y:(e.height-i)/2,width:e.width,height:i};const a=e.height/s;return{x:(e.width-a)/2,y:0,width:a,height:e.height}}),{compare:v.default}),this._sideEffect.addDisposer(E.combine([a,i]).subscribe((([e,t])=>{var s;e&&t?e.appendChild(this.render()):(null==(s=this.$boxStage)?void 0:s.parentNode)&&this.$boxStage.remove()})))}render(){if(this.$boxStage)return this.$boxStage;const e=document.createElement("div");e.className=this.wrapClassName("box-stage-container");const t=document.createElement("div");t.className=this.wrapClassName("box-stage-mask");const s=document.createElement("div");s.className=this.wrapClassName("box-stage-mask");const i=document.createElement("div");i.className=this.wrapClassName("box-stage-frame");const[a,r,o,n]=["M0 8V0h8v2H2v6H0Z","M8 8V0H0v2h6v6h2Z","M0 0v8h8V6H2V0H0Z","M8 0v8H0V6h6V0h2Z"].map(((e,t)=>{const s=document.createElementNS("http://www.w3.org/2000/svg","svg");s.setAttribute("viewBox","0 0 8 8"),s.setAttribute("class",`${this.wrapClassName("box-stage-frame-corner")} is-${t}`);const i=document.createElementNS("http://www.w3.org/2000/svg","path");return i.setAttribute("d",e),i.setAttribute("fill","#3381FF"),s.appendChild(i),s}));return i.appendChild(a),i.appendChild(o),i.appendChild(r),i.appendChild(n),e.appendChild(t),e.appendChild(i),e.appendChild(s),this._sideEffect.addDisposer(this.highlightStage$.subscribe((t=>{e.classList.toggle("is-active",t)}))),this._sideEffect.addDisposer(E.combine([this.highlightStage$,this.stageRect$]).subscribe((([i,a])=>{i&&(a.x>0?(e.style.flexDirection="row",t.style.width=`${a.x}px`,t.style.height="",s.style.width=`${a.x}px`,s.style.height=""):a.y>0&&(e.style.flexDirection="column",t.style.width="",t.style.height=`${a.y}px`,s.style.width="",s.style.height=`${a.y}px`))}))),this.$boxStage=e,e}destroy(){this._sideEffect.flushAll()}wrapClassName(e){return`${this.namespace}-${e}`}}const V=window.ResizeObserver||m.ResizeObserver;class M{constructor({id:e=c.genUID(),title:t=C(),namespace:s="telebox",visible:i=!0,width:a=.5,height:r=.5,minWidth:o=0,minHeight:n=0,x:l=.1,y:h=.1,resizable:d=!0,draggable:m=!0,ratio:u=-1,focus:x=!1,zIndex:p=100,titleBar:_,content:g,footer:f,styles:$,highlightStage:T=null,darkMode$:B,fence$:N,minimized$:L,maximized$:y,readonly$:V,root$:M,rootRect$:A,managerStageRect$:O,stageRatio$:R,collectorRect$:X,managerHighlightStage$:I}){this.events=new b.default,this._delegateEvents=new b.default,this.handleTrackStart=e=>{var t;return null==(t=this._handleTrackStart)?void 0:t.call(this,e)},this._sideEffect=new c.SideEffectManager,this.id=e,this.namespace=s;const D=new E.Val(t),k=new E.Val(i),H=new E.Val(d),G=new E.Val(m),Z=new E.Val(u),W=new E.Val(p),Y=new E.Val(x),P=new E.Val(g),j=new E.Val(f),F=new E.Val($),q=E.combine([L,y],(([e,t])=>e?exports.TELE_BOX_STATE.Minimized:t?exports.TELE_BOX_STATE.Maximized:exports.TELE_BOX_STATE.Normal)),J=new E.Val({width:w(o,0,1),height:w(n,0,1)},{compare:v.default}),Q=E.combine([J,O],(([e,t])=>({width:e.width*t.width,height:e.height*t.height})),{compare:v.default}),U=new E.Val({width:a,height:r},{compare:v.default});this._sideEffect.addDisposer(J.reaction(((e,t)=>{U.setValue({width:Math.max(a,e.width),height:Math.max(r,e.height)},t)})));const K=new E.Val({x:l,y:h},{compare:v.default}),ee=E.combine([U,O],(([e,t])=>({width:t.width*e.width,height:t.height*e.height})),{compare:v.default}),te=E.combine([K,O],(([e,t])=>({x:e.x*t.width+t.x,y:e.y*t.height+t.y})),{compare:v.default}),se=new E.Val(T),ie=E.combine([y,se,I],(([e,t,s])=>null===t?s&&e:t)),ae=new E.Val(null),re=new E.Val(A.value,{compare:v.default}),oe=new S({namespace:s,root$:ae,rootRect$:re,ratio$:R,highlightStage$:ie});this._sideEffect.addDisposer((()=>oe.destroy()));const ne={darkMode:B,fence:N,minimized:L,maximized:y,readonly:V,rootRect:A,managerStageRect:O,collectorRect:X,zIndex:W,focus:Y,$userContent:P,$userFooter:j,$userStyles:F,state:q,minSize:J,pxMinSize:Q,intrinsicSize:U,intrinsicCoord:K,pxIntrinsicSize:ee,pxIntrinsicCoord:te,highlightStage:ie,boxHighlightStage:se,contentRect:re,contentStageRect:oe.stageRect$};E.withReadonlyValueEnhancer(this,ne);const le={title:D,visible:k,resizable:H,draggable:G,ratio:Z};E.withValueEnhancer(this,le),this.titleBar=_||new z({readonly$:V,state$:q,title:D.value,namespace:this.namespace,onDragStart:e=>{var t;return null==(t=this._handleTrackStart)?void 0:t.call(this,e)},onEvent:e=>this._delegateEvents.emit(e.type)}),this._sideEffect.addDisposer(Z.subscribe((e=>{e>0&&this.transform(te.value.x,te.value.y,ee.value.width,ee.value.height,!0)}))),this._sideEffect.addDisposer(N.subscribe((e=>{e&&this.move(te.value.x,te.value.y,!0)}))),this.$box=this.render(),ae.setValue(this.$content.parentElement);const he=(e,t)=>{this._sideEffect.addDisposer(e.reaction(((e,s)=>{s||this.events.emit(t,e)})))};he(B,exports.TELE_BOX_EVENT.DarkMode),he(V,exports.TELE_BOX_EVENT.Readonly),he(W,exports.TELE_BOX_EVENT.ZIndex),he(L,exports.TELE_BOX_EVENT.Minimized),he(y,exports.TELE_BOX_EVENT.Maximized),he(q,exports.TELE_BOX_EVENT.State),he(U,exports.TELE_BOX_EVENT.IntrinsicResize),he(K,exports.TELE_BOX_EVENT.IntrinsicMove),this._sideEffect.addDisposer([k.reaction(((e,t)=>{t||e||this.events.emit(exports.TELE_BOX_EVENT.Close)})),Y.reaction(((e,t)=>{t||this.events.emit(e?exports.TELE_BOX_EVENT.Focus:exports.TELE_BOX_EVENT.Blur)})),M.subscribe((e=>{e?e.appendChild(this.$box):this.$box.parentNode&&this.$box.remove()}))])}get minWidth(){return this._minSize$.value.width}get minHeight(){return this._minSize$.value.height}setMinWidth(e,t=!1){this._minSize$.setValue({width:e,height:this.minHeight},t)}setMinHeight(e,t=!1){this._minSize$.setValue({width:this.minWidth,height:e},t)}resize(e,t,s=!1){this._intrinsicSize$.setValue({width:Math.max(e,this.minWidth),height:Math.max(t,this.minHeight)},s)}get intrinsicX(){return this._intrinsicCoord$.value.x}get intrinsicY(){return this._intrinsicCoord$.value.y}get intrinsicWidth(){return this._intrinsicSize$.value.width}get intrinsicHeight(){return this._intrinsicSize$.value.height}move(e,t,s=!1){let i,a;const r=this.managerStageRect,o=this.pxIntrinsicSize;if(this.fence)i=w(e,r.x,r.x+r.width-o.width),a=w(t,r.y,r.y+r.height-o.height);else{const s=this.rootRect;i=w(e,s.x-o.width+20,s.x+s.width-20),a=w(t,s.y,s.y+s.height-20)}this._intrinsicCoord$.setValue({x:(i-r.x)/r.width,y:(a-r.y)/r.height},s)}transform(e,t,s,i,a=!1){const r=this.managerStageRect,o=this.rootRect;if(s=Math.max(s,this.pxMinSize.width),i=Math.max(i,this.pxMinSize.height),this.ratio>0){const e=this.ratio*s;t!==this.pxIntrinsicCoord.y&&(t-=e-i),i=e}t<o.y&&(t=o.y,i=this.pxIntrinsicSize.height),this.move(e,t,a),this._intrinsicSize$.setValue({width:s/r.width,height:i/r.height},a)}mountContent(e){this._$userContent$.setValue(e)}unmountContent(){this._$userContent$.setValue(void 0)}mountFooter(e){this._$userFooter$.setValue(e)}unmountFooter(){this._$userFooter$.setValue(void 0)}getUserStyles(){return this.$userStyles}mountStyles(e){let t;"string"==typeof e?(t=document.createElement("style"),t.textContent=e):t=e,this._$userStyles$.setValue(t)}unmountStyles(){this._$userStyles$.setValue(void 0)}setHighlightStage(e){this._boxHighlightStage$.setValue(e)}render(){if(this.$box)return this.$box;this.$box=document.createElement("div"),this.$box.classList.add(this.wrapClassName("box"));const e=(e,t,s,i=L)=>this._sideEffect.add((()=>{const a=this.wrapClassName(s);return t.subscribe((t=>{e.classList.toggle(a,i(t))}))}));e(this.$box,this._readonly$,"readonly"),e(this.$box,this._draggable$,"no-drag",y),e(this.$box,this._resizable$,"no-resize",y),e(this.$box,this._focus$,"blur",y),e(this.$box,this._darkMode$,"color-scheme-dark"),e(this.$box,this._darkMode$,"color-scheme-light",y),this._sideEffect.add((()=>{const e=this.wrapClassName("minimized"),t=this.wrapClassName("maximized"),s="box-maximized-timer";return this._state$.subscribe((i=>{this.$box.classList.toggle(e,i===exports.TELE_BOX_STATE.Minimized),i===exports.TELE_BOX_STATE.Maximized?(this._sideEffect.flush(s),this.$box.classList.toggle(t,!0)):this._sideEffect.setTimeout((()=>{this.$box.classList.toggle(t,!1)}),0,s)}))})),this._sideEffect.addDisposer(this._visible$.subscribe((e=>{this.$box.style.display=e?"block":"none"}))),this._sideEffect.addDisposer(this._zIndex$.subscribe((e=>{this.$box.style.zIndex=String(e)}))),this.$box.dataset.teleBoxID=this.id;const t=$.default(this.$box),s=E.combine([this._maximized$,this._minimized$,this._pxIntrinsicSize$,this._pxIntrinsicCoord$,this._collectorRect$],(([e,t,s,i,a])=>t&&a?{x:a.x+a.width/2,y:a.y+a.height/2,width:s.width+"px",height:s.height+"px",scaleX:a.width/s.width,scaleY:a.height/s.height}:e?{x:0,y:0,width:"100%",height:"100%",scaleX:1,scaleY:1}:{x:i.x,y:i.y,width:s.width+"px",height:s.height+"px",scaleX:1,scaleY:1}),{compare:v.default}),i=s.value;this.$box.style.width=i.width,this.$box.style.height=i.height,this.$box.style.transform=`translate(${i.x-10}px,${i.y-10}px)`,this._sideEffect.addDisposer(s.subscribe((e=>{t.set(e)})));const a=document.createElement("div");a.className=this.wrapClassName("box-main"),this.$box.appendChild(a);const r=document.createElement("div");r.className=this.wrapClassName("titlebar-wrap"),r.appendChild(this.titleBar.render()),this.$titleBar=r;const o=document.createElement("div");o.className=this.wrapClassName("content-wrap");const n=document.createElement("div");n.className=this.wrapClassName("content")+" tele-fancy-scrollbar",this.$content=n,this._sideEffect.add((()=>{const e=new V((e=>{var t;const s=null==(t=e[0])?void 0:t.contentRect;s&&this._contentRect$.setValue({x:s.x,y:s.y,width:s.width,height:s.height})}));return e.observe(n),()=>e.disconnect()})),this._sideEffect.add((()=>{let e;return this._$userStyles$.subscribe((t=>{e&&e.remove(),e=t,t&&o.appendChild(t)}))})),this._sideEffect.add((()=>{let e;return this._$userContent$.subscribe((t=>{e&&e.remove(),e=t,t&&n.appendChild(t)}))})),o.appendChild(n);const l=document.createElement("div");return l.className=this.wrapClassName("footer-wrap"),this.$footer=l,this._sideEffect.add((()=>{let e;return this._$userFooter$.subscribe((t=>{e&&e.remove(),e=t,t&&l.appendChild(t)}))})),a.appendChild(r),a.appendChild(o),a.appendChild(l),this._renderResizeHandlers(),this.$box}_renderResizeHandlers(){const e=document.createElement("div");e.className=this.wrapClassName("resize-handles"),Object.values(exports.TELE_BOX_RESIZE_HANDLE).forEach((t=>{const s=document.createElement("div");s.className=this.wrapClassName(t)+" "+this.wrapClassName("resize-handle"),s.dataset.teleBoxHandle=t,e.appendChild(s)})),this.$box.appendChild(e);const t="handle-tracking-listener",s=this.wrapClassName("transforming");let i,a,r=0,o=0,n=0,l=0,h=0,d=0;const c=e=>{if(this.state!==exports.TELE_BOX_STATE.Normal)return;T(e);let{pageX:t,pageY:s}=B(e);s<this.rootRect.y&&(s=this.rootRect.y);const i=t-h,c=s-d;let{x:E,y:m}=this.pxIntrinsicCoord,{width:u,height:x}=this.pxIntrinsicSize;switch(a){case exports.TELE_BOX_RESIZE_HANDLE.North:m=o+c,x=l-c;break;case exports.TELE_BOX_RESIZE_HANDLE.South:x=l+c;break;case exports.TELE_BOX_RESIZE_HANDLE.West:E=r+i,u=n-i;break;case exports.TELE_BOX_RESIZE_HANDLE.East:u=n+i;break;case exports.TELE_BOX_RESIZE_HANDLE.NorthWest:E=r+i,m=o+c,u=n-i,x=l-c;break;case exports.TELE_BOX_RESIZE_HANDLE.NorthEast:m=o+c,u=n+i,x=l-c;break;case exports.TELE_BOX_RESIZE_HANDLE.SouthEast:u=n+i,x=l+c;break;case exports.TELE_BOX_RESIZE_HANDLE.SouthWest:E=r+i,u=n-i,x=l+c;break;default:return void this.move(r+i,o+c)}this.transform(E,m,u,x)},E=e=>{a=void 0,i&&(T(e),this.$box.classList.toggle(s,!1),this._sideEffect.flush(t),i.remove())},m=e=>{var m;if(this.readonly)return;if(null!=e.button&&0!==e.button)return;if(!this.draggable||a||this.state!==exports.TELE_BOX_STATE.Normal)return;const u=e.target;if(null==(m=u.dataset)?void 0:m.teleBoxHandle){T(e),({x:r,y:o}=this.pxIntrinsicCoord),({width:n,height:l}=this.pxIntrinsicSize),({pageX:h,pageY:d}=B(e)),a=u.dataset.teleBoxHandle,i||(i=document.createElement("div"));const m=a?this.wrapClassName(`cursor-${a}`):"";i.className=this.wrapClassName("track-mask"+(m?` ${m}`:"")),this.$box.appendChild(i),this.$box.classList.add(s),this._sideEffect.add((()=>(window.addEventListener("mousemove",c),window.addEventListener("touchmove",c,{passive:!1}),window.addEventListener("mouseup",E),window.addEventListener("touchend",E,{passive:!1}),window.addEventListener("touchcancel",E,{passive:!1}),()=>{window.removeEventListener("mousemove",c),window.removeEventListener("touchmove",c),window.removeEventListener("mouseup",E),window.removeEventListener("touchend",E),window.removeEventListener("touchcancel",E)})),t)}};this._handleTrackStart=m,this._sideEffect.addEventListener(e,"mousedown",m,{},"box-resizeHandles-mousedown"),this._sideEffect.addEventListener(e,"touchstart",m,{passive:!1},"box-resizeHandles-touchstart")}async destroy(){this.$box.remove(),this._sideEffect.flushAll(),this._sideEffect.flushAll(),await this.events.emit(exports.TELE_BOX_EVENT.Destroyed),this.events.clearListeners(),this._delegateEvents.clearListeners()}wrapClassName(e){return`${this.namespace}-${e}`}}var A;class O{constructor({minimized$:e,readonly$:t,darkMode$:s,rootRect$:i,namespace:a="telebox",styles:r={},root$:o}){this._sideEffect=new c.SideEffectManager,this.namespace=a;const n=new E.Val(void 0),l=e,h=new E.Val(r),d=new E.Val(document.createElement("button")),m={styles:h,el:d};E.withValueEnhancer(this,m);const u={rect:n,visible:l,root:o};E.withReadonlyValueEnhancer(this,u),d.value.className=this.wrapClassName("collector"),d.value.style.backgroundImage="url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOCAxNiI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxwYXRoIHN0cm9rZT0iIzdCODhBMCIgc3Ryb2tlLXdpZHRoPSIxLjQiIGQ9Ik0uNyAxLjJoMTYuNnYxMy42SC43eiIgLz4KICAgICAgICA8cGF0aCBmaWxsPSIjN0I4OEEwIiBkPSJNNCA1LjVoNnYxLjRINHpNNCA5LjVoMTB2MS40SDR6IiAvPgogICAgPC9nPgo8L3N2Zz4K')",this._sideEffect.addDisposer(d.subscribe((a=>{this._sideEffect.addEventListener(a,"click",(()=>{t.value||e.setValue(!1)}),{},"telebox-collector-click"),this._sideEffect.addDisposer([l.subscribe((e=>{a.classList.toggle(this.wrapClassName("collector-visible"),e)})),t.subscribe((e=>{a.classList.toggle(this.wrapClassName("collector-readonly"),e)})),s.subscribe((e=>{a.classList.toggle(this.wrapClassName("color-scheme-dark"),e),a.classList.toggle(this.wrapClassName("color-scheme-light"),!e)})),h.subscribe((e=>{Object.keys(e).forEach((t=>{const s=e[t];null!=s&&(a.style[t]=s)}))})),o.subscribe((e=>{e&&e.appendChild(a)})),E.combine([e,i,o]).subscribe((([e,t,s])=>{if(e&&s){const{x:e,y:s,width:i,height:r}=a.getBoundingClientRect();n.setValue({x:e-t.x,y:s-t.y,width:i,height:r})}}))],"telebox-collector-el")})))}destroy(){this._sideEffect.flushAll()}wrapClassName(e){return`${this.namespace}-${e}`}}exports.TELE_BOX_MANAGER_EVENT=void 0,(A=exports.TELE_BOX_MANAGER_EVENT||(exports.TELE_BOX_MANAGER_EVENT={})).Focused="focused",A.Blurred="blurred",A.Created="created",A.Removed="removed",A.State="state",A.Maximized="maximized",A.Minimized="minimized",A.IntrinsicMove="intrinsic_move",A.IntrinsicResize="intrinsic_resize",A.ZIndex="z_index",A.PrefersColorScheme="prefers_color_scheme",A.DarkMode="dark_mode";class R extends z{constructor(e){super(e),this.boxes$=e.boxes$,this.rootRect$=e.rootRect$,this.darkMode$=e.darkMode$,this.sideEffect.addDisposer(e.root$.subscribe((e=>{var t;e?e.appendChild(this.render()):(null==(t=this.$titleBar)?void 0:t.parentNode)&&this.$titleBar.remove()})))}focusBox(e){var t;if(!this.focusedBox||this.focusedBox!==e){if(this.$titles&&this.state$.value===exports.TELE_BOX_STATE.Maximized){const{children:s}=this.$titles.firstElementChild;for(let i=s.length-1;i>=0;i-=1){const a=s[i],r=null==(t=a.dataset)?void 0:t.teleBoxID;r&&(e&&r===e.id?a.classList.toggle(this.wrapClassName("titles-tab-focus"),!0):this.focusedBox&&r===this.focusedBox.id&&a.classList.toggle(this.wrapClassName("titles-tab-focus"),!1))}}this.focusedBox=e}}render(){if(this.$titleBar)return this.$titleBar;const e=super.render();e.classList.add(this.wrapClassName("max-titlebar")),this.sideEffect.addDisposer([this.rootRect$.subscribe((t=>{const{x:s,y:i,width:a}=t;e.style.transform=`translate(${s}px, ${i}px)`,e.style.width=a+"px"})),this.state$.subscribe((t=>{e.classList.toggle(this.wrapClassName("max-titlebar-maximized"),t===exports.TELE_BOX_STATE.Maximized)})),this.readonly$.subscribe((t=>{e.classList.toggle(this.wrapClassName("readonly"),t)})),this.darkMode$.subscribe((t=>{e.classList.toggle(this.wrapClassName("color-scheme-dark"),t),e.classList.toggle(this.wrapClassName("color-scheme-light"),!t)})),E.combine([this.state$,this.boxes$]).subscribe((([t,s])=>{t===exports.TELE_BOX_STATE.Maximized&&(e.classList.toggle(this.wrapClassName("max-titlebar-single-title"),1===s.length),1===s.length?this.setTitle(s[0].title):e.replaceChild(this.renderTitles(),e.firstElementChild))}))],"max-render");const t=document.createElement("div");return t.classList.add(this.wrapClassName("titles-area")),e.insertBefore(t,e.firstElementChild),e}destroy(){super.destroy(),this.$titles=void 0,this.focusedBox=void 0}renderTitles(){this.$titles=document.createElement("div"),this.$titles.className=this.wrapClassName("titles"),this.sideEffect.addEventListener(this.$titles,"wheel",(e=>{e.currentTarget.scrollBy({left:e.deltaY>0?250:-250,behavior:"smooth"})}),{passive:!1},"max-render-wheel-titles");const e=document.createElement("div");e.className=this.wrapClassName("titles-content"),this.$titles.appendChild(e);const t=this.boxes$.value.map((t=>{const s=document.createElement("button");return s.className=this.wrapClassName("titles-tab"),s.textContent=t.title,s.dataset.teleBoxID=t.id,s.dataset.teleTitleBarNoDblClick="true",this.focusedBox&&t.id===this.focusedBox.id&&s.classList.add(this.wrapClassName("titles-tab-focus")),e.appendChild(s),t._title$.reaction((e=>s.textContent=e))}));return this.sideEffect.addDisposer((()=>t.forEach((e=>e()))),"max-render-tab-titles"),this.$titles}}const X=window.ResizeObserver||m.ResizeObserver;exports.DefaultTitleBar=z,exports.TeleBox=M,exports.TeleBoxCollector=O,exports.TeleBoxDragHandleType="dh",exports.TeleBoxManager=class{constructor({root:e=null,prefersColorScheme:t=exports.TELE_BOX_COLOR_SCHEME.Light,minimized:s=!1,maximized:i=!1,fence:a=!1,collector:r,namespace:o="telebox",readonly:n=!1,stageRatio:l=-1,highlightStage:h=!0}={}){this.events=new b.default,this._sideEffect=new c.SideEffectManager,this.namespace=o;const d=new E.Val(e),m=new E.Val(n),u=new E.Val(s),x=new E.Val(i),p=new E.Val(a),_=new E.Val(l),g=new E.Val(h),f=new E.Val({x:0,y:0,width:window.innerWidth,height:window.innerHeight},{compare:v.default});this._sideEffect.addDisposer(d.subscribe((e=>{this._sideEffect.add((()=>{if(!e)return()=>{};const t=new X((e=>{var t;const s=null==(t=e[0])?void 0:t.contentRect;s&&f.setValue({x:s.x,y:s.y,width:s.width,height:s.height})}));return t.observe(e),()=>t.disconnect()}),"calc-root-rect")}))),this.boxes$=new E.Val([]),this.topBox$=new E.Val(void 0),this._sideEffect.addDisposer(this.boxes$.subscribe((e=>{if(e.length>0){const t=e.reduce(((e,t)=>e.zIndex>t.zIndex?e:t));this.topBox$.setValue(t)}else this.topBox$.setValue(void 0)})));const $=window.matchMedia("(prefers-color-scheme: dark)"),w=new E.Val(!1);$&&(w.setValue($.matches),this._sideEffect.add((()=>{const e=e=>{w.setValue(e.matches)};return $.addEventListener("change",e),()=>$.removeEventListener("change",e)})));const T=new E.Val(t);this._sideEffect.addDisposer(T.reaction(((e,t)=>{t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.PrefersColorScheme,e)})));const B=E.combine([w,T],(([e,t])=>"auto"===t?e:"dark"===t)),N=E.combine([u,x],(([e,t])=>e?exports.TELE_BOX_STATE.Minimized:t?exports.TELE_BOX_STATE.Maximized:exports.TELE_BOX_STATE.Normal));this.collector=null!=r?r:new O({minimized$:u,readonly$:m,darkMode$:B,namespace:o,root$:d,rootRect$:f});const C=new S({namespace:o,rootRect$:f,ratio$:_,root$:d,highlightStage$:E.combine([g,x],(([e,t])=>e&&!t))});this._sideEffect.addDisposer((()=>C.destroy()));const L={darkMode:B,state:N,root:d,rootRect:f,stageRect:C.stageRect$};E.withReadonlyValueEnhancer(this,L);const y={prefersColorScheme:T,readonly:m,fence:p,minimized:u,maximized:x,stageRatio:_,highlightStage:g};E.withValueEnhancer(this,y);const z=this.wrapClassName("titlebar-icon-close"),V=e=>{var t;if(m.value)return;const s=e.target;if(s.tagName)for(let i=s;i;i=i.parentElement){if(i.classList&&i.classList.contains(z))return;const e=null==(t=i.dataset)?void 0:t.teleBoxID;if(e){const t=this.getBox(e);if(t)return this.focusBox(t),void this.makeBoxTop(t)}}};this._sideEffect.addEventListener(window,"mousedown",V,!0),this._sideEffect.addEventListener(window,"touchstart",V,!0),this.titleBar=new R({namespace:this.namespace,boxes$:this.boxes$,darkMode$:B,readonly$:m,state$:N,root$:d,rootRect$:f,onEvent:e=>{switch(e.type){case exports.TELE_BOX_DELEGATE_EVENT.Maximize:x.setValue(!x.value);break;case exports.TELE_BOX_DELEGATE_EVENT.Minimize:u.setValue(!0);break;case exports.TELE_BOX_EVENT.Close:this.removeTopBox(),this.focusTopBox()}}}),this._sideEffect.addDisposer([N.reaction(((e,t)=>{t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.State,e)})),x.reaction(((e,t)=>{t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Maximized,e)})),u.reaction(((e,t)=>{t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Minimized,e)})),B.reaction(((e,t)=>{t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.DarkMode,e)}))])}get boxes(){return this.boxes$.value}get topBox(){return this.topBox$.value}setState(e,t=!1){switch(e){case exports.TELE_BOX_STATE.Maximized:this.setMinimized(!1,t),this.setMaximized(!0,t);break;case exports.TELE_BOX_STATE.Minimized:this.setMinimized(!0,t),this.setMaximized(!1,t);break;default:this.setMinimized(!1,t),this.setMaximized(!1,t)}return this}create(e={},i=!0){const a=new M((r=n(n({zIndex:this.topBox?this.topBox.zIndex+1:100},e),i?this.smartPosition(e):{}),o={namespace:this.namespace,root$:this._root$,darkMode$:this._darkMode$,maximized$:this._maximized$,minimized$:this._minimized$,fence$:this._fence$,rootRect$:this._rootRect$,managerStageRect$:this._stageRect$,stageRatio$:this._stageRatio$,readonly$:this._readonly$,collectorRect$:this.collector._rect$,managerHighlightStage$:this._highlightStage$},t(r,s(o))));var r,o;return a.focus&&(this.focusBox(a),i&&this.makeBoxTop(a)),this.boxes$.setValue([...this.boxes,a]),this._sideEffect.addDisposer([a._delegateEvents.on(exports.TELE_BOX_DELEGATE_EVENT.Maximize,(()=>{this.setMaximized(!this.maximized)})),a._delegateEvents.on(exports.TELE_BOX_DELEGATE_EVENT.Minimize,(()=>{this.setMinimized(!0)})),a._delegateEvents.on(exports.TELE_BOX_DELEGATE_EVENT.Close,(()=>{this.remove(a),this.focusTopBox()})),a._intrinsicCoord$.reaction(((e,t)=>{t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.IntrinsicMove,a)})),a._intrinsicSize$.reaction(((e,t)=>{t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.IntrinsicResize,a)})),a._zIndex$.reaction(((e,t)=>{if(this.boxes.length>0){const e=this.boxes.reduce(((e,t)=>e.zIndex>t.zIndex?e:t));this.topBox$.setValue(e)}t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.ZIndex,a)}))]),this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Created,a),a}query(e){return e?this.boxes.filter(this.teleBoxMatcher(e)):[...this.boxes]}queryOne(e){return e?this.boxes.find(this.teleBoxMatcher(e)):this.boxes[0]}update(e,t,s=!1){const i=this.boxes.find((t=>t.id===e));if(i)return this.updateBox(i,t,s)}updateAll(e,t=!1){this.boxes.forEach((s=>{this.updateBox(s,e,t)}))}remove(e,t=!1){const s=this.getBoxIndex(e);if(s>=0){const e=this.boxes.slice(),i=e.splice(s,1);return this.boxes$.setValue(e),i.forEach((e=>e.destroy())),t||(this.boxes.length<=0&&(this.setMaximized(!1),this.setMinimized(!1)),this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Removed,i)),i[0]}}removeTopBox(){if(this.topBox)return this.remove(this.topBox)}removeAll(e=!1){const t=this.boxes$.value;return this.boxes$.setValue([]),t.forEach((e=>e.destroy())),e||(this.boxes.length<=0&&(this.setMaximized(!1),this.setMinimized(!1)),this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Removed,t)),t}mount(e){this._root$.setValue(e)}unmount(){this._root$.setValue(null)}destroy(e=!1){this.events.clearListeners(),this._sideEffect.flushAll(),this.removeAll(e),this.collector.destroy(),this.titleBar.destroy()}wrapClassName(e){return`${this.namespace}-${e}`}focusBox(e,t=!1){const s=this.getBox(e);s&&(this.boxes.forEach((e=>{if(s===e){let e=!1;s.focus||(e=!0,s._focus$.setValue(!0,t)),e&&!t&&this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Focused,s)}else e.focus&&this.blurBox(e,t)})),this.titleBar.focusBox(s))}focusTopBox(){if(this.topBox&&!this.topBox.focus)return this.focusBox(this.topBox)}blurBox(e,t=!1){const s=this.getBox(e);s&&(s.focus&&(s._focus$.setValue(!1,t),t||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Blurred,s)),this.titleBar.focusedBox===s&&this.titleBar.focusBox())}blurAll(e=!1){this.boxes.forEach((t=>{t.focus&&(t._focus$.setValue(!1,e),e||this.events.emit(exports.TELE_BOX_MANAGER_EVENT.Blurred,t))})),this.titleBar.focusedBox&&this.titleBar.focusBox()}teleBoxMatcher(e){const t=Object.keys(e);return s=>t.every((t=>e[t]===s[t]))}updateBox(e,t,s=!1){var i,a,r,o,n,l;null==t.x&&null==t.y||e._intrinsicCoord$.setValue({x:null!=(i=t.x)?i:e.intrinsicX,y:null!=(a=t.y)?a:e.intrinsicY},s),null==t.width&&null==t.height||e._intrinsicSize$.setValue({width:null!=(r=t.width)?r:e.intrinsicWidth,height:null!=(o=t.height)?o:e.intrinsicHeight},s),null!=t.title&&e._title$.setValue(t.title),null!=t.visible&&e._visible$.setValue(t.visible,s),null!=t.resizable&&e._resizable$.setValue(t.resizable,s),null!=t.draggable&&e._draggable$.setValue(t.draggable,s),null!=t.ratio&&e._ratio$.setValue(t.ratio,s),null!=t.zIndex&&e._zIndex$.setValue(t.zIndex,s),null!=t.content&&e.mountContent(t.content),null!=t.footer&&e.mountFooter(t.footer),null==t.minHeight&&null==t.minWidth||e._minSize$.setValue({width:null!=(n=t.minWidth)?n:e.minWidth,height:null!=(l=t.minHeight)?l:e.minHeight},s)}smartPosition(e){let{x:t,y:s}=e;const{width:i=.5,height:a=.5}=e,r=this.stageRect,o=this.topBox;if(null==t){let e=r.x+20;if(o){const t=o.pxIntrinsicCoord.x+20;t+i*r.width<=r.x+r.width&&(e=t)}t=(e-r.x)/r.width}if(null==s){let e=r.y+20;if(o){const t=o.pxIntrinsicCoord.y+20;t+a*r.height<=r.y+r.height&&(e=t)}s=(e-r.y)/r.height}return{x:t,y:s,width:i,height:a}}makeBoxTop(e,t=!1){this.topBox&&e!==this.topBox&&e._zIndex$.setValue(this.topBox.zIndex+1,t)}getBoxIndex(e){return"string"==typeof e?this.boxes.findIndex((t=>t.id===e)):this.boxes.findIndex((t=>t===e))}getBox(e){return"string"==typeof e?this.boxes.find((t=>t.id===e)):e}};
 //# sourceMappingURL=telebox-insider.cjs.js.map