@vonage/vivid 4.11.0 → 4.12.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 (96) hide show
  1. package/custom-elements.json +899 -442
  2. package/lib/accordion/accordion.d.ts +21 -2
  3. package/lib/accordion-item/accordion-item.d.ts +6 -2
  4. package/lib/calendar/calendar.d.ts +1 -1
  5. package/lib/date-picker/date-picker.d.ts +1 -0
  6. package/lib/fab/fab.d.ts +2 -2
  7. package/lib/radio/radio.d.ts +12 -2
  8. package/lib/radio/radio.form-associated.d.ts +10 -0
  9. package/lib/radio-group/radio-group.d.ts +20 -2
  10. package/lib/tab/tab.d.ts +3 -2
  11. package/lib/tab-panel/tab-panel.d.ts +2 -2
  12. package/lib/tabs/tabs.d.ts +30 -9
  13. package/package.json +1 -1
  14. package/shared/date-picker/date-picker-base.d.ts +1 -0
  15. package/shared/definition.cjs +29 -72
  16. package/shared/definition.js +30 -73
  17. package/shared/definition16.cjs +1 -2
  18. package/shared/definition16.js +1 -2
  19. package/shared/definition17.cjs +2 -2
  20. package/shared/definition17.js +2 -2
  21. package/shared/definition18.cjs +6 -1
  22. package/shared/definition18.js +6 -1
  23. package/shared/definition19.cjs +17 -8
  24. package/shared/definition19.js +17 -8
  25. package/shared/definition2.cjs +154 -187
  26. package/shared/definition2.js +157 -190
  27. package/shared/definition20.cjs +1 -1
  28. package/shared/definition20.js +1 -1
  29. package/shared/definition24.cjs +11 -11
  30. package/shared/definition24.js +11 -11
  31. package/shared/definition29.cjs +2 -2
  32. package/shared/definition29.js +2 -2
  33. package/shared/definition35.cjs +1 -1
  34. package/shared/definition35.js +1 -1
  35. package/shared/definition40.cjs +226 -399
  36. package/shared/definition40.js +229 -402
  37. package/shared/definition42.cjs +3 -2
  38. package/shared/definition42.js +3 -2
  39. package/shared/definition43.cjs +1 -0
  40. package/shared/definition43.js +1 -0
  41. package/shared/definition44.cjs +1 -1
  42. package/shared/definition44.js +1 -1
  43. package/shared/definition47.cjs +3 -2
  44. package/shared/definition47.js +3 -2
  45. package/shared/definition49.cjs +1 -1
  46. package/shared/definition49.js +1 -1
  47. package/shared/definition5.cjs +1 -1
  48. package/shared/definition5.js +1 -1
  49. package/shared/definition50.cjs +1 -11
  50. package/shared/definition50.js +1 -11
  51. package/shared/definition51.cjs +4 -14
  52. package/shared/definition51.js +5 -15
  53. package/shared/definition52.cjs +269 -19
  54. package/shared/definition52.js +273 -23
  55. package/shared/definition57.cjs +26 -4
  56. package/shared/definition57.js +27 -5
  57. package/shared/definition58.cjs +1 -1
  58. package/shared/definition58.js +1 -1
  59. package/shared/definition59.cjs +1 -1
  60. package/shared/definition59.js +1 -1
  61. package/shared/definition61.cjs +1 -1
  62. package/shared/definition61.js +1 -1
  63. package/shared/definition62.cjs +17 -8
  64. package/shared/definition62.js +17 -8
  65. package/shared/definition64.cjs +55 -30
  66. package/shared/definition64.js +55 -30
  67. package/shared/form-associated.cjs +1 -1
  68. package/shared/form-associated.js +1 -1
  69. package/shared/foundation/button/button.d.ts +1 -1
  70. package/shared/foundation/button/button.template.d.ts +2 -2
  71. package/shared/icon.cjs +1 -1
  72. package/shared/icon.js +1 -1
  73. package/shared/index.cjs +1 -0
  74. package/shared/index.js +1 -1
  75. package/shared/key-codes.cjs +1 -94
  76. package/shared/key-codes.js +2 -89
  77. package/shared/key-codes2.cjs +87 -1
  78. package/shared/key-codes2.js +83 -2
  79. package/shared/listbox.cjs +6 -7
  80. package/shared/listbox.js +3 -4
  81. package/shared/numbers.cjs +0 -12
  82. package/shared/numbers.js +1 -12
  83. package/shared/presentationDate.cjs +14 -0
  84. package/shared/presentationDate.js +15 -1
  85. package/shared/radio.cjs +92 -117
  86. package/shared/radio.js +93 -118
  87. package/shared/slider.template.cjs +2 -15
  88. package/shared/slider.template.js +2 -14
  89. package/shared/strings.cjs +26 -0
  90. package/shared/strings.js +25 -1
  91. package/styles/core/all.css +1 -1
  92. package/styles/core/theme.css +1 -1
  93. package/styles/core/typography.css +1 -1
  94. package/styles/tokens/theme-dark.css +4 -4
  95. package/styles/tokens/theme-light.css +4 -4
  96. package/styles/tokens/vivid-2-compat.css +1 -1
package/shared/definition64.cjs CHANGED
@@ -1314,6 +1314,31 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
1314
1314
  });
1315
1315
  }
