@netless/telebox-insider 1.0.0-alpha.18 → 1.0.0-alpha.19

package/dist/telebox-insider.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"telebox-insider.es.js","sources":["../src/TeleBox/constants.ts","../src/utils.ts","../src/TeleTitleBar/DefaultTitleBar/index.ts","../src/TeleStage/index.ts","../src/TeleBox/index.ts","../src/TeleBoxManager/constants.ts","../src/TeleBoxCollector/index.ts","../src/TeleBoxManager/MaxTitleBar/index.ts","../src/TeleBoxManager/index.ts"],"sourcesContent":["export enum TELE_BOX_COLOR_SCHEME {\n    Light = \"light\",\n    Dark = \"dark\",\n    Auto = \"auto\",\n}\n\nexport enum TELE_BOX_STATE {\n    Normal = \"normal\",\n    Minimized = \"minimized\",\n    Maximized = \"maximized\",\n}\n\nexport enum TELE_BOX_EVENT {\n    DarkMode = \"dark_mode\",\n    PrefersColorScheme = \"prefers_color_scheme\",\n    Close = \"close\",\n    Focus = \"focus\",\n    Blur = \"blur\",\n    IntrinsicMove = \"intrinsic_move\",\n    IntrinsicResize = \"intrinsic_resize\",\n    ZIndex = \"z_index\",\n    State = \"state\",\n    Minimized = \"minimized\",\n    Maximized = \"maximized\",\n    Readonly = \"readonly\",\n    Destroyed = \"destroyed\",\n}\n\nexport enum TELE_BOX_DELEGATE_EVENT {\n    Close = \"close\",\n    Maximize = \"maximize\",\n    Minimize = \"minimize\",\n}\n\nexport enum TELE_BOX_RESIZE_HANDLE {\n    North = \"n\",\n    South = \"s\",\n    West = \"w\",\n    East = \"e\",\n    NorthWest = \"nw\",\n    NorthEast = \"ne\",\n    SouthEast = \"se\",\n    SouthWest = \"sw\",\n}\n\nexport const TeleBoxDragHandleType = \"dh\";\n","export function clamp(value: number, min: number, max: number): number {\n    return Math.min(Math.max(value, min), max);\n}\n\nexport function preventEvent(ev: Event): void {\n    ev.stopPropagation();\n    if (ev.cancelable) {\n        ev.preventDefault();\n    }\n}\n\nexport function flattenEvent(ev: MouseEvent | TouchEvent): MouseEvent | Touch {\n    return (ev as TouchEvent).touches\n        ? (ev as TouchEvent).touches[0]\n        : (ev as MouseEvent);\n}\n\nexport function getRandomInt(min: number, max: number): number {\n    min = Math.ceil(min);\n    max = Math.floor(max);\n    return Math.floor(Math.random() * (max - min + 1)) + min;\n}\n\nlet defaultBoxCount = 1;\n\nexport function getBoxDefaultName(): string {\n    return `New Box ${defaultBoxCount++}`;\n}\n\nexport function identity<TValue>(value: TValue): TValue {\n    return value;\n}\n\nexport function isTruthy<TValue>(value: TValue): boolean {\n    return Boolean(value);\n}\n\nexport function isFalsy<TValue>(value: TValue): boolean {\n    return !value;\n}\n","import \"./style.scss\";\n\nimport { SideEffectManager } from \"side-effect-manager\";\n\nimport {\n    TeleBoxDragHandleType,\n    TELE_BOX_DELEGATE_EVENT,\n    TELE_BOX_STATE,\n} from \"../../TeleBox/constants\";\nimport type { TeleBoxState } from \"../../TeleBox/typings\";\nimport type {\n    TeleTitleBar,\n    TeleTitleBarConfig,\n    TeleTitleBarEvent,\n} from \"../typings\";\nimport { preventEvent } from \"../../utils\";\nimport type { ReadonlyVal } from \"value-enhancer\";\n\nexport type DefaultTitleBarButton = TeleTitleBarEvent & {\n    readonly iconClassName: string;\n    readonly isActive?: (state: TeleBoxState) => boolean;\n};\n\nexport interface DefaultTitleBarConfig extends TeleTitleBarConfig {\n    buttons?: ReadonlyArray<DefaultTitleBarButton>;\n}\n\nexport class DefaultTitleBar implements TeleTitleBar {\n    public constructor({\n        readonly$,\n        state$,\n        title$,\n        buttons,\n        onEvent,\n        onDragStart,\n        namespace = \"telebox\",\n    }: DefaultTitleBarConfig) {\n        this.readonly$ = readonly$;\n        this.state$ = state$;\n        this.title$ = title$;\n        this.onEvent = onEvent;\n        this.onDragStart = onDragStart;\n        this.namespace = namespace;\n\n        this.buttons = buttons || [\n            {\n                type: TELE_BOX_DELEGATE_EVENT.Minimize,\n                iconClassName: this.wrapClassName(\"titlebar-icon-minimize\"),\n            },\n            {\n                type: TELE_BOX_DELEGATE_EVENT.Maximize,\n                iconClassName: this.wrapClassName(\"titlebar-icon-maximize\"),\n                isActive: (state) => state === TELE_BOX_STATE.Maximized,\n            },\n            {\n                type: TELE_BOX_DELEGATE_EVENT.Close,\n                iconClassName: this.wrapClassName(\"titlebar-icon-close\"),\n            },\n        ];\n\n        this.$dragArea = this.renderDragArea();\n    }\n\n    public readonly namespace: string;\n\n    public $titleBar: HTMLElement | undefined;\n\n    public $dragArea: HTMLElement;\n\n    public render(): HTMLElement {\n        if (!this.$titleBar) {\n            this.$titleBar = document.createElement(\"div\");\n            this.$titleBar.className = this.wrapClassName(\"titlebar\");\n\n            const $titleArea = document.createElement(\"div\");\n            $titleArea.className = this.wrapClassName(\"title-area\");\n            $titleArea.dataset.teleBoxHandle = TeleBoxDragHandleType;\n\n            const $title = document.createElement(\"h1\");\n            $title.className = this.wrapClassName(\"title\");\n            $title.dataset.teleBoxHandle = TeleBoxDragHandleType;\n\n            $titleArea.appendChild($title);\n            $titleArea.appendChild(this.$dragArea);\n\n            const $buttonsContainer = document.createElement(\"div\");\n            $buttonsContainer.className = this.wrapClassName(\"titlebar-btns\");\n\n            this.buttons.forEach(({ iconClassName }, i) => {\n                const teleTitleBarBtnIndex = String(i);\n\n                const $btn = document.createElement(\"button\");\n                $btn.className = `${this.wrapClassName(\n                    \"titlebar-btn\"\n                )} ${iconClassName}`;\n                $btn.dataset.teleTitleBarBtnIndex = teleTitleBarBtnIndex;\n                $btn.dataset.teleTitleBarNoDblClick = \"true\";\n                $buttonsContainer.appendChild($btn);\n            });\n\n            this.sideEffect.addDisposer(\n                this.title$.subscribe((title) => {\n                    $title.textContent = title;\n                    $title.title = title;\n                }),\n                \"render-title\"\n            );\n\n            this.sideEffect.addDisposer(\n                this.state$.subscribe((state) => {\n                    this.buttons.forEach((btn, i) => {\n                        if (btn.isActive) {\n                            $buttonsContainer.children[i]?.classList.toggle(\n                                \"is-active\",\n                                btn.isActive(state)\n                            );\n                        }\n                    });\n                }),\n                \"render-state-btns\"\n            );\n\n            this.sideEffect.addEventListener(\n                $buttonsContainer,\n                \"click\",\n                (ev) => {\n                    if (this.readonly$.value) {\n                        return;\n                    }\n                    const target = ev.target as HTMLElement;\n                    const teleTitleBarBtnIndex = Number(\n                        target.dataset?.teleTitleBarBtnIndex\n                    );\n                    if (\n                        !Number.isNaN(teleTitleBarBtnIndex) &&\n                        teleTitleBarBtnIndex < this.buttons.length\n                    ) {\n                        preventEvent(ev);\n                        const btn = this.buttons[teleTitleBarBtnIndex];\n                        if (this.onEvent) {\n                            this.onEvent({\n                                type: btn.type,\n                                value: btn.value,\n                            } as TeleTitleBarEvent);\n                        }\n                    }\n                },\n                {},\n                \"render-btns-container-click\"\n            );\n\n            this.$titleBar.appendChild($titleArea);\n            this.$titleBar.appendChild($buttonsContainer);\n        }\n\n        return this.$titleBar;\n    }\n\n    public renderDragArea(): HTMLElement {\n        const $dragArea = document.createElement(\"div\");\n        $dragArea.className = this.wrapClassName(\"drag-area\");\n        $dragArea.dataset.teleBoxHandle = TeleBoxDragHandleType;\n        this.sideEffect.addEventListener(\n            $dragArea,\n            \"mousedown\",\n            this.handleTitleBarClick\n        );\n        this.sideEffect.addEventListener(\n            $dragArea,\n            \"touchstart\",\n            this.handleTitleBarTouch,\n            { passive: true }\n        );\n        return $dragArea;\n    }\n\n    public dragHandle(): HTMLElement | undefined {\n        return this.$titleBar;\n    }\n\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n\n    public destroy(): void {\n        this.sideEffect.flushAll();\n        if (this.$titleBar) {\n            this.$titleBar = void 0;\n            this.onDragStart = void 0;\n            this.onEvent = void 0;\n        }\n    }\n\n    public onEvent?: TeleTitleBarConfig[\"onEvent\"];\n\n    public onDragStart?: TeleTitleBarConfig[\"onDragStart\"];\n\n    protected readonly$: TeleTitleBarConfig[\"readonly$\"];\n\n    protected title$: ReadonlyVal<string>;\n\n    protected buttons: ReadonlyArray<DefaultTitleBarButton>;\n\n    protected state$: TeleTitleBarConfig[\"state$\"];\n\n    protected sideEffect = new SideEffectManager();\n\n    protected lastTitleBarClick = {\n        timestamp: 0,\n        clientX: -100,\n        clientY: -100,\n    };\n\n    protected handleTitleBarClick = (ev: MouseEvent): void => {\n        if (this.readonly$.value) {\n            return;\n        }\n\n        if (ev.button !== 0) {\n            return; // Not left mouse\n        }\n\n        if ((ev.target as HTMLElement).dataset?.teleTitleBarNoDblClick) {\n            return; // btns\n        }\n\n        preventEvent(ev);\n\n        const now = Date.now();\n        if (now - this.lastTitleBarClick.timestamp <= 500) {\n            if (\n                Math.abs(ev.clientX - this.lastTitleBarClick.clientX) <= 5 &&\n                Math.abs(ev.clientY - this.lastTitleBarClick.clientY) <= 5\n            ) {\n                // double click\n                if (this.onEvent) {\n                    this.onEvent({ type: TELE_BOX_DELEGATE_EVENT.Maximize });\n                }\n            }\n        } else if (this.onDragStart) {\n            this.onDragStart(ev);\n        }\n        this.lastTitleBarClick.timestamp = now;\n        this.lastTitleBarClick.clientX = ev.clientX;\n        this.lastTitleBarClick.clientY = ev.clientY;\n    };\n\n    protected lastTitleBarTouch = {\n        timestamp: 0,\n        clientX: -100,\n        clientY: -100,\n    };\n\n    protected handleTitleBarTouch = (ev: TouchEvent): void => {\n        if (this.readonly$.value) {\n            return;\n        }\n\n        if ((ev.target as HTMLElement).dataset?.teleTitleBarNoDblClick) {\n            return; // btns\n        }\n\n        preventEvent(ev);\n\n        const now = Date.now();\n        const {\n            clientX = this.lastTitleBarTouch.clientX + 100,\n            clientY = this.lastTitleBarTouch.clientY + 100,\n        } = ev.touches[0] || {};\n\n        if (now - this.lastTitleBarTouch.timestamp <= 500) {\n            if (\n                Math.abs(clientX - this.lastTitleBarTouch.clientX) <= 10 &&\n                Math.abs(clientY - this.lastTitleBarTouch.clientY) <= 10\n            ) {\n                // double click\n                if (this.onEvent) {\n                    this.onEvent({ type: TELE_BOX_DELEGATE_EVENT.Maximize });\n                }\n            }\n        } else if (this.onDragStart) {\n            this.onDragStart(ev);\n        }\n        this.lastTitleBarTouch.timestamp = now;\n        this.lastTitleBarTouch.clientX = clientX;\n        this.lastTitleBarTouch.clientY = clientY;\n    };\n}\n","import \"./style.scss\";\n\nimport shallowequal from \"shallowequal\";\nimport { SideEffectManager } from \"side-effect-manager\";\nimport type { ReadonlyVal } from \"value-enhancer\";\nimport { combine } from \"value-enhancer\";\nimport type { TeleBoxRect } from \"../TeleBox/typings\";\n\nexport interface TeleStageConfig {\n    namespace: string;\n    root$: ReadonlyVal<HTMLElement | null>;\n    rootRect$: ReadonlyVal<TeleBoxRect>;\n    ratio$: ReadonlyVal<number>;\n    highlightStage$: ReadonlyVal<boolean>;\n}\n\nexport class TeleStage {\n    private readonly _sideEffect = new SideEffectManager();\n\n    public readonly namespace: string;\n    public readonly stageRect$: ReadonlyVal<TeleBoxRect>;\n    public readonly highlightStage$: ReadonlyVal<boolean>;\n\n    public $boxStage?: HTMLDivElement;\n\n    constructor({\n        namespace,\n        rootRect$,\n        ratio$,\n        highlightStage$,\n        root$,\n    }: TeleStageConfig) {\n        this.namespace = namespace;\n        this.highlightStage$ = highlightStage$;\n\n        this.stageRect$ = combine(\n            [rootRect$, ratio$],\n            ([rootRect, ratio]) => {\n                if (ratio <= 0 || rootRect.width <= 0 || rootRect.height <= 0) {\n                    return rootRect;\n                }\n\n                const preferredHeight = rootRect.width * ratio;\n                if (preferredHeight === rootRect.height) {\n                    return rootRect;\n                }\n\n                if (preferredHeight < rootRect.height) {\n                    return {\n                        x: 0,\n                        y: (rootRect.height - preferredHeight) / 2,\n                        width: rootRect.width,\n                        height: preferredHeight,\n                    };\n                }\n\n                const preferredWidth = rootRect.height / ratio;\n                return {\n                    x: (rootRect.width - preferredWidth) / 2,\n                    y: 0,\n                    width: preferredWidth,\n                    height: rootRect.height,\n                };\n            },\n            { compare: shallowequal }\n        );\n\n        this._sideEffect.addDisposer(\n            combine([root$, highlightStage$]).subscribe(\n                ([root, highlightStage]) => {\n                    if (root && highlightStage) {\n                        root.appendChild(this.render());\n                    } else if (this.$boxStage?.parentNode) {\n                        this.$boxStage.remove();\n                    }\n                }\n            )\n        );\n    }\n\n    private render(): HTMLDivElement {\n        if (this.$boxStage) {\n            return this.$boxStage;\n        }\n\n        const $boxStage = document.createElement(\"div\");\n        $boxStage.className = this.wrapClassName(\"box-stage-container\");\n        const $boxStageMask1 = document.createElement(\"div\");\n        $boxStageMask1.className = this.wrapClassName(\"box-stage-mask\");\n        const $boxStageMask2 = document.createElement(\"div\");\n        $boxStageMask2.className = this.wrapClassName(\"box-stage-mask\");\n        const $boxStageFrame = document.createElement(\"div\");\n        $boxStageFrame.className = this.wrapClassName(\"box-stage-frame\");\n\n        const [\n            $topLeftCorner,\n            $topRightCorner,\n            $bottomLeftCorner,\n            $bottomRightCorner,\n        ] = [\n            \"M0 8V0h8v2H2v6H0Z\",\n            \"M8 8V0H0v2h6v6h2Z\",\n            \"M0 0v8h8V6H2V0H0Z\",\n            \"M8 0v8H0V6h6V0h2Z\",\n        ].map((path, i) => {\n            const $svg = document.createElementNS(\n                \"http://www.w3.org/2000/svg\",\n                \"svg\"\n            );\n            $svg.setAttribute(\"viewBox\", \"0 0 8 8\");\n            $svg.setAttribute(\n                \"class\",\n                `${this.wrapClassName(\"box-stage-frame-corner\")} is-${i}`\n            );\n            const $path = document.createElementNS(\n                \"http://www.w3.org/2000/svg\",\n                \"path\"\n            );\n            $path.setAttribute(\"d\", path);\n            $path.setAttribute(\"fill\", \"#3381FF\");\n            $svg.appendChild($path);\n            return $svg;\n        });\n\n        $boxStageFrame.appendChild($topLeftCorner);\n        $boxStageFrame.appendChild($bottomLeftCorner);\n        $boxStageFrame.appendChild($topRightCorner);\n        $boxStageFrame.appendChild($bottomRightCorner);\n\n        $boxStage.appendChild($boxStageMask1);\n        $boxStage.appendChild($boxStageFrame);\n        $boxStage.appendChild($boxStageMask2);\n\n        this._sideEffect.addDisposer(\n            this.highlightStage$.subscribe((highlightStage) => {\n                $boxStage.classList.toggle(\"is-active\", highlightStage);\n            })\n        );\n\n        this._sideEffect.addDisposer(\n            combine([this.highlightStage$, this.stageRect$]).subscribe(\n                ([highlightStage, stageRect]) => {\n                    if (!highlightStage) {\n                        return;\n                    }\n                    if (stageRect.x > 0) {\n                        $boxStage.style.flexDirection = \"row\";\n                        $boxStageMask1.style.width = `${stageRect.x}px`;\n                        $boxStageMask1.style.height = \"\";\n                        $boxStageMask2.style.width = `${stageRect.x}px`;\n                        $boxStageMask2.style.height = \"\";\n                    } else if (stageRect.y > 0) {\n                        $boxStage.style.flexDirection = \"column\";\n                        $boxStageMask1.style.width = \"\";\n                        $boxStageMask1.style.height = `${stageRect.y}px`;\n                        $boxStageMask2.style.width = \"\";\n                        $boxStageMask2.style.height = `${stageRect.y}px`;\n                    }\n                }\n            )\n        );\n\n        this.$boxStage = $boxStage;\n        return $boxStage;\n    }\n\n    public destroy(): void {\n        this._sideEffect.flushAll();\n    }\n\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n}\n","import \"./style.scss\";\n\nimport Emittery from \"emittery\";\nimport styler from \"stylefire\";\nimport shallowequal from \"shallowequal\";\nimport { genUID, SideEffectManager } from \"side-effect-manager\";\nimport type {\n    ReadonlyVal,\n    ReadonlyValEnhancedResult,\n    ValEnhancedResult,\n} from \"value-enhancer\";\nimport {\n    combine,\n    Val,\n    withReadonlyValueEnhancer,\n    withValueEnhancer,\n    ValManager,\n} from \"value-enhancer\";\nimport type { TeleTitleBar } from \"../TeleTitleBar\";\nimport { DefaultTitleBar } from \"../TeleTitleBar\";\nimport { ResizeObserver as ResizeObserverPolyfill } from \"@juggle/resize-observer\";\nimport {\n    clamp,\n    flattenEvent,\n    getBoxDefaultName,\n    isFalsy,\n    isTruthy,\n    preventEvent,\n} from \"../utils\";\nimport {\n    TELE_BOX_EVENT,\n    TELE_BOX_STATE,\n    TELE_BOX_RESIZE_HANDLE,\n} from \"./constants\";\nimport type {\n    TeleBoxConfig,\n    TeleBoxHandleType,\n    TeleBoxState,\n    TeleBoxCoord,\n    TeleBoxSize,\n    TeleBoxEventConfig,\n    TeleBoxEvent,\n    TeleBoxDelegateEventConfig,\n    TeleBoxRect,\n} from \"./typings\";\nimport { TeleStage } from \"../TeleStage\";\n\nexport * from \"./constants\";\nexport * from \"./typings\";\n\nconst ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n\ntype RequiredTeleBoxConfig = Required<TeleBoxConfig>;\n\ntype ValConfig = {\n    title: Val<RequiredTeleBoxConfig[\"title\"], boolean>;\n    visible: Val<RequiredTeleBoxConfig[\"visible\"], boolean>;\n    resizable: Val<RequiredTeleBoxConfig[\"resizable\"], boolean>;\n    draggable: Val<RequiredTeleBoxConfig[\"draggable\"], boolean>;\n    ratio: Val<RequiredTeleBoxConfig[\"ratio\"], boolean>;\n    stageRatio: Val<number | null>;\n};\n\ntype PropsValConfig = {\n    darkMode: RequiredTeleBoxConfig[\"darkMode$\"];\n    fence: RequiredTeleBoxConfig[\"fence$\"];\n    minimized: RequiredTeleBoxConfig[\"minimized$\"];\n    maximized: RequiredTeleBoxConfig[\"maximized$\"];\n    readonly: RequiredTeleBoxConfig[\"readonly$\"];\n    rootRect: RequiredTeleBoxConfig[\"rootRect$\"];\n    managerStageRect: RequiredTeleBoxConfig[\"managerStageRect$\"];\n    collectorRect: RequiredTeleBoxConfig[\"collectorRect$\"];\n};\n\ntype MyReadonlyValConfig = {\n    zIndex: Val<RequiredTeleBoxConfig[\"zIndex\"], boolean>;\n    focus: Val<RequiredTeleBoxConfig[\"focus\"], boolean>;\n\n    $userContent: Val<TeleBoxConfig[\"content\"], boolean>;\n    $userStage: Val<TeleBoxConfig[\"content\"], boolean>;\n    $userFooter: Val<TeleBoxConfig[\"footer\"], boolean>;\n    $userStyles: Val<TeleBoxConfig[\"styles\"], boolean>;\n\n    minSize: Val<TeleBoxSize, boolean>;\n    intrinsicSize: Val<TeleBoxSize, boolean>;\n    intrinsicCoord: Val<TeleBoxCoord, boolean>;\n    pxMinSize: ReadonlyVal<TeleBoxSize, boolean>;\n    pxIntrinsicSize: ReadonlyVal<TeleBoxSize, boolean>;\n    pxIntrinsicCoord: ReadonlyVal<TeleBoxCoord, boolean>;\n    state: ReadonlyVal<TeleBoxState, boolean>;\n    highlightStage: ReadonlyVal<boolean, boolean>;\n    boxHighlightStage: Val<boolean | null, boolean>;\n    contentRect: Val<TeleBoxRect>;\n    contentStageRect: ReadonlyVal<TeleBoxRect>;\n};\n\ntype CombinedValEnhancedResult = ReadonlyValEnhancedResult<\n    PropsValConfig & MyReadonlyValConfig\n> &\n    ValEnhancedResult<ValConfig>;\n\nexport interface TeleBox extends CombinedValEnhancedResult {}\n\nexport class TeleBox {\n    public constructor({\n        id = genUID(),\n        title = getBoxDefaultName(),\n        namespace = \"telebox\",\n        visible = true,\n        width = 0.5,\n        height = 0.5,\n        minWidth = 0,\n        minHeight = 0,\n        x = 0.1,\n        y = 0.1,\n        resizable = true,\n        draggable = true,\n        ratio = -1,\n        focus = false,\n        zIndex = 100,\n        stageRatio = null,\n        titleBar,\n        content,\n        stage,\n        footer,\n        styles,\n        highlightStage = null,\n        darkMode$,\n        fence$,\n        minimized$,\n        maximized$,\n        readonly$,\n        root$,\n        rootRect$,\n        managerStageRect$,\n        managerStageRatio$,\n        collectorRect$,\n        managerHighlightStage$,\n    }: TeleBoxConfig) {\n        this._sideEffect = new SideEffectManager();\n\n        this.id = id;\n        this.namespace = namespace;\n\n        const valManager = new ValManager();\n        this._sideEffect.addDisposer(() => valManager.destroy());\n\n        const title$ = new Val(title);\n        const visible$ = new Val(visible);\n        const resizable$ = new Val(resizable);\n        const draggable$ = new Val(draggable);\n        const ratio$ = new Val(ratio);\n        const zIndex$ = new Val(zIndex);\n        const focus$ = new Val(focus);\n        const $userContent$ = new Val(content);\n        const $userStage$ = new Val(stage);\n        const $userFooter$ = new Val(footer);\n        const $userStyles$ = new Val(styles);\n\n        const state$ = combine(\n            [minimized$, maximized$],\n            ([minimized, maximized]): TeleBoxState =>\n                minimized\n                    ? TELE_BOX_STATE.Minimized\n                    : maximized\n                    ? TELE_BOX_STATE.Maximized\n                    : TELE_BOX_STATE.Normal\n        );\n\n        const minSize$ = new Val(\n            {\n                width: clamp(minWidth, 0, 1),\n                height: clamp(minHeight, 0, 1),\n            },\n            { compare: shallowequal }\n        );\n\n        const pxMinSize$ = combine(\n            [minSize$, managerStageRect$],\n            ([minSize, managerStageRect]) => ({\n                width: minSize.width * managerStageRect.width,\n                height: minSize.height * managerStageRect.height,\n            }),\n            { compare: shallowequal }\n        );\n\n        const intrinsicSize$ = new Val(\n            { width, height },\n            { compare: shallowequal }\n        );\n\n        this._sideEffect.addDisposer(\n            // check intrinsicSize overflow\n            minSize$.reaction((minSize, skipUpdate) => {\n                intrinsicSize$.setValue(\n                    {\n                        width: Math.max(width, minSize.width),\n                        height: Math.max(height, minSize.height),\n                    },\n                    skipUpdate\n                );\n            })\n        );\n\n        const intrinsicCoord$ = new Val({ x, y }, { compare: shallowequal });\n\n        const pxIntrinsicSize$ = combine(\n            [intrinsicSize$, managerStageRect$],\n            ([size, managerStageRect]) => ({\n                width: managerStageRect.width * size.width,\n                height: managerStageRect.height * size.height,\n            }),\n            { compare: shallowequal }\n        );\n\n        const pxIntrinsicCoord$ = combine(\n            [intrinsicCoord$, managerStageRect$],\n            ([intrinsicCoord, managerStageRect]) => ({\n                x:\n                    intrinsicCoord.x * managerStageRect.width +\n                    managerStageRect.x,\n                y:\n                    intrinsicCoord.y * managerStageRect.height +\n                    managerStageRect.y,\n            }),\n            { compare: shallowequal }\n        );\n\n        const boxHighlightStage$ = new Val<boolean | null, boolean>(\n            highlightStage\n        );\n\n        const highlightStage$ = combine(\n            [boxHighlightStage$, managerHighlightStage$],\n            ([boxHighlightStage, managerHighlightStage]) =>\n                boxHighlightStage ?? managerHighlightStage\n        );\n\n        const contentRoot$ = new Val<HTMLElement | null>(null);\n\n        const contentRect$ = new Val<TeleBoxRect>(rootRect$.value, {\n            compare: shallowequal,\n        });\n\n        const stageRatio$ = new Val(stageRatio);\n\n        const teleStage = new TeleStage({\n            namespace,\n            root$: contentRoot$,\n            rootRect$: contentRect$,\n            ratio$: combine(\n                [stageRatio$, managerStageRatio$],\n                ([stageRatio, managerStageRatio]) =>\n                    stageRatio ?? managerStageRatio\n            ),\n            highlightStage$,\n        });\n        this._sideEffect.addDisposer(() => teleStage.destroy());\n\n        const propsValConfig: PropsValConfig = {\n            darkMode: darkMode$,\n            fence: fence$,\n            minimized: minimized$,\n            maximized: maximized$,\n            readonly: readonly$,\n            rootRect: rootRect$,\n            managerStageRect: managerStageRect$,\n            collectorRect: collectorRect$,\n        };\n\n        withReadonlyValueEnhancer(this, propsValConfig);\n\n        const myReadonlyValConfig: MyReadonlyValConfig = {\n            zIndex: zIndex$,\n            focus: focus$,\n\n            $userContent: $userContent$,\n            $userStage: $userStage$,\n            $userFooter: $userFooter$,\n            $userStyles: $userStyles$,\n\n            state: state$,\n            minSize: minSize$,\n            pxMinSize: pxMinSize$,\n            intrinsicSize: intrinsicSize$,\n            intrinsicCoord: intrinsicCoord$,\n            pxIntrinsicSize: pxIntrinsicSize$,\n            pxIntrinsicCoord: pxIntrinsicCoord$,\n            highlightStage: highlightStage$,\n            boxHighlightStage: boxHighlightStage$,\n            contentRect: contentRect$,\n            contentStageRect: teleStage.stageRect$,\n        };\n\n        withReadonlyValueEnhancer(this, myReadonlyValConfig, valManager);\n\n        const valConfig: ValConfig = {\n            title: title$,\n            visible: visible$,\n            resizable: resizable$,\n            draggable: draggable$,\n            ratio: ratio$,\n            stageRatio: stageRatio$,\n        };\n\n        withValueEnhancer(this, valConfig, valManager);\n\n        this.titleBar =\n            titleBar ||\n            new DefaultTitleBar({\n                readonly$: readonly$,\n                state$: state$,\n                title$: title$,\n                namespace: this.namespace,\n                onDragStart: (event) => this._handleTrackStart?.(event),\n                onEvent: (event) => this._delegateEvents.emit(event.type),\n            });\n\n        this._sideEffect.addDisposer(\n            ratio$.subscribe((ratio) => {\n                if (ratio > 0) {\n                    this.transform(\n                        pxIntrinsicCoord$.value.x,\n                        pxIntrinsicCoord$.value.y,\n                        pxIntrinsicSize$.value.width,\n                        pxIntrinsicSize$.value.height,\n                        true\n                    );\n                }\n            })\n        );\n\n        this._sideEffect.addDisposer(\n            fence$.subscribe((fence) => {\n                if (fence) {\n                    this.move(\n                        pxIntrinsicCoord$.value.x,\n                        pxIntrinsicCoord$.value.y,\n                        true\n                    );\n                }\n            })\n        );\n\n        this.$box = this.render();\n        contentRoot$.setValue(this.$content.parentElement);\n\n        const watchValEvent = <E extends TeleBoxEvent>(\n            val: ReadonlyVal<TeleBoxEventConfig[E], boolean>,\n            event: E\n        ) => {\n            this._sideEffect.addDisposer(\n                val.reaction((v, skipUpdate) => {\n                    if (!skipUpdate) {\n                        this.events.emit<any>(event, v);\n                    }\n                })\n            );\n        };\n\n        watchValEvent(darkMode$, TELE_BOX_EVENT.DarkMode);\n        watchValEvent(readonly$, TELE_BOX_EVENT.Readonly);\n        watchValEvent(zIndex$, TELE_BOX_EVENT.ZIndex);\n        watchValEvent(minimized$, TELE_BOX_EVENT.Minimized);\n        watchValEvent(maximized$, TELE_BOX_EVENT.Maximized);\n        watchValEvent(state$, TELE_BOX_EVENT.State);\n        watchValEvent(intrinsicSize$, TELE_BOX_EVENT.IntrinsicResize);\n        watchValEvent(intrinsicCoord$, TELE_BOX_EVENT.IntrinsicMove);\n\n        this._sideEffect.addDisposer([\n            visible$.reaction((visible, skipUpdate) => {\n                if (!skipUpdate && !visible) {\n                    this.events.emit(TELE_BOX_EVENT.Close);\n                }\n            }),\n            focus$.reaction((focus, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        focus ? TELE_BOX_EVENT.Focus : TELE_BOX_EVENT.Blur\n                    );\n                }\n            }),\n            root$.subscribe((root) => {\n                if (root) {\n                    root.appendChild(this.$box);\n                } else if (this.$box.parentNode) {\n                    this.$box.remove();\n                }\n            }),\n        ]);\n    }\n\n    public readonly id: string;\n\n    /** ClassName Prefix. For CSS styling. Default \"telebox\" */\n    public readonly namespace: string;\n\n    public readonly events = new Emittery<\n        TeleBoxEventConfig,\n        TeleBoxEventConfig\n    >();\n\n    public readonly _delegateEvents = new Emittery<\n        TeleBoxDelegateEventConfig,\n        TeleBoxDelegateEventConfig\n    >();\n\n    protected _sideEffect: SideEffectManager;\n\n    public titleBar: TeleTitleBar;\n\n    /** Minimum box width relative to stage area. 0~1. Default 0. */\n    public get minWidth(): number {\n        return this._minSize$.value.width;\n    }\n\n    /** Minimum box height relative to stage area. 0~1. Default 0. */\n    public get minHeight(): number {\n        return this._minSize$.value.height;\n    }\n\n    /**\n     * @param minWidth Minimum box width relative to stage area. 0~1.\n     * @returns this\n     */\n    public setMinWidth(minWidth: number, skipUpdate = false): void {\n        this._minSize$.setValue(\n            { width: minWidth, height: this.minHeight },\n            skipUpdate\n        );\n    }\n\n    /**\n     * @param minHeight Minimum box height relative to container element. 0~1.\n     * @returns this\n     */\n    public setMinHeight(minHeight: number, skipUpdate = false): void {\n        this._minSize$.setValue(\n            { width: this.minWidth, height: minHeight },\n            skipUpdate\n        );\n    }\n\n    /**\n     * Resize box.\n     * @param width Box width relative to container element. 0~1.\n     * @param height Box height relative to container element. 0~1.\n     * @param skipUpdate Skip emitting event.\n     * @returns this\n     */\n    public resize(width: number, height: number, skipUpdate = false): void {\n        this._intrinsicSize$.setValue(\n            {\n                width: Math.max(width, this.minWidth),\n                height: Math.max(height, this.minHeight),\n            },\n            skipUpdate\n        );\n    }\n\n    /** Intrinsic box x position relative to container element(without counting the effect of maximization or minimization). 0~1. Default 0.1. */\n    public get intrinsicX(): number {\n        return this._intrinsicCoord$.value.x;\n    }\n\n    /** Intrinsic box y position relative to container element(without counting the effect of maximization or minimization). 0~1. Default 0.1. */\n    public get intrinsicY(): number {\n        return this._intrinsicCoord$.value.y;\n    }\n\n    /** Intrinsic box width relative to container element(without counting the effect of maximization or minimization). 0~1. Default 0.1. */\n    public get intrinsicWidth(): number {\n        return this._intrinsicSize$.value.width;\n    }\n\n    /** Intrinsic box height relative to container element(without counting the effect of maximization or minimization). 0~1. Default 0.1. */\n    public get intrinsicHeight(): number {\n        return this._intrinsicSize$.value.height;\n    }\n\n    /**\n     * Move box position.\n     * @param x x position in px.\n     * @param y y position in px.\n     * @param skipUpdate Skip emitting event.\n     * @returns this\n     */\n    protected move(x: number, y: number, skipUpdate = false): void {\n        let safeX: number;\n        let safeY: number;\n        const managerStageRect = this.managerStageRect;\n        const pxIntrinsicSize = this.pxIntrinsicSize;\n\n        if (this.fence) {\n            safeX = clamp(\n                x,\n                managerStageRect.x,\n                managerStageRect.x +\n                    managerStageRect.width -\n                    pxIntrinsicSize.width\n            );\n            safeY = clamp(\n                y,\n                managerStageRect.y,\n                managerStageRect.y +\n                    managerStageRect.height -\n                    pxIntrinsicSize.height\n            );\n        } else {\n            const rootRect = this.rootRect;\n            safeX = clamp(\n                x,\n                0 - pxIntrinsicSize.width + 20,\n                0 + rootRect.width - 20\n            );\n            safeY = clamp(y, 0, 0 + rootRect.height - 20);\n        }\n\n        this._intrinsicCoord$.setValue(\n            {\n                x: (safeX - managerStageRect.x) / managerStageRect.width,\n                y: (safeY - managerStageRect.y) / managerStageRect.height,\n            },\n            skipUpdate\n        );\n    }\n\n    /**\n     * Resize + Move, with respect to fixed ratio.\n     * @param x x position in px.\n     * @param y y position in px.\n     * @param width Box width in px.\n     * @param height Box height in px.\n     * @param skipUpdate Skip emitting event.\n     * @returns this\n     */\n    protected transform(\n        x: number,\n        y: number,\n        width: number,\n        height: number,\n        skipUpdate = false\n    ): void {\n        const managerStageRect = this.managerStageRect;\n        const rootRect = this.rootRect;\n\n        width = Math.max(width, this.pxMinSize.width);\n        height = Math.max(height, this.pxMinSize.height);\n\n        if (this.ratio > 0) {\n            const newHeight = this.ratio * width;\n            if (y !== this.pxIntrinsicCoord.y) {\n                y -= newHeight - height;\n            }\n            height = newHeight;\n        }\n\n        if (y < rootRect.y) {\n            y = rootRect.y;\n            height = this.pxIntrinsicSize.height;\n        }\n\n        this.move(x, y, skipUpdate);\n        this._intrinsicSize$.setValue(\n            {\n                width: width / managerStageRect.width,\n                height: height / managerStageRect.height,\n            },\n            skipUpdate\n        );\n    }\n\n    /**\n     * Mount dom to box content.\n     */\n    public mountContent(content: HTMLElement): void {\n        this._$userContent$.setValue(content);\n    }\n\n    /**\n     * Unmount content from the box.\n     */\n    public unmountContent(): void {\n        this._$userContent$.setValue(undefined);\n    }\n\n    public mountStage(stage: HTMLElement): void {\n        this._$userStage$.setValue(stage);\n    }\n\n    /**\n     * Unmount content from the box.\n     */\n    public unmountStage(): void {\n        this._$userStage$.setValue(undefined);\n    }\n\n    /**\n     * Mount dom to box Footer.\n     */\n    public mountFooter(footer: HTMLElement): void {\n        this._$userFooter$.setValue(footer);\n    }\n\n    /**\n     * Unmount Footer from the box.\n     */\n    public unmountFooter(): void {\n        this._$userFooter$.setValue(undefined);\n    }\n\n    public getUserStyles(): HTMLStyleElement | undefined {\n        return this.$userStyles;\n    }\n\n    public mountStyles(styles: string | HTMLStyleElement): void {\n        let $styles: HTMLStyleElement;\n        if (typeof styles === \"string\") {\n            $styles = document.createElement(\"style\");\n            $styles.textContent = styles;\n        } else {\n            $styles = styles;\n        }\n        this._$userStyles$.setValue($styles);\n    }\n\n    public unmountStyles(): void {\n        this._$userStyles$.setValue(undefined);\n    }\n\n    /** Show stage frame and grey-out the non-stage area. Inherit setting from manager if null. */\n    public setHighlightStage(highlightStage: boolean | null): void {\n        this._boxHighlightStage$.setValue(highlightStage);\n    }\n\n    /** DOM of the box */\n    public $box: HTMLElement;\n\n    /** DOM of the box content */\n    public $content!: HTMLElement;\n\n    /** DOM of the box stage area */\n    public $stage?: HTMLElement;\n\n    /** DOM of the box title bar */\n    public $titleBar!: HTMLElement;\n\n    /** DOM of the box footer */\n    public $footer!: HTMLElement;\n\n    protected render(): HTMLElement {\n        if (this.$box) {\n            return this.$box;\n        }\n\n        this.$box = document.createElement(\"div\");\n\n        this.$box.classList.add(this.wrapClassName(\"box\"));\n\n        const bindClassName = <TValue>(\n            el: Element,\n            val: ReadonlyVal<TValue, boolean>,\n            className: string,\n            predicate: (value: TValue) => boolean = isTruthy\n        ): string => {\n            return this._sideEffect.add(() => {\n                const wrappedClassName = this.wrapClassName(className);\n                return val.subscribe((value) => {\n                    el.classList.toggle(wrappedClassName, predicate(value));\n                });\n            });\n        };\n\n        bindClassName(this.$box, this._readonly$, \"readonly\");\n        bindClassName(this.$box, this._draggable$, \"no-drag\", isFalsy);\n        bindClassName(this.$box, this._resizable$, \"no-resize\", isFalsy);\n        bindClassName(this.$box, this._focus$, \"blur\", isFalsy);\n        bindClassName(this.$box, this._darkMode$, \"color-scheme-dark\");\n        bindClassName(\n            this.$box,\n            this._darkMode$,\n            \"color-scheme-light\",\n            isFalsy\n        );\n\n        this._sideEffect.add(() => {\n            const minimizedClassName = this.wrapClassName(\"minimized\");\n            const maximizedClassName = this.wrapClassName(\"maximized\");\n            const MAXIMIZED_TIMER_ID = \"box-maximized-timer\";\n\n            return this._state$.subscribe((state) => {\n                this.$box.classList.toggle(\n                    minimizedClassName,\n                    state === TELE_BOX_STATE.Minimized\n                );\n\n                if (state === TELE_BOX_STATE.Maximized) {\n                    this._sideEffect.flush(MAXIMIZED_TIMER_ID);\n                    this.$box.classList.toggle(maximizedClassName, true);\n                } else {\n                    // delay so that transition won't be triggered\n                    this._sideEffect.setTimeout(\n                        () => {\n                            this.$box.classList.toggle(\n                                maximizedClassName,\n                                false\n                            );\n                        },\n                        0,\n                        MAXIMIZED_TIMER_ID\n                    );\n                }\n            });\n        });\n\n        this._sideEffect.addDisposer(\n            this._visible$.subscribe((visible) => {\n                this.$box.style.display = visible ? \"block\" : \"none\";\n            })\n        );\n\n        this._sideEffect.addDisposer(\n            this._zIndex$.subscribe((zIndex) => {\n                this.$box.style.zIndex = String(zIndex);\n            })\n        );\n\n        this.$box.dataset.teleBoxID = this.id;\n\n        const boxStyler = styler(this.$box);\n\n        const boxStyles$ = combine(\n            [\n                this._maximized$,\n                this._minimized$,\n                this._pxIntrinsicSize$,\n                this._pxIntrinsicCoord$,\n                this._collectorRect$,\n            ],\n            ([\n                maximized,\n                minimized,\n                pxIntrinsicSize,\n                pxIntrinsicCoord,\n                collectorRect,\n            ]) => {\n                const styles: {\n                    x: number;\n                    y: number;\n                    width: string;\n                    height: string;\n                    scaleX: number;\n                    scaleY: number;\n                } = maximized\n                    ? {\n                          x: 0,\n                          y: 0,\n                          width: \"100%\",\n                          height: \"100%\",\n                          scaleX: 1,\n                          scaleY: 1,\n                      }\n                    : {\n                          x: pxIntrinsicCoord.x,\n                          y: pxIntrinsicCoord.y,\n                          width: pxIntrinsicSize.width + \"px\",\n                          height: pxIntrinsicSize.height + \"px\",\n                          scaleX: 1,\n                          scaleY: 1,\n                      };\n                if (minimized && collectorRect) {\n                    const { width: boxWidth, height: boxHeight } = maximized\n                        ? this.rootRect\n                        : pxIntrinsicSize;\n                    styles.x =\n                        collectorRect.x -\n                        boxWidth / 2 +\n                        collectorRect.width / 2;\n                    styles.y =\n                        collectorRect.y -\n                        boxHeight / 2 +\n                        collectorRect.height / 2;\n                    styles.scaleX = collectorRect.width / boxWidth;\n                    styles.scaleY = collectorRect.height / boxHeight;\n                }\n                return styles;\n            },\n            { compare: shallowequal }\n        );\n\n        const boxStyles = boxStyles$.value;\n        this.$box.style.width = boxStyles.width;\n        this.$box.style.height = boxStyles.height;\n        // Add 10px offset on first frame\n        // which creates a subtle moving effect\n        this.$box.style.transform = `translate(${boxStyles.x - 10}px,${\n            boxStyles.y - 10\n        }px)`;\n\n        this._sideEffect.addDisposer(\n            boxStyles$.subscribe((styles) => {\n                boxStyler.set(styles);\n            })\n        );\n\n        const $boxMain = document.createElement(\"div\");\n        $boxMain.className = this.wrapClassName(\"box-main\");\n        this.$box.appendChild($boxMain);\n\n        const $titleBar = document.createElement(\"div\");\n        $titleBar.className = this.wrapClassName(\"titlebar-wrap\");\n        $titleBar.appendChild(this.titleBar.render());\n        this.$titleBar = $titleBar;\n\n        const $contentWrap = document.createElement(\"div\");\n        $contentWrap.className = this.wrapClassName(\"content-wrap\");\n\n        const $content = document.createElement(\"div\");\n        $content.className =\n            this.wrapClassName(\"content\") + \" tele-fancy-scrollbar\";\n        this.$content = $content;\n\n        const updateContentRect = (): void => {\n            const rect = $content.getBoundingClientRect();\n            this._contentRect$.setValue({\n                x: 0,\n                y: 0,\n                width: rect.width,\n                height: rect.height,\n            });\n        };\n        this._sideEffect.add(() => {\n            const observer = new ResizeObserver(() => {\n                if (!this.minimized) {\n                    updateContentRect();\n                }\n            });\n            observer.observe($content);\n            return () => observer.disconnect();\n        });\n        this._sideEffect.addDisposer(\n            this._minimized$.reaction((minimized) => {\n                // correct content size when restoring from minimized\n                if (!minimized) {\n                    this._sideEffect.setTimeout(\n                        updateContentRect,\n                        400,\n                        \"minimized-content-rect-fix\"\n                    );\n                }\n            })\n        );\n\n        this._sideEffect.add(() => {\n            let last$userStyles: HTMLStyleElement | undefined;\n            return this._$userStyles$.subscribe(($userStyles) => {\n                if (last$userStyles) {\n                    last$userStyles.remove();\n                }\n                last$userStyles = $userStyles;\n                if ($userStyles) {\n                    $contentWrap.appendChild($userStyles);\n                }\n            });\n        });\n\n        this._sideEffect.add(() => {\n            let last$userContent: HTMLElement | undefined;\n            return this._$userContent$.subscribe(($userContent) => {\n                if (last$userContent) {\n                    last$userContent.remove();\n                }\n                last$userContent = $userContent;\n                if ($userContent) {\n                    $content.appendChild($userContent);\n                }\n            });\n        });\n\n        this._sideEffect.add(() => {\n            let last$userStage: HTMLElement | undefined;\n            return this._$userStage$.subscribe(($userStage) => {\n                if (last$userStage) {\n                    last$userStage.remove();\n                }\n                last$userStage = $userStage;\n                if ($userStage) {\n                    if (!this.$stage) {\n                        const $stage = document.createElement(\"div\");\n                        this.$stage = $stage;\n                        $stage.className = this.wrapClassName(\"content-stage\");\n                        this._sideEffect.addDisposer(\n                            this._contentStageRect$.subscribe((rect) => {\n                                $stage.style.top = rect.y + \"px\";\n                                $stage.style.left = rect.x + \"px\";\n                                $stage.style.width = rect.width + \"px\";\n                                $stage.style.height = rect.height + \"px\";\n                            }),\n                            \"content-stage-rect\"\n                        );\n                        $content.appendChild($stage);\n                    }\n                    if (!this.$stage.parentElement) {\n                        $content.appendChild(this.$stage);\n                    }\n                    this.$stage.appendChild($userStage);\n                } else if (this.$stage?.parentElement) {\n                    this.$stage.remove();\n                }\n            });\n        });\n\n        $contentWrap.appendChild($content);\n\n        const $footer = document.createElement(\"div\");\n        $footer.className = this.wrapClassName(\"footer-wrap\");\n        this.$footer = $footer;\n\n        this._sideEffect.add(() => {\n            let last$userFooter: HTMLElement | undefined;\n            return this._$userFooter$.subscribe(($userFooter) => {\n                if (last$userFooter) {\n                    last$userFooter.remove();\n                }\n                last$userFooter = $userFooter;\n                if ($userFooter) {\n                    $footer.appendChild($userFooter);\n                }\n            });\n        });\n\n        $boxMain.appendChild($titleBar);\n        $boxMain.appendChild($contentWrap);\n        $boxMain.appendChild($footer);\n\n        this._renderResizeHandlers();\n\n        return this.$box;\n    }\n\n    protected _handleTrackStart?: (ev: MouseEvent | TouchEvent) => void;\n\n    public handleTrackStart: (ev: MouseEvent | TouchEvent) => void = (ev) => {\n        return this._handleTrackStart?.(ev);\n    };\n\n    protected _renderResizeHandlers(): void {\n        const $resizeHandles = document.createElement(\"div\");\n        $resizeHandles.className = this.wrapClassName(\"resize-handles\");\n\n        Object.values(TELE_BOX_RESIZE_HANDLE).forEach((handleType) => {\n            const $handle = document.createElement(\"div\");\n            $handle.className =\n                this.wrapClassName(handleType) +\n                \" \" +\n                this.wrapClassName(\"resize-handle\");\n            $handle.dataset.teleBoxHandle = handleType;\n\n            $resizeHandles.appendChild($handle);\n        });\n\n        this.$box.appendChild($resizeHandles);\n\n        const TRACKING_DISPOSER_ID = \"handle-tracking-listener\";\n        const transformingClassName = this.wrapClassName(\"transforming\");\n\n        let $trackMask: HTMLElement | undefined;\n\n        let trackStartX = 0;\n        let trackStartY = 0;\n\n        let trackStartWidth = 0;\n        let trackStartHeight = 0;\n\n        let trackStartPageX = 0;\n        let trackStartPageY = 0;\n\n        let trackingHandle: TeleBoxHandleType | undefined;\n\n        const handleTracking = (ev: MouseEvent | TouchEvent): void => {\n            if (this.state !== TELE_BOX_STATE.Normal) {\n                return;\n            }\n\n            preventEvent(ev);\n\n            let { pageX, pageY } = flattenEvent(ev);\n            if (pageY < this.rootRect.y) {\n                pageY = this.rootRect.y;\n            }\n\n            const offsetX = pageX - trackStartPageX;\n            const offsetY = pageY - trackStartPageY;\n\n            let { x: newX, y: newY } = this.pxIntrinsicCoord;\n            let { width: newWidth, height: newHeight } = this.pxIntrinsicSize;\n\n            switch (trackingHandle) {\n                case TELE_BOX_RESIZE_HANDLE.North: {\n                    newY = trackStartY + offsetY;\n                    newHeight = trackStartHeight - offsetY;\n                    break;\n                }\n                // eslint-disable-next-line no-fallthrough\n                case TELE_BOX_RESIZE_HANDLE.South: {\n                    newHeight = trackStartHeight + offsetY;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.West: {\n                    newX = trackStartX + offsetX;\n                    newWidth = trackStartWidth - offsetX;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.East: {\n                    newWidth = trackStartWidth + offsetX;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.NorthWest: {\n                    newX = trackStartX + offsetX;\n                    newY = trackStartY + offsetY;\n                    newWidth = trackStartWidth - offsetX;\n                    newHeight = trackStartHeight - offsetY;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.NorthEast: {\n                    newY = trackStartY + offsetY;\n                    newWidth = trackStartWidth + offsetX;\n                    newHeight = trackStartHeight - offsetY;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.SouthEast: {\n                    newWidth = trackStartWidth + offsetX;\n                    newHeight = trackStartHeight + offsetY;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.SouthWest: {\n                    newX = trackStartX + offsetX;\n                    newWidth = trackStartWidth - offsetX;\n                    newHeight = trackStartHeight + offsetY;\n                    break;\n                }\n                default: {\n                    this.move(trackStartX + offsetX, trackStartY + offsetY);\n                    return;\n                }\n            }\n\n            this.transform(newX, newY, newWidth, newHeight);\n        };\n\n        const handleTrackEnd = (ev: MouseEvent | TouchEvent): void => {\n            trackingHandle = void 0;\n\n            if (!$trackMask) {\n                return;\n            }\n\n            preventEvent(ev);\n\n            this.$box.classList.toggle(transformingClassName, false);\n\n            this._sideEffect.flush(TRACKING_DISPOSER_ID);\n\n            $trackMask.remove();\n        };\n\n        const handleTrackStart = (ev: MouseEvent | TouchEvent): void => {\n            if (this.readonly) {\n                return;\n            }\n\n            if (\n                (ev as MouseEvent).button != null &&\n                (ev as MouseEvent).button !== 0\n            ) {\n                // Not left mouse\n                return;\n            }\n\n            if (\n                !this.draggable ||\n                trackingHandle ||\n                this.state !== TELE_BOX_STATE.Normal\n            ) {\n                return;\n            }\n\n            const target = ev.target as HTMLElement;\n            if (target.dataset?.teleBoxHandle) {\n                preventEvent(ev);\n\n                ({ x: trackStartX, y: trackStartY } = this.pxIntrinsicCoord);\n                ({ width: trackStartWidth, height: trackStartHeight } =\n                    this.pxIntrinsicSize);\n\n                ({ pageX: trackStartPageX, pageY: trackStartPageY } =\n                    flattenEvent(ev));\n\n                trackingHandle = target.dataset\n                    .teleBoxHandle as TELE_BOX_RESIZE_HANDLE;\n\n                if (!$trackMask) {\n                    $trackMask = document.createElement(\"div\");\n                }\n\n                const cursor = trackingHandle\n                    ? this.wrapClassName(`cursor-${trackingHandle}`)\n                    : \"\";\n\n                $trackMask.className = this.wrapClassName(\n                    `track-mask${cursor ? ` ${cursor}` : \"\"}`\n                );\n\n                this.$box.appendChild($trackMask);\n\n                this.$box.classList.add(transformingClassName);\n\n                this._sideEffect.add(() => {\n                    window.addEventListener(\"mousemove\", handleTracking);\n                    window.addEventListener(\"touchmove\", handleTracking, {\n                        passive: false,\n                    });\n                    window.addEventListener(\"mouseup\", handleTrackEnd);\n                    window.addEventListener(\"touchend\", handleTrackEnd, {\n                        passive: false,\n                    });\n                    window.addEventListener(\"touchcancel\", handleTrackEnd, {\n                        passive: false,\n                    });\n\n                    return () => {\n                        window.removeEventListener(\"mousemove\", handleTracking);\n                        window.removeEventListener(\"touchmove\", handleTracking);\n                        window.removeEventListener(\"mouseup\", handleTrackEnd);\n                        window.removeEventListener(\"touchend\", handleTrackEnd);\n                        window.removeEventListener(\n                            \"touchcancel\",\n                            handleTrackEnd\n                        );\n                    };\n                }, TRACKING_DISPOSER_ID);\n            }\n        };\n\n        this._handleTrackStart = handleTrackStart;\n\n        this._sideEffect.addEventListener(\n            $resizeHandles,\n            \"mousedown\",\n            handleTrackStart,\n            {},\n            \"box-resizeHandles-mousedown\"\n        );\n\n        this._sideEffect.addEventListener(\n            $resizeHandles,\n            \"touchstart\",\n            handleTrackStart,\n            { passive: false },\n            \"box-resizeHandles-touchstart\"\n        );\n    }\n\n    public async destroy(): Promise<void> {\n        this.$box.remove();\n        this._sideEffect.flushAll();\n        this._sideEffect.flushAll();\n\n        await this.events.emit(TELE_BOX_EVENT.Destroyed);\n        this.events.clearListeners();\n        this._delegateEvents.clearListeners();\n    }\n\n    /**\n     * Wrap a className with namespace\n     */\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n}\n\ntype PropKeys<K = keyof TeleBox> = K extends keyof TeleBox\n    ? // eslint-disable-next-line @typescript-eslint/ban-types\n      TeleBox[K] extends Function\n        ? never\n        : K\n    : never;\n\nexport type ReadonlyTeleBox = Pick<\n    TeleBox,\n    | PropKeys\n    | \"wrapClassName\"\n    | \"mountContent\"\n    | \"unmountContent\"\n    | \"mountFooter\"\n    | \"unmountFooter\"\n    | \"mountStage\"\n    | \"unmountStage\"\n    | \"mountStyles\"\n    | \"unmountStyles\"\n    | \"setStageRatio\"\n    | \"setDraggable\"\n    | \"setResizable\"\n    | \"setHighlightStage\"\n    | \"setTitle\"\n    | \"setRatio\"\n    | \"setVisible\"\n    | \"handleTrackStart\"\n    | \"onValChanged\"\n>;\n","export enum TELE_BOX_MANAGER_EVENT {\n    Focused = \"focused\",\n    Blurred = \"blurred\",\n    Created = \"created\",\n    Removed = \"removed\",\n    State = \"state\",\n    Maximized = \"maximized\",\n    Minimized = \"minimized\",\n    IntrinsicMove = \"intrinsic_move\",\n    IntrinsicResize = \"intrinsic_resize\",\n    ZIndex = \"z_index\",\n    PrefersColorScheme = \"prefers_color_scheme\",\n    DarkMode = \"dark_mode\",\n}\n","import \"./style.scss\";\nimport collectorSVG from \"./icons/collector.svg\";\nimport type { TeleStyles } from \"../typings\";\nimport type {\n    ReadonlyVal,\n    ReadonlyValEnhancedResult,\n    ValEnhancedResult,\n} from \"value-enhancer\";\nimport { derive } from \"value-enhancer\";\nimport {\n    withValueEnhancer,\n    combine,\n    Val,\n    withReadonlyValueEnhancer,\n    ValManager,\n} from \"value-enhancer\";\nimport { SideEffectManager } from \"side-effect-manager\";\nimport type { TeleBoxRect } from \"../TeleBox/typings\";\n\nexport interface TeleBoxCollectorConfig {\n    namespace?: string;\n    styles?: TeleStyles;\n    root$: ReadonlyVal<HTMLElement | null>;\n    minimized$: Val<boolean>;\n    readonly$: ReadonlyVal<boolean>;\n    darkMode$: ReadonlyVal<boolean>;\n}\n\ntype ValConfig = {\n    styles: Val<TeleStyles>;\n    $collector: Val<HTMLElement>;\n};\n\ntype PropsValConfig = {\n    root: TeleBoxCollectorConfig[\"root$\"];\n};\n\ntype MyReadonlyValConfig = {\n    rect: ReadonlyVal<TeleBoxRect | undefined>;\n    visible: ReadonlyVal<boolean>;\n};\n\ntype CombinedValEnhancedResult = ValEnhancedResult<ValConfig> &\n    ReadonlyValEnhancedResult<PropsValConfig & MyReadonlyValConfig>;\n\nexport interface TeleBoxCollector extends CombinedValEnhancedResult {}\n\nexport class TeleBoxCollector {\n    public constructor({\n        minimized$,\n        readonly$,\n        darkMode$,\n        namespace = \"telebox\",\n        styles = {},\n        root$,\n    }: TeleBoxCollectorConfig) {\n        this.namespace = namespace;\n\n        const valManager = new ValManager();\n        this._sideEffect.addDisposer(() => valManager.destroy());\n\n        const rect$ = new Val<TeleBoxRect | undefined>(void 0);\n        const visible$ = derive(minimized$);\n        const styles$ = new Val(styles);\n        const el$ = new Val<HTMLElement>(document.createElement(\"button\"));\n\n        const valConfig: ValConfig = {\n            styles: styles$,\n            $collector: el$,\n        };\n\n        withValueEnhancer(this, valConfig, valManager);\n\n        const propsValConfig: PropsValConfig = {\n            root: root$,\n        };\n\n        withReadonlyValueEnhancer(this, propsValConfig);\n\n        const myReadonlyValConfig: MyReadonlyValConfig = {\n            rect: rect$,\n            visible: visible$,\n        };\n\n        withReadonlyValueEnhancer(this, myReadonlyValConfig, valManager);\n\n        el$.value.className = this.wrapClassName(\"collector\");\n        el$.value.style.backgroundImage = `url('${collectorSVG}')`;\n\n        this._sideEffect.addDisposer(\n            el$.subscribe(($collector) => {\n                this._sideEffect.addEventListener(\n                    $collector,\n                    \"click\",\n                    () => {\n                        if (!readonly$.value) {\n                            minimized$.setValue(false);\n                        }\n                    },\n                    {},\n                    \"telebox-collector-click\"\n                );\n\n                this._sideEffect.addDisposer(\n                    [\n                        visible$.subscribe((visible) => {\n                            $collector.classList.toggle(\n                                this.wrapClassName(\"collector-visible\"),\n                                visible\n                            );\n                        }),\n                        readonly$.subscribe((readonly) => {\n                            $collector.classList.toggle(\n                                this.wrapClassName(\"collector-readonly\"),\n                                readonly\n                            );\n                        }),\n                        darkMode$.subscribe((darkMode) => {\n                            $collector.classList.toggle(\n                                this.wrapClassName(\"color-scheme-dark\"),\n                                darkMode\n                            );\n                            $collector.classList.toggle(\n                                this.wrapClassName(\"color-scheme-light\"),\n                                !darkMode\n                            );\n                        }),\n                        styles$.subscribe((styles) => {\n                            Object.keys(styles).forEach((key) => {\n                                const value = styles[\n                                    key as keyof TeleStyles\n                                ] as string;\n                                if (value != null) {\n                                    $collector.style[key as keyof TeleStyles] =\n                                        value;\n                                }\n                            });\n                        }),\n                        root$.subscribe((root) => {\n                            if (root) {\n                                root.appendChild($collector);\n                            }\n                        }),\n                        // Place after $collector appended to the DOM so that rect calc works\n                        combine([minimized$, root$]).subscribe(\n                            ([minimized, root]) => {\n                                if (minimized && root) {\n                                    const { x, y, width, height } =\n                                        $collector.getBoundingClientRect();\n                                    const rootRect =\n                                        root.getBoundingClientRect();\n                                    rect$.setValue({\n                                        x: x - rootRect.x,\n                                        y: y - rootRect.y,\n                                        width,\n                                        height,\n                                    });\n                                }\n                            }\n                        ),\n                    ],\n                    \"telebox-collector-el\"\n                );\n            })\n        );\n    }\n\n    public readonly namespace: string;\n\n    protected readonly _sideEffect = new SideEffectManager();\n\n    public destroy(): void {\n        this._sideEffect.flushAll();\n    }\n\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n}\n","import \"./style.scss\";\n\nimport type { TeleBox } from \"../../TeleBox\";\nimport type { DefaultTitleBarConfig } from \"../../TeleTitleBar\";\nimport { DefaultTitleBar } from \"../../TeleTitleBar\";\nimport { TELE_BOX_STATE } from \"../../TeleBox/constants\";\nimport type { TeleBoxRect } from \"../../TeleBox/typings\";\nimport type { ReadonlyVal } from \"value-enhancer\";\nimport { combine } from \"value-enhancer\";\n\nexport type MaxTitleBarTitle = Pick<TeleBox, \"id\" | \"title\">;\n\nexport interface MaxTitleBarConfig extends DefaultTitleBarConfig {\n    darkMode$: ReadonlyVal<boolean>;\n    boxes$: ReadonlyVal<TeleBox[]>;\n    rootRect$: ReadonlyVal<TeleBoxRect>;\n    root$: ReadonlyVal<HTMLElement | null>;\n}\n\nexport class MaxTitleBar extends DefaultTitleBar {\n    public constructor(config: MaxTitleBarConfig) {\n        super(config);\n\n        this.boxes$ = config.boxes$;\n        this.rootRect$ = config.rootRect$;\n        this.darkMode$ = config.darkMode$;\n\n        this.sideEffect.addDisposer(\n            config.root$.subscribe((root) => {\n                if (root) {\n                    root.appendChild(this.render());\n                } else if (this.$titleBar?.parentNode) {\n                    this.$titleBar.remove();\n                }\n            })\n        );\n    }\n\n    public focusBox(box?: TeleBox): void {\n        if (this.focusedBox && this.focusedBox === box) {\n            return;\n        }\n\n        if (this.$titles && this.state$.value === TELE_BOX_STATE.Maximized) {\n            const { children } = this.$titles.firstElementChild as HTMLElement;\n            for (let i = children.length - 1; i >= 0; i -= 1) {\n                const $tab = children[i] as HTMLElement;\n                const id = $tab.dataset?.teleBoxID;\n                if (id) {\n                    if (box && id === box.id) {\n                        $tab.classList.toggle(\n                            this.wrapClassName(\"titles-tab-focus\"),\n                            true\n                        );\n                    } else if (this.focusedBox && id === this.focusedBox.id) {\n                        $tab.classList.toggle(\n                            this.wrapClassName(\"titles-tab-focus\"),\n                            false\n                        );\n                    }\n                }\n            }\n        }\n        this.focusedBox = box;\n    }\n\n    public render(): HTMLElement {\n        if (this.$titleBar) {\n            return this.$titleBar;\n        }\n\n        const $titleBar = super.render();\n\n        $titleBar.classList.add(this.wrapClassName(\"max-titlebar\"));\n\n        this.sideEffect.addDisposer(\n            [\n                this.state$.subscribe((state) => {\n                    $titleBar.classList.toggle(\n                        this.wrapClassName(\"max-titlebar-maximized\"),\n                        state === TELE_BOX_STATE.Maximized\n                    );\n                }),\n                this.readonly$.subscribe((readonly) => {\n                    $titleBar.classList.toggle(\n                        this.wrapClassName(\"readonly\"),\n                        readonly\n                    );\n                }),\n                this.darkMode$.subscribe((darkMode) => {\n                    $titleBar.classList.toggle(\n                        this.wrapClassName(\"color-scheme-dark\"),\n                        darkMode\n                    );\n                    $titleBar.classList.toggle(\n                        this.wrapClassName(\"color-scheme-light\"),\n                        !darkMode\n                    );\n                }),\n                combine([this.state$, this.boxes$]).subscribe(\n                    ([state, titles]) => {\n                        if (state === TELE_BOX_STATE.Maximized) {\n                            $titleBar.classList.toggle(\n                                this.wrapClassName(\"max-titlebar-single-title\"),\n                                titles.length === 1\n                            );\n                            if (titles.length !== 1) {\n                                $titleBar.replaceChild(\n                                    this.renderTitles(),\n                                    $titleBar.firstElementChild as HTMLElement\n                                );\n                            }\n                        }\n                    }\n                ),\n            ],\n            \"max-render\"\n        );\n\n        const $titlesArea = document.createElement(\"div\");\n        $titlesArea.classList.add(this.wrapClassName(\"titles-area\"));\n        $titleBar.insertBefore($titlesArea, $titleBar.firstElementChild);\n\n        return $titleBar;\n    }\n\n    public destroy(): void {\n        super.destroy();\n        this.$titles = void 0;\n        this.focusedBox = void 0;\n    }\n\n    protected renderTitles(): HTMLElement {\n        this.$titles = document.createElement(\"div\");\n        this.$titles.className = this.wrapClassName(\"titles\");\n\n        this.sideEffect.addEventListener(\n            this.$titles,\n            \"wheel\",\n            (ev) => {\n                (ev.currentTarget as HTMLElement).scrollBy({\n                    left: ev.deltaY > 0 ? 250 : -250,\n                    behavior: \"smooth\",\n                });\n            },\n            { passive: false },\n            \"max-render-wheel-titles\"\n        );\n\n        const $content = document.createElement(\"div\");\n        $content.className = this.wrapClassName(\"titles-content\");\n        this.$titles.appendChild($content);\n\n        const disposers = this.boxes$.value.map((box) => {\n            const $tab = document.createElement(\"button\");\n            $tab.className = this.wrapClassName(\"titles-tab\");\n            $tab.textContent = box.title;\n            $tab.dataset.teleBoxID = box.id;\n            $tab.dataset.teleTitleBarNoDblClick = \"true\";\n\n            if (this.focusedBox && box.id === this.focusedBox.id) {\n                $tab.classList.add(this.wrapClassName(\"titles-tab-focus\"));\n            }\n\n            $content.appendChild($tab);\n\n            return box._title$.reaction((title) => ($tab.textContent = title));\n        });\n\n        this.sideEffect.addDisposer(\n            () => disposers.forEach((disposer) => disposer()),\n            \"max-render-tab-titles\"\n        );\n\n        return this.$titles;\n    }\n\n    public focusedBox: TeleBox | undefined;\n\n    protected darkMode$: MaxTitleBarConfig[\"darkMode$\"];\n    protected boxes$: MaxTitleBarConfig[\"boxes$\"];\n    protected rootRect$: MaxTitleBarConfig[\"rootRect$\"];\n\n    protected $titles: HTMLElement | undefined;\n}\n","import shallowequal from \"shallowequal\";\nimport { ResizeObserver as ResizeObserverPolyfill } from \"@juggle/resize-observer\";\nimport { SideEffectManager } from \"side-effect-manager\";\nimport type {\n    ReadonlyVal,\n    ValEnhancedResult,\n    ReadonlyValEnhancedResult,\n} from \"value-enhancer\";\nimport { derive } from \"value-enhancer\";\nimport {\n    combine,\n    Val,\n    withValueEnhancer,\n    withReadonlyValueEnhancer,\n    ValManager,\n} from \"value-enhancer\";\nimport Emittery from \"emittery\";\nimport type {\n    ReadonlyTeleBox,\n    TeleBoxColorScheme,\n    TeleBoxRect,\n    TeleBoxState,\n} from \"../TeleBox\";\nimport {\n    TeleBox,\n    TELE_BOX_EVENT,\n    TELE_BOX_STATE,\n    TELE_BOX_COLOR_SCHEME,\n    TELE_BOX_DELEGATE_EVENT,\n} from \"../TeleBox\";\nimport { TeleBoxCollector } from \"../TeleBoxCollector\";\nimport { TELE_BOX_MANAGER_EVENT } from \"./constants\";\nimport type {\n    TeleBoxManagerConfig,\n    TeleBoxManagerCreateConfig,\n    TeleBoxManagerEventConfig,\n    TeleBoxManagerQueryConfig,\n    TeleBoxManagerUpdateConfig,\n} from \"./typings\";\nimport { MaxTitleBar } from \"./MaxTitleBar\";\nimport { TeleStage } from \"../TeleStage\";\n\nexport * from \"./typings\";\nexport * from \"./constants\";\n\nconst ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n\ntype ReadonlyValConfig = {\n    darkMode: ReadonlyVal<boolean, boolean>;\n    state: ReadonlyVal<TeleBoxState, boolean>;\n    root: Val<HTMLElement | null>;\n    rootRect: Val<TeleBoxRect>;\n    stageRect: ReadonlyVal<TeleBoxRect>;\n};\n\ntype ValConfig = {\n    prefersColorScheme: Val<TeleBoxColorScheme, boolean>;\n    readonly: Val<boolean, boolean>;\n    minimized: Val<boolean, boolean>;\n    maximized: Val<boolean, boolean>;\n    fence: Val<boolean, boolean>;\n    stageRatio: Val<number, boolean>;\n    highlightStage: Val<boolean, boolean>;\n};\n\ntype CombinedValEnhancedResult = ValEnhancedResult<ValConfig> &\n    ReadonlyValEnhancedResult<ReadonlyValConfig>;\n\nexport interface TeleBoxManager extends CombinedValEnhancedResult {}\n\nexport class TeleBoxManager {\n    public constructor({\n        root = null,\n        prefersColorScheme = TELE_BOX_COLOR_SCHEME.Light,\n        minimized = false,\n        maximized = false,\n        fence = false,\n        collector,\n        namespace = \"telebox\",\n        readonly = false,\n        stageRatio = -1,\n        highlightStage = true,\n    }: TeleBoxManagerConfig = {}) {\n        this._sideEffect = new SideEffectManager();\n\n        this.namespace = namespace;\n\n        const valManager = new ValManager();\n        this._sideEffect.addDisposer(() => valManager.destroy());\n\n        const root$ = new Val(root);\n        const readonly$ = new Val(readonly);\n        const minimized$ = new Val(minimized);\n        const maximized$ = new Val(maximized);\n        const fence$ = new Val(fence);\n        const stageRatio$ = new Val(stageRatio);\n        const highlightStage$ = new Val(highlightStage);\n\n        const rootRect$ = new Val<TeleBoxRect>(\n            {\n                x: 0,\n                y: 0,\n                width: window.innerWidth,\n                height: window.innerHeight,\n            },\n            { compare: shallowequal }\n        );\n        this._sideEffect.addDisposer(\n            root$.subscribe((root) => {\n                this._sideEffect.add(() => {\n                    if (!root) {\n                        return () => void 0;\n                    }\n                    const observer = new ResizeObserver(() => {\n                        const rect = root.getBoundingClientRect();\n                        rootRect$.setValue({\n                            x: 0,\n                            y: 0,\n                            width: rect.width,\n                            height: rect.height,\n                        });\n                    });\n                    observer.observe(root);\n                    return () => observer.disconnect();\n                }, \"calc-root-rect\");\n            })\n        );\n\n        this.boxes$ = new Val<TeleBox[]>([]);\n        this.topBox$ = new Val<TeleBox | undefined>(undefined);\n        this._sideEffect.addDisposer(\n            this.boxes$.subscribe((boxes) => {\n                if (boxes.length > 0) {\n                    const topBox = boxes.reduce((topBox, box) =>\n                        topBox.zIndex > box.zIndex ? topBox : box\n                    );\n                    this.topBox$.setValue(topBox);\n                } else {\n                    this.topBox$.setValue(undefined);\n                }\n            })\n        );\n\n        const prefersDarkMatch = window.matchMedia(\n            \"(prefers-color-scheme: dark)\"\n        );\n        const prefersDark$ = new Val(false);\n        if (prefersDarkMatch) {\n            prefersDark$.setValue(prefersDarkMatch.matches);\n            this._sideEffect.add(() => {\n                const handler = (evt: MediaQueryListEvent): void => {\n                    prefersDark$.setValue(evt.matches);\n                };\n                prefersDarkMatch.addEventListener(\"change\", handler);\n                return () =>\n                    prefersDarkMatch.removeEventListener(\"change\", handler);\n            });\n        }\n\n        const prefersColorScheme$ = new Val(prefersColorScheme);\n        this._sideEffect.addDisposer(\n            prefersColorScheme$.reaction((prefersColorScheme, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        TELE_BOX_MANAGER_EVENT.PrefersColorScheme,\n                        prefersColorScheme\n                    );\n                }\n            })\n        );\n\n        const darkMode$ = combine(\n            [prefersDark$, prefersColorScheme$],\n            ([prefersDark, prefersColorScheme]) =>\n                prefersColorScheme === \"auto\"\n                    ? prefersDark\n                    : prefersColorScheme === \"dark\"\n        );\n\n        const state$ = combine(\n            [minimized$, maximized$],\n            ([minimized, maximized]): TeleBoxState =>\n                minimized\n                    ? TELE_BOX_STATE.Minimized\n                    : maximized\n                    ? TELE_BOX_STATE.Maximized\n                    : TELE_BOX_STATE.Normal\n        );\n\n        this.collector =\n            collector ??\n            new TeleBoxCollector({\n                minimized$: minimized$,\n                readonly$: readonly$,\n                darkMode$: darkMode$,\n                namespace,\n                root$,\n            });\n\n        const teleStage = new TeleStage({\n            namespace,\n            rootRect$,\n            ratio$: stageRatio$,\n            root$,\n            highlightStage$: combine(\n                [highlightStage$, maximized$, minimized$],\n                ([highlightStage, maximized, minimized]) =>\n                    highlightStage && (minimized || !maximized)\n            ),\n        });\n        this._sideEffect.addDisposer(() => teleStage.destroy());\n\n        const readonlyValConfig: ReadonlyValConfig = {\n            darkMode: darkMode$,\n            state: state$,\n            root: root$,\n            rootRect: rootRect$,\n            stageRect: teleStage.stageRect$,\n        };\n\n        withReadonlyValueEnhancer(this, readonlyValConfig, valManager);\n\n        const valConfig: ValConfig = {\n            prefersColorScheme: prefersColorScheme$,\n            readonly: readonly$,\n            fence: fence$,\n            minimized: minimized$,\n            maximized: maximized$,\n            stageRatio: stageRatio$,\n            highlightStage: highlightStage$,\n        };\n\n        withValueEnhancer(this, valConfig, valManager);\n\n        const closeBtnClassName = this.wrapClassName(\"titlebar-icon-close\");\n\n        const checkFocusBox = (ev: MouseEvent | TouchEvent): void => {\n            if (readonly$.value) {\n                return;\n            }\n\n            const target = ev.target as HTMLElement;\n            if (!target.tagName) {\n                return;\n            }\n\n            for (\n                let el: HTMLElement | null = target;\n                el;\n                el = el.parentElement\n            ) {\n                if (el.classList && el.classList.contains(closeBtnClassName)) {\n                    return;\n                }\n                const id = el.dataset?.teleBoxID;\n                if (id) {\n                    const box = this.getBox(id);\n                    if (box) {\n                        this.focusBox(box);\n                        this.makeBoxTop(box);\n                        return;\n                    }\n                }\n            }\n        };\n\n        this._sideEffect.addEventListener(\n            window,\n            \"mousedown\",\n            checkFocusBox,\n            true\n        );\n        this._sideEffect.addEventListener(\n            window,\n            \"touchstart\",\n            checkFocusBox,\n            true\n        );\n\n        this.titleBar = new MaxTitleBar({\n            namespace: this.namespace,\n            title$: derive(this.topBox$, (topBox) => topBox?.title || \"\"),\n            boxes$: this.boxes$,\n            darkMode$: darkMode$,\n            readonly$: readonly$,\n            state$: state$,\n            root$,\n            rootRect$: rootRect$,\n            onEvent: (event): void => {\n                switch (event.type) {\n                    case TELE_BOX_DELEGATE_EVENT.Maximize: {\n                        maximized$.setValue(!maximized$.value);\n                        break;\n                    }\n                    case TELE_BOX_DELEGATE_EVENT.Minimize: {\n                        minimized$.setValue(true);\n                        break;\n                    }\n                    case TELE_BOX_EVENT.Close: {\n                        this.removeTopBox();\n                        this.focusTopBox();\n                        break;\n                    }\n                    default: {\n                        break;\n                    }\n                }\n            },\n        });\n\n        this._sideEffect.addDisposer([\n            state$.reaction((state, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.State, state);\n                }\n            }),\n            maximized$.reaction((maximized, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        TELE_BOX_MANAGER_EVENT.Maximized,\n                        maximized\n                    );\n                }\n            }),\n            minimized$.reaction((minimized, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        TELE_BOX_MANAGER_EVENT.Minimized,\n                        minimized\n                    );\n                }\n            }),\n            darkMode$.reaction((darkMode, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.DarkMode, darkMode);\n                }\n            }),\n        ]);\n    }\n\n    public get boxes(): ReadonlyArray<TeleBox> {\n        return this.boxes$.value;\n    }\n\n    public get topBox(): TeleBox | undefined {\n        return this.topBox$.value;\n    }\n\n    public readonly events = new Emittery<\n        TeleBoxManagerEventConfig,\n        TeleBoxManagerEventConfig\n    >();\n\n    protected _sideEffect: SideEffectManager;\n\n    public readonly namespace: string;\n\n    /** @deprecated use setMaximized and setMinimized instead */\n    public setState(state: TeleBoxState, skipUpdate = false): this {\n        switch (state) {\n            case TELE_BOX_STATE.Maximized: {\n                this.setMinimized(false, skipUpdate);\n                this.setMaximized(true, skipUpdate);\n                break;\n            }\n            case TELE_BOX_STATE.Minimized: {\n                this.setMinimized(true, skipUpdate);\n                this.setMaximized(false, skipUpdate);\n                break;\n            }\n            default: {\n                this.setMinimized(false, skipUpdate);\n                this.setMaximized(false, skipUpdate);\n                break;\n            }\n        }\n        return this;\n    }\n\n    public create(\n        config: TeleBoxManagerCreateConfig = {},\n        smartPosition = true\n    ): ReadonlyTeleBox {\n        const box = new TeleBox({\n            zIndex: this.topBox ? this.topBox.zIndex + 1 : 100,\n            ...config,\n            ...(smartPosition ? this.smartPosition(config) : {}),\n            namespace: this.namespace,\n            root$: this._root$,\n            darkMode$: this._darkMode$,\n            maximized$: this._maximized$,\n            minimized$: this._minimized$,\n            fence$: this._fence$,\n            rootRect$: this._rootRect$,\n            managerStageRect$: this._stageRect$,\n            managerStageRatio$: this._stageRatio$,\n            readonly$: this._readonly$,\n            collectorRect$: this.collector._rect$,\n            managerHighlightStage$: this._highlightStage$,\n        });\n\n        if (box.focus) {\n            this.focusBox(box);\n            if (smartPosition) {\n                this.makeBoxTop(box);\n            }\n        }\n\n        this.boxes$.setValue([...this.boxes, box]);\n\n        this._sideEffect.addDisposer([\n            box._delegateEvents.on(TELE_BOX_DELEGATE_EVENT.Maximize, () => {\n                this.setMaximized(!this.maximized);\n            }),\n            box._delegateEvents.on(TELE_BOX_DELEGATE_EVENT.Minimize, () => {\n                this.setMinimized(true);\n            }),\n            box._delegateEvents.on(TELE_BOX_DELEGATE_EVENT.Close, () => {\n                this.remove(box);\n                this.focusTopBox();\n            }),\n            box._intrinsicCoord$.reaction((_, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.IntrinsicMove, box);\n                }\n            }),\n            box._intrinsicSize$.reaction((_, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        TELE_BOX_MANAGER_EVENT.IntrinsicResize,\n                        box\n                    );\n                }\n            }),\n            box._zIndex$.reaction((_, skipUpdate) => {\n                if (this.boxes.length > 0) {\n                    const topBox = this.boxes.reduce((topBox, box) =>\n                        topBox.zIndex > box.zIndex ? topBox : box\n                    );\n                    this.topBox$.setValue(topBox);\n                }\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.ZIndex, box);\n                }\n            }),\n        ]);\n\n        this.events.emit(TELE_BOX_MANAGER_EVENT.Created, box);\n\n        return box;\n    }\n\n    public query(config?: TeleBoxManagerQueryConfig): ReadonlyTeleBox[] {\n        return config\n            ? this.boxes.filter(this.teleBoxMatcher(config))\n            : [...this.boxes];\n    }\n\n    public queryOne(\n        config?: TeleBoxManagerQueryConfig\n    ): ReadonlyTeleBox | undefined {\n        return config\n            ? this.boxes.find(this.teleBoxMatcher(config))\n            : this.boxes[0];\n    }\n\n    public update(\n        boxID: string,\n        config: TeleBoxManagerUpdateConfig,\n        skipUpdate = false\n    ): void {\n        const box = this.boxes.find((box) => box.id === boxID);\n        if (box) {\n            return this.updateBox(box, config, skipUpdate);\n        }\n    }\n\n    public updateAll(\n        config: TeleBoxManagerUpdateConfig,\n        skipUpdate = false\n    ): void {\n        this.boxes.forEach((box) => {\n            this.updateBox(box, config, skipUpdate);\n        });\n    }\n\n    public remove(\n        boxOrID: string | TeleBox,\n        skipUpdate = false\n    ): ReadonlyTeleBox | undefined {\n        const index = this.getBoxIndex(boxOrID);\n        if (index >= 0) {\n            const boxes = this.boxes.slice();\n            const deletedBoxes = boxes.splice(index, 1);\n            this.boxes$.setValue(boxes);\n            deletedBoxes.forEach((box) => box.destroy());\n            if (!skipUpdate) {\n                if (this.boxes.length <= 0) {\n                    this.setMaximized(false);\n                    this.setMinimized(false);\n                }\n                this.events.emit(TELE_BOX_MANAGER_EVENT.Removed, deletedBoxes);\n            }\n            return deletedBoxes[0];\n        }\n        return;\n    }\n\n    public removeTopBox(): ReadonlyTeleBox | undefined {\n        if (this.topBox) {\n            return this.remove(this.topBox);\n        }\n        return;\n    }\n\n    public removeAll(skipUpdate = false): ReadonlyTeleBox[] {\n        const deletedBoxes = this.boxes$.value;\n        this.boxes$.setValue([]);\n        deletedBoxes.forEach((box) => box.destroy());\n        if (!skipUpdate) {\n            if (this.boxes.length <= 0) {\n                this.setMaximized(false);\n                this.setMinimized(false);\n            }\n            this.events.emit(TELE_BOX_MANAGER_EVENT.Removed, deletedBoxes);\n        }\n        return deletedBoxes;\n    }\n\n    /**\n     * Mount manager to a container element.\n     */\n    public mount(root: HTMLElement): void {\n        this._root$.setValue(root);\n    }\n\n    /**\n     * Unmount manager from the container element.\n     */\n    public unmount(): void {\n        this._root$.setValue(null);\n    }\n\n    public destroy(skipUpdate = false): void {\n        this.events.clearListeners();\n        this._sideEffect.flushAll();\n        this.removeAll(skipUpdate);\n        this.collector.destroy();\n        this.titleBar.destroy();\n    }\n\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n\n    public focusBox(boxOrID: string | TeleBox, skipUpdate = false): void {\n        const targetBox = this.getBox(boxOrID);\n        if (targetBox) {\n            this.boxes.forEach((box) => {\n                if (targetBox === box) {\n                    let focusChanged = false;\n                    if (!targetBox.focus) {\n                        focusChanged = true;\n                        targetBox._focus$.setValue(true, skipUpdate);\n                    }\n                    if (focusChanged && !skipUpdate) {\n                        this.events.emit(\n                            TELE_BOX_MANAGER_EVENT.Focused,\n                            targetBox\n                        );\n                    }\n                } else if (box.focus) {\n                    this.blurBox(box, skipUpdate);\n                }\n            });\n            this.titleBar.focusBox(targetBox);\n        }\n    }\n\n    public focusTopBox(): void {\n        if (this.topBox && !this.topBox.focus) {\n            return this.focusBox(this.topBox);\n        }\n    }\n\n    public blurBox(boxOrID: string | TeleBox, skipUpdate = false): void {\n        const targetBox = this.getBox(boxOrID);\n        if (targetBox) {\n            if (targetBox.focus) {\n                targetBox._focus$.setValue(false, skipUpdate);\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.Blurred, targetBox);\n                }\n            }\n            if (this.titleBar.focusedBox === targetBox) {\n                this.titleBar.focusBox();\n            }\n        }\n    }\n\n    public blurAll(skipUpdate = false): void {\n        this.boxes.forEach((box) => {\n            if (box.focus) {\n                box._focus$.setValue(false, skipUpdate);\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.Blurred, box);\n                }\n            }\n        });\n        if (this.titleBar.focusedBox) {\n            this.titleBar.focusBox();\n        }\n    }\n\n    public collector: TeleBoxCollector;\n    public titleBar: MaxTitleBar;\n\n    protected boxes$: Val<TeleBox[]>;\n    protected topBox$: Val<TeleBox | undefined>;\n\n    protected teleBoxMatcher(\n        config: TeleBoxManagerQueryConfig\n    ): (box: TeleBox) => boolean {\n        const keys = Object.keys(config) as Array<\n            keyof TeleBoxManagerQueryConfig\n        >;\n        return (box: TeleBox): boolean =>\n            keys.every((key) => config[key] === box[key]);\n    }\n\n    protected updateBox(\n        box: TeleBox,\n        config: TeleBoxManagerUpdateConfig,\n        skipUpdate = false\n    ): void {\n        if (config.x != null || config.y != null) {\n            box._intrinsicCoord$.setValue(\n                {\n                    x: config.x ?? box.intrinsicX,\n                    y: config.y ?? box.intrinsicY,\n                },\n                skipUpdate\n            );\n        }\n        if (config.width != null || config.height != null) {\n            box._intrinsicSize$.setValue(\n                {\n                    width: config.width ?? box.intrinsicWidth,\n                    height: config.height ?? box.intrinsicHeight,\n                },\n                skipUpdate\n            );\n        }\n        if (config.title != null) {\n            box._title$.setValue(config.title);\n        }\n        if (config.visible != null) {\n            box._visible$.setValue(config.visible, skipUpdate);\n        }\n        if (config.resizable != null) {\n            box._resizable$.setValue(config.resizable, skipUpdate);\n        }\n        if (config.draggable != null) {\n            box._draggable$.setValue(config.draggable, skipUpdate);\n        }\n        if (config.ratio != null) {\n            box._ratio$.setValue(config.ratio, skipUpdate);\n        }\n        if (config.zIndex != null) {\n            box._zIndex$.setValue(config.zIndex, skipUpdate);\n        }\n        if (config.stageRatio !== undefined) {\n            box.setStageRatio(config.stageRatio, skipUpdate);\n        }\n        if (config.content != null) {\n            box.mountContent(config.content);\n        }\n        if (config.footer != null) {\n            box.mountFooter(config.footer);\n        }\n        if (config.minHeight != null || config.minWidth != null) {\n            box._minSize$.setValue(\n                {\n                    width: config.minWidth ?? box.minWidth,\n                    height: config.minHeight ?? box.minHeight,\n                },\n                skipUpdate\n            );\n        }\n    }\n\n    /** Keep new boxes staggered inside stage area */\n    protected smartPosition(rect: Partial<TeleBoxRect>): TeleBoxRect {\n        let { x, y } = rect;\n        const { width = 0.5, height = 0.5 } = rect;\n        const stageRect = this.stageRect;\n        const topBox = this.topBox;\n\n        if (x == null) {\n            let pxX = stageRect.x + 20;\n            if (topBox) {\n                const pxPreferredX = topBox.pxIntrinsicCoord.x + 20;\n                const pxIntrinsicWidth = width * stageRect.width;\n                if (\n                    pxPreferredX + pxIntrinsicWidth <=\n                    stageRect.x + stageRect.width\n                ) {\n                    pxX = pxPreferredX;\n                }\n            }\n            x = (pxX - stageRect.x) / stageRect.width;\n        }\n\n        if (y == null) {\n            let pxY = stageRect.y + 20;\n            if (topBox) {\n                const pxPreferredY = topBox.pxIntrinsicCoord.y + 20;\n                const pxIntrinsicHeight = height * stageRect.height;\n                if (\n                    pxPreferredY + pxIntrinsicHeight <=\n                    stageRect.y + stageRect.height\n                ) {\n                    pxY = pxPreferredY;\n                }\n            }\n            y = (pxY - stageRect.y) / stageRect.height;\n        }\n\n        return { x, y, width, height };\n    }\n\n    protected makeBoxTop(box: TeleBox, skipUpdate = false): void {\n        if (this.topBox) {\n            if (box !== this.topBox) {\n                box._zIndex$.setValue(this.topBox.zIndex + 1, skipUpdate);\n            }\n        }\n    }\n\n    protected getBoxIndex(boxOrID: TeleBox | string): number {\n        return typeof boxOrID === \"string\"\n            ? this.boxes.findIndex((box) => box.id === boxOrID)\n            : this.boxes.findIndex((box) => box === boxOrID);\n    }\n\n    protected getBox(boxOrID: TeleBox | string): TeleBox | undefined {\n        return typeof boxOrID === \"string\"\n            ? this.boxes.find((box) => box.id === boxOrID)\n            : boxOrID;\n    }\n}\n"],"names":["TELE_BOX_COLOR_SCHEME","TELE_BOX_COLOR_SCHEME2","TELE_BOX_STATE","TELE_BOX_STATE2","TELE_BOX_EVENT","TELE_BOX_EVENT2","TELE_BOX_DELEGATE_EVENT","TELE_BOX_DELEGATE_EVENT2","TELE_BOX_RESIZE_HANDLE","TELE_BOX_RESIZE_HANDLE2","TeleBoxDragHandleType","value","min","max","Math","ev","stopPropagation","cancelable","preventDefault","touches","defaultBoxCount","Boolean","constructor","readonly$","state$","title$","buttons","onEvent","onDragStart","namespace","SideEffectManager","timestamp","clientX","clientY","this","button","target","dataset","teleTitleBarNoDblClick","now","Date","lastTitleBarClick","abs","type","Maximize","lastTitleBarTouch","Minimize","iconClassName","wrapClassName","isActive","state","Maximized","Close","$dragArea","renderDragArea","render","$titleBar","document","createElement","className","$titleArea","teleBoxHandle","$title","appendChild","$buttonsContainer","forEach","i","teleTitleBarBtnIndex","String","$btn","sideEffect","addDisposer","subscribe","title","textContent","btn","children","classList","toggle","addEventListener","Number","isNaN","length","handleTitleBarClick","handleTitleBarTouch","passive","dragHandle","destroy","flushAll","rootRect$","ratio$","highlightStage$","root$","stageRect$","combine","rootRect","ratio","width","height","preferredHeight","x","y","preferredWidth","compare","shallowequal","_sideEffect","root","highlightStage","$boxStage","parentNode","remove","$boxStageMask1","$boxStageMask2","$boxStageFrame","$topLeftCorner","$topRightCorner","$bottomLeftCorner","$bottomRightCorner","map","path","$svg","createElementNS","setAttribute","$path","stageRect","style","flexDirection","ResizeObserver","window","ResizeObserverPolyfill","id","genUID","getBoxDefaultName","visible","minWidth","minHeight","resizable","draggable","focus","zIndex","stageRatio","titleBar","content","stage","footer","styles","darkMode$","fence$","minimized$","maximized$","managerStageRect$","managerStageRatio$","collectorRect$","managerHighlightStage$","Emittery","_handleTrackStart","valManager","ValManager","Val","visible$","resizable$","draggable$","zIndex$","focus$","$userContent$","$userStage$","$userFooter$","$userStyles$","minimized","maximized","Minimized","Normal","minSize$","clamp","pxMinSize$","minSize","managerStageRect","intrinsicSize$","reaction","skipUpdate","setValue","intrinsicCoord$","pxIntrinsicSize$","size","pxIntrinsicCoord$","intrinsicCoord","boxHighlightStage$","boxHighlightStage","managerHighlightStage","contentRoot$","contentRect$","stageRatio$","teleStage","TeleStage","stageRatio2","managerStageRatio","darkMode","fence","readonly","collectorRect","myReadonlyValConfig","$userContent","$userStage","$userFooter","$userStyles","pxMinSize","intrinsicSize","pxIntrinsicSize","pxIntrinsicCoord","contentRect","contentStageRect","DefaultTitleBar","event","_delegateEvents","emit","ratio2","transform","move","$box","$content","parentElement","watchValEvent","val","v","events","DarkMode","Readonly","ZIndex","State","IntrinsicResize","IntrinsicMove","visible2","focus2","Focus","Blur","_minSize$","setMinWidth","setMinHeight","resize","_intrinsicSize$","_intrinsicCoord$","safeX","safeY","newHeight","mountContent","_$userContent$","unmountContent","mountStage","_$userStage$","unmountStage","mountFooter","_$userFooter$","unmountFooter","getUserStyles","mountStyles","$styles","_$userStyles$","unmountStyles","setHighlightStage","_boxHighlightStage$","add","bindClassName","el","predicate","isTruthy","wrappedClassName","_readonly$","_draggable$","isFalsy","_resizable$","_focus$","_darkMode$","minimizedClassName","maximizedClassName","MAXIMIZED_TIMER_ID","_state$","flush","setTimeout","_visible$","display","_zIndex$","teleBoxID","boxStyler","styler","boxStyles$","_maximized$","_minimized$","_pxIntrinsicSize$","_pxIntrinsicCoord$","_collectorRect$","scaleX","scaleY","boxWidth","boxHeight","boxStyles","set","$boxMain","$contentWrap","updateContentRect","rect","getBoundingClientRect","_contentRect$","observer","observe","disconnect","last$userStyles","last$userContent","last$userStage","$stage","_contentStageRect$","top","left","$footer","last$userFooter","_renderResizeHandlers","$resizeHandles","values","handleType","$handle","TRACKING_DISPOSER_ID","transformingClassName","$trackMask","trackingHandle","trackStartX","trackStartY","trackStartWidth","trackStartHeight","trackStartPageX","trackStartPageY","handleTracking","pageX","pageY","flattenEvent","offsetX","offsetY","newX","newY","newWidth","North","South","West","East","NorthWest","NorthEast","SouthEast","SouthWest","handleTrackEnd","handleTrackStart","cursor","removeEventListener","Destroyed","clearListeners","TELE_BOX_MANAGER_EVENT","TELE_BOX_MANAGER_EVENT2","rect$","derive","styles$","el$","$collector","backgroundImage","styles2","keys","key","config","boxes$","focusBox","box","focusedBox","$titles","firstElementChild","$tab","super","titles","replaceChild","renderTitles","$titlesArea","insertBefore","currentTarget","scrollBy","deltaY","behavior","disposers","_title$","disposer","prefersColorScheme","Light","collector","innerWidth","innerHeight","root2","topBox$","boxes","topBox","reduce","topBox2","prefersDarkMatch","matchMedia","prefersDark$","matches","handler","evt","prefersColorScheme$","prefersColorScheme2","PrefersColorScheme","prefersDark","minimized2","maximized2","TeleBoxCollector","highlightStage2","readonlyValConfig","closeBtnClassName","checkFocusBox","tagName","contains","getBox","makeBoxTop","MaxTitleBar","removeTopBox","focusTopBox","setState","setMinimized","setMaximized","create","smartPosition","TeleBox","_root$","_fence$","_rootRect$","_stageRect$","_stageRatio$","_rect$","_highlightStage$","on","_","box2","Created","query","filter","teleBoxMatcher","queryOne","find","update","boxID","updateBox","updateAll","boxOrID","index","getBoxIndex","slice","deletedBoxes","splice","Removed","removeAll","mount","unmount","targetBox","focusChanged","Focused","blurBox","Blurred","blurAll","Object","every","intrinsicX","intrinsicY","intrinsicWidth","intrinsicHeight","_ratio$","setStageRatio","pxX","pxPreferredX","pxY","pxPreferredY","findIndex"],"mappings":"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"}
+{"version":3,"file":"telebox-insider.es.js","sources":["../src/TeleBox/constants.ts","../src/utils.ts","../src/TeleTitleBar/DefaultTitleBar/index.ts","../src/TeleBox/utils.ts","../src/TeleBox/index.ts","../src/TeleBoxManager/constants.ts","../src/TeleBoxCollector/index.ts","../src/TeleBoxManager/MaxTitleBar/index.ts","../src/TeleBoxManager/index.ts"],"sourcesContent":["export enum TELE_BOX_COLOR_SCHEME {\n    Light = \"light\",\n    Dark = \"dark\",\n    Auto = \"auto\",\n}\n\nexport enum TELE_BOX_STATE {\n    Normal = \"normal\",\n    Minimized = \"minimized\",\n    Maximized = \"maximized\",\n}\n\nexport enum TELE_BOX_EVENT {\n    DarkMode = \"dark_mode\",\n    PrefersColorScheme = \"prefers_color_scheme\",\n    Close = \"close\",\n    Focus = \"focus\",\n    Blur = \"blur\",\n    IntrinsicMove = \"intrinsic_move\",\n    IntrinsicResize = \"intrinsic_resize\",\n    ZIndex = \"z_index\",\n    State = \"state\",\n    Minimized = \"minimized\",\n    Maximized = \"maximized\",\n    Readonly = \"readonly\",\n    Destroyed = \"destroyed\",\n}\n\nexport enum TELE_BOX_DELEGATE_EVENT {\n    Close = \"close\",\n    Maximize = \"maximize\",\n    Minimize = \"minimize\",\n}\n\nexport enum TELE_BOX_RESIZE_HANDLE {\n    North = \"n\",\n    South = \"s\",\n    West = \"w\",\n    East = \"e\",\n    NorthWest = \"nw\",\n    NorthEast = \"ne\",\n    SouthEast = \"se\",\n    SouthWest = \"sw\",\n}\n\nexport const TeleBoxDragHandleType = \"dh\";\n","export function clamp(value: number, min: number, max: number): number {\n    return Math.min(Math.max(value, min), max);\n}\n\nexport function preventEvent(ev: Event): void {\n    ev.stopPropagation();\n    if (ev.cancelable) {\n        ev.preventDefault();\n    }\n}\n\nexport function flattenEvent(ev: MouseEvent | TouchEvent): MouseEvent | Touch {\n    return (ev as TouchEvent).touches\n        ? (ev as TouchEvent).touches[0]\n        : (ev as MouseEvent);\n}\n\nexport function getRandomInt(min: number, max: number): number {\n    min = Math.ceil(min);\n    max = Math.floor(max);\n    return Math.floor(Math.random() * (max - min + 1)) + min;\n}\n\nlet defaultBoxCount = 1;\n\nexport function getBoxDefaultName(): string {\n    return `New Box ${defaultBoxCount++}`;\n}\n\nexport function identity<TValue>(value: TValue): TValue {\n    return value;\n}\n\nexport function isTruthy<TValue>(value: TValue): boolean {\n    return Boolean(value);\n}\n\nexport function isFalsy<TValue>(value: TValue): boolean {\n    return !value;\n}\n","import \"./style.scss\";\n\nimport { SideEffectManager } from \"side-effect-manager\";\n\nimport {\n    TeleBoxDragHandleType,\n    TELE_BOX_DELEGATE_EVENT,\n    TELE_BOX_STATE,\n} from \"../../TeleBox/constants\";\nimport type { TeleBoxState } from \"../../TeleBox/typings\";\nimport type {\n    TeleTitleBar,\n    TeleTitleBarConfig,\n    TeleTitleBarEvent,\n} from \"../typings\";\nimport { preventEvent } from \"../../utils\";\nimport type { ReadonlyVal } from \"value-enhancer\";\n\nexport type DefaultTitleBarButton = TeleTitleBarEvent & {\n    readonly iconClassName: string;\n    readonly isActive?: (state: TeleBoxState) => boolean;\n};\n\nexport interface DefaultTitleBarConfig extends TeleTitleBarConfig {\n    buttons?: ReadonlyArray<DefaultTitleBarButton>;\n}\n\nexport class DefaultTitleBar implements TeleTitleBar {\n    public constructor({\n        readonly$,\n        state$,\n        title$,\n        buttons,\n        onEvent,\n        onDragStart,\n        namespace = \"telebox\",\n    }: DefaultTitleBarConfig) {\n        this.readonly$ = readonly$;\n        this.state$ = state$;\n        this.title$ = title$;\n        this.onEvent = onEvent;\n        this.onDragStart = onDragStart;\n        this.namespace = namespace;\n\n        this.buttons = buttons || [\n            {\n                type: TELE_BOX_DELEGATE_EVENT.Minimize,\n                iconClassName: this.wrapClassName(\"titlebar-icon-minimize\"),\n            },\n            {\n                type: TELE_BOX_DELEGATE_EVENT.Maximize,\n                iconClassName: this.wrapClassName(\"titlebar-icon-maximize\"),\n                isActive: (state) => state === TELE_BOX_STATE.Maximized,\n            },\n            {\n                type: TELE_BOX_DELEGATE_EVENT.Close,\n                iconClassName: this.wrapClassName(\"titlebar-icon-close\"),\n            },\n        ];\n\n        this.$dragArea = this.renderDragArea();\n    }\n\n    public readonly namespace: string;\n\n    public $titleBar: HTMLElement | undefined;\n\n    public $dragArea: HTMLElement;\n\n    public render(): HTMLElement {\n        if (!this.$titleBar) {\n            this.$titleBar = document.createElement(\"div\");\n            this.$titleBar.className = this.wrapClassName(\"titlebar\");\n\n            const $titleArea = document.createElement(\"div\");\n            $titleArea.className = this.wrapClassName(\"title-area\");\n            $titleArea.dataset.teleBoxHandle = TeleBoxDragHandleType;\n\n            const $title = document.createElement(\"h1\");\n            $title.className = this.wrapClassName(\"title\");\n            $title.dataset.teleBoxHandle = TeleBoxDragHandleType;\n\n            $titleArea.appendChild($title);\n            $titleArea.appendChild(this.$dragArea);\n\n            const $buttonsContainer = document.createElement(\"div\");\n            $buttonsContainer.className = this.wrapClassName(\"titlebar-btns\");\n\n            this.buttons.forEach(({ iconClassName }, i) => {\n                const teleTitleBarBtnIndex = String(i);\n\n                const $btn = document.createElement(\"button\");\n                $btn.className = `${this.wrapClassName(\n                    \"titlebar-btn\"\n                )} ${iconClassName}`;\n                $btn.dataset.teleTitleBarBtnIndex = teleTitleBarBtnIndex;\n                $btn.dataset.teleTitleBarNoDblClick = \"true\";\n                $buttonsContainer.appendChild($btn);\n            });\n\n            this.sideEffect.addDisposer(\n                this.title$.subscribe((title) => {\n                    $title.textContent = title;\n                    $title.title = title;\n                }),\n                \"render-title\"\n            );\n\n            this.sideEffect.addDisposer(\n                this.state$.subscribe((state) => {\n                    this.buttons.forEach((btn, i) => {\n                        if (btn.isActive) {\n                            $buttonsContainer.children[i]?.classList.toggle(\n                                \"is-active\",\n                                btn.isActive(state)\n                            );\n                        }\n                    });\n                }),\n                \"render-state-btns\"\n            );\n\n            this.sideEffect.addEventListener(\n                $buttonsContainer,\n                \"click\",\n                (ev) => {\n                    if (this.readonly$.value) {\n                        return;\n                    }\n                    const target = ev.target as HTMLElement;\n                    const teleTitleBarBtnIndex = Number(\n                        target.dataset?.teleTitleBarBtnIndex\n                    );\n                    if (\n                        !Number.isNaN(teleTitleBarBtnIndex) &&\n                        teleTitleBarBtnIndex < this.buttons.length\n                    ) {\n                        preventEvent(ev);\n                        const btn = this.buttons[teleTitleBarBtnIndex];\n                        if (this.onEvent) {\n                            this.onEvent({\n                                type: btn.type,\n                                value: btn.value,\n                            } as TeleTitleBarEvent);\n                        }\n                    }\n                },\n                {},\n                \"render-btns-container-click\"\n            );\n\n            this.$titleBar.appendChild($titleArea);\n            this.$titleBar.appendChild($buttonsContainer);\n        }\n\n        return this.$titleBar;\n    }\n\n    public renderDragArea(): HTMLElement {\n        const $dragArea = document.createElement(\"div\");\n        $dragArea.className = this.wrapClassName(\"drag-area\");\n        $dragArea.dataset.teleBoxHandle = TeleBoxDragHandleType;\n        this.sideEffect.addEventListener(\n            $dragArea,\n            \"mousedown\",\n            this.handleTitleBarClick\n        );\n        this.sideEffect.addEventListener(\n            $dragArea,\n            \"touchstart\",\n            this.handleTitleBarTouch,\n            { passive: true }\n        );\n        return $dragArea;\n    }\n\n    public dragHandle(): HTMLElement | undefined {\n        return this.$titleBar;\n    }\n\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n\n    public destroy(): void {\n        this.sideEffect.flushAll();\n        if (this.$titleBar) {\n            this.$titleBar = void 0;\n            this.onDragStart = void 0;\n            this.onEvent = void 0;\n        }\n    }\n\n    public onEvent?: TeleTitleBarConfig[\"onEvent\"];\n\n    public onDragStart?: TeleTitleBarConfig[\"onDragStart\"];\n\n    protected readonly$: TeleTitleBarConfig[\"readonly$\"];\n\n    protected title$: ReadonlyVal<string>;\n\n    protected buttons: ReadonlyArray<DefaultTitleBarButton>;\n\n    protected state$: TeleTitleBarConfig[\"state$\"];\n\n    protected sideEffect = new SideEffectManager();\n\n    protected lastTitleBarClick = {\n        timestamp: 0,\n        clientX: -100,\n        clientY: -100,\n    };\n\n    protected handleTitleBarClick = (ev: MouseEvent): void => {\n        if (this.readonly$.value) {\n            return;\n        }\n\n        if (ev.button !== 0) {\n            return; // Not left mouse\n        }\n\n        if ((ev.target as HTMLElement).dataset?.teleTitleBarNoDblClick) {\n            return; // btns\n        }\n\n        preventEvent(ev);\n\n        const now = Date.now();\n        if (now - this.lastTitleBarClick.timestamp <= 500) {\n            if (\n                Math.abs(ev.clientX - this.lastTitleBarClick.clientX) <= 5 &&\n                Math.abs(ev.clientY - this.lastTitleBarClick.clientY) <= 5\n            ) {\n                // double click\n                if (this.onEvent) {\n                    this.onEvent({ type: TELE_BOX_DELEGATE_EVENT.Maximize });\n                }\n            }\n        } else if (this.onDragStart) {\n            this.onDragStart(ev);\n        }\n        this.lastTitleBarClick.timestamp = now;\n        this.lastTitleBarClick.clientX = ev.clientX;\n        this.lastTitleBarClick.clientY = ev.clientY;\n    };\n\n    protected lastTitleBarTouch = {\n        timestamp: 0,\n        clientX: -100,\n        clientY: -100,\n    };\n\n    protected handleTitleBarTouch = (ev: TouchEvent): void => {\n        if (this.readonly$.value) {\n            return;\n        }\n\n        if ((ev.target as HTMLElement).dataset?.teleTitleBarNoDblClick) {\n            return; // btns\n        }\n\n        preventEvent(ev);\n\n        const now = Date.now();\n        const {\n            clientX = this.lastTitleBarTouch.clientX + 100,\n            clientY = this.lastTitleBarTouch.clientY + 100,\n        } = ev.touches[0] || {};\n\n        if (now - this.lastTitleBarTouch.timestamp <= 500) {\n            if (\n                Math.abs(clientX - this.lastTitleBarTouch.clientX) <= 10 &&\n                Math.abs(clientY - this.lastTitleBarTouch.clientY) <= 10\n            ) {\n                // double click\n                if (this.onEvent) {\n                    this.onEvent({ type: TELE_BOX_DELEGATE_EVENT.Maximize });\n                }\n            }\n        } else if (this.onDragStart) {\n            this.onDragStart(ev);\n        }\n        this.lastTitleBarTouch.timestamp = now;\n        this.lastTitleBarTouch.clientX = clientX;\n        this.lastTitleBarTouch.clientY = clientY;\n    };\n}\n","import type { TeleBoxRect } from \"./typings\";\n\nexport function calcStageRect([rootRect, ratio]: [\n    TeleBoxRect,\n    number\n]): TeleBoxRect {\n    if (ratio <= 0 || rootRect.width <= 0 || rootRect.height <= 0) {\n        return rootRect;\n    }\n\n    const preferredHeight = rootRect.width * ratio;\n    if (preferredHeight === rootRect.height) {\n        return rootRect;\n    }\n\n    if (preferredHeight < rootRect.height) {\n        return {\n            x: 0,\n            y: (rootRect.height - preferredHeight) / 2,\n            width: rootRect.width,\n            height: preferredHeight,\n        };\n    }\n\n    const preferredWidth = rootRect.height / ratio;\n    return {\n        x: (rootRect.width - preferredWidth) / 2,\n        y: 0,\n        width: preferredWidth,\n        height: rootRect.height,\n    };\n}\n","import \"./style.scss\";\n\nimport Emittery from \"emittery\";\nimport styler from \"stylefire\";\nimport shallowequal from \"shallowequal\";\nimport { genUID, SideEffectManager } from \"side-effect-manager\";\nimport type {\n    ReadonlyVal,\n    ReadonlyValEnhancedResult,\n    ValEnhancedResult,\n} from \"value-enhancer\";\nimport {\n    combine,\n    Val,\n    withReadonlyValueEnhancer,\n    withValueEnhancer,\n    ValManager,\n} from \"value-enhancer\";\nimport type { TeleTitleBar } from \"../TeleTitleBar\";\nimport { DefaultTitleBar } from \"../TeleTitleBar\";\nimport { ResizeObserver as ResizeObserverPolyfill } from \"@juggle/resize-observer\";\nimport {\n    clamp,\n    flattenEvent,\n    getBoxDefaultName,\n    isFalsy,\n    isTruthy,\n    preventEvent,\n} from \"../utils\";\nimport {\n    TELE_BOX_EVENT,\n    TELE_BOX_STATE,\n    TELE_BOX_RESIZE_HANDLE,\n} from \"./constants\";\nimport type {\n    TeleBoxConfig,\n    TeleBoxHandleType,\n    TeleBoxState,\n    TeleBoxCoord,\n    TeleBoxSize,\n    TeleBoxEventConfig,\n    TeleBoxEvent,\n    TeleBoxDelegateEventConfig,\n    TeleBoxRect,\n} from \"./typings\";\nimport { calcStageRect } from \"./utils\";\n\nexport * from \"./constants\";\nexport * from \"./typings\";\n\nconst ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n\ntype RequiredTeleBoxConfig = Required<TeleBoxConfig>;\n\ntype ValConfig = {\n    title: Val<RequiredTeleBoxConfig[\"title\"], boolean>;\n    visible: Val<RequiredTeleBoxConfig[\"visible\"], boolean>;\n    resizable: Val<RequiredTeleBoxConfig[\"resizable\"], boolean>;\n    draggable: Val<RequiredTeleBoxConfig[\"draggable\"], boolean>;\n    boxRatio: Val<RequiredTeleBoxConfig[\"boxRatio\"], boolean>;\n    contentStageRatio: Val<number | null>;\n    contentStageStyle: Val<string | null>;\n    contentStyle: Val<string | null>;\n};\n\ntype PropsValConfig = {\n    darkMode: RequiredTeleBoxConfig[\"darkMode$\"];\n    fence: RequiredTeleBoxConfig[\"fence$\"];\n    minimized: RequiredTeleBoxConfig[\"minimized$\"];\n    maximized: RequiredTeleBoxConfig[\"maximized$\"];\n    readonly: RequiredTeleBoxConfig[\"readonly$\"];\n    rootRect: RequiredTeleBoxConfig[\"rootRect$\"];\n    managerStageRect: RequiredTeleBoxConfig[\"managerStageRect$\"];\n    managerStageStyle: RequiredTeleBoxConfig[\"managerStageStyle$\"];\n    managerContainerStyle: RequiredTeleBoxConfig[\"managerContainerStyle$\"];\n    collectorRect: RequiredTeleBoxConfig[\"collectorRect$\"];\n};\n\ntype MyReadonlyValConfig = {\n    zIndex: Val<RequiredTeleBoxConfig[\"zIndex\"], boolean>;\n    focus: Val<RequiredTeleBoxConfig[\"focus\"], boolean>;\n\n    $userContent: Val<TeleBoxConfig[\"content\"], boolean>;\n    $userStage: Val<TeleBoxConfig[\"stage\"], boolean>;\n    $userFooter: Val<TeleBoxConfig[\"footer\"], boolean>;\n    $userStyles: Val<TeleBoxConfig[\"styles\"], boolean>;\n\n    minSize: Val<TeleBoxSize, boolean>;\n    intrinsicSize: Val<TeleBoxSize, boolean>;\n    intrinsicCoord: Val<TeleBoxCoord, boolean>;\n    pxMinSize: ReadonlyVal<TeleBoxSize, boolean>;\n    pxIntrinsicSize: ReadonlyVal<TeleBoxSize, boolean>;\n    pxIntrinsicCoord: ReadonlyVal<TeleBoxCoord, boolean>;\n    state: ReadonlyVal<TeleBoxState, boolean>;\n    contentRect: Val<TeleBoxRect>;\n    contentStageRect: ReadonlyVal<TeleBoxRect>;\n};\n\ntype CombinedValEnhancedResult = ReadonlyValEnhancedResult<\n    PropsValConfig & MyReadonlyValConfig\n> &\n    ValEnhancedResult<ValConfig>;\n\nexport interface TeleBox extends CombinedValEnhancedResult {}\n\nexport class TeleBox {\n    public constructor({\n        id = genUID(),\n        title = getBoxDefaultName(),\n        namespace = \"telebox\",\n        visible = true,\n        width = 0.5,\n        height = 0.5,\n        minWidth = 0,\n        minHeight = 0,\n        x = 0.1,\n        y = 0.1,\n        resizable = true,\n        draggable = true,\n        boxRatio = -1,\n        focus = false,\n        zIndex = 100,\n        contentStageRatio = null,\n        titleBar,\n        content,\n        stage,\n        footer,\n        styles,\n        contentStyle = null,\n        contentStageStyle = null,\n        darkMode$,\n        fence$,\n        minimized$,\n        maximized$,\n        readonly$,\n        root,\n        rootRect$,\n        managerStageRect$,\n        managerStageRatio$,\n        managerContainerStyle$,\n        managerStageStyle$,\n        collectorRect$,\n    }: TeleBoxConfig) {\n        this._sideEffect = new SideEffectManager();\n\n        this.id = id;\n        this.namespace = namespace;\n\n        const valManager = new ValManager();\n        this._sideEffect.addDisposer(() => valManager.destroy());\n\n        const title$ = new Val(title);\n        const visible$ = new Val(visible);\n        const resizable$ = new Val(resizable);\n        const draggable$ = new Val(draggable);\n        const boxRatio$ = new Val(boxRatio);\n        const zIndex$ = new Val(zIndex);\n        const focus$ = new Val(focus);\n        const $userContent$ = new Val(content);\n        const $userStage$ = new Val(stage);\n        const $userFooter$ = new Val(footer);\n        const $userStyles$ = new Val(styles);\n\n        const state$ = combine(\n            [minimized$, maximized$],\n            ([minimized, maximized]): TeleBoxState =>\n                minimized\n                    ? TELE_BOX_STATE.Minimized\n                    : maximized\n                    ? TELE_BOX_STATE.Maximized\n                    : TELE_BOX_STATE.Normal\n        );\n\n        const minSize$ = new Val(\n            {\n                width: clamp(minWidth, 0, 1),\n                height: clamp(minHeight, 0, 1),\n            },\n            { compare: shallowequal }\n        );\n\n        const pxMinSize$ = combine(\n            [minSize$, managerStageRect$],\n            ([minSize, managerStageRect]) => ({\n                width: minSize.width * managerStageRect.width,\n                height: minSize.height * managerStageRect.height,\n            }),\n            { compare: shallowequal }\n        );\n\n        const intrinsicSize$ = new Val(\n            { width, height },\n            { compare: shallowequal }\n        );\n\n        this._sideEffect.addDisposer(\n            // check intrinsicSize overflow\n            minSize$.reaction((minSize, skipUpdate) => {\n                intrinsicSize$.setValue(\n                    {\n                        width: Math.max(width, minSize.width),\n                        height: Math.max(height, minSize.height),\n                    },\n                    skipUpdate\n                );\n            })\n        );\n\n        const intrinsicCoord$ = new Val({ x, y }, { compare: shallowequal });\n\n        const pxIntrinsicSize$ = combine(\n            [intrinsicSize$, managerStageRect$],\n            ([size, managerStageRect]) => ({\n                width: managerStageRect.width * size.width,\n                height: managerStageRect.height * size.height,\n            }),\n            { compare: shallowequal }\n        );\n\n        const pxIntrinsicCoord$ = combine(\n            [intrinsicCoord$, managerStageRect$],\n            ([intrinsicCoord, managerStageRect]) => ({\n                x: intrinsicCoord.x * managerStageRect.width,\n                y: intrinsicCoord.y * managerStageRect.height,\n            }),\n            { compare: shallowequal }\n        );\n\n        const contentStyle$ = new Val<string | null>(contentStyle);\n        const contentStageStyle$ = new Val<string | null>(contentStageStyle);\n\n        const contentRoot$ = new Val<HTMLElement | null>(null);\n        const contentRect$ = new Val<TeleBoxRect>(managerStageRect$.value, {\n            compare: shallowequal,\n        });\n        const contentStageRatio$ = new Val(contentStageRatio);\n        const finalStageRatio$ = combine(\n            [contentStageRatio$, managerStageRatio$],\n            ([contentStageRatio, managerStageRatio]) =>\n                contentStageRatio ?? managerStageRatio\n        );\n        const contentStageRect$ = combine(\n            [contentRect$, finalStageRatio$],\n            calcStageRect,\n            { compare: shallowequal }\n        );\n\n        const propsValConfig: PropsValConfig = {\n            darkMode: darkMode$,\n            fence: fence$,\n            minimized: minimized$,\n            maximized: maximized$,\n            readonly: readonly$,\n            rootRect: rootRect$,\n            managerStageRect: managerStageRect$,\n            managerContainerStyle: managerContainerStyle$,\n            managerStageStyle: managerStageStyle$,\n            collectorRect: collectorRect$,\n        };\n\n        withReadonlyValueEnhancer(this, propsValConfig);\n\n        const myReadonlyValConfig: MyReadonlyValConfig = {\n            zIndex: zIndex$,\n            focus: focus$,\n\n            $userContent: $userContent$,\n            $userStage: $userStage$,\n            $userFooter: $userFooter$,\n            $userStyles: $userStyles$,\n\n            state: state$,\n            minSize: minSize$,\n            pxMinSize: pxMinSize$,\n            intrinsicSize: intrinsicSize$,\n            intrinsicCoord: intrinsicCoord$,\n            pxIntrinsicSize: pxIntrinsicSize$,\n            pxIntrinsicCoord: pxIntrinsicCoord$,\n            contentRect: contentRect$,\n            contentStageRect: contentStageRect$,\n        };\n\n        withReadonlyValueEnhancer(this, myReadonlyValConfig, valManager);\n\n        const valConfig: ValConfig = {\n            title: title$,\n            visible: visible$,\n            resizable: resizable$,\n            draggable: draggable$,\n            boxRatio: boxRatio$,\n            contentStageRatio: contentStageRatio$,\n            contentStyle: contentStyle$,\n            contentStageStyle: contentStageStyle$,\n        };\n\n        withValueEnhancer(this, valConfig, valManager);\n\n        this.titleBar =\n            titleBar ||\n            new DefaultTitleBar({\n                readonly$: readonly$,\n                state$: state$,\n                title$: title$,\n                namespace: this.namespace,\n                onDragStart: (event) => this._handleTrackStart?.(event),\n                onEvent: (event) => this._delegateEvents.emit(event.type),\n            });\n\n        this._sideEffect.addDisposer(\n            boxRatio$.subscribe((boxRatio) => {\n                if (boxRatio > 0) {\n                    this.transform(\n                        pxIntrinsicCoord$.value.x,\n                        pxIntrinsicCoord$.value.y,\n                        pxIntrinsicSize$.value.width,\n                        pxIntrinsicSize$.value.height\n                    );\n                }\n            })\n        );\n\n        this._sideEffect.addDisposer(\n            fence$.subscribe((fence) => {\n                if (fence) {\n                    this.move(\n                        pxIntrinsicCoord$.value.x,\n                        pxIntrinsicCoord$.value.y\n                    );\n                }\n            })\n        );\n\n        this.$box = this._render();\n        contentRoot$.setValue(this.$content.parentElement);\n        root.appendChild(this.$box);\n\n        const watchValEvent = <E extends TeleBoxEvent>(\n            val: ReadonlyVal<TeleBoxEventConfig[E], boolean>,\n            event: E\n        ) => {\n            this._sideEffect.addDisposer(\n                val.reaction((v, skipUpdate) => {\n                    if (!skipUpdate) {\n                        this.events.emit<any>(event, v);\n                    }\n                })\n            );\n        };\n\n        watchValEvent(darkMode$, TELE_BOX_EVENT.DarkMode);\n        watchValEvent(readonly$, TELE_BOX_EVENT.Readonly);\n        watchValEvent(zIndex$, TELE_BOX_EVENT.ZIndex);\n        watchValEvent(minimized$, TELE_BOX_EVENT.Minimized);\n        watchValEvent(maximized$, TELE_BOX_EVENT.Maximized);\n        watchValEvent(state$, TELE_BOX_EVENT.State);\n        watchValEvent(intrinsicSize$, TELE_BOX_EVENT.IntrinsicResize);\n        watchValEvent(intrinsicCoord$, TELE_BOX_EVENT.IntrinsicMove);\n\n        this._sideEffect.addDisposer([\n            visible$.reaction((visible, skipUpdate) => {\n                if (!skipUpdate && !visible) {\n                    this.events.emit(TELE_BOX_EVENT.Close);\n                }\n            }),\n            focus$.reaction((focus, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        focus ? TELE_BOX_EVENT.Focus : TELE_BOX_EVENT.Blur\n                    );\n                }\n            }),\n        ]);\n    }\n\n    public readonly id: string;\n\n    /** ClassName Prefix. For CSS styling. Default \"telebox\" */\n    public readonly namespace: string;\n\n    public readonly events = new Emittery<\n        TeleBoxEventConfig,\n        TeleBoxEventConfig\n    >();\n\n    public readonly _delegateEvents = new Emittery<\n        TeleBoxDelegateEventConfig,\n        TeleBoxDelegateEventConfig\n    >();\n\n    protected _sideEffect: SideEffectManager;\n\n    public titleBar: TeleTitleBar;\n\n    /** Minimum box width relative to stage area. 0~1. Default 0. */\n    public get minWidth(): number {\n        return this._minSize$.value.width;\n    }\n\n    /** Minimum box height relative to stage area. 0~1. Default 0. */\n    public get minHeight(): number {\n        return this._minSize$.value.height;\n    }\n\n    /**\n     * @param minWidth Minimum box width relative to stage area. 0~1.\n     * @returns this\n     */\n    public setMinWidth(minWidth: number, skipUpdate = false): void {\n        this._minSize$.setValue(\n            { width: minWidth, height: this.minHeight },\n            skipUpdate\n        );\n    }\n\n    /**\n     * @param minHeight Minimum box height relative to container element. 0~1.\n     * @returns this\n     */\n    public setMinHeight(minHeight: number, skipUpdate = false): void {\n        this._minSize$.setValue(\n            { width: this.minWidth, height: minHeight },\n            skipUpdate\n        );\n    }\n\n    /**\n     * Resize box.\n     * @param width Box width relative to container element. 0~1.\n     * @param height Box height relative to container element. 0~1.\n     * @param skipUpdate Skip emitting event.\n     * @returns this\n     */\n    public resize(width: number, height: number, skipUpdate = false): void {\n        this._intrinsicSize$.setValue(\n            {\n                width: Math.max(width, this.minWidth),\n                height: Math.max(height, this.minHeight),\n            },\n            skipUpdate\n        );\n    }\n\n    /** Intrinsic box x position relative to container element(without counting the effect of maximization or minimization). 0~1. Default 0.1. */\n    public get intrinsicX(): number {\n        return this._intrinsicCoord$.value.x;\n    }\n\n    /** Intrinsic box y position relative to container element(without counting the effect of maximization or minimization). 0~1. Default 0.1. */\n    public get intrinsicY(): number {\n        return this._intrinsicCoord$.value.y;\n    }\n\n    /** Intrinsic box width relative to container element(without counting the effect of maximization or minimization). 0~1. Default 0.1. */\n    public get intrinsicWidth(): number {\n        return this._intrinsicSize$.value.width;\n    }\n\n    /** Intrinsic box height relative to container element(without counting the effect of maximization or minimization). 0~1. Default 0.1. */\n    public get intrinsicHeight(): number {\n        return this._intrinsicSize$.value.height;\n    }\n\n    /**\n     * Move box position.\n     * @param x x position in px.\n     * @param y y position in px.\n     * @param skipUpdate Skip emitting event.\n     * @returns this\n     */\n    protected move(x: number, y: number, skipUpdate = false): void {\n        let safeX: number;\n        let safeY: number;\n        const managerStageRect = this.managerStageRect;\n        const pxIntrinsicSize = this.pxIntrinsicSize;\n\n        if (this.fence) {\n            safeX = clamp(x, 0, managerStageRect.width - pxIntrinsicSize.width);\n            safeY = clamp(\n                y,\n                0,\n                managerStageRect.height - pxIntrinsicSize.height\n            );\n        } else {\n            safeX = clamp(\n                x,\n                -(pxIntrinsicSize.width - 120),\n                0 + managerStageRect.width - 20\n            );\n            safeY = clamp(y, 0, 0 + managerStageRect.height - 20);\n        }\n\n        this._intrinsicCoord$.setValue(\n            {\n                x: safeX / managerStageRect.width,\n                y: safeY / managerStageRect.height,\n            },\n            skipUpdate\n        );\n    }\n\n    /**\n     * Resize + Move, with respect to fixed ratio.\n     * @param x x position in px.\n     * @param y y position in px.\n     * @param width Box width in px.\n     * @param height Box height in px.\n     * @param skipUpdate Skip emitting event.\n     * @returns this\n     */\n    protected transform(\n        x: number,\n        y: number,\n        width: number,\n        height: number,\n        skipUpdate = false\n    ): void {\n        const managerStageRect = this.managerStageRect;\n\n        width = Math.max(width, this.pxMinSize.width);\n        height = Math.max(height, this.pxMinSize.height);\n\n        if (this.boxRatio > 0) {\n            const newHeight = this.boxRatio * width;\n            if (y !== this.pxIntrinsicCoord.y) {\n                y -= newHeight - height;\n            }\n            height = newHeight;\n        }\n\n        if (y < 0) {\n            y = 0;\n            height = this.pxIntrinsicSize.height;\n        }\n\n        this.move(x, y, skipUpdate);\n        this._intrinsicSize$.setValue(\n            {\n                width: width / managerStageRect.width,\n                height: height / managerStageRect.height,\n            },\n            skipUpdate\n        );\n    }\n\n    /**\n     * Mount dom to box content.\n     */\n    public mountContent(content: HTMLElement): void {\n        this._$userContent$.setValue(content);\n    }\n\n    /**\n     * Unmount content from the box.\n     */\n    public unmountContent(): void {\n        this._$userContent$.setValue(undefined);\n    }\n\n    public mountStage(stage: HTMLElement): void {\n        this._$userStage$.setValue(stage);\n    }\n\n    /**\n     * Unmount content from the box.\n     */\n    public unmountStage(): void {\n        this._$userStage$.setValue(undefined);\n    }\n\n    /**\n     * Mount dom to box Footer.\n     */\n    public mountFooter(footer: HTMLElement): void {\n        this._$userFooter$.setValue(footer);\n    }\n\n    /**\n     * Unmount Footer from the box.\n     */\n    public unmountFooter(): void {\n        this._$userFooter$.setValue(undefined);\n    }\n\n    public getUserStyles(): HTMLStyleElement | undefined {\n        return this.$userStyles;\n    }\n\n    public mountStyles(styles: string | HTMLStyleElement): void {\n        let $styles: HTMLStyleElement;\n        if (typeof styles === \"string\") {\n            $styles = document.createElement(\"style\");\n            $styles.textContent = styles;\n        } else {\n            $styles = styles;\n        }\n        this._$userStyles$.setValue($styles);\n    }\n\n    public unmountStyles(): void {\n        this._$userStyles$.setValue(undefined);\n    }\n\n    /** DOM of the box */\n    public $box: HTMLElement;\n\n    /** DOM of the box content */\n    public $content!: HTMLElement;\n\n    /** DOM of the box stage area */\n    public $stage?: HTMLElement;\n\n    /** DOM of the box title bar */\n    public $titleBar!: HTMLElement;\n\n    /** DOM of the box footer */\n    public $footer!: HTMLElement;\n\n    private _render(): HTMLElement {\n        if (this.$box) {\n            return this.$box;\n        }\n\n        this.$box = document.createElement(\"div\");\n\n        this.$box.classList.add(this.wrapClassName(\"box\"));\n\n        const bindClassName = <TValue>(\n            el: Element,\n            val: ReadonlyVal<TValue, boolean>,\n            className: string,\n            predicate: (value: TValue) => boolean = isTruthy\n        ): string => {\n            return this._sideEffect.add(() => {\n                const wrappedClassName = this.wrapClassName(className);\n                return val.subscribe((value) => {\n                    el.classList.toggle(wrappedClassName, predicate(value));\n                });\n            });\n        };\n\n        bindClassName(this.$box, this._readonly$, \"readonly\");\n        bindClassName(this.$box, this._draggable$, \"no-drag\", isFalsy);\n        bindClassName(this.$box, this._resizable$, \"no-resize\", isFalsy);\n        bindClassName(this.$box, this._focus$, \"blur\", isFalsy);\n        bindClassName(this.$box, this._darkMode$, \"color-scheme-dark\");\n        bindClassName(\n            this.$box,\n            this._darkMode$,\n            \"color-scheme-light\",\n            isFalsy\n        );\n\n        this._sideEffect.add(() => {\n            const minimizedClassName = this.wrapClassName(\"minimized\");\n            const maximizedClassName = this.wrapClassName(\"maximized\");\n            const MAXIMIZED_TIMER_ID = \"box-maximized-timer\";\n\n            return this._state$.subscribe((state) => {\n                this.$box.classList.toggle(\n                    minimizedClassName,\n                    state === TELE_BOX_STATE.Minimized\n                );\n\n                if (state === TELE_BOX_STATE.Maximized) {\n                    this._sideEffect.flush(MAXIMIZED_TIMER_ID);\n                    this.$box.classList.toggle(maximizedClassName, true);\n                } else {\n                    // delay so that transition won't be triggered\n                    this._sideEffect.setTimeout(\n                        () => {\n                            this.$box.classList.toggle(\n                                maximizedClassName,\n                                false\n                            );\n                        },\n                        0,\n                        MAXIMIZED_TIMER_ID\n                    );\n                }\n            });\n        });\n\n        this._sideEffect.addDisposer(\n            this._visible$.subscribe((visible) => {\n                this.$box.style.display = visible ? \"block\" : \"none\";\n            })\n        );\n\n        this._sideEffect.addDisposer(\n            this._zIndex$.subscribe((zIndex) => {\n                this.$box.style.zIndex = String(zIndex);\n            })\n        );\n\n        this.$box.dataset.teleBoxID = this.id;\n\n        const boxStyler = styler(this.$box);\n\n        const boxStyles$ = combine(\n            [\n                this._maximized$,\n                this._minimized$,\n                this._pxIntrinsicSize$,\n                this._pxIntrinsicCoord$,\n                this._collectorRect$,\n                this._rootRect$,\n                this._managerStageRect$,\n            ],\n            ([\n                maximized,\n                minimized,\n                pxIntrinsicSize,\n                pxIntrinsicCoord,\n                collectorRect,\n                rootRect,\n                managerStageRect,\n            ]) => {\n                const styles: {\n                    x: number;\n                    y: number;\n                    width: number;\n                    height: number;\n                    scaleX: number;\n                    scaleY: number;\n                } = maximized\n                    ? {\n                          x: -managerStageRect.x,\n                          y: -managerStageRect.y,\n                          width: rootRect.width,\n                          height: rootRect.height,\n                          scaleX: 1,\n                          scaleY: 1,\n                      }\n                    : {\n                          x: pxIntrinsicCoord.x,\n                          y: pxIntrinsicCoord.y,\n                          width: pxIntrinsicSize.width,\n                          height: pxIntrinsicSize.height,\n                          scaleX: 1,\n                          scaleY: 1,\n                      };\n                if (minimized && collectorRect) {\n                    const { width: boxWidth, height: boxHeight } = maximized\n                        ? this.rootRect\n                        : pxIntrinsicSize;\n                    styles.x =\n                        collectorRect.x -\n                        boxWidth / 2 +\n                        collectorRect.width / 2 -\n                        managerStageRect.x;\n                    styles.y =\n                        collectorRect.y -\n                        boxHeight / 2 +\n                        collectorRect.height / 2 -\n                        managerStageRect.y;\n                    styles.scaleX = collectorRect.width / boxWidth;\n                    styles.scaleY = collectorRect.height / boxHeight;\n                }\n                return styles;\n            },\n            { compare: shallowequal }\n        );\n\n        const boxStyles = boxStyles$.value;\n        this.$box.style.width = boxStyles.width + \"px\";\n        this.$box.style.height = boxStyles.height + \"px\";\n        // Add 10px offset on first frame\n        // which creates a subtle moving effect\n        this.$box.style.transform = `translate(${boxStyles.x - 10}px,${\n            boxStyles.y - 10\n        }px)`;\n\n        this._sideEffect.addDisposer(\n            boxStyles$.subscribe((styles) => {\n                boxStyler.set(styles);\n            })\n        );\n\n        const $boxMain = document.createElement(\"div\");\n        $boxMain.className = this.wrapClassName(\"box-main\");\n        this.$box.appendChild($boxMain);\n\n        const $titleBar = document.createElement(\"div\");\n        $titleBar.className = this.wrapClassName(\"titlebar-wrap\");\n        $titleBar.appendChild(this.titleBar.render());\n        this.$titleBar = $titleBar;\n\n        const $contentWrap = document.createElement(\"div\");\n        $contentWrap.className = this.wrapClassName(\"content-wrap\");\n\n        const $content = document.createElement(\"div\");\n        $content.className =\n            this.wrapClassName(\"content\") + \" tele-fancy-scrollbar\";\n        this.$content = $content;\n        this._sideEffect.addDisposer(\n            combine(\n                [this._contentStyle$, this._managerContainerStyle$],\n                ([contentStyle, managerContainerStyle]) =>\n                    contentStyle ?? managerContainerStyle\n            ).subscribe((style) => ($content.style.cssText = style))\n        );\n\n        const updateContentRect = (): void => {\n            const rect = $content.getBoundingClientRect();\n            this._contentRect$.setValue({\n                x: 0,\n                y: 0,\n                width: rect.width,\n                height: rect.height,\n            });\n        };\n        this._sideEffect.add(() => {\n            const observer = new ResizeObserver(() => {\n                if (!this.minimized) {\n                    updateContentRect();\n                }\n            });\n            observer.observe($content);\n            return () => observer.disconnect();\n        });\n        this._sideEffect.addDisposer(\n            this._minimized$.reaction((minimized) => {\n                // correct content size when restoring from minimized\n                if (!minimized) {\n                    this._sideEffect.setTimeout(\n                        updateContentRect,\n                        400,\n                        \"minimized-content-rect-fix\"\n                    );\n                }\n            })\n        );\n\n        this._sideEffect.add(() => {\n            let last$userStyles: HTMLStyleElement | undefined;\n            return this._$userStyles$.subscribe(($userStyles) => {\n                if (last$userStyles) {\n                    last$userStyles.remove();\n                }\n                last$userStyles = $userStyles;\n                if ($userStyles) {\n                    $contentWrap.appendChild($userStyles);\n                }\n            });\n        });\n\n        this._sideEffect.add(() => {\n            let last$userContent: HTMLElement | undefined;\n            return this._$userContent$.subscribe(($userContent) => {\n                if (last$userContent) {\n                    last$userContent.remove();\n                }\n                last$userContent = $userContent;\n                if ($userContent) {\n                    $content.appendChild($userContent);\n                }\n            });\n        });\n\n        this._sideEffect.add(() => {\n            let last$userStage: HTMLElement | undefined;\n            return this._$userStage$.subscribe(($userStage) => {\n                if (last$userStage) {\n                    last$userStage.remove();\n                }\n                last$userStage = $userStage;\n                if ($userStage) {\n                    if (!this.$stage) {\n                        this.$stage = this._renderStage();\n                        $content.appendChild(this.$stage);\n                    }\n                    if (!this.$stage.parentElement) {\n                        $content.appendChild(this.$stage);\n                    }\n                    this.$stage.appendChild($userStage);\n                } else if (this.$stage?.parentElement) {\n                    this.$stage.remove();\n                }\n            });\n        });\n\n        $contentWrap.appendChild($content);\n\n        const $footer = document.createElement(\"div\");\n        $footer.className = this.wrapClassName(\"footer-wrap\");\n        this.$footer = $footer;\n\n        this._sideEffect.add(() => {\n            let last$userFooter: HTMLElement | undefined;\n            return this._$userFooter$.subscribe(($userFooter) => {\n                if (last$userFooter) {\n                    last$userFooter.remove();\n                }\n                last$userFooter = $userFooter;\n                if ($userFooter) {\n                    $footer.appendChild($userFooter);\n                }\n            });\n        });\n\n        $boxMain.appendChild($titleBar);\n        $boxMain.appendChild($contentWrap);\n        $boxMain.appendChild($footer);\n\n        this._renderResizeHandlers();\n\n        return this.$box;\n    }\n\n    private _renderStage(): HTMLDivElement {\n        const $stage = document.createElement(\"div\");\n\n        $stage.className = this.wrapClassName(\"content-stage\");\n        const updateContentStageRect = (\n            contentStageRect: TeleBoxRect\n        ): void => {\n            $stage.style.top = contentStageRect.y + \"px\";\n            $stage.style.left = contentStageRect.x + \"px\";\n            $stage.style.width = contentStageRect.width + \"px\";\n            $stage.style.height = contentStageRect.height + \"px\";\n        };\n        this._sideEffect.addDisposer(\n            [\n                combine(\n                    [this._contentStageStyle$, this._managerStageStyle$],\n                    ([contentStageStyle, managerStageStyle]) =>\n                        contentStageStyle ?? managerStageStyle\n                ).subscribe((styles) => {\n                    $stage.style.cssText = styles;\n                    updateContentStageRect(this._contentStageRect$.value);\n                }),\n                this._contentStageRect$.subscribe(updateContentStageRect),\n            ],\n            \"content-stage-styles\"\n        );\n        return $stage;\n    }\n\n    private _handleTrackStart?: (ev: MouseEvent | TouchEvent) => void;\n\n    public handleTrackStart: (ev: MouseEvent | TouchEvent) => void = (ev) => {\n        return this._handleTrackStart?.(ev);\n    };\n\n    private _renderResizeHandlers(): void {\n        const $resizeHandles = document.createElement(\"div\");\n        $resizeHandles.className = this.wrapClassName(\"resize-handles\");\n\n        Object.values(TELE_BOX_RESIZE_HANDLE).forEach((handleType) => {\n            const $handle = document.createElement(\"div\");\n            $handle.className =\n                this.wrapClassName(handleType) +\n                \" \" +\n                this.wrapClassName(\"resize-handle\");\n            $handle.dataset.teleBoxHandle = handleType;\n\n            $resizeHandles.appendChild($handle);\n        });\n\n        this.$box.appendChild($resizeHandles);\n\n        const TRACKING_DISPOSER_ID = \"handle-tracking-listener\";\n        const transformingClassName = this.wrapClassName(\"transforming\");\n\n        let $trackMask: HTMLElement | undefined;\n\n        let trackStartX = 0;\n        let trackStartY = 0;\n\n        let trackStartWidth = 0;\n        let trackStartHeight = 0;\n\n        let trackStartPageX = 0;\n        let trackStartPageY = 0;\n\n        let trackingHandle: TeleBoxHandleType | undefined;\n\n        const handleTracking = (ev: MouseEvent | TouchEvent): void => {\n            if (this.state !== TELE_BOX_STATE.Normal) {\n                return;\n            }\n\n            preventEvent(ev);\n\n            let { pageX, pageY } = flattenEvent(ev);\n            if (pageY < 0) {\n                pageY = 0;\n            }\n\n            const offsetX = pageX - trackStartPageX;\n            const offsetY = pageY - trackStartPageY;\n\n            let { x: newX, y: newY } = this.pxIntrinsicCoord;\n            let { width: newWidth, height: newHeight } = this.pxIntrinsicSize;\n\n            switch (trackingHandle) {\n                case TELE_BOX_RESIZE_HANDLE.North: {\n                    newY = trackStartY + offsetY;\n                    newHeight = trackStartHeight - offsetY;\n                    break;\n                }\n                // eslint-disable-next-line no-fallthrough\n                case TELE_BOX_RESIZE_HANDLE.South: {\n                    newHeight = trackStartHeight + offsetY;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.West: {\n                    newX = trackStartX + offsetX;\n                    newWidth = trackStartWidth - offsetX;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.East: {\n                    newWidth = trackStartWidth + offsetX;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.NorthWest: {\n                    newX = trackStartX + offsetX;\n                    newY = trackStartY + offsetY;\n                    newWidth = trackStartWidth - offsetX;\n                    newHeight = trackStartHeight - offsetY;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.NorthEast: {\n                    newY = trackStartY + offsetY;\n                    newWidth = trackStartWidth + offsetX;\n                    newHeight = trackStartHeight - offsetY;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.SouthEast: {\n                    newWidth = trackStartWidth + offsetX;\n                    newHeight = trackStartHeight + offsetY;\n                    break;\n                }\n                case TELE_BOX_RESIZE_HANDLE.SouthWest: {\n                    newX = trackStartX + offsetX;\n                    newWidth = trackStartWidth - offsetX;\n                    newHeight = trackStartHeight + offsetY;\n                    break;\n                }\n                default: {\n                    this.move(trackStartX + offsetX, trackStartY + offsetY);\n                    return;\n                }\n            }\n\n            this.transform(newX, newY, newWidth, newHeight);\n        };\n\n        const handleTrackEnd = (ev: MouseEvent | TouchEvent): void => {\n            trackingHandle = void 0;\n\n            if (!$trackMask) {\n                return;\n            }\n\n            preventEvent(ev);\n\n            this.$box.classList.toggle(transformingClassName, false);\n\n            this._sideEffect.flush(TRACKING_DISPOSER_ID);\n\n            $trackMask.remove();\n        };\n\n        const handleTrackStart = (ev: MouseEvent | TouchEvent): void => {\n            if (this.readonly) {\n                return;\n            }\n\n            if (\n                (ev as MouseEvent).button != null &&\n                (ev as MouseEvent).button !== 0\n            ) {\n                // Not left mouse\n                return;\n            }\n\n            if (\n                !this.draggable ||\n                trackingHandle ||\n                this.state !== TELE_BOX_STATE.Normal\n            ) {\n                return;\n            }\n\n            const target = ev.target as HTMLElement;\n            if (target.dataset?.teleBoxHandle) {\n                preventEvent(ev);\n\n                ({ x: trackStartX, y: trackStartY } = this.pxIntrinsicCoord);\n                ({ width: trackStartWidth, height: trackStartHeight } =\n                    this.pxIntrinsicSize);\n\n                ({ pageX: trackStartPageX, pageY: trackStartPageY } =\n                    flattenEvent(ev));\n\n                trackingHandle = target.dataset\n                    .teleBoxHandle as TELE_BOX_RESIZE_HANDLE;\n\n                if (!$trackMask) {\n                    $trackMask = document.createElement(\"div\");\n                }\n\n                const cursor = trackingHandle\n                    ? this.wrapClassName(`cursor-${trackingHandle}`)\n                    : \"\";\n\n                $trackMask.className = this.wrapClassName(\n                    `track-mask${cursor ? ` ${cursor}` : \"\"}`\n                );\n\n                this.$box.appendChild($trackMask);\n\n                this.$box.classList.add(transformingClassName);\n\n                this._sideEffect.add(() => {\n                    window.addEventListener(\"mousemove\", handleTracking);\n                    window.addEventListener(\"touchmove\", handleTracking, {\n                        passive: false,\n                    });\n                    window.addEventListener(\"mouseup\", handleTrackEnd);\n                    window.addEventListener(\"touchend\", handleTrackEnd, {\n                        passive: false,\n                    });\n                    window.addEventListener(\"touchcancel\", handleTrackEnd, {\n                        passive: false,\n                    });\n\n                    return () => {\n                        window.removeEventListener(\"mousemove\", handleTracking);\n                        window.removeEventListener(\"touchmove\", handleTracking);\n                        window.removeEventListener(\"mouseup\", handleTrackEnd);\n                        window.removeEventListener(\"touchend\", handleTrackEnd);\n                        window.removeEventListener(\n                            \"touchcancel\",\n                            handleTrackEnd\n                        );\n                    };\n                }, TRACKING_DISPOSER_ID);\n            }\n        };\n\n        this._handleTrackStart = handleTrackStart;\n\n        this._sideEffect.addEventListener(\n            $resizeHandles,\n            \"mousedown\",\n            handleTrackStart,\n            {},\n            \"box-resizeHandles-mousedown\"\n        );\n\n        this._sideEffect.addEventListener(\n            $resizeHandles,\n            \"touchstart\",\n            handleTrackStart,\n            { passive: false },\n            \"box-resizeHandles-touchstart\"\n        );\n    }\n\n    public async destroy(): Promise<void> {\n        this.$box.remove();\n        this._sideEffect.flushAll();\n        this._sideEffect.flushAll();\n\n        await this.events.emit(TELE_BOX_EVENT.Destroyed);\n        this.events.clearListeners();\n        this._delegateEvents.clearListeners();\n    }\n\n    /**\n     * Wrap a className with namespace\n     */\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n}\n\ntype PropKeys<K = keyof TeleBox> = K extends keyof TeleBox\n    ? // eslint-disable-next-line @typescript-eslint/ban-types\n      TeleBox[K] extends Function\n        ? never\n        : K\n    : never;\n\nexport type ReadonlyTeleBox = Pick<\n    TeleBox,\n    | PropKeys\n    | \"wrapClassName\"\n    | \"mountContent\"\n    | \"unmountContent\"\n    | \"mountFooter\"\n    | \"unmountFooter\"\n    | \"mountStage\"\n    | \"unmountStage\"\n    | \"mountStyles\"\n    | \"unmountStyles\"\n    | \"setContentStageRatio\"\n    | \"setContentStageStyle\"\n    | \"setContentStyle\"\n    | \"setDraggable\"\n    | \"setResizable\"\n    | \"setTitle\"\n    | \"setBoxRatio\"\n    | \"setVisible\"\n    | \"handleTrackStart\"\n    | \"onValChanged\"\n>;\n","export enum TELE_BOX_MANAGER_EVENT {\n    Focused = \"focused\",\n    Blurred = \"blurred\",\n    Created = \"created\",\n    Removed = \"removed\",\n    State = \"state\",\n    Maximized = \"maximized\",\n    Minimized = \"minimized\",\n    IntrinsicMove = \"intrinsic_move\",\n    IntrinsicResize = \"intrinsic_resize\",\n    ZIndex = \"z_index\",\n    PrefersColorScheme = \"prefers_color_scheme\",\n    DarkMode = \"dark_mode\",\n}\n","import \"./style.scss\";\nimport collectorSVG from \"./icons/collector.svg\";\nimport type { TeleStyles } from \"../typings\";\nimport type {\n    ReadonlyVal,\n    ReadonlyValEnhancedResult,\n    ValEnhancedResult,\n} from \"value-enhancer\";\nimport { derive } from \"value-enhancer\";\nimport {\n    withValueEnhancer,\n    combine,\n    Val,\n    withReadonlyValueEnhancer,\n    ValManager,\n} from \"value-enhancer\";\nimport { SideEffectManager } from \"side-effect-manager\";\nimport type { TeleBoxRect } from \"../TeleBox/typings\";\n\nexport interface TeleBoxCollectorConfig {\n    namespace?: string;\n    styles?: TeleStyles;\n    root$: ReadonlyVal<HTMLElement | null>;\n    minimized$: Val<boolean>;\n    readonly$: ReadonlyVal<boolean>;\n    darkMode$: ReadonlyVal<boolean>;\n}\n\ntype ValConfig = {\n    styles: Val<TeleStyles>;\n    $collector: Val<HTMLElement>;\n};\n\ntype PropsValConfig = {\n    root: TeleBoxCollectorConfig[\"root$\"];\n};\n\ntype MyReadonlyValConfig = {\n    rect: ReadonlyVal<TeleBoxRect | undefined>;\n    visible: ReadonlyVal<boolean>;\n};\n\ntype CombinedValEnhancedResult = ValEnhancedResult<ValConfig> &\n    ReadonlyValEnhancedResult<PropsValConfig & MyReadonlyValConfig>;\n\nexport interface TeleBoxCollector extends CombinedValEnhancedResult {}\n\nexport class TeleBoxCollector {\n    public constructor({\n        minimized$,\n        readonly$,\n        darkMode$,\n        namespace = \"telebox\",\n        styles = {},\n        root$,\n    }: TeleBoxCollectorConfig) {\n        this.namespace = namespace;\n\n        const valManager = new ValManager();\n        this._sideEffect.addDisposer(() => valManager.destroy());\n\n        const rect$ = new Val<TeleBoxRect | undefined>(void 0);\n        const visible$ = derive(minimized$);\n        const styles$ = new Val(styles);\n        const el$ = new Val<HTMLElement>(document.createElement(\"button\"));\n\n        const valConfig: ValConfig = {\n            styles: styles$,\n            $collector: el$,\n        };\n\n        withValueEnhancer(this, valConfig, valManager);\n\n        const propsValConfig: PropsValConfig = {\n            root: root$,\n        };\n\n        withReadonlyValueEnhancer(this, propsValConfig);\n\n        const myReadonlyValConfig: MyReadonlyValConfig = {\n            rect: rect$,\n            visible: visible$,\n        };\n\n        withReadonlyValueEnhancer(this, myReadonlyValConfig, valManager);\n\n        el$.value.className = this.wrapClassName(\"collector\");\n        el$.value.style.backgroundImage = `url('${collectorSVG}')`;\n\n        this._sideEffect.addDisposer(\n            el$.subscribe(($collector) => {\n                this._sideEffect.addEventListener(\n                    $collector,\n                    \"click\",\n                    () => {\n                        if (!readonly$.value) {\n                            minimized$.setValue(false);\n                        }\n                    },\n                    {},\n                    \"telebox-collector-click\"\n                );\n\n                this._sideEffect.addDisposer(\n                    [\n                        visible$.subscribe((visible) => {\n                            $collector.classList.toggle(\n                                this.wrapClassName(\"collector-visible\"),\n                                visible\n                            );\n                        }),\n                        readonly$.subscribe((readonly) => {\n                            $collector.classList.toggle(\n                                this.wrapClassName(\"collector-readonly\"),\n                                readonly\n                            );\n                        }),\n                        darkMode$.subscribe((darkMode) => {\n                            $collector.classList.toggle(\n                                this.wrapClassName(\"color-scheme-dark\"),\n                                darkMode\n                            );\n                            $collector.classList.toggle(\n                                this.wrapClassName(\"color-scheme-light\"),\n                                !darkMode\n                            );\n                        }),\n                        styles$.subscribe((styles) => {\n                            Object.keys(styles).forEach((key) => {\n                                const value = styles[\n                                    key as keyof TeleStyles\n                                ] as string;\n                                if (value != null) {\n                                    $collector.style[key as keyof TeleStyles] =\n                                        value;\n                                }\n                            });\n                        }),\n                        root$.subscribe((root) => {\n                            if (root) {\n                                root.appendChild($collector);\n                            }\n                        }),\n                        // Place after $collector appended to the DOM so that rect calc works\n                        combine([minimized$, root$]).subscribe(\n                            ([minimized, root]) => {\n                                if (minimized && root) {\n                                    const { x, y, width, height } =\n                                        $collector.getBoundingClientRect();\n                                    const rootRect =\n                                        root.getBoundingClientRect();\n                                    rect$.setValue({\n                                        x: x - rootRect.x,\n                                        y: y - rootRect.y,\n                                        width,\n                                        height,\n                                    });\n                                }\n                            }\n                        ),\n                    ],\n                    \"telebox-collector-el\"\n                );\n            })\n        );\n    }\n\n    public readonly namespace: string;\n\n    protected readonly _sideEffect = new SideEffectManager();\n\n    public destroy(): void {\n        this._sideEffect.flushAll();\n    }\n\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n}\n","import \"./style.scss\";\n\nimport type { TeleBox } from \"../../TeleBox\";\nimport type { DefaultTitleBarConfig } from \"../../TeleTitleBar\";\nimport { DefaultTitleBar } from \"../../TeleTitleBar\";\nimport { TELE_BOX_STATE } from \"../../TeleBox/constants\";\nimport type { TeleBoxRect } from \"../../TeleBox/typings\";\nimport type { ReadonlyVal } from \"value-enhancer\";\nimport { combine } from \"value-enhancer\";\n\nexport type MaxTitleBarTitle = Pick<TeleBox, \"id\" | \"title\">;\n\nexport interface MaxTitleBarConfig extends DefaultTitleBarConfig {\n    darkMode$: ReadonlyVal<boolean>;\n    boxes$: ReadonlyVal<TeleBox[]>;\n    rootRect$: ReadonlyVal<TeleBoxRect>;\n    root$: ReadonlyVal<HTMLElement | null>;\n}\n\nexport class MaxTitleBar extends DefaultTitleBar {\n    public constructor(config: MaxTitleBarConfig) {\n        super(config);\n\n        this.boxes$ = config.boxes$;\n        this.rootRect$ = config.rootRect$;\n        this.darkMode$ = config.darkMode$;\n\n        this.sideEffect.addDisposer(\n            config.root$.subscribe((root) => {\n                if (root) {\n                    root.appendChild(this.render());\n                } else if (this.$titleBar?.parentNode) {\n                    this.$titleBar.remove();\n                }\n            })\n        );\n    }\n\n    public focusBox(box?: TeleBox): void {\n        if (this.focusedBox && this.focusedBox === box) {\n            return;\n        }\n\n        if (this.$titles && this.state$.value === TELE_BOX_STATE.Maximized) {\n            const { children } = this.$titles.firstElementChild as HTMLElement;\n            for (let i = children.length - 1; i >= 0; i -= 1) {\n                const $tab = children[i] as HTMLElement;\n                const id = $tab.dataset?.teleBoxID;\n                if (id) {\n                    if (box && id === box.id) {\n                        $tab.classList.toggle(\n                            this.wrapClassName(\"titles-tab-focus\"),\n                            true\n                        );\n                    } else if (this.focusedBox && id === this.focusedBox.id) {\n                        $tab.classList.toggle(\n                            this.wrapClassName(\"titles-tab-focus\"),\n                            false\n                        );\n                    }\n                }\n            }\n        }\n        this.focusedBox = box;\n    }\n\n    public render(): HTMLElement {\n        if (this.$titleBar) {\n            return this.$titleBar;\n        }\n\n        const $titleBar = super.render();\n\n        $titleBar.classList.add(this.wrapClassName(\"max-titlebar\"));\n\n        this.sideEffect.addDisposer(\n            [\n                this.state$.subscribe((state) => {\n                    $titleBar.classList.toggle(\n                        this.wrapClassName(\"max-titlebar-maximized\"),\n                        state === TELE_BOX_STATE.Maximized\n                    );\n                }),\n                this.readonly$.subscribe((readonly) => {\n                    $titleBar.classList.toggle(\n                        this.wrapClassName(\"readonly\"),\n                        readonly\n                    );\n                }),\n                this.darkMode$.subscribe((darkMode) => {\n                    $titleBar.classList.toggle(\n                        this.wrapClassName(\"color-scheme-dark\"),\n                        darkMode\n                    );\n                    $titleBar.classList.toggle(\n                        this.wrapClassName(\"color-scheme-light\"),\n                        !darkMode\n                    );\n                }),\n                combine([this.state$, this.boxes$]).subscribe(\n                    ([state, titles]) => {\n                        if (state === TELE_BOX_STATE.Maximized) {\n                            $titleBar.classList.toggle(\n                                this.wrapClassName(\"max-titlebar-single-title\"),\n                                titles.length === 1\n                            );\n                            if (titles.length !== 1) {\n                                $titleBar.replaceChild(\n                                    this.renderTitles(),\n                                    $titleBar.firstElementChild as HTMLElement\n                                );\n                            }\n                        }\n                    }\n                ),\n            ],\n            \"max-render\"\n        );\n\n        const $titlesArea = document.createElement(\"div\");\n        $titlesArea.classList.add(this.wrapClassName(\"titles-area\"));\n        $titleBar.insertBefore($titlesArea, $titleBar.firstElementChild);\n\n        return $titleBar;\n    }\n\n    public destroy(): void {\n        super.destroy();\n        this.$titles = void 0;\n        this.focusedBox = void 0;\n    }\n\n    protected renderTitles(): HTMLElement {\n        this.$titles = document.createElement(\"div\");\n        this.$titles.className = this.wrapClassName(\"titles\");\n\n        this.sideEffect.addEventListener(\n            this.$titles,\n            \"wheel\",\n            (ev) => {\n                (ev.currentTarget as HTMLElement).scrollBy({\n                    left: ev.deltaY > 0 ? 250 : -250,\n                    behavior: \"smooth\",\n                });\n            },\n            { passive: false },\n            \"max-render-wheel-titles\"\n        );\n\n        const $content = document.createElement(\"div\");\n        $content.className = this.wrapClassName(\"titles-content\");\n        this.$titles.appendChild($content);\n\n        const disposers = this.boxes$.value.map((box) => {\n            const $tab = document.createElement(\"button\");\n            $tab.className = this.wrapClassName(\"titles-tab\");\n            $tab.textContent = box.title;\n            $tab.dataset.teleBoxID = box.id;\n            $tab.dataset.teleTitleBarNoDblClick = \"true\";\n\n            if (this.focusedBox && box.id === this.focusedBox.id) {\n                $tab.classList.add(this.wrapClassName(\"titles-tab-focus\"));\n            }\n\n            $content.appendChild($tab);\n\n            return box._title$.reaction((title) => ($tab.textContent = title));\n        });\n\n        this.sideEffect.addDisposer(\n            () => disposers.forEach((disposer) => disposer()),\n            \"max-render-tab-titles\"\n        );\n\n        return this.$titles;\n    }\n\n    public focusedBox: TeleBox | undefined;\n\n    protected darkMode$: MaxTitleBarConfig[\"darkMode$\"];\n    protected boxes$: MaxTitleBarConfig[\"boxes$\"];\n    protected rootRect$: MaxTitleBarConfig[\"rootRect$\"];\n\n    protected $titles: HTMLElement | undefined;\n}\n","import \"./style.scss\";\n\nimport shallowequal from \"shallowequal\";\nimport { ResizeObserver as ResizeObserverPolyfill } from \"@juggle/resize-observer\";\nimport { SideEffectManager } from \"side-effect-manager\";\nimport type {\n    ReadonlyVal,\n    ValEnhancedResult,\n    ReadonlyValEnhancedResult,\n} from \"value-enhancer\";\nimport { derive } from \"value-enhancer\";\nimport {\n    combine,\n    Val,\n    withValueEnhancer,\n    withReadonlyValueEnhancer,\n    ValManager,\n} from \"value-enhancer\";\nimport Emittery from \"emittery\";\nimport type {\n    ReadonlyTeleBox,\n    TeleBoxColorScheme,\n    TeleBoxRect,\n    TeleBoxState,\n} from \"../TeleBox\";\nimport {\n    TeleBox,\n    TELE_BOX_EVENT,\n    TELE_BOX_STATE,\n    TELE_BOX_COLOR_SCHEME,\n    TELE_BOX_DELEGATE_EVENT,\n} from \"../TeleBox\";\nimport { TeleBoxCollector } from \"../TeleBoxCollector\";\nimport { TELE_BOX_MANAGER_EVENT } from \"./constants\";\nimport type {\n    TeleBoxManagerConfig,\n    TeleBoxManagerCreateConfig,\n    TeleBoxManagerEventConfig,\n    TeleBoxManagerQueryConfig,\n    TeleBoxManagerUpdateConfig,\n} from \"./typings\";\nimport { MaxTitleBar } from \"./MaxTitleBar\";\nimport { calcStageRect } from \"../TeleBox/utils\";\n\nexport * from \"./typings\";\nexport * from \"./constants\";\n\nconst ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n\ntype ReadonlyValConfig = {\n    darkMode: ReadonlyVal<boolean, boolean>;\n    state: ReadonlyVal<TeleBoxState, boolean>;\n    root: Val<HTMLElement | null>;\n    rootRect: Val<TeleBoxRect>;\n    stageRect: ReadonlyVal<TeleBoxRect>;\n};\n\ntype ValConfig = {\n    prefersColorScheme: Val<TeleBoxColorScheme, boolean>;\n    readonly: Val<boolean, boolean>;\n    minimized: Val<boolean, boolean>;\n    maximized: Val<boolean, boolean>;\n    fence: Val<boolean, boolean>;\n    stageRatio: Val<number, boolean>;\n    containerStyle: Val<string>;\n    stageStyle: Val<string>;\n};\n\ntype CombinedValEnhancedResult = ValEnhancedResult<ValConfig> &\n    ReadonlyValEnhancedResult<ReadonlyValConfig>;\n\nexport interface TeleBoxManager extends CombinedValEnhancedResult {}\n\nexport class TeleBoxManager {\n    public constructor({\n        root = null,\n        prefersColorScheme = TELE_BOX_COLOR_SCHEME.Light,\n        minimized = false,\n        maximized = false,\n        fence = true,\n        collector,\n        namespace = \"telebox\",\n        readonly = false,\n        stageRatio = -1,\n        containerStyle = \"\",\n        stageStyle = \"\",\n    }: TeleBoxManagerConfig = {}) {\n        this._sideEffect = new SideEffectManager();\n\n        this.namespace = namespace;\n\n        const valManager = new ValManager();\n        this._sideEffect.addDisposer(() => valManager.destroy());\n\n        const root$ = new Val(root);\n        const readonly$ = new Val(readonly);\n        const minimized$ = new Val(minimized);\n        const maximized$ = new Val(maximized);\n        const fence$ = new Val(fence);\n        const containerStyle$ = new Val(containerStyle);\n        const stageStyle$ = new Val(stageStyle);\n        const stageRatio$ = new Val(stageRatio);\n\n        const rootRect$ = new Val<TeleBoxRect>(\n            {\n                x: 0,\n                y: 0,\n                width: window.innerWidth,\n                height: window.innerHeight,\n            },\n            { compare: shallowequal }\n        );\n        this._sideEffect.addDisposer(\n            root$.subscribe((root) => {\n                this._sideEffect.add(() => {\n                    if (!root) {\n                        return () => void 0;\n                    }\n                    const observer = new ResizeObserver(() => {\n                        const rect = root.getBoundingClientRect();\n                        rootRect$.setValue({\n                            x: 0,\n                            y: 0,\n                            width: rect.width,\n                            height: rect.height,\n                        });\n                    });\n                    observer.observe(root);\n                    return () => observer.disconnect();\n                }, \"calc-root-rect\");\n            })\n        );\n\n        const stageRect$ = combine([rootRect$, stageRatio$], calcStageRect, {\n            compare: shallowequal,\n        });\n\n        this.boxes$ = new Val<TeleBox[]>([]);\n        this.topBox$ = new Val<TeleBox | undefined>(undefined);\n        this._sideEffect.addDisposer(\n            this.boxes$.subscribe((boxes) => {\n                if (boxes.length > 0) {\n                    const topBox = boxes.reduce((topBox, box) =>\n                        topBox.zIndex > box.zIndex ? topBox : box\n                    );\n                    this.topBox$.setValue(topBox);\n                } else {\n                    this.topBox$.setValue(undefined);\n                }\n            })\n        );\n\n        const prefersDarkMatch = window.matchMedia(\n            \"(prefers-color-scheme: dark)\"\n        );\n        const prefersDark$ = new Val(false);\n        if (prefersDarkMatch) {\n            prefersDark$.setValue(prefersDarkMatch.matches);\n            this._sideEffect.add(() => {\n                const handler = (evt: MediaQueryListEvent): void => {\n                    prefersDark$.setValue(evt.matches);\n                };\n                prefersDarkMatch.addEventListener(\"change\", handler);\n                return () =>\n                    prefersDarkMatch.removeEventListener(\"change\", handler);\n            });\n        }\n\n        const prefersColorScheme$ = new Val(prefersColorScheme);\n        this._sideEffect.addDisposer(\n            prefersColorScheme$.reaction((prefersColorScheme, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        TELE_BOX_MANAGER_EVENT.PrefersColorScheme,\n                        prefersColorScheme\n                    );\n                }\n            })\n        );\n\n        const darkMode$ = combine(\n            [prefersDark$, prefersColorScheme$],\n            ([prefersDark, prefersColorScheme]) =>\n                prefersColorScheme === \"auto\"\n                    ? prefersDark\n                    : prefersColorScheme === \"dark\"\n        );\n\n        const state$ = combine(\n            [minimized$, maximized$],\n            ([minimized, maximized]): TeleBoxState =>\n                minimized\n                    ? TELE_BOX_STATE.Minimized\n                    : maximized\n                    ? TELE_BOX_STATE.Maximized\n                    : TELE_BOX_STATE.Normal\n        );\n\n        this.collector =\n            collector ??\n            new TeleBoxCollector({\n                minimized$: minimized$,\n                readonly$: readonly$,\n                darkMode$: darkMode$,\n                namespace,\n                root$,\n            });\n\n        const readonlyValConfig: ReadonlyValConfig = {\n            darkMode: darkMode$,\n            state: state$,\n            root: root$,\n            rootRect: rootRect$,\n            stageRect: stageRect$,\n        };\n\n        withReadonlyValueEnhancer(this, readonlyValConfig, valManager);\n\n        const valConfig: ValConfig = {\n            prefersColorScheme: prefersColorScheme$,\n            readonly: readonly$,\n            fence: fence$,\n            minimized: minimized$,\n            maximized: maximized$,\n            stageRatio: stageRatio$,\n            containerStyle: containerStyle$,\n            stageStyle: stageStyle$,\n        };\n\n        withValueEnhancer(this, valConfig, valManager);\n\n        const closeBtnClassName = this.wrapClassName(\"titlebar-icon-close\");\n\n        const checkFocusBox = (ev: MouseEvent | TouchEvent): void => {\n            if (readonly$.value) {\n                return;\n            }\n\n            const target = ev.target as HTMLElement;\n            if (!target.tagName) {\n                return;\n            }\n\n            for (\n                let el: HTMLElement | null = target;\n                el;\n                el = el.parentElement\n            ) {\n                if (el.classList && el.classList.contains(closeBtnClassName)) {\n                    return;\n                }\n                const id = el.dataset?.teleBoxID;\n                if (id) {\n                    const box = this.getBox(id);\n                    if (box) {\n                        this.focusBox(box);\n                        this.makeBoxTop(box);\n                        return;\n                    }\n                }\n            }\n        };\n\n        this._sideEffect.addEventListener(\n            window,\n            \"mousedown\",\n            checkFocusBox,\n            true\n        );\n        this._sideEffect.addEventListener(\n            window,\n            \"touchstart\",\n            checkFocusBox,\n            true\n        );\n\n        this.titleBar = new MaxTitleBar({\n            namespace: this.namespace,\n            title$: derive(this.topBox$, (topBox) => topBox?.title || \"\"),\n            boxes$: this.boxes$,\n            darkMode$: darkMode$,\n            readonly$: readonly$,\n            state$: state$,\n            root$,\n            rootRect$: rootRect$,\n            onEvent: (event): void => {\n                switch (event.type) {\n                    case TELE_BOX_DELEGATE_EVENT.Maximize: {\n                        maximized$.setValue(!maximized$.value);\n                        break;\n                    }\n                    case TELE_BOX_DELEGATE_EVENT.Minimize: {\n                        minimized$.setValue(true);\n                        break;\n                    }\n                    case TELE_BOX_EVENT.Close: {\n                        this.removeTopBox();\n                        this.focusTopBox();\n                        break;\n                    }\n                    default: {\n                        break;\n                    }\n                }\n            },\n        });\n\n        this._sideEffect.addDisposer([\n            state$.reaction((state, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.State, state);\n                }\n            }),\n            maximized$.reaction((maximized, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        TELE_BOX_MANAGER_EVENT.Maximized,\n                        maximized\n                    );\n                }\n            }),\n            minimized$.reaction((minimized, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        TELE_BOX_MANAGER_EVENT.Minimized,\n                        minimized\n                    );\n                }\n            }),\n            darkMode$.reaction((darkMode, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.DarkMode, darkMode);\n                }\n            }),\n        ]);\n\n        this.$container = document.createElement(\"div\");\n        this.$container.className = this.wrapClassName(\"manager-container\");\n\n        this.$stage = document.createElement(\"div\");\n        this.$stage.className = this.wrapClassName(\"manager-stage\");\n        this.$container.appendChild(this.$stage);\n\n        this._sideEffect.addDisposer([\n            darkMode$.subscribe((darkMode) => {\n                this.$container.classList.toggle(\n                    this.wrapClassName(\"color-scheme-dark\"),\n                    darkMode\n                );\n                this.$container.classList.toggle(\n                    this.wrapClassName(\"color-scheme-light\"),\n                    !darkMode\n                );\n            }),\n            maximized$.subscribe((maximized) => {\n                this.$container.classList.toggle(\"is-maximized\", maximized);\n            }),\n            minimized$.subscribe((minimized) => {\n                this.$container.classList.toggle(\"is-minimized\", minimized);\n            }),\n            containerStyle$.subscribe((containerStyle) => {\n                this.$container.style.cssText = containerStyle;\n            }),\n            stageStyle$.subscribe((stageStyle) => {\n                this.$stage.style.cssText = stageStyle;\n                this.$stage.style.width = stageRect$.value.width + \"px\";\n                this.$stage.style.height = stageRect$.value.height + \"px\";\n            }),\n            stageRect$.subscribe((stageRect) => {\n                this.$stage.style.width = stageRect.width + \"px\";\n                this.$stage.style.height = stageRect.height + \"px\";\n            }),\n            root$.subscribe((root) => {\n                if (root) {\n                    root.appendChild(this.$container);\n                } else if (this.$container.parentElement) {\n                    this.$container.remove();\n                }\n            }),\n        ]);\n    }\n\n    public readonly $container: HTMLDivElement;\n\n    public readonly $stage: HTMLDivElement;\n\n    public get boxes(): ReadonlyArray<TeleBox> {\n        return this.boxes$.value;\n    }\n\n    public get topBox(): TeleBox | undefined {\n        return this.topBox$.value;\n    }\n\n    public readonly events = new Emittery<\n        TeleBoxManagerEventConfig,\n        TeleBoxManagerEventConfig\n    >();\n\n    protected _sideEffect: SideEffectManager;\n\n    public readonly namespace: string;\n\n    /** @deprecated use setMaximized and setMinimized instead */\n    public setState(state: TeleBoxState, skipUpdate = false): this {\n        switch (state) {\n            case TELE_BOX_STATE.Maximized: {\n                this.setMinimized(false, skipUpdate);\n                this.setMaximized(true, skipUpdate);\n                break;\n            }\n            case TELE_BOX_STATE.Minimized: {\n                this.setMinimized(true, skipUpdate);\n                this.setMaximized(false, skipUpdate);\n                break;\n            }\n            default: {\n                this.setMinimized(false, skipUpdate);\n                this.setMaximized(false, skipUpdate);\n                break;\n            }\n        }\n        return this;\n    }\n\n    public create(\n        config: TeleBoxManagerCreateConfig = {},\n        smartPosition = true\n    ): ReadonlyTeleBox {\n        const box = new TeleBox({\n            zIndex: this.topBox ? this.topBox.zIndex + 1 : 100,\n            ...config,\n            ...(smartPosition ? this.smartPosition(config) : {}),\n            namespace: this.namespace,\n            root: this.$stage,\n            darkMode$: this._darkMode$,\n            maximized$: this._maximized$,\n            minimized$: this._minimized$,\n            fence$: this._fence$,\n            rootRect$: this._rootRect$,\n            managerStageRect$: this._stageRect$,\n            managerStageRatio$: this._stageRatio$,\n            readonly$: this._readonly$,\n            collectorRect$: this.collector._rect$,\n            managerContainerStyle$: this._containerStyle$,\n            managerStageStyle$: this._stageStyle$,\n        });\n\n        if (box.focus) {\n            this.focusBox(box);\n            if (smartPosition) {\n                this.makeBoxTop(box);\n            }\n        }\n\n        this.boxes$.setValue([...this.boxes, box]);\n\n        this._sideEffect.addDisposer([\n            box._delegateEvents.on(TELE_BOX_DELEGATE_EVENT.Maximize, () => {\n                this.setMaximized(!this.maximized);\n            }),\n            box._delegateEvents.on(TELE_BOX_DELEGATE_EVENT.Minimize, () => {\n                this.setMinimized(true);\n            }),\n            box._delegateEvents.on(TELE_BOX_DELEGATE_EVENT.Close, () => {\n                this.remove(box);\n                this.focusTopBox();\n            }),\n            box._intrinsicCoord$.reaction((_, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.IntrinsicMove, box);\n                }\n            }),\n            box._intrinsicSize$.reaction((_, skipUpdate) => {\n                if (!skipUpdate) {\n                    this.events.emit(\n                        TELE_BOX_MANAGER_EVENT.IntrinsicResize,\n                        box\n                    );\n                }\n            }),\n            box._zIndex$.reaction((_, skipUpdate) => {\n                if (this.boxes.length > 0) {\n                    const topBox = this.boxes.reduce((topBox, box) =>\n                        topBox.zIndex > box.zIndex ? topBox : box\n                    );\n                    this.topBox$.setValue(topBox);\n                }\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.ZIndex, box);\n                }\n            }),\n        ]);\n\n        this.events.emit(TELE_BOX_MANAGER_EVENT.Created, box);\n\n        return box;\n    }\n\n    public query(config?: TeleBoxManagerQueryConfig): ReadonlyTeleBox[] {\n        return config\n            ? this.boxes.filter(this.teleBoxMatcher(config))\n            : [...this.boxes];\n    }\n\n    public queryOne(\n        config?: TeleBoxManagerQueryConfig\n    ): ReadonlyTeleBox | undefined {\n        return config\n            ? this.boxes.find(this.teleBoxMatcher(config))\n            : this.boxes[0];\n    }\n\n    public update(\n        boxID: string,\n        config: TeleBoxManagerUpdateConfig,\n        skipUpdate = false\n    ): void {\n        const box = this.boxes.find((box) => box.id === boxID);\n        if (box) {\n            return this.updateBox(box, config, skipUpdate);\n        }\n    }\n\n    public updateAll(\n        config: TeleBoxManagerUpdateConfig,\n        skipUpdate = false\n    ): void {\n        this.boxes.forEach((box) => {\n            this.updateBox(box, config, skipUpdate);\n        });\n    }\n\n    public remove(\n        boxOrID: string | TeleBox,\n        skipUpdate = false\n    ): ReadonlyTeleBox | undefined {\n        const index = this.getBoxIndex(boxOrID);\n        if (index >= 0) {\n            const boxes = this.boxes.slice();\n            const deletedBoxes = boxes.splice(index, 1);\n            this.boxes$.setValue(boxes);\n            deletedBoxes.forEach((box) => box.destroy());\n            if (!skipUpdate) {\n                if (this.boxes.length <= 0) {\n                    this.setMaximized(false);\n                    this.setMinimized(false);\n                }\n                this.events.emit(TELE_BOX_MANAGER_EVENT.Removed, deletedBoxes);\n            }\n            return deletedBoxes[0];\n        }\n        return;\n    }\n\n    public removeTopBox(): ReadonlyTeleBox | undefined {\n        if (this.topBox) {\n            return this.remove(this.topBox);\n        }\n        return;\n    }\n\n    public removeAll(skipUpdate = false): ReadonlyTeleBox[] {\n        const deletedBoxes = this.boxes$.value;\n        this.boxes$.setValue([]);\n        deletedBoxes.forEach((box) => box.destroy());\n        if (!skipUpdate) {\n            if (this.boxes.length <= 0) {\n                this.setMaximized(false);\n                this.setMinimized(false);\n            }\n            this.events.emit(TELE_BOX_MANAGER_EVENT.Removed, deletedBoxes);\n        }\n        return deletedBoxes;\n    }\n\n    /**\n     * Mount manager to a container element.\n     */\n    public mount(root: HTMLElement): void {\n        this._root$.setValue(root);\n    }\n\n    /**\n     * Unmount manager from the container element.\n     */\n    public unmount(): void {\n        this._root$.setValue(null);\n    }\n\n    public destroy(skipUpdate = false): void {\n        this.events.clearListeners();\n        this._sideEffect.flushAll();\n        this.removeAll(skipUpdate);\n        this.collector.destroy();\n        this.titleBar.destroy();\n    }\n\n    public wrapClassName(className: string): string {\n        return `${this.namespace}-${className}`;\n    }\n\n    public focusBox(boxOrID: string | TeleBox, skipUpdate = false): void {\n        const targetBox = this.getBox(boxOrID);\n        if (targetBox) {\n            this.boxes.forEach((box) => {\n                if (targetBox === box) {\n                    let focusChanged = false;\n                    if (!targetBox.focus) {\n                        focusChanged = true;\n                        targetBox._focus$.setValue(true, skipUpdate);\n                    }\n                    if (focusChanged && !skipUpdate) {\n                        this.events.emit(\n                            TELE_BOX_MANAGER_EVENT.Focused,\n                            targetBox\n                        );\n                    }\n                } else if (box.focus) {\n                    this.blurBox(box, skipUpdate);\n                }\n            });\n            this.titleBar.focusBox(targetBox);\n        }\n    }\n\n    public focusTopBox(): void {\n        if (this.topBox && !this.topBox.focus) {\n            return this.focusBox(this.topBox);\n        }\n    }\n\n    public blurBox(boxOrID: string | TeleBox, skipUpdate = false): void {\n        const targetBox = this.getBox(boxOrID);\n        if (targetBox) {\n            if (targetBox.focus) {\n                targetBox._focus$.setValue(false, skipUpdate);\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.Blurred, targetBox);\n                }\n            }\n            if (this.titleBar.focusedBox === targetBox) {\n                this.titleBar.focusBox();\n            }\n        }\n    }\n\n    public blurAll(skipUpdate = false): void {\n        this.boxes.forEach((box) => {\n            if (box.focus) {\n                box._focus$.setValue(false, skipUpdate);\n                if (!skipUpdate) {\n                    this.events.emit(TELE_BOX_MANAGER_EVENT.Blurred, box);\n                }\n            }\n        });\n        if (this.titleBar.focusedBox) {\n            this.titleBar.focusBox();\n        }\n    }\n\n    public collector: TeleBoxCollector;\n    public titleBar: MaxTitleBar;\n\n    protected boxes$: Val<TeleBox[]>;\n    protected topBox$: Val<TeleBox | undefined>;\n\n    protected teleBoxMatcher(\n        config: TeleBoxManagerQueryConfig\n    ): (box: TeleBox) => boolean {\n        const keys = Object.keys(config) as Array<\n            keyof TeleBoxManagerQueryConfig\n        >;\n        return (box: TeleBox): boolean =>\n            keys.every((key) => config[key] === box[key]);\n    }\n\n    protected updateBox(\n        box: TeleBox,\n        config: TeleBoxManagerUpdateConfig,\n        skipUpdate = false\n    ): void {\n        if (config.x != null || config.y != null) {\n            box._intrinsicCoord$.setValue(\n                {\n                    x: config.x ?? box.intrinsicX,\n                    y: config.y ?? box.intrinsicY,\n                },\n                skipUpdate\n            );\n        }\n        if (config.width != null || config.height != null) {\n            box._intrinsicSize$.setValue(\n                {\n                    width: config.width ?? box.intrinsicWidth,\n                    height: config.height ?? box.intrinsicHeight,\n                },\n                skipUpdate\n            );\n        }\n        if (config.title != null) {\n            box._title$.setValue(config.title);\n        }\n        if (config.visible != null) {\n            box._visible$.setValue(config.visible, skipUpdate);\n        }\n        if (config.resizable != null) {\n            box._resizable$.setValue(config.resizable, skipUpdate);\n        }\n        if (config.draggable != null) {\n            box._draggable$.setValue(config.draggable, skipUpdate);\n        }\n        if (config.boxRatio != null) {\n            box._boxRatio$.setValue(config.boxRatio, skipUpdate);\n        }\n        if (config.zIndex != null) {\n            box._zIndex$.setValue(config.zIndex, skipUpdate);\n        }\n        if (config.contentStageRatio !== undefined) {\n            box.setContentStageRatio(config.contentStageRatio, skipUpdate);\n        }\n        if (config.content != null) {\n            box.mountContent(config.content);\n        }\n        if (config.footer != null) {\n            box.mountFooter(config.footer);\n        }\n        if (config.minHeight != null || config.minWidth != null) {\n            box._minSize$.setValue(\n                {\n                    width: config.minWidth ?? box.minWidth,\n                    height: config.minHeight ?? box.minHeight,\n                },\n                skipUpdate\n            );\n        }\n    }\n\n    /** Keep new boxes staggered inside stage area */\n    protected smartPosition(rect: Partial<TeleBoxRect>): TeleBoxRect {\n        let { x, y } = rect;\n        const { width = 0.5, height = 0.5 } = rect;\n        const stageRect = this.stageRect;\n        const topBox = this.topBox;\n\n        if (x == null) {\n            let pxX = 20;\n            if (topBox) {\n                const pxPreferredX = topBox.pxIntrinsicCoord.x + 20;\n                const pxIntrinsicWidth = width * stageRect.width;\n                if (pxPreferredX + pxIntrinsicWidth <= stageRect.width) {\n                    pxX = pxPreferredX;\n                }\n            }\n            x = pxX / stageRect.width;\n        }\n\n        if (y == null) {\n            let pxY = 20;\n            if (topBox) {\n                const pxPreferredY = topBox.pxIntrinsicCoord.y + 20;\n                const pxIntrinsicHeight = height * stageRect.height;\n                if (pxPreferredY + pxIntrinsicHeight <= stageRect.height) {\n                    pxY = pxPreferredY;\n                }\n            }\n            y = pxY / stageRect.height;\n        }\n\n        return { x, y, width, height };\n    }\n\n    protected makeBoxTop(box: TeleBox, skipUpdate = false): void {\n        if (this.topBox) {\n            if (box !== this.topBox) {\n                box._zIndex$.setValue(this.topBox.zIndex + 1, skipUpdate);\n            }\n        }\n    }\n\n    protected getBoxIndex(boxOrID: TeleBox | string): number {\n        return typeof boxOrID === \"string\"\n            ? this.boxes.findIndex((box) => box.id === boxOrID)\n            : this.boxes.findIndex((box) => box === boxOrID);\n    }\n\n    protected getBox(boxOrID: TeleBox | string): TeleBox | undefined {\n        return typeof boxOrID === \"string\"\n            ? this.boxes.find((box) => box.id === boxOrID)\n            : boxOrID;\n    }\n}\n"],"names":["TELE_BOX_COLOR_SCHEME","TELE_BOX_COLOR_SCHEME2","TELE_BOX_STATE","TELE_BOX_STATE2","TELE_BOX_EVENT","TELE_BOX_EVENT2","TELE_BOX_DELEGATE_EVENT","TELE_BOX_DELEGATE_EVENT2","TELE_BOX_RESIZE_HANDLE","TELE_BOX_RESIZE_HANDLE2","TeleBoxDragHandleType","value","min","max","Math","ev","stopPropagation","cancelable","preventDefault","touches","defaultBoxCount","Boolean","constructor","readonly$","state$","title$","buttons","onEvent","onDragStart","namespace","SideEffectManager","timestamp","clientX","clientY","this","button","target","dataset","teleTitleBarNoDblClick","now","Date","lastTitleBarClick","abs","type","Maximize","lastTitleBarTouch","Minimize","iconClassName","wrapClassName","isActive","state","Maximized","Close","$dragArea","renderDragArea","render","$titleBar","document","createElement","className","$titleArea","teleBoxHandle","$title","appendChild","$buttonsContainer","forEach","i","teleTitleBarBtnIndex","String","$btn","sideEffect","addDisposer","subscribe","title","textContent","btn","children","classList","toggle","addEventListener","Number","isNaN","length","handleTitleBarClick","handleTitleBarTouch","passive","dragHandle","destroy","flushAll","rootRect","ratio","width","height","preferredHeight","x","y","preferredWidth","ResizeObserver","window","ResizeObserverPolyfill","id","genUID","getBoxDefaultName","visible","minWidth","minHeight","resizable","draggable","boxRatio","focus","zIndex","contentStageRatio","titleBar","content","stage","footer","styles","contentStyle","contentStageStyle","darkMode$","fence$","minimized$","maximized$","root","rootRect$","managerStageRect$","managerStageRatio$","managerContainerStyle$","managerStageStyle$","collectorRect$","Emittery","_handleTrackStart","_sideEffect","valManager","ValManager","Val","visible$","resizable$","draggable$","boxRatio$","zIndex$","focus$","$userContent$","$userStage$","$userFooter$","$userStyles$","combine","minimized","maximized","Minimized","Normal","minSize$","clamp","compare","shallowequal","pxMinSize$","minSize","managerStageRect","intrinsicSize$","reaction","skipUpdate","setValue","intrinsicCoord$","pxIntrinsicSize$","size","pxIntrinsicCoord$","intrinsicCoord","contentStyle$","contentStageStyle$","contentRoot$","contentRect$","contentStageRatio$","finalStageRatio$","contentStageRatio2","managerStageRatio","contentStageRect$","calcStageRect","darkMode","fence","readonly","managerContainerStyle","managerStageStyle","collectorRect","$userContent","$userStage","$userFooter","$userStyles","pxMinSize","intrinsicSize","pxIntrinsicSize","pxIntrinsicCoord","contentRect","contentStageRect","DefaultTitleBar","event","_delegateEvents","emit","boxRatio2","transform","move","$box","_render","$content","parentElement","watchValEvent","val","v","events","DarkMode","Readonly","ZIndex","State","IntrinsicResize","IntrinsicMove","visible2","focus2","Focus","Blur","_minSize$","setMinWidth","setMinHeight","resize","_intrinsicSize$","_intrinsicCoord$","safeX","safeY","newHeight","mountContent","_$userContent$","unmountContent","mountStage","_$userStage$","unmountStage","mountFooter","_$userFooter$","unmountFooter","getUserStyles","mountStyles","$styles","_$userStyles$","unmountStyles","add","bindClassName","el","predicate","isTruthy","wrappedClassName","_readonly$","_draggable$","isFalsy","_resizable$","_focus$","_darkMode$","minimizedClassName","maximizedClassName","MAXIMIZED_TIMER_ID","_state$","flush","setTimeout","_visible$","style","display","_zIndex$","teleBoxID","boxStyler","styler","boxStyles$","_maximized$","_minimized$","_pxIntrinsicSize$","_pxIntrinsicCoord$","_collectorRect$","_rootRect$","_managerStageRect$","scaleX","scaleY","boxWidth","boxHeight","boxStyles","set","$boxMain","$contentWrap","_contentStyle$","_managerContainerStyle$","style2","cssText","updateContentRect","rect","getBoundingClientRect","_contentRect$","observer","observe","disconnect","last$userStyles","remove","last$userContent","last$userStage","$stage","_renderStage","$footer","last$userFooter","_renderResizeHandlers","updateContentStageRect","top","left","_contentStageStyle$","_managerStageStyle$","_contentStageRect$","$resizeHandles","values","handleType","$handle","TRACKING_DISPOSER_ID","transformingClassName","$trackMask","trackingHandle","trackStartX","trackStartY","trackStartWidth","trackStartHeight","trackStartPageX","trackStartPageY","handleTracking","pageX","pageY","flattenEvent","offsetX","offsetY","newX","newY","newWidth","North","South","West","East","NorthWest","NorthEast","SouthEast","SouthWest","handleTrackEnd","handleTrackStart","cursor","removeEventListener","Destroyed","clearListeners","TELE_BOX_MANAGER_EVENT","TELE_BOX_MANAGER_EVENT2","root$","rect$","derive","styles$","el$","$collector","backgroundImage","styles2","keys","key","config","boxes$","parentNode","focusBox","box","focusedBox","$titles","firstElementChild","$tab","super","titles","replaceChild","renderTitles","$titlesArea","insertBefore","currentTarget","scrollBy","deltaY","behavior","disposers","map","_title$","disposer","prefersColorScheme","Light","collector","stageRatio","containerStyle","stageStyle","containerStyle$","stageStyle$","stageRatio$","innerWidth","innerHeight","root2","stageRect$","topBox$","boxes","topBox","reduce","topBox2","prefersDarkMatch","matchMedia","prefersDark$","matches","handler","evt","prefersColorScheme$","prefersColorScheme2","PrefersColorScheme","prefersDark","minimized2","maximized2","TeleBoxCollector","stageRect","closeBtnClassName","checkFocusBox","tagName","contains","getBox","makeBoxTop","MaxTitleBar","removeTopBox","focusTopBox","$container","containerStyle2","stageStyle2","setState","setMinimized","setMaximized","create","smartPosition","TeleBox","_fence$","_stageRect$","_stageRatio$","_rect$","_containerStyle$","_stageStyle$","on","_","box2","Created","query","filter","teleBoxMatcher","queryOne","find","update","boxID","updateBox","updateAll","boxOrID","index","getBoxIndex","slice","deletedBoxes","splice","Removed","removeAll","mount","_root$","unmount","targetBox","focusChanged","Focused","blurBox","Blurred","blurAll","Object","every","intrinsicX","intrinsicY","intrinsicWidth","intrinsicHeight","_boxRatio$","setContentStageRatio","pxX","pxPreferredX","pxY","pxPreferredY","findIndex"],"mappings":"4tBAAYA,EAAAC,EAMAC,EAAAC,EAMAC,EAAAC,EAgBAC,EAAAC,EAMAC,EAAAC,GAlCAR,EAAAD,iBACA,eACD,cACA,QAGCG,EAAAD,kBACC,qBACG,wBACA,aAGJG,EAAAD,oBACG,iCACU,+BACb,gBACA,eACD,uBACS,mCACE,4BACT,kBACD,oBACI,wBACA,uBACD,uBACC,aAGJG,EAAAD,iBACA,mBACG,sBACA,YAGHG,EAAAD,iBACA,YACA,WACD,WACA,gBACK,iBACA,iBACA,iBACA,WAGHE,EAAwB,gBC7CfC,EAAeC,EAAaC,UACvCC,KAAKF,IAAIE,KAAKD,IAAIF,EAAOC,GAAMC,cAGbE,KACtBC,kBACCD,EAAGE,cACAC,4BAIkBH,UACjBA,EAAkBI,QACnBJ,EAAkBI,QAAQ,GAC1BJ,EASX,IAAIK,EAAkB,qBAGX,WAAWA,eAOWT,UACtBU,QAAQV,cAGaA,UACpBA,UCVDW,aAAYC,UACfA,SACAC,SACAC,UACAC,UACAC,cACAC,YACAC,EAAY,4BA0KO,IAAIC,yBAEG,CAC1BC,UAAW,EACXC,aACAC,uCAG6BlB,aACzBmB,KAAKX,UAAUZ,gBAID,IAAdI,EAAGoB,iBAIF,WAAGC,OAAuBC,kBAASC,gCAI3BvB,SAEPwB,EAAMC,KAAKD,MACbA,EAAML,KAAKO,kBAAkBV,WAAa,IAEtCjB,KAAK4B,IAAI3B,EAAGiB,QAAUE,KAAKO,kBAAkBT,UAAY,GACzDlB,KAAK4B,IAAI3B,EAAGkB,QAAUC,KAAKO,kBAAkBR,UAAY,GAGrDC,KAAKP,cACAA,QAAQ,CAAEgB,KAAMrC,EAAwBsC,WAG9CV,KAAKN,kBACPA,YAAYb,QAEhB0B,kBAAkBV,UAAYQ,OAC9BE,kBAAkBT,QAAUjB,EAAGiB,aAC/BS,kBAAkBR,QAAUlB,EAAGkB,gCAGV,CAC1BF,UAAW,EACXC,aACAC,uCAG6BlB,aACzBmB,KAAKX,UAAUZ,gBAId,WAAGyB,OAAuBC,kBAASC,gCAI3BvB,SAEPwB,EAAMC,KAAKD,OACXP,QACFA,EAAUE,KAAKW,kBAAkBb,QAAU,YAC3CC,EAAUC,KAAKW,kBAAkBZ,QAAU,KAC3ClB,EAAGI,QAAQ,IAAM,GAEjBoB,EAAML,KAAKW,kBAAkBd,WAAa,IAEtCjB,KAAK4B,IAAIV,EAAUE,KAAKW,kBAAkBb,UAAY,IACtDlB,KAAK4B,IAAIT,EAAUC,KAAKW,kBAAkBZ,UAAY,IAGlDC,KAAKP,cACAA,QAAQ,CAAEgB,KAAMrC,EAAwBsC,WAG9CV,KAAKN,kBACPA,YAAYb,QAEhB8B,kBAAkBd,UAAYQ,OAC9BM,kBAAkBb,QAAUA,OAC5Ba,kBAAkBZ,QAAUA,QAxP5BV,UAAYA,OACZC,OAASA,OACTC,OAASA,OACTE,QAAUA,OACVC,YAAcA,OACdC,UAAYA,OAEZH,QAAUA,GAAW,CACtB,CACIiB,KAAMrC,EAAwBwC,SAC9BC,cAAeb,KAAKc,cAAc,2BAEtC,CACIL,KAAMrC,EAAwBsC,SAC9BG,cAAeb,KAAKc,cAAc,0BAClCC,SAAWC,GAAUA,IAAUhD,EAAeiD,WAElD,CACIR,KAAMrC,EAAwB8C,MAC9BL,cAAeb,KAAKc,cAAc,8BAIrCK,UAAYnB,KAAKoB,iBASnBC,aACErB,KAAKsB,UAAW,MACZA,UAAYC,SAASC,cAAc,YACnCF,UAAUG,UAAYzB,KAAKc,cAAc,kBAExCY,EAAaH,SAASC,cAAc,SAC/BC,UAAYzB,KAAKc,cAAc,gBAC/BX,QAAQwB,cF/BM,WEiCnBC,EAASL,SAASC,cAAc,QAC/BC,UAAYzB,KAAKc,cAAc,WAC/BX,QAAQwB,cFnCU,OEqCdE,YAAYD,KACZC,YAAY7B,KAAKmB,iBAEtBW,EAAoBP,SAASC,cAAc,SAC/BC,UAAYzB,KAAKc,cAAc,sBAE5CtB,QAAQuC,SAAQ,EAAGlB,cAAAA,GAAiBmB,WAC/BC,EAAuBC,OAAOF,GAE9BG,EAAOZ,SAASC,cAAc,YAC/BC,UAAY,GAAGzB,KAAKc,cACrB,mBACCD,MACAV,QAAQ8B,qBAAuBA,IAC/B9B,QAAQC,uBAAyB,SACpByB,YAAYM,WAG7BC,WAAWC,YACZrC,KAAKT,OAAO+C,WAAWC,MACZC,YAAcD,IACdA,MAAQA,KAEnB,qBAGCH,WAAWC,YACZrC,KAAKV,OAAOgD,WAAWtB,SACdxB,QAAQuC,SAAQ,CAACU,EAAKT,WACnBS,EAAI1B,sBACc2B,SAASV,OAAIW,UAAUC,OACrC,YACAH,EAAI1B,SAASC,WAK7B,0BAGCoB,WAAWS,iBACZf,EACA,SACCjD,aACOmB,KAAKX,UAAUZ,mBAGbyB,EAASrB,EAAGqB,OACZ+B,EAAuBa,OACzB,WAAO3C,kBAAS8B,0BAGfa,OAAOC,MAAMd,IACdA,EAAuBjC,KAAKR,QAAQwD,OACtC,GACenE,SACP4D,EAAMzC,KAAKR,QAAQyC,GACrBjC,KAAKP,cACAA,QAAQ,CACTgB,KAAMgC,EAAIhC,KACVhC,MAAOgE,EAAIhE,WAK3B,GACA,oCAGC6C,UAAUO,YAAYH,QACtBJ,UAAUO,YAAYC,UAGxB9B,KAAKsB,UAGTF,uBACGD,EAAYI,SAASC,cAAc,gBAC/BC,UAAYzB,KAAKc,cAAc,eAC/BX,QAAQwB,cFpHW,UEqHxBS,WAAWS,iBACZ1B,EACA,YACAnB,KAAKiD,0BAEJb,WAAWS,iBACZ1B,EACA,aACAnB,KAAKkD,oBACL,CAAEC,SAAS,IAERhC,EAGJiC,oBACIpD,KAAKsB,UAGTR,cAAcW,SACV,GAAGzB,KAAKL,aAAa8B,IAGzB4B,eACEjB,WAAWkB,WACZtD,KAAKsB,iBACAA,eAAY,OACZ5B,iBAAc,OACdD,aAAU,gBC3LI8D,EAAUC,OAIjCA,GAAS,GAAKD,EAASE,OAAS,GAAKF,EAASG,QAAU,SACjDH,QAGLI,EAAkBJ,EAASE,MAAQD,KACrCG,IAAoBJ,EAASG,cACtBH,KAGPI,EAAkBJ,EAASG,aACpB,CACHE,EAAG,EACHC,KAAaH,OAASC,GAAmB,EACzCF,MAAOF,EAASE,MAChBC,OAAQC,SAIVG,EAAiBP,EAASG,OAASF,QAClC,CACHI,KAAaH,MAAQK,GAAkB,EACvCD,EAAG,EACHJ,MAAOK,EACPJ,OAAQH,EAASG,QCqBzB,MAAMK,EAAiBC,OAAOD,gBAAkBE,UAwDrC7E,aAAY8E,GACfA,EAAKC,UACL5B,EAAQ6B,cACRzE,EAAY,kBACZ0E,GAAU,QACVZ,EAAQ,UACRC,EAAS,YACTY,EAAW,YACXC,EAAY,IACZX,EAAI,KACJC,EAAI,aACJW,GAAY,YACZC,GAAY,WACZC,GAAW,QACXC,GAAQ,SACRC,EAAS,sBACTC,EAAoB,cACpBC,UACAC,QACAC,SACAC,SACAC,eACAC,EAAe,uBACfC,EAAoB,eACpBC,SACAC,aACAC,aACAC,YACAnG,OACAoG,YACAC,oBACAC,qBACAC,yBACAC,qBACAC,iBACAC,gBA8OqB,IAAIC,uBAKK,IAAIA,wBA4iB4BnH,iBACvD,cAAKoH,sCAAoBpH,SA9xB3BqH,YAAc,IAAItG,OAElBsE,GAAKA,OACLvE,UAAYA,QAEXwG,EAAa,IAAIC,OAClBF,YAAY7D,aAAY,IAAM8D,EAAW9C,kBAExC9D,EAAS,IAAI8G,EAAI9D,GACjB+D,EAAW,IAAID,EAAIhC,GACnBkC,EAAa,IAAIF,EAAI7B,GACrBgC,GAAa,IAAIH,EAAI5B,GACrBgC,GAAY,IAAIJ,EAAI3B,GACpBgC,GAAU,IAAIL,EAAIzB,GAClB+B,GAAS,IAAIN,EAAI1B,GACjBiC,GAAgB,IAAIP,EAAItB,GACxB8B,GAAc,IAAIR,EAAIrB,GACtB8B,GAAe,IAAIT,EAAIpB,GACvB8B,GAAe,IAAIV,EAAInB,GAEvB5F,GAAS0H,EACX,CAACzB,EAAYC,IACb,EAAEyB,EAAWC,KACTD,EACMjJ,EAAemJ,UACfD,EACAlJ,EAAeiD,UACfjD,EAAeoJ,SAGvBC,GAAW,IAAIhB,EACjB,CACI5C,MAAO6D,EAAMhD,EAAU,EAAG,GAC1BZ,OAAQ4D,EAAM/C,EAAW,EAAG,IAEhC,CAAEgD,QAASC,IAGTC,GAAaT,EACf,CAACK,GAAU1B,IACX,EAAE+B,EAASC,OACPlE,MAAOiE,EAAQjE,MAAQkE,EAAiBlE,MACxCC,OAAQgE,EAAQhE,OAASiE,EAAiBjE,UAE9C,CAAE6D,QAASC,IAGTI,GAAiB,IAAIvB,EACvB,CAAE5C,MAAAA,EAAOC,OAAAA,GACT,CAAE6D,QAASC,SAGVtB,YAAY7D,YAEbgF,GAASQ,UAAS,CAACH,EAASI,QACTC,SACX,CACItE,MAAO7E,KAAKD,IAAI8E,EAAOiE,EAAQjE,OAC/BC,OAAQ9E,KAAKD,IAAI+E,EAAQgE,EAAQhE,SAErCoE,aAKNE,GAAkB,IAAI3B,EAAI,CAAEzC,EAAAA,EAAGC,EAAAA,GAAK,CAAE0D,QAASC,IAE/CS,GAAmBjB,EACrB,CAACY,GAAgBjC,IACjB,EAAEuC,EAAMP,OACJlE,MAAOkE,EAAiBlE,MAAQyE,EAAKzE,MACrCC,OAAQiE,EAAiBjE,OAASwE,EAAKxE,UAE3C,CAAE6D,QAASC,IAGTW,GAAoBnB,EACtB,CAACgB,GAAiBrC,IAClB,EAAEyC,EAAgBT,OACd/D,EAAGwE,EAAexE,EAAI+D,EAAiBlE,MACvCI,EAAGuE,EAAevE,EAAI8D,EAAiBjE,UAE3C,CAAE6D,QAASC,IAGTa,GAAgB,IAAIhC,EAAmBlB,GACvCmD,GAAqB,IAAIjC,EAAmBjB,GAE5CmD,GAAe,IAAIlC,EAAwB,MAC3CmC,GAAe,IAAInC,EAAiBV,EAAkBlH,MAAO,CAC/D8I,QAASC,IAEPiB,GAAqB,IAAIpC,EAAIxB,GAC7B6D,GAAmB1B,EACrB,CAACyB,GAAoB7C,IACrB,EAAE+C,EAAmBC,WACjBD,IAAqBC,IAEvBC,GAAoB7B,EACtB,CAACwB,GAAcE,IACfI,EACA,CAAEvB,QAASC,MAgBWxH,KAba,CACnC+I,SAAU1D,EACV2D,MAAO1D,EACP2B,UAAW1B,EACX2B,UAAW1B,EACXyD,SAAU5J,EACVkE,SAAUmC,EACViC,iBAAkBhC,EAClBuD,sBAAuBrD,EACvBsD,kBAAmBrD,EACnBsD,cAAerD,MAyBO/F,KApBuB,CAC7C4E,OAAQ8B,GACR/B,MAAOgC,GAEP0C,aAAczC,GACd0C,WAAYzC,GACZ0C,YAAazC,GACb0C,YAAazC,GAEb/F,MAAO1B,GACPoI,QAASL,GACToC,UAAWhC,GACXiC,cAAe9B,GACfQ,eAAgBJ,GAChB2B,gBAAiB1B,GACjB2B,iBAAkBzB,GAClB0B,YAAarB,GACbsB,iBAAkBjB,IAG+B1C,KAanCnG,KAXW,CACzBuC,MAAOhD,EACP8E,QAASiC,EACT9B,UAAW+B,EACX9B,UAAW+B,GACX9B,SAAU+B,GACV5B,kBAAmB4D,GACnBtD,aAAckD,GACdjD,kBAAmBkD,IAGYnC,QAE9BrB,SACDA,GACA,IAAIiF,EAAgB,CAChB1K,UAAAA,EACAC,OAAAA,GACAC,OAAAA,EACAI,UAAWK,KAAKL,UAChBD,YAAcsK,iBAAU,cAAK/D,sCAAoB+D,IACjDvK,QAAUuK,GAAUhK,KAAKiK,gBAAgBC,KAAKF,EAAMvJ,aAGvDyF,YAAY7D,YACboE,GAAUnE,WAAW6H,IACbA,EAAW,QACNC,UACDjC,GAAkB1J,MAAMmF,EACxBuE,GAAkB1J,MAAMoF,EACxBoE,GAAiBxJ,MAAMgF,MACvBwE,GAAiBxJ,MAAMiF,iBAMlCwC,YAAY7D,YACbiD,EAAOhD,WAAW0G,IACVA,QACKqB,KACDlC,GAAkB1J,MAAMmF,EACxBuE,GAAkB1J,MAAMoF,YAMnCyG,KAAOtK,KAAKuK,aACJxC,SAAS/H,KAAKwK,SAASC,iBAC/B5I,YAAY7B,KAAKsK,YAEhBI,GAAgB,CAClBC,EACAX,UAEK9D,YAAY7D,YACbsI,EAAI9C,UAAS,CAAC+C,EAAG9C,KACRA,QACI+C,OAAOX,KAAUF,EAAOY,WAM/BvF,EAAWnH,EAAe4M,aAC1BzL,EAAWnB,EAAe6M,aAC1BrE,GAASxI,EAAe8M,WACxBzF,EAAYrH,EAAeiJ,cAC3B3B,EAAYtH,EAAe+C,cAC3B3B,GAAQpB,EAAe+M,UACvBrD,GAAgB1J,EAAegN,oBAC/BlD,GAAiB9J,EAAeiN,oBAEzCjF,YAAY7D,YAAY,CACzBiE,EAASuB,UAAS,CAACuD,EAAStD,KACnBA,GAAesD,QACXP,OAAOX,KAAKhM,EAAegD,UAGxCyF,GAAOkB,UAAS,CAACwD,EAAOvD,KACfA,QACI+C,OAAOX,KACRmB,EAAQnN,EAAeoN,MAAQpN,EAAeqN,iCA4BvDvL,KAAKwL,UAAU/M,MAAMgF,6BAKrBzD,KAAKwL,UAAU/M,MAAMiF,OAOzB+H,YAAYnH,EAAkBwD,GAAa,QACzC0D,UAAUzD,SACX,CAAEtE,MAAOa,EAAUZ,OAAQ1D,KAAKuE,WAChCuD,GAQD4D,aAAanH,EAAmBuD,GAAa,QAC3C0D,UAAUzD,SACX,CAAEtE,MAAOzD,KAAKsE,SAAUZ,OAAQa,GAChCuD,GAWD6D,OAAOlI,EAAeC,EAAgBoE,GAAa,QACjD8D,gBAAgB7D,SACjB,CACItE,MAAO7E,KAAKD,IAAI8E,EAAOzD,KAAKsE,UAC5BZ,OAAQ9E,KAAKD,IAAI+E,EAAQ1D,KAAKuE,YAElCuD,2BAMG9H,KAAK6L,iBAAiBpN,MAAMmF,0BAK5B5D,KAAK6L,iBAAiBpN,MAAMoF,8BAK5B7D,KAAK4L,gBAAgBnN,MAAMgF,mCAK3BzD,KAAK4L,gBAAgBnN,MAAMiF,OAU5B2G,KAAKzG,EAAWC,EAAWiE,GAAa,OAC1CgE,EACAC,QACEpE,EAAmB3H,KAAK2H,iBACxBgC,EAAkB3J,KAAK2J,gBAEzB3J,KAAKgJ,SACG1B,EAAM1D,EAAG,EAAG+D,EAAiBlE,MAAQkG,EAAgBlG,SACrD6D,EACJzD,EACA,EACA8D,EAAiBjE,OAASiG,EAAgBjG,YAGtC4D,EACJ1D,MACkBH,MAAQ,KAC1B,EAAIkE,EAAiBlE,MAAQ,MAEzB6D,EAAMzD,EAAG,EAAG,EAAI8D,EAAiBjE,OAAS,UAGjDmI,iBAAiB9D,SAClB,CACInE,EAAGkI,EAAQnE,EAAiBlE,MAC5BI,EAAGkI,EAAQpE,EAAiBjE,QAEhCoE,GAaEsC,UACNxG,EACAC,EACAJ,EACAC,EACAoE,GAAa,SAEPH,EAAmB3H,KAAK2H,sBAEtB/I,KAAKD,IAAI8E,EAAOzD,KAAKyJ,UAAUhG,SAC9B7E,KAAKD,IAAI+E,EAAQ1D,KAAKyJ,UAAU/F,QAErC1D,KAAK0E,SAAW,EAAG,OACbsH,EAAYhM,KAAK0E,SAAWjB,EAC9BI,IAAM7D,KAAK4J,iBAAiB/F,OACvBmI,EAAYtI,KAEZsI,EAGTnI,EAAI,MACA,IACK7D,KAAK2J,gBAAgBjG,aAG7B2G,KAAKzG,EAAGC,EAAGiE,QACX8D,gBAAgB7D,SACjB,CACItE,MAAOA,EAAQkE,EAAiBlE,MAChCC,OAAQA,EAASiE,EAAiBjE,QAEtCoE,GAODmE,aAAalH,QACXmH,eAAenE,SAAShD,GAM1BoH,sBACED,eAAenE,cAAS,GAG1BqE,WAAWpH,QACTqH,aAAatE,SAAS/C,GAMxBsH,oBACED,aAAatE,cAAS,GAMxBwE,YAAYtH,QACVuH,cAAczE,SAAS9C,GAMzBwH,qBACED,cAAczE,cAAS,GAGzB2E,uBACI1M,KAAKwJ,YAGTmD,YAAYzH,OACX0H,EACkB,iBAAX1H,KACG3D,SAASC,cAAc,WACzBgB,YAAc0C,KAEZA,OAET2H,cAAc9E,SAAS6E,GAGzBE,qBACED,cAAc9E,cAAS,GAkBxBwC,aACAvK,KAAKsK,YACEtK,KAAKsK,UAGXA,KAAO/I,SAASC,cAAc,YAE9B8I,KAAK3H,UAAUoK,IAAI/M,KAAKc,cAAc,cAErCkM,EAAgB,CAClBC,EACAtC,EACAlJ,EACAyL,EAAwCC,IAEjCnN,KAAKkG,YAAY6G,KAAI,WAClBK,EAAmBpN,KAAKc,cAAcW,UACrCkJ,EAAIrI,WAAW7D,MACfkE,UAAUC,OAAOwK,EAAkBF,EAAUzO,YAK9CuB,KAAKsK,KAAMtK,KAAKqN,WAAY,cAC5BrN,KAAKsK,KAAMtK,KAAKsN,YAAa,UAAWC,KACxCvN,KAAKsK,KAAMtK,KAAKwN,YAAa,YAAaD,KAC1CvN,KAAKsK,KAAMtK,KAAKyN,QAAS,OAAQF,KACjCvN,KAAKsK,KAAMtK,KAAK0N,WAAY,uBAEtC1N,KAAKsK,KACLtK,KAAK0N,WACL,qBACAH,QAGCrH,YAAY6G,KAAI,WACXY,EAAqB3N,KAAKc,cAAc,aACxC8M,EAAqB5N,KAAKc,cAAc,aACxC+M,EAAqB,6BAEpB7N,KAAK8N,QAAQxL,WAAWtB,SACtBsJ,KAAK3H,UAAUC,OAChB+K,EACA3M,IAAUhD,EAAemJ,WAGzBnG,IAAUhD,EAAeiD,gBACpBiF,YAAY6H,MAAMF,QAClBvD,KAAK3H,UAAUC,OAAOgL,GAAoB,SAG1C1H,YAAY8H,YACb,UACS1D,KAAK3H,UAAUC,OAChBgL,GACA,KAGR,EACAC,cAMX3H,YAAY7D,YACbrC,KAAKiO,UAAU3L,WAAW+B,SACjBiG,KAAK4D,MAAMC,QAAU9J,EAAU,QAAU,gBAIjD6B,YAAY7D,YACbrC,KAAKoO,SAAS9L,WAAWsC,SAChB0F,KAAK4D,MAAMtJ,OAAS1C,OAAO0C,YAInC0F,KAAKnK,QAAQkO,UAAYrO,KAAKkE,SAE7BoK,EAAYC,EAAOvO,KAAKsK,MAExBkE,EAAaxH,EACf,CACIhH,KAAKyO,YACLzO,KAAK0O,YACL1O,KAAK2O,kBACL3O,KAAK4O,mBACL5O,KAAK6O,gBACL7O,KAAK8O,WACL9O,KAAK+O,qBAET,EACI7H,EACAD,EACA0C,EACAC,EACAR,EACA7F,EACAoE,YAEMzC,EAOFgC,EACE,CACItD,GAAI+D,EAAiB/D,EACrBC,GAAI8D,EAAiB9D,EACrBJ,MAAOF,EAASE,MAChBC,OAAQH,EAASG,OACjBsL,OAAQ,EACRC,OAAQ,GAEZ,CACIrL,EAAGgG,EAAiBhG,EACpBC,EAAG+F,EAAiB/F,EACpBJ,MAAOkG,EAAgBlG,MACvBC,OAAQiG,EAAgBjG,OACxBsL,OAAQ,EACRC,OAAQ,MAEdhI,GAAamC,EAAe,OACpB3F,MAAOyL,EAAUxL,OAAQyL,GAAcjI,EACzClH,KAAKuD,SACLoG,IACC/F,EACHwF,EAAcxF,EACdsL,EAAW,EACX9F,EAAc3F,MAAQ,EACtBkE,EAAiB/D,IACdC,EACHuF,EAAcvF,EACdsL,EAAY,EACZ/F,EAAc1F,OAAS,EACvBiE,EAAiB9D,IACdmL,OAAS5F,EAAc3F,MAAQyL,IAC/BD,OAAS7F,EAAc1F,OAASyL,SAEpCjK,IAEX,CAAEqC,QAASC,IAGT4H,EAAYZ,EAAW/P,WACxB6L,KAAK4D,MAAMzK,MAAQ2L,EAAU3L,MAAQ,UACrC6G,KAAK4D,MAAMxK,OAAS0L,EAAU1L,OAAS,UAGvC4G,KAAK4D,MAAM9D,UAAY,aAAagF,EAAUxL,EAAI,QACnDwL,EAAUvL,EAAI,aAGbqC,YAAY7D,YACbmM,EAAWlM,WAAW4C,MACRmK,IAAInK,aAIhBoK,EAAW/N,SAASC,cAAc,SAC/BC,UAAYzB,KAAKc,cAAc,iBACnCwJ,KAAKzI,YAAYyN,SAEhBhO,EAAYC,SAASC,cAAc,SAC/BC,UAAYzB,KAAKc,cAAc,mBAC/Be,YAAY7B,KAAK8E,SAASzD,eAC/BC,UAAYA,QAEXiO,EAAehO,SAASC,cAAc,SAC/BC,UAAYzB,KAAKc,cAAc,sBAEtC0J,EAAWjJ,SAASC,cAAc,SAC/BC,UACLzB,KAAKc,cAAc,WAAa,6BAC/B0J,SAAWA,OACXtE,YAAY7D,YACb2E,EACI,CAAChH,KAAKwP,eAAgBxP,KAAKyP,0BAC3B,EAAEtK,EAAc+D,WACZ/D,IAAgB+D,IACtB5G,WAAWoN,GAAWlF,EAAS0D,MAAMyB,QAAUD,WAG/CE,EAAoB,WAChBC,EAAOrF,EAASsF,6BACjBC,cAAchI,SAAS,CACxBnE,EAAG,EACHC,EAAG,EACHJ,MAAOoM,EAAKpM,MACZC,OAAQmM,EAAKnM,eAGhBwC,YAAY6G,KAAI,WACXiD,EAAW,IAAIjM,GAAe,KAC3B/D,KAAKiH,2BAILgJ,QAAQzF,GACV,IAAMwF,EAASE,qBAErBhK,YAAY7D,YACbrC,KAAK0O,YAAY7G,UAAUZ,IAElBA,QACIf,YAAY8H,WACb4B,EACA,IACA,uCAMX1J,YAAY6G,KAAI,SACboD,SACGnQ,KAAK6M,cAAcvK,WAAWkH,IAC7B2G,KACgBC,WAEF5G,EACdA,KACa3H,YAAY2H,cAKhCtD,YAAY6G,KAAI,SACbsD,SACGrQ,KAAKkM,eAAe5J,WAAW+G,IAC9BgH,KACiBD,WAEF/G,EACfA,KACSxH,YAAYwH,cAK5BnD,YAAY6G,KAAI,SACbuD,SACGtQ,KAAKqM,aAAa/J,WAAWgH,UAC5BgH,KACeF,WAEF9G,EACbA,GACKtJ,KAAKuQ,cACDA,OAASvQ,KAAKwQ,iBACV3O,YAAY7B,KAAKuQ,SAEzBvQ,KAAKuQ,OAAO9F,iBACJ5I,YAAY7B,KAAKuQ,aAEzBA,OAAO1O,YAAYyH,KACjB,cAAKiH,iBAAQ9F,qBACf8F,OAAOH,iBAKXvO,YAAY2I,SAEnBiG,EAAUlP,SAASC,cAAc,gBAC/BC,UAAYzB,KAAKc,cAAc,oBAClC2P,QAAUA,OAEVvK,YAAY6G,KAAI,SACb2D,SACG1Q,KAAKwM,cAAclK,WAAWiH,IAC7BmH,KACgBN,WAEF7G,EACdA,KACQ1H,YAAY0H,WAKvB1H,YAAYP,KACZO,YAAY0N,KACZ1N,YAAY4O,QAEhBE,wBAEE3Q,KAAKsK,KAGRkG,qBACED,EAAShP,SAASC,cAAc,SAE/BC,UAAYzB,KAAKc,cAAc,uBAChC8P,EACF9G,MAEOoE,MAAM2C,IAAM/G,EAAiBjG,EAAI,OACjCqK,MAAM4C,KAAOhH,EAAiBlG,EAAI,OAClCsK,MAAMzK,MAAQqG,EAAiBrG,MAAQ,OACvCyK,MAAMxK,OAASoG,EAAiBpG,OAAS,kBAE/CwC,YAAY7D,YACb,CACI2E,EACI,CAAChH,KAAK+Q,oBAAqB/Q,KAAKgR,sBAChC,EAAE5L,EAAmB+D,WACjB/D,IAAqB+D,IAC3B7G,WAAW4C,MACFgJ,MAAMyB,QAAUzK,IACAlF,KAAKiR,mBAAmBxS,UAEnDuB,KAAKiR,mBAAmB3O,UAAUsO,IAEtC,wBAEGL,EASHI,8BACEO,EAAiB3P,SAASC,cAAc,SAC/BC,UAAYzB,KAAKc,cAAc,yBAEvCqQ,OAAO7S,GAAwByD,SAASqP,UACrCC,EAAU9P,SAASC,cAAc,SAC/BC,UACJzB,KAAKc,cAAcsQ,GACnB,IACApR,KAAKc,cAAc,mBACfX,QAAQwB,cAAgByP,IAEjBvP,YAAYwP,WAG1B/G,KAAKzI,YAAYqP,SAEhBI,EAAuB,2BACvBC,EAAwBvR,KAAKc,cAAc,oBAE7C0Q,EAWAC,EATAC,EAAc,EACdC,EAAc,EAEdC,EAAkB,EAClBC,EAAmB,EAEnBC,EAAkB,EAClBC,EAAkB,QAIhBC,EAAkBnT,OAChBmB,KAAKgB,QAAUhD,EAAeoJ,gBAIrBvI,OAEToT,MAAEA,QAAOC,GAAUC,EAAatT,GAChCqT,EAAQ,MACA,SAGNE,EAAUH,EAAQH,EAClBO,EAAUH,EAAQH,MAElBnO,EAAG0O,EAAMzO,EAAG0O,GAASvS,KAAK4J,kBAC1BnG,MAAO+O,EAAU9O,OAAQsI,GAAchM,KAAK2J,uBAE1C8H,QACCnT,EAAuBmU,QACjBd,EAAcU,IACTR,EAAmBQ,aAI9B/T,EAAuBoU,QACZb,EAAmBQ,aAG9B/T,EAAuBqU,OACjBjB,EAAcU,IACVR,EAAkBQ,aAG5B9T,EAAuBsU,OACbhB,EAAkBQ,aAG5B9T,EAAuBuU,YACjBnB,EAAcU,IACdT,EAAcU,IACVT,EAAkBQ,IACjBP,EAAmBQ,aAG9B/T,EAAuBwU,YACjBnB,EAAcU,IACVT,EAAkBQ,IACjBP,EAAmBQ,aAG9B/T,EAAuByU,YACbnB,EAAkBQ,IACjBP,EAAmBQ,aAG9B/T,EAAuB0U,YACjBtB,EAAcU,IACVR,EAAkBQ,IACjBP,EAAmBQ,iCAI1BhI,KAAKqH,EAAcU,EAAST,EAAcU,QAKlDjI,UAAUkI,EAAMC,EAAMC,EAAUxG,IAGnCiH,EAAkBpU,WACH,EAEZ2S,MAIQ3S,QAERyL,KAAK3H,UAAUC,OAAO2O,GAAuB,QAE7CrL,YAAY6H,MAAMuD,KAEZlB,WAGT8C,EAAoBrU,aAClBmB,KAAKiJ,mBAKwB,MAA5BpK,EAAkBoB,QACW,IAA7BpB,EAAkBoB,kBAOlBD,KAAKyE,WACNgN,GACAzR,KAAKgB,QAAUhD,EAAeoJ,oBAK5BlH,EAASrB,EAAGqB,UACd,WAAOC,kBAASwB,cAAe,GAClB9C,KAEV+E,EAAG8N,EAAa7N,EAAG8N,GAAgB3R,KAAK4J,oBACxCnG,MAAOmO,EAAiBlO,OAAQmO,GAC/B7R,KAAK2J,mBAENsI,MAAOH,EAAiBI,MAAOH,GAC9BI,EAAatT,MAEAqB,EAAOC,QACnBwB,cAEA6P,MACYjQ,SAASC,cAAc,cAGlC2R,EAAS1B,EACTzR,KAAKc,cAAc,UAAU2Q,KAC7B,KAEKhQ,UAAYzB,KAAKc,cACxB,cAAaqS,EAAS,IAAIA,IAAW,UAGpC7I,KAAKzI,YAAY2P,QAEjBlH,KAAK3H,UAAUoK,IAAIwE,QAEnBrL,YAAY6G,KAAI,YACVlK,iBAAiB,YAAamP,UAC9BnP,iBAAiB,YAAamP,EAAgB,CACjD7O,SAAS,WAENN,iBAAiB,UAAWoQ,UAC5BpQ,iBAAiB,WAAYoQ,EAAgB,CAChD9P,SAAS,WAENN,iBAAiB,cAAeoQ,EAAgB,CACnD9P,SAAS,IAGN,YACIiQ,oBAAoB,YAAapB,UACjCoB,oBAAoB,YAAapB,UACjCoB,oBAAoB,UAAWH,UAC/BG,oBAAoB,WAAYH,UAChCG,oBACH,cACAH,MAGT3B,UAINrL,kBAAoBiN,OAEpBhN,YAAYrD,iBACbqO,EACA,YACAgC,EACA,GACA,oCAGChN,YAAYrD,iBACbqO,EACA,aACAgC,EACA,CAAE/P,SAAS,GACX,qDAKCmH,KAAK8F,cACLlK,YAAY5C,gBACZ4C,YAAY5C,iBAEXtD,KAAK6K,OAAOX,KAAKhM,EAAemV,gBACjCxI,OAAOyI,sBACPrJ,gBAAgBqJ,iBAMlBxS,cAAcW,SACV,GAAGzB,KAAKL,aAAa8B,SCvpCxB8R,EAAAC,UCgDDpU,aAAYmG,WACfA,YACAlG,YACAgG,YACA1F,EAAY,iBACZuF,EAAS,SACTuO,qBAmH6B,IAAI7T,OAjH5BD,UAAYA,QAEXwG,EAAa,IAAIC,OAClBF,YAAY7D,aAAY,IAAM8D,EAAW9C,kBAExCqQ,EAAQ,IAAIrN,OAA6B,GACzCC,EAAWqN,EAAOpO,GAClBqO,EAAU,IAAIvN,EAAInB,GAClB2O,EAAM,IAAIxN,EAAiB9E,SAASC,cAAc,aAOtCxB,KALW,CACzBkF,OAAQ0O,EACRE,WAAYD,GAGmB1N,KAMTnG,KAJa,CACnCyF,KAAMgO,MAUgBzT,KALuB,CAC7C6P,KAAM6D,EACNrP,QAASiC,GAGwCH,KAEjD1H,MAAMgD,UAAYzB,KAAKc,cAAc,eACrCrC,MAAMyP,MAAM6F,gBAAkB,yYAE7B7N,YAAY7D,YACbwR,EAAIvR,WAAWwR,SACN5N,YAAYrD,iBACbiR,EACA,SACA,KACSzU,EAAUZ,SACAsJ,UAAS,KAG5B,GACA,gCAGC7B,YAAY7D,YACb,CACIiE,EAAShE,WAAW+B,MACL1B,UAAUC,OACjB5C,KAAKc,cAAc,qBACnBuD,MAGRhF,EAAUiD,WAAW2G,MACNtG,UAAUC,OACjB5C,KAAKc,cAAc,sBACnBmI,MAGR5D,EAAU/C,WAAWyG,MACNpG,UAAUC,OACjB5C,KAAKc,cAAc,qBACnBiI,KAEOpG,UAAUC,OACjB5C,KAAKc,cAAc,uBAClBiI,MAGT6K,EAAQtR,WAAW0R,WACRC,KAAKD,GAAQjS,SAASmS,UACnBzV,EAAQuV,EACVE,GAES,MAATzV,MACWyP,MAAMgG,GACbzV,SAIhBgV,EAAMnR,WAAWmD,IACTA,KACK5D,YAAYiS,MAIzB9M,EAAQ,CAACzB,EAAYkO,IAAQnR,WACzB,EAAE2E,EAAWxB,SACLwB,GAAaxB,EAAM,OACb7B,EAAEA,IAAGC,QAAGJ,SAAOC,GACjBoQ,EAAWhE,wBACTvM,EACFkC,EAAKqK,0BACH/H,SAAS,CACXnE,EAAGA,EAAIL,EAASK,EAChBC,EAAGA,EAAIN,EAASM,EAChBJ,MAAAA,EACAC,OAAAA,SAMpB,4BAUTL,eACE6C,YAAY5C,WAGdxC,cAAcW,SACV,GAAGzB,KAAKL,aAAa8B,MDhLxB+R,EAAAD,mBACE,oBACA,oBACA,oBACA,kBACF,oBACI,wBACA,4BACI,mCACE,4BACT,+BACY,kCACV,4BEOkBxJ,EACtB3K,YAAY+U,SACTA,QAEDC,OAASD,EAAOC,YAChB1O,UAAYyO,EAAOzO,eACnBL,UAAY8O,EAAO9O,eAEnBjD,WAAWC,YACZ8R,EAAOV,MAAMnR,WAAWmD,UAChBA,IACK5D,YAAY7B,KAAKqB,WACf,cAAKC,oBAAW+S,kBAClB/S,UAAU8O,aAMxBkE,SAASC,aACRvU,KAAKwU,YAAcxU,KAAKwU,aAAeD,MAIvCvU,KAAKyU,SAAWzU,KAAKV,OAAOb,QAAUT,EAAeiD,UAAW,OAC1DyB,SAAEA,GAAa1C,KAAKyU,QAAQC,0BACzB1S,EAAIU,EAASM,OAAS,EAAGhB,GAAK,EAAGA,GAAK,EAAG,OACxC2S,EAAOjS,EAASV,GAChBkC,EAAK,WAAK/D,kBAASkO,UACrBnK,IACIqQ,GAAOrQ,IAAOqQ,EAAIrQ,KACbvB,UAAUC,OACX5C,KAAKc,cAAc,qBACnB,GAEGd,KAAKwU,YAActQ,IAAOlE,KAAKwU,WAAWtQ,MAC5CvB,UAAUC,OACX5C,KAAKc,cAAc,qBACnB,UAMf0T,WAAaD,GAGflT,YACCrB,KAAKsB,iBACEtB,KAAKsB,gBAGVA,EAAYsT,MAAMvT,WAEdsB,UAAUoK,IAAI/M,KAAKc,cAAc,sBAEtCsB,WAAWC,YACZ,CACIrC,KAAKV,OAAOgD,WAAWtB,MACT2B,UAAUC,OAChB5C,KAAKc,cAAc,0BACnBE,IAAUhD,EAAeiD,cAGjCjB,KAAKX,UAAUiD,WAAW2G,MACZtG,UAAUC,OAChB5C,KAAKc,cAAc,YACnBmI,MAGRjJ,KAAKqF,UAAU/C,WAAWyG,MACZpG,UAAUC,OAChB5C,KAAKc,cAAc,qBACnBiI,KAEMpG,UAAUC,OAChB5C,KAAKc,cAAc,uBAClBiI,MAGT/B,EAAQ,CAAChH,KAAKV,OAAQU,KAAKoU,SAAS9R,WAChC,EAAEtB,EAAO6T,MACD7T,IAAUhD,EAAeiD,cACf0B,UAAUC,OAChB5C,KAAKc,cAAc,6BACD,IAAlB+T,EAAO7R,QAEW,IAAlB6R,EAAO7R,UACG8R,aACN9U,KAAK+U,eACLzT,EAAUoT,wBAOlC,oBAGEM,EAAczT,SAASC,cAAc,gBAC/BmB,UAAUoK,IAAI/M,KAAKc,cAAc,kBACnCmU,aAAaD,EAAa1T,EAAUoT,mBAEvCpT,EAGJ+B,gBACGA,eACDoR,aAAU,OACVD,gBAAa,EAGZO,oBACDN,QAAUlT,SAASC,cAAc,YACjCiT,QAAQhT,UAAYzB,KAAKc,cAAc,eAEvCsB,WAAWS,iBACZ7C,KAAKyU,QACL,SACC5V,MACOqW,cAA8BC,SAAS,CACvCrE,KAAMjS,EAAGuW,OAAS,EAAI,SACtBC,SAAU,aAGlB,CAAElS,SAAS,GACX,iCAGEqH,EAAWjJ,SAASC,cAAc,SAC/BC,UAAYzB,KAAKc,cAAc,uBACnC2T,QAAQ5S,YAAY2I,SAEnB8K,EAAYtV,KAAKoU,OAAO3V,MAAM8W,KAAKhB,UAC/BI,EAAOpT,SAASC,cAAc,mBAC/BC,UAAYzB,KAAKc,cAAc,gBAC/B0B,YAAc+R,EAAIhS,QAClBpC,QAAQkO,UAAYkG,EAAIrQ,KACxB/D,QAAQC,uBAAyB,OAElCJ,KAAKwU,YAAcD,EAAIrQ,KAAOlE,KAAKwU,WAAWtQ,MACzCvB,UAAUoK,IAAI/M,KAAKc,cAAc,uBAGjCe,YAAY8S,GAEdJ,EAAIiB,QAAQ3N,UAAUtF,GAAWoS,EAAKnS,YAAcD,mBAG1DH,WAAWC,aACZ,IAAMiT,EAAUvT,SAAS0T,GAAaA,OACtC,yBAGGzV,KAAKyU,SC/HpB,MAAM1Q,EAAiBC,OAAOD,gBAAkBE,UA2BrC7E,aAAYqG,KACfA,EAAO,wBACPiQ,EAAqB5X,EAAsB6X,gBAC3C1O,GAAY,YACZC,GAAY,QACZ8B,GAAQ,YACR4M,YACAjW,EAAY,mBACZsJ,GAAW,aACX4M,GAAa,iBACbC,EAAiB,cACjBC,EAAa,IACS,gBAoTD,IAAI/P,OAnTpBE,YAAc,IAAItG,OAElBD,UAAYA,QAEXwG,EAAa,IAAIC,OAClBF,YAAY7D,aAAY,IAAM8D,EAAW9C,kBAExCoQ,EAAQ,IAAIpN,EAAIZ,GAChBpG,EAAY,IAAIgH,EAAI4C,GACpB1D,EAAa,IAAIc,EAAIY,GACrBzB,EAAa,IAAIa,EAAIa,GACrB5B,EAAS,IAAIe,EAAI2C,GACjBgN,EAAkB,IAAI3P,EAAIyP,GAC1BG,EAAc,IAAI5P,EAAI0P,GACtBG,EAAc,IAAI7P,EAAIwP,GAEtBnQ,EAAY,IAAIW,EAClB,CACIzC,EAAG,EACHC,EAAG,EACHJ,MAAOO,OAAOmS,WACdzS,OAAQM,OAAOoS,aAEnB,CAAE7O,QAASC,SAEVtB,YAAY7D,YACboR,EAAMnR,WAAW+T,SACRnQ,YAAY6G,KAAI,SACZsJ,QACM,aAELrG,EAAW,IAAIjM,GAAe,WAC1B8L,EAAOwG,EAAKvG,0BACR/H,SAAS,CACfnE,EAAG,EACHC,EAAG,EACHJ,MAAOoM,EAAKpM,MACZC,OAAQmM,EAAKnM,qBAGZuM,QAAQoG,GACV,IAAMrG,EAASE,eACvB,4BAILoG,EAAatP,EAAQ,CAACtB,EAAWwQ,GAAcpN,EAAe,CAChEvB,QAASC,SAGR4M,OAAS,IAAI/N,EAAe,SAC5BkQ,QAAU,IAAIlQ,OAAyB,QACvCH,YAAY7D,YACbrC,KAAKoU,OAAO9R,WAAWkU,OACfA,EAAMxT,OAAS,EAAG,OACZyT,EAASD,EAAME,QAAO,CAACC,EAAQpC,IACjCoC,EAAO/R,OAAS2P,EAAI3P,OAAS+R,EAASpC,SAErCgC,QAAQxO,SAAS0O,aAEjBF,QAAQxO,cAAS,aAK5B6O,EAAmB5S,OAAO6S,WAC5B,gCAEEC,EAAe,IAAIzQ,GAAI,GACzBuQ,MACa7O,SAAS6O,EAAiBG,cAClC7Q,YAAY6G,KAAI,WACXiK,EAAWC,MACAlP,SAASkP,EAAIF,mBAEblU,iBAAiB,SAAUmU,GACrC,IACHJ,EAAiBxD,oBAAoB,SAAU4D,aAIrDE,EAAsB,IAAI7Q,EAAIqP,QAC/BxP,YAAY7D,YACb6U,EAAoBrP,UAAS,CAACsP,EAAoBrP,KACzCA,QACI+C,OAAOX,KACRqJ,EAAuB6D,mBACvBD,aAMV9R,EAAY2B,EACd,CAAC8P,EAAcI,IACf,EAAEG,EAAaF,KACY,SAAvBA,EACME,EACuB,SAAvBF,IAGR7X,EAAS0H,EACX,CAACzB,EAAYC,IACb,EAAE8R,EAAWC,KACTD,EACMtZ,EAAemJ,UACfoQ,EACAvZ,EAAeiD,UACfjD,EAAeoJ,cAGxBwO,gBACDA,IACA,IAAI4B,EAAiB,CACjBjS,WAAAA,EACAlG,UAAAA,EACAgG,UAAAA,EACA1F,UAAAA,EACA8T,MAAAA,MAWkBzT,KARmB,CACzC+I,SAAU1D,EACVrE,MAAO1B,EACPmG,KAAMgO,EACNlQ,SAAUmC,EACV+R,UAAWnB,GAGoCnQ,KAajCnG,KAXW,CACzB0V,mBAAoBwB,EACpBjO,SAAU5J,EACV2J,MAAO1D,EACP2B,UAAW1B,EACX2B,UAAW1B,EACXqQ,WAAYK,EACZJ,eAAgBE,EAChBD,WAAYE,GAGmB9P,SAE7BuR,EAAoB1X,KAAKc,cAAc,uBAEvC6W,EAAiB9Y,aACfQ,EAAUZ,mBAIRyB,EAASrB,EAAGqB,UACbA,EAAO0X,gBAKJ3K,EAAyB/M,EAC7B+M,EACAA,EAAKA,EAAGxC,cACV,IACMwC,EAAGtK,WAAasK,EAAGtK,UAAUkV,SAASH,gBAGpCxT,EAAK,WAAG/D,kBAASkO,aACnBnK,EAAI,OACEqQ,EAAMvU,KAAK8X,OAAO5T,MACpBqQ,cACKD,SAASC,aACTwD,WAAWxD,WAO3BrO,YAAYrD,iBACbmB,OACA,YACA2T,GACA,QAECzR,YAAYrD,iBACbmB,OACA,aACA2T,GACA,QAGC7S,SAAW,IAAIkT,EAAY,CAC5BrY,UAAWK,KAAKL,UAChBJ,OAAQoU,EAAO3T,KAAKuW,SAAUE,qBAAmBlU,QAAS,KAC1D6R,OAAQpU,KAAKoU,OACb/O,UAAAA,EACAhG,UAAAA,EACAC,OAAAA,EACAmU,MAAAA,EACA/N,UAAAA,EACAjG,QAAUuK,WACEA,EAAMvJ,WACLrC,EAAwBsC,WACdqH,UAAUvC,EAAW/G,kBAG/BL,EAAwBwC,WACdmH,UAAS,cAGnB7J,EAAegD,WACX+W,oBACAC,uBAUhBhS,YAAY7D,YAAY,CACzB/C,EAAOuI,UAAS,CAAC7G,EAAO8G,KACfA,QACI+C,OAAOX,KAAKqJ,EAAuBtI,MAAOjK,MAGvDwE,EAAWqC,UAAS,CAAC0P,EAAWzP,KACvBA,QACI+C,OAAOX,KACRqJ,EAAuBtS,UACvBsW,MAIZhS,EAAWsC,UAAS,CAACyP,EAAWxP,KACvBA,QACI+C,OAAOX,KACRqJ,EAAuBpM,UACvBmQ,MAIZjS,EAAUwC,UAAS,CAACkB,EAAUjB,KACrBA,QACI+C,OAAOX,KAAKqJ,EAAuBzI,SAAU/B,aAKzDoP,WAAa5W,SAASC,cAAc,YACpC2W,WAAW1W,UAAYzB,KAAKc,cAAc,0BAE1CyP,OAAShP,SAASC,cAAc,YAChC+O,OAAO9O,UAAYzB,KAAKc,cAAc,sBACtCqX,WAAWtW,YAAY7B,KAAKuQ,aAE5BrK,YAAY7D,YAAY,CACzBgD,EAAU/C,WAAWyG,SACZoP,WAAWxV,UAAUC,OACtB5C,KAAKc,cAAc,qBACnBiI,QAECoP,WAAWxV,UAAUC,OACtB5C,KAAKc,cAAc,uBAClBiI,MAGTvD,EAAWlD,WAAWiV,SACbY,WAAWxV,UAAUC,OAAO,eAAgB2U,MAErDhS,EAAWjD,WAAWgV,SACba,WAAWxV,UAAUC,OAAO,eAAgB0U,MAErDtB,EAAgB1T,WAAW8V,SAClBD,WAAWjK,MAAMyB,QAAUyI,KAEpCnC,EAAY3T,WAAW+V,SACd9H,OAAOrC,MAAMyB,QAAU0I,OACvB9H,OAAOrC,MAAMzK,MAAQ6S,EAAW7X,MAAMgF,MAAQ,UAC9C8M,OAAOrC,MAAMxK,OAAS4S,EAAW7X,MAAMiF,OAAS,QAEzD4S,EAAWhU,WAAWmV,SACblH,OAAOrC,MAAMzK,MAAQgU,EAAUhU,MAAQ,UACvC8M,OAAOrC,MAAMxK,OAAS+T,EAAU/T,OAAS,QAElD+P,EAAMnR,WAAW+T,IACTA,IACKxU,YAAY7B,KAAKmY,YACfnY,KAAKmY,WAAW1N,oBAClB0N,WAAW/H,iCAWrBpQ,KAAKoU,OAAO3V,0BAIZuB,KAAKuW,QAAQ9X,MAajB6Z,SAAStX,EAAqB8G,GAAa,UACtC9G,QACChD,EAAeiD,eACXsX,cAAa,EAAOzQ,QACpB0Q,cAAa,EAAM1Q,cAGvB9J,EAAemJ,eACXoR,cAAa,EAAMzQ,QACnB0Q,cAAa,EAAO1Q,sBAIpByQ,cAAa,EAAOzQ,QACpB0Q,cAAa,EAAO1Q,UAI1B9H,KAGJyY,OACHtE,EAAqC,GACrCuE,GAAgB,SAEVnE,EAAM,IAAIoE,UACZ/T,OAAQ5E,KAAKyW,OAASzW,KAAKyW,OAAO7R,OAAS,EAAI,KAC5CuP,GACCuE,EAAgB1Y,KAAK0Y,cAAcvE,GAAU,MAH7B,CAIpBxU,UAAWK,KAAKL,UAChB8F,KAAMzF,KAAKuQ,OACXlL,UAAWrF,KAAK0N,WAChBlI,WAAYxF,KAAKyO,YACjBlJ,WAAYvF,KAAK0O,YACjBpJ,OAAQtF,KAAK4Y,QACblT,UAAW1F,KAAK8O,WAChBnJ,kBAAmB3F,KAAK6Y,YACxBjT,mBAAoB5F,KAAK8Y,aACzBzZ,UAAWW,KAAKqN,WAChBtH,eAAgB/F,KAAK4V,UAAUmD,OAC/BlT,uBAAwB7F,KAAKgZ,iBAC7BlT,mBAAoB9F,KAAKiZ,yCAGzB1E,EAAI5P,aACC2P,SAASC,GACVmE,QACKX,WAAWxD,SAInBH,OAAOrM,SAAS,IAAI/H,KAAKwW,MAAOjC,SAEhCrO,YAAY7D,YAAY,CACzBkS,EAAItK,gBAAgBiP,GAAG9a,EAAwBsC,UAAU,UAChD8X,cAAcxY,KAAKkH,cAE5BqN,EAAItK,gBAAgBiP,GAAG9a,EAAwBwC,UAAU,UAChD2X,cAAa,MAEtBhE,EAAItK,gBAAgBiP,GAAG9a,EAAwB8C,OAAO,UAC7CkP,OAAOmE,QACP2D,iBAET3D,EAAI1I,iBAAiBhE,UAAS,CAACsR,EAAGrR,KACzBA,QACI+C,OAAOX,KAAKqJ,EAAuBpI,cAAeoJ,MAG/DA,EAAI3I,gBAAgB/D,UAAS,CAACsR,EAAGrR,KACxBA,QACI+C,OAAOX,KACRqJ,EAAuBrI,gBACvBqJ,MAIZA,EAAInG,SAASvG,UAAS,CAACsR,EAAGrR,QAClB9H,KAAKwW,MAAMxT,OAAS,EAAG,OACjByT,EAASzW,KAAKwW,MAAME,QAAO,CAACC,EAAQyC,IACtCzC,EAAO/R,OAASwU,EAAIxU,OAAS+R,EAASyC,SAErC7C,QAAQxO,SAAS0O,GAErB3O,QACI+C,OAAOX,KAAKqJ,EAAuBvI,OAAQuJ,aAKvD1J,OAAOX,KAAKqJ,EAAuB8F,QAAS9E,GAE1CA,EAGJ+E,MAAMnF,UACFA,EACDnU,KAAKwW,MAAM+C,OAAOvZ,KAAKwZ,eAAerF,IACtC,IAAInU,KAAKwW,OAGZiD,SACHtF,UAEOA,EACDnU,KAAKwW,MAAMkD,KAAK1Z,KAAKwZ,eAAerF,IACpCnU,KAAKwW,MAAM,GAGdmD,OACHC,EACAzF,EACArM,GAAa,SAEPyM,EAAMvU,KAAKwW,MAAMkD,MAAMN,GAAQA,EAAIlV,KAAO0V,OAC5CrF,SACOvU,KAAK6Z,UAAUtF,EAAKJ,EAAQrM,GAIpCgS,UACH3F,EACArM,GAAa,QAER0O,MAAMzU,SAASwS,SACXsF,UAAUtF,EAAKJ,EAAQrM,MAI7BsI,OACH2J,EACAjS,GAAa,SAEPkS,EAAQha,KAAKia,YAAYF,MAC3BC,GAAS,EAAG,OACNxD,EAAQxW,KAAKwW,MAAM0D,QACnBC,EAAe3D,EAAM4D,OAAOJ,EAAO,eACpC5F,OAAOrM,SAASyO,KACRzU,SAASwS,GAAQA,EAAIlR,YAC7ByE,IACG9H,KAAKwW,MAAMxT,QAAU,SAChBwV,cAAa,QACbD,cAAa,SAEjB1N,OAAOX,KAAKqJ,EAAuB8G,QAASF,IAE9CA,EAAa,IAKrBlC,kBACCjY,KAAKyW,cACEzW,KAAKoQ,OAAOpQ,KAAKyW,QAKzB6D,UAAUxS,GAAa,SACpBqS,EAAena,KAAKoU,OAAO3V,kBAC5B2V,OAAOrM,SAAS,MACRhG,SAASwS,GAAQA,EAAIlR,YAC7ByE,IACG9H,KAAKwW,MAAMxT,QAAU,SAChBwV,cAAa,QACbD,cAAa,SAEjB1N,OAAOX,KAAKqJ,EAAuB8G,QAASF,IAE9CA,EAMJI,MAAM9U,QACJ+U,OAAOzS,SAAStC,GAMlBgV,eACED,OAAOzS,SAAS,MAGlB1E,QAAQyE,GAAa,QACnB+C,OAAOyI,sBACPpN,YAAY5C,gBACZgX,UAAUxS,QACV8N,UAAUvS,eACVyB,SAASzB,UAGXvC,cAAcW,SACV,GAAGzB,KAAKL,aAAa8B,IAGzB6S,SAASyF,EAA2BjS,GAAa,SAC9C4S,EAAY1a,KAAK8X,OAAOiC,GAC1BW,SACKlE,MAAMzU,SAASwS,OACZmG,IAAcnG,EAAK,KACfoG,GAAe,EACdD,EAAU/V,WACI,IACL8I,QAAQ1F,UAAS,EAAMD,IAEjC6S,IAAiB7S,QACZ+C,OAAOX,KACRqJ,EAAuBqH,QACvBF,QAGDnG,EAAI5P,YACNkW,QAAQtG,EAAKzM,WAGrBhD,SAASwP,SAASoG,IAIxBxC,iBACClY,KAAKyW,SAAWzW,KAAKyW,OAAO9R,aACrB3E,KAAKsU,SAAStU,KAAKyW,QAI3BoE,QAAQd,EAA2BjS,GAAa,SAC7C4S,EAAY1a,KAAK8X,OAAOiC,GAC1BW,IACIA,EAAU/V,UACA8I,QAAQ1F,UAAS,EAAOD,GAC7BA,QACI+C,OAAOX,KAAKqJ,EAAuBuH,QAASJ,IAGrD1a,KAAK8E,SAAS0P,aAAekG,QACxB5V,SAASwP,YAKnByG,QAAQjT,GAAa,QACnB0O,MAAMzU,SAASwS,IACZA,EAAI5P,UACA8I,QAAQ1F,UAAS,EAAOD,GACvBA,QACI+C,OAAOX,KAAKqJ,EAAuBuH,QAASvG,OAIzDvU,KAAK8E,SAAS0P,iBACT1P,SAASwP,WAUZkF,eACNrF,SAEMF,EAAO+G,OAAO/G,KAAKE,UAGjBI,GACJN,EAAKgH,OAAO/G,GAAQC,EAAOD,KAASK,EAAIL,KAGtC2F,UACNtF,EACAJ,EACArM,GAAa,mBAEG,MAAZqM,EAAOvQ,GAAyB,MAAZuQ,EAAOtQ,KACvBgI,iBAAiB9D,SACjB,CACInE,EAAG,WAAOA,KAAK2Q,EAAI2G,WACnBrX,EAAG,WAAOA,KAAK0Q,EAAI4G,YAEvBrT,GAGY,MAAhBqM,EAAO1Q,OAAkC,MAAjB0Q,EAAOzQ,UAC3BkI,gBAAgB7D,SAChB,CACItE,MAAO,WAAOA,SAAS8Q,EAAI6G,eAC3B1X,OAAQ,WAAOA,UAAU6Q,EAAI8G,iBAEjCvT,GAGY,MAAhBqM,EAAO5R,SACHiT,QAAQzN,SAASoM,EAAO5R,OAEV,MAAlB4R,EAAO9P,WACH4J,UAAUlG,SAASoM,EAAO9P,QAASyD,GAEnB,MAApBqM,EAAO3P,aACHgJ,YAAYzF,SAASoM,EAAO3P,UAAWsD,GAEvB,MAApBqM,EAAO1P,aACH6I,YAAYvF,SAASoM,EAAO1P,UAAWqD,GAExB,MAAnBqM,EAAOzP,YACH4W,WAAWvT,SAASoM,EAAOzP,SAAUoD,GAExB,MAAjBqM,EAAOvP,UACHwJ,SAASrG,SAASoM,EAAOvP,OAAQkD,QAER,IAA7BqM,EAAOtP,qBACH0W,qBAAqBpH,EAAOtP,kBAAmBiD,GAEjC,MAAlBqM,EAAOpP,WACHkH,aAAakI,EAAOpP,SAEP,MAAjBoP,EAAOlP,UACHsH,YAAY4H,EAAOlP,QAEH,MAApBkP,EAAO5P,WAAwC,MAAnB4P,EAAO7P,YAC/BkH,UAAUzD,SACV,CACItE,MAAO,WAAOa,YAAYiQ,EAAIjQ,SAC9BZ,OAAQ,WAAOa,aAAagQ,EAAIhQ,WAEpCuD,GAMF4Q,cAAc7I,OAChBjM,EAAEA,IAAGC,GAAMgM,QACTpM,MAAEA,EAAQ,UAAKC,EAAS,IAAQmM,EAChC4H,EAAYzX,KAAKyX,UACjBhB,EAASzW,KAAKyW,UAEX,MAAL7S,EAAW,KACP4X,EAAM,MACN/E,EAAQ,OACFgF,EAAehF,EAAO7M,iBAAiBhG,EAAI,GAE7C6X,EADqBhY,EAAQgU,EAAUhU,OACJgU,EAAUhU,UACvCgY,KAGVD,EAAM/D,EAAUhU,SAGf,MAALI,EAAW,KACP6X,EAAM,MACNjF,EAAQ,OACFkF,EAAelF,EAAO7M,iBAAiB/F,EAAI,GAE7C8X,EADsBjY,EAAS+T,EAAU/T,QACL+T,EAAU/T,WACxCiY,KAGVD,EAAMjE,EAAU/T,aAGjB,CAAEE,EAAAA,EAAGC,EAAAA,EAAGJ,MAAAA,EAAOC,OAAAA,GAGhBqU,WAAWxD,EAAczM,GAAa,GACxC9H,KAAKyW,QACDlC,IAAQvU,KAAKyW,UACTrI,SAASrG,SAAS/H,KAAKyW,OAAO7R,OAAS,EAAGkD,GAKhDmS,YAAYF,SACQ,iBAAZA,EACR/Z,KAAKwW,MAAMoF,WAAWrH,GAAQA,EAAIrQ,KAAO6V,IACzC/Z,KAAKwW,MAAMoF,WAAWrH,GAAQA,IAAQwF,IAGtCjC,OAAOiC,SACa,iBAAZA,EACR/Z,KAAKwW,MAAMkD,MAAMnF,GAAQA,EAAIrQ,KAAO6V,IACpCA"}