@netless/telebox-insider 1.0.0-alpha.33 → 1.0.0-alpha.34

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.
package/dist/style.css CHANGED
@@ -553,7 +553,7 @@
553
553
  .telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-title {
554
554
  display: block;
555
555
  }
556
- .telebox-max-titlebar-maximized {
556
+ .telebox-max-titlebar-active {
557
557
  display: flex;
558
558
  }
559
559
  .telebox-titles {
@@ -1002,7 +1002,7 @@ var TELE_BOX_MANAGER_EVENT = /* @__PURE__ */ ((TELE_BOX_MANAGER_EVENT2) => {
1002
1002
  TELE_BOX_MANAGER_EVENT2["DarkMode"] = "dark_mode";
1003
1003
  return TELE_BOX_MANAGER_EVENT2;
1004
1004
  })(TELE_BOX_MANAGER_EVENT || {});
1005
- var style = /* @__PURE__ */ (() => ".telebox-max-titlebar {\n user-select: none;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n display: none;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n z-index: 5100;\n border-top-left-radius: 6px;\n border-top-right-radius: 6px;\n}\n.telebox-max-titlebar .telebox-title {\n display: none;\n}\n.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-titles {\n display: none;\n}\n.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-title {\n display: block;\n}\n.telebox-max-titlebar-maximized {\n display: flex;\n}\n.telebox-titles {\n height: 100%;\n margin: 0;\n overflow-y: hidden;\n overflow-x: scroll;\n overflow-x: overlay;\n -webkit-overflow-scrolling: touch;\n -ms-overflow-style: -ms-autohiding-scrollbar;\n scrollbar-width: auto;\n}\n.telebox-titles::-webkit-scrollbar {\n height: 4px;\n width: 4px;\n}\n.telebox-titles::-webkit-scrollbar-track {\n background-color: transparent;\n}\n.telebox-titles::-webkit-scrollbar-thumb {\n background-color: rgba(238, 238, 247, 0.8);\n background-color: transparent;\n border-radius: 2px;\n transition: background-color 0.4s;\n}\n.telebox-titles:hover::-webkit-scrollbar-thumb {\n background-color: rgba(238, 238, 247, 0.8);\n}\n.telebox-titles::-webkit-scrollbar-thumb:hover {\n background-color: #eeeef7;\n}\n.telebox-titles::-webkit-scrollbar-thumb:active {\n background-color: #eeeef7;\n}\n.telebox-titles::-webkit-scrollbar-thumb:vertical {\n min-height: 50px;\n}\n.telebox-titles::-webkit-scrollbar-thumb:horizontal {\n min-width: 50px;\n}\n.telebox-titles-content {\n height: 100%;\n display: flex;\n flex-wrap: nowrap;\n align-items: center;\n padding: 0;\n}\n.telebox-titles-tab {\n height: 100%;\n overflow: hidden;\n max-width: 182px;\n min-width: 150px;\n padding: 0 26px 0 16px;\n outline: none;\n font-size: 13px;\n font-family: PingFangSC-Regular, PingFang SC;\n font-weight: 400;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-break: keep-all;\n border: none;\n border-right-width: 1px;\n border-right-style: solid;\n cursor: pointer;\n user-select: none;\n color: #7b88a0;\n color: var(--tele-titlebarTabColor, #7b88a0);\n background-color: transparent;\n background-color: var(--tele-titlebarTabBackground, transparent);\n border-right-color: #e5e5f0;\n border-right-color: var(--tele-titlebarTabDividerColor, #e5e5f0);\n}\n.telebox-titles-tab-focus {\n color: #357bf6;\n color: var(--tele-titlebarTabFocusColor, #357bf6);\n}\n.telebox-readonly .telebox-titles-tab {\n cursor: not-allowed;\n}\n.telebox-color-scheme-dark {\n color-scheme: dark;\n}\n.telebox-color-scheme-dark .telebox-titles-tab {\n color: #e9e9e9;\n color: var(--tele-titlebarTabColor, #e9e9e9);\n background-color: transparent;\n background-color: var(--tele-titlebarTabBackground, transparent);\n border-right-color: #7b88a0;\n border-right-color: var(--tele-titlebarTabDividerColor, #7b88a0);\n}\n.telebox-color-scheme-dark .telebox-titles-tab-focus {\n color: #357bf6;\n color: var(--tele-titlebarTabFocusColor, #357bf6);\n}")();
1005
+ var style = /* @__PURE__ */ (() => ".telebox-max-titlebar {\n user-select: none;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n display: none;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n z-index: 5100;\n border-top-left-radius: 6px;\n border-top-right-radius: 6px;\n}\n.telebox-max-titlebar .telebox-title {\n display: none;\n}\n.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-titles {\n display: none;\n}\n.telebox-max-titlebar.telebox-max-titlebar-single-title .telebox-title {\n display: block;\n}\n.telebox-max-titlebar-active {\n display: flex;\n}\n.telebox-titles {\n height: 100%;\n margin: 0;\n overflow-y: hidden;\n overflow-x: scroll;\n overflow-x: overlay;\n -webkit-overflow-scrolling: touch;\n -ms-overflow-style: -ms-autohiding-scrollbar;\n scrollbar-width: auto;\n}\n.telebox-titles::-webkit-scrollbar {\n height: 4px;\n width: 4px;\n}\n.telebox-titles::-webkit-scrollbar-track {\n background-color: transparent;\n}\n.telebox-titles::-webkit-scrollbar-thumb {\n background-color: rgba(238, 238, 247, 0.8);\n background-color: transparent;\n border-radius: 2px;\n transition: background-color 0.4s;\n}\n.telebox-titles:hover::-webkit-scrollbar-thumb {\n background-color: rgba(238, 238, 247, 0.8);\n}\n.telebox-titles::-webkit-scrollbar-thumb:hover {\n background-color: #eeeef7;\n}\n.telebox-titles::-webkit-scrollbar-thumb:active {\n background-color: #eeeef7;\n}\n.telebox-titles::-webkit-scrollbar-thumb:vertical {\n min-height: 50px;\n}\n.telebox-titles::-webkit-scrollbar-thumb:horizontal {\n min-width: 50px;\n}\n.telebox-titles-content {\n height: 100%;\n display: flex;\n flex-wrap: nowrap;\n align-items: center;\n padding: 0;\n}\n.telebox-titles-tab {\n height: 100%;\n overflow: hidden;\n max-width: 182px;\n min-width: 150px;\n padding: 0 26px 0 16px;\n outline: none;\n font-size: 13px;\n font-family: PingFangSC-Regular, PingFang SC;\n font-weight: 400;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-break: keep-all;\n border: none;\n border-right-width: 1px;\n border-right-style: solid;\n cursor: pointer;\n user-select: none;\n color: #7b88a0;\n color: var(--tele-titlebarTabColor, #7b88a0);\n background-color: transparent;\n background-color: var(--tele-titlebarTabBackground, transparent);\n border-right-color: #e5e5f0;\n border-right-color: var(--tele-titlebarTabDividerColor, #e5e5f0);\n}\n.telebox-titles-tab-focus {\n color: #357bf6;\n color: var(--tele-titlebarTabFocusColor, #357bf6);\n}\n.telebox-readonly .telebox-titles-tab {\n cursor: not-allowed;\n}\n.telebox-color-scheme-dark {\n color-scheme: dark;\n}\n.telebox-color-scheme-dark .telebox-titles-tab {\n color: #e9e9e9;\n color: var(--tele-titlebarTabColor, #e9e9e9);\n background-color: transparent;\n background-color: var(--tele-titlebarTabBackground, transparent);\n border-right-color: #7b88a0;\n border-right-color: var(--tele-titlebarTabDividerColor, #7b88a0);\n}\n.telebox-color-scheme-dark .telebox-titles-tab-focus {\n color: #357bf6;\n color: var(--tele-titlebarTabFocusColor, #357bf6);\n}")();
1006
1006
  class MaxTitleBar extends DefaultTitleBar {
1007
1007
  constructor(config) {
1008
1008
  super(config);
@@ -1039,8 +1039,8 @@ class MaxTitleBar extends DefaultTitleBar {
1039
1039
  const $titleBar = super.render();
1040
1040
  $titleBar.classList.add(this.wrapClassName("max-titlebar"));
1041
1041
  this.sideEffect.addDisposer([
1042
- this.state$.subscribe((state) => {
1043
- $titleBar.classList.toggle(this.wrapClassName("max-titlebar-maximized"), state === TELE_BOX_STATE.Maximized);
1042
+ valueEnhancer.combine([this.boxes$, this.state$]).subscribe(([boxes, state]) => {
1043
+ $titleBar.classList.toggle(this.wrapClassName("max-titlebar-active"), state === TELE_BOX_STATE.Maximized && boxes.length > 0);
1044
1044
  }),
1045
1045
  this.readonly$.subscribe((readonly) => {
1046
1046
  $titleBar.classList.toggle(this.wrapClassName("readonly"), readonly);