@splunk/react-ui 5.1.0 → 5.2.0

package/CollapsiblePanel.js

@@ -94,10 +94,10 @@
     const h = require("@splunk/react-ui/Clickable");
     var S =  e.n(h);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const C = require("@splunk/themes");
+    const O = require("@splunk/themes");
     // CONCATENATED MODULE: external "@splunk/react-icons/ChevronRight"
-    const O = require("@splunk/react-icons/ChevronRight");
-    var P =  e.n(O);
+    const C = require("@splunk/react-icons/ChevronRight");
+    var P =  e.n(C);
     // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/ChevronRight"
     const w = require("@splunk/react-icons/enterprise/ChevronRight");
     var k =  e.n(w);
@@ -105,9 +105,9 @@
     var I = {
         className: l().string
     };
-    var j = function e(n) {
+    var x = function e(n) {
         var t = n.className;
-        var a = (0, C.useSplunkTheme)(), l = a.isEnterprise;
+        var a = (0, O.useSplunkTheme)(), l = a.isEnterprise;
         return l ?  r().createElement(k(), {
             className: t,
             hideDefaultTooltip: true,
@@ -116,27 +116,27 @@
             className: t
         });
     };
-    j.propTypes = I;
-    /* harmony default export */    const x = j;
+    x.propTypes = I;
+    /* harmony default export */    const j = x;
     // CONCATENATED MODULE: ./src/CollapsiblePanel/CollapsiblePanelStyles.ts
     var E = b()(y()).withConfig({
         displayName: "CollapsiblePanelStyles__StyledBox",
         componentId: "sc-1phikbp-0"
     })([ "display:flex;flex-direction:column;flex-shrink:1;min-height:28px;background-color:", ";& + &{margin-top:1px;}" ], (0, 
-    C.pickVariant)("$appearance", {
+    O.pickVariant)("$appearance", {
         default: {
-            prisma: C.variables.backgroundColorSection,
+            prisma: O.variables.backgroundColorSection,
             enterprise: {
-                dark: C.variables.gray22,
-                light: C.variables.white
+                dark: O.variables.gray22,
+                light: O.variables.white
             }
         },
-        subtle: C.variables.transparent
+        subtle: O.variables.transparent
     }));
     var _ = b()(y()).withConfig({
         displayName: "CollapsiblePanelStyles__StyledSingleOpenPanelGroupBox",
         componentId: "sc-1phikbp-1"
-    })([ "", ";flex-direction:column;margin-bottom:0;" ], C.mixins.reset("flex"));
+    })([ "", ";flex-direction:column;margin-bottom:0;" ], O.mixins.reset("flex"));
     /*
     these styles are consistent for both regular and actions, but applied to different elements
     * in regular mode, they're on the SVG's span wrapper
@@ -150,61 +150,61 @@
     var T = b().div.withConfig({
         displayName: "CollapsiblePanelStyles__StyledActions",
         componentId: "sc-1phikbp-3"
-    })([ "display:flex;flex-shrink:0;border-bottom:0;gap:", ";position:relative;padding:", " ", ";transition:background-color 0.2s,border 0.2s,box-shadow 0.2s;color:", ";background-color:", ";", "" ], C.variables.spacingSmall, C.variables.spacingXSmall, C.variables.spacingLarge, C.variables.contentColorActive, (0, 
-    C.pickVariant)("$appearance", {
-        default: C.variables.neutral100,
-        subtle: C.variables.transparent
+    })([ "display:flex;flex-shrink:0;border-bottom:0;gap:", ";position:relative;padding:", " ", ";transition:background-color 0.2s,border 0.2s,box-shadow 0.2s;color:", ";background-color:", ";", "" ], O.variables.spacingSmall, O.variables.spacingXSmall, O.variables.spacingLarge, O.variables.contentColorActive, (0, 
+    O.pickVariant)("$appearance", {
+        default: O.variables.neutral100,
+        subtle: O.variables.transparent
     }), (function(e) {
         var n = e.$disabled;
-        return n && (0, f.css)([ "color:", ";" ], C.variables.contentColorDisabled);
+        return n && (0, f.css)([ "color:", ";" ], O.variables.contentColorDisabled);
     }));
     var $ = b()(g()).withConfig({
         displayName: "CollapsiblePanelStyles__StyledToggleButton",
         componentId: "sc-1phikbp-4"
-    })([ "flex:0 auto;padding:0;min-width:28px;line-height:", ";" ], C.variables.lineHeight);
+    })([ "flex:0 auto;padding:0;min-width:28px;line-height:", ";" ], O.variables.lineHeight);
     var q = b()(S()).withConfig({
         displayName: "CollapsiblePanelStyles__StyledTitleClickable",
         componentId: "sc-1phikbp-5"
-    })([ "width:100%;flex-shrink:0;border-bottom:0;gap:", ";cursor:pointer;position:relative;display:flex;transition:background-color 0.2s,border 0.2s,box-shadow 0.2s;padding:", " ", ";color:", ";background-color:", ";&[disabled],&[aria-disabled='true']{cursor:not-allowed;color:", ";}&:focus:not([disabled]),&:active:not([disabled],[aria-disabled='true']){box-shadow:", ";z-index:1;}&:hover:not([disabled],[aria-disabled='true']){background-color:", ";}" ], C.variables.spacingSmall, C.variables.spacingXSmall, C.variables.spacingLarge, C.variables.contentColorActive, (0, 
-    C.pickVariant)("$appearance", {
-        default: C.variables.neutral100,
-        subtle: C.variables.transparent
-    }), C.variables.contentColorDisabled, C.variables.focusShadowInset, C.mixins.overlayColors(C.variables.neutral100, C.variables.interactiveColorOverlayHover));
+    })([ "width:100%;flex-shrink:0;border-bottom:0;gap:", ";cursor:pointer;position:relative;display:flex;transition:background-color 0.2s,border 0.2s,box-shadow 0.2s;padding:", " ", ";color:", ";background-color:", ";&[disabled],&[aria-disabled='true']{cursor:not-allowed;color:", ";}&:focus:not([disabled]),&:active:not([disabled],[aria-disabled='true']){box-shadow:", ";z-index:1;}&:hover:not([disabled],[aria-disabled='true']){background-color:", ";}" ], O.variables.spacingSmall, O.variables.spacingXSmall, O.variables.spacingLarge, O.variables.contentColorActive, (0, 
+    O.pickVariant)("$appearance", {
+        default: O.variables.neutral100,
+        subtle: O.variables.transparent
+    }), O.variables.contentColorDisabled, O.variables.focusShadowInset, O.mixins.overlayColors(O.variables.neutral100, O.variables.interactiveColorOverlayHover));
     var D = b().span.withConfig({
         displayName: "CollapsiblePanelStyles__StyledHeadingContent",
         componentId: "sc-1phikbp-6"
-    })([ "display:flex;justify-content:space-between;flex:1 1 auto;font-weight:", ";line-height:", ";", "" ], C.variables.fontWeightSemiBold, C.variables.lineHeight, (function(e) {
+    })([ "display:flex;justify-content:space-between;flex:1 1 auto;font-weight:", ";line-height:", ";", "" ], O.variables.fontWeightSemiBold, O.variables.lineHeight, (function(e) {
         var n = e.$disabled;
-        return n && (0, f.css)([ "color:", ";" ], C.variables.contentColorDisabled);
+        return n && (0, f.css)([ "color:", ";" ], O.variables.contentColorDisabled);
     }));
     var R = b().span.withConfig({
         displayName: "CollapsiblePanelStyles__StyledHeadingActions",
         componentId: "sc-1phikbp-7"
-    })([ "min-height:", ";flex:1 0 auto;" ], C.variables.inputHeight);
-    var B = b().span.withConfig({
+    })([ "min-height:", ";flex:1 0 auto;" ], O.variables.inputHeight);
+    var M = b().span.withConfig({
         displayName: "CollapsiblePanelStyles__StyledDescription",
         componentId: "sc-1phikbp-8"
-    })([ "color:", ";font-size:", ";margin-left:", ";line-height:1.8;", "" ], C.variables.contentColorDefault, C.variables.fontSizeSmall, C.variables.spacingSmall, (function(e) {
+    })([ "color:", ";font-size:", ";margin-left:", ";line-height:1.8;", "" ], O.variables.contentColorDefault, O.variables.fontSizeSmall, O.variables.spacingSmall, (function(e) {
         var n = e.$disabled;
-        return n && (0, f.css)([ "color:", ";" ], C.variables.contentColorDisabled);
+        return n && (0, f.css)([ "color:", ";" ], O.variables.contentColorDisabled);
     }));
-    var M = b().div.withConfig({
+    var B = b().div.withConfig({
         displayName: "CollapsiblePanelStyles__StyledInsetWrapper",
         componentId: "sc-1phikbp-9"
-    })([ "", ";gap:", ";", "" ], C.mixins.reset("block"), C.variables.spacingSmall, (function(e) {
+    })([ "", ";gap:", ";", "" ], O.mixins.reset("block"), O.variables.spacingSmall, (function(e) {
         var n = e.$inset;
-        return n && (0, f.css)([ "padding:", ";" ], C.variables.spacingLarge);
+        return n && (0, f.css)([ "padding:", ";" ], O.variables.spacingLarge);
     }));
-    var L = b()(x).withConfig({
+    var L = b()(j).withConfig({
         displayName: "CollapsiblePanelStyles__StyledExpandPanelIcon",
         componentId: "sc-1phikbp-10"
-    })([ "transition:transform ", ";", " width:100%;vertical-align:", ";" ], (0, C.pick)({
+    })([ "transition:transform ", ";", " width:100%;vertical-align:", ";" ], (0, O.pick)({
         enterprise: "300ms",
         prisma: "200ms"
     }), (function(e) {
         var n = e.open;
         return n && (0, f.css)([ "transform:rotate(90deg);" ]);
-    }), (0, C.pick)({
+    }), (0, O.pick)({
         enterprise: "baseline",
         prisma: "text-bottom"
     }));
@@ -289,7 +289,7 @@
         if (Object.getOwnPropertySymbols) {
             var l = Object.getOwnPropertySymbols(e);
             for (r = 0; r < l.length; r++) {
-                t = l[r], n.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                t = l[r], -1 === n.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
             }
         }
         return a;
@@ -299,7 +299,7 @@
         var t = {};
         for (var r in e) {
             if ({}.hasOwnProperty.call(e, r)) {
-                if (n.includes(r)) continue;
+                if (-1 !== n.indexOf(r)) continue;
                 t[r] = e[r];
             }
         }
@@ -465,27 +465,27 @@
     }
     function Se(e, n) {
         if (null == e) return {};
-        var t, r, a = Ce(e, n);
+        var t, r, a = Oe(e, n);
         if (Object.getOwnPropertySymbols) {
             var l = Object.getOwnPropertySymbols(e);
             for (r = 0; r < l.length; r++) {
-                t = l[r], n.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                t = l[r], -1 === n.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
             }
         }
         return a;
     }
-    function Ce(e, n) {
+    function Oe(e, n) {
         if (null == e) return {};
         var t = {};
         for (var r in e) {
             if ({}.hasOwnProperty.call(e, r)) {
-                if (n.includes(r)) continue;
+                if (-1 !== n.indexOf(r)) continue;
                 t[r] = e[r];
             }
         }
         return t;
     }
-    /** @public */    var Oe = {
+    /** @public */    var Ce = {
         innerBodyStyles: l().object,
         actions: l().node,
         appearance: l().oneOf([ "default", "subtle" ]),
@@ -504,10 +504,10 @@
         title: l().node.isRequired
     };
     function Pe(e) {
-        var n = e.innerBodyStyles, a = e.actions, l = e.appearance, o = l === void 0 ? "default" : l, s = e.children, u = e.defaultOpen, f = u === void 0 ? undefined : u, b = e.description, v = e.disabled, y = e.elementRef, m = e.headingLevel, g = e.onChange, h = e.open, S = e.overflow, C = S === void 0 ? "auto" : S, O = e.panelId, P = e.renderChildrenWhenCollapsed, w = e.title, k = e.inset, I = k === void 0 ? true : k, j = Se(e, [ "innerBodyStyles", "actions", "appearance", "children", "defaultOpen", "description", "disabled", "elementRef", "headingLevel", "onChange", "open", "overflow", "panelId", "renderChildrenWhenCollapsed", "title", "inset" ]);
+        var n = e.innerBodyStyles, a = e.actions, l = e.appearance, o = l === void 0 ? "default" : l, s = e.children, u = e.defaultOpen, f = u === void 0 ? undefined : u, b = e.description, v = e.disabled, y = e.elementRef, m = e.headingLevel, g = e.onChange, h = e.open, S = e.overflow, O = S === void 0 ? "auto" : S, C = e.panelId, P = e.renderChildrenWhenCollapsed, w = e.title, k = e.inset, I = k === void 0 ? true : k, x = Se(e, [ "innerBodyStyles", "actions", "appearance", "children", "defaultOpen", "description", "disabled", "elementRef", "headingLevel", "onChange", "open", "overflow", "panelId", "renderChildrenWhenCollapsed", "title", "inset" ]);
         // @docs-props-type CollapsiblePanelPropsBase
-                var x = (0, t.useContext)(G);
-        var _ = Object.keys(x).length !== 0;
+                var j = (0, t.useContext)(G);
+        var _ = Object.keys(j).length !== 0;
         var N = c()({
             componentName: "CollapsiblePanel",
             /* eslint-disable-next-line prefer-rest-params */
@@ -521,65 +521,67 @@
         var F = p()(h);
         var J = !N ? f || false : undefined;
         var K = (0, t.useState)(J), Q = be(K, 2), Y = Q[0], Z = Q[1];
-        var ee = (0, t.useState)(), ne = be(ee, 2), te = ne[0], re = ne[1];
-        var ae = (0, t.useState)(false), le = be(ae, 2), oe = le[0], ie = le[1];
-        /**
-   * SingleOpenPanelGroup already takes into account if it is controlled or not in determining openPanelId
-   * so context.openPanelId is used for both the controlled and uncontrolled case.
-   */        (0, t.useEffect)((function() {
-            var e;
+        var ee = (0, t.useState)(false), ne = be(ee, 2), te = ne[0], re = ne[1];
+        var ae = (0, t.useMemo)((function() {
             if (_) {
-                e = x.openPanelId === O;
-            } else {
-                e = N ? h : Y;
+                /**
+       * SingleOpenPanelGroup already takes into account if it is controlled or not in determining openPanelId
+       * so context.openPanelId is used for both the controlled and uncontrolled case.
+       */
+                return j.openPanelId === C;
             }
-            re(e);
-        }), [ x.openPanelId, _, N, h, Y, O ]);
+            return N ? h : Y;
+        }), [ j.openPanelId, _, N, h, Y, C ]);
+        // SUI-7877 Must initialize openPanel with value to avoid re-render animation bug
+                var le = (0, t.useState)(ae), oe = be(le, 2), ie = oe[0], ce = oe[1];
+        (0, t.useEffect)((function() {
+            ce(ae);
+        }), [ ae ]);
         // Only testing this in the scenario of a SingleOpenPanelGroup.
                 (0, t.useEffect)((function() {
             if (false) {}
         }), [ f, _, h ]);
         (0, t.useEffect)((function() {
             if (F != null && h !== F) {
-                ie(true);
+                re(true);
             }
         }), [ h, F ]);
-        var ce = (0, t.useCallback)((function(e) {
+        var pe = (0, t.useCallback)((function(e) {
             var n;
             if (!N) {
-                ie(true);
-                Z(!te);
+                re(true);
+                Z(!ie);
             }
-            var t = te ? "close" : "open";
+            var t = ie ? "close" : "open";
             g === null || g === void 0 ? void 0 : g(e, {
-                panelId: O,
+                panelId: C,
                 reason: "toggleClick",
                 action: t
             });
-            (n = x.onChange) === null || n === void 0 ? void 0 : n.call(x, e, {
-                panelId: O,
+            (n = j.onChange) === null || n === void 0 ? void 0 : n.call(j, e, {
+                panelId: C,
                 reason: "toggleClick",
                 action: t
             });
-        }), [ x, N, te, g, O ]);
-        var pe = (0, t.useCallback)((function() {
-            ie(false);
+        }), [ j, N, ie, g, C ]);
+        var de = (0, t.useCallback)((function() {
+            re(false);
         }), []);
-        var de = (0, d.createDOMID)("panel-toggle");
-        var fe = {
+        var fe = (0, d.createDOMID)("panel-toggle");
+        var ve = {
             disabled: v,
-            onClick: ce,
+            onClick: pe,
             id: X,
             "aria-controls": V,
-            "aria-expanded": te,
+            "aria-expanded": ie,
             "data-test": "toggle"
         };
-        var ve = (0, t.useMemo)((function() {
+        var ye = (0, t.useMemo)((function() {
             return {
-                overflow: oe ? "hidden" : C
+                overflow: te ? "hidden" : O
             };
-        }), [ oe, C ]);
-        var ye = (0, t.useMemo)((function() {
+        }), [ te, O ]);
+        var me = (0, t.useMemo)((function() {
             return ue({
                 tableLayout: "fixed"
             }, n);
@@ -589,18 +591,18 @@
             "data-test": "collapsible-panel",
             elementRef: y,
             $appearance: o
-        }, j), a != null ?  r().createElement(T, {
+        }, x), a != null ?  r().createElement(T, {
             $appearance: o,
             $disabled: !!v
         },  r().createElement($, se({
             appearance: "secondary",
-            "aria-labelledby": de
-        }, fe),  r().createElement(L, {
-            open: !!te
+            "aria-labelledby": fe
+        }, ve),  r().createElement(L, {
+            open: !!ie
         })),  r().createElement(D, {
             $disabled: !!v,
             "data-test": "title",
-            id: de
+            id: fe
         }, w),  r().createElement(R, null, a)) : 
         
         /* Clickable component is not allowed to have role="heading" so it is wrapped with a span */
@@ -610,30 +612,30 @@
             "aria-level": m
         },  r().createElement(q, se({
             $appearance: o
-        }, fe),  r().createElement(A, null,  r().createElement(L, {
-            open: !!te
+        }, ve),  r().createElement(A, null,  r().createElement(L, {
+            open: !!ie
         })),  r().createElement(D, {
             $disabled: !!v
         },  r().createElement("span", {
             "data-test": "title"
-        }, w), b &&  r().createElement(B, {
+        }, w), b &&  r().createElement(M, {
             $disabled: !!v,
             "data-test": "description"
         }, b)))),  r().createElement(i(), {
             outerId: V,
             "aria-labelledby": X,
             "data-test": "body",
-            outerStyle: ve,
-            innerStyle: ye,
-            open: te,
-            onAnimationEnd: pe,
+            outerStyle: ye,
+            innerStyle: me,
+            open: ie,
+            onAnimationEnd: de,
             role: a != null ? "region" : undefined,
             renderChildrenWhenCollapsed: P
-        },  r().createElement(M, {
+        },  r().createElement(B, {
             $inset: I
         }, s)));
     }
-    Pe.propTypes = Oe;
+    Pe.propTypes = Ce;
     /* harmony default export */    const we = Pe;
     // CONCATENATED MODULE: ./src/CollapsiblePanel/index.ts
     module.exports = n;

package/Color.js

@@ -42,7 +42,7 @@
                 if (Object.getOwnPropertySymbols) {
                     var o = Object.getOwnPropertySymbols(e);
                     for (n = 0; n < o.length; n++) {
-                        t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                        t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                     }
                 }
                 return a;
@@ -52,7 +52,7 @@
                 var t = {};
                 for (var n in e) {
                     if ({}.hasOwnProperty.call(e, n)) {
-                        if (r.includes(n)) continue;
+                        if (-1 !== r.indexOf(n)) continue;
                         t[n] = e[n];
                     }
                 }
@@ -451,7 +451,7 @@
             if (Object.getOwnPropertySymbols) {
                 var o = Object.getOwnPropertySymbols(e);
                 for (n = 0; n < o.length; n++) {
-                    t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                    t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                 }
             }
             return a;
@@ -461,7 +461,7 @@
             var t = {};
             for (var n in e) {
                 if ({}.hasOwnProperty.call(e, n)) {
-                    if (r.includes(n)) continue;
+                    if (-1 !== r.indexOf(n)) continue;
                     t[n] = e[n];
                 }
             }
@@ -580,7 +580,7 @@
             if (Object.getOwnPropertySymbols) {
                 var o = Object.getOwnPropertySymbols(e);
                 for (n = 0; n < o.length; n++) {
-                    t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                    t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                 }
             }
             return a;
@@ -590,7 +590,7 @@
             var t = {};
             for (var n in e) {
                 if ({}.hasOwnProperty.call(e, n)) {
-                    if (r.includes(n)) continue;
+                    if (-1 !== r.indexOf(n)) continue;
                     t[n] = e[n];
                 }
             }
@@ -754,7 +754,7 @@
             if (Object.getOwnPropertySymbols) {
                 var o = Object.getOwnPropertySymbols(e);
                 for (n = 0; n < o.length; n++) {
-                    t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                    t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                 }
             }
             return a;
@@ -764,7 +764,7 @@
             var t = {};
             for (var n in e) {
                 if ({}.hasOwnProperty.call(e, n)) {
-                    if (r.includes(n)) continue;
+                    if (-1 !== r.indexOf(n)) continue;
                     t[n] = e[n];
                 }
             }
@@ -973,7 +973,7 @@
             if (Object.getOwnPropertySymbols) {
                 var o = Object.getOwnPropertySymbols(e);
                 for (n = 0; n < o.length; n++) {
-                    t = o[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                    t = o[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
                 }
             }
             return a;
@@ -983,7 +983,7 @@
             var t = {};
             for (var n in e) {
                 if ({}.hasOwnProperty.call(e, n)) {
-                    if (r.includes(n)) continue;
+                    if (-1 !== r.indexOf(n)) continue;
                     t[n] = e[n];
                 }
             }

package/ColumnLayout.js

@@ -109,7 +109,7 @@
         if (Object.getOwnPropertySymbols) {
             var i = Object.getOwnPropertySymbols(e);
             for (n = 0; n < i.length; n++) {
-                t = i[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                t = i[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
             }
         }
         return a;
@@ -119,7 +119,7 @@
         var t = {};
         for (var n in e) {
             if ({}.hasOwnProperty.call(e, n)) {
-                if (r.includes(n)) continue;
+                if (-1 !== r.indexOf(n)) continue;
                 t[n] = e[n];
             }
         }
@@ -181,8 +181,8 @@
         componentId: "sc-121ntds-1"
     })([ "border-color:", ";flex:0 0 1;" ], c.variables.borderColorWeak);
     // CONCATENATED MODULE: ./src/ColumnLayout/Row.tsx
-    function S() {
-        return S = Object.assign ? Object.assign.bind() : function(e) {
+    function x() {
+        return x = Object.assign ? Object.assign.bind() : function(e) {
             for (var r = 1; r < arguments.length; r++) {
                 var t = arguments[r];
                 for (var n in t) {
@@ -190,31 +190,31 @@
                 }
             }
             return e;
-        }, S.apply(null, arguments);
+        }, x.apply(null, arguments);
     }
-    function j(e, r) {
+    function S(e, r) {
         if (null == e) return {};
-        var t, n, a = C(e, r);
+        var t, n, a = j(e, r);
         if (Object.getOwnPropertySymbols) {
             var i = Object.getOwnPropertySymbols(e);
             for (n = 0; n < i.length; n++) {
-                t = i[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                t = i[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
             }
         }
         return a;
     }
-    function C(e, r) {
+    function j(e, r) {
         if (null == e) return {};
         var t = {};
         for (var n in e) {
             if ({}.hasOwnProperty.call(e, n)) {
-                if (r.includes(n)) continue;
+                if (-1 !== r.indexOf(n)) continue;
                 t[n] = e[n];
             }
         }
         return t;
     }
-    var x = {
+    var C = {
         alignItems: i().oneOf([ "start", "end", "center", "stretch" ]),
         children: i().node,
         /** @private. */
@@ -224,7 +224,7 @@
         gutter: i().number
     };
     function P(e) {
-        var r = e.alignItems, a = r === void 0 ? "stretch" : r, i = e.children, l = e.divider, o = e.elementRef, c = e.gutter, u = j(e, [ "alignItems", "children", "divider", "elementRef", "gutter" ]);
+        var r = e.alignItems, a = r === void 0 ? "stretch" : r, i = e.children, l = e.divider, o = e.elementRef, c = e.gutter, u = S(e, [ "alignItems", "children", "divider", "elementRef", "gutter" ]);
         // @docs-props-type RowPropsBase
                 if (false) {
             var s;
@@ -248,7 +248,7 @@
         }), [ l ]);
         var v = t.Children.toArray(i).filter(t.isValidElement).map(d).reduce(f, []);
         
-        return n().createElement(O, S({
+        return n().createElement(O, x({
             "data-align-items": a,
             "data-test": "row",
             $hasDivider: l,
@@ -256,7 +256,7 @@
             ref: o
         }, u), v);
     }
-    P.propTypes = x;
+    P.propTypes = C;
     /* harmony default export */    const _ = P;
     // CONCATENATED MODULE: ./src/ColumnLayout/ColumnLayout.tsx
     function R() {
@@ -276,7 +276,7 @@
         if (Object.getOwnPropertySymbols) {
             var i = Object.getOwnPropertySymbols(e);
             for (n = 0; n < i.length; n++) {
-                t = i[n], r.includes(t) || {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
+                t = i[n], -1 === r.indexOf(t) && {}.propertyIsEnumerable.call(e, t) && (a[t] = e[t]);
             }
         }
         return a;
@@ -286,7 +286,7 @@
         var t = {};
         for (var n in e) {
             if ({}.hasOwnProperty.call(e, n)) {
-                if (r.includes(n)) continue;
+                if (-1 !== r.indexOf(n)) continue;
                 t[n] = e[n];
             }
         }