@vitality-ds/components 5.7.0 → 6.0.0-alpha.3

package/dist/esm/Input/Select/Select/primitives/index.js

@@ -8,6 +8,7 @@ import useGetCustomComponents from "../../hooks/useGetCustomComponents";
 import useMenuPositionProps from "../../hooks/useMenuPositionProps";
 import useTypeaheadChangeHandlers from "../../hooks/useTypeaheadChangeHandlers";
 import { getSafeInputValue, getSafeValue } from "../../logic";
+import { jsx as _jsx } from "react/jsx-runtime";
 var SelectPrimitive = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
   var css = _ref.css,
     asChild = _ref.asChild,
@@ -63,7 +64,7 @@ var SelectPrimitive = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef
     handleOnChange = _useTypeaheadChangeHa2[0],
     handleInputOnChange = _useTypeaheadChangeHa2[1];
   var menuPositionProps = useMenuPositionProps(menuPlacement, menuPosition, portalMenu);
-  return /*#__PURE__*/React.createElement(ReactSelect, _extends({
+  return /*#__PURE__*/_jsx(ReactSelect, _extends({
     id: id,
     inputId: inputId
     // does a check for value and if it exists, it will return the safeValue if it does other wise passes null to allow the component to function uncontrolled

package/dist/esm/Input/Select/components/Chip/MultiValueContainer/index.js

@@ -1,19 +1,22 @@
+import _extends from "@babel/runtime/helpers/extends";
 import React from "react";
 import { components } from "react-select";
 import ChipIcon from "../../../../../Chip/components/ChipIcon";
 import { BaseChip } from "../../../../../Chip/styled";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var MultiValueContainer = components.MultiValueContainer;
 function ChipMultiValueContainer(props) {
   var data = props.data;
   var iconProps = data.iconProps,
     onClick = data.onClick,
     isDisabled = data.isDisabled;
-  return /*#__PURE__*/React.createElement(BaseChip, {
+  return /*#__PURE__*/_jsxs(BaseChip, {
     size: "default",
     isInteractive: Boolean(onClick),
     onClick: onClick,
     reduceLeftPadding: Boolean(iconProps),
-    isDisabled: isDisabled
-  }, iconProps && /*#__PURE__*/React.createElement(ChipIcon, iconProps), /*#__PURE__*/React.createElement(MultiValueContainer, props));
+    isDisabled: isDisabled,
+    children: [iconProps && /*#__PURE__*/_jsx(ChipIcon, _extends({}, iconProps)), /*#__PURE__*/_jsx(MultiValueContainer, _extends({}, props))]
+  });
 }
 export default ChipMultiValueContainer;

package/dist/esm/Input/Select/components/Chip/MultiValueLabel/index.js

@@ -9,6 +9,7 @@ import ConditionalTooltipWrapper from "../../../../../helpers/components/Conditi
 import { EMPTY_OBJ } from "../../../../../helpers/logic/empties";
 import useForceUpdate from "../../../hooks/useForceUpdate";
 import useMultiValueLabelCheckbox from "./hooks/useMultiValueLabelCheckbox";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 var MultiValueLabel = components.MultiValueLabel;
 function ChipMultiValueLabel(props) {
   var data = props.data,
@@ -28,10 +29,15 @@ function ChipMultiValueLabel(props) {
       forceUpdate: forceUpdate
     }),
     handleCheckboxClick = _useMultiValueLabelCh.handleCheckboxClick;
-  return /*#__PURE__*/React.createElement(ConditionalTooltipWrapper, {
-    tooltipContent: tooltipContent
-  }, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(BaseChipLabelContainer, null, /*#__PURE__*/React.createElement(MultiValueLabel, props), metaLabelProps && /*#__PURE__*/React.createElement(MetaLabel, metaLabelProps)), chipCheckboxProps && /*#__PURE__*/React.createElement(ChipCheckbox, _extends({}, chipCheckboxProps, {
-    onClick: handleCheckboxClick
-  }))));
+  return /*#__PURE__*/_jsx(ConditionalTooltipWrapper, {
+    tooltipContent: tooltipContent,
+    children: /*#__PURE__*/_jsxs(_Fragment, {
+      children: [/*#__PURE__*/_jsxs(BaseChipLabelContainer, {
+        children: [/*#__PURE__*/_jsx(MultiValueLabel, _extends({}, props)), metaLabelProps && /*#__PURE__*/_jsx(MetaLabel, _extends({}, metaLabelProps))]
+      }), chipCheckboxProps && /*#__PURE__*/_jsx(ChipCheckbox, _extends({}, chipCheckboxProps, {
+        onClick: handleCheckboxClick
+      }))]
+    })
+  });
 }
 export default ChipMultiValueLabel;

package/dist/esm/Input/Select/components/Chip/MultiValueRemove/index.js

@@ -1,12 +1,18 @@
+import _extends from "@babel/runtime/helpers/extends";
 import { X } from "lucide-react";
 import React from "react";
 import { components } from "react-select";
 import { RemoveButtonContainer } from "../../../../../Chip/components/RemoveButton";
+import { jsx as _jsx } from "react/jsx-runtime";
 var MultiValueRemove = components.MultiValueRemove;
 function CustomMultiValueRemove(props) {
-  return /*#__PURE__*/React.createElement(RemoveButtonContainer, null, /*#__PURE__*/React.createElement(MultiValueRemove, props, /*#__PURE__*/React.createElement(X, {
-    color: "currentColor",
-    size: "1em"
-  })));
+  return /*#__PURE__*/_jsx(RemoveButtonContainer, {
+    children: /*#__PURE__*/_jsx(MultiValueRemove, _extends({}, props, {
+      children: /*#__PURE__*/_jsx(X, {
+        color: "currentColor",
+        size: "1em"
+      })
+    }))
+  });
 }
 export default CustomMultiValueRemove;

package/dist/esm/Input/Select/components/ClearButton/index.js

@@ -1,10 +1,14 @@
+import _extends from "@babel/runtime/helpers/extends";
 import { X } from "lucide-react";
 import React from "react";
 import { BaseClearButton } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 function CustomClearButton(innerProps) {
-  return /*#__PURE__*/React.createElement(BaseClearButton, innerProps, /*#__PURE__*/React.createElement(X, {
-    size: "1rem",
-    color: "currentColor"
+  return /*#__PURE__*/_jsx(BaseClearButton, _extends({}, innerProps, {
+    children: /*#__PURE__*/_jsx(X, {
+      size: "1rem",
+      color: "currentColor"
+    })
   }));
 }
 export default CustomClearButton;

package/dist/esm/Input/Select/components/Control/index.js

@@ -1,7 +1,9 @@
+import _extends from "@babel/runtime/helpers/extends";
 import React from "react";
 import { components } from "react-select";
 import AdornmentWrapper from "../../../TextInput/components/AdornmentWrapper";
 import { BaseIsMultiWrapper } from "./styled";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function CustomControl(innerProps) {
   var BaseControl = components.Control;
   var children = innerProps.children,
@@ -10,7 +12,7 @@ function CustomControl(innerProps) {
     hasValue = innerProps.hasValue;
   var icon = selectProps.icon;
   var renderAdornment = function renderAdornment() {
-    return /*#__PURE__*/React.createElement(AdornmentWrapper, {
+    return /*#__PURE__*/_jsx(AdornmentWrapper, {
       side: "start",
       adornmentProps: {
         type: "icon",
@@ -20,7 +22,11 @@ function CustomControl(innerProps) {
       }
     });
   };
-  return /*#__PURE__*/React.createElement(BaseControl, innerProps, icon && (isMulti && hasValue ? /*#__PURE__*/React.createElement(BaseIsMultiWrapper, null, renderAdornment()) : renderAdornment()), children);
+  return /*#__PURE__*/_jsxs(BaseControl, _extends({}, innerProps, {
+    children: [icon && (isMulti && hasValue ? /*#__PURE__*/_jsx(BaseIsMultiWrapper, {
+      children: renderAdornment()
+    }) : renderAdornment()), children]
+  }));
 }
 CustomControl.displayName = "CustomControl";
 export default CustomControl;

package/dist/esm/Input/Select/components/DropdownIndicator/index.js

@@ -2,18 +2,20 @@ import _extends from "@babel/runtime/helpers/extends";
 import { ChevronDown, ChevronUp } from "lucide-react";
 import React from "react";
 import { BaseDropdownIndicator } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 function CustomDropdownIndicator(innerProps) {
   var _innerProps$selectPro = innerProps.selectProps,
     menuIsOpen = _innerProps$selectPro.menuIsOpen,
     isDisabled = _innerProps$selectPro.isDisabled;
-  return /*#__PURE__*/React.createElement(BaseDropdownIndicator, _extends({}, innerProps, {
-    disabled: isDisabled
-  }), menuIsOpen ? /*#__PURE__*/React.createElement(ChevronUp, {
-    size: "1rem",
-    color: "currentColor"
-  }) : /*#__PURE__*/React.createElement(ChevronDown, {
-    size: "1rem",
-    color: "currentColor"
+  return /*#__PURE__*/_jsx(BaseDropdownIndicator, _extends({}, innerProps, {
+    disabled: isDisabled,
+    children: menuIsOpen ? /*#__PURE__*/_jsx(ChevronUp, {
+      size: "1rem",
+      color: "currentColor"
+    }) : /*#__PURE__*/_jsx(ChevronDown, {
+      size: "1rem",
+      color: "currentColor"
+    })
   }));
 }
 export default CustomDropdownIndicator;

package/dist/esm/Input/Select/components/Input/index.js

@@ -1,9 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from "react";
 import { CustomSelectInput } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 function CustomInput(innerProps) {
   var isDisabled = innerProps.isDisabled;
-  return /*#__PURE__*/React.createElement(CustomSelectInput, _extends({}, innerProps, {
+  return /*#__PURE__*/_jsx(CustomSelectInput, _extends({}, innerProps, {
     disabledStyling: isDisabled,
     isHidden: false
   }));

package/dist/esm/Input/Select/components/LoadingIndicator/index.js

@@ -1,7 +1,8 @@
 import React from "react";
 import Spinner from "../../../../Spinner";
+import { jsx as _jsx } from "react/jsx-runtime";
 function CustomLoadingIndicator() {
-  return /*#__PURE__*/React.createElement(Spinner, {
+  return /*#__PURE__*/_jsx(Spinner, {
     size: "sm"
   });
 }

package/dist/esm/Input/Select/components/Option/index.js

@@ -1,7 +1,9 @@
+import _extends from "@babel/runtime/helpers/extends";
 import React from "react";
 import { components } from "react-select";
 import OptionValueContents from "../OptionValueContents";
 import { BaseOption as BaseOptionComponent } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 function CustomRenderedOption(props) {
   var selectProps = props.selectProps,
     data = props.data,
@@ -13,7 +15,11 @@ function CustomRenderedOption(props) {
     isSelected: isSelected,
     isDisabled: isDisabled
   };
-  if (selectProps.renderOption) return /*#__PURE__*/React.createElement(components.Option, props, selectProps.renderOption(data, states));
-  return /*#__PURE__*/React.createElement(BaseOptionComponent, props, /*#__PURE__*/React.createElement(OptionValueContents, data));
+  if (selectProps.renderOption) return /*#__PURE__*/_jsx(components.Option, _extends({}, props, {
+    children: selectProps.renderOption(data, states)
+  }));
+  return /*#__PURE__*/_jsx(BaseOptionComponent, _extends({}, props, {
+    children: /*#__PURE__*/_jsx(OptionValueContents, _extends({}, data))
+  }));
 }
 export default CustomRenderedOption;

package/dist/esm/Input/Select/components/OptionValueContents/index.js

@@ -1,17 +1,23 @@
+import _extends from "@babel/runtime/helpers/extends";
 import React from "react";
 import Flex from "../../../../Flex";
 import Stack from "../../../../Stack";
 import { StatusBadge } from "../../../../StatusBadge";
 import ValueText from "./components/ValueText";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function OptionValueContents(_ref) {
   var label = _ref.label,
     statusBadgeProps = _ref.statusBadgeProps;
-  return /*#__PURE__*/React.createElement(Stack, {
+  return /*#__PURE__*/_jsxs(Stack, {
     direction: "horizontal",
     align: "center",
-    justify: "between"
-  }, /*#__PURE__*/React.createElement(ValueText, null, label), statusBadgeProps && /*#__PURE__*/React.createElement(Flex, {
-    shouldShrink: false
-  }, /*#__PURE__*/React.createElement(StatusBadge, statusBadgeProps)));
+    justify: "between",
+    children: [/*#__PURE__*/_jsx(ValueText, {
+      children: label
+    }), statusBadgeProps && /*#__PURE__*/_jsx(Flex, {
+      shouldShrink: false,
+      children: /*#__PURE__*/_jsx(StatusBadge, _extends({}, statusBadgeProps))
+    })]
+  });
 }
 export default OptionValueContents;

package/dist/esm/Input/Select/components/SingleValue/index.js

@@ -1,8 +1,12 @@
+import _extends from "@babel/runtime/helpers/extends";
 import React from "react";
 import { components } from "react-select";
 import OptionValueContents from "../OptionValueContents";
+import { jsx as _jsx } from "react/jsx-runtime";
 function CustomSingleValue(props) {
   var data = props.data;
-  return /*#__PURE__*/React.createElement(components.SingleValue, props, /*#__PURE__*/React.createElement(OptionValueContents, data));
+  return /*#__PURE__*/_jsx(components.SingleValue, _extends({}, props, {
+    children: /*#__PURE__*/_jsx(OptionValueContents, _extends({}, data))
+  }));
 }
 export default CustomSingleValue;

package/dist/esm/Input/Select/hooks/useGetCustomComponents.spec.js

@@ -1,4 +1,4 @@
-import { renderHook } from "@testing-library/react-hooks";
+import { renderHook } from "@testing-library/react";
 import useGetCustomComponents from "./useGetCustomComponents";
 describe("useGetCustomComponents", function () {
   var hideDropdownIndicator = true;

package/dist/esm/Input/TextInput/components/AdornmentWrapper/index.js

@@ -2,13 +2,16 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from "react";
 import { ADORNMENT_TYPES } from "./constants";
 import { BaseAdornmentWrapper } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 export default function AdornmentWrapper(_ref) {
   var adornmentProps = _ref.adornmentProps,
     side = _ref.side;
   var type = adornmentProps.type,
     props = adornmentProps.props;
   var Component = ADORNMENT_TYPES[type] || ADORNMENT_TYPES["default"];
-  return /*#__PURE__*/React.createElement(BaseAdornmentWrapper, null, /*#__PURE__*/React.createElement(Component, _extends({
-    side: side
-  }, props)));
+  return /*#__PURE__*/_jsx(BaseAdornmentWrapper, {
+    children: /*#__PURE__*/_jsx(Component, _extends({
+      side: side
+    }, props))
+  });
 }

package/dist/esm/Input/TextInput/components/ButtonAdornment/index.js

@@ -4,10 +4,15 @@ var _excluded = ["label"];
 import React from "react";
 import Button from "../../../../Button";
 import { ButtonWrapper } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 export default function ButtonAdornment(_ref) {
   var label = _ref.label,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(Button, _extends({
-    size: "compact"
-  }, restProps), label));
+  return /*#__PURE__*/_jsx(ButtonWrapper, {
+    children: /*#__PURE__*/_jsx(Button, _extends({
+      size: "compact"
+    }, restProps, {
+      children: label
+    }))
+  });
 }

package/dist/esm/Input/TextInput/components/IconAdornment/index.js

@@ -1,10 +1,13 @@
 import React from "react";
 import { IconWrapper } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 export default function IconAdornment(_ref) {
   var icon = _ref.icon,
     color = _ref.color;
   var Component = icon;
-  return /*#__PURE__*/React.createElement(IconWrapper, null, /*#__PURE__*/React.createElement(Component, {
-    color: color || "currentColor"
-  }));
+  return /*#__PURE__*/_jsx(IconWrapper, {
+    children: /*#__PURE__*/_jsx(Component, {
+      color: color || "currentColor"
+    })
+  });
 }

package/dist/esm/Input/TextInput/components/IconButtonAdornment/index.js

@@ -1,6 +1,10 @@
+import _extends from "@babel/runtime/helpers/extends";
 import React from "react";
 import IconButton from "../../../../IconButton";
 import { IconButtonWrapper } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 export default function IconButtonAdornment(props) {
-  return /*#__PURE__*/React.createElement(IconButtonWrapper, null, /*#__PURE__*/React.createElement(IconButton, props));
+  return /*#__PURE__*/_jsx(IconButtonWrapper, {
+    children: /*#__PURE__*/_jsx(IconButton, _extends({}, props))
+  });
 }

package/dist/esm/Input/TextInput/components/Mask/index.js

@@ -5,6 +5,7 @@ var _excluded = ["maskProps"],
 import React from "react";
 import { getPresetMaskConfig } from "./logic";
 import { BaseMaskedTextInput } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 var MaskedInput = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
   var maskProps = _ref.maskProps,
     restProps = _objectWithoutProperties(_ref, _excluded);
@@ -14,12 +15,12 @@ var MaskedInput = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
     restMaskProps = _objectWithoutProperties(maskProps, _excluded2);
   if (presetMask) {
     var presetConfig = getPresetMaskConfig(presetMask);
-    return /*#__PURE__*/React.createElement(BaseMaskedTextInput, _extends({
+    return /*#__PURE__*/_jsx(BaseMaskedTextInput, _extends({
       keepCharPositions: keepCharPositions,
       ref: forwardedRef
     }, restProps, presetConfig));
   }
-  return /*#__PURE__*/React.createElement(BaseMaskedTextInput, _extends({
+  return /*#__PURE__*/_jsx(BaseMaskedTextInput, _extends({
     keepCharPositions: keepCharPositions,
     ref: forwardedRef
   }, restMaskProps, restProps));

package/dist/esm/Input/TextInput/components/ShortcutAdornment/index.js

@@ -1,11 +1,12 @@
 import React from "react";
 import Shortcuts from "../../../../Shortcuts";
+import { jsx as _jsx } from "react/jsx-runtime";
 export default function ShortcutAdornment(_ref) {
   var keys = _ref.keys,
     combineKeys = _ref.combineKeys,
     color = _ref.color,
     variant = _ref.variant;
-  return /*#__PURE__*/React.createElement(Shortcuts, {
+  return /*#__PURE__*/_jsx(Shortcuts, {
     keys: keys,
     combineKeys: combineKeys,
     color: color,

package/dist/esm/Input/TextInput/components/SpinnerAdornment/index.js

@@ -1,8 +1,11 @@
 import React from "react";
 import Spinner from "../../../../Spinner";
 import { SpinnerWrapper } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 export default function SpinnerAdornment() {
-  return /*#__PURE__*/React.createElement(SpinnerWrapper, null, /*#__PURE__*/React.createElement(Spinner, {
-    size: "sm"
-  }));
+  return /*#__PURE__*/_jsx(SpinnerWrapper, {
+    children: /*#__PURE__*/_jsx(Spinner, {
+      size: "sm"
+    })
+  });
 }

package/dist/esm/Input/TextInput/components/TextAdornment/index.js

@@ -1,9 +1,11 @@
 import React from "react";
 import { AdornmentText } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 export default function TextAdornment(_ref) {
   var text = _ref.text,
     side = _ref.side;
-  return /*#__PURE__*/React.createElement(AdornmentText, {
-    side: side
-  }, text);
+  return /*#__PURE__*/_jsx(AdornmentText, {
+    side: side,
+    children: text
+  });
 }

package/dist/esm/Input/TextInput/index.js

@@ -6,16 +6,17 @@ import React from "react";
 import AdornmentWrapper from "./components/AdornmentWrapper";
 import MaskedInput from "./components/Mask";
 import { BaseInputWrapper, BaseTextInput } from "./styled";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var getInputComponent = function getInputComponent(_ref, forwardRef) {
   var maskProps = _ref.maskProps,
     restProps = _objectWithoutProperties(_ref, _excluded);
   if (maskProps) {
-    return /*#__PURE__*/React.createElement(MaskedInput, _extends({
+    return /*#__PURE__*/_jsx(MaskedInput, _extends({
       ref: forwardRef,
       maskProps: maskProps
     }, restProps));
   }
-  return /*#__PURE__*/React.createElement(BaseTextInput, _extends({}, restProps, {
+  return /*#__PURE__*/_jsx(BaseTextInput, _extends({}, restProps, {
     ref: forwardRef
   }));
 };
@@ -52,16 +53,17 @@ var TextInput = /*#__PURE__*/React.forwardRef(function (_ref2, forwardedRef) {
     maskProps: maskProps
   }, restProps);
   var inputComponent = getInputComponent(inputProps, forwardedRef);
-  return /*#__PURE__*/React.createElement(BaseInputWrapper, {
+  return /*#__PURE__*/_jsxs(BaseInputWrapper, {
     hasError: hasError,
-    disabled: disabled
-  }, !!adornStart && /*#__PURE__*/React.createElement(AdornmentWrapper, {
-    adornmentProps: adornStart,
-    side: "start"
-  }), inputComponent, !!adornEnd && /*#__PURE__*/React.createElement(AdornmentWrapper, {
-    adornmentProps: adornEnd,
-    side: "end"
-  }));
+    disabled: disabled,
+    children: [!!adornStart && /*#__PURE__*/_jsx(AdornmentWrapper, {
+      adornmentProps: adornStart,
+      side: "start"
+    }), inputComponent, !!adornEnd && /*#__PURE__*/_jsx(AdornmentWrapper, {
+      adornmentProps: adornEnd,
+      side: "end"
+    })]
+  });
 });
 TextInput.displayName = "TextInput";
 export default TextInput;

package/dist/esm/Input/TextInput/index.spec.js

@@ -3,6 +3,7 @@ import { fireEvent, getByPlaceholderText, getByTitle, render } from "@testing-li
 import React from "react";
 import { MASK_APPEARANCES } from "./components/Mask/constants";
 import TextInput from "./index";
+import { jsx as _jsx } from "react/jsx-runtime";
 var mockOnChange = jest.fn();
 var commonInputProps = {
   name: "nameOfInput",
@@ -13,7 +14,7 @@ var commonInputProps = {
 };
 describe("<TextInput />", function () {
   it("Should return an <div></div> with a child <input /> with type text", function () {
-    var _render = render(/*#__PURE__*/React.createElement(TextInput, _extends({
+    var _render = render(/*#__PURE__*/_jsx(TextInput, _extends({
         value: ""
       }, commonInputProps))),
       container = _render.container;
@@ -22,18 +23,18 @@ describe("<TextInput />", function () {
     expect(container.querySelector("input").getAttribute("type")).toEqual("text");
   });
   it("Should not call onChange Function on load", function () {
-    render(/*#__PURE__*/React.createElement(TextInput, commonInputProps));
+    render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps)));
     expect(mockOnChange).not.toHaveBeenCalled();
   });
   it("Should dispaly a value if given", function () {
-    var _render2 = render(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    var _render2 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
         value: "Prepopulated"
       }))),
       container = _render2.container;
     expect(container.querySelector("input").getAttribute("value")).toEqual("Prepopulated");
   });
   it("Should trigger onChange when value is changed on enabled input field", function () {
-    var _render3 = render(/*#__PURE__*/React.createElement(TextInput, commonInputProps)),
+    var _render3 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps))),
       container = _render3.container;
     fireEvent.change(getByPlaceholderText(container, commonInputProps.placeholder), {
       target: {
@@ -43,7 +44,7 @@ describe("<TextInput />", function () {
     expect(mockOnChange).toHaveBeenCalled();
   });
   it("Should not change value of input field when disabled", function () {
-    var _render4 = render(/*#__PURE__*/React.createElement(TextInput, commonInputProps)),
+    var _render4 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps))),
       container = _render4.container;
     fireEvent.change(getByPlaceholderText(container, commonInputProps.placeholder), {
       target: {
@@ -53,45 +54,45 @@ describe("<TextInput />", function () {
     expect(container.querySelector("input").value).not.toBe("test");
   });
   it("Should receive the hasError-true stitches class when hasError is given as a prop", function () {
-    var _render5 = render(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    var _render5 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
         hasError: true
       }))),
       container = _render5.container;
     expect(container.querySelector("div").getAttribute("class")).toContain("hasError-true");
   });
   it("Should not have the hasError-true stitches class when hasError is no longer true", function () {
-    var _render6 = render(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    var _render6 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
         hasError: true
       }))),
       container = _render6.container,
       rerender = _render6.rerender;
     expect(container.querySelector("div").getAttribute("class")).toContain("hasError-true");
-    rerender(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    rerender(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
       hasError: false
     })));
     expect(container.querySelector("div").getAttribute("class")).not.toContain("hasError-true");
   });
   it("When no textAlign prop is given then should have the stitches prop alignment-left", function () {
-    var _render7 = render(/*#__PURE__*/React.createElement(TextInput, commonInputProps)),
+    var _render7 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps))),
       container = _render7.container;
     expect(container.querySelector("input").getAttribute("class")).toContain("textAlign-left");
   });
   it("When textAlign='left' prop is given then should have the stitches prop alignment-left", function () {
-    var _render8 = render(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    var _render8 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
         textAlign: "left"
       }))),
       container = _render8.container;
     expect(container.querySelector("input").getAttribute("class")).toContain("textAlign-left");
   });
   it("When no textAlign='right' prop is given then should have the stitches prop alignment-right", function () {
-    var _render9 = render(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    var _render9 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
         textAlign: "right"
       }))),
       container = _render9.container;
     expect(container.querySelector("input").getAttribute("class")).toContain("textAlign-right");
   });
   it("Should return the appropriate value when a text mask is applied", function () {
-    var _render0 = render(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    var _render0 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
         maskProps: {
           presetMask: "creditCard"
         },
@@ -106,7 +107,7 @@ describe("<TextInput />", function () {
     expect(container.querySelector("input").value).toBe("123_ ____ ____ ____");
   });
   it("Should prevent characters from being entered that don't fit the mask's pattern", function () {
-    var _render1 = render(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    var _render1 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
         maskProps: {
           presetMask: "creditCard"
         },
@@ -121,7 +122,7 @@ describe("<TextInput />", function () {
     expect(container.querySelector("input").value).toBe("");
   });
   it("Should return specific mask rules when when a presetMask is applied", function () {
-    var _render10 = render(/*#__PURE__*/React.createElement(TextInput, _extends({}, commonInputProps, {
+    var _render10 = render(/*#__PURE__*/_jsx(TextInput, _extends({}, commonInputProps, {
         value: null,
         maskProps: {
           presetMask: "medicare"

package/dist/esm/Input/Textarea/index.js

@@ -4,6 +4,7 @@ var _excluded = ["css", "as", "asChild", "style", "className", "value", "name",
 import React, { useImperativeHandle, useLayoutEffect, useRef } from "react";
 import { manualResize, smartResize } from "./logic";
 import { BaseTextarea } from "./styled";
+import { jsx as _jsx } from "react/jsx-runtime";
 var Textarea = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
   var css = _ref.css,
     as = _ref.as,
@@ -53,7 +54,7 @@ var Textarea = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
       });
     }
   }, [textareaRef, minRows, maxRows, resize]);
-  return /*#__PURE__*/React.createElement(BaseTextarea, _extends({
+  return /*#__PURE__*/_jsx(BaseTextarea, _extends({
     value: value,
     name: name,
     ref: textareaRef,