@deque/cauldron-react 3.0.1-canary.41ff0487 → 3.0.1-canary.46e5429f

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 (89) hide show
  1. package/lib/{add-user-075c63a1.js → add-user.js} +10 -12
  2. package/lib/arrow-circle.js +24 -0
  3. package/lib/{arrow-97011665.js → arrow.js} +13 -16
  4. package/lib/arrows-alt.js +24 -0
  5. package/lib/{bolt-e44406fd.js → bolt.js} +11 -12
  6. package/lib/cauldron.css +8 -8
  7. package/lib/{caution-e048e1bf.js → caution.js} +10 -12
  8. package/lib/{check-circle-8b5069b4.js → check-circle.js} +12 -13
  9. package/lib/{check-shield-8fdb3641.js → check-shield.js} +11 -13
  10. package/lib/{check-solid-a0682f04.js → check-solid.js} +12 -13
  11. package/lib/{check-c2912d5e.js → check.js} +12 -13
  12. package/lib/{checkbox-checked-a262e99c.js → checkbox-checked.js} +12 -13
  13. package/lib/{checkbox-unchecked-2ad5b4ae.js → checkbox-unchecked.js} +11 -12
  14. package/lib/chevron-double.js +24 -0
  15. package/lib/chevron.js +24 -0
  16. package/lib/{close-31ce4dcf.js → close.js} +12 -13
  17. package/lib/code.js +25 -0
  18. package/lib/components/Breadcrumb/Breadcrumb.d.ts +11 -0
  19. package/lib/components/Breadcrumb/BreadcrumbItem.d.ts +5 -0
  20. package/lib/components/Breadcrumb/BreadcrumbLink.d.ts +6 -0
  21. package/lib/components/Breadcrumb/index.d.ts +3 -0
  22. package/lib/components/FieldWrap/index.d.ts +7 -0
  23. package/lib/components/IssuePanel/index.d.ts +17 -0
  24. package/lib/components/Loader/index.d.ts +3 -3
  25. package/lib/components/LoaderOverlay/axe-loader.d.ts +1 -0
  26. package/lib/components/LoaderOverlay/index.d.ts +5 -1
  27. package/lib/components/Pagination/index.d.ts +20 -0
  28. package/lib/components/Panel/index.d.ts +13 -8
  29. package/lib/components/SideBar/SideBar.d.ts +1 -0
  30. package/lib/components/Tabs/Tabs.d.ts +7 -1
  31. package/lib/{copy-d2ade017.js → copy.js} +10 -12
  32. package/lib/{download-2790e982.js → download.js} +10 -12
  33. package/lib/exchange.js +24 -0
  34. package/lib/external-link.js +25 -0
  35. package/lib/{eye-a0d28243.js → eye.js} +10 -12
  36. package/lib/{filter-d2057f4c.js → filter.js} +10 -12
  37. package/lib/{flag-fb248a99.js → flag.js} +12 -13
  38. package/lib/gears.js +22 -0
  39. package/lib/{grid-ee446118.js → grid.js} +10 -12
  40. package/lib/{hamburger-menu-0fc0e266.js → hamburger-menu.js} +10 -11
  41. package/lib/highlight.js +24 -0
  42. package/lib/index.d.ts +4 -0
  43. package/lib/index.js +326 -145
  44. package/lib/{info-circle-alt-b1a696c7.js → info-circle-alt.js} +10 -12
  45. package/lib/{info-circle-b43f7a9b.js → info-circle.js} +11 -12
  46. package/lib/{info-square-f193e281.js → info-square.js} +10 -11
  47. package/lib/kabob.js +25 -0
  48. package/lib/{list-8fbd8209.js → list.js} +10 -11
  49. package/lib/{lock-bd0122db.js → lock.js} +12 -13
  50. package/lib/{magnifying-glass-2907fb77.js → magnifying-glass.js} +9 -11
  51. package/lib/{menu-2f2be7c2.js → menu.js} +11 -12
  52. package/lib/{new-releases-ac749bdd.js → new-releases.js} +13 -15
  53. package/lib/{new-6c3ac7d7.js → new.js} +11 -12
  54. package/lib/{no-bb3aa565.js → no.js} +12 -13
  55. package/lib/{pencil-4843058f.js → pencil.js} +11 -13
  56. package/lib/{plus-6589e613.js → plus.js} +11 -12
  57. package/lib/{question-circle-c3c634c4.js → question-circle.js} +11 -13
  58. package/lib/{radio-checked-006112fe.js → radio-checked.js} +11 -12
  59. package/lib/{radio-unchecked-a76e2d66.js → radio-unchecked.js} +11 -12
  60. package/lib/{recycle-0198fb67.js → recycle.js} +11 -12
  61. package/lib/robot.js +26 -0
  62. package/lib/run-again.js +23 -0
  63. package/lib/{save-edf5fc68.js → save.js} +12 -13
  64. package/lib/share.js +25 -0
  65. package/lib/{sort-49ec1442.js → sort.js} +11 -13
  66. package/lib/{star-a1af8d95.js → star.js} +11 -13
  67. package/lib/sun.js +24 -0
  68. package/lib/{tag-56c32f4f.js → tag.js} +11 -12
  69. package/lib/target.js +28 -0
  70. package/lib/trash.js +24 -0
  71. package/lib/{triangle-51d7723a.js → triangle.js} +14 -16
  72. package/lib/{upload-d71f0e44.js → upload.js} +10 -12
  73. package/package.json +3 -3
  74. package/lib/arrow-circle-7b95a2fd.js +0 -27
  75. package/lib/arrows-alt-b91e24b7.js +0 -26
  76. package/lib/chevron-064d5f96.js +0 -26
  77. package/lib/chevron-double-65975fca.js +0 -26
  78. package/lib/code-e3365341.js +0 -26
  79. package/lib/exchange-1d290efb.js +0 -26
  80. package/lib/external-link-ef122c95.js +0 -26
  81. package/lib/gears-b9ee1585.js +0 -23
  82. package/lib/highlight-81bfb759.js +0 -26
  83. package/lib/kabob-692fdc00.js +0 -26
  84. package/lib/robot-22863b2b.js +0 -29
  85. package/lib/run-again-c9777075.js +0 -25
  86. package/lib/share-70e94257.js +0 -26
  87. package/lib/sun-408aecdc.js +0 -26
  88. package/lib/target-50f179e0.js +0 -35
  89. package/lib/trash-896a3291.js +0 -26
package/lib/index.js CHANGED
@@ -191,75 +191,79 @@ var iconTypes = [
191
191
  ];
192
192
 
