@netless/fastboard-react 0.2.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/dist/index.js +310 -356
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +250 -296
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +5 -6
  6. package/src/components/Toolbar/Content.tsx +19 -4
  7. package/src/components/Toolbar/Toolbar.scss +10 -0
  8. package/src/components/Toolbar/Toolbar.tsx +15 -47
  9. package/src/components/Toolbar/components/Mask.tsx +0 -44
package/dist/index.js CHANGED
@@ -136,7 +136,7 @@ function useForceUpdate() {
136
136
  }
137
137
 
138
138
  // src/style.scss?inline
139
- var style_default = '.netless-window-manager-playground{width:100%;height:100%;position:relative;z-index:1;overflow:hidden;user-select:none}.netless-window-manager-sizer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;overflow:hidden;display:flex}.netless-window-manager-sizer-horizontal{flex-direction:column}.netless-window-manager-sizer:before,.netless-window-manager-sizer:after{flex:1;content:"";display:block}.netless-window-manager-chess-sizer:before,.netless-window-manager-chess-sizer:after{background-image:linear-gradient(45deg,#b0b0b0 25%,transparent 25%),linear-gradient(-45deg,#b0b0b0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#b0b0b0 75%),linear-gradient(-45deg,transparent 75%,#b0b0b0 75%);background-color:#fff;background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px}.netless-window-manager-wrapper{position:relative;z-index:1;width:100%;height:100%;overflow:hidden}.netless-window-manager-main-view{width:100%;height:100%}.netless-window-manager-cursor-pencil-image,.netless-window-manager-cursor-eraser-image{width:26px;height:26px}.netless-window-manager-cursor-selector-image{width:24px;height:24px}.netless-window-manager-cursor-selector-avatar{border-radius:50%;border-style:solid;border-width:2px;border-color:#fff;margin-bottom:2px}.netless-window-manager-cursor-selector-avatar img{width:12px}.netless-window-manager-cursor-inner{border-radius:4px;display:flex;align-items:center;justify-content:center;flex-direction:row;padding-left:4px;padding-right:4px;font-size:12px}.netless-window-manager-cursor-inner-mellow{height:32px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex-direction:row;padding-left:16px;padding-right:16px}.netless-window-manager-cursor-tag-name{font-size:12px;margin-left:4px;padding:2px 8px;border-radius:4px}.netless-window-manager-cursor-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:26px;height:26px;z-index:2147483647;left:0;top:0;will-change:transform;transition:transform .1s;transform-origin:0 0;user-select:none}.netless-window-manager-cursor-pencil-offset{margin-left:-20px}.netless-window-manager-cursor-selector-offset{margin-left:-22px;margin-top:56px}.netless-window-manager-cursor-text-offset{margin-left:-30px;margin-top:18px}.netless-window-manager-cursor-shape-offset{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:180px;height:64px;margin-left:-30px;margin-top:12px}.netless-window-manager-cursor-name{width:100%;height:48px;display:flex;align-items:center;justify-content:center;position:absolute;top:-40px}.cursor-image-wrapper{display:flex;justify-content:center}.telebox-collector{position:absolute;right:10px;bottom:15px}.tele-fancy-scrollbar{overscroll-behavior:contain;overflow:auto;overflow-y:scroll;overflow-y:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.tele-fancy-scrollbar::-webkit-scrollbar{height:8px;width:8px}.tele-fancy-scrollbar::-webkit-scrollbar-track{background-color:transparent}.tele-fancy-scrollbar::-webkit-scrollbar-thumb{background-color:#444e601a;background-color:transparent;border-radius:4px;transition:background-color .4s}.tele-fancy-scrollbar:hover::-webkit-scrollbar-thumb{background-color:#444e601a}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:hover{background-color:#444e6033}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:active{background-color:#444e6033}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:vertical{min-height:50px}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-box{position:absolute;top:0;left:0;z-index:100;transition:width .4s cubic-bezier(.4,.9,.71,1.02),height .4s cubic-bezier(.55,.82,.63,.95),opacity .6s cubic-bezier(.7,0,.84,0),transform .4s ease}.telebox-box-main{position:relative;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#f9f9fc;box-shadow:0 4px 10px #2f419226;border-radius:6px;border:1px solid #e3e3ec}.telebox-titlebar-wrap{flex-shrink:0;position:relative;z-index:1}.telebox-content-wrap{flex:1;width:100%;overflow:hidden;display:flex;justify-content:center;align-items:center}.telebox-content{width:100%;height:100%;position:relative}.telebox-footer-wrap{flex-shrink:0;display:flex;flex-direction:column}.telebox-footer-wrap:before{content:"";display:block;flex:1}.telebox-resize-handle{position:absolute;z-index:2147483647}.telebox-n{width:100%;height:5px;left:0;top:-5px;cursor:n-resize}.telebox-s{width:100%;height:5px;left:0;bottom:-5px;cursor:s-resize}.telebox-w{width:5px;height:100%;left:-5px;top:0;cursor:w-resize}.telebox-e{width:5px;height:100%;right:-5px;top:0;cursor:e-resize}.telebox-nw{width:15px;height:15px;top:-5px;left:-5px;cursor:nw-resize}.telebox-ne{width:15px;height:15px;top:-5px;right:-5px;cursor:ne-resize}.telebox-se{width:15px;height:15px;bottom:-5px;right:-5px;cursor:se-resize}.telebox-sw{width:15px;height:15px;bottom:-5px;left:-5px;cursor:sw-resize}.telebox-track-mask{position:fixed;top:0;left:0;z-index:2147483647;width:100%;height:100%;background:rgba(0,0,0,.0001);cursor:move}.telebox-cursor-n{cursor:n-resize}.telebox-cursor-s{cursor:s-resize}.telebox-cursor-w{cursor:w-resize}.telebox-cursor-e{cursor:e-resize}.telebox-cursor-nw{cursor:nw-resize}.telebox-cursor-ne{cursor:ne-resize}.telebox-cursor-se{cursor:se-resize}.telebox-cursor-sw{cursor:sw-resize}.telebox-maximized .telebox-resize-handles,.telebox-no-resize .telebox-resize-handles{display:none}.telebox-maximized{box-shadow:none;transition:none}.telebox-minimized{transition:width 50ms cubic-bezier(.4,.9,.71,1.02),height 50ms cubic-bezier(.55,.82,.63,.95),opacity .6s cubic-bezier(.7,0,.84,0),transform .6s ease;opacity:0;pointer-events:none;user-select:none}.telebox-transforming{will-change:transform;transition:opacity .6s cubic-bezier(.7,0,.84,0)}.telebox-readonly .telebox-resize-handle{cursor:initial!important;pointer-events:none!important}.telebox-color-scheme-dark .telebox-box-main{color:#e9e9e9;background:#212126;border-color:#43434d}.telebox-titlebar{box-sizing:border-box;height:26px;display:flex;align-items:center;padding:0 16px;background:#fff;user-select:none;border-bottom:1px solid #eeeef7;touch-action:manipulation}.telebox-title-area{overflow:hidden;position:relative;height:100%;flex:1;display:flex;align-items:center}.telebox-title{overflow:hidden;margin:0;padding:0;font-size:14px;font-weight:400;font-family:PingFangSC-Regular,PingFang SC;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;color:#191919}.telebox-drag-area{position:absolute;inset:0;margin:auto;z-index:10}.telebox-titlebar-btns{white-space:nowrap;word-break:keep-all;margin-left:auto;font-size:0}.telebox-titlebar-btn{width:22px;height:22px;padding:0;outline:0;border:none;background:0 0;cursor:pointer}.telebox-titlebar-btn~.telebox-titlebar-btn{margin-left:10px}.telebox-titlebar-btn-icon{width:22px;height:22px}.telebox-readonly .telebox-titlebar-btn{cursor:not-allowed}.telebox-titlebar-icon-minimize{background:center/cover no-repeat url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPHBhdGggZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOSAxM2gxMHYxLjZIOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=)}.telebox-titlebar-icon-maximize{background:center/cover no-repeat url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPGcgZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBtYXNrPSJ1cmwoI2IpIj4KICAgICAgICAgICAgPHBhdGgKICAgICAgICAgICAgICAgIGQ9Ik0yMC40ODEgMTcuMWgxLjJ2NC41ODFIMTcuMXYtMS4yaDMuMzgxVjE3LjF6bS0xNC4xOTA1LS4wMDloMS4ydjMuMzgxaDMuMzgwOXYxLjJoLTQuNTgxdi00LjU4MXpNMTcuMSA2LjE5MDVoNC41ODF2NC41ODA5aC0xLjJ2LTMuMzgxSDE3LjF2LTEuMnptLTEwLjcwMDguMTA4N2g0Ljc5ODV2MS4ySDcuNTk5MnYzLjU5ODVoLTEuMlY2LjI5OTJ6IiAvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==)}.telebox-titlebar-icon-maximize.is-active{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjZ2MjZIMHoiIC8+CiAgICAgICAgPHBhdGggaWQ9ImMiIGQ9Ik0yNi44NjkgMEwyOCAxLjEzMVYyNi44N0wyNi44NjkgMjhIMS4xM0wwIDI2Ljg3VjEuMTMxTDEuMTMgMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPgogICAgICAgICAgICA8bWFzayBpZD0iYiIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNhIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tNC42NDI5LTQuNjQyOWgzNS4yODU4djM1LjI4NThILTQuNjQyOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8bWFzayBpZD0iZCIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNjIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tMTcuNTE2OCAxNEwxNC0xNy41MTY4IDQ1LjUxNjggMTQgMTQgNDUuNTE2OHoiIG1hc2s9InVybCgjZCkiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxwYXRoIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjIiCiAgICAgICAgICAgIGQ9Ik0xMC4wODg2IDIxLjQ4NjV2LTMuNjk2Nkg2LjM5Mk0yMS4zODU1IDEwLjE4OTVoLTMuNjk2NlY2LjQ5M00yMS40MDIgMTcuNzk4M2gtMy42OTY2djMuNjk2Nk0xMC4yNTAzIDYuMTQ5OHYzLjg5ODVINi4zNTE3IiAvPgogICAgPC9nPgo8L3N2Zz4K)}.telebox-titlebar-icon-close{background:center/cover no-repeat url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjQiPgogICAgICAgIDxwYXRoIGQ9Ik04LjM1MyAyMC4zMzIxTDIwLjMzMiA4LjM1M00yMC4zMzIyIDIwLjMzMjFMOC4zNTMgOC4zNTMiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=)}.telebox-color-scheme-dark .telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-collector{visibility:hidden;display:block;position:absolute;z-index:200;width:40px;height:40px;margin:0;padding:0;border:none;outline:0;font-size:0;border-radius:50%;background:#fff;box-shadow:0 2px 6px #2f419226;cursor:pointer;user-select:none;pointer-events:none;background-repeat:no-repeat;background-size:18px 16px;background-position:center}.telebox-collector-visible{visibility:visible;pointer-events:initial}.telebox-collector-readonly{cursor:not-allowed}.telebox-color-scheme-dark.telebox-collector{background-color:#43434d}.telebox-max-titlebar{display:none;position:absolute;top:0;left:0;z-index:50000;user-select:none}.telebox-max-titlebar .telebox-drag-area{height:100%;min-width:16px;position:static;margin:0;flex-grow:1;flex-shrink:0}.telebox-max-titlebar-maximized{display:flex}.telebox-titles{height:100%;margin:0;overflow-y:hidden;overflow-x:scroll;overflow-x:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.telebox-titles::-webkit-scrollbar{height:8px;width:8px}.telebox-titles::-webkit-scrollbar-track{background-color:transparent}.telebox-titles::-webkit-scrollbar-thumb{background-color:#eeeef7cc;background-color:transparent;border-radius:4px;transition:background-color .4s}.telebox-titles:hover::-webkit-scrollbar-thumb{background-color:#eeeef7cc}.telebox-titles::-webkit-scrollbar-thumb:hover{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:active{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:vertical{min-height:50px}.telebox-titles::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-titles-content{height:100%;display:flex;flex-wrap:nowrap;align-items:center;padding:0}.telebox-titles-tab{height:100%;overflow:hidden;max-width:182px;min-width:50px;padding:0 26px 0 16px;outline:0;font-size:13px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all;border:none;border-right:1px solid #e5e5f0;color:#7b88a0;background:0 0;cursor:pointer;user-select:none}.telebox-titles-tab-focus{color:#357bf6}.telebox-readonly .telebox-titles-tab{cursor:not-allowed}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark.telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-color-scheme-dark .telebox-titles-tab{border-right-color:#7b88a0}.telebox-color-scheme-dark .telebox-title{color:#e9e9e9}.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}.tippy-box[data-theme~=light]{color:#26323d;box-shadow:0 0 20px 4px #9aa1b126,0 4px 80px -8px #24282f40,0 4px 4px -2px #5b5e6926;background-color:#fff}.tippy-box[data-theme~=light][data-placement^=top]>.tippy-arrow:before{border-top-color:#fff}.tippy-box[data-theme~=light][data-placement^=bottom]>.tippy-arrow:before{border-bottom-color:#fff}.tippy-box[data-theme~=light][data-placement^=left]>.tippy-arrow:before{border-left-color:#fff}.tippy-box[data-theme~=light][data-placement^=right]>.tippy-arrow:before{border-right-color:#fff}.tippy-box[data-theme~=light]>.tippy-backdrop{background-color:#fff}.tippy-box[data-theme~=light]>.tippy-svg-arrow{fill:#fff}.rc-slider{position:relative;height:14px;padding:5px 0;width:100%;border-radius:6px;touch-action:none;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider *{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-rail{position:absolute;width:100%;background-color:#e9e9e9;height:4px;border-radius:6px}.rc-slider-track{position:absolute;left:0;height:4px;border-radius:6px;background-color:#abe2fb}.rc-slider-handle{position:absolute;width:14px;height:14px;cursor:pointer;cursor:-webkit-grab;margin-top:-5px;cursor:grab;border-radius:50%;border:solid 2px #96dbfa;background-color:#fff;touch-action:pan-x}.rc-slider-handle-dragging.rc-slider-handle-dragging.rc-slider-handle-dragging{border-color:#57c5f7;box-shadow:0 0 0 5px #96dbfa}.rc-slider-handle:focus{outline:none}.rc-slider-handle-click-focused:focus{border-color:#96dbfa;box-shadow:unset}.rc-slider-handle:hover{border-color:#57c5f7}.rc-slider-handle:active{border-color:#57c5f7;box-shadow:0 0 5px #57c5f7;cursor:-webkit-grabbing;cursor:grabbing}.rc-slider-mark{position:absolute;top:18px;left:0;width:100%;font-size:12px}.rc-slider-mark-text{position:absolute;display:inline-block;vertical-align:middle;text-align:center;cursor:pointer;color:#999}.rc-slider-mark-text-active{color:#666}.rc-slider-step{position:absolute;width:100%;height:4px;background:transparent}.rc-slider-dot{position:absolute;bottom:-2px;margin-left:-4px;width:8px;height:8px;border:2px solid #e9e9e9;background-color:#fff;cursor:pointer;border-radius:50%;vertical-align:middle}.rc-slider-dot-active{border-color:#96dbfa}.rc-slider-dot-reverse{margin-right:-4px}.rc-slider-disabled{background-color:#e9e9e9}.rc-slider-disabled .rc-slider-track{background-color:#ccc}.rc-slider-disabled .rc-slider-handle,.rc-slider-disabled .rc-slider-dot{border-color:#ccc;box-shadow:none;background-color:#fff;cursor:not-allowed}.rc-slider-disabled .rc-slider-mark-text,.rc-slider-disabled .rc-slider-dot{cursor:not-allowed!important}.rc-slider-vertical{width:14px;height:100%;padding:0 5px}.rc-slider-vertical .rc-slider-rail{height:100%;width:4px}.rc-slider-vertical .rc-slider-track{left:5px;bottom:0;width:4px}.rc-slider-vertical .rc-slider-handle{margin-left:-5px;touch-action:pan-y}.rc-slider-vertical .rc-slider-mark{top:0;left:18px;height:100%}.rc-slider-vertical .rc-slider-step{height:100%;width:4px}.rc-slider-vertical .rc-slider-dot{left:2px;margin-bottom:-4px}.rc-slider-vertical .rc-slider-dot:first-child{margin-bottom:-4px}.rc-slider-vertical .rc-slider-dot:last-child{margin-bottom:-4px}.rc-slider-tooltip-zoom-down-enter,.rc-slider-tooltip-zoom-down-appear,.rc-slider-tooltip-zoom-down-leave{animation-duration:.3s;animation-fill-mode:both;display:block!important;animation-play-state:paused}.rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active,.rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active{animation-name:rcSliderTooltipZoomDownIn;animation-play-state:running}.rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active{animation-name:rcSliderTooltipZoomDownOut;animation-play-state:running}.rc-slider-tooltip-zoom-down-enter,.rc-slider-tooltip-zoom-down-appear{transform:scale(0);animation-timing-function:cubic-bezier(.23,1,.32,1)}.rc-slider-tooltip-zoom-down-leave{animation-timing-function:cubic-bezier(.755,.05,.855,.06)}@keyframes rcSliderTooltipZoomDownIn{0%{opacity:0;transform-origin:50% 100%;transform:scale(0)}to{transform-origin:50% 100%;transform:scale(1)}}@keyframes rcSliderTooltipZoomDownOut{0%{transform-origin:50% 100%;transform:scale(1)}to{opacity:0;transform-origin:50% 100%;transform:scale(0)}}.rc-slider-tooltip{position:absolute;left:-9999px;top:-9999px;visibility:visible;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-tooltip *{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-tooltip-hidden{display:none}.rc-slider-tooltip-placement-top{padding:4px 0 8px}.rc-slider-tooltip-inner{padding:6px 2px;min-width:24px;height:24px;font-size:12px;line-height:1;color:#fff;text-align:center;text-decoration:none;background-color:#6c6c6c;border-radius:6px;box-shadow:0 0 4px #d9d9d9}.rc-slider-tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow{bottom:4px;left:50%;margin-left:-4px;border-width:4px 4px 0;border-top-color:#6c6c6c}.fastboard-root{position:relative;width:100%;height:100%;overflow:hidden}.fastboard-view{position:absolute;top:0;left:0;width:100%;height:100%}.fastboard-left{position:absolute;top:0;left:0;height:calc(100% - 48px);padding:16px;z-index:201;display:flex;align-items:center}.fastboard-bottom-left,.fastboard-bottom-right{display:flex;gap:10px;position:absolute;bottom:8px;left:8px;padding:8px;z-index:200}.fastboard-bottom-right{left:initial;right:8px}.fastboard-redo-undo{display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:4px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-redo-undo.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-redo-undo.dark{color:#ddd;background-color:#333333d9;border:1px solid rgba(0,0,0,.45)}.fastboard-redo-undo-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:0;width:24px;height:24px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1}.fastboard-redo-undo-btn svg,.fastboard-redo-undo-btn img{width:1em;height:1em}.fastboard-redo-undo-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-redo-undo-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-redo-undo-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-page-control{display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:4px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-page-control.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-page-control.dark{color:#ddd;background-color:#333333d9;border:1px solid rgba(0,0,0,.45)}.fastboard-page-control-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:0;width:24px;height:24px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1}.fastboard-page-control-btn svg,.fastboard-page-control-btn img{width:1em;height:1em}.fastboard-page-control-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-page-control-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-page-control-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-page-control-cut-line{height:24px;width:.5px}.fastboard-page-control-cut-line.light{background-color:#e7e7e7}.fastboard-page-control-cut-line.dark{background-color:#ffffff26}.fastboard-page-control-slash{opacity:.6}.fastboard-page-control-page,.fastboard-page-control-slash,.fastboard-page-control-page-count{font-size:12px;font-variant-numeric:tabular-nums}.fastboard-zoom-control{position:relative;display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:4px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-zoom-control.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-zoom-control.dark{color:#ddd;background-color:#333333d9;border:1px solid rgba(0,0,0,.45)}.fastboard-zoom-control-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:0;width:24px;height:24px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1}.fastboard-zoom-control-btn svg,.fastboard-zoom-control-btn img{width:1em;height:1em}.fastboard-zoom-control-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-zoom-control-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-zoom-control-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-zoom-control-cut-line{height:24px;width:.5px}.fastboard-zoom-control-cut-line.light{background-color:#e7e7e7}.fastboard-zoom-control-cut-line.dark{background-color:#ffffff26}.fastboard-zoom-control-percent{opacity:.6}.fastboard-zoom-control-scale,.fastboard-zoom-control-percent{font-size:12px;font-variant-numeric:tabular-nums}.fastboard-toolbar{display:flex;align-items:center;padding:4px;border-radius:4px;flex-direction:column;gap:4px;position:absolute;z-index:100;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-toolbar .rc-slider{padding:6px 0}.fastboard-toolbar .rc-slider-rail,.fastboard-toolbar .rc-slider-track{height:2px}.fastboard-toolbar .tippy-content{padding:8px}.fastboard-toolbar .tippy-box{border:1px solid rgba(0,0,0,.15);background-color:#333333f2;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-toolbar .tippy-box[data-theme~=light]{background-color:#fffffff2;box-shadow:0 5px 10px #00000040}.fastboard-toolbar.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-toolbar.expanded{border:1px solid rgba(0,0,0,.15)}.fastboard-toolbar.dark{color:#ddd;background-color:#333333d9}.fastboard-toolbar.expanded:hover{box-shadow:0 0 5px #00000040;transform:translate(0)}.fastboard-toolbar.collapsed{padding:0;background-color:transparent}.fastboard-toolbar-tooltip{display:inline-flex;align-items:center;gap:4px}.fastboard-toolbar-hotkey{margin-right:-4px;width:24px;height:24px;border-radius:4px;background-color:#ffffff1a;display:inline-flex;align-items:center;justify-content:center}.fastboard-toolbar-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:4px;width:32px;height:32px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1;position:relative}.fastboard-toolbar-btn-interactive{display:inline-block;width:32px;height:32px}.fastboard-toolbar-btn svg,.fastboard-toolbar-btn img{width:1em;height:1em}.fastboard-toolbar-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-toolbar-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-toolbar-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-toolbar-triangle{width:0px;height:0px;border-bottom:4px solid;border-left:4px solid transparent;position:absolute;bottom:0;right:0}.fastboard-toolbar-cut-line{display:inline-block;height:.5px;width:100%}.fastboard-toolbar-cut-line.light{background-color:#e7e7e7}.fastboard-toolbar-cut-line.dark{background-color:#ffffff26}.fastboard-toolbar-section{display:inline-flex;flex-flow:column nowrap;gap:4px;scroll-behavior:smooth}.fastboard-toolbar-section.collapsed{transform:translate(-100%);transition:1s transform}.fastboard-toolbar-panel{width:120px;padding:0;display:flex;flex-flow:column nowrap;align-items:center;gap:8px}.fastboard-toolbar-panel.apps{width:224px}.fastboard-toolbar-color-box,.fastboard-toolbar-shapes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;align-items:center;justify-items:center}.fastboard-toolbar-color-box .fastboard-toolbar-btn,.fastboard-toolbar-shapes .fastboard-toolbar-btn{padding:0;width:24px;height:24px}.fastboard-toolbar-apps{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-items:center;justify-items:center}.fastboard-toolbar-apps .fastboard-toolbar-btn{width:40px;height:40px;font-size:40px}.fastboard-toolbar-app-icon{padding-top:4px;display:inline-flex;flex-flow:column nowrap;align-items:center;gap:4px}.fastboard-toolbar-app-icon .fastboard-toolbar-btn{padding:0}.fastboard-toolbar-app-icon-text{font-size:12px;color:#5d5d5d;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fastboard-toolbar-color-item{width:24px;height:24px;border-radius:4px;cursor:pointer}.fastboard-toolbar-color-item *.light:hover{background-color:#f5f5f5}.fastboard-toolbar-color-item *.dark:hover{background-color:#333}.fastboard-toolbar-color-border{width:24px;height:24px;border:1px solid transparent;border-radius:4px;display:inline-flex;align-items:center;justify-content:center}.fastboard-toolbar-color-border.active.light,.fastboard-toolbar-color-border.active.dark{border:1px solid rgba(51,129,255,.8)}.fastboard-toolbar-color-btn{margin:0;border:1px solid rgba(0,0,0,.24);padding:0;appearance:none;width:16px;height:16px;border-radius:4px;cursor:pointer}.fastboard-toolbar-color-btn:focus-visible{outline-offset:2px}.fastboard-toolbar-mask-btn{width:17px;height:62px;cursor:pointer}.fastboard-toolbar-mask-btn.dark{filter:invert(.8)}.fastboard-toolbar-expand-btn{display:flex;align-items:center;position:absolute;left:0}.fastboard-player-control{width:100%;display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:4px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-player-control.auto-hide{opacity:0;transition:opacity .2s}.fastboard-player-control.auto-hide:hover{opacity:1}.fastboard-player-control .rc-slider-disabled{background:transparent;opacity:.5}.fastboard-player-control .rc-slider-rail,.fastboard-player-control .rc-slider-track{height:2px}.fastboard-player-control .tippy-content{padding:8px}.fastboard-player-control .tippy-box{border:1px solid rgba(0,0,0,.15);background-color:#333333f2;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-player-control .tippy-box[data-theme~=light]{background-color:#fffffff2;box-shadow:0 5px 10px #00000040}.fastboard-player-control.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-player-control.dark{color:#ddd;background-color:#333333d9;border:1px solid rgba(0,0,0,.45)}.fastboard-player-control-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:0;min-width:24px;height:24px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.fastboard-player-control-btn svg,.fastboard-player-control-btn img{width:1em;height:1em}.fastboard-player-control-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-player-control-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-player-control-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-player-control-btn.loading{animation:fastboard-player-control-rotate .5s linear infinite}@keyframes fastboard-player-control-rotate{to{transform:rotate(360deg)}}.fastboard-player-control-panel{padding:0;display:flex;flex-flow:column nowrap;align-items:stretch;gap:4px}.fastboard-player-control-panel .fastboard-player-control-btn{width:initial;height:initial;user-select:none;font-size:12px;padding:4px;justify-content:flex-end}.fastboard-player-control-panel .fastboard-player-control-btn.active{color:#3381ff}.fastboard-player-control-slider{width:100%;padding:0 7px}.fastboard-player-control-slider.loading{cursor:not-allowed}.fastboard-player-control-slash{opacity:.6}.fastboard-player-control-current,.fastboard-player-control-slash,.fastboard-player-control-total,.fastboard-player-control-speed-text{font-size:12px;font-variant-numeric:tabular-nums}.tippy-box.fastboard-tip{color:#eee;background-color:#000000f2;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.tippy-box.fastboard-tip[data-placement^=right]>.tippy-arrow:before{top:4px;border-width:4px;border-right-color:#000}.tippy-box.fastboard-tip[data-placement^=top]>.tippy-arrow:before{left:4px;border-width:4px;border-top-color:#000}\n';
139
+ var style_default = '.netless-window-manager-playground{width:100%;height:100%;position:relative;z-index:1;overflow:hidden;user-select:none}.netless-window-manager-sizer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;overflow:hidden;display:flex}.netless-window-manager-sizer-horizontal{flex-direction:column}.netless-window-manager-sizer:before,.netless-window-manager-sizer:after{flex:1;content:"";display:block}.netless-window-manager-chess-sizer:before,.netless-window-manager-chess-sizer:after{background-image:linear-gradient(45deg,#b0b0b0 25%,transparent 25%),linear-gradient(-45deg,#b0b0b0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#b0b0b0 75%),linear-gradient(-45deg,transparent 75%,#b0b0b0 75%);background-color:#fff;background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px}.netless-window-manager-wrapper{position:relative;z-index:1;width:100%;height:100%;overflow:hidden}.netless-window-manager-main-view{width:100%;height:100%}.netless-window-manager-cursor-pencil-image,.netless-window-manager-cursor-eraser-image{width:26px;height:26px}.netless-window-manager-cursor-selector-image{width:24px;height:24px}.netless-window-manager-cursor-selector-avatar{border-radius:50%;border-style:solid;border-width:2px;border-color:#fff;margin-bottom:2px}.netless-window-manager-cursor-selector-avatar img{width:12px}.netless-window-manager-cursor-inner{border-radius:4px;display:flex;align-items:center;justify-content:center;flex-direction:row;padding-left:4px;padding-right:4px;font-size:12px}.netless-window-manager-cursor-inner-mellow{height:32px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex-direction:row;padding-left:16px;padding-right:16px}.netless-window-manager-cursor-tag-name{font-size:12px;margin-left:4px;padding:2px 8px;border-radius:4px}.netless-window-manager-cursor-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:26px;height:26px;z-index:2147483647;left:0;top:0;will-change:transform;transition:transform .1s;transform-origin:0 0;user-select:none}.netless-window-manager-cursor-pencil-offset{margin-left:-20px}.netless-window-manager-cursor-selector-offset{margin-left:-22px;margin-top:56px}.netless-window-manager-cursor-text-offset{margin-left:-30px;margin-top:18px}.netless-window-manager-cursor-shape-offset{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;width:180px;height:64px;margin-left:-30px;margin-top:12px}.netless-window-manager-cursor-name{width:100%;height:48px;display:flex;align-items:center;justify-content:center;position:absolute;top:-40px}.cursor-image-wrapper{display:flex;justify-content:center}.telebox-collector{position:absolute;right:10px;bottom:15px}.tele-fancy-scrollbar{overscroll-behavior:contain;overflow:auto;overflow-y:scroll;overflow-y:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.tele-fancy-scrollbar::-webkit-scrollbar{height:8px;width:8px}.tele-fancy-scrollbar::-webkit-scrollbar-track{background-color:transparent}.tele-fancy-scrollbar::-webkit-scrollbar-thumb{background-color:#444e601a;background-color:transparent;border-radius:4px;transition:background-color .4s}.tele-fancy-scrollbar:hover::-webkit-scrollbar-thumb{background-color:#444e601a}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:hover{background-color:#444e6033}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:active{background-color:#444e6033}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:vertical{min-height:50px}.tele-fancy-scrollbar::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-box{position:absolute;top:0;left:0;z-index:100;transition:width .4s cubic-bezier(.4,.9,.71,1.02),height .4s cubic-bezier(.55,.82,.63,.95),opacity .6s cubic-bezier(.7,0,.84,0),transform .4s ease}.telebox-box-main{position:relative;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#f9f9fc;box-shadow:0 4px 10px #2f419226;border-radius:6px;border:1px solid #e3e3ec}.telebox-titlebar-wrap{flex-shrink:0;position:relative;z-index:1}.telebox-content-wrap{flex:1;width:100%;overflow:hidden;display:flex;justify-content:center;align-items:center}.telebox-content{width:100%;height:100%;position:relative}.telebox-footer-wrap{flex-shrink:0;display:flex;flex-direction:column}.telebox-footer-wrap:before{content:"";display:block;flex:1}.telebox-resize-handle{position:absolute;z-index:2147483647}.telebox-n{width:100%;height:5px;left:0;top:-5px;cursor:n-resize}.telebox-s{width:100%;height:5px;left:0;bottom:-5px;cursor:s-resize}.telebox-w{width:5px;height:100%;left:-5px;top:0;cursor:w-resize}.telebox-e{width:5px;height:100%;right:-5px;top:0;cursor:e-resize}.telebox-nw{width:15px;height:15px;top:-5px;left:-5px;cursor:nw-resize}.telebox-ne{width:15px;height:15px;top:-5px;right:-5px;cursor:ne-resize}.telebox-se{width:15px;height:15px;bottom:-5px;right:-5px;cursor:se-resize}.telebox-sw{width:15px;height:15px;bottom:-5px;left:-5px;cursor:sw-resize}.telebox-track-mask{position:fixed;top:0;left:0;z-index:2147483647;width:100%;height:100%;background:rgba(0,0,0,.0001);cursor:move}.telebox-cursor-n{cursor:n-resize}.telebox-cursor-s{cursor:s-resize}.telebox-cursor-w{cursor:w-resize}.telebox-cursor-e{cursor:e-resize}.telebox-cursor-nw{cursor:nw-resize}.telebox-cursor-ne{cursor:ne-resize}.telebox-cursor-se{cursor:se-resize}.telebox-cursor-sw{cursor:sw-resize}.telebox-maximized .telebox-resize-handles,.telebox-no-resize .telebox-resize-handles{display:none}.telebox-maximized{box-shadow:none;transition:none}.telebox-minimized{transition:width 50ms cubic-bezier(.4,.9,.71,1.02),height 50ms cubic-bezier(.55,.82,.63,.95),opacity .6s cubic-bezier(.7,0,.84,0),transform .6s ease;opacity:0;pointer-events:none;user-select:none}.telebox-transforming{will-change:transform;transition:opacity .6s cubic-bezier(.7,0,.84,0)}.telebox-readonly .telebox-resize-handle{cursor:initial!important;pointer-events:none!important}.telebox-color-scheme-dark .telebox-box-main{color:#e9e9e9;background:#212126;border-color:#43434d}.telebox-titlebar{box-sizing:border-box;height:26px;display:flex;align-items:center;padding:0 16px;background:#fff;user-select:none;border-bottom:1px solid #eeeef7;touch-action:manipulation}.telebox-title-area{overflow:hidden;position:relative;height:100%;flex:1;display:flex;align-items:center}.telebox-title{overflow:hidden;margin:0;padding:0;font-size:14px;font-weight:400;font-family:PingFangSC-Regular,PingFang SC;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;color:#191919}.telebox-drag-area{position:absolute;inset:0;margin:auto;z-index:10}.telebox-titlebar-btns{white-space:nowrap;word-break:keep-all;margin-left:auto;font-size:0}.telebox-titlebar-btn{width:22px;height:22px;padding:0;outline:0;border:none;background:0 0;cursor:pointer}.telebox-titlebar-btn~.telebox-titlebar-btn{margin-left:10px}.telebox-titlebar-btn-icon{width:22px;height:22px}.telebox-readonly .telebox-titlebar-btn{cursor:not-allowed}.telebox-titlebar-icon-minimize{background:center/cover no-repeat url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPHBhdGggZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOSAxM2gxMHYxLjZIOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=)}.telebox-titlebar-icon-maximize{background:center/cover no-repeat url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjh2MjhIMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj4KICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIgLz4KICAgICAgICA8L21hc2s+CiAgICAgICAgPGcgZmlsbD0iI0E3QTdDQSIgZmlsbC1ydWxlPSJub256ZXJvIiBtYXNrPSJ1cmwoI2IpIj4KICAgICAgICAgICAgPHBhdGgKICAgICAgICAgICAgICAgIGQ9Ik0yMC40ODEgMTcuMWgxLjJ2NC41ODFIMTcuMXYtMS4yaDMuMzgxVjE3LjF6bS0xNC4xOTA1LS4wMDloMS4ydjMuMzgxaDMuMzgwOXYxLjJoLTQuNTgxdi00LjU4MXpNMTcuMSA2LjE5MDVoNC41ODF2NC41ODA5aC0xLjJ2LTMuMzgxSDE3LjF2LTEuMnptLTEwLjcwMDguMTA4N2g0Ljc5ODV2MS4ySDcuNTk5MnYzLjU5ODVoLTEuMlY2LjI5OTJ6IiAvPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==)}.telebox-titlebar-icon-maximize.is-active{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjggMjgiPgogICAgPGRlZnM+CiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0wIDBoMjZ2MjZIMHoiIC8+CiAgICAgICAgPHBhdGggaWQ9ImMiIGQ9Ik0yNi44NjkgMEwyOCAxLjEzMVYyNi44N0wyNi44NjkgMjhIMS4xM0wwIDI2Ljg3VjEuMTMxTDEuMTMgMHoiIC8+CiAgICA8L2RlZnM+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPgogICAgICAgICAgICA8bWFzayBpZD0iYiIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNhIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tNC42NDI5LTQuNjQyOWgzNS4yODU4djM1LjI4NThILTQuNjQyOXoiIG1hc2s9InVybCgjYikiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxnPgogICAgICAgICAgICA8bWFzayBpZD0iZCIgZmlsbD0iI2ZmZiI+CiAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNjIiAvPgogICAgICAgICAgICA8L21hc2s+CiAgICAgICAgICAgIDxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0tMTcuNTE2OCAxNEwxNC0xNy41MTY4IDQ1LjUxNjggMTQgMTQgNDUuNTE2OHoiIG1hc2s9InVybCgjZCkiIC8+CiAgICAgICAgPC9nPgogICAgICAgIDxwYXRoIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjIiCiAgICAgICAgICAgIGQ9Ik0xMC4wODg2IDIxLjQ4NjV2LTMuNjk2Nkg2LjM5Mk0yMS4zODU1IDEwLjE4OTVoLTMuNjk2NlY2LjQ5M00yMS40MDIgMTcuNzk4M2gtMy42OTY2djMuNjk2Nk0xMC4yNTAzIDYuMTQ5OHYzLjg5ODVINi4zNTE3IiAvPgogICAgPC9nPgo8L3N2Zz4K)}.telebox-titlebar-icon-close{background:center/cover no-repeat url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iI0E3QTdDQSIgc3Ryb2tlLXdpZHRoPSIxLjQiPgogICAgICAgIDxwYXRoIGQ9Ik04LjM1MyAyMC4zMzIxTDIwLjMzMiA4LjM1M00yMC4zMzIyIDIwLjMzMjFMOC4zNTMgOC4zNTMiIC8+CiAgICA8L2c+Cjwvc3ZnPgo=)}.telebox-color-scheme-dark .telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-collector{visibility:hidden;display:block;position:absolute;z-index:200;width:40px;height:40px;margin:0;padding:0;border:none;outline:0;font-size:0;border-radius:50%;background:#fff;box-shadow:0 2px 6px #2f419226;cursor:pointer;user-select:none;pointer-events:none;background-repeat:no-repeat;background-size:18px 16px;background-position:center}.telebox-collector-visible{visibility:visible;pointer-events:initial}.telebox-collector-readonly{cursor:not-allowed}.telebox-color-scheme-dark.telebox-collector{background-color:#43434d}.telebox-max-titlebar{display:none;position:absolute;top:0;left:0;z-index:50000;user-select:none}.telebox-max-titlebar .telebox-drag-area{height:100%;min-width:16px;position:static;margin:0;flex-grow:1;flex-shrink:0}.telebox-max-titlebar-maximized{display:flex}.telebox-titles{height:100%;margin:0;overflow-y:hidden;overflow-x:scroll;overflow-x:overlay;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;scrollbar-width:auto}.telebox-titles::-webkit-scrollbar{height:8px;width:8px}.telebox-titles::-webkit-scrollbar-track{background-color:transparent}.telebox-titles::-webkit-scrollbar-thumb{background-color:#eeeef7cc;background-color:transparent;border-radius:4px;transition:background-color .4s}.telebox-titles:hover::-webkit-scrollbar-thumb{background-color:#eeeef7cc}.telebox-titles::-webkit-scrollbar-thumb:hover{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:active{background-color:#eeeef7}.telebox-titles::-webkit-scrollbar-thumb:vertical{min-height:50px}.telebox-titles::-webkit-scrollbar-thumb:horizontal{min-width:50px}.telebox-titles-content{height:100%;display:flex;flex-wrap:nowrap;align-items:center;padding:0}.telebox-titles-tab{height:100%;overflow:hidden;max-width:182px;min-width:50px;padding:0 26px 0 16px;outline:0;font-size:13px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all;border:none;border-right:1px solid #e5e5f0;color:#7b88a0;background:0 0;cursor:pointer;user-select:none}.telebox-titles-tab-focus{color:#357bf6}.telebox-readonly .telebox-titles-tab{cursor:not-allowed}.telebox-color-scheme-dark{color-scheme:dark}.telebox-color-scheme-dark.telebox-titlebar{color:#e9e9e9;background:#43434d;border-bottom:none}.telebox-color-scheme-dark .telebox-titles-tab{border-right-color:#7b88a0}.telebox-color-scheme-dark .telebox-title{color:#e9e9e9}.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}.tippy-box[data-theme~=light]{color:#26323d;box-shadow:0 0 20px 4px #9aa1b126,0 4px 80px -8px #24282f40,0 4px 4px -2px #5b5e6926;background-color:#fff}.tippy-box[data-theme~=light][data-placement^=top]>.tippy-arrow:before{border-top-color:#fff}.tippy-box[data-theme~=light][data-placement^=bottom]>.tippy-arrow:before{border-bottom-color:#fff}.tippy-box[data-theme~=light][data-placement^=left]>.tippy-arrow:before{border-left-color:#fff}.tippy-box[data-theme~=light][data-placement^=right]>.tippy-arrow:before{border-right-color:#fff}.tippy-box[data-theme~=light]>.tippy-backdrop{background-color:#fff}.tippy-box[data-theme~=light]>.tippy-svg-arrow{fill:#fff}.rc-slider{position:relative;height:14px;padding:5px 0;width:100%;border-radius:6px;touch-action:none;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider *{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-rail{position:absolute;width:100%;background-color:#e9e9e9;height:4px;border-radius:6px}.rc-slider-track{position:absolute;left:0;height:4px;border-radius:6px;background-color:#abe2fb}.rc-slider-handle{position:absolute;width:14px;height:14px;cursor:pointer;cursor:-webkit-grab;margin-top:-5px;cursor:grab;border-radius:50%;border:solid 2px #96dbfa;background-color:#fff;touch-action:pan-x}.rc-slider-handle-dragging.rc-slider-handle-dragging.rc-slider-handle-dragging{border-color:#57c5f7;box-shadow:0 0 0 5px #96dbfa}.rc-slider-handle:focus{outline:none}.rc-slider-handle-click-focused:focus{border-color:#96dbfa;box-shadow:unset}.rc-slider-handle:hover{border-color:#57c5f7}.rc-slider-handle:active{border-color:#57c5f7;box-shadow:0 0 5px #57c5f7;cursor:-webkit-grabbing;cursor:grabbing}.rc-slider-mark{position:absolute;top:18px;left:0;width:100%;font-size:12px}.rc-slider-mark-text{position:absolute;display:inline-block;vertical-align:middle;text-align:center;cursor:pointer;color:#999}.rc-slider-mark-text-active{color:#666}.rc-slider-step{position:absolute;width:100%;height:4px;background:transparent}.rc-slider-dot{position:absolute;bottom:-2px;margin-left:-4px;width:8px;height:8px;border:2px solid #e9e9e9;background-color:#fff;cursor:pointer;border-radius:50%;vertical-align:middle}.rc-slider-dot-active{border-color:#96dbfa}.rc-slider-dot-reverse{margin-right:-4px}.rc-slider-disabled{background-color:#e9e9e9}.rc-slider-disabled .rc-slider-track{background-color:#ccc}.rc-slider-disabled .rc-slider-handle,.rc-slider-disabled .rc-slider-dot{border-color:#ccc;box-shadow:none;background-color:#fff;cursor:not-allowed}.rc-slider-disabled .rc-slider-mark-text,.rc-slider-disabled .rc-slider-dot{cursor:not-allowed!important}.rc-slider-vertical{width:14px;height:100%;padding:0 5px}.rc-slider-vertical .rc-slider-rail{height:100%;width:4px}.rc-slider-vertical .rc-slider-track{left:5px;bottom:0;width:4px}.rc-slider-vertical .rc-slider-handle{margin-left:-5px;touch-action:pan-y}.rc-slider-vertical .rc-slider-mark{top:0;left:18px;height:100%}.rc-slider-vertical .rc-slider-step{height:100%;width:4px}.rc-slider-vertical .rc-slider-dot{left:2px;margin-bottom:-4px}.rc-slider-vertical .rc-slider-dot:first-child{margin-bottom:-4px}.rc-slider-vertical .rc-slider-dot:last-child{margin-bottom:-4px}.rc-slider-tooltip-zoom-down-enter,.rc-slider-tooltip-zoom-down-appear,.rc-slider-tooltip-zoom-down-leave{animation-duration:.3s;animation-fill-mode:both;display:block!important;animation-play-state:paused}.rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active,.rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active{animation-name:rcSliderTooltipZoomDownIn;animation-play-state:running}.rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active{animation-name:rcSliderTooltipZoomDownOut;animation-play-state:running}.rc-slider-tooltip-zoom-down-enter,.rc-slider-tooltip-zoom-down-appear{transform:scale(0);animation-timing-function:cubic-bezier(.23,1,.32,1)}.rc-slider-tooltip-zoom-down-leave{animation-timing-function:cubic-bezier(.755,.05,.855,.06)}@keyframes rcSliderTooltipZoomDownIn{0%{opacity:0;transform-origin:50% 100%;transform:scale(0)}to{transform-origin:50% 100%;transform:scale(1)}}@keyframes rcSliderTooltipZoomDownOut{0%{transform-origin:50% 100%;transform:scale(1)}to{opacity:0;transform-origin:50% 100%;transform:scale(0)}}.rc-slider-tooltip{position:absolute;left:-9999px;top:-9999px;visibility:visible;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-tooltip *{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-tooltip-hidden{display:none}.rc-slider-tooltip-placement-top{padding:4px 0 8px}.rc-slider-tooltip-inner{padding:6px 2px;min-width:24px;height:24px;font-size:12px;line-height:1;color:#fff;text-align:center;text-decoration:none;background-color:#6c6c6c;border-radius:6px;box-shadow:0 0 4px #d9d9d9}.rc-slider-tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow{bottom:4px;left:50%;margin-left:-4px;border-width:4px 4px 0;border-top-color:#6c6c6c}.fastboard-root{position:relative;width:100%;height:100%;overflow:hidden}.fastboard-view{position:absolute;top:0;left:0;width:100%;height:100%}.fastboard-left{position:absolute;top:0;left:0;height:calc(100% - 48px);padding:16px;z-index:201;display:flex;align-items:center}.fastboard-bottom-left,.fastboard-bottom-right{display:flex;gap:10px;position:absolute;bottom:8px;left:8px;padding:8px;z-index:200}.fastboard-bottom-right{left:initial;right:8px}.fastboard-redo-undo{display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:4px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-redo-undo.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-redo-undo.dark{color:#ddd;background-color:#333333d9;border:1px solid rgba(0,0,0,.45)}.fastboard-redo-undo-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:0;width:24px;height:24px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1}.fastboard-redo-undo-btn svg,.fastboard-redo-undo-btn img{width:1em;height:1em}.fastboard-redo-undo-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-redo-undo-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-redo-undo-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-page-control{display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:4px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-page-control.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-page-control.dark{color:#ddd;background-color:#333333d9;border:1px solid rgba(0,0,0,.45)}.fastboard-page-control-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:0;width:24px;height:24px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1}.fastboard-page-control-btn svg,.fastboard-page-control-btn img{width:1em;height:1em}.fastboard-page-control-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-page-control-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-page-control-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-page-control-cut-line{height:24px;width:.5px}.fastboard-page-control-cut-line.light{background-color:#e7e7e7}.fastboard-page-control-cut-line.dark{background-color:#ffffff26}.fastboard-page-control-slash{opacity:.6}.fastboard-page-control-page,.fastboard-page-control-slash,.fastboard-page-control-page-count{font-size:12px;font-variant-numeric:tabular-nums}.fastboard-zoom-control{position:relative;display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:4px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-zoom-control.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-zoom-control.dark{color:#ddd;background-color:#333333d9;border:1px solid rgba(0,0,0,.45)}.fastboard-zoom-control-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:0;width:24px;height:24px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1}.fastboard-zoom-control-btn svg,.fastboard-zoom-control-btn img{width:1em;height:1em}.fastboard-zoom-control-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-zoom-control-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-zoom-control-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-zoom-control-cut-line{height:24px;width:.5px}.fastboard-zoom-control-cut-line.light{background-color:#e7e7e7}.fastboard-zoom-control-cut-line.dark{background-color:#ffffff26}.fastboard-zoom-control-percent{opacity:.6}.fastboard-zoom-control-scale,.fastboard-zoom-control-percent{font-size:12px;font-variant-numeric:tabular-nums}.fastboard-toolbar{display:flex;align-items:center;padding:4px;border-radius:4px;flex-direction:column;gap:4px;position:absolute;z-index:100;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-toolbar .rc-slider{padding:6px 0}.fastboard-toolbar .rc-slider-rail,.fastboard-toolbar .rc-slider-track{height:2px}.fastboard-toolbar .tippy-content{padding:8px}.fastboard-toolbar .tippy-box{border:1px solid rgba(0,0,0,.15);background-color:#333333f2;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-toolbar .tippy-box[data-theme~=light]{background-color:#fffffff2;box-shadow:0 5px 10px #00000040}.fastboard-toolbar.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-toolbar.expanded{border:1px solid rgba(0,0,0,.15)}.fastboard-toolbar.dark{color:#ddd;background-color:#333333d9}.fastboard-toolbar.expanded:hover{box-shadow:0 0 5px #00000040;transform:translate(0)}.fastboard-toolbar.collapsed{padding:0;background-color:transparent}.fastboard-toolbar-tooltip{display:inline-flex;align-items:center;gap:4px}.fastboard-toolbar-hotkey{margin-right:-4px;width:24px;height:24px;border-radius:4px;background-color:#ffffff1a;display:inline-flex;align-items:center;justify-content:center}.fastboard-toolbar-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:4px;width:32px;height:32px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1;position:relative}.fastboard-toolbar-btn-interactive{display:inline-block;width:32px;height:32px}.fastboard-toolbar-btn svg,.fastboard-toolbar-btn img{width:1em;height:1em}.fastboard-toolbar-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-toolbar-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-toolbar-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-toolbar-triangle{width:0px;height:0px;border-bottom:4px solid;border-left:4px solid transparent;position:absolute;bottom:0;right:0}.fastboard-toolbar-cut-line{display:inline-block;height:.5px;width:100%}.fastboard-toolbar-cut-line.light{background-color:#e7e7e7}.fastboard-toolbar-cut-line.dark{background-color:#ffffff26}.fastboard-toolbar-section{display:inline-flex;flex-flow:column nowrap;gap:4px;scroll-behavior:smooth}.fastboard-toolbar-section.collapsed{transform:translate(-100%);transition:1s transform}.fastboard-toolbar-panel{width:120px;padding:0;display:flex;flex-flow:column nowrap;align-items:center;gap:8px}.fastboard-toolbar-panel.apps{width:224px}.fastboard-toolbar-color-box,.fastboard-toolbar-shapes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;align-items:center;justify-items:center}.fastboard-toolbar-color-box .fastboard-toolbar-btn,.fastboard-toolbar-shapes .fastboard-toolbar-btn{padding:0;width:24px;height:24px}.fastboard-toolbar-apps{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-items:center;justify-items:center}.fastboard-toolbar-apps .fastboard-toolbar-btn{width:40px;height:40px;font-size:40px}.fastboard-toolbar-app-icon{padding-top:4px;display:inline-flex;flex-flow:column nowrap;align-items:center;gap:4px}.fastboard-toolbar-app-icon .fastboard-toolbar-btn{padding:0}.fastboard-toolbar-app-icon-text{font-size:12px;color:#5d5d5d;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.fastboard-toolbar-color-item{width:24px;height:24px;border-radius:4px;cursor:pointer}.fastboard-toolbar-color-item *.light:hover{background-color:#f5f5f5}.fastboard-toolbar-color-item *.dark:hover{background-color:#333}.fastboard-toolbar-color-border{width:24px;height:24px;border:1px solid transparent;border-radius:4px;display:inline-flex;align-items:center;justify-content:center}.fastboard-toolbar-color-border.active.light,.fastboard-toolbar-color-border.active.dark{border:1px solid rgba(51,129,255,.8)}.fastboard-toolbar-color-btn{margin:0;border:1px solid rgba(0,0,0,.24);padding:0;appearance:none;width:16px;height:16px;border-radius:4px;cursor:pointer}.fastboard-toolbar-color-btn:focus-visible{outline-offset:2px}.fastboard-toolbar-mask{position:absolute;left:calc(100% + 1px);top:50%;transform:translateY(-50%)}.fastboard-toolbar-mask.dark{left:100%}.fastboard-toolbar-mask-btn{width:17px;height:62px;cursor:pointer}.fastboard-toolbar-mask-btn.dark{filter:invert(.8)}.fastboard-toolbar-expand-btn{display:flex;align-items:center;position:absolute;left:0}.fastboard-player-control{width:100%;display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:4px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-player-control.auto-hide{opacity:0;transition:opacity .2s}.fastboard-player-control.auto-hide:hover{opacity:1}.fastboard-player-control .rc-slider-disabled{background:transparent;opacity:.5}.fastboard-player-control .rc-slider-rail,.fastboard-player-control .rc-slider-track{height:2px}.fastboard-player-control .tippy-content{padding:8px}.fastboard-player-control .tippy-box{border:1px solid rgba(0,0,0,.15);background-color:#333333f2;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.fastboard-player-control .tippy-box[data-theme~=light]{background-color:#fffffff2;box-shadow:0 5px 10px #00000040}.fastboard-player-control.light{color:#333;background-color:#ffffffd9;border:1px solid rgba(0,0,0,.15)}.fastboard-player-control.dark{color:#ddd;background-color:#333333d9;border:1px solid rgba(0,0,0,.45)}.fastboard-player-control-btn{appearance:none;cursor:pointer;margin:0;border:0;padding:0;min-width:24px;height:24px;background-color:transparent;border-radius:4px;font-size:24px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.fastboard-player-control-btn svg,.fastboard-player-control-btn img{width:1em;height:1em}.fastboard-player-control-btn:disabled{opacity:.5;cursor:not-allowed}.fastboard-player-control-btn.light:not(:disabled):hover{background-color:#3381ff1a}.fastboard-player-control-btn.dark:not(:disabled):hover{background-color:#3381ff40}.fastboard-player-control-btn.loading{animation:fastboard-player-control-rotate .5s linear infinite}@keyframes fastboard-player-control-rotate{to{transform:rotate(360deg)}}.fastboard-player-control-panel{padding:0;display:flex;flex-flow:column nowrap;align-items:stretch;gap:4px}.fastboard-player-control-panel .fastboard-player-control-btn{width:initial;height:initial;user-select:none;font-size:12px;padding:4px;justify-content:flex-end}.fastboard-player-control-panel .fastboard-player-control-btn.active{color:#3381ff}.fastboard-player-control-slider{width:100%;padding:0 7px}.fastboard-player-control-slider.loading{cursor:not-allowed}.fastboard-player-control-slash{opacity:.6}.fastboard-player-control-current,.fastboard-player-control-slash,.fastboard-player-control-total,.fastboard-player-control-speed-text{font-size:12px;font-variant-numeric:tabular-nums}.tippy-box.fastboard-tip{color:#eee;background-color:#000000f2;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.tippy-box.fastboard-tip[data-placement^=right]>.tippy-arrow:before{top:4px;border-width:4px;border-right-color:#000}.tippy-box.fastboard-tip[data-placement^=top]>.tippy-arrow:before{left:4px;border-width:4px;border-top-color:#000}\n';
140
140
 
