@splunk/react-ui 4.38.0 → 4.40.0

package/Chip.js

@@ -61,78 +61,82 @@
         e.r(r);
     // EXPORTS
         e.d(r, {
-        default: () => /* reexport */ G
+        default: () => /* reexport */ X
     });
     // CONCATENATED MODULE: external "react"
     const a = require("react");
     var o =  e.n(a);
     // CONCATENATED MODULE: external "lodash/omit"
     const n = require("lodash/omit");
-    var t =  e.n(n);
+    var i =  e.n(n);
     // CONCATENATED MODULE: external "prop-types"
-    const i = require("prop-types");
-    var l =  e.n(i);
+    const t = require("prop-types");
+    var l =  e.n(t);
     // CONCATENATED MODULE: external "@splunk/react-icons/Cross"
     const s = require("@splunk/react-icons/Cross");
     var c =  e.n(s);
     // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/Close"
-    const p = require("@splunk/react-icons/enterprise/Close");
-    var u =  e.n(p);
+    const u = require("@splunk/react-icons/enterprise/Close");
+    var p =  e.n(u);
     // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
     const d = require("@splunk/ui-utils/i18n");
     // CONCATENATED MODULE: external "@splunk/ui-utils/color"
-    const f = require("@splunk/ui-utils/color");
+    const v = require("@splunk/ui-utils/color");
     // CONCATENATED MODULE: external "@splunk/ui-utils/format"
-    const v = require("@splunk/ui-utils/format");
+    const f = require("@splunk/ui-utils/format");
     // CONCATENATED MODULE: external "@splunk/themes"
     const b = require("@splunk/themes");
     // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
-    const g = require("@splunk/react-ui/ScreenReaderContent");
-    var m =  e.n(g);
+    const m = require("@splunk/react-ui/ScreenReaderContent");
+    var g =  e.n(m);
     // CONCATENATED MODULE: external "styled-components"
     const h = require("styled-components");
     var C =  e.n(h);
     // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
     const y = require("@splunk/react-ui/Clickable");
-    var x =  e.n(y);
+    var $ =  e.n(y);
     // CONCATENATED MODULE: ./src/Chip/ChipStyles.ts
