@splunk/react-ui 4.15.0 → 4.16.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 (69) hide show
  1. package/Animation.js +2 -2
  2. package/Button.js +32 -30
  3. package/ButtonSimple.js +54 -50
  4. package/CHANGELOG.md +27 -2
  5. package/Calendar.js +12 -12
  6. package/Card.js +10 -10
  7. package/Chip.js +10 -10
  8. package/CloseButton.js +8 -8
  9. package/CollapsiblePanel.js +8 -8
  10. package/Color.js +14 -14
  11. package/ColumnLayout.js +2 -2
  12. package/ComboBox.js +4 -4
  13. package/ControlGroup.js +26 -16
  14. package/Date.js +10 -5
  15. package/Dropdown.js +56 -15
  16. package/File.js +33 -24
  17. package/FormRows.js +6 -6
  18. package/Heading.js +10 -46
  19. package/Image.js +13 -13
  20. package/Link.js +2 -2
  21. package/MIGRATION.md +21 -0
  22. package/Menu.js +20 -20
  23. package/Message.js +24 -24
  24. package/MessageBar.js +24 -24
  25. package/Modal.js +7 -7
  26. package/Multiselect.js +197 -177
  27. package/Number.js +5 -5
  28. package/Paginator.js +19 -19
  29. package/Popover.js +7 -7
  30. package/Progress.js +2 -2
  31. package/Scroll.js +5 -5
  32. package/Search.js +4 -4
  33. package/Select.js +187 -167
  34. package/SplitButton.js +2 -2
  35. package/StepBar.js +10 -10
  36. package/Switch.js +4 -4
  37. package/TabBar.js +2 -2
  38. package/TabLayout.js +3 -0
  39. package/Table.js +95 -46
  40. package/Text.js +19 -19
  41. package/TextArea.js +15 -15
  42. package/Tooltip.js +5 -5
  43. package/Typography.js +1 -1
  44. package/WaitSpinner.js +2 -2
  45. package/package.json +6 -7
  46. package/types/src/Button/Button.d.ts +5 -2
  47. package/types/src/Button/docs/examples/Basic.d.ts +2 -2
  48. package/types/src/ButtonSimple/ButtonSimple.d.ts +10 -11
  49. package/types/src/Date/Icon.d.ts +1 -1
  50. package/types/src/Dropdown/Dropdown.d.ts +12 -7
  51. package/types/src/File/Icon.d.ts +1 -1
  52. package/types/src/File/IconCloud.d.ts +1 -1
  53. package/types/src/File/PaperClip.d.ts +1 -1
  54. package/types/src/File/Retry.d.ts +1 -1
  55. package/types/src/File/Trash.d.ts +1 -1
  56. package/types/src/Multiselect/Compact.d.ts +4 -0
  57. package/types/src/Multiselect/Multiselect.d.ts +4 -1
  58. package/types/src/Number/IncrementIcon.d.ts +1 -1
  59. package/types/src/Select/Select.d.ts +4 -2
  60. package/types/src/Select/SelectBase.d.ts +13 -1
  61. package/types/src/TabLayout/Panel.d.ts +3 -0
  62. package/types/src/TabLayout/TabLayout.d.ts +2 -0
  63. package/types/src/Table/Body.d.ts +2 -0
  64. package/types/src/Table/Row.d.ts +11 -3
  65. package/types/src/Table/Table.d.ts +5 -3
  66. package/types/src/Text/IconOutlinedHide.d.ts +1 -1
  67. package/types/src/Text/IconOutlinedView.d.ts +1 -1
  68. package/types/src/Tooltip/InfoIcon.d.ts +1 -1
  69. package/types/src/Typography/Typography.d.ts +1 -1
package/Animation.js CHANGED
@@ -102,7 +102,7 @@ __webpack_require__.d(__webpack_exports__, "Transition", function() { return /*
102
102
  var external_react_spring_ = __webpack_require__(26);
103
103
 
104
104
  // EXTERNAL MODULE: external "@splunk/react-ui/AnimationToggle"
105
- var AnimationToggle_ = __webpack_require__(47);
105
+ var AnimationToggle_ = __webpack_require__(48);
106
106
 
107
107
  // CONCATENATED MODULE: ./src/Animation/Animation.tsx
108
108
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
@@ -158,7 +158,7 @@ module.exports = require("react-spring");
158
158
 
159
159
  /***/ }),
160
160
 