1316
1316
 
1317
+ // If <html> has a CSS width greater than the viewport, then this will be
1318
+ // incorrect for RTL.
1319
+ function getWindowScrollBarX(element, rect) {
1320
+ const leftScroll = getNodeScroll(element).scrollLeft;
1321
+ if (!rect) {
1322
+ return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
1323
+ }
1324
+ return rect.left + leftScroll;
1325
+ }
1326
+
1327
+ function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
1328
+ if (ignoreScrollbarX === void 0) {
1329
+ ignoreScrollbarX = false;
1330
+ }
1331
+ const htmlRect = documentElement.getBoundingClientRect();
1332
+ const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
1333
+ // RTL <body> scrollbar.
1334
+ getWindowScrollBarX(documentElement, htmlRect));
1335
+ const y = htmlRect.top + scroll.scrollTop;
1336
+ return {
1337
+ x,
1338
+ y
1339
+ };
1340
+ }
1341
+
1317
1342
  function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
1318
1343
  let {
1319
1344
  elements,
@@ -1345,11 +1370,12 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
1345
1370
  offsets.y = offsetRect.y + offsetParent.clientTop;
1346
1371
  }
1347
1372
  }
1373
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
1348
1374
  return {
1349
1375
  width: rect.width * scale.x,
1350
1376
  height: rect.height * scale.y,
1351
- x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
1352
- y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
1377
+ x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
1378
+ y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
1353
1379
  };
1354
1380
  }
1355
1381
 
@@ -1357,16 +1383,6 @@ function getClientRects(element) {
1357
1383
  return Array.from(element.getClientRects());
1358
1384
  }
1359
1385
 
1360
- // If <html> has a CSS width greater than the viewport, then this will be
1361
- // incorrect for RTL.
1362
- function getWindowScrollBarX(element, rect) {
1363
- const leftScroll = getNodeScroll(element).scrollLeft;
1364
- if (!rect) {
1365
- return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
1366
- }
1367
- return rect.left + leftScroll;
1368
- }
1369
-
1370
1386
  // Gets the entire size of the scrollable document area, even extending outside
1371
1387
  // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
1372
1388
  function getDocumentRect(element) {
@@ -1441,9 +1457,10 @@ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy)
1441
1457
  } else {
1442
1458
  const visualOffsets = getVisualOffsets(element);
1443
1459
  rect = {
1444
- ...clippingAncestor,
1445
1460
  x: clippingAncestor.x - visualOffsets.x,
1446
- y: clippingAncestor.y - visualOffsets.y
1461
+ y: clippingAncestor.y - visualOffsets.y,
1462
+ width: clippingAncestor.width,
1463
+ height: clippingAncestor.height
1447
1464
  };
1448
1465
  }
1449
1466
  return rectToClientRect(rect);
@@ -1553,17 +1570,9 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
1553
1570
  offsets.x = getWindowScrollBarX(documentElement);
1554
1571
  }
1555
1572
  }
