@netless/window-manager 0.4.71-beta.0 → 0.4.71

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/index.mjs CHANGED
@@ -2441,6 +2441,10 @@ class AppManager {
2441
2441
  this.safeUpdateAttributes([Fields.Registered, payload.kind], payload);
2442
2442
  });
2443
2443
  }
2444
+ getMemberState() {
2445
+ var _a;
2446
+ return ((_a = this.room) == null ? void 0 : _a.state.memberState) || { strokeColor: [0, 0, 0] };
2447
+ }
2444
2448
  async onRootDirRemoved(needClose = true) {
2445
2449
  this.setMainViewScenePath(INIT_DIR);
2446
2450
  this.createRootDirScenesCallback();
@@ -6791,8 +6795,8 @@ function create_if_block(ctx) {
6791
6795
  let t1;
6792
6796
  let t2;
6793
6797
  let div1_class_value;
6794
- let if_block0 = ctx[16] && create_if_block_2(ctx);
6795
- let if_block1 = ctx[17] && create_if_block_1(ctx);
6798
+ let if_block0 = ctx[17] && create_if_block_2(ctx);
6799
+ let if_block1 = ctx[18] && create_if_block_1(ctx);
6796
6800
  return {
6797
6801
  c() {
6798
6802
  div1 = element("div");
@@ -6813,7 +6817,7 @@ function create_if_block(ctx) {
6813
6817
  set_style(div0, "background-color", ctx[2]);
6814
6818
  set_style(div0, "color", ctx[9]);
6815
6819
  set_style(div0, "opacity", ctx[11]);
6816
- attr(div1, "class", div1_class_value = "netless-window-manager-cursor-name " + ctx[14] + " " + ctx[13]);
6820
+ attr(div1, "class", div1_class_value = "netless-window-manager-cursor-name " + ctx[15] + " " + ctx[14]);
6817
6821
  },
6818
6822
  m(target, anchor) {
6819
6823
  insert(target, div1, anchor);
@@ -6828,7 +6832,7 @@ function create_if_block(ctx) {
6828
6832
  if_block1.m(div0, null);
6829
6833
  },
6830
6834
  p(ctx2, dirty) {
6831
- if (ctx2[16]) {
6835
+ if (ctx2[17]) {
6832
6836
  if (if_block0) {
6833
6837
  if_block0.p(ctx2, dirty);
6834
6838
  } else {
@@ -6842,7 +6846,7 @@ function create_if_block(ctx) {
6842
6846
  }
6843
6847
  if (dirty & 1)
6844
6848
  set_data(t1, ctx2[0]);
6845
- if (ctx2[17]) {
6849
+ if (ctx2[18]) {
6846
6850
  if (if_block1) {
6847
6851
  if_block1.p(ctx2, dirty);
6848
6852
  } else {
@@ -6866,7 +6870,7 @@ function create_if_block(ctx) {
6866
6870
  if (dirty & 2048) {
6867
6871
  set_style(div0, "opacity", ctx2[11]);
6868
6872
  }
6869
- if (dirty & 24576 && div1_class_value !== (div1_class_value = "netless-window-manager-cursor-name " + ctx2[14] + " " + ctx2[13])) {
6873
+ if (dirty & 49152 && div1_class_value !== (div1_class_value = "netless-window-manager-cursor-name " + ctx2[15] + " " + ctx2[14])) {
6870
6874
  attr(div1, "class", div1_class_value);
6871
6875
  }
6872
6876
  },
@@ -6887,7 +6891,7 @@ function create_if_block_2(ctx) {
6887
6891
  c() {
6888
6892
  img = element("img");
6889
6893
  attr(img, "class", "netless-window-manager-cursor-selector-avatar");
6890
- attr(img, "style", ctx[18]());
6894
+ attr(img, "style", ctx[19]());
6891
6895
  if (!src_url_equal(img.src, img_src_value = ctx[7]))
6892
6896
  attr(img, "src", img_src_value);
6893
6897
  attr(img, "alt", "avatar");
@@ -6940,7 +6944,8 @@ function create_fragment(ctx) {
6940
6944
  let img;
6941
6945
  let img_class_value;
6942
6946
  let img_src_value;
6943
- let if_block = !ctx[12] && create_if_block(ctx);
6947
+ let div1_class_value;
6948
+ let if_block = !ctx[13] && create_if_block(ctx);
6944
6949
  return {
6945
6950
  c() {
6946
6951
  div1 = element("div");
@@ -6949,14 +6954,14 @@ function create_fragment(ctx) {
6949
6954
  t2 = space();
6950
6955
  div0 = element("div");
6951
6956
  img = element("img");
6952
- attr(img, "class", img_class_value = "netless-window-manager-cursor-" + ctx[3] + "-image " + ctx[13]);
6957
+ attr(img, "class", img_class_value = "netless-window-manager-cursor-" + ctx[3] + "-image " + ctx[14]);
6953
6958
  if (!src_url_equal(img.src, img_src_value = ctx[6]))
6954
6959
  attr(img, "src", img_src_value);
6955
6960
  attr(img, "alt", ctx[3]);
6956
6961
  attr(div0, "class", "cursor-image-wrapper");
6957
- attr(div1, "class", "netless-window-manager-cursor-mid");
6962
+ attr(div1, "class", div1_class_value = "netless-window-manager-cursor-mid" + (ctx[12] ? " netless-window-manager-cursor-custom" : ""));
6958
6963
  set_style(div1, "transform", "translateX(" + ctx[4] + "px) translateY(" + ctx[5] + "px)");
6959
- set_style(div1, "display", ctx[15]);
6964
+ set_style(div1, "display", ctx[16]);
6960
6965
  },
6961
6966
  m(target, anchor) {
6962
6967
  insert(target, div1, anchor);
@@ -6967,7 +6972,7 @@ function create_fragment(ctx) {
6967
6972
  append(div0, img);
6968
6973
  },
6969
6974
  p(ctx2, [dirty]) {
6970
- if (!ctx2[12]) {
6975
+ if (!ctx2[13]) {
6971
6976
  if (if_block) {
6972
6977
  if_block.p(ctx2, dirty);
6973
6978
  } else {
@@ -6979,7 +6984,7 @@ function create_fragment(ctx) {
6979
6984
  if_block.d(1);
6980
6985
  if_block = null;
6981
6986
  }
6982
- if (dirty & 8200 && img_class_value !== (img_class_value = "netless-window-manager-cursor-" + ctx2[3] + "-image " + ctx2[13])) {
6987
+ if (dirty & 16392 && img_class_value !== (img_class_value = "netless-window-manager-cursor-" + ctx2[3] + "-image " + ctx2[14])) {
6983
6988
  attr(img, "class", img_class_value);
6984
6989
  }
6985
6990
  if (dirty & 64 && !src_url_equal(img.src, img_src_value = ctx2[6])) {
@@ -6988,11 +6993,14 @@ function create_fragment(ctx) {
6988
6993
  if (dirty & 8) {
6989
6994
  attr(img, "alt", ctx2[3]);
6990
6995
  }
6996
+ if (dirty & 4096 && div1_class_value !== (div1_class_value = "netless-window-manager-cursor-mid" + (ctx2[12] ? " netless-window-manager-cursor-custom" : ""))) {
6997
+ attr(div1, "class", div1_class_value);
6998
+ }
6991
6999
  if (dirty & 48) {
6992
7000
  set_style(div1, "transform", "translateX(" + ctx2[4] + "px) translateY(" + ctx2[5] + "px)");
6993
7001
  }
6994
- if (dirty & 32768) {
6995
- set_style(div1, "display", ctx2[15]);
7002
+ if (dirty & 65536) {
7003
+ set_style(div1, "display", ctx2[16]);
6996
7004
  }
6997
7005
  },
6998
7006
  i: noop,
@@ -7028,6 +7036,7 @@ function instance($$self, $$props, $$invalidate) {
7028
7036
  let { cursorTagBackgroundColor } = $$props;
7029
7037
  let { opacity } = $$props;
7030
7038
  let { pencilEraserSize } = $$props;
7039
+ let { custom } = $$props;
7031
7040
  const computedAvatarStyle = () => {
7032
7041
  return Object.entries({
7033
7042
  width: (hasName ? 19 : 28) + "px",
@@ -7053,7 +7062,7 @@ function instance($$self, $$props, $$invalidate) {
7053
7062
  if ("src" in $$props2)
7054
7063
  $$invalidate(6, src = $$props2.src);
7055
7064
  if ("visible" in $$props2)
7056
- $$invalidate(19, visible = $$props2.visible);
7065
+ $$invalidate(20, visible = $$props2.visible);
7057
7066
  if ("avatar" in $$props2)
7058
7067
  $$invalidate(7, avatar = $$props2.avatar);
7059
7068
  if ("theme" in $$props2)
@@ -7065,32 +7074,34 @@ function instance($$self, $$props, $$invalidate) {
7065
7074
  if ("opacity" in $$props2)
7066
7075
  $$invalidate(11, opacity = $$props2.opacity);
7067
7076
  if ("pencilEraserSize" in $$props2)
7068
- $$invalidate(20, pencilEraserSize = $$props2.pencilEraserSize);
7077
+ $$invalidate(21, pencilEraserSize = $$props2.pencilEraserSize);
7078
+ if ("custom" in $$props2)
7079
+ $$invalidate(12, custom = $$props2.custom);
7069
7080
  };
7070
7081
  $$self.$$.update = () => {
7071
7082
  if ($$self.$$.dirty & 1) {
7072
7083
  hasName = !isEmpty(cursorName);
7073
7084
  }
7074
7085
  if ($$self.$$.dirty & 2) {
7075
- $$invalidate(17, hasTagName = !isEmpty(tagName));
7086
+ $$invalidate(18, hasTagName = !isEmpty(tagName));
7076
7087
  }
7077
7088
  if ($$self.$$.dirty & 128) {
7078
- $$invalidate(16, hasAvatar = !isEmpty(avatar));
7089
+ $$invalidate(17, hasAvatar = !isEmpty(avatar));
7079
7090
  }
7080
- if ($$self.$$.dirty & 524288) {
7081
- $$invalidate(15, display = visible ? "initial" : "none");
7091
+ if ($$self.$$.dirty & 1048576) {
7092
+ $$invalidate(16, display = visible ? "initial" : "none");
7082
7093
  }
7083
7094
  if ($$self.$$.dirty & 8) {
7084
- $$invalidate(12, isLaserPointer = appliance === ApplianceNames.laserPointer);
7095
+ $$invalidate(13, isLaserPointer = appliance === ApplianceNames.laserPointer);
7085
7096
  }
7086
- if ($$self.$$.dirty & 4104) {
7087
- $$invalidate(21, isLaserPointerPencilEraser = isLaserPointer || appliance === ApplianceNames.pencilEraser);
7097
+ if ($$self.$$.dirty & 8200) {
7098
+ $$invalidate(22, isLaserPointerPencilEraser = isLaserPointer || appliance === ApplianceNames.pencilEraser);
7088
7099
  }
7089
- if ($$self.$$.dirty & 2097152) {
7090
- $$invalidate(14, offset = isLaserPointerPencilEraser ? "netless-window-manager-laserPointer-pencilEraser-offset" : "");
7100
+ if ($$self.$$.dirty & 4194304) {
7101
+ $$invalidate(15, offset = isLaserPointerPencilEraser ? "netless-window-manager-laserPointer-pencilEraser-offset" : "");
7091
7102
  }
7092
- if ($$self.$$.dirty & 1048576) {
7093
- $$invalidate(13, pencilEraserSize3ImageOffset = pencilEraserSize === 3 ? "netless-window-manager-pencilEraser-3-offset" : "");
7103
+ if ($$self.$$.dirty & 2097152) {
7104
+ $$invalidate(14, pencilEraserSize3ImageOffset = pencilEraserSize === 3 ? "netless-window-manager-pencilEraser-3-offset" : "");
7094
7105
  }
7095
7106
  };
7096
7107
  return [
@@ -7106,6 +7117,7 @@ function instance($$self, $$props, $$invalidate) {
7106
7117
  color2,
7107
7118
  cursorTagBackgroundColor,
7108
7119
  opacity,
7120
+ custom,
7109
7121
  isLaserPointer,
7110
7122
  pencilEraserSize3ImageOffset,
7111
7123
  offset,
@@ -7129,22 +7141,78 @@ class Cursor$1 extends SvelteComponent {
7129
7141
  x: 4,
7130
7142
  y: 5,
7131
7143
  src: 6,
7132
- visible: 19,
7144
+ visible: 20,
7133
7145
  avatar: 7,
7134
7146
  theme: 8,
7135
7147
  color: 9,
7136
7148
  cursorTagBackgroundColor: 10,
7137
7149
  opacity: 11,
7138
- pencilEraserSize: 20
7150
+ pencilEraserSize: 21,
7151
+ custom: 12
7139
7152
  });
7140
7153
  }
7141
7154
  }
7155
+ const staticCircle = `data:image/svg+xml,%3Csvg width='24' height='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Ccircle cx='12' cy='12' r='2.5' stroke='%23000' stroke-linejoin='square'/%3E%3Ccircle cx='12' cy='12' r='3.5' stroke='%23FFF'/%3E%3C/g%3E%3C/svg%3E`;
7156
+ function circleUrl(color2) {
7157
+ return `data:image/svg+xml,%3Csvg width='24' height='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Ccircle cx='12' cy='12' r='2.5' stroke='%23${color2}' stroke-linejoin='square'/%3E%3Ccircle cx='12' cy='12' r='3.5' stroke='%23${color2}'/%3E%3C/g%3E%3C/svg%3E`;
7158
+ }
7159
+ function crossUrl(color2) {
7160
+ return `data:image/svg+xml,%3Csvg width='24' height='24' xmlns='http://www.w3.org/2000/svg' fill='none'%3E%3Cpath d='M5 12H19' stroke='%23${color2}' stroke-linejoin='round'/%3E%3Cpath d='M12 5V19' stroke='%23${color2}' stroke-linejoin='round'/%3E%3C/svg%3E`;
7161
+ }
7162
+ function cssCursor(url) {
7163
+ return `url("${url}") 12 12, auto`;
7164
+ }
7165
+ function makeStyleContent(config) {
7166
+ let result = "";
7167
+ for (const cursor in config) {
7168
+ result += `.netless-whiteboard.${cursor} {cursor: ${config[cursor]}}
7169
+ `;
7170
+ }
7171
+ return result;
7172
+ }
7173
+ const $style = document.createElement("style");
7174
+ function enableLocal(memberState) {
7175
+ const [r2, g, b] = memberState.strokeColor;
7176
+ const hex2 = ((1 << 24) + (r2 << 16) + (g << 8) + b).toString(16).slice(1);
7177
+ $style.textContent = makeStyleContent({
7178
+ "cursor-pencil": cssCursor(circleUrl(hex2)),
7179
+ "cursor-eraser": cssCursor(staticCircle),
7180
+ "cursor-rectangle": cssCursor(crossUrl(hex2)),
7181
+ "cursor-ellipse": cssCursor(crossUrl(hex2)),
7182
+ "cursor-straight": cssCursor(crossUrl(hex2)),
7183
+ "cursor-arrow": cssCursor(crossUrl(hex2)),
7184
+ "cursor-shape": cssCursor(crossUrl(hex2))
7185
+ });
7186
+ document.head.appendChild($style);
7187
+ return () => {
7188
+ if ($style.parentNode == null)
7189
+ return;
7190
+ document.head.removeChild($style);
7191
+ };
7192
+ }
7193
+ const shapeAppliances = /* @__PURE__ */ new Set([
7194
+ ApplianceNames.rectangle,
7195
+ ApplianceNames.ellipse,
7196
+ ApplianceNames.straight,
7197
+ ApplianceNames.arrow,
7198
+ ApplianceNames.shape
7199
+ ]);
7200
+ function remoteIcon(applianceName, hex2) {
7201
+ if (applianceName === ApplianceNames.pencil) {
7202
+ return circleUrl(hex2);
7203
+ } else if (applianceName === ApplianceNames.eraser) {
7204
+ return staticCircle;
7205
+ } else if (shapeAppliances.has(applianceName)) {
7206
+ return crossUrl(hex2);
7207
+ }
7208
+ }
7142
7209
  class Cursor {
7143
7210
  constructor(manager, memberId, cursorManager, wrapper) {
7144
7211
  this.manager = manager;
7145
7212
  this.memberId = memberId;
7146
7213
  this.cursorManager = cursorManager;
7147
7214
  this.wrapper = wrapper;
7215
+ this.style = "default";
7148
7216
  this.move = (position) => {
7149
7217
  var _a;
7150
7218
  if (position.type === "main") {
@@ -7163,12 +7231,22 @@ class Cursor {
7163
7231
  }
7164
7232
  }
7165
7233
  };
7234
+ this.setStyle = (style2) => {
7235
+ this.style = style2;
7236
+ if (this.component) {
7237
+ this.component.$set({
7238
+ src: this.getIcon(),
7239
+ custom: this.isCustomIcon()
7240
+ });
7241
+ }
7242
+ };
7166
7243
  this.leave = () => {
7167
7244
  this.hide();
7168
7245
  };
7169
7246
  this.updateMember();
7170
7247
  this.createCursor();
7171
7248
  this.autoHidden();
7249
+ this.setStyle(cursorManager.style);
7172
7250
  }
7173
7251
  moveCursor(cursor, rect, view) {
7174
7252
  var _a, _b;
@@ -7177,6 +7255,10 @@ class Cursor {
7177
7255
  if (point) {
7178
7256
  let translateX = point.x - 2;
7179
7257
  let translateY = point.y - 18;
7258
+ if (this.isCustomIcon()) {
7259
+ translateX -= 11;
7260
+ translateY += 4;
7261
+ }
7180
7262
  if (type === "app") {
7181
7263
  const wrapperRect = this.cursorManager.wrapperRect;
7182
7264
  if (wrapperRect) {
@@ -7200,6 +7282,11 @@ class Cursor {
7200
7282
  const rgb = (_b = (_a = this.member) == null ? void 0 : _a.memberState) == null ? void 0 : _b.strokeColor.join(",");
7201
7283
  return `rgb(${rgb})`;
7202
7284
  }
7285
+ get memberColorHex() {
7286
+ var _a, _b;
7287
+ const [r2, g, b] = ((_b = (_a = this.member) == null ? void 0 : _a.memberState) == null ? void 0 : _b.strokeColor) || [236, 52, 85];
7288
+ return ((1 << 24) + (r2 << 16) + (g << 8) + b).toString(16).slice(1);
7289
+ }
7203
7290
  get payload() {
7204
7291
  var _a;
7205
7292
  return (_a = this.member) == null ? void 0 : _a.payload;
@@ -7263,6 +7350,7 @@ class Cursor {
7263
7350
  appliance: this.memberApplianceName,
7264
7351
  avatar: this.memberAvatar,
7265
7352
  src: this.getIcon(),
7353
+ custom: this.isCustomIcon(),
7266
7354
  visible: false,
7267
7355
  backgroundColor: this.memberColor,
7268
7356
  cursorName: this.memberCursorName,
@@ -7276,17 +7364,44 @@ class Cursor {
7276
7364
  }
7277
7365
  getIcon() {
7278
7366
  var _a;
7279
- if (this.member) {
7280
- const icons = this.cursorManager.applianceIcons;
7281
- let applianceSrc = icons[ApplianceNames.shape];
7282
- if (this.memberApplianceName === ApplianceNames.pencilEraser) {
7283
- const size2 = ((_a = this.member) == null ? void 0 : _a.memberState.pencilEraserSize) || 1;
7284
- applianceSrc = icons[`${this.memberApplianceName}${size2}`];
7285
- } else {
7286
- applianceSrc = icons[this.memberApplianceName || ApplianceNames.shape];
7287
- }
7288
- return applianceSrc || icons[ApplianceNames.shape];
7367
+ if (!this.member)
7368
+ return;
7369
+ const { memberApplianceName, memberColorHex } = this;
7370
+ const { userApplianceIcons, applianceIcons } = this.cursorManager;
7371
+ let iconsKey = this.memberApplianceName;
7372
+ if (iconsKey === ApplianceNames.pencilEraser) {
7373
+ iconsKey = `${iconsKey}${((_a = this.member) == null ? void 0 : _a.memberState.pencilEraserSize) || 1}`;
7374
+ }
7375
+ const userApplianceSrc = iconsKey && userApplianceIcons[iconsKey];
7376
+ if (userApplianceSrc)
7377
+ return userApplianceSrc;
7378
+ if (this.style === "custom" && memberApplianceName) {
7379
+ const customApplianceSrc = remoteIcon(memberApplianceName, memberColorHex);
7380
+ if (customApplianceSrc)
7381
+ return customApplianceSrc;
7382
+ }
7383
+ const applianceSrc = applianceIcons[iconsKey || ApplianceNames.shape];
7384
+ return applianceSrc || applianceIcons[ApplianceNames.shape];
7385
+ }
7386
+ isCustomIcon() {
7387
+ var _a;
7388
+ if (!this.member)
7389
+ return false;
7390
+ const { memberApplianceName, memberColorHex } = this;
7391
+ const { userApplianceIcons } = this.cursorManager;
7392
+ let iconsKey = this.memberApplianceName;
7393
+ if (iconsKey === ApplianceNames.pencilEraser) {
7394
+ iconsKey = `${iconsKey}${((_a = this.member) == null ? void 0 : _a.memberState.pencilEraserSize) || 1}`;
7395
+ }
7396
+ const userApplianceSrc = iconsKey && userApplianceIcons[iconsKey];
7397
+ if (userApplianceSrc)
7398
+ return false;
7399
+ if (this.style === "custom" && memberApplianceName) {
7400
+ const customApplianceSrc = remoteIcon(memberApplianceName, memberColorHex);
7401
+ if (customApplianceSrc)
7402
+ return true;
7289
7403
  }
7404
+ return false;
7290
7405
  }
7291
7406
  updateMember() {
7292
7407
  this.member = findMemberByUid(this.manager.room, this.memberId);
@@ -7333,16 +7448,18 @@ const ApplianceMap = {
7333
7448
  ["pencilEraser2"]: pencilEraser2,
7334
7449
  ["pencilEraser3"]: pencilEraser3
7335
7450
  };
7451
+ const LocalCursorSideEffectId = "local-cursor";
7336
7452
  class CursorManager {
7337
- constructor(manager, enableCursor, applianceIcons) {
7453
+ constructor(manager, enableCursor, cursorOptions, applianceIcons) {
7338
7454
  var _a;
7339
7455
  this.manager = manager;
7340
7456
  this.enableCursor = enableCursor;
7341
7457
  this.cursorInstances = /* @__PURE__ */ new Map();
7458
+ this.userApplianceIcons = {};
7342
7459
  this.sideEffectManager = new SideEffectManager$1();
7343
7460
  this.store = this.manager.store;
7344
- this.applianceIcons = ApplianceMap;
7345
- this.onceCount = true;
7461
+ this.leaveFlag = true;
7462
+ this._style = "default";
7346
7463
  this.onCursorMove = (payload) => {
7347
7464
  const cursorInstance = this.initCursorInstance(payload.uid);
7348
7465
  if (payload.state === CursorState.Leave) {
@@ -7376,17 +7493,17 @@ class CursorManager {
7376
7493
  if (now2 - this.mouseMoveTimer > 48) {
7377
7494
  this.mouseMoveTimer = now2;
7378
7495
  if (WindowManager.supportTeachingAidsPlugin && isRoom(WindowManager.displayer) && WindowManager.displayer.disableDeviceInputs) {
7379
- if (this.onceCount) {
7496
+ if (this.leaveFlag) {
7380
7497
  this.manager.dispatchInternalEvent(Events.CursorMove, {
7381
7498
  uid: this.manager.uid,
7382
7499
  state: CursorState.Leave
7383
7500
  });
7384
- this.onceCount = false;
7501
+ this.leaveFlag = false;
7385
7502
  }
7386
7503
  return;
7387
7504
  }
7388
7505
  this.mouseMoveListener_(event, isTouch);
7389
- this.onceCount = true;
7506
+ this.leaveFlag = true;
7390
7507
  }
7391
7508
  };
7392
7509
  this.mouseLeaveListener = () => {
@@ -7430,9 +7547,43 @@ class CursorManager {
7430
7547
  this.sideEffectManager.add(() => {
7431
7548
  return internalEmitter.on("playgroundSizeChange", () => this.updateContainerRect());
7432
7549
  });
7550
+ const room = this.manager.room;
7551
+ if (room) {
7552
+ this.sideEffectManager.add(() => {
7553
+ const update2 = (state) => {
7554
+ if (this.style === "custom" && state.memberState)
7555
+ this.enableCustomCursor();
7556
+ };
7557
+ room.callbacks.on("onRoomStateChanged", update2);
7558
+ return () => room.callbacks.off("onRoomStateChanged", update2);
7559
+ });
7560
+ }
7433
7561
  if (applianceIcons) {
7434
- this.applianceIcons = __spreadValues(__spreadValues({}, ApplianceMap), applianceIcons);
7562
+ this.userApplianceIcons = applianceIcons;
7435
7563
  }
7564
+ this.style = (cursorOptions == null ? void 0 : cursorOptions.style) || "default";
7565
+ }
7566
+ get applianceIcons() {
7567
+ return __spreadValues(__spreadValues({}, ApplianceMap), this.userApplianceIcons);
7568
+ }
7569
+ get style() {
7570
+ return this._style;
7571
+ }
7572
+ set style(value) {
7573
+ if (this._style !== value) {
7574
+ this._style = value;
7575
+ this.cursorInstances.forEach((cursor) => {
7576
+ cursor.setStyle(value);
7577
+ });
7578
+ if (value === "custom") {
7579
+ this.enableCustomCursor();
7580
+ } else {
7581
+ this.sideEffectManager.flush(LocalCursorSideEffectId);
7582
+ }
7583
+ }
7584
+ }
7585
+ enableCustomCursor() {
7586
+ this.sideEffectManager.add(() => enableLocal(this.manager.getMemberState()), LocalCursorSideEffectId);
7436
7587
  }
7437
7588
  canMoveCursor(member) {
7438
7589
  const isLaserPointer = (member == null ? void 0 : member.memberState.currentApplianceName) === ApplianceNames.laserPointer;
@@ -18275,7 +18426,7 @@ const reconnectRefresher = new ReconnectRefresher({ emitter: internalEmitter });
18275
18426
  const _WindowManager = class extends InvisiblePlugin {
18276
18427
  constructor(context) {
18277
18428
  super(context);
18278
- this.version = "0.4.71-beta.0";
18429
+ this.version = "0.4.71";
18279
18430
  this.dependencies = { "dependencies": { "@juggle/resize-observer": "^3.3.1", "@netless/telebox-insider": "0.2.28", "emittery": "^0.9.2", "lodash": "^4.17.21", "p-retry": "^4.6.1", "side-effect-manager": "^0.1.5", "uuid": "^7.0.3", "video.js": ">=7" }, "peerDependencies": { "jspdf": "2.5.1", "white-web-sdk": "^2.16.0" }, "devDependencies": { "@netless/app-docs-viewer": "^0.2.17", "@netless/app-media-player": "0.1.0-beta.6", "@rollup/plugin-commonjs": "^20.0.0", "@rollup/plugin-node-resolve": "^13.0.4", "@rollup/plugin-url": "^6.1.0", "@sveltejs/vite-plugin-svelte": "^1.0.0-next.22", "@tsconfig/svelte": "^2.0.1", "@types/debug": "^4.1.7", "@types/lodash": "^4.14.182", "@types/lodash-es": "^4.17.4", "@types/uuid": "^8.3.1", "@typescript-eslint/eslint-plugin": "^4.30.0", "@typescript-eslint/parser": "^4.30.0", "@vitest/ui": "^0.14.1", "cypress": "^8.7.0", "dotenv": "^10.0.0", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-svelte3": "^3.2.0", "jsdom": "^19.0.0", "jspdf": "^2.5.1", "less": "^4.1.1", "prettier": "^2.3.2", "prettier-plugin-svelte": "^2.4.0", "rollup-plugin-analyzer": "^4.0.0", "rollup-plugin-styles": "^3.14.1", "svelte": "^3.42.4", "typescript": "^4.5.5", "vite": "^2.5.3", "vitest": "^0.14.1", "white-web-sdk": "2.16.43" } };
18280
18431
  this.emitter = callbacks$1;
18281
18432
  this.viewMode = ViewMode.Broadcaster;
@@ -18336,7 +18487,7 @@ const _WindowManager = class extends InvisiblePlugin {
18336
18487
  manager.appManager = new AppManager(manager);
18337
18488
  manager.appManager.polling = params.polling || false;
18338
18489
  manager._pageState = new PageStateImpl(manager.appManager);
18339
- manager.cursorManager = new CursorManager(manager.appManager, Boolean(cursor), params.applianceIcons);
18490
+ manager.cursorManager = new CursorManager(manager.appManager, Boolean(cursor), params.cursorOptions, params.applianceIcons);
18340
18491
  if (containerSizeRatio) {
18341
18492
  manager.containerSizeRatio = containerSizeRatio;
18342
18493
  }
@@ -18376,11 +18527,7 @@ const _WindowManager = class extends InvisiblePlugin {
18376
18527
  return manager;
18377
18528
  }
18378
18529
  static initContainer(manager, container, params) {
18379
- const {
18380
- chessboard,
18381
- overwriteStyles,
18382
- fullscreen
18383
- } = params;
18530
+ const { chessboard, overwriteStyles, fullscreen } = params;
18384
18531
  if (!_WindowManager.container) {
18385
18532
  _WindowManager.container = container;
18386
18533
  }
@@ -18758,6 +18905,16 @@ const _WindowManager = class extends InvisiblePlugin {
18758
18905
  this.appManager.polling = b;
18759
18906
  }
18760
18907
  }
18908
+ get cursorStyle() {
18909
+ var _a;
18910
+ return ((_a = this.cursorManager) == null ? void 0 : _a.style) || "default";
18911
+ }
18912
+ set cursorStyle(value) {
18913
+ if (!this.cursorManager) {
18914
+ throw new Error("[WindowManager]: cursor is not enabled, please set { cursor: true }.");
18915
+ }
18916
+ this.cursorManager.style = value;
18917
+ }
18761
18918
  get mainViewSceneIndex() {
18762
18919
  var _a;
18763
18920
  return ((_a = this._pageState) == null ? void 0 : _a.index) || 0;