193
193
  function __variableDynamicImportRuntime0__(path) {
194
- switch (path) {
195
- case './icons/add-user.svg': return Promise.resolve().then(function () { return require('./add-user-075c63a1.js'); });
196
- case './icons/arrow-circle.svg': return Promise.resolve().then(function () { return require('./arrow-circle-7b95a2fd.js'); });
197
- case './icons/arrow.svg': return Promise.resolve().then(function () { return require('./arrow-97011665.js'); });
198
- case './icons/arrows-alt.svg': return Promise.resolve().then(function () { return require('./arrows-alt-b91e24b7.js'); });
199
- case './icons/bolt.svg': return Promise.resolve().then(function () { return require('./bolt-e44406fd.js'); });
200
- case './icons/caution.svg': return Promise.resolve().then(function () { return require('./caution-e048e1bf.js'); });
201
- case './icons/check-circle.svg': return Promise.resolve().then(function () { return require('./check-circle-8b5069b4.js'); });
202
- case './icons/check-shield.svg': return Promise.resolve().then(function () { return require('./check-shield-8fdb3641.js'); });
203
- case './icons/check-solid.svg': return Promise.resolve().then(function () { return require('./check-solid-a0682f04.js'); });
204
- case './icons/check.svg': return Promise.resolve().then(function () { return require('./check-c2912d5e.js'); });
205
- case './icons/checkbox-checked.svg': return Promise.resolve().then(function () { return require('./checkbox-checked-a262e99c.js'); });
206
- case './icons/checkbox-unchecked.svg': return Promise.resolve().then(function () { return require('./checkbox-unchecked-2ad5b4ae.js'); });
207
- case './icons/chevron-double.svg': return Promise.resolve().then(function () { return require('./chevron-double-65975fca.js'); });
208
- case './icons/chevron.svg': return Promise.resolve().then(function () { return require('./chevron-064d5f96.js'); });
209
- case './icons/close.svg': return Promise.resolve().then(function () { return require('./close-31ce4dcf.js'); });
210
- case './icons/code.svg': return Promise.resolve().then(function () { return require('./code-e3365341.js'); });
211
- case './icons/copy.svg': return Promise.resolve().then(function () { return require('./copy-d2ade017.js'); });
212
- case './icons/download.svg': return Promise.resolve().then(function () { return require('./download-2790e982.js'); });
213
- case './icons/exchange.svg': return Promise.resolve().then(function () { return require('./exchange-1d290efb.js'); });
214
- case './icons/external-link.svg': return Promise.resolve().then(function () { return require('./external-link-ef122c95.js'); });
215
- case './icons/eye.svg': return Promise.resolve().then(function () { return require('./eye-a0d28243.js'); });
216
- case './icons/filter.svg': return Promise.resolve().then(function () { return require('./filter-d2057f4c.js'); });
217
- case './icons/flag.svg': return Promise.resolve().then(function () { return require('./flag-fb248a99.js'); });
218
- case './icons/gears.svg': return Promise.resolve().then(function () { return require('./gears-b9ee1585.js'); });
219
- case './icons/grid.svg': return Promise.resolve().then(function () { return require('./grid-ee446118.js'); });
220
- case './icons/hamburger-menu.svg': return Promise.resolve().then(function () { return require('./hamburger-menu-0fc0e266.js'); });
221
- case './icons/highlight.svg': return Promise.resolve().then(function () { return require('./highlight-81bfb759.js'); });
222
- case './icons/info-circle-alt.svg': return Promise.resolve().then(function () { return require('./info-circle-alt-b1a696c7.js'); });
223
- case './icons/info-circle.svg': return Promise.resolve().then(function () { return require('./info-circle-b43f7a9b.js'); });
224
- case './icons/info-square.svg': return Promise.resolve().then(function () { return require('./info-square-f193e281.js'); });
225
- case './icons/kabob.svg': return Promise.resolve().then(function () { return require('./kabob-692fdc00.js'); });
226
- case './icons/list.svg': return Promise.resolve().then(function () { return require('./list-8fbd8209.js'); });
227
- case './icons/lock.svg': return Promise.resolve().then(function () { return require('./lock-bd0122db.js'); });
228
- case './icons/magnifying-glass.svg': return Promise.resolve().then(function () { return require('./magnifying-glass-2907fb77.js'); });
229
- case './icons/menu.svg': return Promise.resolve().then(function () { return require('./menu-2f2be7c2.js'); });
230
- case './icons/new-releases.svg': return Promise.resolve().then(function () { return require('./new-releases-ac749bdd.js'); });
231
- case './icons/new.svg': return Promise.resolve().then(function () { return require('./new-6c3ac7d7.js'); });
232
- case './icons/no.svg': return Promise.resolve().then(function () { return require('./no-bb3aa565.js'); });
233
- case './icons/pencil.svg': return Promise.resolve().then(function () { return require('./pencil-4843058f.js'); });
234
- case './icons/plus.svg': return Promise.resolve().then(function () { return require('./plus-6589e613.js'); });
235
- case './icons/question-circle.svg': return Promise.resolve().then(function () { return require('./question-circle-c3c634c4.js'); });
236
- case './icons/radio-checked.svg': return Promise.resolve().then(function () { return require('./radio-checked-006112fe.js'); });
237
- case './icons/radio-unchecked.svg': return Promise.resolve().then(function () { return require('./radio-unchecked-a76e2d66.js'); });
238
- case './icons/recycle.svg': return Promise.resolve().then(function () { return require('./recycle-0198fb67.js'); });
239
- case './icons/robot.svg': return Promise.resolve().then(function () { return require('./robot-22863b2b.js'); });
240
- case './icons/run-again.svg': return Promise.resolve().then(function () { return require('./run-again-c9777075.js'); });
241
- case './icons/save.svg': return Promise.resolve().then(function () { return require('./save-edf5fc68.js'); });
242
- case './icons/share.svg': return Promise.resolve().then(function () { return require('./share-70e94257.js'); });
243
- case './icons/sort.svg': return Promise.resolve().then(function () { return require('./sort-49ec1442.js'); });
244
- case './icons/star.svg': return Promise.resolve().then(function () { return require('./star-a1af8d95.js'); });
245
- case './icons/sun.svg': return Promise.resolve().then(function () { return require('./sun-408aecdc.js'); });
246
- case './icons/tag.svg': return Promise.resolve().then(function () { return require('./tag-56c32f4f.js'); });
247
- case './icons/target.svg': return Promise.resolve().then(function () { return require('./target-50f179e0.js'); });
248
- case './icons/trash.svg': return Promise.resolve().then(function () { return require('./trash-896a3291.js'); });
249
- case './icons/triangle.svg': return Promise.resolve().then(function () { return require('./triangle-51d7723a.js'); });
250
- case './icons/upload.svg': return Promise.resolve().then(function () { return require('./upload-d71f0e44.js'); });
251
- default: return Promise.reject(new Error("Unknown variable dynamic import: " + path));
194
+ switch (path) {
195
+ case './icons/add-user.svg': return Promise.resolve().then(function () { return require('./add-user.js'); });
196
+ case './icons/arrow-circle.svg': return Promise.resolve().then(function () { return require('./arrow-circle.js'); });
197
+ case './icons/arrow.svg': return Promise.resolve().then(function () { return require('./arrow.js'); });
198
+ case './icons/arrows-alt.svg': return Promise.resolve().then(function () { return require('./arrows-alt.js'); });
199
+ case './icons/bolt.svg': return Promise.resolve().then(function () { return require('./bolt.js'); });
200
+ case './icons/caution.svg': return Promise.resolve().then(function () { return require('./caution.js'); });
201
+ case './icons/check-circle.svg': return Promise.resolve().then(function () { return require('./check-circle.js'); });
202
+ case './icons/check-shield.svg': return Promise.resolve().then(function () { return require('./check-shield.js'); });
203
+ case './icons/check-solid.svg': return Promise.resolve().then(function () { return require('./check-solid.js'); });
204
+ case './icons/check.svg': return Promise.resolve().then(function () { return require('./check.js'); });
205
+ case './icons/checkbox-checked.svg': return Promise.resolve().then(function () { return require('./checkbox-checked.js'); });
206
+ case './icons/checkbox-unchecked.svg': return Promise.resolve().then(function () { return require('./checkbox-unchecked.js'); });
207
+ case './icons/chevron-double.svg': return Promise.resolve().then(function () { return require('./chevron-double.js'); });
208
+ case './icons/chevron.svg': return Promise.resolve().then(function () { return require('./chevron.js'); });
209
+ case './icons/close.svg': return Promise.resolve().then(function () { return require('./close.js'); });
210
+ case './icons/code.svg': return Promise.resolve().then(function () { return require('./code.js'); });
211
+ case './icons/copy.svg': return Promise.resolve().then(function () { return require('./copy.js'); });
212
+ case './icons/download.svg': return Promise.resolve().then(function () { return require('./download.js'); });
213
+ case './icons/exchange.svg': return Promise.resolve().then(function () { return require('./exchange.js'); });
214
+ case './icons/external-link.svg': return Promise.resolve().then(function () { return require('./external-link.js'); });
215
+ case './icons/eye.svg': return Promise.resolve().then(function () { return require('./eye.js'); });
216
+ case './icons/filter.svg': return Promise.resolve().then(function () { return require('./filter.js'); });
217
+ case './icons/flag.svg': return Promise.resolve().then(function () { return require('./flag.js'); });
218
+ case './icons/gears.svg': return Promise.resolve().then(function () { return require('./gears.js'); });
219
+ case './icons/grid.svg': return Promise.resolve().then(function () { return require('./grid.js'); });
220
+ case './icons/hamburger-menu.svg': return Promise.resolve().then(function () { return require('./hamburger-menu.js'); });
221
+ case './icons/highlight.svg': return Promise.resolve().then(function () { return require('./highlight.js'); });
222
+ case './icons/info-circle-alt.svg': return Promise.resolve().then(function () { return require('./info-circle-alt.js'); });
223
+ case './icons/info-circle.svg': return Promise.resolve().then(function () { return require('./info-circle.js'); });
224
+ case './icons/info-square.svg': return Promise.resolve().then(function () { return require('./info-square.js'); });
225
+ case './icons/kabob.svg': return Promise.resolve().then(function () { return require('./kabob.js'); });
226
+ case './icons/list.svg': return Promise.resolve().then(function () { return require('./list.js'); });
227
+ case './icons/lock.svg': return Promise.resolve().then(function () { return require('./lock.js'); });
228
+ case './icons/magnifying-glass.svg': return Promise.resolve().then(function () { return require('./magnifying-glass.js'); });
229
+ case './icons/menu.svg': return Promise.resolve().then(function () { return require('./menu.js'); });
230
+ case './icons/new-releases.svg': return Promise.resolve().then(function () { return require('./new-releases.js'); });
231
+ case './icons/new.svg': return Promise.resolve().then(function () { return require('./new.js'); });
232
+ case './icons/no.svg': return Promise.resolve().then(function () { return require('./no.js'); });
233
+ case './icons/pencil.svg': return Promise.resolve().then(function () { return require('./pencil.js'); });
234
+ case './icons/plus.svg': return Promise.resolve().then(function () { return require('./plus.js'); });
235
+ case './icons/question-circle.svg': return Promise.resolve().then(function () { return require('./question-circle.js'); });
236
+ case './icons/radio-checked.svg': return Promise.resolve().then(function () { return require('./radio-checked.js'); });
237
+ case './icons/radio-unchecked.svg': return Promise.resolve().then(function () { return require('./radio-unchecked.js'); });
238
+ case './icons/recycle.svg': return Promise.resolve().then(function () { return require('./recycle.js'); });
239
+ case './icons/robot.svg': return Promise.resolve().then(function () { return require('./robot.js'); });
240
+ case './icons/run-again.svg': return Promise.resolve().then(function () { return require('./run-again.js'); });
241
+ case './icons/save.svg': return Promise.resolve().then(function () { return require('./save.js'); });
242
+ case './icons/share.svg': return Promise.resolve().then(function () { return require('./share.js'); });
243
+ case './icons/sort.svg': return Promise.resolve().then(function () { return require('./sort.js'); });
244
+ case './icons/star.svg': return Promise.resolve().then(function () { return require('./star.js'); });
245
+ case './icons/sun.svg': return Promise.resolve().then(function () { return require('./sun.js'); });
246
+ case './icons/tag.svg': return Promise.resolve().then(function () { return require('./tag.js'); });
247
+ case './icons/target.svg': return Promise.resolve().then(function () { return require('./target.js'); });
248
+ case './icons/trash.svg': return Promise.resolve().then(function () { return require('./trash.js'); });
249
+ case './icons/triangle.svg': return Promise.resolve().then(function () { return require('./triangle.js'); });
250
+ case './icons/upload.svg': return Promise.resolve().then(function () { return require('./upload.js'); });
251
+ default: return new Promise(function(resolve, reject) {
252
+ (typeof queueMicrotask === 'function' ? queueMicrotask : setTimeout)(
253
+ reject.bind(null, new Error("Unknown variable dynamic import: " + path))
254
+ );
255
+ })
252
256
  }
253
257
  }
254
258
  var Icon = React.forwardRef(function (_a, ref) {
255
259
  var _b;
256
260
  var label = _a.label, className = _a.className, type = _a.type, other = tslib.__rest(_a, ["label", "className", "type"]);
257
261
  var isMounted = React.useRef(true);
258
- var _c = type.match(/(.*)-(right|left|up|down)$/) || [
262
+ var _c = tslib.__read(type.match(/(.*)-(right|left|up|down)$/) || [
259
263
  '',
260
264
  type
261
- ], name = _c[1], direction = _c[2];
262
- var _d = React.useState(null), IconSVG = _d[0], setIcon = _d[1];
265
+ ], 3), name = _c[1], direction = _c[2];
266
+ var _d = tslib.__read(React.useState(null), 2), IconSVG = _d[0], setIcon = _d[1];
263
267
  React.useEffect(function () {
264
268
  isMounted.current = true;
265
269
  // NOTE: we don't want to pollute test output with
@@ -475,9 +479,9 @@ var TopBar = /** @class */ (function (_super) {
475
479
  args[_i] = arguments[_i];
476
480
  }
477
481
  // @ts-ignore we're just spreading the original args
478
- _this.onKeyDown.apply(_this, args);
482
+ _this.onKeyDown.apply(_this, tslib.__spread(args));
479
483
  if (child.props.onKeyDown) {
480
- (_a = child.props).onKeyDown.apply(_a, args);
484
+ (_a = child.props).onKeyDown.apply(_a, tslib.__spread(args));
481
485
  }
482
486
  },
483
487
  tabIndex: 0,
@@ -513,7 +517,7 @@ var TopBar = /** @class */ (function (_super) {
513
517
  };
514
518
  TopBar.prototype.onKeyDown = function (e) {
515
519
  var key = keyname(e.which);
516
- var menuItems = tslib.__spreadArrays(this.menuItems);
520
+ var menuItems = tslib.__spread(this.menuItems);
517
521
  // account for hidden side bar trigger (hamburger)
518
522
  if (this.state.wide && this.props.hasTrigger) {
519
523
  menuItems.shift();
@@ -665,7 +669,7 @@ var ClickOutsideListener = /** @class */ (function (_super) {
665
669
  return ClickOutsideListener;
666
670
  }(React__default.Component));
667
671
 
668
- var _a = [38, 40, 9, 13, 32, 27], up = _a[0], down = _a[1], tab = _a[2], enter = _a[3], space = _a[4], esc = _a[5];
672
+ var _a = tslib.__read([38, 40, 9, 13, 32, 27], 6), up = _a[0], down = _a[1], tab = _a[2], enter = _a[3], space = _a[4], esc = _a[5];
669
673
  var OptionsMenuList = /** @class */ (function (_super) {
670
674
  tslib.__extends(OptionsMenuList, _super);
671
675
  function OptionsMenuList(props) {
@@ -793,7 +797,7 @@ var OptionsMenuList = /** @class */ (function (_super) {
793
797
  return OptionsMenuList;
794
798
  }(React__default.Component));
795
799
 
796
- var down$1 = [40][0];
800
+ var _a$1 = tslib.__read([40], 1), down$1 = _a$1[0];
797
801
  var OptionsMenu = /** @class */ (function (_super) {
798
802
  tslib.__extends(OptionsMenu, _super);
799
803
  function OptionsMenu(props) {
@@ -995,8 +999,8 @@ var NavBar = function (_a) {
995
999
  var children = _a.children, className = _a.className, _b = _a.collapsed, collapsed = _b === void 0 ? false : _b, _c = _a.navTriggerLabel, navTriggerLabel = _c === void 0 ? 'MAIN MENU' : _c, propId = _a.propId;
996
1000
  var navRef = React.useRef(null);
997
1001
  var triggerRef = React.useRef(null);
998
- var _d = React.useState(false), showDropdown = _d[0], setShowDropdown = _d[1];
999
- var menuId = ([propId] || nextId.useId(1, 'navbar'))[0];
1002
+ var _d = tslib.__read(React.useState(false), 2), showDropdown = _d[0], setShowDropdown = _d[1];
1003
+ var _e = tslib.__read([propId] || nextId.useId(1, 'navbar'), 1), menuId = _e[0];
1000
1004
  var showNavItems = !collapsed || (collapsed && showDropdown);
1001
1005
  var handleOutSideEvent = function (e) {
1002
1006
  var _a;
@@ -1132,9 +1136,9 @@ var SideBar = /** @class */ (function (_super) {
1132
1136
  SideBar.prototype.animate = function () {
1133
1137
  var _this = this;
1134
1138
  var show = this.props.show;
1135
- var _a = show
1139
+ var _a = tslib.__read(show
1136
1140
  ? ['SideBar--show', 'SideBar--show SideBar--active']
1137
- : ['SideBar--show', ''], first = _a[0], second = _a[1];
1141
+ : ['SideBar--show', ''], 2), first = _a[0], second = _a[1];
1138
1142
  this.setState({ animateClass: first });
1139
1143
  // css3 animations require transition classes to be added on separate tics
1140
1144
  setTimeout(function () {
@@ -1150,11 +1154,11 @@ var SideBar = /** @class */ (function (_super) {
1150
1154
  var _a = this.state, animateClass = _a.animateClass, wide = _a.wide;
1151
1155
  // disabling no-unused-vars to prevent onDismiss from being passed through to dom element
1152
1156
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
1153
- var _b = this.props, children = _b.children, className = _b.className, show = _b.show, onDismiss = _b.onDismiss, other = tslib.__rest(_b, ["children", "className", "show", "onDismiss"]);
1157
+ var _b = this.props, children = _b.children, className = _b.className, show = _b.show, onDismiss = _b.onDismiss, navProps = _b.navProps, other = tslib.__rest(_b, ["children", "className", "show", "onDismiss", "navProps"]);
1154
1158
  /* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
1155
1159
  return (React__default.createElement(React.Fragment, null,
1156
1160
  React__default.createElement(ClickOutsideListener, { onClickOutside: this.handleClickOutside },
1157
- React__default.createElement("nav", null,
1161
+ React__default.createElement("nav", tslib.__assign({}, navProps),
1158
1162
  React__default.createElement("ul", tslib.__assign({ className: classNames('SideBar', className, animateClass) }, other, { ref: this.navList, onKeyDown: this.onKeyDown }), children))),
1159
1163
  React__default.createElement(Scrim, { show: !wide && show })));
1160
1164
  /* eslint-enable jsx-a11y/no-noninteractive-element-interactions */
@@ -1468,14 +1472,14 @@ var fireCustomEvent = function (show, button) {
1468
1472
  function Tooltip(_a) {
1469
1473
  var _this = this;
1470
1474
  var propId = _a.id, _b = _a.placement, initialPlacement = _b === void 0 ? 'auto' : _b, children = _a.children, portal = _a.portal, target = _a.target, _c = _a.association, association = _c === void 0 ? 'aria-describedby' : _c, _d = _a.variant, variant = _d === void 0 ? 'text' : _d, _e = _a.show, showProp = _e === void 0 ? false : _e, _f = _a.hideElementOnHidden, hideElementOnHidden = _f === void 0 ? false : _f, className = _a.className, props = tslib.__rest(_a, ["id", "placement", "children", "portal", "target", "association", "variant", "show", "hideElementOnHidden", "className"]);
1471
- var id = (propId ? [propId] : nextId.useId(1, 'tooltip'))[0];
1475
+ var _g = tslib.__read(propId ? [propId] : nextId.useId(1, 'tooltip'), 1), id = _g[0];
1472
1476
  var hovering = React.useRef(false);
1473
- var _g = React.useState(initialPlacement), placement = _g[0], setPlacement = _g[1];
1474
- var _h = React.useState(!!showProp), showTooltip = _h[0], setShowTooltip = _h[1];
1475
- var _j = React.useState(null), targetElement = _j[0], setTargetElement = _j[1];
1476
- var _k = React.useState(null), tooltipElement = _k[0], setTooltipElement = _k[1];
1477
- var _l = React.useState(null), arrowElement = _l[0], setArrowElement = _l[1];
1478
- var _m = reactPopper.usePopper(targetElement, tooltipElement, {
1477
+ var _h = tslib.__read(React.useState(initialPlacement), 2), placement = _h[0], setPlacement = _h[1];
1478
+ var _j = tslib.__read(React.useState(!!showProp), 2), showTooltip = _j[0], setShowTooltip = _j[1];
1479
+ var _k = tslib.__read(React.useState(null), 2), targetElement = _k[0], setTargetElement = _k[1];
1480
+ var _l = tslib.__read(React.useState(null), 2), tooltipElement = _l[0], setTooltipElement = _l[1];
1481
+ var _m = tslib.__read(React.useState(null), 2), arrowElement = _m[0], setArrowElement = _m[1];
1482
+ var _o = reactPopper.usePopper(targetElement, tooltipElement, {
1479
1483
  placement: initialPlacement,
1480
1484
  modifiers: [
1481
1485
  { name: 'preventOverflow', options: { padding: 8 } },
@@ -1483,7 +1487,7 @@ function Tooltip(_a) {
1483
1487
  { name: 'offset', options: { offset: [0, 8] } },
1484
1488
  { name: 'arrow', options: { padding: 5, element: arrowElement } }
1485
1489
  ]
1486
- }), styles = _m.styles, attributes = _m.attributes, update = _m.update;
1490
+ }), styles = _o.styles, attributes = _o.attributes, update = _o.update;
1487
1491
  var show = function () { return tslib.__awaiter(_this, void 0, void 0, function () {
1488
1492
  return tslib.__generator(this, function (_a) {
1489
1493
  switch (_a.label) {
@@ -1643,6 +1647,13 @@ var IconButton = React.forwardRef(function (_a, ref) {
1643
1647
  accessibilityProps['aria-disabled'] = disabled;
1644
1648
  }
1645
1649
  }
1650
+ React.useEffect(function () {
1651
+ var _a;
1652
+ if (!disabled) {
1653
+ return;
1654
+ }
1655
+ (_a = internalRef.current) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-label', label);
1656
+ }, [disabled]);
1646
1657
  return (React__default.createElement(React__default.Fragment, null,
1647
1658
  React__default.createElement(Component, tslib.__assign({ className: classNames(className, {
1648
1659
  IconButton: true,
@@ -1729,19 +1740,29 @@ var Pointout = /** @class */ (function (_super) {
1729
1740
  }
1730
1741
  };
1731
1742
  _this.handleOffscreenFocusIn = function (_a) {
1743
+ var e_1, _b;
1732
1744
  var target = _a.target;
1733
- var _b = _this, offscreenRef = _b.offscreenRef, visibleRef = _b.visibleRef, getFocusableElements = _b.getFocusableElements;
1745
+ var _c = _this, offscreenRef = _c.offscreenRef, visibleRef = _c.visibleRef, getFocusableElements = _c.getFocusableElements;
1734
1746
  var offscreenFocusable = getFocusableElements(offscreenRef);
1735
1747
  var visibleFocusable = getFocusableElements(visibleRef);
1736
1748
  var elementIndex = offscreenFocusable.findIndex(function (element) { return element === target; });
1737
1749
  if (elementIndex === -1 || !visibleFocusable[elementIndex]) {
1738
1750
  return;
1739
1751
  }
1740
- // Tag focusable elements
1741
- for (var _i = 0, visibleFocusable_1 = visibleFocusable; _i < visibleFocusable_1.length; _i++) {
1742
- var element = visibleFocusable_1[_i];
1743
- element.setAttribute('data-focusable', 'true');
1744
- element.setAttribute('tabindex', '-1');
1752
+ try {
1753
+ // Tag focusable elements
1754
+ for (var visibleFocusable_1 = tslib.__values(visibleFocusable), visibleFocusable_1_1 = visibleFocusable_1.next(); !visibleFocusable_1_1.done; visibleFocusable_1_1 = visibleFocusable_1.next()) {
1755
+ var element = visibleFocusable_1_1.value;
1756
+ element.setAttribute('data-focusable', 'true');
1757
+ element.setAttribute('tabindex', '-1');
1758
+ }
1759
+ }
1760
+ catch (e_1_1) { e_1 = { error: e_1_1 }; }
1761
+ finally {
1762
+ try {
1763
+ if (visibleFocusable_1_1 && !visibleFocusable_1_1.done && (_b = visibleFocusable_1["return"])) _b.call(visibleFocusable_1);
1764
+ }
1765
+ finally { if (e_1) throw e_1.error; }
1745
1766
  }
1746
1767
  visibleFocusable[elementIndex].classList.add('Pointout--focus-active');
1747
1768
  };
@@ -1774,7 +1795,7 @@ var Pointout = /** @class */ (function (_super) {
1774
1795
  top -= rect.top - portalNode.scrollTop;
1775
1796
  left -= rect.left - portalNode.scrollLeft;
1776
1797
  }
1777
- var arrowBoxSide = arrowPosition.split('-')[0];
1798
+ var _e = tslib.__read(arrowPosition.split('-'), 1), arrowBoxSide = _e[0];
1778
1799
  var style;
1779
1800
  switch (arrowBoxSide) {
1780
1801
  case 'right':
@@ -2186,22 +2207,21 @@ Link.propTypes = {
2186
2207
  Link.displayName = 'Link';
2187
2208
 
2188
2209
  function Loader(_a) {
2189
- var label = _a.label, className = _a.className, other = tslib.__rest(_a, ["label", "className"]);
2190
- var props = tslib.__assign(tslib.__assign({}, other), { className: classNames('Loader', className), 'aria-hidden': !label });
2191
- if (label) {
2192
- props.role = 'progressbar';
2193
- props['aria-valuetext'] = label;
2194
- props['aria-busy'] = true;
2195
- props['aria-valuemin'] = 0;
2196
- props['aria-valuemax'] = 100;
2197
- // According to the ARIA 1.2 spec (https://www.w3.org/TR/wai-aria-1.2/#progressbar),
2198
- // the aria-valuenow attribute SHOULD be omitted because the "value" of our progress
2199
- // is "indeterminate".
2210
+ var className = _a.className, _b = _a.variant, variant = _b === void 0 ? 'small' : _b, label = _a.label, props = tslib.__rest(_a, ["className", "variant", "label"]);
2211
+ if (label === null || label === void 0 ? void 0 : label.length) {
2212
+ props['role'] = 'alert';
2213
+ props.children = React__default.createElement(Offscreen, null, label);
2200
2214
  }
2201
- return React__default.createElement("div", tslib.__assign({}, props));
2215
+ else {
2216
+ props['aria-hidden'] = true;
2217
+ }
2218
+ return (React__default.createElement("div", tslib.__assign({ className: classNames('Loader', className, variant === 'large'
2219
+ ? 'Loader--large'
2220
+ : variant === 'small'
2221
+ ? 'Loader--small'
2222
+ : '') }, props)));
2202
2223
  }
2203
2224
  Loader.propTypes = {
2204
- label: PropTypes.string,
2205
2225
  className: PropTypes.string
2206
2226
  };
2207
2227
  Loader.displayName = 'Loader';
@@ -2227,7 +2247,7 @@ var Select = React__default.forwardRef(function (_a, ref) {
2227
2247
  // eslint-disable-next-line @typescript-eslint/no-empty-function
2228
2248
  var onChangeEvent = onChange !== null && onChange !== void 0 ? onChange : (function () { });
2229
2249
  var isControlled = typeof value !== 'undefined';
2230
- var _c = React.useState(value || defaultValue || ''), currentValue = _c[0], setCurrentValue = _c[1];
2250
+ var _c = tslib.__read(React.useState(value || defaultValue || ''), 2), currentValue = _c[0], setCurrentValue = _c[1];
2231
2251
  var handleChange = function (e) {
2232
2252
  onChangeEvent(e);
2233
2253
  if (isControlled) {
@@ -2284,8 +2304,8 @@ var RadioGroup = function (_a) {
2284
2304
  _b = _a.onChange,
2285
2305
  // eslint-disable-next-line @typescript-eslint/no-empty-function
2286
2306
  onChange = _b === void 0 ? function () { } : _b, className = _a.className, other = tslib.__rest(_a, ["name", "radios", "defaultValue", "value", "onChange", "className"]);
2287
- var _c = React.useState(value || defaultValue || null), currentValue = _c[0], setCurrentValue = _c[1];
2288
- var _d = React.useState(null), focusIndex = _d[0], setFocusIndex = _d[1];
2307
+ var _c = tslib.__read(React.useState(value || defaultValue || null), 2), currentValue = _c[0], setCurrentValue = _c[1];
2308
+ var _d = tslib.__read(React.useState(null), 2), focusIndex = _d[0], setFocusIndex = _d[1];
2289
2309
  var inputs = React.useRef([]);
2290
2310
  var handleChange = function (value) { return setCurrentValue(value); };
2291
2311
  var onRadioFocus = function (index) { return setFocusIndex(index); };
@@ -2354,8 +2374,8 @@ RadioGroup.displayName = 'RadioGroup';
2354
2374
 
2355
2375
  var Checkbox = React.forwardRef(function (_a, ref) {
2356
2376
  var id = _a.id, label = _a.label, error = _a.error, checkboxRef = _a.checkboxRef, className = _a.className, onChange = _a.onChange, ariaDescribedby = _a["aria-describedby"], _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.checked, checked = _c === void 0 ? false : _c, other = tslib.__rest(_a, ["id", "label", "error", "checkboxRef", "className", "onChange", 'aria-describedby', "disabled", "checked"]);
2357
- var _d = React.useState(checked), isChecked = _d[0], setIsChecked = _d[1];
2358
- var _e = React.useState(false), focused = _e[0], setFocused = _e[1];
2377
+ var _d = tslib.__read(React.useState(checked), 2), isChecked = _d[0], setIsChecked = _d[1];
2378
+ var _e = tslib.__read(React.useState(false), 2), focused = _e[0], setFocused = _e[1];
2359
2379
  var checkRef = React.useRef(null);
2360
2380
  React.useEffect(function () {
2361
2381
  setIsChecked(checked);
@@ -7939,12 +7959,29 @@ Code.propTypes = {
7939
7959
  className: PropTypes.string
7940
7960
  };
7941
7961
 
7962
+ function AxeLoader() {
7963
+ return (React__default.createElement("svg", { version: "1.1", xmlns: "http://www.w3.org/2000/svg", x: "0", y: "0", viewBox: "0 0 800 800" },
7964
+ React__default.createElement("path", { fill: "currentColor", d: "M641.4 555.6c-27.2-12.1-59.1.2-71.2 27.3-.5 1-.8 2.1-1.2 3.2H160l227.6-394.3 170.1 292.8 32.4-18.8L387.5 117 95 623.6h474c4.9 13.1 14.8 24.4 28.6 30.5 7.1 3.2 14.5 4.7 21.8 4.7 20.7 0 40.4-11.9 49.3-32 12.1-27.1-.1-59.1-27.3-71.2zm1.6 59.8c-5.8 13-21.1 18.9-34 13.1-13-5.8-18.9-21.1-13.1-34 4.3-9.6 13.7-15.3 23.6-15.3 3.5 0 7.1.7 10.4 2.2 13.1 5.7 18.9 21 13.1 34z" }),
7965
+ React__default.createElement("path", { fill: "currentColor", d: "M379 549.9h-27.6v-16.7c-7.4 13.5-22.8 20.2-39 20.2-37.1 0-58.9-28.9-58.9-61.6 0-36.5 26.4-61.4 58.9-61.4 21.1 0 34 11.2 39 20.5V434H379v115.9zm-97.8-57.4c0 14.3 10.3 35.2 35.2 35.2 15.4 0 25.5-8 30.8-18.6 2.7-5.1 4-10.5 4.4-16.2.2-5.5-.8-11.2-3.2-16.2-4.9-11-15.6-20.5-32.3-20.5-22.4 0-35 18.1-35 36.1v.2zM436.2 488.9l-39-54.8h33.3l22.6 35.6 22.6-35.6h32.9l-38.8 54.8 43.2 61h-34L453.1 510l-26.2 39.9h-33.5l42.8-61z" })));
7966
+ }
7967
+
7942
7968
  var LoaderOverlay = React__default.forwardRef(function (_a, ref) {
7943
- var className = _a.className, other = tslib.__rest(_a, ["className"]);
7944
- return (React__default.createElement("div", tslib.__assign({ className: classNames('Loader__overlay', className), ref: ref }, other)));
7969
+ var className = _a.className, variant = _a.variant, label = _a.label, other = tslib.__rest(_a, ["className", "variant", "label"]);
7970
+ return (React__default.createElement("div", tslib.__assign({ className: classNames('Loader__overlay', className, variant === 'large'
7971
+ ? 'Loader__overlay--large'
7972
+ : variant === 'small'
7973
+ ? 'Loader__overlay--small'
7974
+ : ''), ref: ref }, other),
7975
+ React__default.createElement("div", { className: "Loader__overlay__loader" },
7976
+ React__default.createElement(Loader, { variant: variant }),
7977
+ React__default.createElement(AxeLoader, null)),
7978
+ label ? React__default.createElement("span", { className: "Loader__overlay__label" }, label) : null,
7979
+ other.children));
7945
7980
  });
7946
7981
  LoaderOverlay.propTypes = {
7947
- className: PropTypes.string
7982
+ className: PropTypes.string,
7983
+ variant: PropTypes.oneOf(['large', 'small']),
7984
+ label: PropTypes.string
7948
7985
  };
7949
7986
  LoaderOverlay.displayName = 'LoaderOverlay';
7950
7987
 
@@ -8047,9 +8084,29 @@ Tab.propTypes = {
8047
8084
  children: PropTypes.node
8048
8085
  };
8049
8086
 
8087
+ /**
8088
+ * Hook to be used similarly to the React.Component#componentDidMount.
8089
+ * Executes the provided `effect` when `dependencies` change but does not
8090
+ * execute the effect initially (on mount) - only on update.
8091
+ *
8092
+ * @param effect {Function} function to be executed when dependencies update
8093
+ * @param dependencies {Any} any valid dependency argument to React.useEffect
8094
+ */
8095
+ var useDidUpdate = function (effect, dependencies) {
8096
+ var mounted = React__default.useRef(false);
8097
+ React__default.useEffect(function () {
8098
+ if (!mounted.current) {
8099
+ mounted.current = true;
8100
+ return;
8101
+ }
8102
+ effect();
8103
+ }, dependencies);
8104
+ };
8105
+
8050
8106
  var Tabs = function (_a) {
8051
- var children = _a.children, thin = _a.thin, _b = _a.initialActiveIndex, initialActiveIndex = _b === void 0 ? 0 : _b, className = _a.className, labelProp = tslib.__rest(_a, ["children", "thin", "initialActiveIndex", "className"]);
8052
- var _c = React.useState(initialActiveIndex), activeIndex = _c[0], setActiveIndex = _c[1];
8107
+ var children = _a.children, thin = _a.thin, _b = _a.orientation, orientation = _b === void 0 ? 'horizontal' : _b, _c = _a.initialActiveIndex, initialActiveIndex = _c === void 0 ? 0 : _c, className = _a.className, onChange = _a.onChange, labelProp = tslib.__rest(_a, ["children", "thin", "orientation", "initialActiveIndex", "className", "onChange"]);
8108
+ var _d = tslib.__read(React.useState(initialActiveIndex), 2), activeIndex = _d[0], setActiveIndex = _d[1];
8109
+ var tabsRef = React.useRef(null);
8053
8110
  var focusedTabRef = React.useRef(null);
8054
8111
  var tabs = React__default.Children.toArray(children).filter(function (child) { return child.type === Tab; });
8055
8112
  var tabCount = tabs.length;
@@ -8059,34 +8116,48 @@ var Tabs = function (_a) {
8059
8116
  var handleKeyDown = function (event) {
8060
8117
  var key = event.key;
8061
8118
  var newIndex = activeIndex;
8119
+ var forward;
8120
+ var backward;
8121
+ if (orientation === 'horizontal') {
8122
+ forward = 'ArrowRight';
8123
+ backward = 'ArrowLeft';
8124
+ }
8125
+ else {
8126
+ forward = 'ArrowDown';
8127
+ backward = 'ArrowUp';
8128
+ }
8062
8129
  switch (key) {
8063
- case 'ArrowLeft': {
8130
+ case backward: {
8064
8131
  newIndex = activeIndex - 1;
8065
8132
  // circularity
8066
8133
  if (newIndex === -1) {
8067
8134
  newIndex = tabCount - 1;
8068
8135
  }
8069
8136
  setActiveIndex(newIndex);
8137
+ event.preventDefault();
8070
8138
  break;
8071
8139
  }
8072
- case 'ArrowRight': {
8140
+ case forward: {
8073
8141
  newIndex = activeIndex + 1;
8074
8142
  // circularity
8075
8143
  if (newIndex === tabCount) {
8076
8144
  newIndex = 0;
8077
8145
  }
8078
8146
  setActiveIndex(newIndex);
8147
+ event.preventDefault();
8079
8148
  break;
8080
8149
  }
8081
8150
  case 'Home': {
8082
8151
  newIndex = 0;
8083
8152
  setActiveIndex(newIndex);
8153
+ event.preventDefault();
8084
8154
  break;
8085
8155
  }
8086
8156
  case 'End': {
8087
8157
  event.preventDefault();
8088
8158
  newIndex = tabCount - 1;
8089
8159
  setActiveIndex(newIndex);
8160
+ event.preventDefault();
8090
8161
  break;
8091
8162
  }
8092
8163
  }
@@ -8096,7 +8167,7 @@ var Tabs = function (_a) {
8096
8167
  var _b;
8097
8168
  var _c = child.props, target = _c.target, propId = _c.id, other = tslib.__rest(_c, ["target", "id"]);
8098
8169
  var selected = index === activeIndex;
8099
- var id = (propId ? [propId] : nextId.useId(1, 'tab'))[0];
8170
+ var _d = tslib.__read(propId ? [propId] : nextId.useId(1, 'tab'), 1), id = _d[0];
8100
8171
  React.useEffect(function () {
8101
8172
  var _a;
8102
8173
  (_a = target.current) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-labelledby', id);
@@ -8114,10 +8185,15 @@ var Tabs = function (_a) {
8114
8185
  useDidUpdate(function () {
8115
8186
  var _a;
8116
8187
  (_a = focusedTabRef.current) === null || _a === void 0 ? void 0 : _a.focus();
8188
+ if (typeof onChange === 'function') {
8189
+ onChange({ activeTabIndex: activeIndex, target: focusedTabRef.current });
8190
+ }
8117
8191
  }, [activeIndex]);
8118
8192
  return (React__default.createElement("div", { className: classNames('Tabs', className, {
8119
- 'Tabs--thin': thin
8120
- }) },
8193
+ 'Tabs--thin': thin,
8194
+ 'Tabs--vertical': orientation === 'vertical',
8195
+ 'Tabs--horizontal': orientation === 'horizontal'
8196
+ }), ref: tabsRef },
8121
8197
  React__default.createElement("ul", tslib.__assign({ role: "tablist", className: "Tablist" }, labelProp, { onKeyDown: handleKeyDown }), tabComponents)));
8122
8198
  };
8123
8199
  Tabs.displayName = 'Tabs';
@@ -8127,12 +8203,13 @@ Tabs.propTypes = {
8127
8203
  'aria-labelledby': PropTypes.string,
8128
8204
  initialActiveIndex: PropTypes.number,
8129
8205
  thin: PropTypes.bool,
8206
+ orientation: PropTypes.string,
8130
8207
  className: PropTypes.string
8131
8208
  };
8132
8209
 
8133
8210
  var TabPanel = React.forwardRef(function (_a, ref) {
8134
8211
  var children = _a.children, propId = _a.id, className = _a.className, other = tslib.__rest(_a, ["children", "id", "className"]);
8135
- var id = (propId ? [propId] : nextId.useId(1, 'tabpanel'))[0];
8212
+ var _b = tslib.__read(propId ? [propId] : nextId.useId(1, 'tabpanel'), 1), id = _b[0];
8136
8213
  return (React__default.createElement("div", tslib.__assign({ role: "tabpanel", className: classNames('TabPanel', className), id: id, ref: ref }, other), children));
8137
8214
  });
8138
8215
  TabPanel.displayName = 'TabPanel';
@@ -8209,15 +8286,37 @@ Stepper.propTypes = {
8209
8286
  };
8210
8287
 
8211
8288
  var Panel = function (_a) {
8212
- var className = _a.className, _b = _a.title, title = _b === void 0 ? '' : _b, actions = _a.actions, children = _a.children;
8213
- return (React__default.createElement("div", { className: classNames('Panel', className) },
8214
- React__default.createElement("div", { className: "Panel__Header" },
8215
- title && React__default.createElement("div", { className: "Panel__Header-title" }, title),
8216
- actions && React__default.createElement("div", { className: "Panel__Header-actions" }, actions)),
8217
- React__default.createElement("div", { className: "Panel__Content" }, children)));
8289
+ var _b;
8290
+ var children = _a.children, collapsed = _a.collapsed, className = _a.className, heading = _a.heading, other = tslib.__rest(_a, ["children", "collapsed", "className", "heading"]);
8291
+ var Heading = "h" + (typeof heading === 'object' && 'level' in heading && !!heading.level
8292
+ ? heading.level
8293
+ : 2);
8294
+ var headingId = typeof heading === 'object' && 'id' in heading ? heading.id : randomId();
8295
+ return (React__default.createElement("section", tslib.__assign({ "aria-labelledby": headingId, className: classNames('Panel', className, (_b = {},
8296
+ _b['Panel--collapsed'] = collapsed,
8297
+ _b)) }, other),
8298
+ React__default.createElement(Heading, { id: headingId, className: "Panel__Heading" }, typeof heading === 'object' && 'text' in heading
8299
+ ? heading.text
8300
+ : heading),
8301
+ children));
8218
8302
  };
8219
8303
  Panel.displayName = 'Panel';
8220
8304
  Panel.propTypes = {
8305
+ children: PropTypes.node.isRequired,
8306
+ heading: PropTypes.oneOfType([PropTypes.object, PropTypes.node]).isRequired,
8307
+ className: PropTypes.string
8308
+ };
8309
+
8310
+ var IssuePanel = function (_a) {
8311
+ var className = _a.className, _b = _a.title, title = _b === void 0 ? '' : _b, actions = _a.actions, children = _a.children;
8312
+ return (React__default.createElement("div", { className: classNames('IssuePanel', className) },
8313
+ React__default.createElement("div", { className: "IssuePanel__Header" },
8314
+ title && React__default.createElement("div", { className: "IssuePanel__Header-title" }, title),
8315
+ actions && React__default.createElement("div", { className: "IssuePanel__Header-actions" }, actions)),
8316
+ React__default.createElement("div", { className: "IssuePanel__Content" }, children)));
8317
+ };
8318
+ IssuePanel.displayName = 'IssuePanel';
8319
+ IssuePanel.propTypes = {
8221
8320
  children: PropTypes.node.isRequired,
8222
8321
  className: PropTypes.string
8223
8322
  };
@@ -8262,31 +8361,97 @@ AddressCityStateZip.propTypes = {
8262
8361
  className: PropTypes.string
8263
8362
  };
8264
8363
 
8265
- /**
8266
- * Hook to be used similarly to the React.Component#componentDidMount.
8267
- * Executes the provided `effect` when `dependencies` change but does not
8268
- * execute the effect initially (on mount) - only on update.
8269
- *
8270
- * @param effect {Function} function to be executed when dependencies update
8271
- * @param dependencies {Any} any valid dependency argument to React.useEffect
8272
- */
8273
- var useDidUpdate = function (effect, dependencies) {
8274
- var mounted = React__default.useRef(false);
8275
- React__default.useEffect(function () {
8276
- if (!mounted.current) {
8277
- mounted.current = true;
8278
- return;
8279
- }
8280
- effect();
8281
- }, dependencies);
8364
+ var Pagination = React__default.forwardRef(function (_a, ref) {
8365
+ var totalItems = _a.totalItems, _b = _a.itemsPerPage, itemsPerPage = _b === void 0 ? 10 : _b, _c = _a.currentPage, currentPage = _c === void 0 ? 1 : _c, statusLabel = _a.statusLabel, _d = _a.firstPageLabel, firstPageLabel = _d === void 0 ? 'First page' : _d, _e = _a.previousPageLabel, previousPageLabel = _e === void 0 ? 'Previous page' : _e, _f = _a.nextPageLabel, nextPageLabel = _f === void 0 ? 'Next page' : _f, _g = _a.lastPageLabel, lastPageLabel = _g === void 0 ? 'Last page' : _g, _h = _a.tooltipPlacement, tooltipPlacement = _h === void 0 ? 'bottom' : _h, onNextPageClick = _a.onNextPageClick, onPreviousPageClick = _a.onPreviousPageClick, onFirstPageClick = _a.onFirstPageClick, onLastPageClick = _a.onLastPageClick, className = _a.className, other = tslib.__rest(_a, ["totalItems", "itemsPerPage", "currentPage", "statusLabel", "firstPageLabel", "previousPageLabel", "nextPageLabel", "lastPageLabel", "tooltipPlacement", "onNextPageClick", "onPreviousPageClick", "onFirstPageClick", "onLastPageClick", "className"]);
8366
+ var itemStart = currentPage * itemsPerPage - itemsPerPage + 1;
8367
+ var itemEnd = Math.min(itemStart + itemsPerPage - 1, totalItems);
8368
+ var isLastPage = itemEnd === totalItems;
8369
+ var isFirstPage = currentPage === 1;
8370
+ return (React__default.createElement("div", tslib.__assign({ ref: ref, className: classNames('Pagination', className) }, other),
8371
+ React__default.createElement("ul", null,
8372
+ React__default.createElement("li", null, isFirstPage ? (React__default.createElement(TooltipTabstop, { hideElementOnHidden: true, association: "aria-labelledby", tooltip: firstPageLabel, placement: tooltipPlacement },
8373
+ React__default.createElement(Icon, { type: "chevron-double-left" }))) : (React__default.createElement(IconButton, { icon: "chevron-double-left", tooltipPlacement: tooltipPlacement, label: firstPageLabel, onClick: onFirstPageClick }))),
8374
+ React__default.createElement("li", null, isFirstPage ? (React__default.createElement(TooltipTabstop, { hideElementOnHidden: true, association: "aria-labelledby", tooltip: previousPageLabel, placement: tooltipPlacement },
8375
+ React__default.createElement(Icon, { type: "chevron-left" }))) : (React__default.createElement(IconButton, { icon: "chevron-left", tooltipPlacement: tooltipPlacement, label: previousPageLabel, onClick: onPreviousPageClick }))),
8376
+ React__default.createElement("li", null,
8377
+ React__default.createElement("span", { role: "log", "aria-atomic": "true" }, statusLabel || (React__default.createElement("span", null,
8378
+ "Showing ",
8379
+ React__default.createElement("strong", null, itemStart),
8380
+ " of",
8381
+ ' ',
8382
+ React__default.createElement("strong", null, itemEnd),
8383
+ " of ",
8384
+ React__default.createElement("strong", null, totalItems))))),
8385
+ React__default.createElement("li", null, isLastPage ? (React__default.createElement(TooltipTabstop, { hideElementOnHidden: true, association: "aria-labelledby", tooltip: nextPageLabel, placement: tooltipPlacement },
8386
+ React__default.createElement(Icon, { type: "chevron-right" }))) : (React__default.createElement(IconButton, { icon: "chevron-right", tooltipPlacement: tooltipPlacement, label: nextPageLabel, onClick: onNextPageClick }))),
8387
+ React__default.createElement("li", null, isLastPage ? (React__default.createElement(TooltipTabstop, { hideElementOnHidden: true, association: "aria-labelledby", tooltip: lastPageLabel, placement: tooltipPlacement },
8388
+ React__default.createElement(Icon, { type: "chevron-double-right" }))) : (React__default.createElement(IconButton, { icon: "chevron-double-right", tooltipPlacement: tooltipPlacement, label: lastPageLabel, onClick: onLastPageClick }))))));
8389
+ });
8390
+ Pagination.displayName = 'Pagination';
8391
+ Pagination.propTypes = {
8392
+ totalItems: PropTypes.number.isRequired,
8393
+ itemsPerPage: PropTypes.number,
8394
+ currentPage: PropTypes.number,
8395
+ statusLabel: PropTypes.element,
8396
+ firstPageLabel: PropTypes.string,
8397
+ previousPageLabel: PropTypes.string,
8398
+ nextPageLabel: PropTypes.string,
8399
+ lastPageLabel: PropTypes.string,
8400
+ onNextPageClick: PropTypes.func,
8401
+ onPreviousPageClick: PropTypes.func,
8402
+ onFirstPageClick: PropTypes.func,
8403
+ onLastPageClick: PropTypes.func,
8404
+ // @ts-expect-error
8405
+ tooltipPlacement: PropTypes.string,
8406
+ className: PropTypes.string
8282
8407
  };
8283
8408
 
8409
+ var FieldWrap = React__default.forwardRef(function (_a, ref) {
8410
+ var children = _a.children, className = _a.className, _b = _a.as, Component = _b === void 0 ? 'div' : _b, props = tslib.__rest(_a, ["children", "className", "as"]);
8411
+ return (React__default.createElement(Component, tslib.__assign({ ref: ref, className: classNames('Panel', className) }, props), children));
8412
+ });
8413
+ FieldWrap.displayName = 'FieldWrap';
8414
+ FieldWrap.propTypes = {
8415
+ children: PropTypes.node.isRequired,
8416
+ className: PropTypes.string,
8417
+ as: PropTypes.string
8418
+ };
8419
+
8420
+ var Breadcrumb = React.forwardRef(function (_a, ref) {
8421
+ var _b = _a.separator, separator = _b === void 0 ? '/' : _b, className = _a.className, children = _a.children, props = tslib.__rest(_a, ["separator", "className", "children"]);
8422
+ var items = React__default.Children.toArray(children);
8423
+ var childrenWithSeparators = [];
8424
+ items.forEach(function (child, index) {
8425
+ if (index !== items.length - 1) {
8426
+ childrenWithSeparators.push(React__default.createElement(React__default.Fragment, null,
8427
+ child,
8428
+ React__default.createElement("span", { className: "Breadcrumb__Separator", "aria-hidden": "true" }, separator)));
8429
+ }
8430
+ else {
8431
+ childrenWithSeparators.push(child);
8432
+ }
8433
+ });
8434
+ return (React__default.createElement("nav", tslib.__assign({ className: classNames('Breadcrumb', className), ref: ref }, props),
8435
+ React__default.createElement("ol", null, childrenWithSeparators.map(function (child, index) { return (React__default.createElement("li", { className: "Breadcrumb__Item", key: "breadcrumb-" + index }, child)); }))));
8436
+ });
8437
+ Breadcrumb.displayName = 'Breadcrumb';
8438
+
8439
+ var BreadcrumbItem = React.forwardRef(function (_a, ref) {
8440
+ var className = _a.className, children = _a.children, props = tslib.__rest(_a, ["className", "children"]);
8441
+ return (React__default.createElement("span", tslib.__assign({ className: classNames('Breadcrumb__Item', className), ref: ref, "aria-current": "location" }, props), children));
8442
+ });
8443
+
8444
+ var BreadcrumbLink = React.forwardRef(function (_a, ref) {
8445
+ var className = _a.className, _b = _a.as, ElementType = _b === void 0 ? 'a' : _b, children = _a.children, props = tslib.__rest(_a, ["className", "as", "children"]);
8446
+ return (React__default.createElement(ElementType, tslib.__assign({ className: classNames('Link', 'Breadcrumb__Link', className), ref: ref }, props), children));
8447
+ });
8448
+
8284
8449
  var LIGHT_THEME_CLASS = 'cauldron--theme-light';
8285
8450
  var DARK_THEME_CLASS = 'cauldron--theme-dark';
8286
8451
  var ThemeContext = React.createContext({});
8287
8452
  var ThemeProvider = function (_a) {
8288
8453
  var children = _a.children, _b = _a.context, context = _b === void 0 ? document.body : _b, _c = _a.initialTheme, initialTheme = _c === void 0 ? 'light' : _c;
8289
- var _d = React.useState(initialTheme), theme = _d[0], setTheme = _d[1];
8454
+ var _d = tslib.__read(React.useState(initialTheme), 2), theme = _d[0], setTheme = _d[1];
8290
8455
  var getThemeFromContext = function () {
8291
8456
  return context.classList.contains(DARK_THEME_CLASS) ? 'dark' : 'light';
8292
8457
  };
@@ -8299,12 +8464,22 @@ var ThemeProvider = function (_a) {
8299
8464
  }, [context, theme]);
8300
8465
  // Use a MutationObserver to track changes to the classes outside of the context of React
8301
8466
  var handleMutation = function (mutationList) {
8302
- for (var _i = 0, mutationList_1 = mutationList; _i < mutationList_1.length; _i++) {
8303
- var mutation = mutationList_1[_i];
8304
- if (mutation.type === 'attributes' &&
8305
- mutation.attributeName === 'class') {
8306
- setTheme(getThemeFromContext());
8467
+ var e_1, _a;
8468
+ try {
8469
+ for (var mutationList_1 = tslib.__values(mutationList), mutationList_1_1 = mutationList_1.next(); !mutationList_1_1.done; mutationList_1_1 = mutationList_1.next()) {
8470
+ var mutation = mutationList_1_1.value;
8471
+ if (mutation.type === 'attributes' &&
8472
+ mutation.attributeName === 'class') {
8473
+ setTheme(getThemeFromContext());
8474
+ }
8475
+ }
8476
+ }
8477
+ catch (e_1_1) { e_1 = { error: e_1_1 }; }
8478
+ finally {
8479
+ try {
8480
+ if (mutationList_1_1 && !mutationList_1_1.done && (_a = mutationList_1["return"])) _a.call(mutationList_1);
8307
8481
  }
8482
+ finally { if (e_1) throw e_1.error; }
8308
8483
  }
8309
8484
  };
8310
8485
  React.useEffect(function () {
@@ -8337,6 +8512,9 @@ exports.Alert = Alert;
8337
8512
  exports.AlertActions = AlertActions;
8338
8513
  exports.AlertContent = AlertContent;
8339
8514
  exports.AriaIsolate = AriaIsolate;
8515
+ exports.Breadcrumb = Breadcrumb;
8516
+ exports.BreadcrumbItem = BreadcrumbItem;
8517
+ exports.BreadcrumbLink = BreadcrumbLink;
8340
8518
  exports.Button = Button;
8341
8519
  exports.Card = Card;
8342
8520
  exports.CardContent = CardContent;
@@ -8353,8 +8531,10 @@ exports.Dialog = Dialog;
8353
8531
  exports.DialogContent = DialogContent;
8354
8532
  exports.DialogFooter = DialogFooter;
8355
8533
  exports.ExpandCollapsePanel = ExpandCollapsePanel;
8534
+ exports.FieldWrap = FieldWrap;
8356
8535
  exports.Icon = Icon;
8357
8536
  exports.IconButton = IconButton;
8537
+ exports.IssuePanel = IssuePanel;
8358
8538
  exports.Layout = Layout;
8359
8539
  exports.Line = Line;
8360
8540
  exports.Link = Link;
@@ -8374,6 +8554,7 @@ exports.OptionsMenuItem = OptionsMenuItem;
8374
8554
  exports.OptionsMenuList = OptionsMenuList;
8375
8555
  exports.OptionsMenuTrigger = OptionsMenuTrigger;
8376
8556
  exports.OptionsMenuWrapper = OptionsMenuWrapper;
8557
+ exports.Pagination = Pagination;
8377
8558
  exports.Panel = Panel;
8378
8559
  exports.PanelTrigger = PanelTrigger$1;
8379
8560
  exports.Pointout = Pointout;