1556
- let htmlX = 0;
1557
- let htmlY = 0;
1558
- if (documentElement && !isOffsetParentAnElement && !isFixed) {
1559
- const htmlRect = documentElement.getBoundingClientRect();
1560
- htmlY = htmlRect.top + scroll.scrollTop;
1561
- htmlX = htmlRect.left + scroll.scrollLeft -
1562
- // RTL <body> scrollbar.
1563
- getWindowScrollBarX(documentElement, htmlRect);
1564
- }
1565
- const x = rect.left + scroll.scrollLeft - offsets.x - htmlX;
1566
- const y = rect.top + scroll.scrollTop - offsets.y - htmlY;
1573
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
1574
+ const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
1575
+ const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
1567
1576
  return {
1568
1577
  x,
1569
1578
  y,
@@ -1966,7 +1975,10 @@ class Popup extends index.FoundationElement {
1966
1975
  #cleanup;
1967
1976
  openChanged(_, newValue) {
1968
1977
  newValue ? this.$emit("vwc-popup:open") : this.$emit("vwc-popup:close");
1969
- index.DOM.queueUpdate(() => this.#updateAutoUpdate());
1978
+ index.DOM.queueUpdate(() => {
1979
+ this.#updateAutoUpdate();
1980
+ this.#togglePopover();
1981
+ });
1970
1982
  }
1971
1983
  /**
1972
1984
  * @internal
@@ -1980,6 +1992,9 @@ class Popup extends index.FoundationElement {
1980
1992
  anchorChanged() {
1981
1993
  this.#updateAutoUpdate();
1982
1994
  }
1995
+ strategyChanged() {
1996
+ this.#togglePopover();
1997
+ }
1983
1998
  connectedCallback() {
1984
1999
  super.connectedCallback();
1985
2000
  this.#updateAutoUpdate();
@@ -2001,6 +2016,15 @@ class Popup extends index.FoundationElement {
2001
2016
  );
2002
2017
  }
2003
2018
  }
2019
+ #togglePopover() {
2020
+ if (this.popupEl && this.strategy === "fixed") {
2021
+ if (this.open) {
2022
+ this.popupEl.showPopover();
2023
+ } else {
2024
+ this.popupEl.hidePopover();
2025
+ }
2026
+ }
2027
+ }
2004
2028
  /**
2005
2029
  * Updates popup's position
2006
2030
  *
@@ -2086,7 +2110,7 @@ __decorateClass([
2086
2110
  index.observable
2087
2111
  ], Popup.prototype, "anchor");
2088
2112
 
2089
- const styles = ":host{display:var(--_popup-display, inline)}.control{border-radius:inherit;background:var(--vvd-color-surface-4dp);contain:layout}.control:not(.open){display:none}.popup-wrapper{white-space:initial;z-index:var(--_popup-z-index, 10);border-radius:8px;inline-size:max-content}.popup-wrapper:not(.absolute){position:fixed}.popup-wrapper.absolute{position:absolute;top:0;left:0}.popup-content{display:grid;color:var(--vvd-color-canvas-text)}.dismissible .popup-content{align-content:start;grid-template-columns:1fr auto}.arrow{position:absolute;z-index:-1;width:8px;height:8px;background:var(--vvd-color-surface-4dp);transform:rotate(45deg)}.dismissible-button{align-self:flex-start;margin-block-start:4px;margin-inline-end:4px}";
2113
+ const styles = ":host{display:var(--_popup-display, inline)}.control{border-radius:inherit;background:var(--vvd-color-surface-4dp);contain:layout}.control:not(.open){display:none}.popup-wrapper{white-space:initial;z-index:var(--_popup-z-index, 10);overflow:visible;padding:0;border:none;border-radius:8px;margin:0;inline-size:max-content}.popup-wrapper:not(.absolute){position:fixed}.popup-wrapper.absolute{position:absolute;top:0;left:0}.popup-content{display:grid;color:var(--vvd-color-canvas-text)}.dismissible .popup-content{align-content:start;grid-template-columns:1fr auto}.arrow{position:absolute;z-index:-1;width:8px;height:8px;background:var(--vvd-color-surface-4dp);transform:rotate(45deg)}.dismissible-button{align-self:flex-start;margin-block-start:4px;margin-inline-end:4px}";
2090
2114
 
2091
2115
  const getClasses = ({ open, dismissible, alternate }) => classNames.classNames(
2092
2116
  "control",
@@ -2094,14 +2118,15 @@ const getClasses = ({ open, dismissible, alternate }) => classNames.classNames(
2094
2118
  ["dismissible", Boolean(dismissible)],
2095
2119
  ["alternate", Boolean(alternate)]
2096
2120
  );
2121
+ function handlePopover(x) {
2122
+ return x.strategy && x.strategy === "fixed" ? "manual" : null;
2123
+ }
2097
2124
  const popupTemplate = (context) => {
2098
2125
  const elevationTag = context.tagFor(definition.Elevation);
2099
2126
  const buttonTag = context.tagFor(definition$1.Button$1);
2100
2127
  return index.html`
2101
2128
  <${elevationTag}>
2102
- <div class="popup-wrapper ${(x) => x.strategy}" ${ref.ref(
2103
- "popupEl"
2104
- )} part="popup-base">
2129
+ <div popover="${handlePopover}" class="popup-wrapper ${(x) => x.strategy}" ${ref.ref("popupEl")} part="popup-base">
2105
2130
  <div class="${getClasses}" aria-hidden="${(x) => x.open ? "false" : "true"}"
2106
2131
  part="${(x) => x.alternate ? "vvd-theme-alternate" : ""}">
2107
2132
  <div class="popup-content">
package/shared/definition64.js CHANGED
@@ -1312,6 +1312,31 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
1312
1312
  });
1313
1313
  }
1314
1314
 
1315
+ // If <html> has a CSS width greater than the viewport, then this will be
1316
+ // incorrect for RTL.
1317
+ function getWindowScrollBarX(element, rect) {
1318
+ const leftScroll = getNodeScroll(element).scrollLeft;
1319
+ if (!rect) {
1320
+ return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
1321
+ }
1322
+ return rect.left + leftScroll;
1323
+ }
1324
+
1325
+ function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
1326
+ if (ignoreScrollbarX === void 0) {
1327
+ ignoreScrollbarX = false;
1328
+ }
1329
+ const htmlRect = documentElement.getBoundingClientRect();
1330
+ const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
1331
+ // RTL <body> scrollbar.
1332
+ getWindowScrollBarX(documentElement, htmlRect));
1333
+ const y = htmlRect.top + scroll.scrollTop;
1334
+ return {
1335
+ x,
1336
+ y
1337
+ };
1338
+ }
1339
+
1315
1340
  function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
1316
1341
  let {
1317
1342
  elements,
@@ -1343,11 +1368,12 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
1343
1368
  offsets.y = offsetRect.y + offsetParent.clientTop;
1344
1369
  }
1345
1370
  }
1371
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
1346
1372
  return {
1347
1373
  width: rect.width * scale.x,
1348
1374
  height: rect.height * scale.y,
1349
- x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
1350
- y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
1375
+ x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
1376
+ y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
1351
1377
  };
1352
1378
  }
1353
1379
 
@@ -1355,16 +1381,6 @@ function getClientRects(element) {
1355
1381
  return Array.from(element.getClientRects());
1356
1382
  }
1357
1383
 
1358
- // If <html> has a CSS width greater than the viewport, then this will be
1359
- // incorrect for RTL.
1360
- function getWindowScrollBarX(element, rect) {
1361
- const leftScroll = getNodeScroll(element).scrollLeft;
1362
- if (!rect) {
1363
- return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
1364
- }
1365
- return rect.left + leftScroll;
1366
- }
1367
-
1368
1384
  // Gets the entire size of the scrollable document area, even extending outside
1369
1385
  // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
1370
1386
  function getDocumentRect(element) {
@@ -1439,9 +1455,10 @@ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy)
1439
1455
  } else {
1440
1456
  const visualOffsets = getVisualOffsets(element);
1441
1457
  rect = {
1442
- ...clippingAncestor,
1443
1458
  x: clippingAncestor.x - visualOffsets.x,
1444
- y: clippingAncestor.y - visualOffsets.y
1459
+ y: clippingAncestor.y - visualOffsets.y,
1460
+ width: clippingAncestor.width,
1461
+ height: clippingAncestor.height
1445
1462
  };
1446
1463
  }
1447
1464
  return rectToClientRect(rect);
@@ -1551,17 +1568,9 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
1551
1568
  offsets.x = getWindowScrollBarX(documentElement);
1552
1569
  }
1553
1570
  }
1554
- let htmlX = 0;
1555
- let htmlY = 0;
1556
- if (documentElement && !isOffsetParentAnElement && !isFixed) {
1557
- const htmlRect = documentElement.getBoundingClientRect();
1558
- htmlY = htmlRect.top + scroll.scrollTop;
1559
- htmlX = htmlRect.left + scroll.scrollLeft -
1560
- // RTL <body> scrollbar.
1561
- getWindowScrollBarX(documentElement, htmlRect);
1562
- }
1563
- const x = rect.left + scroll.scrollLeft - offsets.x - htmlX;
1564
- const y = rect.top + scroll.scrollTop - offsets.y - htmlY;
1571
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
1572
+ const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
1573
+ const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
1565
1574
  return {
1566
1575
  x,
1567
1576
  y,
@@ -1964,7 +1973,10 @@ class Popup extends FoundationElement {
1964
1973
  #cleanup;
1965
1974
  openChanged(_, newValue) {
1966
1975
  newValue ? this.$emit("vwc-popup:open") : this.$emit("vwc-popup:close");
1967
- DOM.queueUpdate(() => this.#updateAutoUpdate());
1976
+ DOM.queueUpdate(() => {
1977
+ this.#updateAutoUpdate();
1978
+ this.#togglePopover();
1979
+ });
1968
1980
  }
1969
1981
  /**
1970
1982
  * @internal
@@ -1978,6 +1990,9 @@ class Popup extends FoundationElement {
1978
1990
  anchorChanged() {
1979
1991
  this.#updateAutoUpdate();
1980
1992
  }
1993
+ strategyChanged() {
1994
+ this.#togglePopover();
1995
+ }
1981
1996
  connectedCallback() {
1982
1997
  super.connectedCallback();
1983
1998
  this.#updateAutoUpdate();
@@ -1999,6 +2014,15 @@ class Popup extends FoundationElement {
1999
2014
  );
2000
2015
  }
2001
2016
  }
2017
+ #togglePopover() {
2018
+ if (this.popupEl && this.strategy === "fixed") {
2019
+ if (this.open) {
2020
+ this.popupEl.showPopover();
2021
+ } else {
2022
+ this.popupEl.hidePopover();
2023
+ }
2024
+ }
2025
+ }
2002
2026
  /**
2003
2027
  * Updates popup's position
2004
2028
  *
@@ -2084,7 +2108,7 @@ __decorateClass([
2084
2108
  observable
2085
2109
  ], Popup.prototype, "anchor");
2086
2110
 
2087
- const styles = ":host{display:var(--_popup-display, inline)}.control{border-radius:inherit;background:var(--vvd-color-surface-4dp);contain:layout}.control:not(.open){display:none}.popup-wrapper{white-space:initial;z-index:var(--_popup-z-index, 10);border-radius:8px;inline-size:max-content}.popup-wrapper:not(.absolute){position:fixed}.popup-wrapper.absolute{position:absolute;top:0;left:0}.popup-content{display:grid;color:var(--vvd-color-canvas-text)}.dismissible .popup-content{align-content:start;grid-template-columns:1fr auto}.arrow{position:absolute;z-index:-1;width:8px;height:8px;background:var(--vvd-color-surface-4dp);transform:rotate(45deg)}.dismissible-button{align-self:flex-start;margin-block-start:4px;margin-inline-end:4px}";
2111
+ const styles = ":host{display:var(--_popup-display, inline)}.control{border-radius:inherit;background:var(--vvd-color-surface-4dp);contain:layout}.control:not(.open){display:none}.popup-wrapper{white-space:initial;z-index:var(--_popup-z-index, 10);overflow:visible;padding:0;border:none;border-radius:8px;margin:0;inline-size:max-content}.popup-wrapper:not(.absolute){position:fixed}.popup-wrapper.absolute{position:absolute;top:0;left:0}.popup-content{display:grid;color:var(--vvd-color-canvas-text)}.dismissible .popup-content{align-content:start;grid-template-columns:1fr auto}.arrow{position:absolute;z-index:-1;width:8px;height:8px;background:var(--vvd-color-surface-4dp);transform:rotate(45deg)}.dismissible-button{align-self:flex-start;margin-block-start:4px;margin-inline-end:4px}";
2088
2112
 
2089
2113
  const getClasses = ({ open, dismissible, alternate }) => classNames(
2090
2114
  "control",
@@ -2092,14 +2116,15 @@ const getClasses = ({ open, dismissible, alternate }) => classNames(
2092
2116
  ["dismissible", Boolean(dismissible)],
2093
2117
  ["alternate", Boolean(alternate)]
2094
2118
  );
2119
+ function handlePopover(x) {
2120
+ return x.strategy && x.strategy === "fixed" ? "manual" : null;
2121
+ }
2095
2122
  const popupTemplate = (context) => {
2096
2123
  const elevationTag = context.tagFor(Elevation);
2097
2124
  const buttonTag = context.tagFor(Button);
2098
2125
  return html`
2099
2126
  <${elevationTag}>
2100
- <div class="popup-wrapper ${(x) => x.strategy}" ${ref(
2101
- "popupEl"
2102
- )} part="popup-base">
2127
+ <div popover="${handlePopover}" class="popup-wrapper ${(x) => x.strategy}" ${ref("popupEl")} part="popup-base">
2103
2128
  <div class="${getClasses}" aria-hidden="${(x) => x.open ? "false" : "true"}"
2104
2129
  part="${(x) => x.alternate ? "vvd-theme-alternate" : ""}">
2105
2130
  <div class="popup-content">
package/shared/form-associated.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index.cjs');
4
- const keyCodes = require('./key-codes.cjs');
4
+ const keyCodes = require('./key-codes2.cjs');
5
5
 
6
6
  const proxySlotName = "form-associated-proxy";
7
7
  const ElementInternalsKey = "ElementInternals";
package/shared/form-associated.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { a as attr, o as observable, c as booleanConverter, e as emptyArray, D as DOM } from './index.js';
2
- import { k as keyEnter } from './key-codes.js';
2
+ import { k as keyEnter } from './key-codes2.js';
3
3
 
4
4
  const proxySlotName = "form-associated-proxy";
5
5
  const ElementInternalsKey = "ElementInternals";
package/shared/foundation/button/button.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
2
2
  import { FormAssociatedButton } from './button.form-associated';
3
3
  export type ButtonOptions = FoundationElementDefinition;
4
- export declare class FoundationButton extends FormAssociatedButton {
4
+ export declare class VividFoundationButton extends FormAssociatedButton {
5
5
  autofocus: boolean;
6
6
  formId: string;
7
7
  formaction: string;
package/shared/foundation/button/button.template.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import type { ViewTemplate } from '@microsoft/fast-element';
2
2
  import type { FoundationElementTemplate } from '@microsoft/fast-foundation';
3
- import type { ButtonOptions, FoundationButton } from './button';
4
- export declare const buttonTemplate: FoundationElementTemplate<ViewTemplate<FoundationButton>, ButtonOptions>;
3
+ import type { ButtonOptions, VividFoundationButton } from './button';
4
+ export declare const buttonTemplate: FoundationElementTemplate<ViewTemplate<VividFoundationButton>, ButtonOptions>;
package/shared/icon.cjs CHANGED
@@ -141,7 +141,7 @@ _has._curry2(function memoizeWith(mFn, fn) {
141
141
  });
142
142
 
143
143
  const ICONS_BASE_URL = "https://icon.resources.vonage.com";
144
- const ICONS_VERSION = "4.6.0";
144
+ const ICONS_VERSION = "4.6.1";
145
145
 
146
146
  const numberConverter = {
147
147
  toView(value) {
package/shared/icon.js CHANGED
@@ -139,7 +139,7 @@ _curry2(function memoizeWith(mFn, fn) {
139
139
  });
140
140
 
141
141
  const ICONS_BASE_URL = "https://icon.resources.vonage.com";
142
- const ICONS_VERSION = "4.6.0";
142
+ const ICONS_VERSION = "4.6.1";
143
143
 
144
144
  const numberConverter = {
145
145
  toView(value) {
package/shared/index.cjs CHANGED
@@ -5091,6 +5091,7 @@ exports.SubscriberSet = SubscriberSet;
5091
5091
  exports.__decorate = __decorate;
5092
5092
  exports.attr = attr;
5093
5093
  exports.booleanConverter = booleanConverter;
5094
+ exports.defaultExecutionContext = defaultExecutionContext;
5094
5095
  exports.designSystem = designSystem;
5095
5096
  exports.emptyArray = emptyArray;
5096
5097
  exports.html = html;
package/shared/index.js CHANGED
@@ -5078,4 +5078,4 @@ const defaultPrefix = "vwc";
5078
5078
  const designSystem = DesignSystem.getOrCreate();
5079
5079
  const registerFactory = (registries) => (prefix = defaultPrefix) => designSystem.withPrefix(prefix).register(...registries);
5080
5080
 
5081
- export { AttributeConfiguration as A, DOM as D, FoundationElement as F, HTMLDirective as H, Observable as O, SubscriberSet as S, __decorate as _, attr as a, AttachedBehaviorHTMLDirective as b, booleanConverter as c, designSystem as d, emptyArray as e, HTMLView as f, html as h, nullableNumberConverter as n, observable as o, registerFactory as r, volatile as v };
5081
+ export { AttributeConfiguration as A, DOM as D, FoundationElement as F, HTMLDirective as H, Observable as O, SubscriberSet as S, __decorate as _, attr as a, AttachedBehaviorHTMLDirective as b, booleanConverter as c, designSystem as d, emptyArray as e, HTMLView as f, defaultExecutionContext as g, html as h, nullableNumberConverter as n, observable as o, registerFactory as r, volatile as v };
package/shared/key-codes.cjs CHANGED
@@ -1,81 +1,5 @@
1
1
  'use strict';
2
2
 
3
- /**
4
- * Key Code values
5
- * @deprecated - KeyCodes are deprecated, use individual string key exports
6
- */
7
- var KeyCodes;
8
- (function (KeyCodes) {
9
- KeyCodes[KeyCodes["alt"] = 18] = "alt";
10
- KeyCodes[KeyCodes["arrowDown"] = 40] = "arrowDown";
11
- KeyCodes[KeyCodes["arrowLeft"] = 37] = "arrowLeft";
12
- KeyCodes[KeyCodes["arrowRight"] = 39] = "arrowRight";
13
- KeyCodes[KeyCodes["arrowUp"] = 38] = "arrowUp";
14
- KeyCodes[KeyCodes["back"] = 8] = "back";
15
- KeyCodes[KeyCodes["backSlash"] = 220] = "backSlash";
16
- KeyCodes[KeyCodes["break"] = 19] = "break";
17
- KeyCodes[KeyCodes["capsLock"] = 20] = "capsLock";
18
- KeyCodes[KeyCodes["closeBracket"] = 221] = "closeBracket";
19
- KeyCodes[KeyCodes["colon"] = 186] = "colon";
20
- KeyCodes[KeyCodes["colon2"] = 59] = "colon2";
21
- KeyCodes[KeyCodes["comma"] = 188] = "comma";
22
- KeyCodes[KeyCodes["ctrl"] = 17] = "ctrl";
23
- KeyCodes[KeyCodes["delete"] = 46] = "delete";
24
- KeyCodes[KeyCodes["end"] = 35] = "end";
25
- KeyCodes[KeyCodes["enter"] = 13] = "enter";
26
- KeyCodes[KeyCodes["equals"] = 187] = "equals";
27
- KeyCodes[KeyCodes["equals2"] = 61] = "equals2";
28
- KeyCodes[KeyCodes["equals3"] = 107] = "equals3";
29
- KeyCodes[KeyCodes["escape"] = 27] = "escape";
30
- KeyCodes[KeyCodes["forwardSlash"] = 191] = "forwardSlash";
31
- KeyCodes[KeyCodes["function1"] = 112] = "function1";
32
- KeyCodes[KeyCodes["function10"] = 121] = "function10";
33
- KeyCodes[KeyCodes["function11"] = 122] = "function11";
34
- KeyCodes[KeyCodes["function12"] = 123] = "function12";
35
- KeyCodes[KeyCodes["function2"] = 113] = "function2";
36
- KeyCodes[KeyCodes["function3"] = 114] = "function3";
37
- KeyCodes[KeyCodes["function4"] = 115] = "function4";
38
- KeyCodes[KeyCodes["function5"] = 116] = "function5";
39
- KeyCodes[KeyCodes["function6"] = 117] = "function6";
40
- KeyCodes[KeyCodes["function7"] = 118] = "function7";
41
- KeyCodes[KeyCodes["function8"] = 119] = "function8";
42
- KeyCodes[KeyCodes["function9"] = 120] = "function9";
43
- KeyCodes[KeyCodes["home"] = 36] = "home";
44
- KeyCodes[KeyCodes["insert"] = 45] = "insert";
45
- KeyCodes[KeyCodes["menu"] = 93] = "menu";
46
- KeyCodes[KeyCodes["minus"] = 189] = "minus";
47
- KeyCodes[KeyCodes["minus2"] = 109] = "minus2";
48
- KeyCodes[KeyCodes["numLock"] = 144] = "numLock";
49
- KeyCodes[KeyCodes["numPad0"] = 96] = "numPad0";
50
- KeyCodes[KeyCodes["numPad1"] = 97] = "numPad1";
51
- KeyCodes[KeyCodes["numPad2"] = 98] = "numPad2";
52
- KeyCodes[KeyCodes["numPad3"] = 99] = "numPad3";
53
- KeyCodes[KeyCodes["numPad4"] = 100] = "numPad4";
54
- KeyCodes[KeyCodes["numPad5"] = 101] = "numPad5";
55
- KeyCodes[KeyCodes["numPad6"] = 102] = "numPad6";
56
- KeyCodes[KeyCodes["numPad7"] = 103] = "numPad7";
57
- KeyCodes[KeyCodes["numPad8"] = 104] = "numPad8";
58
- KeyCodes[KeyCodes["numPad9"] = 105] = "numPad9";
59
- KeyCodes[KeyCodes["numPadDivide"] = 111] = "numPadDivide";
60
- KeyCodes[KeyCodes["numPadDot"] = 110] = "numPadDot";
61
- KeyCodes[KeyCodes["numPadMinus"] = 109] = "numPadMinus";
62
- KeyCodes[KeyCodes["numPadMultiply"] = 106] = "numPadMultiply";
63
- KeyCodes[KeyCodes["numPadPlus"] = 107] = "numPadPlus";
64
- KeyCodes[KeyCodes["openBracket"] = 219] = "openBracket";
65
- KeyCodes[KeyCodes["pageDown"] = 34] = "pageDown";
66
- KeyCodes[KeyCodes["pageUp"] = 33] = "pageUp";
67
- KeyCodes[KeyCodes["period"] = 190] = "period";
68
- KeyCodes[KeyCodes["print"] = 44] = "print";
69
- KeyCodes[KeyCodes["quote"] = 222] = "quote";
70
- KeyCodes[KeyCodes["scrollLock"] = 145] = "scrollLock";
71
- KeyCodes[KeyCodes["shift"] = 16] = "shift";
72
- KeyCodes[KeyCodes["space"] = 32] = "space";
73
- KeyCodes[KeyCodes["tab"] = 9] = "tab";
74
- KeyCodes[KeyCodes["tilde"] = 192] = "tilde";
75
- KeyCodes[KeyCodes["windowsLeft"] = 91] = "windowsLeft";
76
- KeyCodes[KeyCodes["windowsOpera"] = 219] = "windowsOpera";
77
- KeyCodes[KeyCodes["windowsRight"] = 92] = "windowsRight";
78
- })(KeyCodes || (KeyCodes = {}));
79
3
  /**
80
4
  * String values for use with KeyboardEvent.key
81
5
  */
@@ -83,33 +7,16 @@ const keyArrowDown = "ArrowDown";
83
7
  const keyArrowLeft = "ArrowLeft";
84
8
  const keyArrowRight = "ArrowRight";
85
9
  const keyArrowUp = "ArrowUp";
10
+ const keyEnd = "End";
86
11
  const keyEnter = "Enter";
87
- const keyEscape = "Escape";
88
12
  const keyHome = "Home";
89
- const keyEnd = "End";
90
- const keyFunction2 = "F2";
91
- const keyPageDown = "PageDown";
92
- const keyPageUp = "PageUp";
93
13
  const keySpace = " ";
94
- const keyTab = "Tab";
95
- const ArrowKeys = {
96
- ArrowDown: keyArrowDown,
97
- ArrowLeft: keyArrowLeft,
98
- ArrowRight: keyArrowRight,
99
- ArrowUp: keyArrowUp,
100
- };
101
14
 
102
- exports.ArrowKeys = ArrowKeys;
103
15
  exports.keyArrowDown = keyArrowDown;
104
16
  exports.keyArrowLeft = keyArrowLeft;
105
17
  exports.keyArrowRight = keyArrowRight;
106
18
  exports.keyArrowUp = keyArrowUp;
107
19
  exports.keyEnd = keyEnd;
108
20
  exports.keyEnter = keyEnter;
109
- exports.keyEscape = keyEscape;
110
- exports.keyFunction2 = keyFunction2;
111
21
  exports.keyHome = keyHome;
112
- exports.keyPageDown = keyPageDown;
113
- exports.keyPageUp = keyPageUp;
114
22
  exports.keySpace = keySpace;
115
- exports.keyTab = keyTab;
package/shared/key-codes.js CHANGED
@@ -1,79 +1,3 @@
1
- /**
2
- * Key Code values
3
- * @deprecated - KeyCodes are deprecated, use individual string key exports
4
- */
5
- var KeyCodes;
6
- (function (KeyCodes) {
7
- KeyCodes[KeyCodes["alt"] = 18] = "alt";
8
- KeyCodes[KeyCodes["arrowDown"] = 40] = "arrowDown";
9
- KeyCodes[KeyCodes["arrowLeft"] = 37] = "arrowLeft";
10
- KeyCodes[KeyCodes["arrowRight"] = 39] = "arrowRight";
11
- KeyCodes[KeyCodes["arrowUp"] = 38] = "arrowUp";
12
- KeyCodes[KeyCodes["back"] = 8] = "back";
13
- KeyCodes[KeyCodes["backSlash"] = 220] = "backSlash";
14
- KeyCodes[KeyCodes["break"] = 19] = "break";
15
- KeyCodes[KeyCodes["capsLock"] = 20] = "capsLock";
16
- KeyCodes[KeyCodes["closeBracket"] = 221] = "closeBracket";
17
- KeyCodes[KeyCodes["colon"] = 186] = "colon";
18
- KeyCodes[KeyCodes["colon2"] = 59] = "colon2";
19
- KeyCodes[KeyCodes["comma"] = 188] = "comma";
20
- KeyCodes[KeyCodes["ctrl"] = 17] = "ctrl";
21
- KeyCodes[KeyCodes["delete"] = 46] = "delete";
22
- KeyCodes[KeyCodes["end"] = 35] = "end";
23
- KeyCodes[KeyCodes["enter"] = 13] = "enter";
24
- KeyCodes[KeyCodes["equals"] = 187] = "equals";
25
- KeyCodes[KeyCodes["equals2"] = 61] = "equals2";
26
- KeyCodes[KeyCodes["equals3"] = 107] = "equals3";
27
- KeyCodes[KeyCodes["escape"] = 27] = "escape";
28
- KeyCodes[KeyCodes["forwardSlash"] = 191] = "forwardSlash";
29
- KeyCodes[KeyCodes["function1"] = 112] = "function1";
30
- KeyCodes[KeyCodes["function10"] = 121] = "function10";
31
- KeyCodes[KeyCodes["function11"] = 122] = "function11";
32
- KeyCodes[KeyCodes["function12"] = 123] = "function12";
33
- KeyCodes[KeyCodes["function2"] = 113] = "function2";
34
- KeyCodes[KeyCodes["function3"] = 114] = "function3";
35
- KeyCodes[KeyCodes["function4"] = 115] = "function4";
36
- KeyCodes[KeyCodes["function5"] = 116] = "function5";
37
- KeyCodes[KeyCodes["function6"] = 117] = "function6";
38
- KeyCodes[KeyCodes["function7"] = 118] = "function7";
39
- KeyCodes[KeyCodes["function8"] = 119] = "function8";
40
- KeyCodes[KeyCodes["function9"] = 120] = "function9";
41
- KeyCodes[KeyCodes["home"] = 36] = "home";
42
- KeyCodes[KeyCodes["insert"] = 45] = "insert";
43
- KeyCodes[KeyCodes["menu"] = 93] = "menu";
44
- KeyCodes[KeyCodes["minus"] = 189] = "minus";
45
- KeyCodes[KeyCodes["minus2"] = 109] = "minus2";
46
- KeyCodes[KeyCodes["numLock"] = 144] = "numLock";
47
- KeyCodes[KeyCodes["numPad0"] = 96] = "numPad0";
48
- KeyCodes[KeyCodes["numPad1"] = 97] = "numPad1";
49
- KeyCodes[KeyCodes["numPad2"] = 98] = "numPad2";
50
- KeyCodes[KeyCodes["numPad3"] = 99] = "numPad3";
51
- KeyCodes[KeyCodes["numPad4"] = 100] = "numPad4";
52
- KeyCodes[KeyCodes["numPad5"] = 101] = "numPad5";
53
- KeyCodes[KeyCodes["numPad6"] = 102] = "numPad6";
54
- KeyCodes[KeyCodes["numPad7"] = 103] = "numPad7";
55
- KeyCodes[KeyCodes["numPad8"] = 104] = "numPad8";
56
- KeyCodes[KeyCodes["numPad9"] = 105] = "numPad9";
57
- KeyCodes[KeyCodes["numPadDivide"] = 111] = "numPadDivide";
58
- KeyCodes[KeyCodes["numPadDot"] = 110] = "numPadDot";
59
- KeyCodes[KeyCodes["numPadMinus"] = 109] = "numPadMinus";
60
- KeyCodes[KeyCodes["numPadMultiply"] = 106] = "numPadMultiply";
61
- KeyCodes[KeyCodes["numPadPlus"] = 107] = "numPadPlus";
62
- KeyCodes[KeyCodes["openBracket"] = 219] = "openBracket";
63
- KeyCodes[KeyCodes["pageDown"] = 34] = "pageDown";
64
- KeyCodes[KeyCodes["pageUp"] = 33] = "pageUp";
65
- KeyCodes[KeyCodes["period"] = 190] = "period";
66
- KeyCodes[KeyCodes["print"] = 44] = "print";
67
- KeyCodes[KeyCodes["quote"] = 222] = "quote";
68
- KeyCodes[KeyCodes["scrollLock"] = 145] = "scrollLock";
69
- KeyCodes[KeyCodes["shift"] = 16] = "shift";
70
- KeyCodes[KeyCodes["space"] = 32] = "space";
71
- KeyCodes[KeyCodes["tab"] = 9] = "tab";
72
- KeyCodes[KeyCodes["tilde"] = 192] = "tilde";
73
- KeyCodes[KeyCodes["windowsLeft"] = 91] = "windowsLeft";
74
- KeyCodes[KeyCodes["windowsOpera"] = 219] = "windowsOpera";
75
- KeyCodes[KeyCodes["windowsRight"] = 92] = "windowsRight";
76
- })(KeyCodes || (KeyCodes = {}));
77
1
  /**
78
2
  * String values for use with KeyboardEvent.key
79
3
  */
@@ -81,20 +5,9 @@ const keyArrowDown = "ArrowDown";
81
5
  const keyArrowLeft = "ArrowLeft";
82
6
  const keyArrowRight = "ArrowRight";
83
7
  const keyArrowUp = "ArrowUp";
8
+ const keyEnd = "End";
84
9
  const keyEnter = "Enter";
85
- const keyEscape = "Escape";
86
10
  const keyHome = "Home";
87
- const keyEnd = "End";
88
- const keyFunction2 = "F2";
89
- const keyPageDown = "PageDown";
90
- const keyPageUp = "PageUp";
91
11
  const keySpace = " ";
92
- const keyTab = "Tab";
93
- const ArrowKeys = {
94
- ArrowDown: keyArrowDown,
95
- ArrowLeft: keyArrowLeft,
96
- ArrowRight: keyArrowRight,
97
- ArrowUp: keyArrowUp,
98
- };
99
12
 
100
- export { ArrowKeys as A, keySpace as a, keyEscape as b, keyTab as c, keyEnd as d, keyArrowUp as e, keyArrowDown as f, keyHome as g, keyArrowRight as h, keyArrowLeft as i, keyPageDown as j, keyEnter as k, keyPageUp as l, keyFunction2 as m };
13
+ export { keyEnd as a, keyHome as b, keyArrowDown as c, keyArrowUp as d, keyArrowLeft as e, keyArrowRight as f, keyEnter as g, keySpace as k };