161
- /***/ 47:
161
+ /***/ 48:
162
162
  /***/ (function(module, exports) {
163
163
 
164
164
  module.exports = require("@splunk/react-ui/AnimationToggle");
package/Button.js CHANGED
@@ -133,9 +133,9 @@ var Dropdown_ = __webpack_require__(24);
133
133
  var style_ = __webpack_require__(40);
134
134
 
135
135
  // EXTERNAL MODULE: ./src/icons/CaretDown.tsx
136
- var CaretDown = __webpack_require__(50);
136
+ var CaretDown = __webpack_require__(52);
137
137
 
138
- // EXTERNAL MODULE: external "@splunk/react-icons/External"
138
+ // EXTERNAL MODULE: external "@splunk/react-icons/enterprise/External"
139
139
  var External_ = __webpack_require__(60);
140
140
  var External_default = /*#__PURE__*/__webpack_require__.n(External_);
141
141
 
@@ -249,21 +249,25 @@ var StyledContentWrapper = external_styled_components_default.a.span.withConfig(
249
249
  displayName: "ButtonStyles__StyledContentWrapper",
250
250
  componentId: "eqxqs2-2"
251
251
  })(["display:flex;flex-direction:row;justify-content:center;align-items:center;max-width:100%;padding:", ";"], Object(themes_["pick"])({
252
- enterprise: Object(themes_["pickVariant"])('$error', {
253
- "true": '1px',
254
- "false": Object(themes_["pickVariant"])('$appearance', {
252
+ enterprise: function enterprise(_ref7) {
253
+ var $error = _ref7.$error;
254
+
255
+ if ($error) {
256
+ return '1px';
257
+ }
258
+
259
+ return Object(themes_["pickVariant"])('$appearance', {
255
260
  "default": '0',
256
261
  secondary: '0',
257
- destructive: '0',
258
- // === default
262
+ destructive: '1px',
259
263
  primary: '1px',
260
264
  pill: '0',
261
265
  toggle: '0',
262
266
  // === default
263
267
  flat: '0' // === default
264
268
 
265
- })
266
- }),
269
+ });
270
+ },
267
271
  prisma: Object(themes_["pickVariant"])('$appearance', {
268
272
  "default": 0,
269
273
  secondary: '1px 0',
@@ -281,8 +285,8 @@ var StyledLabel = external_styled_components_default.a.span.withConfig({
281
285
  })(["text-overflow:ellipsis;overflow:hidden;flex:0 1 auto;&:not(:last-child){padding-right:", ";}", ""], Object(themes_["pick"])({
282
286
  enterprise: '3px',
283
287
  prisma: '10px'
284
- }), function (_ref7) {
285
- var $isMenu = _ref7.$isMenu;
288
+ }), function (_ref8) {
289
+ var $isMenu = _ref8.$isMenu;
286
290
  return $isMenu && Object(external_styled_components_["css"])(["flex:1 1 auto;text-align:left;"]);
287
291
  });
288
292
  var StyledCaretWrapper = external_styled_components_default.a.span.withConfig({
@@ -376,16 +380,13 @@ var Button_Button = /*#__PURE__*/function (_Component) {
376
380
 
377
381
  var _super = _createSuper(Button);
378
382
 
379
- function Button() {
383
+ // @docs-props-type ButtonPropsBase
384
+ function Button(props) {
380
385
  var _this;
381
386
 
382
387
  _classCallCheck(this, Button);
383
388
 
384
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
385
- args[_key] = arguments[_key];
386
- }
387
-
388
- _this = _super.call.apply(_super, [this].concat(args));
389
+ _this = _super.call(this, props);
389
390
 
390
391
  _defineProperty(_assertThisInitialized(_this), "component", null);
391
392
 
@@ -408,6 +409,8 @@ var Button_Button = /*#__PURE__*/function (_Component) {
408
409
  _this.component = c;
409
410
  });
410
411
 
412
+ if (false) {}
413
+
411
414
  return _this;
412
415
  }
413
416
 
@@ -466,8 +469,7 @@ var Button_Button = /*#__PURE__*/function (_Component) {
466
469
  $inline: inline,
467
470
  $hasPrismaIcon: hasPrismaIcon,
468
471
  $isIconOnly: isIconOnly,
469
- $isMenu: isMenu,
470
- status: error ? 'error' : 'normal' // @ts-expect-error - this is problematic for two reasons:
472
+ $isMenu: isMenu // @ts-expect-error - this is problematic for two reasons:
471
473
  // * value is only a valid attribute on button (not on a)
472
474
  // * this component's value prop is of type any, which can result
473
475
  // in "[object Object]" attribute values
@@ -558,15 +560,15 @@ module.exports = require("@splunk/ui-utils/style");
558
560
 
559
561
  /***/ }),
560
562
 
561
- /***/ 50:
563
+ /***/ 52:
562
564
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
563
565
 
564
566
  "use strict";
565
567
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return CaretDown; });
566
568
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
567
569
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
568
- /* harmony import */ var _splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(51);
569
- /* harmony import */ var _splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1__);
570
+ /* harmony import */ var _splunk_react_icons_enterprise_Caret__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(53);
571
+ /* harmony import */ var _splunk_react_icons_enterprise_Caret__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_enterprise_Caret__WEBPACK_IMPORTED_MODULE_1__);
570
572
  /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
571
573
  /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
572
574
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -589,17 +591,17 @@ function Prisma24(_ref) {
589
591
 
590
592
  function CaretDown(props) {
591
593
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ThemedIcon__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"], _extends({
592
- Enterprise: _splunk_react_icons_Caret__WEBPACK_IMPORTED_MODULE_1___default.a,
594
+ Enterprise: _splunk_react_icons_enterprise_Caret__WEBPACK_IMPORTED_MODULE_1___default.a,
593
595
  Prisma24: Prisma24
594
596
  }, props));
595
597
  }
