@splunk/react-ui 5.0.0-beta.5 → 5.0.0-rc.2

package/ButtonSimple.js

@@ -61,8 +61,8 @@
         r.r(e);
     // EXPORTS
         r.d(e, {
-        buttonMixin: () => /* reexport */ C,
-        default: () => /* reexport */ M
+        buttonMixin: () => /* reexport */ g,
+        default: () => /* reexport */ h
     });
     // CONCATENATED MODULE: external "react"
     const o = require("react");
@@ -75,12 +75,12 @@
     var c =  r.n(i);
     // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
     const l = require("@splunk/react-ui/Clickable");
-    var s =  r.n(l);
+    var d =  r.n(l);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const d = require("@splunk/themes");
+    const s = require("@splunk/themes");
     // CONCATENATED MODULE: external "lodash/merge"
-    const b = require("lodash/merge");
-    var v =  r.n(b);
+    const v = require("lodash/merge");
+    var b =  r.n(v);
     // CONCATENATED MODULE: ./src/ButtonSimple/mixin.ts
     function u(r) {
         "@babel/helpers - typeof";
@@ -100,73 +100,73 @@
         var i;
         var c;
         var l;
-        var s = d.variables.contentColorActive;
-        var b;
-        var v = d.variables.contentColorDisabled;
+        var d = s.variables.contentColorActive;
+        var v;
+        var b = s.variables.contentColorDisabled;
         var u;
         switch (r) {
           case "primary":
             {
-                e = d.variables.actionColorBackgroundPrimary;
-                o = d.variables.actionColorBackgroundPrimaryActive;
-                a = d.variables.actionColorBackgroundPrimaryDisabled;
-                t = d.variables.actionColorBackgroundPrimaryHover;
-                s = d.variables.contentColorInverted;
-                v = d.variables.contentColorInverted;
+                e = s.variables.actionColorBackgroundPrimary;
+                o = s.variables.actionColorBackgroundPrimaryActive;
+                a = s.variables.actionColorBackgroundPrimaryDisabled;
+                t = s.variables.actionColorBackgroundPrimaryHover;
+                d = s.variables.contentColorInverted;
+                b = s.variables.contentColorInverted;
                 break;
             }
 
           case "destructive":
             {
-                e = d.variables.actionColorBackgroundDestructive;
-                o = d.variables.actionColorBackgroundDestructiveActive;
-                a = d.variables.actionColorBackgroundDestructiveDisabled;
-                t = d.variables.actionColorBackgroundDestructiveHover;
-                s = d.variables.contentColorInverted;
-                v = d.variables.contentColorInverted;
+                e = s.variables.actionColorBackgroundDestructive;
+                o = s.variables.actionColorBackgroundDestructiveActive;
+                a = s.variables.actionColorBackgroundDestructiveDisabled;
+                t = s.variables.actionColorBackgroundDestructiveHover;
+                d = s.variables.contentColorInverted;
+                b = s.variables.contentColorInverted;
                 break;
             }
 
           case "destructiveSecondary":
             {
-                n = d.variables.actionColorBorderDestructiveSecondary;
-                i = d.variables.actionColorBorderDestructiveSecondaryActive;
-                c = d.variables.actionColorBorderDestructiveSecondaryDisabled;
-                l = d.variables.actionColorBorderDestructiveSecondaryHover;
-                e = d.variables.actionColorBackgroundDestructiveSecondary;
-                o = d.variables.actionColorBackgroundDestructiveSecondaryActive;
-                a = d.variables.actionColorBackgroundDestructiveSecondaryDisabled;
-                t = d.variables.actionColorBackgroundDestructiveSecondaryHover;
-                s = d.variables.contentColorNegative;
-                v = d.variables.contentColorNegativeWeak;
+                n = s.variables.actionColorBorderDestructiveSecondary;
+                i = s.variables.actionColorBorderDestructiveSecondaryActive;
+                c = s.variables.actionColorBorderDestructiveSecondaryDisabled;
+                l = s.variables.actionColorBorderDestructiveSecondaryHover;
+                e = s.variables.actionColorBackgroundDestructiveSecondary;
+                o = s.variables.actionColorBackgroundDestructiveSecondaryActive;
+                a = s.variables.actionColorBackgroundDestructiveSecondaryDisabled;
+                t = s.variables.actionColorBackgroundDestructiveSecondaryHover;
+                d = s.variables.contentColorNegative;
+                b = s.variables.contentColorNegativeWeak;
                 break;
             }
 
           case "secondary":
-            n = d.variables.actionColorBorderSecondary;
-            i = d.variables.actionColorBorderSecondaryActive;
-            c = d.variables.actionColorBorderSecondaryDisabled;
-            l = d.variables.actionColorBorderSecondaryHover;
-            e = d.variables.actionColorBackgroundSecondary;
-            o = d.variables.actionColorBackgroundSecondaryActive;
-            t = d.variables.actionColorBackgroundSecondaryHover;
+            n = s.variables.actionColorBorderSecondary;
+            i = s.variables.actionColorBorderSecondaryActive;
+            c = s.variables.actionColorBorderSecondaryDisabled;
+            l = s.variables.actionColorBorderSecondaryHover;
+            e = s.variables.actionColorBackgroundSecondary;
+            o = s.variables.actionColorBackgroundSecondaryActive;
+            t = s.variables.actionColorBackgroundSecondaryHover;
             break;
 
           case "subtle":
-            b = d.variables.contentColorAccentStrong;
-            u = d.variables.contentColorAccentStrong;
-            o = d.variables.actionColorBackgroundSubtleActive;
-            t = d.variables.actionColorBackgroundSubtleHover;
+            v = s.variables.contentColorAccentStrong;
+            u = s.variables.contentColorAccentStrong;
+            o = s.variables.actionColorBackgroundSubtleActive;
+            t = s.variables.actionColorBackgroundSubtleHover;
             break;
 
           case "standalone":
-            s = d.variables.contentColorAccent;
-            b = d.variables.contentColorAccentStrong;
-            v = d.variables.contentColorAccentWeak;
-            u = d.variables.contentColorAccentStrong;
-            e = d.variables.actionColorBackgroundSubtle;
-            o = d.variables.actionColorBackgroundSubtleActive;
-            t = d.variables.actionColorBackgroundSubtleHover;
+            d = s.variables.contentColorAccent;
+            v = s.variables.contentColorAccentStrong;
+            b = s.variables.contentColorAccentWeak;
+            u = s.variables.contentColorAccentStrong;
+            e = s.variables.actionColorBackgroundSubtle;
+            o = s.variables.actionColorBackgroundSubtleActive;
+            t = s.variables.actionColorBackgroundSubtleHover;
             break;
 
           default:
@@ -180,9 +180,9 @@
             borderColorActive: i,
             borderColorDisabled: c,
             borderColorHover: l,
-            color: s,
-            colorActive: b,
-            colorDisabled: v,
+            color: d,
+            colorActive: v,
+            colorDisabled: b,
             colorHover: u
         };
         return p;
@@ -196,126 +196,50 @@
             a = r;
         }
         var t = y(o);