-    var $ = (0, h.css)([ "", ";background-color:", ";border:1px solid transparent;flex:0 1 auto;max-width:calc(100% - 3px);border-radius:2px;", " ", " ", "" ], b.mixins.reset("inline-flex"), (0, 
+    var x = (0, h.css)([ "", ";background-color:", ";border:1px solid transparent;border-radius:2px;", " flex:0 1 auto;max-width:calc(100% - 3px);", " ", " ", "" ], b.mixins.reset("inline-flex"), (0, 
     b.pickVariant)("$appearance", {
         default: {
-            enterprise: {
-                dark: b.variables.gray45,
-                light: b.variables.gray92
-            },
+            enterprise: b.variables.neutral300,
             prisma: b.variables.neutral100
         },
         info: {
-            enterprise: b.variables.infoColorL30
+            enterprise: b.variables.infoColorL30,
+            prisma: b.variables.statusColorInfo
         },
         success: {
-            enterprise: b.variables.successColorL30
+            enterprise: b.variables.successColorL30,
+            prisma: b.variables.statusColorNormal
         },
         warning: {
-            enterprise: b.variables.warningColorL30
+            enterprise: b.variables.warningColorL30,
+            prisma: b.variables.statusColorMedium
         },
         error: {
             enterprise: b.variables.errorColorL30,
-            prisma: b.variables.accentColorNegative
-        },
-        outline: {
-            prisma: "transparent"
+            prisma: b.variables.statusColorHigh
         },
+        outline: "transparent",
         custom: function e(r) {
             var a = r.$backgroundColor;
             return a;
         }
+    }), (function(e) {
+        var r = e.$appearance;
+        return r === "outline" && (0, h.css)([ "border-color:", ";" ], (0, b.pick)({
+            enterprise: {
+                dark: b.variables.gray80,
+                light: b.variables.gray60
+            },
+            prisma: b.variables.interactiveColorBorder
+        }));
     }), (0, b.pick)({
-        enterprise: (0, h.css)([ "color:", ";line-height:", ";margin:0 2px 2px 0;" ], b.variables.textGray, b.variables.lineHeight),
-        prisma: (0, h.css)([ "color:", ";line-height:16px;margin:1px;", "" ], (function(e) {
+        enterprise: (0, h.css)([ "line-height:", ";margin:0 2px 2px 0;" ], b.variables.lineHeight),
+        prisma: (0, h.css)([ "color:", ";line-height:16px;margin:1px;" ], (function(e) {
             var r = e.$appearance;
-            return r === "error" ? b.variables.contentColorInverted : b.variables.contentColorDefault;
-        }), (function(e) {
-            var r = e.$appearance;
-            return r === "outline" && (0, h.css)([ "border-color:", ";" ], b.variables.interactiveColorBorder);
+            return r === "default" || r === "outline" ? b.variables.contentColorDefault : b.variables.contentColorInverted;
         }))
     }), (0, b.pick)({
         enterprise: {
@@ -154,13 +158,16 @@
                 prisma: b.variables.interactiveColorBackgroundDisabled
             },
             info: {
-                enterprise: b.mixins.colorWithAlpha(b.variables.infoColorL10, .3)
+                enterprise: b.mixins.colorWithAlpha(b.variables.infoColorL10, .3),
+                prisma: b.variables.interactiveColorBackgroundDisabled
             },
             success: {
-                enterprise: b.mixins.colorWithAlpha(b.variables.successColorL10, .3)
+                enterprise: b.mixins.colorWithAlpha(b.variables.successColorL10, .3),
+                prisma: b.variables.interactiveColorBackgroundDisabled
             },
             warning: {
-                enterprise: b.mixins.colorWithAlpha(b.variables.warningColorL10, .3)
+                enterprise: b.mixins.colorWithAlpha(b.variables.warningColorL10, .3),
+                prisma: b.variables.interactiveColorBackgroundDisabled
             },
             error: {
                 enterprise: b.mixins.colorWithAlpha(b.variables.errorColorL10, .3),
@@ -181,7 +188,7 @@
     var k = C().div.withConfig({
         displayName: "ChipStyles__StyledBasic",
         componentId: "sc-1sd3tsh-0"
-    })([ "", "" ], $);
+    })([ "", "" ], x);
     var S = C()(k).withConfig({
         displayName: "ChipStyles__Styled",
         componentId: "sc-1sd3tsh-1"
@@ -230,7 +237,7 @@
             },
             prisma: function e(r) {
                 var a = r.$foregroundColor, o = r.$appearance;
-                return a || (o === "error" ? b.variables.contentColorInverted : b.variables.contentColorDefault);
+                return a || (o === "default" || o === "outline" ? b.variables.contentColorDefault : b.variables.contentColorInverted);
             }
         }
     }));
@@ -248,7 +255,7 @@
             },
             prisma: function e(r) {
                 var a = r.$appearance, o = r.$foregroundColor;
-                return o || (a === "error" ? b.variables.contentColorInverted : b.variables.contentColorActive);
+                return o || (a === "default" || a === "outline" ? b.variables.contentColorActive : b.variables.contentColorInverted);
             }
         }
     }));
@@ -274,15 +281,13 @@
             return r ? b.variables.contentColorDisabled : a || "inherit";
         }))
     }));
