@cloudflare/realtimekit-ui 1.0.2-staging.3 → 1.0.3-staging.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 (108) hide show
  1. package/dist/browser.js +1 -0
  2. package/dist/cjs/{floating-ui.dom.esm-c3c35b98.js → floating-ui.dom.esm-90c5a220.js} +54 -30
  3. package/dist/cjs/rtk-avatar_54.cjs.entry.js +1 -1
  4. package/dist/cjs/rtk-livestream-indicator_3.cjs.entry.js +30892 -23958
  5. package/dist/cjs/rtk-participant_2.cjs.entry.js +1 -1
  6. package/dist/cjs/rtk-setup-screen.cjs.entry.js +4 -4
  7. package/dist/collection/components/rtk-audio-tile/rtk-audio-tile.js +1 -1
  8. package/dist/collection/components/rtk-audio-visualizer/rtk-audio-visualizer.js +1 -1
  9. package/dist/collection/components/rtk-avatar/rtk-avatar.js +1 -1
  10. package/dist/collection/components/rtk-breakout-room-toggle/rtk-breakout-rooms-toggle.js +1 -1
  11. package/dist/collection/components/rtk-breakout-rooms-manager/rtk-breakout-rooms-manager.js +1 -1
  12. package/dist/collection/components/rtk-channel-selector-view/rtk-channel-selector-view.js +2 -2
  13. package/dist/collection/components/rtk-file-picker-button/rtk-file-picker-button.js +1 -1
  14. package/dist/collection/components/rtk-name-tag/rtk-name-tag.js +1 -1
  15. package/dist/collection/components/rtk-network-indicator/rtk-network-indicator.js +1 -1
  16. package/dist/collection/components/rtk-participant/rtk-participant.js +1 -1
  17. package/dist/collection/components/rtk-participant-setup/rtk-participant-setup.js +1 -1
  18. package/dist/collection/components/rtk-participant-tile/rtk-participant-tile.js +2 -2
  19. package/dist/collection/components/rtk-plugin-main/rtk-plugin-main.js +1 -1
  20. package/dist/collection/components/rtk-poll/rtk-poll.js +1 -1
  21. package/dist/collection/components/rtk-screenshare-view/rtk-screenshare-view.js +1 -1
  22. package/dist/collection/components/rtk-setup-screen/rtk-setup-screen.js +4 -4
  23. package/dist/components/{p-5e5c9b53.js → p-01b76741.js} +1 -1
  24. package/dist/components/{p-94e8d526.js → p-11048ea8.js} +1 -1
  25. package/dist/components/{p-778197ec.js → p-11b00854.js} +1 -1
  26. package/dist/components/{p-70053efe.js → p-1a6ad05c.js} +30892 -23958
  27. package/dist/components/{p-828a11f4.js → p-1c22a3a0.js} +3 -3
  28. package/dist/components/{p-519e8701.js → p-1f0c5462.js} +1 -1
  29. package/dist/components/{p-98d49c8e.js → p-22f2908e.js} +1 -1
  30. package/dist/components/{p-1174d3f4.js → p-2c41819d.js} +2 -2
  31. package/dist/components/{p-ff13d28d.js → p-2e9c3dd2.js} +1 -1
  32. package/dist/components/{p-abdd2a8a.js → p-4b89a5d6.js} +1 -1
  33. package/dist/components/{p-e2006e05.js → p-5d9eec22.js} +16 -16
  34. package/dist/components/{p-2cc196a8.js → p-6d3c8a73.js} +1 -1
  35. package/dist/components/{p-31964573.js → p-94cc1b33.js} +54 -30
  36. package/dist/components/{p-1633eae1.js → p-97ce630d.js} +2 -2
  37. package/dist/components/{p-1d7f3c99.js → p-98cc289f.js} +3 -3
  38. package/dist/components/{p-83a87193.js → p-9b675f4f.js} +1 -1
  39. package/dist/components/{p-8750e2de.js → p-a0000935.js} +2 -2
  40. package/dist/components/{p-9140d5c1.js → p-b29a58cd.js} +1 -1
  41. package/dist/components/{p-de2175ca.js → p-b2b2e917.js} +1 -1
  42. package/dist/components/{p-be584d57.js → p-be45dbd1.js} +2 -2
  43. package/dist/components/{p-af7aea98.js → p-c1f57f6b.js} +1 -1
  44. package/dist/components/{p-c173a513.js → p-cc6ff913.js} +1 -1
  45. package/dist/components/{p-c226934a.js → p-d8be719c.js} +4 -4
  46. package/dist/components/{p-25738f7b.js → p-db6f9f73.js} +1 -1
  47. package/dist/components/{p-fb31f34b.js → p-e83a6293.js} +1 -1
  48. package/dist/components/{p-a5d2ac22.js → p-eba76ab4.js} +4 -4
  49. package/dist/components/{p-1f6e5501.js → p-ed0df5b1.js} +1 -1
  50. package/dist/components/rtk-breakout-room-manager.js +1 -1
  51. package/dist/components/rtk-breakout-room-participants.js +1 -1
  52. package/dist/components/rtk-breakout-rooms-manager.js +1 -1
  53. package/dist/components/rtk-camera-toggle.js +1 -1
  54. package/dist/components/rtk-channel-header.js +1 -1
  55. package/dist/components/rtk-chat-composer-ui.js +1 -1
  56. package/dist/components/rtk-chat-composer-view.js +1 -1
  57. package/dist/components/rtk-chat-message.js +1 -1
  58. package/dist/components/rtk-chat-messages-ui-paginated.js +1 -1
  59. package/dist/components/rtk-chat-messages-ui.js +1 -1
  60. package/dist/components/rtk-chat-search-results.js +1 -1
  61. package/dist/components/rtk-chat.js +1 -1
  62. package/dist/components/rtk-dialog-manager.js +1 -1
  63. package/dist/components/rtk-draft-attachment-view.js +1 -1
  64. package/dist/components/rtk-emoji-picker-button.js +1 -1
  65. package/dist/components/rtk-file-picker-button.js +1 -1
  66. package/dist/components/rtk-grid-pagination.js +1 -1
  67. package/dist/components/rtk-grid.js +1 -1
  68. package/dist/components/rtk-livestream-player.js +1 -1
  69. package/dist/components/rtk-meeting-title.js +1 -1
  70. package/dist/components/rtk-meeting.js +17 -17
  71. package/dist/components/rtk-menu.js +1 -1
  72. package/dist/components/rtk-message-view.js +1 -1
  73. package/dist/components/rtk-mic-toggle.js +1 -1
  74. package/dist/components/rtk-mixed-grid.js +3 -3
  75. package/dist/components/rtk-mute-all-button.js +1 -1
  76. package/dist/components/rtk-participant.js +1 -1
  77. package/dist/components/rtk-participants-stage-queue.js +1 -1
  78. package/dist/components/rtk-participants-viewer-list.js +1 -1
  79. package/dist/components/rtk-participants-waiting-list.js +1 -1
  80. package/dist/components/rtk-participants.js +5 -5
  81. package/dist/components/rtk-poll.js +1 -1
  82. package/dist/components/rtk-polls.js +1 -1
  83. package/dist/components/rtk-screen-share-toggle.js +1 -1
  84. package/dist/components/rtk-screenshare-view.js +1 -1
  85. package/dist/components/rtk-setup-screen.js +4 -4
  86. package/dist/components/rtk-sidebar.js +3 -3
  87. package/dist/components/rtk-spotlight-indicator.js +1 -1
  88. package/dist/components/rtk-stage-toggle.js +1 -1
  89. package/dist/components/rtk-tab-bar.js +1 -1
  90. package/dist/components/rtk-tooltip.js +1 -1
  91. package/dist/docs/docs-components.json +118 -118
  92. package/dist/docs/docs-vscode.json +12 -12
  93. package/dist/esm/{floating-ui.dom.esm-cf1488a2.js → floating-ui.dom.esm-a2dc8eef.js} +54 -30
  94. package/dist/esm/loader.js +63224 -4
  95. package/dist/esm/rtk-avatar_54.entry.js +1 -1
  96. package/dist/esm/rtk-livestream-indicator_3.entry.js +30892 -23958
  97. package/dist/esm/rtk-participant_2.entry.js +1 -1
  98. package/dist/esm/rtk-setup-screen.entry.js +4 -4
  99. package/dist/realtimekit-ui/{p-c39a8005.entry.js → p-14350b0d.entry.js} +1 -1
  100. package/dist/realtimekit-ui/p-1abb4841.entry.js +1 -0
  101. package/dist/realtimekit-ui/{p-2db001cf.entry.js → p-48610132.entry.js} +1 -1
  102. package/dist/realtimekit-ui/p-94cc1b33.js +1 -0
  103. package/dist/realtimekit-ui/p-f4105345.entry.js +1 -0
  104. package/dist/realtimekit-ui/realtimekit-ui.esm.js +1 -1
  105. package/package.json +1 -1
  106. package/dist/realtimekit-ui/p-0b8b849b.entry.js +0 -1
  107. package/dist/realtimekit-ui/p-31964573.js +0 -1
  108. package/dist/realtimekit-ui/p-b60b229e.entry.js +0 -1