596
598
 
597
599
  /***/ }),
598
600
 
599
- /***/ 51:
601
+ /***/ 53:
600
602
  /***/ (function(module, exports) {
601
603
 
602
- module.exports = require("@splunk/react-icons/Caret");
604
+ module.exports = require("@splunk/react-icons/enterprise/Caret");
603
605
 
604
606
  /***/ }),
605
607
 
@@ -631,7 +633,7 @@ function SVG(props) {
631
633
  /***/ 60:
632
634
  /***/ (function(module, exports) {
633
635
 
634
- module.exports = require("@splunk/react-icons/External");
636
+ module.exports = require("@splunk/react-icons/enterprise/External");
635
637
 
636
638
  /***/ }),
637
639
 
@@ -732,8 +734,8 @@ function Icon(_ref) {
732
734
 
733
735
 
734
736
  if (prismaSize === 'small') {
735
- var SVG = Prisma16 || Prisma24;
736
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVG, _extends({
737
+ var SVGEnterprise = Prisma16 || Prisma24;
738
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVGEnterprise, _extends({
737
739
  width: "16",
738
740
  height: "16"
739
741
  }, prismaProps));
@@ -741,9 +743,9 @@ function Icon(_ref) {
741
743
 
742
744
 
743
745
  if (density === 'compact') {
744
- var _SVG = Prisma20 || Prisma24;
746
+ var _SVGEnterprise = Prisma20 || Prisma24;
745
747
 
746
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG, _extends({
748
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVGEnterprise, _extends({
747
749
  width: "20",
748
750
  height: "20"
749
751
  }, prismaProps));
package/ButtonSimple.js CHANGED
@@ -307,15 +307,15 @@ var enterprisePrimary = Object(external_styled_components_["css"])(["", ";font-w
307
307
  var $selected = _ref9.$selected;
308
308
  return $selected && Object(external_styled_components_["css"])(["box-shadow:", ";background-color:", ";"], primarySelectedShadow, themes_["variables"].brandColorD20);
309
309
  });
310
- var enterpriseError = Object(external_styled_components_["css"])(["", ";font-weight:", ";", " &:not([disabled]){background-color:", ";color:", ";box-shadow:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " ", " &:hover{background-color:", ";}&:active{background-color:", ";transition:none;}&:focus{box-shadow:", ",", ";&:active{background-color:", ";transition:none;}}}&[disabled]{color:", ";background-color:", ";cursor:not-allowed;", "}"], enterpriseStyles_common, themes_["variables"].fontWeightSemiBold, enterpriseStyles_appendPrepend, themes_["variables"].errorColor, themes_["variables"].white, primaryShadow, function (_ref10) {
310
+ var enterpriseError = Object(external_styled_components_["css"])(["", ";font-weight:", ";", " &:not([disabled]){background-color:", ";color:", ";box-shadow:", ";transition:background-image 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " ", " &:hover{background-color:", ";}&:active{background-color:", ";transition:none;}&:focus{box-shadow:", ",", ";&:active{background-color:", ";transition:none;}}}&[disabled]{color:", ";background-color:", ";cursor:not-allowed;", "}"], enterpriseStyles_common, themes_["variables"].fontWeightSemiBold, enterpriseStyles_appendPrepend, themes_["variables"].errorColorD10, themes_["variables"].white, primaryShadow, function (_ref10) {
311
311
  var $selected = _ref10.$selected;
312
- return $selected && Object(external_styled_components_["css"])(["box-shadow:", ";background-color:", ";"], primarySelectedShadow, themes_["variables"].errorColorD20);
312
+ return $selected && Object(external_styled_components_["css"])(["box-shadow:", ";background-color:", ";"], primarySelectedShadow, themes_["variables"].errorColorD30);
313
313
  }, function (_ref11) {
314
314
  var $prepend = _ref11.$prepend;
315
- return $prepend && Object(external_styled_components_["css"])(["border-left:1px solid ", ";"], themes_["variables"].errorColorD20);
316
- }, themes_["variables"].errorColorD20, themes_["variables"].errorColorD30, primaryShadow, themes_["variables"].focusShadow, themes_["variables"].errorColorD30, themes_["variables"].errorColorL30, themes_["variables"].errorColorL10, function (_ref12) {
315
+ return $prepend && Object(external_styled_components_["css"])(["border-left:1px solid ", ";"], themes_["variables"].errorColorD30);
316
+ }, themes_["variables"].errorColorD30, themes_["variables"].errorColorD40, primaryShadow, themes_["variables"].focusShadow, themes_["variables"].errorColorD40, themes_["variables"].errorColorL10, themes_["variables"].errorColorD10, function (_ref12) {
317
317
  var $selected = _ref12.$selected;
318
- return $selected && Object(external_styled_components_["css"])(["box-shadow:", ";background-color:", ";"], primarySelectedShadow, themes_["variables"].errorColorD20);
318
+ return $selected && Object(external_styled_components_["css"])(["box-shadow:", ";background-color:", ";"], primarySelectedShadow, themes_["variables"].errorColorD40);
319
319
  });
320
320
  var enterprisePill = Object(external_styled_components_["css"])(["", ";color:", ";border:1px solid transparent;&:not([disabled]){transition:background-color 0.2s,border 0.2s,box-shadow 0.2s,text-decoration 0.2s;", " &:hover{color:", ";background-color:", ";border-color:", ";}", " &:focus{color:", ";box-shadow:", ";}&:active,&[aria-expanded='true']{background-color:", ";transition:none;}}&[disabled]{color:", ";cursor:not-allowed;", "}"], enterpriseStyles_common, Object(themes_["pick"])({
321
321
  light: themes_["variables"].gray45,
@@ -357,6 +357,7 @@ var StyledClickable = external_styled_components_default()(Clickable_default.a).
357
357
  enterpriseSecondary: enterpriseDefault,
358
358
  enterprisePrimary: enterprisePrimary,
359
359
  enterpriseError: enterpriseError,
360
+ enterpriseDestructive: enterpriseError,
360
361
  enterprisePill: enterprisePill,
361
362
  prismaDefault: prismaTransparent,
362
363
  prismaDestructive: prismaFilled,
@@ -410,23 +411,50 @@ var propTypes = {
410
411
  children: external_prop_types_default.a.node,
411
412
  disabled: external_prop_types_default.a.bool,
412
413
  elementRef: external_prop_types_default.a.oneOfType([external_prop_types_default.a.func, external_prop_types_default.a.object]),
414
+ error: external_prop_types_default.a.bool,
413
415
  inline: external_prop_types_default.a.bool,
414
416
  openInNewContext: external_prop_types_default.a.bool,
415
417
  prepend: external_prop_types_default.a.bool,
416
418
  selected: external_prop_types_default.a.bool,
417
419
  splunkTheme: external_prop_types_default.a.object,
418
- status: external_prop_types_default.a.oneOf(['normal', 'error']),
419
420
  to: external_prop_types_default.a.string
420
421
  };
421
422
  var defaultProps = {
422
423
  appearance: 'default',
423
424
  append: false,
424
425
  disabled: false,
426
+ error: false,
425
427
  inline: true,
426
428
  openInNewContext: false,
427
429
  prepend: false,
428
- selected: false,
429
- status: 'normal'
430
+ selected: false
431
+ };
432
+
433
+ var mapVariant = function mapVariant(appearance, family) {
434
+ var enterprise = {
435
+ "default": 'enterpriseDefault',
436
+ destructive: 'enterpriseError',
437
+ primary: 'enterprisePrimary',
438
+ secondary: 'enterpriseSecondary',
439
+ pill: 'enterprisePill',
440
+ toggle: 'enterpriseDefault',
441
+ flat: 'enterpriseDefault'
442
+ };
443
+ var prisma = {
444
+ "default": 'prismaDefault',
445
+ destructive: 'prismaDestructive',
446
+ primary: 'prismaPrimary',
447
+ secondary: 'prismaSecondary',
448
+ pill: 'prismaSecondary',
449
+ toggle: 'prismaToggle',
450
+ flat: 'prismaFlat'
451
+ };
452
+
453
+ if (family === 'enterprise') {
454
+ return enterprise[appearance];
455
+ }
456
+
457
+ return prisma[appearance];
430
458
  };
431
459
 
432
460
  var ButtonSimple_ButtonSimple = /*#__PURE__*/function (_Component) {
@@ -466,57 +494,33 @@ var ButtonSimple_ButtonSimple = /*#__PURE__*/function (_Component) {
466
494
  (_this$component = this.component) === null || _this$component === void 0 ? void 0 : _this$component.focus();
467
495
  }
468
496
  }, {
469
- key: "mapVariant",
470
- value: function mapVariant() {
497
+ key: "render",
498
+ value: function render() {
471
499
  var _this$props = this.props,
472
- splunkTheme = _this$props.splunkTheme,
473
500
  appearance = _this$props.appearance,
474
- status = _this$props.status;
475
- var enterprise = {
476
- "default": 'enterpriseDefault',
477
- destructive: 'enterpriseDefault',
478
- primary: 'enterprisePrimary',
479
- secondary: 'enterpriseSecondary',
480
- pill: 'enterprisePill',
481
- toggle: 'enterpriseDefault',
482
- flat: 'enterpriseDefault'
483
- };
484
- var prisma = {
485
- "default": 'prismaDefault',
486
- destructive: 'prismaDestructive',
487
- primary: 'prismaPrimary',
488
- secondary: 'prismaSecondary',
489
- pill: 'prismaSecondary',
490
- toggle: 'prismaToggle',
491
- flat: 'prismaFlat'
492
- };
493
-
494
- if (splunkTheme.family === 'enterprise') {
495
- return status === 'error' ? 'enterpriseError' : enterprise[appearance];
496
- }
501
+ append = _this$props.append,
502
+ children = _this$props.children,
503
+ error = _this$props.error,
504
+ prepend = _this$props.prepend,
505
+ selected = _this$props.selected,
506
+ splunkTheme = _this$props.splunkTheme,
507
+ otherProps = _objectWithoutProperties(_this$props, ["appearance", "append", "children", "error", "prepend", "selected", "splunkTheme"]);
497
508
 
498
- return prisma[appearance];
499
- }
500
- }, {
501
- key: "render",
502
- value: function render() {
503
- var _this$props2 = this.props,
504
- append = _this$props2.append,
505
- children = _this$props2.children,
506
- prepend = _this$props2.prepend,
507
- selected = _this$props2.selected,
508
- status = _this$props2.status,
509
- otherProps = _objectWithoutProperties(_this$props2, ["append", "children", "prepend", "selected", "status"]);
509
+ var variant = appearance;
510
+
511
+ if (splunkTheme.isEnterprise) {
512
+ variant = error ? 'destructive' : appearance;
513
+ }
510
514
 
511
515
  return /*#__PURE__*/external_react_default.a.createElement(StyledClickable, _extends({
512
- "aria-invalid": status === 'error' || undefined,
516
+ "aria-invalid": error,
513
517
  "data-test": "button-simple",
514
518
  ref: this.handleMount,
515
- $variant: this.mapVariant(),
516
- $error: status === 'error',
519
+ $variant: mapVariant(variant, splunkTheme.family),
517
520
  $append: append,
518
521
  $prepend: prepend,
519
- $selected: selected
522
+ $selected: selected,
523
+ $error: error
520
524
  }, otherProps), children, selected && /*#__PURE__*/external_react_default.a.createElement(ScreenReaderContent_default.a, null, Object(i18n_["_"])('Selected')));
521
525
  }
522
526
  }]);
package/CHANGELOG.md CHANGED
@@ -1,6 +1,30 @@
1
1
  Change Log
2
2
  ============
3
3
 
4
+ 4.16.1 - January 25, 2023
5
+ ----------
6
+ Bug Fixes:
7
+ * `Select` and `Multiselect` now can be opened with the up and down arrow keys (SUI-3527).
8
+ * Updated `ControlGroup` to fix `labelPosition="top"` misalignment in Prisma themes (SUI-5278).
9
+ * Note: this may cause slight layout changes for existing usages of `ControlGroup`.
10
+ * `axe-html-reporter` no longer incorrectly listed as a dependency.
11
+
12
+ 4.16.0 - January 10, 2023
13
+ ----------
14
+ New Features:
15
+ * Added `data-test` selectors to `File` (SUI-5205).
16
+ * Added `primaryColumnIndex` prop to `Table` and `rowScreenReaderText` prop to `Table.Row` to improve screen reader usability of selectable rows (SUI-5044).
17
+ * `Button` supports `appearance="destructive"` in Enterprise themes (SUI-5082).
18
+ * `TabLayout` supports `count` prop (SUI-5080).
19
+ * `Typography`'s `color` prop now supports `inherit` option.
20
+
21
+ Bug Fixes:
22
+ * `Select`, `Button`, `RadioBar`, `ButtonGroup` error state background color has been updated in enterprise themes to improve contrast (SUI-5082).
23
+
24
+ Deprecations:
25
+ * `Button`'s `error` prop has been deprecated and will be removed in a future major version. Use `appearance="destructive"` instead (SUI-5082).
26
+
27
+
4
28
  4.15.0 - December 6, 2022
5
29
  ----------
6
30
  New Features:
@@ -9,7 +33,7 @@ New Features:
9
33
  * This property supports `true`, `false`, and `"controlled"` as values, similar to `Select`.
10
34
  * If this is set, the `controlledFilter` prop is ignored because `filter="controlled"` has identical functionality.
11
35
 
12
- Bug Fixes:
36
+ Bug Fixes:
13
37
  * Added missing type definition files for `TextArea` and `Divider` (SUI-5154).
14
38
  * Fixes missing `data-test="fixed-head"` test hook in `Table` (SUI-5157).
15
39
  * Added SSR support for `Select`
@@ -26,6 +50,7 @@ Bug Fixes:
26
50
  * This allows for a grace period when the user can leave and return to the `Tooltip`.
27
51
  * This is similar to the old disappear behavior, but without the issue where a mostly-invisible tooltip accepts mouse interaction.
28
52
  * `onRequestOpen` and `onRequestClose` callbacks will no longer trigger when the mouse moves between the `Tooltip` `anchor` and `Popover`.
53
+ * `Date` now shows the correct cursor type along the outer edge of the input when disabled.
29
54
 
30
55
  4.14.0 - November 1, 2022
31
56
  ----------
@@ -895,7 +920,7 @@ Bug Fixes:
895
920
  * Changed primary and error `Button` font weight to semibold (SUI-1350).
896
921
  * Corrected hover color on `Button` (SUI-1364).
897
922
 
898
- 1.1.0 - January 24, 2018
923
+ 1.1.0 - January 25, 2018
899
924
  ----------
900
925
  New Features:
901
926
  * DOM hook added to `RenderToLayer` to facilitate interactions with Backbone components (SUI-1327).
package/Calendar.js CHANGED
@@ -1127,8 +1127,8 @@ module.exports = require("styled-components");
1127
1127
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return ChevronRight; });
1128
1128
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
1129
1129
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
1130
- /* harmony import */ var _splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(44);
1131
- /* harmony import */ var _splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1__);
1130
+ /* harmony import */ var _splunk_react_icons_enterprise_ChevronRight__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(44);
1131
+ /* harmony import */ var _splunk_react_icons_enterprise_ChevronRight__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_enterprise_ChevronRight__WEBPACK_IMPORTED_MODULE_1__);
1132
1132
  /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
1133
1133
  /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
1134
1134
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -1162,7 +1162,7 @@ function Prisma16(_ref2) {
1162
1162
 
1163
1163
  function ChevronRight(props) {
1164
1164
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ThemedIcon__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"], _extends({
1165
- Enterprise: _splunk_react_icons_ChevronRight__WEBPACK_IMPORTED_MODULE_1___default.a,
1165
+ Enterprise: _splunk_react_icons_enterprise_ChevronRight__WEBPACK_IMPORTED_MODULE_1___default.a,
1166
1166
  Prisma16: Prisma16,
1167
1167
  Prisma24: Prisma24
1168
1168
  }, props));
@@ -1180,7 +1180,7 @@ module.exports = require("@splunk/ui-utils/i18n");
1180
1180
  /***/ 44:
1181
1181
  /***/ (function(module, exports) {
1182
1182
 
1183
- module.exports = require("@splunk/react-icons/ChevronRight");
1183
+ module.exports = require("@splunk/react-icons/enterprise/ChevronRight");
1184
1184
 
1185
1185
  /***/ }),
1186
1186
 
@@ -1306,8 +1306,8 @@ function Icon(_ref) {
1306
1306
 
1307
1307
 
1308
1308
  if (prismaSize === 'small') {
1309
- var SVG = Prisma16 || Prisma24;
1310
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVG, _extends({
1309
+ var SVGEnterprise = Prisma16 || Prisma24;
1310
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVGEnterprise, _extends({
1311
1311
  width: "16",
1312
1312
  height: "16"
1313
1313
  }, prismaProps));
@@ -1315,9 +1315,9 @@ function Icon(_ref) {
1315
1315
 
1316
1316
 
1317
1317
  if (density === 'compact') {
1318
- var _SVG = Prisma20 || Prisma24;
1318
+ var _SVGEnterprise = Prisma20 || Prisma24;
1319
1319
 
1320
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG, _extends({
1320
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVGEnterprise, _extends({
1321
1321
  width: "20",
1322
1322
  height: "20"
1323
1323
  }, prismaProps));
@@ -1355,8 +1355,8 @@ module.exports = require("@splunk/react-ui/Box");
1355
1355
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return ChevronLeft; });
1356
1356
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
1357
1357
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
1358
- /* harmony import */ var _splunk_react_icons_ChevronLeft__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(84);
1359
- /* harmony import */ var _splunk_react_icons_ChevronLeft__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_ChevronLeft__WEBPACK_IMPORTED_MODULE_1__);
1358
+ /* harmony import */ var _splunk_react_icons_enterprise_ChevronLeft__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(84);
1359
+ /* harmony import */ var _splunk_react_icons_enterprise_ChevronLeft__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_enterprise_ChevronLeft__WEBPACK_IMPORTED_MODULE_1__);
1360
1360
  /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
1361
1361
  /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
1362
1362
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -1390,7 +1390,7 @@ function Prisma16(_ref2) {
1390
1390
 
1391
1391
  function ChevronLeft(props) {
1392
1392
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ThemedIcon__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"], _extends({
1393
- Enterprise: _splunk_react_icons_ChevronLeft__WEBPACK_IMPORTED_MODULE_1___default.a,
1393
+ Enterprise: _splunk_react_icons_enterprise_ChevronLeft__WEBPACK_IMPORTED_MODULE_1___default.a,
1394
1394
  Prisma16: Prisma16,
1395
1395
  Prisma24: Prisma24
1396
1396
  }, props));
@@ -1401,7 +1401,7 @@ function ChevronLeft(props) {
1401
1401
  /***/ 84:
1402
1402
  /***/ (function(module, exports) {
1403
1403
 
1404
- module.exports = require("@splunk/react-icons/ChevronLeft");
1404
+ module.exports = require("@splunk/react-icons/enterprise/ChevronLeft");
1405
1405
 
1406
1406
  /***/ }),
1407
1407
 
package/Card.js CHANGED
@@ -267,7 +267,7 @@ var Dropdown_ = __webpack_require__(24);
267
267
  var Dropdown_default = /*#__PURE__*/__webpack_require__.n(Dropdown_);
268
268
 
269
269
  // EXTERNAL MODULE: external "@splunk/themes/useSplunkTheme"
270
- var useSplunkTheme_ = __webpack_require__(52);
270
+ var useSplunkTheme_ = __webpack_require__(54);
271
271
  var useSplunkTheme_default = /*#__PURE__*/__webpack_require__.n(useSplunkTheme_);
272
272
 
273
273
  // EXTERNAL MODULE: ./src/icons/MoreVertical.tsx
@@ -694,7 +694,7 @@ module.exports = require("@splunk/ui-utils/i18n");
694
694
 
695
695
  /***/ }),
696
696
 
697
- /***/ 52:
697
+ /***/ 54:
698
698
  /***/ (function(module, exports) {
699
699
 
700
700
  module.exports = require("@splunk/themes/useSplunkTheme");
@@ -816,8 +816,8 @@ function Icon(_ref) {
816
816
 
817
817
 
818
818
  if (prismaSize === 'small') {
819
- var SVG = Prisma16 || Prisma24;
820
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVG, _extends({
819
+ var SVGEnterprise = Prisma16 || Prisma24;
820
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVGEnterprise, _extends({
821
821
  width: "16",
822
822
  height: "16"
823
823
  }, prismaProps));
@@ -825,9 +825,9 @@ function Icon(_ref) {
825
825
 
826
826
 
827
827
  if (density === 'compact') {
828
- var _SVG = Prisma20 || Prisma24;
828
+ var _SVGEnterprise = Prisma20 || Prisma24;
829
829
 
830
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG, _extends({
830
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVGEnterprise, _extends({
831
831
  width: "20",
832
832
  height: "20"
833
833
  }, prismaProps));
@@ -865,8 +865,8 @@ module.exports = require("@splunk/react-ui/Anchor");
865
865
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MoreVertical; });
866
866
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
867
867
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
868
- /* harmony import */ var _splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(87);
869
- /* harmony import */ var _splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1__);
868
+ /* harmony import */ var _splunk_react_icons_enterprise_MoreVertical__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(87);
869
+ /* harmony import */ var _splunk_react_icons_enterprise_MoreVertical__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_enterprise_MoreVertical__WEBPACK_IMPORTED_MODULE_1__);
870
870
  /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
871
871
  /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
872
872
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -889,7 +889,7 @@ function Prisma24(_ref) {
889
889
 
890
890
  function MoreVertical(props) {
891
891
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ThemedIcon__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"], _extends({
892
- Enterprise: _splunk_react_icons_MoreVertical__WEBPACK_IMPORTED_MODULE_1___default.a,
892
+ Enterprise: _splunk_react_icons_enterprise_MoreVertical__WEBPACK_IMPORTED_MODULE_1___default.a,
893
893
  Prisma24: Prisma24
894
894
  }, props));
895
895
  }
@@ -899,7 +899,7 @@ function MoreVertical(props) {
899
899
  /***/ 87:
900
900
  /***/ (function(module, exports) {
901
901
 
902
- module.exports = require("@splunk/react-icons/MoreVertical");
902
+ module.exports = require("@splunk/react-icons/enterprise/MoreVertical");
903
903
 
904
904
  /***/ })
905
905
 
package/Chip.js CHANGED
@@ -130,7 +130,7 @@ var external_react_ = __webpack_require__(2);
130
130
  var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
131
131
 
132
132
  // EXTERNAL MODULE: external "@splunk/ui-utils/color"
133
- var color_ = __webpack_require__(46);
133
+ var color_ = __webpack_require__(47);
134
134
 
135
135
  // EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
136
136
  var i18n_ = __webpack_require__(4);
@@ -559,8 +559,8 @@ Chip.defaultProps = defaultProps;
559
559
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return CrossMark; });
560
560
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
561
561
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
562
- /* harmony import */ var _splunk_react_icons_Close__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(29);
563
- /* harmony import */ var _splunk_react_icons_Close__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_Close__WEBPACK_IMPORTED_MODULE_1__);
562
+ /* harmony import */ var _splunk_react_icons_enterprise_Close__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(29);
563
+ /* harmony import */ var _splunk_react_icons_enterprise_Close__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_enterprise_Close__WEBPACK_IMPORTED_MODULE_1__);
564
564
  /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
565
565
  /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
566
566
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -594,7 +594,7 @@ function Prisma16(_ref2) {
594
594
 
595
595
  function CrossMark(props) {
596
596
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ThemedIcon__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"], _extends({
597
- Enterprise: _splunk_react_icons_Close__WEBPACK_IMPORTED_MODULE_1___default.a,
597
+ Enterprise: _splunk_react_icons_enterprise_Close__WEBPACK_IMPORTED_MODULE_1___default.a,
598
598
  Prisma16: Prisma16,
599
599
  Prisma24: Prisma24
600
600
  }, props));
@@ -605,7 +605,7 @@ function CrossMark(props) {
605
605
  /***/ 29:
606
606
  /***/ (function(module, exports) {
607
607
 
608
- module.exports = require("@splunk/react-icons/Close");
608
+ module.exports = require("@splunk/react-icons/enterprise/Close");
609
609
 
610
610
  /***/ }),
611
611
 
@@ -623,7 +623,7 @@ module.exports = require("@splunk/ui-utils/i18n");
623
623
 
624
624
  /***/ }),
625
625
 
626
- /***/ 46:
626
+ /***/ 47:
627
627
  /***/ (function(module, exports) {
628
628
 
629
629
  module.exports = require("@splunk/ui-utils/color");
@@ -752,8 +752,8 @@ function Icon(_ref) {
752
752
 
753
753
 
754
754
  if (prismaSize === 'small') {
755
- var SVG = Prisma16 || Prisma24;
756
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVG, _extends({
755
+ var SVGEnterprise = Prisma16 || Prisma24;
756
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SVGEnterprise, _extends({
757
757
  width: "16",
758
758
  height: "16"
759
759
  }, prismaProps));
@@ -761,9 +761,9 @@ function Icon(_ref) {
761
761
 
762
762
 
763
763
  if (density === 'compact') {
764
- var _SVG = Prisma20 || Prisma24;
764
+ var _SVGEnterprise = Prisma20 || Prisma24;
765
765
 
766
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVG, _extends({
766
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SVGEnterprise, _extends({
767
767
  width: "20",
768
768
  height: "20"
769
769
  }, prismaProps));