-        var n = v()(t, a), c = n.background, l = n.backgroundActive, s = n.backgroundDisabled, b = n.backgroundDisabledSelected, f = n.backgroundHover, C = n.borderColor, g = n.borderColorActive, m = n.borderColorDisabled, k = n.borderColorHover, S = n.color, O = n.colorActive, B = n.colorDisabled, A = n.colorHover;
-        var D = c != null && c !== "transparent";
+        var n = b()(t, a), c = n.background, l = n.backgroundActive, d = n.backgroundDisabled, v = n.backgroundDisabledSelected, f = n.backgroundHover, g = n.borderColor, C = n.borderColorActive, k = n.borderColorDisabled, S = n.borderColorHover, m = n.color, B = n.colorActive, A = n.colorDisabled, D = n.colorHover;
+        var h = c != null && c !== "transparent";
         return function() {
-            return (0, i.css)([ "border:", " solid ", ";border-radius:", ";", " ", " cursor:pointer;position:relative;font-weight:", ";&:focus,&:hover{z-index:3;}&:focus{box-shadow:", ";}&:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";transition:background-color 0.2s,box-shadow 0.2s,text-decoration 0.2s;&:hover{background-color:", ";border-color:", ";color:", ";}&:active{background-color:", ";border-color:", ";color:", ";transition:none;}}&[disabled],&[aria-disabled='true']{border-color:", ";color:", ";", "}" ], d.variables.inputBorderWidth, C, d.variables.borderRadius, (function(r) {
+            return (0, i.css)([ "border:", " solid ", ";border-radius:", ";", " ", " cursor:pointer;position:relative;font-weight:", ";&:focus,&:hover{z-index:3;}&:focus{box-shadow:", ";}&:not([disabled],[aria-disabled='true']){background-color:", ";color:", ";transition:background-color 0.2s,box-shadow 0.2s,text-decoration 0.2s;&:hover{background-color:", ";border-color:", ";color:", ";}&:active{background-color:", ";border-color:", ";color:", ";transition:none;}}&[disabled],&[aria-disabled='true']{border-color:", ";color:", ";", "}" ], s.variables.inputBorderWidth, g, s.variables.borderRadius, (function(r) {
                 var e = r.$append;
                 return e && (0, i.css)([ "border-top-right-radius:0.1px;border-bottom-right-radius:0.1px;border-right:none;" ]);
             }), (function(r) {
                 var e = r.$prepend;
                 return e && (0, i.css)([ "border-top-left-radius:0.1px;border-bottom-left-radius:0.1px;" ]);
-            }), d.variables.fontWeightSemiBold, d.variables.focusShadow, c, S, f, k, A, l, g, O, m, B, (function(r) {
+            }), s.variables.fontWeightSemiBold, s.variables.focusShadow, c, m, f, S, D, l, C, B, k, A, (function(r) {
                 var e = r.$selected;
-                return D && (0, i.css)([ "background-color:", ";" ], e ? b : s);
+                return h && (0, i.css)([ "background-color:", ";" ], e ? v : d);
             }));
         };
     }
