@kaizen/components 1.42.1 → 1.42.3

package/dist/cjs/Illustration/Spot/Spot.cjs

@@ -3,13 +3,19 @@
 var tslib = require('tslib');
 var React = require('react');
 var Base = require('../subcomponents/Base/Base.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
 var SPOT_ILLUSTRATION_BASE_PATH = "illustrations/heart/spot/";
 var createSpotIllustration = function (fileName) {
   // eslint-disable-next-line react/display-name
   return function (_a) {
     var enableAspectRatio = _a.enableAspectRatio,
       restProps = tslib.__rest(_a, ["enableAspectRatio"]);
-    return React.createElement(Base.Base, tslib.__assign({
+    return React__default.default.createElement(Base.Base, tslib.__assign({
       aspectRatio: enableAspectRatio ? "square" : undefined
     }, restProps, {
       name: "".concat(SPOT_ILLUSTRATION_BASE_PATH).concat(fileName)
@@ -440,4 +446,3 @@ exports.WellbeingSurvey1 = WellbeingSurvey1;
 exports.WellbeingSurvey2 = WellbeingSurvey2;
 exports.WellbeingSurvey3 = WellbeingSurvey3;
 exports.Workshop = Workshop;
-//# sourceMappingURL=Spot.cjs.map

package/dist/cjs/Illustration/subcomponents/Base/Base.cjs

@@ -5,29 +5,32 @@ var React = require('react');
 var classnames = require('classnames');
 var hostedAssets = require('@kaizen/hosted-assets');
 var Base_module = require('./Base.module.scss.cjs');
-const Base = /*#__PURE__*/function () {
-  const Base = function (_a) {
-    var name = _a.name,
-      _b = _a.alt,
-      alt = _b === void 0 ? "" : _b,
-      classNameOverride = _a.classNameOverride,
-      aspectRatio = _a.aspectRatio,
-      restProps = tslib.__rest(_a, ["name", "alt", "classNameOverride", "aspectRatio"]);
-    var className = classnames(Base_module.wrapper, classNameOverride);
-    return aspectRatio ? React.createElement("figure", {
-      className: classnames(Base_module.aspectRatioWrapper, aspectRatio && Base_module[aspectRatio])
-    }, React.createElement("img", tslib.__assign({}, restProps, {
-      className: className,
-      alt: alt,
-      src: hostedAssets.assetUrl(name)
-    }))) : React.createElement("img", tslib.__assign({}, restProps, {
-      className: className,
-      alt: alt,
-      src: hostedAssets.assetUrl(name)
-    }));
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
   };
-  Base.displayName = "Base";
-  return Base;
-}();
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+var Base = function (_a) {
+  var name = _a.name,
+    _b = _a.alt,
+    alt = _b === void 0 ? "" : _b,
+    classNameOverride = _a.classNameOverride,
+    aspectRatio = _a.aspectRatio,
+    restProps = tslib.__rest(_a, ["name", "alt", "classNameOverride", "aspectRatio"]);
+  var className = classnames__default.default(Base_module.wrapper, classNameOverride);
+  return aspectRatio ? React__default.default.createElement("figure", {
+    className: classnames__default.default(Base_module.aspectRatioWrapper, aspectRatio && Base_module[aspectRatio])
+  }, React__default.default.createElement("img", tslib.__assign({}, restProps, {
+    className: className,
+    alt: alt,
+    src: hostedAssets.assetUrl(name)
+  }))) : React__default.default.createElement("img", tslib.__assign({}, restProps, {
+    className: className,
+    alt: alt,
+    src: hostedAssets.assetUrl(name)
+  }));
+};
+Base.displayName = "Base";
 exports.Base = Base;
-//# sourceMappingURL=Base.cjs.map

package/dist/cjs/Illustration/subcomponents/Base/Base.module.scss.cjs

@@ -11,4 +11,3 @@ var styles = {
   "visuallyHidden": "Base-module_visuallyHidden__bykhu"
 };
 module.exports = styles;
-//# sourceMappingURL=Base.module.scss.cjs.map

package/dist/cjs/Illustration/subcomponents/VideoPlayer/VideoPlayer.cjs

@@ -8,6 +8,13 @@ var IconButton = require('../../../Button/IconButton/IconButton.cjs');
 var canPlayWebm = require('../../utils/canPlayWebm.cjs');
 var usePausePlay = require('../../utils/usePausePlay.cjs');
 var Base_module = require('../Base/Base.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 var VideoPlayer = function (_a) {
   var _b = _a.autoplay,
     autoplay = _b === void 0 ? true : _b,
@@ -18,9 +25,15 @@ var VideoPlayer = function (_a) {
     aspectRatio = _a.aspectRatio,
     onEnded = _a.onEnded;
   var videoRef = React.useRef(null);
-  var _d = React.useState(true),
+  var _d = React__default.default.useState(true),
     prefersReducedMotion = _d[0],
     setPrefersReducedMotion = _d[1];
+  var _e = React__default.default.useState(false),
+    isWebmCompatible = _e[0],
+    setIsWebmCompatible = _e[1];
+  var _f = React__default.default.useState(false),
+    windowIsAvailable = _f[0],
+    setWindowIsAvailable = _f[1];
   React.useEffect(function () {
     /**
      * Setting `muted` on the player is required in Safari/Webkit and older
@@ -101,10 +114,17 @@ var VideoPlayer = function (_a) {
       videoElement.removeEventListener("ended", onEnded);
     };
   }, [videoRef]);
+  React.useEffect(function () {
+    // SSR does not have a window, which is required for canPlayWebm.
+    if (window !== undefined) setWindowIsAvailable(true);
+  }, []);
+  React.useEffect(function () {
+    if (windowIsAvailable) setIsWebmCompatible(canPlayWebm.canPlayWebm());
+  }, [windowIsAvailable]);
   var pausePlay = usePausePlay.usePausePlay(videoRef);
-  return React.createElement("figure", {
-    className: classnames(Base_module.figure, aspectRatio && Base_module[aspectRatio], aspectRatio && Base_module.aspectRatioWrapper)
-  }, React.createElement("video", {
+  return React__default.default.createElement("figure", {
+    className: classnames__default.default(Base_module.figure, aspectRatio && Base_module[aspectRatio], aspectRatio && Base_module.aspectRatioWrapper)
+  }, React__default.default.createElement("video", {
     muted: true,
     "aria-hidden": true,
     preload: "metadata",
@@ -117,13 +137,13 @@ var VideoPlayer = function (_a) {
     autoPlay: prefersReducedMotion ? false : autoplay,
     playsInline: true,
     tabIndex: -1
-  }, canPlayWebm.canPlayWebm() && React.createElement("source", {
+  }, isWebmCompatible && React__default.default.createElement("source", {
     src: hostedAssets.assetUrl("".concat(source, ".webm")),
     type: "video/webm"
-  }), React.createElement("source", {
+  }), React__default.default.createElement("source", {
     src: hostedAssets.assetUrl("".concat(source, ".mp4")),
     type: "video/mp4"
-  })), React.createElement(IconButton.IconButton, {
+  })), React__default.default.createElement(IconButton.IconButton, {
     onClick: function () {
       return pausePlay.toggle();
     },
@@ -133,4 +153,3 @@ var VideoPlayer = function (_a) {
   }));
 };
 exports.VideoPlayer = VideoPlayer;
-//# sourceMappingURL=VideoPlayer.cjs.map

package/dist/cjs/Illustration/utils/canPlayWebm.cjs

@@ -18,4 +18,3 @@ var canPlayWebm = function () {
   return false;
 };
 exports.canPlayWebm = canPlayWebm;
-//# sourceMappingURL=canPlayWebm.cjs.map

package/dist/cjs/Illustration/utils/usePausePlay.cjs

@@ -5,6 +5,12 @@ require('tslib');
 require('../../Icon/subcomponents/SVG/SVG.cjs');
 var LaunchIcon = require('../../Icon/LaunchIcon.cjs');
 var PauseIcon = require('../../Icon/PauseIcon.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
 var usePausePlay = function (videoRef) {
   var _a = React.useState(false),
     isPaused = _a[0],
@@ -20,13 +26,12 @@ var usePausePlay = function (videoRef) {
         videoRef.current.pause();
       }
     },
-    icon: isPaused ? React.createElement(LaunchIcon.LaunchIcon, {
+    icon: isPaused ? React__default.default.createElement(LaunchIcon.LaunchIcon, {
       role: "presentation"
-    }) : React.createElement(PauseIcon.PauseIcon, {
+    }) : React__default.default.createElement(PauseIcon.PauseIcon, {
       role: "presentation"
     }),
     label: isPaused ? "Play animation" : "Pause animation"
   };
 };
 exports.usePausePlay = usePausePlay;
-//# sourceMappingURL=usePausePlay.cjs.map

package/dist/cjs/Input/Input/Input.cjs

@@ -4,41 +4,44 @@ var tslib = require('tslib');
 var React = require('react');
 var classnames = require('classnames');
 var Input_module = require('./Input.module.scss.cjs');
-const Input = /*#__PURE__*/function () {
-  const Input = function (_a) {
-    var inputRef = _a.inputRef,
-      _b = _a.status,
-      status = _b === void 0 ? "default" : _b,
-      startIconAdornment = _a.startIconAdornment,
-      endIconAdornment = _a.endIconAdornment,
-      _c = _a.reversed,
-      reversed = _c === void 0 ? false : _c,
-      _d = _a.type,
-      type = _d === void 0 ? "text" : _d,
-      value = _a.value,
-      defaultValue = _a.defaultValue,
-      classNameOverride = _a.classNameOverride,
-      disabled = _a.disabled,
-      restProps = tslib.__rest(_a, ["inputRef", "status", "startIconAdornment", "endIconAdornment", "reversed", "type", "value", "defaultValue", "classNameOverride", "disabled"]);
-    return React.createElement("div", {
-      className: classnames(Input_module.wrapper, reversed && Input_module.withReversed, disabled && Input_module.withDisabled, startIconAdornment && Input_module.withStartIconAdornment, endIconAdornment && Input_module.withEndIconAdornment, status != "default" && Input_module.hasStatus)
-    }, startIconAdornment && React.createElement("div", {
-      className: Input_module.startIconAdornment
-    }, startIconAdornment), React.createElement("input", tslib.__assign({
-      ref: inputRef,
-      type: type,
-      value: value,
-      defaultValue: defaultValue,
-      disabled: disabled,
-      className: classnames(Input_module.input, Input_module[status], classNameOverride, reversed ? Input_module.reversed : Input_module.default, disabled && Input_module.disabled)
-    }, restProps)), React.createElement("div", {
-      className: Input_module.focusRing
-    }), endIconAdornment && React.createElement("div", {
-      className: Input_module.endIconAdornment
-    }, endIconAdornment));
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
   };
-  Input.displayName = "Input";
-  return Input;
-}();
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+var Input = function (_a) {
+  var inputRef = _a.inputRef,
+    _b = _a.status,
+    status = _b === void 0 ? "default" : _b,
+    startIconAdornment = _a.startIconAdornment,
+    endIconAdornment = _a.endIconAdornment,
+    _c = _a.reversed,
+    reversed = _c === void 0 ? false : _c,
+    _d = _a.type,
+    type = _d === void 0 ? "text" : _d,
+    value = _a.value,
+    defaultValue = _a.defaultValue,
+    classNameOverride = _a.classNameOverride,
+    disabled = _a.disabled,
+    restProps = tslib.__rest(_a, ["inputRef", "status", "startIconAdornment", "endIconAdornment", "reversed", "type", "value", "defaultValue", "classNameOverride", "disabled"]);
+  return React__default.default.createElement("div", {
+    className: classnames__default.default(Input_module.wrapper, reversed && Input_module.withReversed, disabled && Input_module.withDisabled, startIconAdornment && Input_module.withStartIconAdornment, endIconAdornment && Input_module.withEndIconAdornment, status != "default" && Input_module.hasStatus)
+  }, startIconAdornment && React__default.default.createElement("div", {
+    className: Input_module.startIconAdornment
+  }, startIconAdornment), React__default.default.createElement("input", tslib.__assign({
+    ref: inputRef,
+    type: type,
+    value: value,
+    defaultValue: defaultValue,
+    disabled: disabled,
+    className: classnames__default.default(Input_module.input, Input_module[status], classNameOverride, reversed ? Input_module.reversed : Input_module.default, disabled && Input_module.disabled)
+  }, restProps)), React__default.default.createElement("div", {
+    className: Input_module.focusRing
+  }), endIconAdornment && React__default.default.createElement("div", {
+    className: Input_module.endIconAdornment
+  }, endIconAdornment));
+};
+Input.displayName = "Input";
 exports.Input = Input;
-//# sourceMappingURL=Input.cjs.map

package/dist/cjs/Input/Input/Input.module.scss.cjs

@@ -18,4 +18,3 @@ var styles = {
   "caution": "Input-module_caution__rC0sY"
 };
 module.exports = styles;
-//# sourceMappingURL=Input.module.scss.cjs.map

package/dist/cjs/Input/Input/types.cjs

@@ -4,4 +4,3 @@ var InputStatus = ["default", "success", "error", "caution"];
 var InputTypes = ["text", "email", "password"];
 exports.InputStatus = InputStatus;
 exports.InputTypes = InputTypes;
-//# sourceMappingURL=types.cjs.map

package/dist/cjs/Input/InputRange/InputRange.cjs

@@ -6,80 +6,83 @@ var classnames = require('classnames');
 var Text = require('../../Text/Text.cjs');
 var VisuallyHidden = require('../../VisuallyHidden/VisuallyHidden.cjs');
 var InputRange_module = require('./InputRange.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 /**
  * {@link https://cultureamp.design/?path=/docs/components-input-range--docs Storybook}
  */
-const InputRange = /*#__PURE__*/function () {
-  const InputRange = function (_a) {
-    var id = _a.id,
-      defaultValue = _a.defaultValue,
-      value = _a.value,
-      minLabel = _a.minLabel,
-      maxLabel = _a.maxLabel,
-      _b = _a.min,
-      min = _b === void 0 ? 1 : _b,
-      _c = _a.max,
-      max = _c === void 0 ? 10 : _c,
-      onChange = _a.onChange,
-      ariaDescribedby = _a["aria-describedby"],
-      classNameOverride = _a.classNameOverride,
-      disabled = _a.disabled,
-      readOnly = _a.readOnly,
-      restProps = tslib.__rest(_a, ["id", "defaultValue", "value", "minLabel", "maxLabel", "min", "max", "onChange", "aria-describedby", "classNameOverride", "disabled", "readOnly"]);
-    var _d = React.useState(0.5),
-      step = _d[0],
-      setStep = _d[1]; // Let the dot center between the notch initially
-    var visuallyHiddenHintId = "".concat(id, "-helper");
-    var readOnlyWithNoValue = readOnly && !value && !defaultValue;
-    // This has been split out into a different variable to allow usage of defaultValue above^
-    // Plus it lets us use max from props with its default value
-    var defaultValueWithDefault = defaultValue || (max + 1) / 2;
-    return React.createElement(React.Fragment, null, React.createElement("input", tslib.__assign({
-      id: id,
-      className: classnames(InputRange_module.ratingScaleRange, classNameOverride, readOnlyWithNoValue && InputRange_module.hideThumb, disabled && InputRange_module.disabled),
-      disabled: disabled || readOnly,
-      type: "range",
-      min: min,
-      max: max,
-      step: step,
-      defaultValue: value ? undefined : defaultValueWithDefault,
-      value: value,
-      "aria-valuenow": value,
-      "aria-valuemin": min,
-      "aria-valuemax": max,
-      "aria-describedby": "".concat(visuallyHiddenHintId, " ").concat(ariaDescribedby ? ariaDescribedby : ""),
-      onChange: function (e) {
-        setStep(1); // Put the stepper to 1 to avoid floating value
-        onChange === null || onChange === void 0 ? void 0 : onChange(e);
-      }
-    }, restProps)), React.createElement("div", {
-      className: classnames(InputRange_module.spokes, disabled && InputRange_module.disabled)
-    }, tslib.__spreadArray([], Array(max), true).map(function (_, index) {
-      return React.createElement("div", {
-        key: "".concat(id, "-spoke-").concat(index),
-        className: InputRange_module.spokeContainer
-      }, React.createElement("div", {
-        className: InputRange_module.spoke
-      }));
-    })), React.createElement(VisuallyHidden.VisuallyHidden, {
-      id: visuallyHiddenHintId
-    }, min, " is ", minLabel, ", ", max, " is ", maxLabel), React.createElement("div", {
-      className: InputRange_module.labelsContainer
-    }, !readOnlyWithNoValue && React.createElement("div", {
-      className: classnames(InputRange_module.sliderLabels, disabled && InputRange_module.disabled)
-    }, React.createElement(Text.Text, {
-      variant: "small",
-      color: "dark-reduced-opacity",
-      tag: "span"
-    }, minLabel), React.createElement(Text.Text, {
-      variant: "small",
-      color: "dark-reduced-opacity",
-      tag: "span"
-    }, maxLabel))));
-  };
-  InputRange.displayName = "InputRange";
-  return InputRange;
-}();
+var InputRange = function (_a) {
+  var id = _a.id,
+    defaultValue = _a.defaultValue,
+    value = _a.value,
+    minLabel = _a.minLabel,
+    maxLabel = _a.maxLabel,
+    _b = _a.min,
+    min = _b === void 0 ? 1 : _b,
+    _c = _a.max,
+    max = _c === void 0 ? 10 : _c,
+    onChange = _a.onChange,
+    ariaDescribedby = _a["aria-describedby"],
+    classNameOverride = _a.classNameOverride,
+    disabled = _a.disabled,
+    readOnly = _a.readOnly,
+    restProps = tslib.__rest(_a, ["id", "defaultValue", "value", "minLabel", "maxLabel", "min", "max", "onChange", "aria-describedby", "classNameOverride", "disabled", "readOnly"]);
+  var _d = React.useState(0.5),
+    step = _d[0],
+    setStep = _d[1]; // Let the dot center between the notch initially
+  var visuallyHiddenHintId = "".concat(id, "-helper");
+  var readOnlyWithNoValue = readOnly && !value && !defaultValue;
+  // This has been split out into a different variable to allow usage of defaultValue above^
+  // Plus it lets us use max from props with its default value
+  var defaultValueWithDefault = defaultValue || (max + 1) / 2;
+  return React__default.default.createElement(React__default.default.Fragment, null, React__default.default.createElement("input", tslib.__assign({
+    id: id,
+    className: classnames__default.default(InputRange_module.ratingScaleRange, classNameOverride, readOnlyWithNoValue && InputRange_module.hideThumb, disabled && InputRange_module.disabled),
+    disabled: disabled || readOnly,
+    type: "range",
+    min: min,
+    max: max,
+    step: step,
+    defaultValue: value ? undefined : defaultValueWithDefault,
+    value: value,
+    "aria-valuenow": value,
+    "aria-valuemin": min,
+    "aria-valuemax": max,
+    "aria-describedby": "".concat(visuallyHiddenHintId, " ").concat(ariaDescribedby ? ariaDescribedby : ""),
+    onChange: function (e) {
+      setStep(1); // Put the stepper to 1 to avoid floating value
+      onChange === null || onChange === void 0 ? void 0 : onChange(e);
+    }
+  }, restProps)), React__default.default.createElement("div", {
+    className: classnames__default.default(InputRange_module.spokes, disabled && InputRange_module.disabled)
+  }, tslib.__spreadArray([], Array(max), true).map(function (_, index) {
+    return React__default.default.createElement("div", {
+      key: "".concat(id, "-spoke-").concat(index),
+      className: InputRange_module.spokeContainer
+    }, React__default.default.createElement("div", {
+      className: InputRange_module.spoke
+    }));
+  })), React__default.default.createElement(VisuallyHidden.VisuallyHidden, {
+    id: visuallyHiddenHintId
+  }, min, " is ", minLabel, ", ", max, " is ", maxLabel), React__default.default.createElement("div", {
+    className: InputRange_module.labelsContainer
+  }, !readOnlyWithNoValue && React__default.default.createElement("div", {
+    className: classnames__default.default(InputRange_module.sliderLabels, disabled && InputRange_module.disabled)
+  }, React__default.default.createElement(Text.Text, {
+    variant: "small",
+    color: "dark-reduced-opacity",
+    tag: "span"
+  }, minLabel), React__default.default.createElement(Text.Text, {
+    variant: "small",
+    color: "dark-reduced-opacity",
+    tag: "span"
+  }, maxLabel))));
+};
+InputRange.displayName = "InputRange";
 exports.InputRange = InputRange;
-//# sourceMappingURL=InputRange.cjs.map

package/dist/cjs/Input/InputRange/InputRange.module.scss.cjs

@@ -11,4 +11,3 @@ var styles = {
   "sliderLabels": "InputRange-module_sliderLabels__qpYBv"
 };
 module.exports = styles;
-//# sourceMappingURL=InputRange.module.scss.cjs.map

package/dist/cjs/Input/InputSearch/InputSearch.cjs

@@ -11,56 +11,59 @@ require('../../Loading/LoadingInput/LoadingInput.cjs');
 require('../../Loading/LoadingParagraph/LoadingParagraph.cjs');
 var LoadingSpinner = require('../../Loading/LoadingSpinner/LoadingSpinner.cjs');
 var InputSearch_module = require('./InputSearch.module.scss.cjs');
-const InputSearch = /*#__PURE__*/function () {
-  const InputSearch = function (props) {
-    var value = props.value,
-      onChange = props.onChange,
-      onClear = props.onClear,
-      classNameOverride = props.classNameOverride,
-      disabled = props.disabled,
-      _a = props.reversed,
-      reversed = _a === void 0 ? false : _a,
-      _b = props.loading,
-      loading = _b === void 0 ? false : _b,
-      _c = props.secondary,
-      secondary = _c === void 0 ? false : _c,
-      restProps = tslib.__rest(props, ["value", "onChange", "onClear", "classNameOverride", "disabled", "reversed", "loading", "secondary"]);
-    var inputRef = React.useRef(null);
-    var handleOnClear = function () {
-      var _a;
-      (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-      onClear && onClear();
-    };
-    return React.createElement("div", {
-      className: classnames(InputSearch_module.wrapper, secondary ? InputSearch_module.secondary : InputSearch_module.default, reversed && InputSearch_module.reversed, disabled && InputSearch_module.disabled, value && InputSearch_module.hasEndIconAdornment, classNameOverride)
-    }, React.createElement("div", {
-      className: InputSearch_module.startIconAdornment
-    }, loading ? React.createElement(LoadingSpinner.LoadingSpinner, {
-      accessibilityLabel: "",
-      size: "sm",
-      classNameOverride: InputSearch_module.loadingSpinner
-    }) : React.createElement(SearchIcon.SearchIcon, {
-      role: "presentation"
-    })), React.createElement("input", tslib.__assign({
-      ref: inputRef,
-      type: "search",
-      className: InputSearch_module.input,
-      disabled: disabled,
-      value: value,
-      onChange: onChange,
-      readOnly: onChange === undefined
-    }, restProps)), React.createElement("div", {
-      className: InputSearch_module.focusRing
-    }), value && React.createElement(ClearButton.ClearButton, {
-      isReversed: reversed,
-      onClick: handleOnClear,
-      disabled: disabled,
-      classNameOverride: InputSearch_module.endIconAdornment,
-      "aria-label": "clear search"
-    }));
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
   };
-  InputSearch.displayName = "InputSearch";
-  return InputSearch;
-}();
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+var InputSearch = function (props) {
+  var value = props.value,
+    onChange = props.onChange,
+    onClear = props.onClear,
+    classNameOverride = props.classNameOverride,
+    disabled = props.disabled,
+    _a = props.reversed,
+    reversed = _a === void 0 ? false : _a,
+    _b = props.loading,
+    loading = _b === void 0 ? false : _b,
+    _c = props.secondary,
+    secondary = _c === void 0 ? false : _c,
+    restProps = tslib.__rest(props, ["value", "onChange", "onClear", "classNameOverride", "disabled", "reversed", "loading", "secondary"]);
+  var inputRef = React.useRef(null);
+  var handleOnClear = function () {
+    var _a;
+    (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    onClear && onClear();
+  };
+  return React__default.default.createElement("div", {
+    className: classnames__default.default(InputSearch_module.wrapper, secondary ? InputSearch_module.secondary : InputSearch_module.default, reversed && InputSearch_module.reversed, disabled && InputSearch_module.disabled, value && InputSearch_module.hasEndIconAdornment, classNameOverride)
+  }, React__default.default.createElement("div", {
+    className: InputSearch_module.startIconAdornment
+  }, loading ? React__default.default.createElement(LoadingSpinner.LoadingSpinner, {
+    accessibilityLabel: "",
+    size: "sm",
+    classNameOverride: InputSearch_module.loadingSpinner
+  }) : React__default.default.createElement(SearchIcon.SearchIcon, {
+    role: "presentation"
+  })), React__default.default.createElement("input", tslib.__assign({
+    ref: inputRef,
+    type: "search",
+    className: InputSearch_module.input,
+    disabled: disabled,
+    value: value,
+    onChange: onChange,
+    readOnly: onChange === undefined
+  }, restProps)), React__default.default.createElement("div", {
+    className: InputSearch_module.focusRing
+  }), value && React__default.default.createElement(ClearButton.ClearButton, {
+    isReversed: reversed,
+    onClick: handleOnClear,
+    disabled: disabled,
+    classNameOverride: InputSearch_module.endIconAdornment,
+    "aria-label": "clear search"
+  }));
+};
+InputSearch.displayName = "InputSearch";
 exports.InputSearch = InputSearch;
-//# sourceMappingURL=InputSearch.cjs.map

package/dist/cjs/Input/InputSearch/InputSearch.module.scss.cjs

@@ -14,4 +14,3 @@ var styles = {
   "reversed": "InputSearch-module_reversed__eS7Nr"
 };
 module.exports = styles;
-//# sourceMappingURL=InputSearch.module.scss.cjs.map

package/dist/cjs/KaizenProvider/KaizenProvider.cjs

@@ -8,31 +8,33 @@ var ToastNotificationsList = require('../Notification/ToastNotification/ToastNot
 var ToastNotificationContext = require('../Notification/ToastNotification/context/ToastNotificationContext.cjs');
 var FontDefinitions = require('./subcomponents/FontDefinitions/FontDefinitions.cjs');
 var OptionalIntlProvider = require('./subcomponents/OptionalIntlProvider/OptionalIntlProvider.cjs');
-const KaizenProvider = /*#__PURE__*/function () {
-  const KaizenProvider = function (_a) {
-    var children = _a.children,
-      _b = _a.locale,
-      locale = _b === void 0 ? "en" : _b;
-    var _c = React.useState(false),
-      documentIsAvailable = _c[0],
-      setDocumentIsAvailable = _c[1];
-    var _d = React.useState(),
-      notificationsList = _d[0],
-      setNotificationsList = _d[1];
-    React.useEffect(function () {
-      // SSR does not have a document, which is required for ToastNotificationsList.
-      // Await document render before rendering the component.
-      if (document !== undefined) {
-        setNotificationsList(React.createElement(ToastNotificationsList.ToastNotificationsList, null));
-        setDocumentIsAvailable(true);
-      }
-    }, [documentIsAvailable]);
-    return React.createElement(OptionalIntlProvider.OptionalIntlProvider, {
-      locale: locale
-    }, React.createElement(React.Fragment, null, React.createElement(ToastNotificationContext.ToastNotificationProvider, null, notificationsList, children), React.createElement(FontDefinitions.FontDefinitions, null)));
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
   };
-  KaizenProvider.displayName = "KaizenProvider";
-  return KaizenProvider;
-}();
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var KaizenProvider = function (_a) {
+  var children = _a.children,
+    _b = _a.locale,
+    locale = _b === void 0 ? "en" : _b;
+  var _c = React.useState(false),
+    documentIsAvailable = _c[0],
+    setDocumentIsAvailable = _c[1];
+  var _d = React.useState(),
+    notificationsList = _d[0],
+    setNotificationsList = _d[1];
+  React.useEffect(function () {
+    // SSR does not have a document, which is required for ToastNotificationsList.
+    // Await document render before rendering the component.
+    if (document !== undefined) {
+      setNotificationsList(React__default.default.createElement(ToastNotificationsList.ToastNotificationsList, null));
+      setDocumentIsAvailable(true);
+    }
+  }, [documentIsAvailable]);
+  return React__default.default.createElement(OptionalIntlProvider.OptionalIntlProvider, {
+    locale: locale
+  }, React__default.default.createElement(React__default.default.Fragment, null, React__default.default.createElement(ToastNotificationContext.ToastNotificationProvider, null, notificationsList, children), React__default.default.createElement(FontDefinitions.FontDefinitions, null)));
+};
+KaizenProvider.displayName = "KaizenProvider";
 exports.KaizenProvider = KaizenProvider;
-//# sourceMappingURL=KaizenProvider.cjs.map