141
141
  // src/behaviors/style.ts
142
142
  applyStyles(style_default);
@@ -831,94 +831,56 @@ var EmptyToolbarHook = {
831
831
  // src/components/Toolbar/Toolbar.tsx
832
832
  var import_clsx9 = __toESM(require("clsx"));
833
833
  var import_framer_motion = require("framer-motion");
834
- var import_react60 = __toESM(require("react"));
835
-
836
- // src/components/Toolbar/components/assets/collapsed.png
837
- var collapsed_default = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAB8CAYAAAAMw2JFAAAAAXNSR0IArs4c6QAAA49JREFUeF7tnLFv00AUh5/TFVYkxIDEnKFjJ/gb2CIqpUPagYXNEV2LRGk7tAiRSA0bWcC0QzowwQKuVDnCLE2KTZCMSNLkHCLalCpBkdFVMTKh8TXO+c4S16XDSb0vv/vyfE3fqwQR+ZIA4AoAdADgJ08mSVXVV9ls9nE+nzcBAAFAnweQ1Gg06gihrmEYubm5OeX4+LgBAD9Yw0iO49S63S7U6/VYq9UyCoXC2tLS0kcAwEA9VkBnIO5m7XYbJwTVanVLluWcruvfAOA7ADhhA/0Fgjfr9/tweHgYs20baZq2sbCw8HaQTqgy/wPivvKTkxN8XFPNZvMdC5lHgmAgx3EAISQhhHqGYWyGKbMviJsOC5kvBOIjcxUAWjRkHgtkSGZb07R1WjKPDeIj82cAaAatzIFBhmU2TTOXTCZfBq3ME4HQlJkKCA2ZqYJMIjN1kKAyhwYyrsyhgpwns6IoyysrK/rgQfrnqc4ExCtzrVb7tbe39yCVSr0GAFyZz2CYguANT09PwbIsaWdn5146nX4zuO+wB8EwnU5HqlQqdiKRuHNwcFDC1Zh5Iu4xWZYVU1V1eXZ29jlOhRvI0dGRVC6XP8zMzNwFgK/cQHq9HpTLZXt6evo2AFS4geDbX6lUisXj8VsA8IkbCHZlf39/Kh6P3xQg7jtHJDL826JIRCRC+gRBOCIcEY6QEhCOkBISdUQ4IhwhJSAcISUk6kjojjxaXbt0Py3jP1DCtes3ruLvVetLnenRYIgnT7OX3Y25gLgQ3gSYg3ghuIEMQ3ABOQ+COcgoCKYgfhD/Jwh+1ZE4GrdKRkJWPxhulTUSBe28ZLglMgzDHcR9N3G/BpDuHH7r4qoY+lUx6PGIoxFHQ3JHOCIcEY6QEhCOkBISdUQ4IhwhJSAcISUk6ohwxM+RyLR/RaYhLjItgpFomoxEG2kkGmvxRBPXVmPPWIypKMpD5s3X3kEh0zSfJZPJF6NmK0JrI3VHpxBCaiaTWc/n877TJtRBPMNkdrFY3Jifn8ed3njUzneYjCqIZ7xue3FxMadpGh6vu9BEEhUQr4yFQmE1yMDhRCDjyEi6JAUGGVdG6iBBZaQK4pVRluVNXdfZjsfRkHGiRGjKGBjEI+P7TCazQaqMpI1I635jtmNVRtJGpPVRg8fbtGW8EAiL6VUiyGA4vUd6TJN+0KTr0u7u7hYLGUmg0fkHBiRSVuu/AWpfZNft9vFDAAAAAElFTkSuQmCC";
834
+ var import_react59 = __toESM(require("react"));
838
835
 
839
836
  // src/components/Toolbar/components/assets/expanded.png
840
837
  var expanded_default = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAB8CAYAAAAMw2JFAAAAAXNSR0IArs4c6QAAA5xJREFUeF7tnL9v00AUx5/TlRkJMSAxZ+jYCf4GtopK6dB2qBBsjshaJErboWVJpYaNLGDaIR2YYAFXqlxhlvzAJkhGJGlyDhVNSpWgyOiqBJnQ+urznW2Jy1JVVnKffv3x8yV9LxLE5CEBwFUA6ALAzyiZJFVVX21ubj7N5/MmACAAGEQBJDWbzQZCqGcYRm52dlbpdDpNAPgRNozkOE691+tBo9FItNtto1AorC0tLX0EAAzUDwvoDGS02NHREU4IarXatizLOV3XvwHAdwBweAP9BYIXGwwGcHh4mLBtG2matrGwsPB2mA5Xmf8BGf3lJycn+HRNtFqtd2HIfCEIBnIcBxBCEkKobxjGFk+ZPUFG6YQh86VAPGSuAUCbhcy+QMZktjVNW2cls28QD5k/A0CLtjJTg4zLbJpmLpVKvaStzIFAWMrMBISFzExBgsjMHIRWZm4gfmXmCnKezIqiLK+srOjDG+mfu3ooIG6Z6/X6r/39/Udzc3OvAQBX5jOYUEHwgqenp2BZlrS7u/sgnU6/Ge53wgfBMN1uV6pWq/b09PTdSqVSwtU49ERGp8myrISqqsszMzPPcSqRgRwfH0vlcvnD1NTUIgB8jQyk3+9DuVy2Jycn7wBANTIQvPsrlUqJZDJ5GwA+RQaCXSkWixPJZPKWABldOSKR8XeLIhGRCOkTBOGIcEQ4QkpAOEJKSNQR4YhwhJSAcISUkKgjTBy5fuPmNfxCNetLA/98srp25WFaxv+UpH5QnZpxEPz7/XuLnSAwzEBwFEFgmIIEgWEOQgvDBYQGhhuIXxiuIH5g/g8QP5czt0T8QFB/mHdeZXXXdr8QXEBoIJiD0EIwBQkCwQwksm0A9abD44lUl68A4ZEAkz0rDzDhiDg1JK+EI8IR4QgpAeEIKSFRR4QjwhFSAsIRUkKijsTSkdi0f8WmIS42LYKxaJqMRRtpLBpr8URTpK3GrrEYU1GUx6E3X7sHhUzTfJZKpV5cNFvBrY10NDqFEFKz2ex6Pp/3nDZhDuIaJrMPDg425ufncac3HrXzHCZjCuIar9vJZDI5TdPweN2lJpKYgLhlLBQKqzQDh4FA/MhI2ptQg/iVkTkIrYxMQdwyyrK8pet6uONxLGQMlAhLGalBXDK+z2azG6TKSFqIdNxrzNZXZSQtRDp+0eDxDmsZLwUSxvQqEWQ4nN4n3aZJLxT0uLS3t7cdhowk0Ph8gQGJNKzjvwGKWUjXcvHclAAAAABJRU5ErkJggg==";
841
838
 
842
- // src/components/Toolbar/components/Mask.tsx
843
- var import_react23 = __toESM(require("react"));
844
- var import_react_dom = __toESM(require("react-dom"));
845
- var Mask = import_react23.default.memo(({ toolbar, children }) => {
846
- const [rootElement] = (0, import_react23.useState)(() => {
847
- const element = document.createElement("div");
848
- element.style.position = "absolute";
849
- return element;
850
- });
851
- (0, import_react23.useEffect)(() => {
852
- if (toolbar && rootElement) {
853
- toolbar.appendChild(rootElement);
854
- }
855
- }, [rootElement, toolbar]);
856
- (0, import_react23.useEffect)(() => {
857
- if (rootElement && toolbar) {
858
- toolbar.appendChild(rootElement);
859
- const toolbarRect = toolbar.getBoundingClientRect();
860
- const halfHeight = toolbarRect.height / 2 - 31;
861
- rootElement.style.top = halfHeight + "px";
862
- rootElement.style.left = "41px";
863
- rootElement.style.width = "17px";
864
- rootElement.style.height = "62px";
865
- return () => {
866
- toolbar.removeChild(rootElement);
867
- };
868
- }
869
- }, [rootElement, toolbar]);
870
- if (rootElement) {
871
- return import_react_dom.default.createPortal(children, rootElement);
872
- } else {
873
- return null;
874
- }
875
- });
876
-
877
839
  // src/components/Toolbar/Content.tsx
878
840
  var import_clsx8 = __toESM(require("clsx"));
879
- var import_react59 = __toESM(require("react"));
841
+ var import_react58 = __toESM(require("react"));
880
842
 
881
843
  // src/components/Toolbar/components/ApplianceButtons.tsx
882
- var import_react46 = __toESM(require("react"));
844
+ var import_react45 = __toESM(require("react"));
883
845
  var import_white_web_sdk = require("white-web-sdk");
884
846
 
885
847
  // src/components/Toolbar/icons/index.ts
886
- var import_react43 = require("react");
848
+ var import_react42 = require("react");
887
849
 
888
850
  // src/components/Toolbar/icons/Apps.tsx
889
- var import_react24 = __toESM(require("react"));
851
+ var import_react23 = __toESM(require("react"));
890
852
  var Apps = (props) => {
891
853
  const stroke = getStroke(props);
892
- return /* @__PURE__ */ import_react24.default.createElement("svg", {
854
+ return /* @__PURE__ */ import_react23.default.createElement("svg", {
893
855
  viewBox: "0 0 24 24"
894
- }, /* @__PURE__ */ import_react24.default.createElement("g", {
856
+ }, /* @__PURE__ */ import_react23.default.createElement("g", {
895
857
  fill: stroke
896
- }, /* @__PURE__ */ import_react24.default.createElement("path", {
858
+ }, /* @__PURE__ */ import_react23.default.createElement("path", {
897
859
  d: "M17.667 4.5h-3.334c-1.012 0-1.833.82-1.833 1.833V11.5h5.167c1.012 0 1.833-.82 1.833-1.833V6.333c0-1.012-.82-1.833-1.833-1.833Zm-3.334 1h3.334c.46 0 .833.373.833.833v3.334l-.006.104a.833.833 0 0 1-.827.729H13.5V6.333c0-.46.373-.833.833-.833Z"
898
- }), /* @__PURE__ */ import_react24.default.createElement("path", {
860
+ }), /* @__PURE__ */ import_react23.default.createElement("path", {
899
861
  d: "M6.333 19.5A1.833 1.833 0 0 1 4.5 17.667v-3.334c0-.525.221-1 .576-1.334a1.822 1.822 0 0 1-.576-1.332V8.333c0-1.012.82-1.833 1.833-1.833H10A1.5 1.5 0 0 1 11.5 8v4.5h4.167c.962 0 1.75.74 1.827 1.683l.006.15v3.334c0 1.012-.82 1.833-1.833 1.833Zm4.167-6H6.333a.833.833 0 0 0-.827.729l-.006.104v3.334c0 .46.373.833.833.833H10.5v-5Zm5.167 0H11.5v5h4.167c.46 0 .833-.373.833-.833v-3.334a.833.833 0 0 0-.833-.833ZM10 7.5H6.333a.833.833 0 0 0-.833.833v3.334c0 .46.373.833.833.833H10.5V8a.5.5 0 0 0-.41-.492L10 7.5Z"
900
862
  })));
901
863
  };
902
864
 
903
865
  // src/components/Toolbar/icons/Arrow.tsx
904
- var import_react25 = __toESM(require("react"));
866
+ var import_react24 = __toESM(require("react"));
905
867
  var Arrow = (props) => {
906
868
  const stroke = getStroke(props);
907
- return /* @__PURE__ */ import_react25.default.createElement("svg", {
869
+ return /* @__PURE__ */ import_react24.default.createElement("svg", {
908
870
  viewBox: "0 0 24 24"
909
- }, /* @__PURE__ */ import_react25.default.createElement("path", {
871
+ }, /* @__PURE__ */ import_react24.default.createElement("path", {
910
872
  fill: stroke,
911
873
  d: "M19 5v6l-2.647-2.646L5.99 18.718l-.708-.708L15.645 7.646 13 5h6Z"
912
874
  }));
913
875
  };
914
876
 
915
877
  // src/components/Toolbar/icons/Circle.tsx
916
- var import_react26 = __toESM(require("react"));
878
+ var import_react25 = __toESM(require("react"));
917
879
  var Circle = (props) => {
918
880
  const stroke = getStroke(props);
919
- return /* @__PURE__ */ import_react26.default.createElement("svg", {
881
+ return /* @__PURE__ */ import_react25.default.createElement("svg", {
920
882
  viewBox: "0 0 24 24"
921
- }, /* @__PURE__ */ import_react26.default.createElement("rect", {
883
+ }, /* @__PURE__ */ import_react25.default.createElement("rect", {
922
884
  width: "15",
923
885
  height: "15",
924
886
  x: "4.5",
@@ -930,40 +892,40 @@ var Circle = (props) => {
930
892
  };
931
893
 
932
894
  // src/components/Toolbar/icons/Clean.tsx
933
- var import_react27 = __toESM(require("react"));
895
+ var import_react26 = __toESM(require("react"));
934
896
  var Clean = (props) => {
935
897
  const stroke = getStroke(props);
936
- return /* @__PURE__ */ import_react27.default.createElement("svg", {
898
+ return /* @__PURE__ */ import_react26.default.createElement("svg", {
937
899
  viewBox: "0 0 24 24"
938
- }, /* @__PURE__ */ import_react27.default.createElement("path", {
900
+ }, /* @__PURE__ */ import_react26.default.createElement("path", {
939
901
  fill: stroke,
940
902
  d: "M9.754 11.99c0 1.856-.711 3.62-1.96 4.951l-.151.155h1.403l.855-.853h.707l.853.853h2.635l.094-.064a6.237 6.237 0 0 0 2.559-4.781l.005-.26h1a7.237 7.237 0 0 1-2.994 5.862l-.229.16-.277.083h-3l-.353-.146-.647-.647-.646.647-.354.146h-3l-.286-.91.214-.148a6.237 6.237 0 0 0 2.567-4.787l.005-.26h1Zm4.772-6.502v2l.35.039a2.98 2.98 0 0 1 2.644 2.78l.006.181h-8a2.98 2.98 0 0 1 2.65-2.961l.35-.039v-2h2Z"
941
903
  }));
942
904
  };
943
905
 
944
906
  // src/components/Toolbar/icons/Clicker.tsx
945
- var import_react28 = __toESM(require("react"));
907
+ var import_react27 = __toESM(require("react"));
946
908
  var Clicker = (props) => {
947
909
  const stroke = getStroke(props);
948
- return /* @__PURE__ */ import_react28.default.createElement("svg", {
910
+ return /* @__PURE__ */ import_react27.default.createElement("svg", {
949
911
  viewBox: "0 0 24 24"
950
- }, /* @__PURE__ */ import_react28.default.createElement("g", {
912
+ }, /* @__PURE__ */ import_react27.default.createElement("g", {
951
913
  fill: "none"
952
- }, /* @__PURE__ */ import_react28.default.createElement("path", {
914
+ }, /* @__PURE__ */ import_react27.default.createElement("path", {
953
915
  d: "M0 0h24v24H0z"
954
- }), /* @__PURE__ */ import_react28.default.createElement("path", {
916
+ }), /* @__PURE__ */ import_react27.default.createElement("path", {
955
917
  fill: stroke,
956
918
  d: "m7 5.072 10.33 7.892-4.879.549 3.232 5.598-.866.5-3.233-5.597-2.914 3.95L7 5.072Z"
957
919
  })));
958
920
  };
959
921
 
960
922
  // src/components/Toolbar/icons/Collapse.tsx
961
- var import_react29 = __toESM(require("react"));
923
+ var import_react28 = __toESM(require("react"));
962
924
  var Collapse = (props) => {
963
925
  const stroke = getStroke(props);
964
- return /* @__PURE__ */ import_react29.default.createElement("svg", {
926
+ return /* @__PURE__ */ import_react28.default.createElement("svg", {
965
927
  viewBox: "0 0 24 24"
966
- }, /* @__PURE__ */ import_react29.default.createElement("path", {
928
+ }, /* @__PURE__ */ import_react28.default.createElement("path", {
967
929
  fill: "none",
968
930
  stroke,
969
931
  d: "m8 10-2 2 2 2m10-8H6m12 12H6m12-4h-8m8-4h-8"
@@ -971,12 +933,12 @@ var Collapse = (props) => {
971
933
  };
972
934
 
973
935
  // src/components/Toolbar/icons/Diamond.tsx
974
- var import_react30 = __toESM(require("react"));
936
+ var import_react29 = __toESM(require("react"));
975
937
  var Diamond = (props) => {
976
938
  const stroke = getStroke(props);
977
- return /* @__PURE__ */ import_react30.default.createElement("svg", {
939
+ return /* @__PURE__ */ import_react29.default.createElement("svg", {
978
940
  viewBox: "0 0 24 24"
979
- }, /* @__PURE__ */ import_react30.default.createElement("path", {
941
+ }, /* @__PURE__ */ import_react29.default.createElement("path", {
980
942
  fill: "none",
981
943
  stroke,
982
944
  d: "M4.222 12 12 4.222 19.778 12 12 19.778z"
@@ -984,12 +946,12 @@ var Diamond = (props) => {
984
946
  };
985
947
 
986
948
  // src/components/Toolbar/icons/Down.tsx
987
- var import_react31 = __toESM(require("react"));
949
+ var import_react30 = __toESM(require("react"));
988
950
  var Down = (props) => {
989
951
  const stroke = getStroke(props);
990
- return /* @__PURE__ */ import_react31.default.createElement("svg", {
952
+ return /* @__PURE__ */ import_react30.default.createElement("svg", {
991
953
  viewBox: "0 0 24 24"
992
- }, /* @__PURE__ */ import_react31.default.createElement("path", {
954
+ }, /* @__PURE__ */ import_react30.default.createElement("path", {
993
955
  fill: "none",
994
956
  stroke,
995
957
  d: "m16 13-2 2-2 2-2-2-2-2m8-6-2 2-2 2-2-2-2-2"
@@ -997,24 +959,24 @@ var Down = (props) => {
997
959
  };
998
960
 
999
961
  // src/components/Toolbar/icons/Eraser.tsx
1000
- var import_react32 = __toESM(require("react"));
962
+ var import_react31 = __toESM(require("react"));
1001
963
  var Eraser = (props) => {
1002
964
  const stroke = getStroke(props);
1003
- return /* @__PURE__ */ import_react32.default.createElement("svg", {
965
+ return /* @__PURE__ */ import_react31.default.createElement("svg", {
1004
966
  viewBox: "0 0 24 24"
1005
- }, /* @__PURE__ */ import_react32.default.createElement("path", {
967
+ }, /* @__PURE__ */ import_react31.default.createElement("path", {
1006
968
  fill: stroke,
1007
969
  d: "m14.333 5.183.165.007c.494.037.978.245 1.356.623l2.333 2.333a2.15 2.15 0 0 1 0 3.04l-5.833 5.834a3.8 3.8 0 0 1-5.374 0l-1.167-1.166a2.15 2.15 0 0 1 0-3.04l7-7c.42-.42.97-.63 1.52-.63ZM11.52 8.52l-4.999 5a1.15 1.15 0 0 0 0 1.626l1.167 1.167a2.8 2.8 0 0 0 3.96 0l3.832-3.833-3.96-3.96Z"
1008
970
  }));
1009
971
  };
1010
972
 
1011
973
  // src/components/Toolbar/icons/Expand.tsx
1012
- var import_react33 = __toESM(require("react"));
974
+ var import_react32 = __toESM(require("react"));
1013
975
  var Expand = (props) => {
1014
976
  const stroke = getStroke(props);
1015
- return /* @__PURE__ */ import_react33.default.createElement("svg", {
977
+ return /* @__PURE__ */ import_react32.default.createElement("svg", {
1016
978
  viewBox: "0 0 24 24"
1017
- }, /* @__PURE__ */ import_react33.default.createElement("path", {
979
+ }, /* @__PURE__ */ import_react32.default.createElement("path", {
1018
980
  fill: "none",
1019
981
  stroke,
1020
982
  d: "m16 10 2 2-2 2M6 6h12M6 18h12M6 14h8m-8-4h8"
@@ -1022,36 +984,36 @@ var Expand = (props) => {
1022
984
  };
1023
985
 
1024
986
  // src/components/Toolbar/icons/Line.tsx
1025
- var import_react34 = __toESM(require("react"));
987
+ var import_react33 = __toESM(require("react"));
1026
988
  var Line = (props) => {
1027
989
  const stroke = getStroke(props);
1028
- return /* @__PURE__ */ import_react34.default.createElement("svg", {
990
+ return /* @__PURE__ */ import_react33.default.createElement("svg", {
1029
991
  viewBox: "0 0 24 24"
1030
- }, /* @__PURE__ */ import_react34.default.createElement("path", {
992
+ }, /* @__PURE__ */ import_react33.default.createElement("path", {
1031
993
  fill: stroke,
1032
994
  d: "m18.01 5.282.708.708L5.99 18.718l-.708-.708z"
1033
995
  }));
1034
996
  };
1035
997
 
1036
998
  // src/components/Toolbar/icons/Pencil.tsx
1037
- var import_react35 = __toESM(require("react"));
999
+ var import_react34 = __toESM(require("react"));
1038
1000
  var Pencil = (props) => {
1039
1001
  const stroke = getStroke(props);
1040
- return /* @__PURE__ */ import_react35.default.createElement("svg", {
1002
+ return /* @__PURE__ */ import_react34.default.createElement("svg", {
1041
1003
  viewBox: "0 0 24 24"
1042
- }, /* @__PURE__ */ import_react35.default.createElement("path", {
1004
+ }, /* @__PURE__ */ import_react34.default.createElement("path", {
1043
1005
  fill: stroke,
1044
1006
  d: "m17.497 4.84.116.105 1.442 1.442a1.52 1.52 0 0 1 .104 2.034l-.104.116L8.733 18.858l-4.347.756.756-4.347L15.463 4.945a1.52 1.52 0 0 1 2.034-.104ZM5.967 16.349l-.353 2.037 2.037-.354-1.683-1.683Zm8.407-8.901-7.946 7.946 2.178 2.178 7.946-7.946-2.178-2.178Zm-.728 2.2.708.707-5 5-.708-.708 5-5Zm2.596-4.055-.072.06-1.09 1.088 2.179 2.178 1.089-1.088a.52.52 0 0 0 .105-.584l-.045-.08-.06-.072-1.442-1.442a.52.52 0 0 0-.664-.06Z"
1045
1007
  }));
1046
1008
  };
1047
1009
 
1048
1010
  // src/components/Toolbar/icons/Rectangle.tsx
1049
- var import_react36 = __toESM(require("react"));
1011
+ var import_react35 = __toESM(require("react"));
1050
1012
  var Rectangle = (props) => {
1051
1013
  const stroke = getStroke(props);
1052
- return /* @__PURE__ */ import_react36.default.createElement("svg", {
1014
+ return /* @__PURE__ */ import_react35.default.createElement("svg", {
1053
1015
  viewBox: "0 0 24 24"
1054
- }, /* @__PURE__ */ import_react36.default.createElement("path", {
1016
+ }, /* @__PURE__ */ import_react35.default.createElement("path", {
1055
1017
  fill: "none",
1056
1018
  stroke,
1057
1019
  d: "M5.5 5.5h13v13h-13z"
@@ -1059,24 +1021,24 @@ var Rectangle = (props) => {
1059
1021
  };
1060
1022
 
1061
1023
  // src/components/Toolbar/icons/Selector.tsx
1062
- var import_react37 = __toESM(require("react"));
1024
+ var import_react36 = __toESM(require("react"));
1063
1025
  var Selector = (props) => {
1064
1026
  const stroke = getStroke(props);
1065
- return /* @__PURE__ */ import_react37.default.createElement("svg", {
1027
+ return /* @__PURE__ */ import_react36.default.createElement("svg", {
1066
1028
  viewBox: "0 0 24 24"
1067
- }, /* @__PURE__ */ import_react37.default.createElement("path", {
1029
+ }, /* @__PURE__ */ import_react36.default.createElement("path", {
1068
1030
  fill: stroke,
1069
1031
  d: "m12 12 8 2.667-3.556 1.777L14.667 20 12 12Zm3-8v7.5h-1V5H5v9h6.5v1H4V4h11Z"
1070
1032
  }));
1071
1033
  };
1072
1034
 
1073
1035
  // src/components/Toolbar/icons/SpeechBalloon.tsx
1074
- var import_react38 = __toESM(require("react"));
1036
+ var import_react37 = __toESM(require("react"));
1075
1037
  var SpeechBalloon = (props) => {
1076
1038
  const stroke = getStroke(props);
1077
- return /* @__PURE__ */ import_react38.default.createElement("svg", {
1039
+ return /* @__PURE__ */ import_react37.default.createElement("svg", {
1078
1040
  viewBox: "0 0 24 24"
1079
- }, /* @__PURE__ */ import_react38.default.createElement("path", {
1041
+ }, /* @__PURE__ */ import_react37.default.createElement("path", {
1080
1042
  fill: "none",
1081
1043
  stroke,
1082
1044
  d: "M17 4.5c.414 0 .79.168 1.06.44.272.27.44.646.44 1.06v9c0 .414-.168.79-.44 1.06a1.49 1.49 0 0 1-1.06.44h-4.207l-2.715 2.715-1.81-2.715H7a1.49 1.49 0 0 1-1.06-.44A1.495 1.495 0 0 1 5.5 15V6c0-.414.168-.79.44-1.06A1.49 1.49 0 0 1 7 4.5Z"
@@ -1084,12 +1046,12 @@ var SpeechBalloon = (props) => {
1084
1046
  };
1085
1047
 
1086
1048
  // src/components/Toolbar/icons/Star.tsx
1087
- var import_react39 = __toESM(require("react"));
1049
+ var import_react38 = __toESM(require("react"));
1088
1050
  var Star = (props) => {
1089
1051
  const stroke = getStroke(props);
1090
- return /* @__PURE__ */ import_react39.default.createElement("svg", {
1052
+ return /* @__PURE__ */ import_react38.default.createElement("svg", {
1091
1053
  viewBox: "0 0 24 24"
1092
- }, /* @__PURE__ */ import_react39.default.createElement("path", {
1054
+ }, /* @__PURE__ */ import_react38.default.createElement("path", {
1093
1055
  fill: "none",
1094
1056
  stroke,
1095
1057
  d: "m12 3.523 1.993 5.734 6.07.123-4.838 3.668 1.758 5.81L12 15.391l-4.983 3.467 1.758-5.81L3.938 9.38l6.069-.123L12 3.523Z"
@@ -1097,24 +1059,24 @@ var Star = (props) => {
1097
1059
  };
1098
1060
 
1099
1061
  // src/components/Toolbar/icons/Text.tsx
1100
- var import_react40 = __toESM(require("react"));
1062
+ var import_react39 = __toESM(require("react"));
1101
1063
  var Text = (props) => {
1102
1064
  const stroke = getStroke(props);
1103
- return /* @__PURE__ */ import_react40.default.createElement("svg", {
1065
+ return /* @__PURE__ */ import_react39.default.createElement("svg", {
1104
1066
  viewBox: "0 0 24 24"
1105
- }, /* @__PURE__ */ import_react40.default.createElement("path", {
1067
+ }, /* @__PURE__ */ import_react39.default.createElement("path", {
1106
1068
  fill: stroke,
1107
1069
  d: "M18.5 5.5V8h-1V6.5H13v11h2v1H9v-1h2v-11H6.5V8h-1V5.5h13Z"
1108
1070
  }));
1109
1071
  };
1110
1072
 
1111
1073
  // src/components/Toolbar/icons/Triangle.tsx
1112
- var import_react41 = __toESM(require("react"));
1074
+ var import_react40 = __toESM(require("react"));
1113
1075
  var Triangle = (props) => {
1114
1076
  const stroke = getStroke(props);
1115
- return /* @__PURE__ */ import_react41.default.createElement("svg", {
1077
+ return /* @__PURE__ */ import_react40.default.createElement("svg", {
1116
1078
  viewBox: "0 0 24 24"
1117
- }, /* @__PURE__ */ import_react41.default.createElement("path", {
1079
+ }, /* @__PURE__ */ import_react40.default.createElement("path", {
1118
1080
  fill: "none",
1119
1081
  stroke,
1120
1082
  d: "M12 6.008 19.138 18.5H4.862L12 6.008Z"
@@ -1122,12 +1084,12 @@ var Triangle = (props) => {
1122
1084
  };
1123
1085
 
1124
1086
  // src/components/Toolbar/icons/Up.tsx
1125
- var import_react42 = __toESM(require("react"));
1087
+ var import_react41 = __toESM(require("react"));
1126
1088
  var Up = (props) => {
1127
1089
  const stroke = getStroke(props);
1128
- return /* @__PURE__ */ import_react42.default.createElement("svg", {
1090
+ return /* @__PURE__ */ import_react41.default.createElement("svg", {
1129
1091
  viewBox: "0 0 24 24"
1130
- }, /* @__PURE__ */ import_react42.default.createElement("path", {
1092
+ }, /* @__PURE__ */ import_react41.default.createElement("path", {
1131
1093
  fill: "none",
1132
1094
  stroke,
1133
1095
  d: "m16 11-2-2-2-2-2 2-2 2m8 6-2-2-2-2-2 2-2 2"
@@ -1136,35 +1098,35 @@ var Up = (props) => {
1136
1098
 
1137
1099
  // src/components/Toolbar/icons/index.ts
1138
1100
  var Icons = {
1139
- Clicker: (0, import_react43.memo)(Clicker),
1140
- Collapse: (0, import_react43.memo)(Collapse),
1141
- Eraser: (0, import_react43.memo)(Eraser),
1142
- Expand: (0, import_react43.memo)(Expand),
1143
- Pencil: (0, import_react43.memo)(Pencil),
1144
- Selector: (0, import_react43.memo)(Selector),
1145
- Rectangle: (0, import_react43.memo)(Rectangle),
1146
- Text: (0, import_react43.memo)(Text),
1147
- Apps: (0, import_react43.memo)(Apps),
1148
- Clean: (0, import_react43.memo)(Clean),
1149
- Circle: (0, import_react43.memo)(Circle),
1150
- Line: (0, import_react43.memo)(Line),
1151
- Arrow: (0, import_react43.memo)(Arrow),
1152
- Star: (0, import_react43.memo)(Star),
1153
- Diamond: (0, import_react43.memo)(Diamond),
1154
- SpeechBalloon: (0, import_react43.memo)(SpeechBalloon),
1155
- Triangle: (0, import_react43.memo)(Triangle),
1156
- Up: (0, import_react43.memo)(Up),
1157
- Down: (0, import_react43.memo)(Down)
1101
+ Clicker: (0, import_react42.memo)(Clicker),
1102
+ Collapse: (0, import_react42.memo)(Collapse),
1103
+ Eraser: (0, import_react42.memo)(Eraser),
1104
+ Expand: (0, import_react42.memo)(Expand),
1105
+ Pencil: (0, import_react42.memo)(Pencil),
1106
+ Selector: (0, import_react42.memo)(Selector),
1107
+ Rectangle: (0, import_react42.memo)(Rectangle),
1108
+ Text: (0, import_react42.memo)(Text),
1109
+ Apps: (0, import_react42.memo)(Apps),
1110
+ Clean: (0, import_react42.memo)(Clean),
1111
+ Circle: (0, import_react42.memo)(Circle),
1112
+ Line: (0, import_react42.memo)(Line),
1113
+ Arrow: (0, import_react42.memo)(Arrow),
1114
+ Star: (0, import_react42.memo)(Star),
1115
+ Diamond: (0, import_react42.memo)(Diamond),
1116
+ SpeechBalloon: (0, import_react42.memo)(SpeechBalloon),
1117
+ Triangle: (0, import_react42.memo)(Triangle),
1118
+ Up: (0, import_react42.memo)(Up),
1119
+ Down: (0, import_react42.memo)(Down)
1158
1120
  };
1159
1121
 
1160
1122
  // src/components/Toolbar/components/Button.tsx
1161
1123
  var import_clsx4 = __toESM(require("clsx"));
1162
- var import_react44 = __toESM(require("react"));
1163
- var import_react45 = __toESM(require("@tippyjs/react"));
1164
- var Button = (0, import_react44.forwardRef)((props, ref) => {
1124
+ var import_react43 = __toESM(require("react"));
1125
+ var import_react44 = __toESM(require("@tippyjs/react"));
1126
+ var Button = (0, import_react43.forwardRef)((props, ref) => {
1165
1127
  const { content, disabled, active, onClick, interactive, placement = "right", children } = props;
1166
- const { writable, theme } = (0, import_react44.useContext)(ToolbarContext);
1167
- return /* @__PURE__ */ import_react44.default.createElement(import_react45.default, {
1128
+ const { writable, theme } = (0, import_react43.useContext)(ToolbarContext);
1129
+ return /* @__PURE__ */ import_react43.default.createElement(import_react44.default, {
1168
1130
  className: "fastboard-tip",
1169
1131
  content,
1170
1132
  interactive,
@@ -1174,7 +1136,7 @@ var Button = (0, import_react44.forwardRef)((props, ref) => {
1174
1136
  offset: placement.includes("right") ? RightOffset : void 0,
1175
1137
  delay: [1e3, 400],
1176
1138
  duration: 300
1177
- }, /* @__PURE__ */ import_react44.default.createElement("button", {
1139
+ }, /* @__PURE__ */ import_react43.default.createElement("button", {
1178
1140
  ref,
1179
1141
  className: (0, import_clsx4.default)("fastboard-toolbar-btn", theme, { active }),
1180
1142
  onClick,
@@ -1186,9 +1148,9 @@ var Button = (0, import_react44.forwardRef)((props, ref) => {
1186
1148
  function renderToolTip(text, hotkey) {
1187
1149
  if (!(typeof hotkey === "string"))
1188
1150
  return text;
1189
- return /* @__PURE__ */ import_react46.default.createElement("span", {
1151
+ return /* @__PURE__ */ import_react45.default.createElement("span", {
1190
1152
  className: "fastboard-toolbar-tooltip"
1191
- }, /* @__PURE__ */ import_react46.default.createElement("span", null, text), /* @__PURE__ */ import_react46.default.createElement("span", {
1153
+ }, /* @__PURE__ */ import_react45.default.createElement("span", null, text), /* @__PURE__ */ import_react45.default.createElement("span", {
1192
1154
  className: "fastboard-toolbar-hotkey"
1193
1155
  }, hotkey.toUpperCase()));
1194
1156
  }
@@ -1196,18 +1158,18 @@ function ClickerButton() {
1196
1158
  var _a;
1197
1159
  const app = useFastboardApp();
1198
1160
  const { t } = useTranslation();
1199
- const { theme, icons, writable, setAppliance, memberState } = (0, import_react46.useContext)(ToolbarContext);
1200
- const changeAppliance = (0, import_react46.useCallback)(() => setAppliance(import_white_web_sdk.ApplianceNames.clicker), [setAppliance]);
1161
+ const { theme, icons, writable, setAppliance, memberState } = (0, import_react45.useContext)(ToolbarContext);
1162
+ const changeAppliance = (0, import_react45.useCallback)(() => setAppliance(import_white_web_sdk.ApplianceNames.clicker), [setAppliance]);
1201
1163
  const shortcut = (_a = app.hotKeys) == null ? void 0 : _a.changeToClick;
1202
1164
  const appliance = memberState == null ? void 0 : memberState.currentApplianceName;
1203
1165
  const active = appliance === import_white_web_sdk.ApplianceNames.clicker;
1204
1166
  const disabled = !writable;
1205
- return /* @__PURE__ */ import_react46.default.createElement(Button, {
1167
+ return /* @__PURE__ */ import_react45.default.createElement(Button, {
1206
1168
  content: renderToolTip(t("clicker"), shortcut),
1207
1169
  onClick: changeAppliance,
1208
1170
  active
1209
- }, /* @__PURE__ */ import_react46.default.createElement(Icon, {
1210
- fallback: /* @__PURE__ */ import_react46.default.createElement(Icons.Clicker, {
1171
+ }, /* @__PURE__ */ import_react45.default.createElement(Icon, {
1172
+ fallback: /* @__PURE__ */ import_react45.default.createElement(Icons.Clicker, {
1211
1173
  theme,
1212
1174
  active
1213
1175
  }),
@@ -1218,18 +1180,18 @@ function ClickerButton() {
1218
1180
  function SelectorButton() {
1219
1181
  const app = useFastboardApp();
1220
1182
  const { t } = useTranslation();
1221
- const { theme, icons, writable, setAppliance, memberState } = (0, import_react46.useContext)(ToolbarContext);
1222
- const changeAppliance = (0, import_react46.useCallback)(() => setAppliance(import_white_web_sdk.ApplianceNames.selector), [setAppliance]);
1183
+ const { theme, icons, writable, setAppliance, memberState } = (0, import_react45.useContext)(ToolbarContext);
1184
+ const changeAppliance = (0, import_react45.useCallback)(() => setAppliance(import_white_web_sdk.ApplianceNames.selector), [setAppliance]);
1223
1185
  const appliance = memberState == null ? void 0 : memberState.currentApplianceName;
1224
1186
  const active = appliance === import_white_web_sdk.ApplianceNames.selector;
1225
1187
  const disabled = !writable;
1226
1188
  const shortcut = (app.hotKeys || defaultHotKeys).changeToSelector;
1227
- return /* @__PURE__ */ import_react46.default.createElement(Button, {
1189
+ return /* @__PURE__ */ import_react45.default.createElement(Button, {
1228
1190
  content: renderToolTip(t("selector"), shortcut),
1229
1191
  onClick: changeAppliance,
1230
1192
  active
1231
- }, /* @__PURE__ */ import_react46.default.createElement(Icon, {
1232
- fallback: /* @__PURE__ */ import_react46.default.createElement(Icons.Selector, {
1193
+ }, /* @__PURE__ */ import_react45.default.createElement(Icon, {
1194
+ fallback: /* @__PURE__ */ import_react45.default.createElement(Icons.Selector, {
1233
1195
  theme,
1234
1196
  active
1235
1197
  }),
@@ -1240,18 +1202,18 @@ function SelectorButton() {
1240
1202
  function EraserButton() {
1241
1203
  const app = useFastboardApp();
1242
1204
  const { t } = useTranslation();
1243
- const { theme, icons, writable, setAppliance, memberState } = (0, import_react46.useContext)(ToolbarContext);
1244
- const changeAppliance = (0, import_react46.useCallback)(() => setAppliance(import_white_web_sdk.ApplianceNames.eraser), [setAppliance]);
1205
+ const { theme, icons, writable, setAppliance, memberState } = (0, import_react45.useContext)(ToolbarContext);
1206
+ const changeAppliance = (0, import_react45.useCallback)(() => setAppliance(import_white_web_sdk.ApplianceNames.eraser), [setAppliance]);
1245
1207
  const appliance = memberState == null ? void 0 : memberState.currentApplianceName;
1246
1208
  const active = appliance === import_white_web_sdk.ApplianceNames.eraser;
1247
1209
  const disabled = !writable;
1248
1210
  const shortcut = ((app == null ? void 0 : app.hotKeys) || defaultHotKeys).changeToEraser;
1249
- return /* @__PURE__ */ import_react46.default.createElement(Button, {
1211
+ return /* @__PURE__ */ import_react45.default.createElement(Button, {
1250
1212
  content: renderToolTip(t("eraser"), shortcut),
1251
1213
  onClick: changeAppliance,
1252
1214
  active
1253
- }, /* @__PURE__ */ import_react46.default.createElement(Icon, {
1254
- fallback: /* @__PURE__ */ import_react46.default.createElement(Icons.Eraser, {
1215
+ }, /* @__PURE__ */ import_react45.default.createElement(Icon, {
1216
+ fallback: /* @__PURE__ */ import_react45.default.createElement(Icons.Eraser, {
1255
1217
  theme,
1256
1218
  active
1257
1219
  }),
@@ -1261,13 +1223,13 @@ function EraserButton() {
1261
1223
  }
1262
1224
  function CleanButton() {
1263
1225
  const { t } = useTranslation();
1264
- const { theme, icons, writable, cleanCurrentScene } = (0, import_react46.useContext)(ToolbarContext);
1226
+ const { theme, icons, writable, cleanCurrentScene } = (0, import_react45.useContext)(ToolbarContext);
1265
1227
  const disabled = !writable;
1266
- return /* @__PURE__ */ import_react46.default.createElement(Button, {
1228
+ return /* @__PURE__ */ import_react45.default.createElement(Button, {
1267
1229
  content: t("clean"),
1268
1230
  onClick: cleanCurrentScene
1269
- }, /* @__PURE__ */ import_react46.default.createElement(Icon, {
1270
- fallback: /* @__PURE__ */ import_react46.default.createElement(Icons.Clean, {
1231
+ }, /* @__PURE__ */ import_react45.default.createElement(Icon, {
1232
+ fallback: /* @__PURE__ */ import_react45.default.createElement(Icons.Clean, {
1271
1233
  theme
1272
1234
  }),
1273
1235
  src: disabled ? icons == null ? void 0 : icons.cleanIconDisable : icons == null ? void 0 : icons.cleanIcon,
@@ -1276,8 +1238,8 @@ function CleanButton() {
1276
1238
  }
1277
1239
 
1278
1240
  // src/components/Toolbar/components/AppsButton.tsx
1279
- var import_react47 = __toESM(require("@tippyjs/react"));
1280
- var import_react48 = __toESM(require("react"));
1241
+ var import_react46 = __toESM(require("@tippyjs/react"));
1242
+ var import_react47 = __toESM(require("react"));
1281
1243
 
1282
1244
  // src/components/Toolbar/components/assets/vscode.png
1283
1245
  var vscode_default = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAIAAACRXR/mAAAAAXNSR0IArs4c6QAABnxJREFUWMPtWWlsVFUUPve+ZTY6HUoLpS1tEUrLVooKLgWVTQGVfRWhiUpAECGGEgOJShRj9I9EjSEQIMhSBIKBQoBgQCMEKEuo1LKV7rRl2pm201nf3Hv8MdNKO/NmBqWFGE7Oj8nkzb3f+8653zn3DEFEePyMwmNpT2D9D2CJnb1BpcWx/WKdTYoZ01f/SpKoE0kkvyKdehKL7jat++WapalZlOS4wS+aNGRiMp2QLHWTySODde5Ow/r8YpvDCZxRgj2HjCKEAqHdZJiYIk5KEYwa2tWwjhXVfn3iptujACIwhQLEZWYT0oqDUINExvcRJqeKsTraRbDyCiq/P3Wbcw4AiByYVwCMzRz1Dyz/5kQn0rHJ4tsDRG37nHvIKY+Im34v3XGuDDm2fuODhoiAAU/bPSz/Dnq8fFmmprMEQmH8q+M3t54t9TLOEH3OETkCB1ALCnJ+slzpLIFwetj6I8Uni+ugfVYQBB9TIZLFw7FTYDU7ldwDf14st0Dg5oiICIAMgaiGPmI5vWF2SQJ5KkYTFpPZ5vpwb+H12iYIRkgrWxDiZGEkKs8Rfzhv3n7FQgnJyeq+ZESsJKimYIXFsXzXlSqrXe0B3prqXJ2tgBgGpLzC8IvTdVsKGrwK83i8mwsaVuRXm+1K0OWKa5rf2XGp3NLSluCBzgGMBu26qcM1oogIQR3Cwvr8dO3P1xoZIgPCgDDEP8ptc/ZWnKvsyMf50obFOy/fa3KELCJkcKJp9+LscYMTfaypeRhYR240ImfY3u7ZXEsPVW0qqGetdB+7VvNB3lVri4txVHMEMm9E8racEUkxegTg4BOLoB4O1ursXoTQQJ49infjWfPy/Kp6u5J3vnTNvit2hxPVLUqn+WrG0LWTMrSS0Hbc1KjiEE4g5g+LkQW6/lStx8sChe90ie2Nantz1U2ueECQgApAKZAOqUzS46O+nZPVN9bQQQVUpSsSgZg5xGTS0dzjdXaXO3ABq5NDj77YWAPORqAiUBGoQNqQETrr2T5rJ6YbNB1X5qAKC8MG0Wfj+hk3T02MNmgYQjAnPDoBoxM483KmcKYwzhiCTitvmD5kw9TBgZh8sEJ4pE3zM4n6n2b0iTeqyinqTBjXD4Gi4kHG+sXq894dOevpJNUwqahD0OCGKtXpcdq8OSmpMVpVTRJkHteP64zTshL2L83O6G0MsZoK8X5/wJrIFDCXoNIdZJ2aNIEpiZu6Iw3TjISoPwgPwtb12uaZP565VduE5hLusnGE4M7xwDXrtF13iu85Q2F6KEEsKLPM23zhbpOLUYkTEevLuN3qa1CCGOe3zM4Ze8rzCi2qHUzkGq8G63hR7YJtF+/ZnAwIJwKnIicSWiq5zRxicZvLs/pYde7xGruHBUQaWAiPhK28CxVLdl5usbv8QUJAQjkVUJCwqcbotSKQEAHdfbVhys7SEos7IIjqFsBYR1jbzpSu3l/oVrztmSBABE7lcZmpv60Y+eWrCYIg+LvhYMiK6hyTd5QeLGqMMIbh28DP8os8jAVSKIli7oQBK8b2FyjJGa4zaYWVR+863YpaajY63O8frrxQ7fhkTLxOom0C8S9nENOzkgBIu9dHiI/W57333KrxaQL1F5mpA007ZiZH6WTVaCIwxrdcrJ+ys6TM6ob/eBK/mZW58PkU9PW6AEjIy+k9T6waPTottsOTL6V2Ozg/tZdRGwIZ53i5qmXClr+OFJlDXuMiuL5yxA1Hizf+elugZOXY/rmvpYdomu9Y3DP3lJZZXSEuXOB1U2SJaUMJISrSgYULoyO6VRdWN8qCkBEfFTYPamzKnL1lhTWO4BKEjCgewpWEAcMIJWqX3qJF0RHJaWaiKRJMANA7Sjq0oG92ahQCCZo3vr4UH1apjty668R9c1PeHGhiAB3KOSJy7t9YFVbnjd0MsrBterJJK2y9VH//67d95AhqNzKJduaQUhbId68nrhnVixDappX+e75/OhJU4smMNE3nDikpIevH9Y7RCx+fuMsY950pisB9oDrKANVLdPYA6aMsuStmpytf6BmrF5cdrnZ7FETgiAQA4b4oEmqUydw0MWeQHG8Qum6ku2BYTA+d+Na+ima7AzgIiIgEAIBSk4YszJAWDZRjtF0+pPSPTytapu0qMVuaJYEkpA/rqSc5GeL8DNmkoY9y0gwAN+tdn542W6HbvEGG2WmSQXoMBuBP/lx5Auuxs78BCY9M0wbXBY0AAAAASUVORK5CYII=";
@@ -1290,21 +1252,21 @@ var countdown_default = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyC
1290
1252
 
1291
1253
  // src/components/Toolbar/components/AppsButton.tsx
1292
1254
  function AppsButton({ content, onClick }) {
1293
- const { theme, icons, writable } = (0, import_react48.useContext)(ToolbarContext);
1255
+ const { theme, icons, writable } = (0, import_react47.useContext)(ToolbarContext);
1294
1256
  const disabled = !writable;
1295
- const button = /* @__PURE__ */ import_react48.default.createElement(Button, {
1257
+ const button = /* @__PURE__ */ import_react47.default.createElement(Button, {
1296
1258
  content: "Apps",
1297
1259
  onClick
1298
- }, /* @__PURE__ */ import_react48.default.createElement(Icon, {
1299
- fallback: /* @__PURE__ */ import_react48.default.createElement(Icons.Apps, {
1260
+ }, /* @__PURE__ */ import_react47.default.createElement(Icon, {
1261
+ fallback: /* @__PURE__ */ import_react47.default.createElement(Icons.Apps, {
1300
1262
  theme
1301
1263
  }),
1302
1264
  src: disabled ? icons == null ? void 0 : icons.appsIconDisable : icons == null ? void 0 : icons.appsIcon,
1303
1265
  alt: "[apps]"
1304
1266
  }));
1305
- return content === false ? button : /* @__PURE__ */ import_react48.default.createElement("span", {
1267
+ return content === false ? button : /* @__PURE__ */ import_react47.default.createElement("span", {
1306
1268
  className: "fastboard-toolbar-btn-interactive"
1307
- }, /* @__PURE__ */ import_react48.default.createElement(import_react47.default, {
1269
+ }, /* @__PURE__ */ import_react47.default.createElement(import_react46.default, {
1308
1270
  className: "fastboard-tip",
1309
1271
  content: renderAppsButtonContent(content),
1310
1272
  theme,
@@ -1316,25 +1278,25 @@ function AppsButton({ content, onClick }) {
1316
1278
  }, button));
1317
1279
  }
1318
1280
  function renderAppsButtonContent(content) {
1319
- return /* @__PURE__ */ import_react48.default.createElement("div", {
1281
+ return /* @__PURE__ */ import_react47.default.createElement("div", {
1320
1282
  className: "fastboard-toolbar-panel apps"
1321
- }, /* @__PURE__ */ import_react48.default.createElement("div", {
1283
+ }, /* @__PURE__ */ import_react47.default.createElement("div", {
1322
1284
  className: "fastboard-toolbar-apps"
1323
- }, content || /* @__PURE__ */ import_react48.default.createElement(DefaultApps, null)));
1285
+ }, content || /* @__PURE__ */ import_react47.default.createElement(DefaultApps, null)));
1324
1286
  }
1325
1287
  function DefaultApps() {
1326
1288
  const app = useFastboardApp();
1327
- return /* @__PURE__ */ import_react48.default.createElement(import_react48.default.Fragment, null, /* @__PURE__ */ import_react48.default.createElement(AppIcon, {
1289
+ return /* @__PURE__ */ import_react47.default.createElement(import_react47.default.Fragment, null, /* @__PURE__ */ import_react47.default.createElement(AppIcon, {
1328
1290
  title: "Code Editor",
1329
1291
  src: vscode_default,
1330
1292
  alt: "[code editor]",
1331
1293
  onClick: app == null ? void 0 : app.insertCodeEditor.bind(app)
1332
- }), /* @__PURE__ */ import_react48.default.createElement(AppIcon, {
1294
+ }), /* @__PURE__ */ import_react47.default.createElement(AppIcon, {
1333
1295
  title: "GeoGebra",
1334
1296
  src: geogebra_default,
1335
1297
  alt: "[geogebra]",
1336
1298
  onClick: app == null ? void 0 : app.insertGeoGebra.bind(app)
1337
- }), /* @__PURE__ */ import_react48.default.createElement(AppIcon, {
1299
+ }), /* @__PURE__ */ import_react47.default.createElement(AppIcon, {
1338
1300
  title: "Countdown",
1339
1301
  src: countdown_default,
1340
1302
  alt: "[countdown]",
@@ -1342,29 +1304,29 @@ function DefaultApps() {
1342
1304
  }));
1343
1305
  }
1344
1306
  function AppIcon({ title, src, alt, onClick }) {
1345
- return /* @__PURE__ */ import_react48.default.createElement("span", {
1307
+ return /* @__PURE__ */ import_react47.default.createElement("span", {
1346
1308
  className: "fastboard-toolbar-app-icon"
1347
- }, /* @__PURE__ */ import_react48.default.createElement(Button, {
1309
+ }, /* @__PURE__ */ import_react47.default.createElement(Button, {
1348
1310
  placement: "top",
1349
1311
  content: title,
1350
1312
  onClick
1351
- }, /* @__PURE__ */ import_react48.default.createElement("img", {
1313
+ }, /* @__PURE__ */ import_react47.default.createElement("img", {
1352
1314
  src,
1353
1315
  alt,
1354
1316
  title
1355
- })), /* @__PURE__ */ import_react48.default.createElement("span", {
1317
+ })), /* @__PURE__ */ import_react47.default.createElement("span", {
1356
1318
  className: "fastboard-toolbar-app-icon-text"
1357
1319
  }, title));
1358
1320
  }
1359
1321
 
1360
1322
  // src/components/Toolbar/components/PencilButton.tsx
1361
- var import_react52 = __toESM(require("@tippyjs/react"));
1362
- var import_react53 = __toESM(require("react"));
1323
+ var import_react51 = __toESM(require("@tippyjs/react"));
1324
+ var import_react52 = __toESM(require("react"));
1363
1325
  var import_white_web_sdk2 = require("white-web-sdk");
1364
1326
 
1365
1327
  // src/components/Toolbar/components/ColorBox.tsx
1366
1328
  var import_clsx5 = __toESM(require("clsx"));
1367
- var import_react49 = __toESM(require("react"));
1329
+ var import_react48 = __toESM(require("react"));
1368
1330
  var colors = {
1369
1331
  "#E02020": [224, 32, 32],
1370
1332
  "#F7B500": [247, 181, 0],
@@ -1377,20 +1339,20 @@ var colors = {
1377
1339
  };
1378
1340
  var colorKeys = Object.keys(colors);
1379
1341
  function ColorBox() {
1380
- const { theme, memberState, setStrokeColor, writable } = (0, import_react49.useContext)(ToolbarContext);
1342
+ const { theme, memberState, setStrokeColor, writable } = (0, import_react48.useContext)(ToolbarContext);
1381
1343
  const strokeColor = memberState == null ? void 0 : memberState.strokeColor;
1382
1344
  const disabled = !writable;
1383
- return /* @__PURE__ */ import_react49.default.createElement("div", {
1345
+ return /* @__PURE__ */ import_react48.default.createElement("div", {
1384
1346
  className: (0, import_clsx5.default)("fastboard-toolbar-color-box", theme)
1385
- }, colorKeys.map((key) => /* @__PURE__ */ import_react49.default.createElement("div", {
1347
+ }, colorKeys.map((key) => /* @__PURE__ */ import_react48.default.createElement("div", {
1386
1348
  key,
1387
1349
  className: (0, import_clsx5.default)("fastboard-toolbar-color-item", theme),
1388
1350
  onClick: () => setStrokeColor(colors[key])
1389
- }, /* @__PURE__ */ import_react49.default.createElement("div", {
1351
+ }, /* @__PURE__ */ import_react48.default.createElement("div", {
1390
1352
  className: (0, import_clsx5.default)("fastboard-toolbar-color-border", theme, {
1391
1353
  active: strokeColor && isEqualArray(strokeColor, colors[key])
1392
1354
  })
1393
- }, /* @__PURE__ */ import_react49.default.createElement("button", {
1355
+ }, /* @__PURE__ */ import_react48.default.createElement("button", {
1394
1356
  className: (0, import_clsx5.default)("fastboard-toolbar-color-btn"),
1395
1357
  style: { background: key },
1396
1358
  disabled,
@@ -1403,10 +1365,10 @@ function ColorBox() {
1403
1365
 
1404
1366
  // src/components/Toolbar/components/CutLine.tsx
1405
1367
  var import_clsx6 = __toESM(require("clsx"));
1406
- var import_react50 = __toESM(require("react"));
1368
+ var import_react49 = __toESM(require("react"));
1407
1369
  function CutLine() {
1408
- const { theme } = (0, import_react50.useContext)(ToolbarContext);
1409
- return /* @__PURE__ */ import_react50.default.createElement("span", {
1370
+ const { theme } = (0, import_react49.useContext)(ToolbarContext);
1371
+ return /* @__PURE__ */ import_react49.default.createElement("span", {
1410
1372
  className: (0, import_clsx6.default)(`${name4}-cut-line`, theme)
1411
1373
  });
1412
1374
  }
@@ -1414,12 +1376,12 @@ function CutLine() {
1414
1376
  // src/components/Toolbar/components/Slider.tsx
1415
1377
  var import_clsx7 = __toESM(require("clsx"));
1416
1378
  var import_rc_slider = __toESM(require("rc-slider"));
1417
- var import_react51 = __toESM(require("react"));
1379
+ var import_react50 = __toESM(require("react"));
1418
1380
  function Slider() {
1419
- const { theme, writable, memberState, setStrokeWidth } = (0, import_react51.useContext)(ToolbarContext);
1381
+ const { theme, writable, memberState, setStrokeWidth } = (0, import_react50.useContext)(ToolbarContext);
1420
1382
  const { activeColor } = themes[theme];
1421
1383
  const strokeWidth = (memberState == null ? void 0 : memberState.strokeWidth) || 0;
1422
- return /* @__PURE__ */ import_react51.default.createElement(import_rc_slider.default, {
1384
+ return /* @__PURE__ */ import_react50.default.createElement(import_rc_slider.default, {
1423
1385
  disabled: !writable,
1424
1386
  className: (0, import_clsx7.default)("fastboard-toolbar-slider", theme),
1425
1387
  trackStyle: { background: activeColor },
@@ -1435,17 +1397,17 @@ function Slider() {
1435
1397
  function PencilButton() {
1436
1398
  const app = useFastboardApp();
1437
1399
  const { t } = useTranslation();
1438
- const { theme, icons, writable, setAppliance, memberState } = (0, import_react53.useContext)(ToolbarContext);
1439
- const changeAppliance = (0, import_react53.useCallback)(() => {
1400
+ const { theme, icons, writable, setAppliance, memberState } = (0, import_react52.useContext)(ToolbarContext);
1401
+ const changeAppliance = (0, import_react52.useCallback)(() => {
1440
1402
  setAppliance(import_white_web_sdk2.ApplianceNames.pencil);
1441
1403
  }, [setAppliance]);
1442
1404
  const appliance = memberState == null ? void 0 : memberState.currentApplianceName;
1443
1405
  const active = appliance === import_white_web_sdk2.ApplianceNames.pencil;
1444
1406
  const disabled = !writable;
1445
1407
  const shortcut = ((app == null ? void 0 : app.hotKeys) || defaultHotKeys).changeToPencil;
1446
- return /* @__PURE__ */ import_react53.default.createElement("span", {
1408
+ return /* @__PURE__ */ import_react52.default.createElement("span", {
1447
1409
  className: "fastboard-toolbar-btn-interactive"
1448
- }, /* @__PURE__ */ import_react53.default.createElement(import_react52.default, {
1410
+ }, /* @__PURE__ */ import_react52.default.createElement(import_react51.default, {
1449
1411
  className: "fastboard-tip",
1450
1412
  content: renderPencilButtonContent(),
1451
1413
  theme,
@@ -1454,30 +1416,30 @@ function PencilButton() {
1454
1416
  offset: RightOffset,
1455
1417
  arrow: false,
1456
1418
  interactive: true
1457
- }, /* @__PURE__ */ import_react53.default.createElement(Button, {
1419
+ }, /* @__PURE__ */ import_react52.default.createElement(Button, {
1458
1420
  content: renderToolTip(t("pencil"), shortcut),
1459
1421
  active,
1460
1422
  onClick: changeAppliance
1461
- }, /* @__PURE__ */ import_react53.default.createElement(Icon, {
1462
- fallback: /* @__PURE__ */ import_react53.default.createElement(Icons.Pencil, {
1423
+ }, /* @__PURE__ */ import_react52.default.createElement(Icon, {
1424
+ fallback: /* @__PURE__ */ import_react52.default.createElement(Icons.Pencil, {
1463
1425
  theme,
1464
1426
  active
1465
1427
  }),
1466
1428
  src: disabled ? icons == null ? void 0 : icons.pencilIconDisable : icons == null ? void 0 : icons.pencilIcon,
1467
1429
  alt: "[pencil]"
1468
- }), /* @__PURE__ */ import_react53.default.createElement("span", {
1430
+ }), /* @__PURE__ */ import_react52.default.createElement("span", {
1469
1431
  className: "fastboard-toolbar-triangle"
1470
1432
  }))));
1471
1433
  }
1472
1434
  function renderPencilButtonContent() {
1473
- return /* @__PURE__ */ import_react53.default.createElement("div", {
1435
+ return /* @__PURE__ */ import_react52.default.createElement("div", {
1474
1436
  className: "fastboard-toolbar-panel pencil"
1475
- }, /* @__PURE__ */ import_react53.default.createElement(Slider, null), /* @__PURE__ */ import_react53.default.createElement(CutLine, null), /* @__PURE__ */ import_react53.default.createElement(ColorBox, null));
1437
+ }, /* @__PURE__ */ import_react52.default.createElement(Slider, null), /* @__PURE__ */ import_react52.default.createElement(CutLine, null), /* @__PURE__ */ import_react52.default.createElement(ColorBox, null));
1476
1438
  }
1477
1439
 
1478
1440
  // src/components/Toolbar/components/ShapesButton.tsx
1479
- var import_react54 = __toESM(require("@tippyjs/react"));
1480
- var import_react55 = __toESM(require("react"));
1441
+ var import_react53 = __toESM(require("@tippyjs/react"));
1442
+ var import_react54 = __toESM(require("react"));
1481
1443
  var import_white_web_sdk4 = require("white-web-sdk");
1482
1444
 
1483
1445
  // src/components/Toolbar/const.ts
@@ -1513,15 +1475,15 @@ var MinHeight = ItemHeight * 2 - 4;
1513
1475
  var ShapeTypes = /* @__PURE__ */ new Set([...ApplianceShapes, ...Shapes]);
1514
1476
  function ShapesButton() {
1515
1477
  const { t } = useTranslation();
1516
- const { theme, memberState } = (0, import_react55.useContext)(ToolbarContext);
1478
+ const { theme, memberState } = (0, import_react54.useContext)(ToolbarContext);
1517
1479
  const appliance = memberState == null ? void 0 : memberState.currentApplianceName;
1518
1480
  const shape = memberState == null ? void 0 : memberState.shapeType;
1519
1481
  const key = appliance === import_white_web_sdk4.ApplianceNames.shape ? shape : appliance;
1520
1482
  const active = ShapeTypes.has(key);
1521
1483
  const CurrentIcon = ShapesMap[key] || Icons.Rectangle;
1522
- return /* @__PURE__ */ import_react55.default.createElement("span", {
1484
+ return /* @__PURE__ */ import_react54.default.createElement("span", {
1523
1485
  className: "fastboard-toolbar-btn-interactive"
1524
- }, /* @__PURE__ */ import_react55.default.createElement(import_react54.default, {
1486
+ }, /* @__PURE__ */ import_react54.default.createElement(import_react53.default, {
1525
1487
  className: "fastboard-tip",
1526
1488
  content: renderShapesButtonContent(),
1527
1489
  theme,
@@ -1530,31 +1492,31 @@ function ShapesButton() {
1530
1492
  offset: RightOffset,
1531
1493
  arrow: false,
1532
1494
  interactive: true
1533
- }, /* @__PURE__ */ import_react55.default.createElement(Button, {
1495
+ }, /* @__PURE__ */ import_react54.default.createElement(Button, {
1534
1496
  content: t("shape"),
1535
1497
  active
1536
- }, /* @__PURE__ */ import_react55.default.createElement(CurrentIcon, {
1498
+ }, /* @__PURE__ */ import_react54.default.createElement(CurrentIcon, {
1537
1499
  theme,
1538
1500
  active
1539
- }), /* @__PURE__ */ import_react55.default.createElement("span", {
1501
+ }), /* @__PURE__ */ import_react54.default.createElement("span", {
1540
1502
  className: "fastboard-toolbar-triangle"
1541
1503
  }))));
1542
1504
  }
1543
1505
  function renderShapesButtonContent() {
1544
- return /* @__PURE__ */ import_react55.default.createElement("div", {
1506
+ return /* @__PURE__ */ import_react54.default.createElement("div", {
1545
1507
  className: "fastboard-toolbar-panel shapes"
1546
- }, /* @__PURE__ */ import_react55.default.createElement(ShapesBox, null), /* @__PURE__ */ import_react55.default.createElement(CutLine, null), /* @__PURE__ */ import_react55.default.createElement(Slider, null), /* @__PURE__ */ import_react55.default.createElement(CutLine, null), /* @__PURE__ */ import_react55.default.createElement(ColorBox, null));
1508
+ }, /* @__PURE__ */ import_react54.default.createElement(ShapesBox, null), /* @__PURE__ */ import_react54.default.createElement(CutLine, null), /* @__PURE__ */ import_react54.default.createElement(Slider, null), /* @__PURE__ */ import_react54.default.createElement(CutLine, null), /* @__PURE__ */ import_react54.default.createElement(ColorBox, null));
1547
1509
  }
1548
1510
  function ShapesBox() {
1549
1511
  const { t } = useTranslation();
1550
- return /* @__PURE__ */ import_react55.default.createElement("div", {
1512
+ return /* @__PURE__ */ import_react54.default.createElement("div", {
1551
1513
  className: "fastboard-toolbar-shapes"
1552
- }, ApplianceShapes.map((Appliance) => /* @__PURE__ */ import_react55.default.createElement(ApplianceShapeButton, {
1514
+ }, ApplianceShapes.map((Appliance) => /* @__PURE__ */ import_react54.default.createElement(ApplianceShapeButton, {
1553
1515
  key: Appliance,
1554
1516
  content: t(Appliance),
1555
1517
  Appliance,
1556
1518
  Icon: ShapesMap[Appliance]
1557
- })), Shapes.map((shape) => /* @__PURE__ */ import_react55.default.createElement(ShapeShapeButton, {
1519
+ })), Shapes.map((shape) => /* @__PURE__ */ import_react54.default.createElement(ShapeShapeButton, {
1558
1520
  key: shape,
1559
1521
  content: t(shape),
1560
1522
  shape,
@@ -1562,53 +1524,53 @@ function ShapesBox() {
1562
1524
  })));
1563
1525
  }
1564
1526
  function ApplianceShapeButton({ content, Appliance, Icon: Icon2 }) {
1565
- const { theme, writable, setAppliance, memberState } = (0, import_react55.useContext)(ToolbarContext);
1527
+ const { theme, writable, setAppliance, memberState } = (0, import_react54.useContext)(ToolbarContext);
1566
1528
  const current = memberState == null ? void 0 : memberState.currentApplianceName;
1567
1529
  const disabled = !writable;
1568
- return /* @__PURE__ */ import_react55.default.createElement(Button, {
1530
+ return /* @__PURE__ */ import_react54.default.createElement(Button, {
1569
1531
  content,
1570
1532
  disabled,
1571
1533
  placement: "top",
1572
1534
  onClick: () => setAppliance(Appliance)
1573
- }, /* @__PURE__ */ import_react55.default.createElement(Icon2, {
1535
+ }, /* @__PURE__ */ import_react54.default.createElement(Icon2, {
1574
1536
  theme,
1575
1537
  active: current === Appliance
1576
1538
  }));
1577
1539
  }
1578
1540
  function ShapeShapeButton({ content, shape, Icon: Icon2 }) {
1579
- const { theme, writable, setAppliance, memberState } = (0, import_react55.useContext)(ToolbarContext);
1541
+ const { theme, writable, setAppliance, memberState } = (0, import_react54.useContext)(ToolbarContext);
1580
1542
  const appliance = memberState == null ? void 0 : memberState.currentApplianceName;
1581
1543
  const current = appliance === import_white_web_sdk4.ApplianceNames.shape && (memberState == null ? void 0 : memberState.shapeType);
1582
1544
  const disabled = !writable;
1583
- return /* @__PURE__ */ import_react55.default.createElement(Button, {
1545
+ return /* @__PURE__ */ import_react54.default.createElement(Button, {
1584
1546
  content,
1585
1547
  disabled,
1586
1548
  placement: "top",
1587
1549
  onClick: () => setAppliance(import_white_web_sdk4.ApplianceNames.shape, shape)
1588
- }, /* @__PURE__ */ import_react55.default.createElement(Icon2, {
1550
+ }, /* @__PURE__ */ import_react54.default.createElement(Icon2, {
1589
1551
  theme,
1590
1552
  active: current === shape
1591
1553
  }));
1592
1554
  }
1593
1555
 
1594
1556
  // src/components/Toolbar/components/TextButton.tsx
1595
- var import_react56 = __toESM(require("@tippyjs/react"));
1596
- var import_react57 = __toESM(require("react"));
1557
+ var import_react55 = __toESM(require("@tippyjs/react"));
1558
+ var import_react56 = __toESM(require("react"));
1597
1559
  var import_white_web_sdk5 = require("white-web-sdk");
1598
1560
  function TextButton() {
1599
1561
  const app = useFastboardApp();
1600
1562
  const { t } = useTranslation();
1601
- const { theme, icons, writable, setAppliance, memberState } = (0, import_react57.useContext)(ToolbarContext);
1602
- const changeAppliance = (0, import_react57.useCallback)(() => {
1563
+ const { theme, icons, writable, setAppliance, memberState } = (0, import_react56.useContext)(ToolbarContext);
1564
+ const changeAppliance = (0, import_react56.useCallback)(() => {
1603
1565
  setAppliance(import_white_web_sdk5.ApplianceNames.text);
1604
1566
  }, [setAppliance]);
1605
1567
  const appliance = memberState == null ? void 0 : memberState.currentApplianceName;
1606
1568
  const active = appliance === import_white_web_sdk5.ApplianceNames.text;
1607
1569
  const disabled = !writable;
1608
1570
  const shortcut = ((app == null ? void 0 : app.hotKeys) || defaultHotKeys).changeToText;
1609
- return /* @__PURE__ */ import_react57.default.createElement("span", {
1571
+ return /* @__PURE__ */ import_react56.default.createElement("span", {
1610
1572
  className: "fastboard-toolbar-btn-interactive"
1611
- }, /* @__PURE__ */ import_react57.default.createElement(import_react56.default, {
1573
+ }, /* @__PURE__ */ import_react56.default.createElement(import_react55.default, {
1612
1574
  className: "fastboard-tip",
1613
1575
  content: renderTextButtonContent(),
1614
1576
  theme,
@@ -1617,53 +1579,53 @@ function TextButton() {
1617
1579
  offset: RightOffset,
1618
1580
  arrow: false,
1619
1581
  interactive: true
1620
- }, /* @__PURE__ */ import_react57.default.createElement(Button, {
1582
+ }, /* @__PURE__ */ import_react56.default.createElement(Button, {
1621
1583
  content: renderToolTip(t("text"), shortcut),
1622
1584
  active,
1623
1585
  onClick: changeAppliance
1624
- }, /* @__PURE__ */ import_react57.default.createElement(Icon, {
1625
- fallback: /* @__PURE__ */ import_react57.default.createElement(Icons.Text, {
1586
+ }, /* @__PURE__ */ import_react56.default.createElement(Icon, {
1587
+ fallback: /* @__PURE__ */ import_react56.default.createElement(Icons.Text, {
1626
1588
  theme,
1627
1589
  active
1628
1590
  }),
1629
1591
  src: disabled ? icons == null ? void 0 : icons.textIconDisable : icons == null ? void 0 : icons.textIcon,
1630
1592
  alt: "[text]"
1631
- }), /* @__PURE__ */ import_react57.default.createElement("span", {
1593
+ }), /* @__PURE__ */ import_react56.default.createElement("span", {
1632
1594
  className: "fastboard-toolbar-triangle"
1633
1595
  }))));
1634
1596
  }
1635
1597
  function renderTextButtonContent() {
1636
- return /* @__PURE__ */ import_react57.default.createElement("div", {
1598
+ return /* @__PURE__ */ import_react56.default.createElement("div", {
1637
1599
  className: "fastboard-toolbar-panel text"
1638
- }, /* @__PURE__ */ import_react57.default.createElement(ColorBox, null));
1600
+ }, /* @__PURE__ */ import_react56.default.createElement(ColorBox, null));
1639
1601
  }
1640
1602
 
1641
1603
  // src/components/Toolbar/components/UpDownButtons.tsx
1642
- var import_react58 = __toESM(require("react"));
1604
+ var import_react57 = __toESM(require("react"));
1643
1605
  function UpButton({ disabled, scrollTo }) {
1644
- const { theme, icons } = (0, import_react58.useContext)(ToolbarContext);
1645
- const scrollUp = (0, import_react58.useCallback)(() => scrollTo(-ItemHeight), [scrollTo]);
1646
- return /* @__PURE__ */ import_react58.default.createElement(import_react58.default.Fragment, null, /* @__PURE__ */ import_react58.default.createElement(Button, {
1606
+ const { theme, icons } = (0, import_react57.useContext)(ToolbarContext);
1607
+ const scrollUp = (0, import_react57.useCallback)(() => scrollTo(-ItemHeight), [scrollTo]);
1608
+ return /* @__PURE__ */ import_react57.default.createElement(import_react57.default.Fragment, null, /* @__PURE__ */ import_react57.default.createElement(Button, {
1647
1609
  content: "Up",
1648
1610
  disabled,
1649
1611
  onClick: scrollUp
1650
- }, /* @__PURE__ */ import_react58.default.createElement(Icon, {
1651
- fallback: /* @__PURE__ */ import_react58.default.createElement(Icons.Up, {
1612
+ }, /* @__PURE__ */ import_react57.default.createElement(Icon, {
1613
+ fallback: /* @__PURE__ */ import_react57.default.createElement(Icons.Up, {
1652
1614
  theme
1653
1615
  }),
1654
1616
  src: disabled ? icons == null ? void 0 : icons.upIconDisable : icons == null ? void 0 : icons.upIcon,
1655
1617
  alt: "[up]"
1656
- })), /* @__PURE__ */ import_react58.default.createElement(CutLine, null));
1618
+ })), /* @__PURE__ */ import_react57.default.createElement(CutLine, null));
1657
1619
  }
1658
1620
  function DownButton({ disabled, scrollTo }) {
1659
- const { theme, icons } = (0, import_react58.useContext)(ToolbarContext);
1660
- const scrollDown = (0, import_react58.useCallback)(() => scrollTo(ItemHeight), [scrollTo]);
1661
- return /* @__PURE__ */ import_react58.default.createElement(import_react58.default.Fragment, null, /* @__PURE__ */ import_react58.default.createElement(CutLine, null), /* @__PURE__ */ import_react58.default.createElement(Button, {
1621
+ const { theme, icons } = (0, import_react57.useContext)(ToolbarContext);
1622
+ const scrollDown = (0, import_react57.useCallback)(() => scrollTo(ItemHeight), [scrollTo]);
1623
+ return /* @__PURE__ */ import_react57.default.createElement(import_react57.default.Fragment, null, /* @__PURE__ */ import_react57.default.createElement(CutLine, null), /* @__PURE__ */ import_react57.default.createElement(Button, {
1662
1624
  content: "Down",
1663
1625
  disabled,
1664
1626
  onClick: scrollDown
1665
- }, /* @__PURE__ */ import_react58.default.createElement(Icon, {
1666
- fallback: /* @__PURE__ */ import_react58.default.createElement(Icons.Down, {
1627
+ }, /* @__PURE__ */ import_react57.default.createElement(Icon, {
1628
+ fallback: /* @__PURE__ */ import_react57.default.createElement(Icons.Down, {
1667
1629
  theme
1668
1630
  }),
1669
1631
  src: disabled ? icons == null ? void 0 : icons.downIconDisable : icons == null ? void 0 : icons.downIcon,
@@ -1671,25 +1633,30 @@ function DownButton({ disabled, scrollTo }) {
1671
1633
  })));
1672
1634
  }
1673
1635
 
1636
+ // src/components/Toolbar/components/assets/collapsed.png
1637
+ var collapsed_default = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAB8CAYAAAAMw2JFAAAAAXNSR0IArs4c6QAAA49JREFUeF7tnLFv00AUh5/TFVYkxIDEnKFjJ/gb2CIqpUPagYXNEV2LRGk7tAiRSA0bWcC0QzowwQKuVDnCLE2KTZCMSNLkHCLalCpBkdFVMTKh8TXO+c4S16XDSb0vv/vyfE3fqwQR+ZIA4AoAdADgJ08mSVXVV9ls9nE+nzcBAAFAnweQ1Gg06gihrmEYubm5OeX4+LgBAD9Yw0iO49S63S7U6/VYq9UyCoXC2tLS0kcAwEA9VkBnIO5m7XYbJwTVanVLluWcruvfAOA7ADhhA/0Fgjfr9/tweHgYs20baZq2sbCw8HaQTqgy/wPivvKTkxN8XFPNZvMdC5lHgmAgx3EAISQhhHqGYWyGKbMviJsOC5kvBOIjcxUAWjRkHgtkSGZb07R1WjKPDeIj82cAaAatzIFBhmU2TTOXTCZfBq3ME4HQlJkKCA2ZqYJMIjN1kKAyhwYyrsyhgpwns6IoyysrK/rgQfrnqc4ExCtzrVb7tbe39yCVSr0GAFyZz2CYguANT09PwbIsaWdn5146nX4zuO+wB8EwnU5HqlQqdiKRuHNwcFDC1Zh5Iu4xWZYVU1V1eXZ29jlOhRvI0dGRVC6XP8zMzNwFgK/cQHq9HpTLZXt6evo2AFS4geDbX6lUisXj8VsA8IkbCHZlf39/Kh6P3xQg7jtHJDL826JIRCRC+gRBOCIcEY6QEhCOkBISdUQ4IhwhJSAcISUk6kjojjxaXbt0Py3jP1DCtes3ruLvVetLnenRYIgnT7OX3Y25gLgQ3gSYg3ghuIEMQ3ABOQ+COcgoCKYgfhD/Jwh+1ZE4GrdKRkJWPxhulTUSBe28ZLglMgzDHcR9N3G/BpDuHH7r4qoY+lUx6PGIoxFHQ3JHOCIcEY6QEhCOkBISdUQ4IhwhJSAcISUk6ohwxM+RyLR/RaYhLjItgpFomoxEG2kkGmvxRBPXVmPPWIypKMpD5s3X3kEh0zSfJZPJF6NmK0JrI3VHpxBCaiaTWc/n877TJtRBPMNkdrFY3Jifn8ed3njUzneYjCqIZ7xue3FxMadpGh6vu9BEEhUQr4yFQmE1yMDhRCDjyEi6JAUGGVdG6iBBZaQK4pVRluVNXdfZjsfRkHGiRGjKGBjEI+P7TCazQaqMpI1I635jtmNVRtJGpPVRg8fbtGW8EAiL6VUiyGA4vUd6TJN+0KTr0u7u7hYLGUmg0fkHBiRSVuu/AWpfZNft9vFDAAAAAElFTkSuQmCC";
1638
+
1674
1639
  // src/components/Toolbar/Content.tsx
1675
- var Content = import_react59.default.memo(() => {
1676
- const ref = (0, import_react59.useRef)(null);
1677
- const [scrollTop, setScrollTop] = (0, import_react59.useState)(0);
1678
- const [parentHeight, setParentHeight] = (0, import_react59.useState)(0);
1640
+ function Content({ onCollapse }) {
1641
+ const { theme, icons, writable } = (0, import_react58.useContext)(ToolbarContext);
1642
+ const ref = (0, import_react58.useRef)(null);
1643
+ const [scrollTop, setScrollTop] = (0, import_react58.useState)(0);
1644
+ const [parentHeight, setParentHeight] = (0, import_react58.useState)(0);
1645
+ const disabled = !writable;
1679
1646
  const needScroll = parentHeight < ItemHeight * ItemsCount + 48;
1680
1647
  const sectionHeight = clamp(parentHeight - 48 * (needScroll ? 3 : 1), MinHeight, MaxHeight);
1681
1648
  const scrollBuffer = Math.max(parentHeight - sectionHeight - 1, 0);
1682
1649
  const disableScrollUp = scrollTop === 0;
1683
1650
  const disableScrollDown = scrollTop === scrollBuffer;
1684
- const scrollTo = (0, import_react59.useCallback)((height) => {
1651
+ const scrollTo = (0, import_react58.useCallback)((height) => {
1685
1652
  setScrollTop(clamp(scrollTop + height, 0, scrollBuffer));
1686
1653
  }, [scrollBuffer, scrollTop]);
1687
- (0, import_react59.useEffect)(() => {
1654
+ (0, import_react58.useEffect)(() => {
1688
1655
  if (ref.current) {
1689
1656
  ref.current.scrollTop = scrollTop;
1690
1657
  }
1691
1658
  }, [scrollTop]);
1692
- (0, import_react59.useEffect)(() => {
1659
+ (0, import_react58.useEffect)(() => {
1693
1660
  var _a, _b;
1694
1661
  const container = (_b = (_a = ref.current) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.parentElement;
1695
1662
  if (container) {
@@ -1702,95 +1669,82 @@ var Content = import_react59.default.memo(() => {
1702
1669
  return () => resizeObserver.disconnect();
1703
1670
  }
1704
1671
  }, []);
1705
- return /* @__PURE__ */ import_react59.default.createElement(import_react59.default.Fragment, null, needScroll && /* @__PURE__ */ import_react59.default.createElement(UpButton, {
1672
+ return /* @__PURE__ */ import_react58.default.createElement(import_react58.default.Fragment, null, needScroll && /* @__PURE__ */ import_react58.default.createElement(UpButton, {
1706
1673
  scrollTo,
1707
1674
  disabled: disableScrollUp
1708
- }), /* @__PURE__ */ import_react59.default.createElement("div", {
1675
+ }), /* @__PURE__ */ import_react58.default.createElement("div", {
1709
1676
  ref,
1710
1677
  className: (0, import_clsx8.default)(`${name4}-section`),
1711
1678
  style: {
1712
1679
  height: `${sectionHeight}px`,
1713
1680
  overflow: needScroll ? "hidden" : "visible"
1714
1681
  }
1715
- }, /* @__PURE__ */ import_react59.default.createElement(ClickerButton, null), /* @__PURE__ */ import_react59.default.createElement(SelectorButton, null), /* @__PURE__ */ import_react59.default.createElement(PencilButton, null), /* @__PURE__ */ import_react59.default.createElement(TextButton, null), /* @__PURE__ */ import_react59.default.createElement(ShapesButton, null), /* @__PURE__ */ import_react59.default.createElement(EraserButton, null), /* @__PURE__ */ import_react59.default.createElement(CleanButton, null), /* @__PURE__ */ import_react59.default.createElement(AppsButton, null)), needScroll && /* @__PURE__ */ import_react59.default.createElement(DownButton, {
1682
+ }, /* @__PURE__ */ import_react58.default.createElement(ClickerButton, null), /* @__PURE__ */ import_react58.default.createElement(SelectorButton, null), /* @__PURE__ */ import_react58.default.createElement(PencilButton, null), /* @__PURE__ */ import_react58.default.createElement(TextButton, null), /* @__PURE__ */ import_react58.default.createElement(ShapesButton, null), /* @__PURE__ */ import_react58.default.createElement(EraserButton, null), /* @__PURE__ */ import_react58.default.createElement(CleanButton, null), /* @__PURE__ */ import_react58.default.createElement(AppsButton, null)), needScroll && /* @__PURE__ */ import_react58.default.createElement(DownButton, {
1716
1683
  scrollTo,
1717
1684
  disabled: disableScrollDown
1718
- }));
1719
- });
1685
+ }), /* @__PURE__ */ import_react58.default.createElement("div", {
1686
+ className: (0, import_clsx8.default)("fastboard-toolbar-mask", theme),
1687
+ onClick: onCollapse
1688
+ }, /* @__PURE__ */ import_react58.default.createElement(Icon, {
1689
+ fallback: /* @__PURE__ */ import_react58.default.createElement("img", {
1690
+ draggable: false,
1691
+ className: (0, import_clsx8.default)(`${name4}-mask-btn`, theme),
1692
+ src: collapsed_default
1693
+ }),
1694
+ src: disabled ? icons == null ? void 0 : icons.expandIconDisable : icons == null ? void 0 : icons.expandIcon
1695
+ })));
1696
+ }
1720
1697
 
1721
1698
  // src/components/Toolbar/Toolbar.tsx
1722
- var ToolbarContext = (0, import_react60.createContext)(__spreadValues({
1699
+ var ToolbarContext = (0, import_react59.createContext)(__spreadValues({
1723
1700
  theme: "light"
1724
1701
  }, EmptyToolbarHook));
1725
1702
  var name4 = "fastboard-toolbar";
1726
- var Toolbar = ({ theme, icons }) => {
1703
+ function Toolbar({ theme, icons }) {
1727
1704
  theme = useTheme(theme);
1728
1705
  const hook = useToolbar();
1729
- const [expanded, setExpanded] = (0, import_react60.useState)(true);
1730
- const [toolbar, toolbarRef] = (0, import_react60.useState)(null);
1731
- const [onHover, setOnHover] = (0, import_react60.useState)(false);
1732
- const [delayedOnHover, setDelayedOnHover] = (0, import_react60.useState)(false);
1733
- const [pointEvents, setPointEvents] = (0, import_react60.useState)(true);
1706
+ const [expanded, setExpanded] = (0, import_react59.useState)(true);
1707
+ const [pointerEvents, setPointerEvents] = (0, import_react59.useState)("auto");
1734
1708
  const disabled = !hook.writable;
1735
- const toggle = (0, import_react60.useCallback)(() => {
1736
- setExpanded((e) => !e);
1737
- }, []);
1738
- (0, import_react60.useEffect)(() => {
1739
- const timer = setTimeout(() => {
1740
- setDelayedOnHover(onHover);
1741
- }, 400);
1742
- return () => clearTimeout(timer);
1743
- }, [onHover]);
1744
- return /* @__PURE__ */ import_react60.default.createElement(ToolbarContext.Provider, {
1709
+ return /* @__PURE__ */ import_react59.default.createElement(ToolbarContext.Provider, {
1745
1710
  value: __spreadValues({ theme, icons }, hook)
1746
- }, /* @__PURE__ */ import_react60.default.createElement(import_framer_motion.AnimatePresence, null, expanded ? /* @__PURE__ */ import_react60.default.createElement(import_framer_motion.motion.div, {
1747
- initial: { x: -100 },
1748
- animate: { x: 0, transition: { duration: 0.5 } },
1711
+ }, /* @__PURE__ */ import_react59.default.createElement(import_framer_motion.AnimatePresence, null, expanded ? /* @__PURE__ */ import_react59.default.createElement(import_framer_motion.motion.div, {
1749
1712
  key: "toolbar",
1750
- ref: toolbarRef,
1751
1713
  className: (0, import_clsx9.default)(name4, theme),
1752
- onPointerEnter: () => {
1753
- expanded && setOnHover(true);
1754
- },
1755
- onMouseLeave: () => setOnHover(false),
1714
+ initial: { x: -100 },
1715
+ animate: { x: 0, transition: { duration: 0.5 } },
1756
1716
  exit: { x: -100, transition: { duration: 0.5 } },
1757
- onAnimationStart: () => setPointEvents(false),
1758
- onAnimationComplete: () => setPointEvents(true),
1759
- style: { pointerEvents: pointEvents ? "auto" : "none" }
1760
- }, /* @__PURE__ */ import_react60.default.createElement(Content, null), expanded && (onHover || delayedOnHover) && /* @__PURE__ */ import_react60.default.createElement(Mask, {
1761
- toolbar
1762
- }, /* @__PURE__ */ import_react60.default.createElement("div", {
1763
- onClick: toggle
1764
- }, /* @__PURE__ */ import_react60.default.createElement("img", {
1765
- draggable: false,
1766
- className: (0, import_clsx9.default)(`${name4}-mask-btn`, theme),
1767
- src: collapsed_default
1768
- })))) : /* @__PURE__ */ import_react60.default.createElement(import_framer_motion.motion.div, {
1717
+ onAnimationStart: () => setPointerEvents("none"),
1718
+ onAnimationComplete: () => setPointerEvents("auto"),
1719
+ style: { pointerEvents }
1720
+ }, /* @__PURE__ */ import_react59.default.createElement(Content, {
1721
+ onCollapse: () => setExpanded(false)
1722
+ })) : /* @__PURE__ */ import_react59.default.createElement(import_framer_motion.motion.div, {
1769
1723
  className: (0, import_clsx9.default)(`${name4}-expand-btn`, theme),
1770
1724
  key: "expand",
1771
- onClick: toggle,
1725
+ onClick: () => setExpanded(true),
1772
1726
  initial: { x: -100 },
1773
1727
  animate: { x: 0, transition: { duration: 0.5 } }
1774
- }, !expanded && /* @__PURE__ */ import_react60.default.createElement(Icon, {
1775
- fallback: /* @__PURE__ */ import_react60.default.createElement("img", {
1728
+ }, /* @__PURE__ */ import_react59.default.createElement(Icon, {
1729
+ fallback: /* @__PURE__ */ import_react59.default.createElement("img", {
1776
1730
  draggable: false,
1777
1731
  src: expanded_default,
1778
1732
  className: (0, import_clsx9.default)(`${name4}-mask-btn`, theme)
1779
1733
  }),
1780
1734
  src: disabled ? icons == null ? void 0 : icons.expandIconDisable : icons == null ? void 0 : icons.expandIcon
1781
1735
  }))));
1782
- };
1736
+ }
1783
1737
 
1784
1738
  // src/components/PlayerControl/hooks.ts
1785
- var import_react61 = require("react");
1739
+ var import_react60 = require("react");
1786
1740
  var import_white_web_sdk6 = require("white-web-sdk");
1787
1741
  var EMPTY_ARRAY = [];
1788
1742
  function useForceUpdate2() {
1789
- const [, forceUpdate_] = (0, import_react61.useState)({});
1790
- return (0, import_react61.useCallback)(() => forceUpdate_({}), EMPTY_ARRAY);
1743
+ const [, forceUpdate_] = (0, import_react60.useState)({});
1744
+ return (0, import_react60.useCallback)(() => forceUpdate_({}), EMPTY_ARRAY);
1791
1745
  }
1792
1746
  function usePlayerControl(player) {
1793
- const togglePlay = (0, import_react61.useCallback)(() => {
1747
+ const togglePlay = (0, import_react60.useCallback)(() => {
1794
1748
  if (player) {
1795
1749
  switch (player.phase) {
1796
1750
  case import_white_web_sdk6.PlayerPhase.WaitingFirstFrame:
@@ -1806,25 +1760,25 @@ function usePlayerControl(player) {
1806
1760
  }
1807
1761
  }
1808
1762
  }, [player]);
1809
- const seekToProgressTime = (0, import_react61.useCallback)((time) => {
1763
+ const seekToProgressTime = (0, import_react60.useCallback)((time) => {
1810
1764
  if (player) {
1811
1765
  player.seekToProgressTime(time);
1812
1766
  }
1813
1767
  }, [player]);
1814
1768
  const lastPlayer = useLastValue(player);
1815
1769
  const forceUpdate = useForceUpdate2();
1816
- const setSpeed = (0, import_react61.useCallback)((speed2) => {
1770
+ const setSpeed = (0, import_react60.useCallback)((speed2) => {
1817
1771
  if (player) {
1818
1772
  player.playbackSpeed = speed2;
1819
1773
  forceUpdate();
1820
1774
  }
1821
1775
  }, [forceUpdate, player]);
1822
- (0, import_react61.useEffect)(() => {
1776
+ (0, import_react60.useEffect)(() => {
1823
1777
  if (!lastPlayer && player) {
1824
1778
  forceUpdate();
1825
1779
  }
1826
1780
  }, [forceUpdate, lastPlayer, player]);
1827
- (0, import_react61.useEffect)(() => {
1781
+ (0, import_react60.useEffect)(() => {
1828
1782
  if (player) {
1829
1783
  player.callbacks.on("onPhaseChanged", forceUpdate);
1830
1784
  player.callbacks.on("onProgressTimeChanged", forceUpdate);
@@ -1850,19 +1804,19 @@ function usePlayerControl(player) {
1850
1804
  }
1851
1805
 
1852
1806
  // src/components/PlayerControl/PlayerControl.tsx
1853
- var import_react68 = __toESM(require("@tippyjs/react"));
1807
+ var import_react67 = __toESM(require("@tippyjs/react"));
1854
1808
  var import_clsx11 = __toESM(require("clsx"));
1855
1809
  var import_rc_slider2 = __toESM(require("rc-slider"));
1856
- var import_react69 = __toESM(require("react"));
1810
+ var import_react68 = __toESM(require("react"));
1857
1811
  var import_white_web_sdk7 = require("white-web-sdk");
1858
1812
 
1859
1813
  // src/components/PlayerControl/components/Button.tsx
1860
1814
  var import_clsx10 = __toESM(require("clsx"));
1861
- var import_react62 = __toESM(require("react"));
1862
- var import_react63 = __toESM(require("@tippyjs/react"));
1863
- var Button2 = (0, import_react62.forwardRef)((props, ref) => {
1815
+ var import_react61 = __toESM(require("react"));
1816
+ var import_react62 = __toESM(require("@tippyjs/react"));
1817
+ var Button2 = (0, import_react61.forwardRef)((props, ref) => {
1864
1818
  const { theme, content, disabled, active, onClick, interactive, placement = "top", children } = props;
1865
- return /* @__PURE__ */ import_react62.default.createElement(import_react63.default, {
1819
+ return /* @__PURE__ */ import_react61.default.createElement(import_react62.default, {
1866
1820
  className: "fastboard-tip",
1867
1821
  content,
1868
1822
  interactive,
@@ -1872,7 +1826,7 @@ var Button2 = (0, import_react62.forwardRef)((props, ref) => {
1872
1826
  offset: TopOffset,
1873
1827
  delay: [1e3, 400],
1874
1828
  duration: 300
1875
- }, /* @__PURE__ */ import_react62.default.createElement("button", {
1829
+ }, /* @__PURE__ */ import_react61.default.createElement("button", {
1876
1830
  ref,
1877
1831
  className: (0, import_clsx10.default)("fastboard-player-control-btn", theme, { active }),
1878
1832
  onClick,
@@ -1881,39 +1835,39 @@ var Button2 = (0, import_react62.forwardRef)((props, ref) => {
1881
1835
  });
1882
1836
 
1883
1837
  // src/components/PlayerControl/icons/index.ts
1884
- var import_react67 = require("react");
1838
+ var import_react66 = require("react");
1885
1839
 
1886
1840
  // src/components/PlayerControl/icons/Loading.tsx
1887
- var import_react64 = __toESM(require("react"));
1841
+ var import_react63 = __toESM(require("react"));
1888
1842
  var Loading = (props) => {
1889
1843
  const stroke = getStroke(props);
1890
- return /* @__PURE__ */ import_react64.default.createElement("svg", {
1844
+ return /* @__PURE__ */ import_react63.default.createElement("svg", {
1891
1845
  viewBox: "0 0 24 24"
1892
- }, /* @__PURE__ */ import_react64.default.createElement("path", {
1846
+ }, /* @__PURE__ */ import_react63.default.createElement("path", {
1893
1847
  d: "M12 4V2A10 10 0 0 0 2 12h2a8 8 0 0 1 8-8z",
1894
1848
  fill: stroke
1895
1849
  }));
1896
1850
  };
1897
1851
 
1898
1852
  // src/components/PlayerControl/icons/Pause.tsx
1899
- var import_react65 = __toESM(require("react"));
1853
+ var import_react64 = __toESM(require("react"));
1900
1854
  var Pause = (props) => {
1901
1855
  const stroke = getStroke(props);
1902
- return /* @__PURE__ */ import_react65.default.createElement("svg", {
1856
+ return /* @__PURE__ */ import_react64.default.createElement("svg", {
1903
1857
  viewBox: "0 0 24 24"
1904
- }, /* @__PURE__ */ import_react65.default.createElement("path", {
1858
+ }, /* @__PURE__ */ import_react64.default.createElement("path", {
1905
1859
  d: "M14 19h4V5h-4M6 19h4V5H6v14z",
1906
1860
  fill: stroke
1907
1861
  }));
1908
1862
  };
1909
1863
 
1910
1864
  // src/components/PlayerControl/icons/Play.tsx
1911
- var import_react66 = __toESM(require("react"));
1865
+ var import_react65 = __toESM(require("react"));
1912
1866
  var Play = (props) => {
1913
1867
  const stroke = getStroke(props);
1914
- return /* @__PURE__ */ import_react66.default.createElement("svg", {
1868
+ return /* @__PURE__ */ import_react65.default.createElement("svg", {
1915
1869
  viewBox: "0 0 24 24"
1916
- }, /* @__PURE__ */ import_react66.default.createElement("path", {
1870
+ }, /* @__PURE__ */ import_react65.default.createElement("path", {
1917
1871
  d: "M8 5.14v14l11-7l-11-7z",
1918
1872
  fill: stroke
1919
1873
  }));
@@ -1921,9 +1875,9 @@ var Play = (props) => {
1921
1875
 
1922
1876
  // src/components/PlayerControl/icons/index.ts
1923
1877
  var Icons2 = {
1924
- Play: (0, import_react67.memo)(Play),
1925
- Pause: (0, import_react67.memo)(Pause),
1926
- Loading: (0, import_react67.memo)(Loading)
1878
+ Play: (0, import_react66.memo)(Play),
1879
+ Pause: (0, import_react66.memo)(Pause),
1880
+ Loading: (0, import_react66.memo)(Loading)
1927
1881
  };
1928
1882
 
1929
1883
  // src/components/PlayerControl/PlayerControl.tsx
@@ -1932,12 +1886,12 @@ function PlayerControl(_a) {
1932
1886
  var _b = _a, { theme, autoHide = false, player: player_ } = _b, icons = __objRest(_b, ["theme", "autoHide", "player"]);
1933
1887
  theme = useTheme(theme);
1934
1888
  const { t } = useTranslation();
1935
- const [currentTime, setCurrentTime] = (0, import_react69.useState)(0);
1889
+ const [currentTime, setCurrentTime] = (0, import_react68.useState)(0);
1936
1890
  const player = usePlayerControl(player_);
1937
- (0, import_react69.useEffect)(() => {
1891
+ (0, import_react68.useEffect)(() => {
1938
1892
  setCurrentTime(player.currentTime);
1939
1893
  }, [player.currentTime]);
1940
- (0, import_react69.useEffect)(() => {
1894
+ (0, import_react68.useEffect)(() => {
1941
1895
  if (player.currentTime !== currentTime) {
1942
1896
  player.seekToProgressTime(currentTime);
1943
1897
  }
@@ -1945,25 +1899,25 @@ function PlayerControl(_a) {
1945
1899
  const isLoading = player.phase === import_white_web_sdk7.PlayerPhase.WaitingFirstFrame || player.phase === import_white_web_sdk7.PlayerPhase.Buffering;
1946
1900
  const isPlaying = player.phase === import_white_web_sdk7.PlayerPhase.Playing;
1947
1901
  const { activeColor } = themes[theme];
1948
- return /* @__PURE__ */ import_react69.default.createElement("div", {
1902
+ return /* @__PURE__ */ import_react68.default.createElement("div", {
1949
1903
  className: (0, import_clsx11.default)(name5, theme, { "auto-hide": autoHide })
1950
- }, /* @__PURE__ */ import_react69.default.createElement("button", {
1904
+ }, /* @__PURE__ */ import_react68.default.createElement("button", {
1951
1905
  className: (0, import_clsx11.default)(`${name5}-btn`, isLoading ? "loading" : isPlaying ? "pause" : "play", theme),
1952
1906
  disabled: isLoading,
1953
1907
  onClick: player.togglePlay
1954
- }, /* @__PURE__ */ import_react69.default.createElement(Icon, {
1955
- fallback: isLoading ? /* @__PURE__ */ import_react69.default.createElement(Icons2.Loading, {
1908
+ }, /* @__PURE__ */ import_react68.default.createElement(Icon, {
1909
+ fallback: isLoading ? /* @__PURE__ */ import_react68.default.createElement(Icons2.Loading, {
1956
1910
  theme
1957
- }) : isPlaying ? /* @__PURE__ */ import_react69.default.createElement(Icons2.Pause, {
1911
+ }) : isPlaying ? /* @__PURE__ */ import_react68.default.createElement(Icons2.Pause, {
1958
1912
  theme
1959
- }) : /* @__PURE__ */ import_react69.default.createElement(Icons2.Play, {
1913
+ }) : /* @__PURE__ */ import_react68.default.createElement(Icons2.Play, {
1960
1914
  theme
1961
1915
  }),
1962
1916
  src: isLoading ? icons.loadingIcon : isPlaying ? icons.pauseIcon : icons.playIcon,
1963
1917
  alt: isLoading ? "[loading]" : isPlaying ? "[pause]" : "[play]"
1964
- })), /* @__PURE__ */ import_react69.default.createElement("span", {
1918
+ })), /* @__PURE__ */ import_react68.default.createElement("span", {
1965
1919
  className: (0, import_clsx11.default)(`${name5}-slider`, { loading: isLoading }, theme)
1966
- }, /* @__PURE__ */ import_react69.default.createElement(import_rc_slider2.default, {
1920
+ }, /* @__PURE__ */ import_react68.default.createElement(import_rc_slider2.default, {
1967
1921
  disabled: isLoading,
1968
1922
  trackStyle: { background: activeColor },
1969
1923
  handleStyle: { border: `1px solid ${activeColor}` },
@@ -1972,15 +1926,15 @@ function PlayerControl(_a) {
1972
1926
  min: 0,
1973
1927
  max: player.totalTime,
1974
1928
  step: 100
1975
- })), /* @__PURE__ */ import_react69.default.createElement("span", {
1929
+ })), /* @__PURE__ */ import_react68.default.createElement("span", {
1976
1930
  className: (0, import_clsx11.default)(`${name5}-current`, theme)
1977
- }, renderTime(player.currentTime)), /* @__PURE__ */ import_react69.default.createElement("span", {
1931
+ }, renderTime(player.currentTime)), /* @__PURE__ */ import_react68.default.createElement("span", {
1978
1932
  className: (0, import_clsx11.default)(`${name5}-slash`, theme)
1979
- }, "/"), /* @__PURE__ */ import_react69.default.createElement("span", {
1933
+ }, "/"), /* @__PURE__ */ import_react68.default.createElement("span", {
1980
1934
  className: (0, import_clsx11.default)(`${name5}-total`, theme)
1981
- }, renderTime(player.totalTime)), /* @__PURE__ */ import_react69.default.createElement("span", {
1935
+ }, renderTime(player.totalTime)), /* @__PURE__ */ import_react68.default.createElement("span", {
1982
1936
  className: `${name5}-btn-interactive`
1983
- }, /* @__PURE__ */ import_react69.default.createElement(import_react68.default, {
1937
+ }, /* @__PURE__ */ import_react68.default.createElement(import_react67.default, {
1984
1938
  className: "fastboard-tip",
1985
1939
  content: renderSpeeds(player),
1986
1940
  theme,
@@ -1989,11 +1943,11 @@ function PlayerControl(_a) {
1989
1943
  offset: TopOffset,
1990
1944
  arrow: false,
1991
1945
  interactive: true
1992
- }, /* @__PURE__ */ import_react69.default.createElement(Button2, {
1946
+ }, /* @__PURE__ */ import_react68.default.createElement(Button2, {
1993
1947
  content: t("speed"),
1994
1948
  theme,
1995
1949
  disabled: isLoading
1996
- }, /* @__PURE__ */ import_react69.default.createElement("span", {
1950
+ }, /* @__PURE__ */ import_react68.default.createElement("span", {
1997
1951
  className: (0, import_clsx11.default)(`${name5}-speed-text`, theme)
1998
1952
  }, player.speed, "x")))));
1999
1953
  }
@@ -2005,9 +1959,9 @@ function renderTime(ms) {
2005
1959
  }
2006
1960
  var Speeds = [2, 1.5, 1.25, 1, 0.75, 0.5];
2007
1961
  function renderSpeeds({ speed: current, setSpeed }) {
2008
- return /* @__PURE__ */ import_react69.default.createElement("div", {
1962
+ return /* @__PURE__ */ import_react68.default.createElement("div", {
2009
1963
  className: (0, import_clsx11.default)(`${name5}-panel`, "speed")
2010
- }, Speeds.map((speed) => /* @__PURE__ */ import_react69.default.createElement("button", {
1964
+ }, Speeds.map((speed) => /* @__PURE__ */ import_react68.default.createElement("button", {
2011
1965
  className: (0, import_clsx11.default)(`${name5}-btn`, "speed", {
2012
1966
  active: speed === current
2013
1967
  }),
@@ -2017,18 +1971,18 @@ function renderSpeeds({ speed: current, setSpeed }) {
2017
1971
  }
2018
1972
 
2019
1973
  // src/components/Fastboard.tsx
2020
- var import_react70 = __toESM(require("react"));
2021
- var Fastboard = /* @__PURE__ */ (0, import_react70.forwardRef)(function Fastboard2(_a, ref) {
1974
+ var import_react69 = __toESM(require("react"));
1975
+ var Fastboard = /* @__PURE__ */ (0, import_react69.forwardRef)(function Fastboard2(_a, ref) {
2022
1976
  var _b = _a, { app, theme, layout, language } = _b, restProps = __objRest(_b, ["app", "theme", "layout", "language"]);
2023
1977
  if (!app) {
2024
- return /* @__PURE__ */ import_react70.default.createElement("div", __spreadValues({
1978
+ return /* @__PURE__ */ import_react69.default.createElement("div", __spreadValues({
2025
1979
  className: "fastboard-root",
2026
1980
  ref
2027
1981
  }, restProps));
2028
1982
  }
2029
- return /* @__PURE__ */ import_react70.default.createElement(FastboardAppContext.Provider, {
1983
+ return /* @__PURE__ */ import_react69.default.createElement(FastboardAppContext.Provider, {
2030
1984
  value: app
2031
- }, /* @__PURE__ */ import_react70.default.createElement(FastboardInternal, __spreadValues(__spreadValues({
1985
+ }, /* @__PURE__ */ import_react69.default.createElement(FastboardInternal, __spreadValues(__spreadValues({
2032
1986
  forwardedRef: ref
2033
1987
  }, { theme, layout, language }), restProps)));
2034
1988
  });
@@ -2049,15 +2003,15 @@ function FastboardInternal(_a) {
2049
2003
  const app = useFastboardApp();
2050
2004
  const forceUpdate = useForceUpdate();
2051
2005
  const i18n = useAsyncValue(() => createI18n({ language }));
2052
- (0, import_react70.useEffect)(() => {
2006
+ (0, import_react69.useEffect)(() => {
2053
2007
  if (i18n)
2054
2008
  i18n.changeLanguage(language);
2055
2009
  forceUpdate();
2056
2010
  }, [forceUpdate, i18n, language]);
2057
- (0, import_react70.useEffect)(() => {
2011
+ (0, import_react69.useEffect)(() => {
2058
2012
  app.manager.setPrefersColorScheme(theme);
2059
2013
  }, [app, theme]);
2060
- const useWhiteboard = (0, import_react70.useCallback)((container) => {
2014
+ const useWhiteboard = (0, import_react69.useCallback)((container) => {
2061
2015
  if (container && app)
2062
2016
  app.manager.bindContainer(container);
2063
2017
  }, [app]);
@@ -2069,33 +2023,33 @@ function FastboardInternal(_a) {
2069
2023
  ZoomControl: zoom_control = showControls,
2070
2024
  PageControl: page_control = showControls
2071
2025
  } = layout;
2072
- return /* @__PURE__ */ import_react70.default.createElement(ThemeContext.Provider, {
2026
+ return /* @__PURE__ */ import_react69.default.createElement(ThemeContext.Provider, {
2073
2027
  value: theme
2074
- }, /* @__PURE__ */ import_react70.default.createElement(I18nContext.Provider, {
2028
+ }, /* @__PURE__ */ import_react69.default.createElement(I18nContext.Provider, {
2075
2029
  value: i18n
2076
- }, /* @__PURE__ */ import_react70.default.createElement("div", __spreadProps(__spreadValues({}, restProps), {
2030
+ }, /* @__PURE__ */ import_react69.default.createElement("div", __spreadProps(__spreadValues({}, restProps), {
2077
2031
  className: "fastboard-root",
2078
2032
  ref: forwardedRef
2079
- }), /* @__PURE__ */ import_react70.default.createElement("div", {
2033
+ }), /* @__PURE__ */ import_react69.default.createElement("div", {
2080
2034
  className: "fastboard-view",
2081
2035
  ref: useWhiteboard
2082
- }), children ? children : /* @__PURE__ */ import_react70.default.createElement(import_react70.default.Fragment, null, toolbar && /* @__PURE__ */ import_react70.default.createElement("div", {
2036
+ }), children ? children : /* @__PURE__ */ import_react69.default.createElement(import_react69.default.Fragment, null, toolbar && /* @__PURE__ */ import_react69.default.createElement("div", {
2083
2037
  className: "fastboard-left"
2084
- }, /* @__PURE__ */ import_react70.default.createElement(Toolbar, null)), (redo_undo || zoom_control) && /* @__PURE__ */ import_react70.default.createElement("div", {
2038
+ }, /* @__PURE__ */ import_react69.default.createElement(Toolbar, null)), (redo_undo || zoom_control) && /* @__PURE__ */ import_react69.default.createElement("div", {
2085
2039
  className: "fastboard-bottom-left"
2086
- }, redo_undo && /* @__PURE__ */ import_react70.default.createElement(RedoUndo, null), zoom_control && /* @__PURE__ */ import_react70.default.createElement(ZoomControl, null)), page_control && /* @__PURE__ */ import_react70.default.createElement("div", {
2040
+ }, redo_undo && /* @__PURE__ */ import_react69.default.createElement(RedoUndo, null), zoom_control && /* @__PURE__ */ import_react69.default.createElement(ZoomControl, null)), page_control && /* @__PURE__ */ import_react69.default.createElement("div", {
2087
2041
  className: "fastboard-bottom-right"
2088
- }, /* @__PURE__ */ import_react70.default.createElement(PageControl, null))))));
2042
+ }, /* @__PURE__ */ import_react69.default.createElement(PageControl, null))))));
2089
2043
  }
2090
2044
 
2091
2045
  // src/vanilla/index.tsx
2092
- var import_react71 = __toESM(require("react"));
2093
- var import_react_dom2 = __toESM(require("react-dom"));
2046
+ var import_react70 = __toESM(require("react"));
2047
+ var import_react_dom = __toESM(require("react-dom"));
2094
2048
  function mount(app, dom, props) {
2095
- import_react_dom2.default.render(/* @__PURE__ */ import_react71.default.createElement(Fastboard, __spreadValues({
2049
+ import_react_dom.default.render(/* @__PURE__ */ import_react70.default.createElement(Fastboard, __spreadValues({
2096
2050
  app
2097
2051
  }, props)), dom);
2098
- return () => import_react_dom2.default.unmountComponentAtNode(dom);
2052
+ return () => import_react_dom.default.unmountComponentAtNode(dom);
2099
2053
  }
2100
2054
  module.exports = __toCommonJS(src_exports);
2101
2055
  //# sourceMappingURL=index.js.map