-    /* harmony default export */    const C = f;
+    /* harmony default export */    const g = f;
     // CONCATENATED MODULE: ./src/ButtonSimple/ButtonSimpleStyles.ts
-    function g(r) {
-        "@babel/helpers - typeof";
-        return g = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(r) {
-            return typeof r;
-        } : function(r) {
-            return r && "function" == typeof Symbol && r.constructor === Symbol && r !== Symbol.prototype ? "symbol" : typeof r;
-        }, g(r);
-    }
-    function m(r, e) {
-        var o = Object.keys(r);
-        if (Object.getOwnPropertySymbols) {
-            var a = Object.getOwnPropertySymbols(r);
-            e && (a = a.filter((function(e) {
-                return Object.getOwnPropertyDescriptor(r, e).enumerable;
-            }))), o.push.apply(o, a);
-        }
-        return o;
-    }
-    function k(r) {
-        for (var e = 1; e < arguments.length; e++) {
-            var o = null != arguments[e] ? arguments[e] : {};
-            e % 2 ? m(Object(o), !0).forEach((function(e) {
-                S(r, e, o[e]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(r, Object.getOwnPropertyDescriptors(o)) : m(Object(o)).forEach((function(e) {
-                Object.defineProperty(r, e, Object.getOwnPropertyDescriptor(o, e));
-            }));
-        }
-        return r;
-    }
-    function S(r, e, o) {
-        return (e = O(e)) in r ? Object.defineProperty(r, e, {
-            value: o,
-            enumerable: !0,
-            configurable: !0,
-            writable: !0
-        }) : r[e] = o, r;
-    }
-    function O(r) {
-        var e = B(r, "string");
-        return "symbol" == g(e) ? e : e + "";
-    }
-    function B(r, e) {
-        if ("object" != g(r) || !r) return r;
-        var o = r[Symbol.toPrimitive];
-        if (void 0 !== o) {
-            var a = o.call(r, e || "default");
-            if ("object" != g(a)) return a;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return ("string" === e ? String : Number)(r);
-    }
-    var A = {
-        borderColor: d.variables.interactiveColorAccentError,
-        borderColorActive: d.variables.interactiveColorAccentError,
-        borderColorHover: d.mixins.overlayColors(d.variables.interactiveColorAccentError, d.variables.interactiveColorBorderHover)
-    };
-    var D = {
-        background: d.variables.interactiveColorBackground,
-        backgroundActive: d.variables.interactiveColorOverlayActive,
-        backgroundHover: d.variables.interactiveColorOverlayHover,
-        borderColor: d.variables.transparent,
-        borderColorActive: d.variables.transparent,
-        borderColorDisabled: d.variables.transparent,
-        borderColorHover: d.variables.transparent,
-        color: d.variables.contentColorActive,
-        colorActive: d.variables.contentColorActive,
-        colorDisable: d.variables.contentColorDisabled,
-        colorHover: d.variables.contentColorActive
-    };
-    var h = {
-        background: d.variables.interactiveColorBackground,
-        backgroundActive: d.variables.interactiveColorOverlayActive,
-        backgroundHover: d.variables.interactiveColorOverlayHover,
-        borderColor: d.variables.interactiveColorBorder,
-        borderColorActive: d.variables.interactiveColorBorderActive,
-        borderColorDisabled: d.variables.interactiveColorBorderDisabled,
-        borderColorHover: d.variables.interactiveColorBorderHover
+    var C = {
+        borderColor: s.variables.interactiveColorAccentError,
+        borderColorActive: s.variables.interactiveColorAccentError,
+        borderColorHover: s.mixins.overlayColors(s.variables.interactiveColorAccentError, s.variables.interactiveColorBorderHover)
     };
-    var j = c()(s()).withConfig({
+    var k = c()(d()).withConfig({
         displayName: "ButtonSimpleStyles__StyledClickable",
         componentId: "vlarwe-0"
-    })([ "", " align-items:center;justify-content:center;&:not([disabled],[aria-disabled='true']){", "}", "" ], d.mixins.reset("flex"), (function(r) {
-        var e = r.$error, o = r.$isMenu;
-        return e && (0, i.css)([ "", "" ], (0, d.pickVariant)("$variant", {
-            default: o ? C("secondary", k(k({}, h), A)) : C("secondary", A),
-            secondary: o ? C("secondary", k(k({}, h), A)) : C("secondary", A),
-            subtle: o ? C("secondary", k(k({}, D), A)) : C("subtle", A)
+    })([ "", " align-items:center;justify-content:center;&:not([disabled],[aria-disabled='true']){", "}", "" ], s.mixins.reset("flex"), (function(r) {
+        var e = r.$error;
+        return e && (0, i.css)([ "", "" ], (0, s.pickVariant)("$variant", {
+            default: g("secondary", C),
+            secondary: g("secondary", C),
+            subtle: g("subtle", C)
         }));
-    }), (function(r) {
-        var e = r.$isMenu;
-        return (0, d.pickVariant)("$variant", {
-            default: e ? C("secondary", h) : C("secondary"),
-            primary: C("primary"),
-            secondary: e ? C("secondary", h) : C("secondary"),
-            subtle: e ? C("secondary", D) : C("subtle"),
-            destructive: C("destructive"),
-            destructiveSecondary: C("destructiveSecondary"),
-            standalone: C("standalone")
-        });
+    }), (0, s.pickVariant)("$variant", {
+        default: g("secondary"),
+        primary: g("primary"),
+        secondary: g("secondary"),
+        subtle: g("subtle"),
+        destructive: g("destructive"),
+        destructiveSecondary: g("destructiveSecondary"),
+        standalone: g("standalone")
     }));
     // CONCATENATED MODULE: ./src/ButtonSimple/ButtonSimple.tsx
-    function H() {
-        return H = Object.assign ? Object.assign.bind() : function(r) {
+    function S() {
+        return S = Object.assign ? Object.assign.bind() : function(r) {
             for (var e = 1; e < arguments.length; e++) {
                 var o = arguments[e];
                 for (var a in o) {
@@ -323,11 +247,11 @@
                 }
             }
             return r;
-        }, H.apply(null, arguments);
+        }, S.apply(null, arguments);
     }
-    function w(r, e) {
+    function m(r, e) {
         if (null == r) return {};
-        var o, a, t = P(r, e);
+        var o, a, t = B(r, e);
         if (Object.getOwnPropertySymbols) {
             var n = Object.getOwnPropertySymbols(r);
             for (a = 0; a < n.length; a++) {
@@ -336,7 +260,7 @@
         }
         return t;
     }
-    function P(r, e) {
+    function B(r, e) {
         if (null == r) return {};
         var o = {};
         for (var a in r) {
@@ -347,7 +271,7 @@
         }
         return o;
     }
-    var x = {
+    var A = {
         action: n().string,
         appearance: n().oneOf([ "default", "secondary", "primary", "destructive", "destructiveSecondary", "subtle", "standalone" ]),
         append: n().bool,
@@ -360,24 +284,24 @@
         prepend: n().bool,
         to: n().string
     };
-    var $ =  a().forwardRef((function(r, e) {
-        var o = r.appearance, t = o === void 0 ? "default" : o, n = r.append, i = r.children, c = r.disabled, l = r.error, s = r.isMenu, d = r.prepend, b = w(r, [ "appearance", "append", "children", "disabled", "error", "isMenu", "prepend" ]);
+    var D =  a().forwardRef((function(r, e) {
+        var o = r.appearance, t = o === void 0 ? "default" : o, n = r.append, i = r.children, c = r.disabled, l = r.error, d = r.isMenu, s = r.prepend, v = m(r, [ "appearance", "append", "children", "disabled", "error", "isMenu", "prepend" ]);
         // @docs-props-type ButtonSimplePropsBase
                 
-        return a().createElement(j, H({
+        return a().createElement(k, S({
             "aria-invalid": l,
             "data-test": "button-simple",
             disabled: c,
             $variant: t,
             $append: n,
-            $prepend: d,
+            $prepend: s,
             $error: l,
-            $isMenu: s,
+            $isMenu: d,
             ref: e
-        }, b), i);
+        }, v), i);
     }));
-    $.propTypes = x;
-    /* harmony default export */    const M = $;
+    D.propTypes = A;
+    /* harmony default export */    const h = D;
     // only for styled-components that wrap ButtonSimple
         // CONCATENATED MODULE: ./src/ButtonSimple/index.ts
     module.exports = e;

package/{CHANGELOG.v5.mdx → CHANGELOG.v5.md}

@@ -1,6 +1,48 @@
 Change Log
 ============
 
+5.0.0-rc.2 - May 28, 2025
+----------
+New Features:
+* `Code` now supports `language="sql"` (SUI-7614).
+* `Table.HeadCell` now supports the `tooltip` prop (SUI-7734).
+
+API Changes:
+* All components now use `KeyboardEvent`'s `key` property instead of the deprecated `keyCode` property (SUI-7352).
+* `Dropdown` now exports type `DropdownPossibleOpenReason` and provides an array of `Dropdown.possibleOpenReasons` (SUI-2422).
+* `Popover` now provides an array of `Popover.possibleCloseReasons` (SUI-2422).
+* `Tooltip` now exports types `TooltipPossibleOpenReason` and `TooltipPossibleCloseReason`, and provides an array `Tooltip.possibleOpenReasons` and `Tooltip.possibleCloseReasons` (SUI-2422).
+
+Bug Fixes:
+* `Modal` close button now has correct `subtle` appearance.
+* `Multiselect` no longer incorrectly throws a "defaultValue prop change" error in some scenarios (SUI-7777).
+* `Table.HeadCell` and `Table.HeadDropdownCell` now aligns the topline of icons with multiline content (SUI-7758).
+* `Table`'s cell single and multiline content now are vertically aligned (SUI-7613).
+* `Markdown` now correctly renders code blocks where the language name is hyphenated (SUI-7829).
+
+5.0.0-rc.1 - May 14, 2025
+----------
+New Features:
+* `Card` now defaults to a borderless appearance for non-clickable cards (SUI-7651).
+* `Dropdown`, `Search`, and `TabBar` now uses `KeyboardEvent`'s `key` property instead of deprecated `keyCode` property (SUI-7352).
+* `Table` now uses `KeyboardEvent`'s `key` property instead of deprecated `keyCode` property (SUI-7352).
+* `FormRows`, `JSONTree`, `Number`, and `RadioBar` now use `KeyboardEvent`'s `key` property instead of deprecated `keyCode` property (SUI-7352).
+
+Bug Fixes:
+* `Table`'s `rowExpansion` button now correctly displays hover styles (SUI-7772).
+* `Text` no longer has border hover effects incorrectly applied when `disabled` or `dimmed` (SUI-7639).
+* `Switch`'s `toggle` appearance now has correct role of `switch` (SUI-7713).
+* `Table.HeadCell`'s and `Table.HeadDropdownCell`'s borders now span the full cell height when content wraps to multiline (SUI-7760)
+* `CollapsiblePanel` no longer flickers on open or close of panel (SUI-7620).
+* `Color` now passes `className` and `elementRef` to the root element instead of an inner component, allowing proper styling with `styled-components` (SUI-6211).
+* `Button`'s now have consistent styling when using `appearance="secondary"` and `isMenu` (SUI-7611).
+
+Deprecations:
+* `Popover`'s `"inverted"` value of the `appearance` prop has been deprecated and will be removed in the next major version. See the migration guide for details (SUI-6154).
+
+API Changes:
+* `Color`'s test hook `[data-test="color"]` is now on the root component and `[data-test="toggle-swatch"]` is on the toggle swatch. See migration guide for details (SUI-7773).
+
 5.0.0-beta.5 - May 7, 2025
 ----------
 New Features:
@@ -181,6 +223,7 @@ API Changes:
 * `Button`'s `appearance` prop no longer supports the `"flat"`, `"pill"`, or `"toggle"` values (SUI-6561).
 * `Button`'s `selected` prop has been removed (SUI-6058).
 * `Button` no longer supports the `error` prop.
+* `Button`'s `label` prop no longer sets HTML `label` attribute. See migration guide for details (SUI-6054).
 
 * `Card` and `Card.Footer`'s `showBorder` prop has been removed (SUI-6577).