@@ -1527,6 +1527,15 @@
1527
1527
  {
1528
1528
  "name": "chat"
1529
1529
  },
1530
+ {
1531
+ "name": "pause"
1532
+ },
1533
+ {
1534
+ "name": "info"
1535
+ },
1536
+ {
1537
+ "name": "debug"
1538
+ },
1530
1539
  {
1531
1540
  "name": "add"
1532
1541
  },
@@ -1536,6 +1545,9 @@
1536
1545
  {
1537
1546
  "name": "warning"
1538
1547
  },
1548
+ {
1549
+ "name": "play"
1550
+ },
1539
1551
  {
1540
1552
  "name": "people"
1541
1553
  },
@@ -1680,12 +1692,6 @@
1680
1692
  {
1681
1693
  "name": "stop_livestream"
1682
1694
  },
1683
- {
1684
- "name": "debug"
1685
- },
1686
- {
1687
- "name": "info"
1688
- },
1689
1695
  {
1690
1696
  "name": "devices"
1691
1697
  },
@@ -1710,12 +1716,6 @@
1710
1716
  {
1711
1717
  "name": "captionsOff"
1712
1718
  },
1713
- {
1714
- "name": "play"
1715
- },
1716
- {
1717
- "name": "pause"
1718
- },
1719
1719
  {
1720
1720
  "name": "fastForward"
1721
1721
  }