-    var j = C()(x()).withConfig({
+    var I = C()($()).withConfig({
         displayName: "ChipStyles__StyledClickable",
         componentId: "sc-1sd3tsh-6"
-    })([ "", " flex:0 1 auto;line-height:16px;cursor:pointer;&:focus{", ";}&:not([disabled]):hover{", ";}", ";" ], $, (0, 
+    })([ "", " flex:0 1 auto;line-height:16px;cursor:pointer;&:focus{", ";}&:not([disabled]):hover{", ";}", ";" ], x, (0, 
     b.pick)({
         enterprise: (0, h.css)([ "box-shadow:", ";color:", ";" ], b.variables.focusShadow, b.variables.linkColor),
-        prisma: (0, h.css)([ "color:", ";", "{background-color:", ";box-shadow:0 0 0 3px ", ";}" ], b.variables.contentColorActive, 
-        /* sc-sel */
-        _, b.variables.interactiveColorOverlayHover, b.variables.focusColor)
+        prisma: (0, h.css)([ "color:", ";", "{background-color:", ";box-shadow:0 0 0 3px ", ";}" ], b.variables.contentColorActive, /* sc-sel */ _, b.variables.interactiveColorOverlayHover, b.variables.focusColor)
     }), (0, b.pick)({
         enterprise: (0, h.css)([ "background-color:", ";", "{color:", ";}" ], (0, b.pickVariant)("$appearance", {
             default: {
@@ -297,113 +302,97 @@
                 dark: b.variables.gray30,
                 light: b.variables.gray96
             }
-        }), 
-        /* sc-sel */
-        _, (function(e) {
+        }), /* sc-sel */ _, (function(e) {
             var r = e.$foregroundColor;
             return r || b.variables.linkColor;
         })),
-        prisma: (0, h.css)([ "color:", ";", "{background-color:", ";", ";}" ], b.variables.contentColorActive, 
-        /* sc-sel */
-        _, b.variables.interactiveColorOverlayHover, (function(e) {
-            var r = e.$appearance;
-            return r === "error" && (0, h.css)([ "color:", ";" ], b.variables.contentColorInverted);
+        prisma: (0, h.css)([ "", "{background-color:", ";color:", ";}" ], /* sc-sel */ _, b.variables.interactiveColorOverlayHover, (function(e) {
+            var r = e.$appearance, a = e.$foregroundColor;
+            return a || (r === "default" || r === "outline" ? b.variables.contentColorActive : b.variables.contentColorInverted);
         }))
     }), (0, b.pick)({
-        prisma: (0, h.css)([ "&:not([disabled]):active ", "{background-color:", ";}" ], 
-        /* sc-sel */
-        _, b.variables.interactiveColorOverlayActive)
+        prisma: (0, h.css)([ "&:not([disabled]):active ", "{background-color:", ";}" ], /* sc-sel */ _, b.variables.interactiveColorOverlayActive)
     }));
     // CONCATENATED MODULE: ./src/Chip/Chip.tsx
     function q() {
-        q = Object.assign || function(e) {
+        return q = Object.assign ? Object.assign.bind() : function(e) {
             for (var r = 1; r < arguments.length; r++) {
                 var a = arguments[r];
                 for (var o in a) {
-                    if (Object.prototype.hasOwnProperty.call(a, o)) {
-                        e[o] = a[o];
-                    }
+                    ({}).hasOwnProperty.call(a, o) && (e[o] = a[o]);
                 }
             }
             return e;
-        };
-        return q.apply(this, arguments);
+        }, q.apply(null, arguments);
     }
     function E(e, r) {
-        return z(e) || L(e, r) || A(e, r) || I();
+        return z(e) || L(e, r) || D(e, r) || j();
     }
-    function I() {
+    function j() {
         throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     }
-    function A(e, r) {
-        if (!e) return;
-        if (typeof e === "string") return D(e, r);
-        var a = Object.prototype.toString.call(e).slice(8, -1);
-        if (a === "Object" && e.constructor) a = e.constructor.name;
-        if (a === "Map" || a === "Set") return Array.from(e);
-        if (a === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a)) return D(e, r);
-    }
     function D(e, r) {
-        if (r == null || r > e.length) r = e.length;
-        for (var a = 0, o = new Array(r); a < r; a++) {
+        if (e) {
+            if ("string" == typeof e) return A(e, r);
+            var a = {}.toString.call(e).slice(8, -1);
+            return "Object" === a && e.constructor && (a = e.constructor.name), "Map" === a || "Set" === a ? Array.from(e) : "Arguments" === a || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a) ? A(e, r) : void 0;
+        }
+    }
+    function A(e, r) {
+        (null == r || r > e.length) && (r = e.length);
+        for (var a = 0, o = Array(r); a < r; a++) {
             o[a] = e[a];
         }
         return o;
     }
     function L(e, r) {
-        if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(e))) return;
-        var a = [];
-        var o = true;
-        var n = false;
-        var t = undefined;
-        try {
-            for (var i = e[Symbol.iterator](), l; !(o = (l = i.next()).done); o = true) {
-                a.push(l.value);
-                if (r && a.length === r) break;
-            }
-        } catch (e) {
-            n = true;
-            t = e;
-        } finally {
+        var a = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
+        if (null != a) {
+            var o, n, i, t, l = [], s = !0, c = !1;
             try {
-                if (!o && i["return"] != null) i["return"]();
+                if (i = (a = a.call(e)).next, 0 === r) {
+                    if (Object(a) !== a) return;
+                    s = !1;
+                } else for (;!(s = (o = i.call(a)).done) && (l.push(o.value), l.length !== r); s = !0) {
+                }
+            } catch (e) {
+                c = !0, n = e;
             } finally {
-                if (n) throw t;
+                try {
+                    if (!s && null != a["return"] && (t = a["return"](), Object(t) !== t)) return;
+                } finally {
+                    if (c) throw n;
+                }
             }
+            return l;
         }
-        return a;
     }
     function z(e) {
         if (Array.isArray(e)) return e;
     }
-    function N(e, r) {
-        if (e == null) return {};
-        var a = T(e, r);
-        var o, n;
+    function B(e, r) {
+        if (null == e) return {};
+        var a, o, n = H(e, r);
         if (Object.getOwnPropertySymbols) {
-            var t = Object.getOwnPropertySymbols(e);
-            for (n = 0; n < t.length; n++) {
-                o = t[n];
-                if (r.indexOf(o) >= 0) continue;
-                if (!Object.prototype.propertyIsEnumerable.call(e, o)) continue;
-                a[o] = e[o];
+            var i = Object.getOwnPropertySymbols(e);
+            for (o = 0; o < i.length; o++) {
+                a = i[o], r.includes(a) || {}.propertyIsEnumerable.call(e, a) && (n[a] = e[a]);
             }
         }
-        return a;
+        return n;
     }
-    function T(e, r) {
-        if (e == null) return {};
+    function H(e, r) {
+        if (null == e) return {};
         var a = {};
-        var o = Object.keys(e);
-        var n, t;
-        for (t = 0; t < o.length; t++) {
-            n = o[t];
-            if (r.indexOf(n) >= 0) continue;
-            a[n] = e[n];
+        for (var o in e) {
+            if ({}.hasOwnProperty.call(e, o)) {
+                if (r.includes(o)) continue;
+                a[o] = e[o];
+            }
         }
         return a;
     }
-    var H = {
+    /** @public */    var N = {
         appearance: l().oneOf([ "info", "success", "warning", "error", "outline" ]),
         backgroundColor: l().string,
         children: l().node.isRequired,
@@ -418,62 +407,62 @@
     function P(e) {
         return !!e.onRequestRemove;
     }
-    function B(e) {
-        var r = e.appearance, a = e.backgroundColor, o = e.disabled, n = e.foregroundColor, t = e.icon, i = N(e, [ "appearance", "backgroundColor", "disabled", "foregroundColor", "icon" ]);
+    function T(e) {
+        var r = e.appearance, a = e.backgroundColor, o = e.disabled, n = e.foregroundColor, i = e.icon, t = B(e, [ "appearance", "backgroundColor", "disabled", "foregroundColor", "icon" ]);
  // Validate that the color being rendered into the CSS is restricted to only values that are of CSS type <color>.
-                var l = n && (0, f.isCSSColor)(n) ? n : undefined;
-        var s = a && (0, f.isCSSColor)(a) ? a : undefined;
+                var l = n && (0, v.isCSSColor)(n) ? n : undefined;
+        var s = a && (0, v.isCSSColor)(a) ? a : undefined;
         var c = {
             "data-test": "chip",
             $appearance: r || (s ? "custom" : "default"),
             $backgroundColor: s,
             $foregroundColor: l,
             disabled: o,
-            icon: t
+            icon: i
         };
-        return [ c, i ];
+        return [ c, t ];
     }
     function V(e) {
-        var r = B(e), n = E(r, 2), i = n[0], l = n[1];
-        var s = i.$appearance, p = i.$foregroundColor, f = i.disabled, g = f === void 0 ? false : f, h = i.icon, C = N(i, [ "$appearance", "$foregroundColor", "disabled", "icon" ]);
-        var y = l.children, x = l.elementRef, $ = l.onRequestRemove, k = l.value, S = N(l, [ "children", "elementRef", "onRequestRemove", "value" ]);
-        var I = (0, b.useSplunkTheme)(), A = I.isEnterprise;
-        var D = typeof y === "string";
-        var L = D ? (0, v.sprintf)((0, d._)("Remove %(children)s"), {
+        var r = T(e), n = E(r, 2), t = n[0], l = n[1];
+        var s = t.$appearance, u = t.$foregroundColor, v = t.disabled, m = v === void 0 ? false : v, h = t.icon, C = B(t, [ "$appearance", "$foregroundColor", "disabled", "icon" ]);
+        var y = l.children, $ = l.elementRef, x = l.onRequestRemove, k = l.value, S = B(l, [ "children", "elementRef", "onRequestRemove", "value" ]);
+        var j = (0, b.useSplunkTheme)(), D = j.isEnterprise;
+        var A = typeof y === "string";
+        var L = A ? (0, f.sprintf)((0, d._)("Remove %(children)s"), {
             children: y
         }) : (0, d._)("Remove");
         var z = (0, a.useCallback)((function(e) {
-            $(e, {
+            x(e, {
                 value: k
             });
-        }), [ $, k ]);
+        }), [ x, k ]);
         
-        return o().createElement(j, q({
+        return o().createElement(I, q({
             $appearance: s,
-            $disabled: g,
-            $foregroundColor: p,
+            $disabled: m,
+            $foregroundColor: u,
             "data-test-value": k,
-            disabled: g,
-            elementRef: x,
+            disabled: m,
+            elementRef: $,
             onClick: z
-        }, C, t()(S, Object.keys(H))),  o().createElement(w, {
+        }, C, i()(S, Object.keys(N))),  o().createElement(w, {
             $icon: !!h,
             $removable: true
-        },  o().createElement(m(), null, L), h &&  o().createElement(O, {
+        },  o().createElement(g(), null, L), h &&  o().createElement(O, {
             $appearance: s,
-            $disabled: g,
-            $foregroundColor: p
+            $disabled: m,
+            $foregroundColor: u
         }, h),  o().createElement(R, {
             "data-test": "label",
-            "aria-hidden": D ? true : undefined,
+            "aria-hidden": A ? true : undefined,
             $appearance: s,
-            $disabled: g,
-            $foregroundColor: p
+            $disabled: m,
+            $foregroundColor: u
         }, y),  o().createElement(_, {
             $appearance: s,
-            $disabled: g,
-            $foregroundColor: p
-        }, A ?  o().createElement(u(), {
+            $disabled: m,
+            $foregroundColor: u
+        }, D ?  o().createElement(p(), {
             "data-test": "cross",
             hideDefaultTooltip: true,
             screenReaderText: null,
@@ -485,22 +474,22 @@
         }))));
     }
     function M(e) {
-        var r = B(e), a = E(r, 2), n = a[0], i = a[1];
-        var l = n.$appearance, s = n.$foregroundColor, c = n.disabled, p = n.icon, u = N(n, [ "$appearance", "$foregroundColor", "disabled", "icon" ]);
-        var d = i.children, f = i.elementRef, v = N(i, [ "children", "elementRef" ]);
+        var r = T(e), a = E(r, 2), n = a[0], t = a[1];
+        var l = n.$appearance, s = n.$foregroundColor, c = n.disabled, u = n.icon, p = B(n, [ "$appearance", "$foregroundColor", "disabled", "icon" ]);
+        var d = t.children, v = t.elementRef, f = B(t, [ "children", "elementRef" ]);
         
         return o().createElement(S, q({
             $appearance: l,
             $disabled: c !== null && c !== void 0 ? c : false,
-            ref: f
-        }, u, t()(v, Object.keys(H))),  o().createElement(w, {
-            $icon: !!p,
+            ref: v
+        }, p, i()(f, Object.keys(N))),  o().createElement(w, {
+            $icon: !!u,
             $removable: false
-        }, p &&  o().createElement(O, {
+        }, u &&  o().createElement(O, {
             $appearance: l,
             $disabled: c !== null && c !== void 0 ? c : false,
             $foregroundColor: s
-        }, p),  o().createElement(R, {
+        }, u),  o().createElement(R, {
             "data-test": "label",
             $appearance: l,
             $disabled: c !== null && c !== void 0 ? c : false,
@@ -511,8 +500,9 @@
         // @docs-props-type ChipPropsBase
         return P(e) ?  o().createElement(V, e) :  o().createElement(M, e);
     }
-    W.propTypes = H;
-    /* harmony default export */    const G = W;
-    // CONCATENATED MODULE: ./src/Chip/index.ts
+    W.propTypes = N;
+    /* harmony default export */    const X = W;
+    // ChipInteractiveProps and ChipNonInteractiveProps are exported for Storybook
+        // CONCATENATED MODULE: ./src/Chip/index.ts
     module.exports = r;
     /******/})();