@@ -41,8 +41,9 @@ function getOppositeAxis(axis) {
41
41
  function getAxisLength(axis) {
42
42
  return axis === 'y' ? 'height' : 'width';
43
43
  }
44
+ const yAxisSides = /*#__PURE__*/new Set(['top', 'bottom']);
44
45
  function getSideAxis(placement) {
45
- return ['top', 'bottom'].includes(getSide(placement)) ? 'y' : 'x';
46
+ return yAxisSides.has(getSide(placement)) ? 'y' : 'x';
46
47
  }
47
48
  function getAlignmentAxis(placement) {
48
49
  return getOppositeAxis(getSideAxis(placement));
@@ -67,19 +68,19 @@ function getExpandedPlacements(placement) {
67
68
  function getOppositeAlignmentPlacement(placement) {
68
69
  return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
69
70
  }
71
+ const lrPlacement = ['left', 'right'];
72
+ const rlPlacement = ['right', 'left'];
73
+ const tbPlacement = ['top', 'bottom'];
74
+ const btPlacement = ['bottom', 'top'];
70
75
  function getSideList(side, isStart, rtl) {
71
- const lr = ['left', 'right'];
72
- const rl = ['right', 'left'];
73
- const tb = ['top', 'bottom'];
74
- const bt = ['bottom', 'top'];
75
76
  switch (side) {
76
77
  case 'top':
77
78
  case 'bottom':
78
- if (rtl) return isStart ? rl : lr;
79
- return isStart ? lr : rl;
79
+ if (rtl) return isStart ? rlPlacement : lrPlacement;
80
+ return isStart ? lrPlacement : rlPlacement;
80
81
  case 'left':
81
82
  case 'right':
82
- return isStart ? tb : bt;
83
+ return isStart ? tbPlacement : btPlacement;
83
84
  default:
84
85
  return [];
85
86
  }
@@ -602,16 +603,22 @@ const flip$1 = function (options) {
602
603
  const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
603
604
  const nextPlacement = placements[nextIndex];
604
605
  if (nextPlacement) {
605
- // Try next placement and re-run the lifecycle.
606
- return {
607
- data: {
608
- index: nextIndex,
609
- overflows: overflowsData
610
- },
611
- reset: {
612
- placement: nextPlacement
613
- }
614
- };
606
+ const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
607
+ if (!ignoreCrossAxisOverflow ||
608
+ // We leave the current main axis only if every placement on that axis
609
+ // overflows the main axis.
610
+ overflowsData.every(d => d.overflows[0] > 0 && getSideAxis(d.placement) === initialSideAxis)) {
611
+ // Try next placement and re-run the lifecycle.
612
+ return {
613
+ data: {
614
+ index: nextIndex,
615
+ overflows: overflowsData
616
+ },
617
+ reset: {
618
+ placement: nextPlacement
619
+ }
620
+ };
621
+ }
615
622
  }
616
623
 
617
624
  // First, find the candidates that fit on the mainAxis side of overflow,
@@ -857,6 +864,8 @@ const inline = function (options) {
857
864
  };
858
865
  };
859
866
 
867
+ const originSides = /*#__PURE__*/new Set(['left', 'top']);
868
+
860
869
  // For type backwards-compatibility, the `OffsetOptions` type was also
861
870
  // Derivable.
862
871
 
@@ -870,7 +879,7 @@ async function convertValueToCoords(state, options) {
870
879
  const side = getSide(placement);
871
880
  const alignment = getAlignment(placement);
872
881
  const isVertical = getSideAxis(placement) === 'y';
873
- const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
882
+ const mainAxisMulti = originSides.has(side) ? -1 : 1;
874
883
  const crossAxisMulti = rtl && isVertical ? -1 : 1;
875
884
  const rawValue = evaluate(options, state);
876
885
 
@@ -1070,7 +1079,7 @@ const limitShift = function (options) {
1070
1079
  if (checkCrossAxis) {
1071
1080
  var _middlewareData$offse, _middlewareData$offse2;
1072
1081
  const len = mainAxis === 'y' ? 'width' : 'height';
1073
- const isOriginSide = ['top', 'left'].includes(getSide(placement));
1082
+ const isOriginSide = originSides.has(getSide(placement));
1074
1083
  const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis);
1075
1084
  const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0);
1076
1085
  if (crossAxisCoord < limitMin) {
@@ -1215,6 +1224,7 @@ function isShadowRoot(value) {
1215
1224
  }
1216
1225
  return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
1217
1226
  }
1227
+ const invalidOverflowDisplayValues = /*#__PURE__*/new Set(['inline', 'contents']);
1218
1228
  function isOverflowElement(element) {
1219
1229
  const {
1220
1230
  overflow,
@@ -1222,27 +1232,32 @@ function isOverflowElement(element) {
1222
1232
  overflowY,
1223
1233
  display
1224
1234
  } = getComputedStyle(element);
1225
- return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
1235
+ return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
1226
1236
  }
1237
+ const tableElements = /*#__PURE__*/new Set(['table', 'td', 'th']);
1227
1238
  function isTableElement(element) {
1228
- return ['table', 'td', 'th'].includes(getNodeName(element));
1239
+ return tableElements.has(getNodeName(element));
1229
1240
  }
1241
+ const topLayerSelectors = [':popover-open', ':modal'];
1230
1242
  function isTopLayer(element) {
1231
- return [':popover-open', ':modal'].some(selector => {
1243
+ return topLayerSelectors.some(selector => {
1232
1244
  try {
1233
1245
  return element.matches(selector);
1234
- } catch (e) {
1246
+ } catch (_e) {
1235
1247
  return false;
1236
1248
  }
1237
1249
  });
1238
1250
  }
1251
+ const transformProperties = ['transform', 'translate', 'scale', 'rotate', 'perspective'];
1252
+ const willChangeValues = ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'];
1253
+ const containValues = ['paint', 'layout', 'strict', 'content'];
1239
1254
  function isContainingBlock(elementOrCss) {
1240
1255
  const webkit = isWebKit();
1241
1256
  const css = isElement(elementOrCss) ? getComputedStyle(elementOrCss) : elementOrCss;
1242
1257
 
1243
1258
  // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
1244
1259
  // https://drafts.csswg.org/css-transforms-2/#individual-transforms
1245
- return ['transform', 'translate', 'scale', 'rotate', 'perspective'].some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
1260
+ return transformProperties.some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || willChangeValues.some(value => (css.willChange || '').includes(value)) || containValues.some(value => (css.contain || '').includes(value));
1246
1261
  }
1247
1262
  function getContainingBlock(element) {
1248
1263
  let currentNode = getParentNode(element);
@@ -1260,8 +1275,9 @@ function isWebKit() {
1260
1275
  if (typeof CSS === 'undefined' || !CSS.supports) return false;
1261
1276
  return CSS.supports('-webkit-backdrop-filter', 'none');
1262
1277
  }
1278
+ const lastTraversableNodeNames = /*#__PURE__*/new Set(['html', 'body', '#document']);
1263
1279
  function isLastTraversableNode(node) {
1264
- return ['html', 'body', '#document'].includes(getNodeName(node));
1280
+ return lastTraversableNodeNames.has(getNodeName(node));
1265
1281
  }
1266
1282
  function getComputedStyle(element) {
1267
1283
  return getWindow(element).getComputedStyle(element);
@@ -1566,6 +1582,7 @@ function getViewportRect(element, strategy) {
1566
1582
  };
1567
1583
  }
1568
1584
 
1585
+ const absoluteOrFixed = /*#__PURE__*/new Set(['absolute', 'fixed']);
1569
1586
  // Returns the inner client rect, subtracting scrollbars if present.
1570
1587
  function getInnerBoundingClientRect(element, strategy) {
1571
1588
  const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
@@ -1630,7 +1647,7 @@ function getClippingElementAncestors(element, cache) {
1630
1647
  if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
1631
1648
  currentContainingBlockComputedStyle = null;
1632
1649
  }
1633
- const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
1650
+ const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
1634
1651
  if (shouldDropCurrentNode) {
1635
1652
  // Drop non-containing blocks.
1636
1653
  result = result.filter(ancestor => ancestor !== currentNode);
@@ -1693,6 +1710,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
1693
1710
  scrollTop: 0
1694
1711
  };
1695
1712
  const offsets = createCoords(0);
1713
+
1714
+ // If the <body> scrollbar appears on the left (e.g. RTL systems). Use
1715
+ // Firefox with layout.scrollbar.side = 3 in about:config to test this.
1716
+ function setLeftRTLScrollbarOffset() {
1717
+ offsets.x = getWindowScrollBarX(documentElement);
1718
+ }
1696
1719
  if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
1697
1720
  if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
1698
1721
  scroll = getNodeScroll(offsetParent);
@@ -1702,11 +1725,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
1702
1725
  offsets.x = offsetRect.x + offsetParent.clientLeft;
1703
1726
  offsets.y = offsetRect.y + offsetParent.clientTop;
1704
1727
  } else if (documentElement) {
1705
- // If the <body> scrollbar appears on the left (e.g. RTL systems). Use
1706
- // Firefox with layout.scrollbar.side = 3 in about:config to test this.
1707
- offsets.x = getWindowScrollBarX(documentElement);
1728
+ setLeftRTLScrollbarOffset();
1708
1729
  }
1709
1730
  }
1731
+ if (isFixed && !isOffsetParentAnElement && documentElement) {
1732
+ setLeftRTLScrollbarOffset();
1733
+ }
1710
1734
  const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
1711
1735
  const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
1712
1736
  const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;