@elliemae/ds-form 3.4.3-rc.1 → 3.5.0-rc.10

package/dist/esm/InputMask/props.js

@@ -3,43 +3,83 @@ import { PropTypes } from "@elliemae/ds-utilities";
 const inputProps = {
   autoFocus: PropTypes.bool.description("Should component focus automatically"),
   style: PropTypes.object.description("Set style for the input mask"),
-  disabled: PropTypes.bool.description("Whether the input mask is disabled or not"),
+  disabled: PropTypes.bool.description(
+    "Whether the input mask is disabled or not"
+  ),
   disableTooltip: PropTypes.bool.description("Whether to show a tooltip or not when text does not fit").defaultValue(true),
   className: PropTypes.string.description("css class"),
   name: PropTypes.string.description("html name prop for form"),
   maxLength: PropTypes.number.description("Max length for the input mask"),
   minLength: PropTypes.number.description("Min length for the input mask"),
-  fluidWidth: PropTypes.bool.description("Whether to make the content of the input mask fit the container or not"),
-  isShowElipsisActive: PropTypes.bool.description("Wheter to enable the ellipsis and tooltip functionality or not").defaultValue(true),
-  placeholder: PropTypes.node.description("Component that works as placeholder"),
-  onKeyDown: PropTypes.func.description("Allows a function that is triggered once a key is being pressed"),
-  onClick: PropTypes.func.description("Allows a function that is triggered once the input mask is clicked"),
-  onChange: PropTypes.func.description("Allows a function that is triggered once the input mask changes"),
-  onFocus: PropTypes.func.description("Allows a function that is triggered once the input mask is focused"),
-  onBlur: PropTypes.func.description("Allows a function that is triggered once the input mask loses focus"),
-  onPaste: PropTypes.func.description("Allows a function that is triggered once the input mask is pasted"),
-  onKeyUp: PropTypes.func.description("Allows a function that is triggered once in the input mask a keyboard key is released"),
-  value: PropTypes.string.description("Default value once the component is initialized"),
-  hasError: PropTypes.bool.description("Whether the input mask has error or not"),
-  readOnly: PropTypes.bool.description("Whether the input mask is read only or not"),
+  fluidWidth: PropTypes.bool.description(
+    "Whether to make the content of the input mask fit the container or not"
+  ),
+  isShowElipsisActive: PropTypes.bool.description(
+    "Wheter to enable the ellipsis and tooltip functionality or not"
+  ).defaultValue(true),
+  placeholder: PropTypes.node.description(
+    "Component that works as placeholder"
+  ),
+  onKeyDown: PropTypes.func.description(
+    "Allows a function that is triggered once a key is being pressed"
+  ),
+  onClick: PropTypes.func.description(
+    "Allows a function that is triggered once the input mask is clicked"
+  ),
+  onChange: PropTypes.func.description(
+    "Allows a function that is triggered once the input mask changes"
+  ),
+  onFocus: PropTypes.func.description(
+    "Allows a function that is triggered once the input mask is focused"
+  ),
+  onBlur: PropTypes.func.description(
+    "Allows a function that is triggered once the input mask loses focus"
+  ),
+  onPaste: PropTypes.func.description(
+    "Allows a function that is triggered once the input mask is pasted"
+  ),
+  onKeyUp: PropTypes.func.description(
+    "Allows a function that is triggered once in the input mask a keyboard key is released"
+  ),
+  value: PropTypes.string.description(
+    "Default value once the component is initialized"
+  ),
+  hasError: PropTypes.bool.description(
+    "Whether the input mask has error or not"
+  ),
+  readOnly: PropTypes.bool.description(
+    "Whether the input mask is read only or not"
+  ),
   innerRef: PropTypes.oneOfType([
     PropTypes.func,
     PropTypes.shape({ current: PropTypes.any })
   ]).description("Whether the input mask is read only or not"),
   type: PropTypes.string.description("Type of input. Ex: 'text'"),
-  clearable: PropTypes.bool.description("Whether the input mask is clearable or not"),
-  leftComponent: PropTypes.node.description("Component to be added at the right side of the input"),
-  rightComponent: PropTypes.node.description("Component to be added at the right side of the input"),
+  clearable: PropTypes.bool.description(
+    "Whether the input mask is clearable or not"
+  ),
+  leftComponent: PropTypes.node.description(
+    "Component to be added at the right side of the input"
+  ),
+  rightComponent: PropTypes.node.description(
+    "Component to be added at the right side of the input"
+  ),
   mask: PropTypes.oneOfType([
     PropTypes.array,
     PropTypes.string,
     PropTypes.func,
     PropTypes.object
-  ]).description("Mask that has to match with the input information entered. ['DATE', 'PHONE', 'PHONE_INTENATIONAL', 'SSN', 'US_ZIP_CODE', 'NUMBER', 'PERCENT', 'ZIP_CODE_SEARCH']"),
-  pipe: PropTypes.func.description("Expects pipe functions. i.e. autoCorrectedDatePipe"),
+  ]).description(
+    "Mask that has to match with the input information entered. ['DATE', 'PHONE', 'PHONE_INTENATIONAL', 'SSN', 'US_ZIP_CODE', 'NUMBER', 'PERCENT', 'ZIP_CODE_SEARCH']"
+  ),
+  pipe: PropTypes.func.description(
+    "Expects pipe functions. i.e. autoCorrectedDatePipe"
+  ),
   useSubfix: PropTypes.string.description("Put a sufix after the input mask"),
-  placeholderChar: PropTypes.string.description(`The placeholder character represents the fillable spot in the mask.
- The default placeholder character is underscore, _.`).defaultValue("_")
+  placeholderChar: PropTypes.string.description(
+    `The placeholder character represents the fillable spot in the mask.
+ The default placeholder character is underscore, _.`
+  ).defaultValue("_")
 };
 export {
   inputProps

package/dist/esm/InputMask/props.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/InputMask/props.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from '@elliemae/ds-utilities';\n\nexport const inputProps = {\n  /** Should component focus automatically */\n  autoFocus: PropTypes.bool.description('Should component focus automatically'),\n  /**\n   * Set style for the input mask\n   */\n  style: PropTypes.object.description('Set style for the input mask'),\n  /**\n   * Whether the input mask is disabled or not\n   */\n  disabled: PropTypes.bool.description(\n    'Whether the input mask is disabled or not',\n  ),\n  /** disableTooltip */\n  disableTooltip: PropTypes.bool\n    .description('Whether to show a tooltip or not when text does not fit')\n    .defaultValue(true),\n  /** css class */\n  className: PropTypes.string.description('css class'),\n  /** html name prop for form */\n  name: PropTypes.string.description('html name prop for form'),\n  /**\n   * Max length for the input mask\n   */\n  maxLength: PropTypes.number.description('Max length for the input mask'),\n  /**\n   * Min length for the input mask\n   */\n  minLength: PropTypes.number.description('Min length for the input mask'),\n  /**\n   * Whether to make the content of the input mask fit the container or not\n   */\n  fluidWidth: PropTypes.bool.description(\n    'Whether to make the content of the input mask fit the container or not',\n  ),\n  /** isShowElipsisActive */\n  isShowElipsisActive: PropTypes.bool\n    .description(\n      'Wheter to enable the ellipsis and tooltip functionality or not',\n    )\n    .defaultValue(true),\n  /**\n   * Component that works as placeholder\n   */\n  placeholder: PropTypes.node.description(\n    'Component that works as placeholder',\n  ),\n  /**\n   * Allows a function that is triggered once a key is being pressed\n   */\n  onKeyDown: PropTypes.func.description(\n    'Allows a function that is triggered once a key is being pressed',\n  ),\n  /**\n   * Allows a function that is triggered once the input mask is clicked\n   */\n  onClick: PropTypes.func.description(\n    'Allows a function that is triggered once the input mask is clicked',\n  ),\n  /**\n   * Allows a function that is triggered once the input mask changes\n   */\n  onChange: PropTypes.func.description(\n    'Allows a function that is triggered once the input mask changes',\n  ),\n  /**\n   * Allows a function that is triggered once the input mask is focused\n   */\n  onFocus: PropTypes.func.description(\n    'Allows a function that is triggered once the input mask is focused',\n  ),\n  /**\n   * Allows a function that is triggered once the input mask loses focus\n   */\n  onBlur: PropTypes.func.description(\n    'Allows a function that is triggered once the input mask loses focus',\n  ),\n  /**\n   * Allows a function that is triggered once the input mask is pasted\n   */\n  onPaste: PropTypes.func.description(\n    'Allows a function that is triggered once the input mask is pasted',\n  ),\n  /**\n   * Allows a function that is triggered once in the input mask a keyboard key is released\n   */\n  onKeyUp: PropTypes.func.description(\n    'Allows a function that is triggered once in the input mask a keyboard key is released',\n  ),\n  /**\n   * Default value once the component is initialized\n   */\n  value: PropTypes.string.description(\n    'Default value once the component is initialized',\n  ),\n  /**\n   * Whether the input mask has error or not\n   */\n  hasError: PropTypes.bool.description(\n    'Whether the input mask has error or not',\n  ),\n  /**\n   * Whether the input mask is read only or not\n   */\n  readOnly: PropTypes.bool.description(\n    'Whether the input mask is read only or not',\n  ),\n  innerRef: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.shape({ current: PropTypes.any }),\n  ]).description('Whether the input mask is read only or not'),\n  /**\n   * Type of input. Ex: 'text'\n   */\n  type: PropTypes.string.description(\"Type of input. Ex: 'text'\"),\n  /**\n   * Whether the input mask is clearable or not\n   */\n  clearable: PropTypes.bool.description(\n    'Whether the input mask is clearable or not',\n  ),\n  /**\n   * Component to be added at the right side of the input\n   */\n  leftComponent: PropTypes.node.description(\n    'Component to be added at the right side of the input',\n  ),\n  /**\n   * Component to be added at the right side of the input\n   */\n  rightComponent: PropTypes.node.description(\n    'Component to be added at the right side of the input',\n  ),\n  /**\n   * Mask that has to match with the input information entered\n   * ['DATE', 'PHONE', 'PHONE_INTENATIONAL', 'SSN', 'US_ZIP_CODE', 'NUMBER', 'PERCENT']\n   */\n  mask: PropTypes.oneOfType([\n    PropTypes.array,\n    PropTypes.string,\n    PropTypes.func,\n    PropTypes.object,\n  ]).description(\n    \"Mask that has to match with the input information entered. ['DATE', 'PHONE', 'PHONE_INTENATIONAL', 'SSN', 'US_ZIP_CODE', 'NUMBER', 'PERCENT', 'ZIP_CODE_SEARCH']\",\n  ),\n  /**\n    Expects pipe functions. i.e. autoCorrectedDatePipe\n    link a docu de text-mask\n   */\n  pipe: PropTypes.func.description(\n    'Expects pipe functions. i.e. autoCorrectedDatePipe',\n  ),\n  /**\n   * Put a sufix after the input mask\n   */\n  useSubfix: PropTypes.string.description('Put a sufix after the input mask'),\n  /**\n   * The placeholder character represents the fillable spot in the mask.\n   * The default placeholder character is underscore, _\n   */\n  placeholderChar: PropTypes.string\n    .description(\n      `The placeholder character represents the fillable spot in the mask.\n The default placeholder character is underscore, _.`,\n    )\n    .defaultValue('_'),\n};\n"],
-  "mappings": "AAAA;ACAA;AAEO,MAAM,aAAa;AAAA,EAExB,WAAW,UAAU,KAAK,YAAY,sCAAsC;AAAA,EAI5E,OAAO,UAAU,OAAO,YAAY,8BAA8B;AAAA,EAIlE,UAAU,UAAU,KAAK,YACvB,2CACF;AAAA,EAEA,gBAAgB,UAAU,KACvB,YAAY,yDAAyD,EACrE,aAAa,IAAI;AAAA,EAEpB,WAAW,UAAU,OAAO,YAAY,WAAW;AAAA,EAEnD,MAAM,UAAU,OAAO,YAAY,yBAAyB;AAAA,EAI5D,WAAW,UAAU,OAAO,YAAY,+BAA+B;AAAA,EAIvE,WAAW,UAAU,OAAO,YAAY,+BAA+B;AAAA,EAIvE,YAAY,UAAU,KAAK,YACzB,wEACF;AAAA,EAEA,qBAAqB,UAAU,KAC5B,YACC,gEACF,EACC,aAAa,IAAI;AAAA,EAIpB,aAAa,UAAU,KAAK,YAC1B,qCACF;AAAA,EAIA,WAAW,UAAU,KAAK,YACxB,iEACF;AAAA,EAIA,SAAS,UAAU,KAAK,YACtB,oEACF;AAAA,EAIA,UAAU,UAAU,KAAK,YACvB,iEACF;AAAA,EAIA,SAAS,UAAU,KAAK,YACtB,oEACF;AAAA,EAIA,QAAQ,UAAU,KAAK,YACrB,qEACF;AAAA,EAIA,SAAS,UAAU,KAAK,YACtB,mEACF;AAAA,EAIA,SAAS,UAAU,KAAK,YACtB,uFACF;AAAA,EAIA,OAAO,UAAU,OAAO,YACtB,iDACF;AAAA,EAIA,UAAU,UAAU,KAAK,YACvB,yCACF;AAAA,EAIA,UAAU,UAAU,KAAK,YACvB,4CACF;AAAA,EACA,UAAU,UAAU,UAAU;AAAA,IAC5B,UAAU;AAAA,IACV,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC;AAAA,EAC5C,CAAC,EAAE,YAAY,4CAA4C;AAAA,EAI3D,MAAM,UAAU,OAAO,YAAY,2BAA2B;AAAA,EAI9D,WAAW,UAAU,KAAK,YACxB,4CACF;AAAA,EAIA,eAAe,UAAU,KAAK,YAC5B,sDACF;AAAA,EAIA,gBAAgB,UAAU,KAAK,YAC7B,sDACF;AAAA,EAKA,MAAM,UAAU,UAAU;AAAA,IACxB,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,EACZ,CAAC,EAAE,YACD,kKACF;AAAA,EAKA,MAAM,UAAU,KAAK,YACnB,oDACF;AAAA,EAIA,WAAW,UAAU,OAAO,YAAY,kCAAkC;AAAA,EAK1E,iBAAiB,UAAU,OACxB,YACC;AAAA,qDAEF,EACC,aAAa,GAAG;AACrB;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB;AAEnB,MAAM,aAAa;AAAA,EAExB,WAAW,UAAU,KAAK,YAAY,sCAAsC;AAAA,EAI5E,OAAO,UAAU,OAAO,YAAY,8BAA8B;AAAA,EAIlE,UAAU,UAAU,KAAK;AAAA,IACvB;AAAA,EACF;AAAA,EAEA,gBAAgB,UAAU,KACvB,YAAY,yDAAyD,EACrE,aAAa,IAAI;AAAA,EAEpB,WAAW,UAAU,OAAO,YAAY,WAAW;AAAA,EAEnD,MAAM,UAAU,OAAO,YAAY,yBAAyB;AAAA,EAI5D,WAAW,UAAU,OAAO,YAAY,+BAA+B;AAAA,EAIvE,WAAW,UAAU,OAAO,YAAY,+BAA+B;AAAA,EAIvE,YAAY,UAAU,KAAK;AAAA,IACzB;AAAA,EACF;AAAA,EAEA,qBAAqB,UAAU,KAC5B;AAAA,IACC;AAAA,EACF,EACC,aAAa,IAAI;AAAA,EAIpB,aAAa,UAAU,KAAK;AAAA,IAC1B;AAAA,EACF;AAAA,EAIA,WAAW,UAAU,KAAK;AAAA,IACxB;AAAA,EACF;AAAA,EAIA,SAAS,UAAU,KAAK;AAAA,IACtB;AAAA,EACF;AAAA,EAIA,UAAU,UAAU,KAAK;AAAA,IACvB;AAAA,EACF;AAAA,EAIA,SAAS,UAAU,KAAK;AAAA,IACtB;AAAA,EACF;AAAA,EAIA,QAAQ,UAAU,KAAK;AAAA,IACrB;AAAA,EACF;AAAA,EAIA,SAAS,UAAU,KAAK;AAAA,IACtB;AAAA,EACF;AAAA,EAIA,SAAS,UAAU,KAAK;AAAA,IACtB;AAAA,EACF;AAAA,EAIA,OAAO,UAAU,OAAO;AAAA,IACtB;AAAA,EACF;AAAA,EAIA,UAAU,UAAU,KAAK;AAAA,IACvB;AAAA,EACF;AAAA,EAIA,UAAU,UAAU,KAAK;AAAA,IACvB;AAAA,EACF;AAAA,EACA,UAAU,UAAU,UAAU;AAAA,IAC5B,UAAU;AAAA,IACV,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC;AAAA,EAC5C,CAAC,EAAE,YAAY,4CAA4C;AAAA,EAI3D,MAAM,UAAU,OAAO,YAAY,2BAA2B;AAAA,EAI9D,WAAW,UAAU,KAAK;AAAA,IACxB;AAAA,EACF;AAAA,EAIA,eAAe,UAAU,KAAK;AAAA,IAC5B;AAAA,EACF;AAAA,EAIA,gBAAgB,UAAU,KAAK;AAAA,IAC7B;AAAA,EACF;AAAA,EAKA,MAAM,UAAU,UAAU;AAAA,IACxB,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,EACZ,CAAC,EAAE;AAAA,IACD;AAAA,EACF;AAAA,EAKA,MAAM,UAAU,KAAK;AAAA,IACnB;AAAA,EACF;AAAA,EAIA,WAAW,UAAU,OAAO,YAAY,kCAAkC;AAAA,EAK1E,iBAAiB,UAAU,OACxB;AAAA,IACC;AAAA;AAAA,EAEF,EACC,aAAa,GAAG;AACrB;",
   "names": []
 }

package/dist/esm/InputMask/types/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n"],
-  "mappings": "AAAA;",
+  "mappings": "AAAA,YAAY,WAAW;",
   "names": []
 }

package/dist/esm/InputMask/utils/setCaretPosition.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/InputMask/utils/setCaretPosition.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "const setCaretPosition = (ctrl, pos) => {\n  // Modern browsers\n  if (ctrl?.setSelectionRange) {\n    ctrl?.focus();\n    ctrl?.setSelectionRange(pos, pos);\n\n    // IE8 and below\n  } else if (ctrl?.createTextRange) {\n    const range = ctrl?.createTextRange();\n    range?.collapse(true);\n    range?.moveEnd('character', pos);\n    range?.moveStart('character', pos);\n    range?.select();\n  }\n};\n\nexport { setCaretPosition };\nexport default setCaretPosition;\n"],
-  "mappings": "AAAA;ACAA,MAAM,mBAAmB,CAAC,MAAM,QAAQ;AAEtC,MAAI,MAAM,mBAAmB;AAC3B,UAAM,MAAM;AACZ,UAAM,kBAAkB,KAAK,GAAG;AAAA,EAGlC,WAAW,MAAM,iBAAiB;AAChC,UAAM,QAAQ,MAAM,gBAAgB;AACpC,WAAO,SAAS,IAAI;AACpB,WAAO,QAAQ,aAAa,GAAG;AAC/B,WAAO,UAAU,aAAa,GAAG;AACjC,WAAO,OAAO;AAAA,EAChB;AACF;AAGA,IAAO,2BAAQ;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,MAAM,mBAAmB,CAAC,MAAM,QAAQ;AAEtC,MAAI,MAAM,mBAAmB;AAC3B,UAAM,MAAM;AACZ,UAAM,kBAAkB,KAAK,GAAG;AAAA,EAGlC,WAAW,MAAM,iBAAiB;AAChC,UAAM,QAAQ,MAAM,gBAAgB;AACpC,WAAO,SAAS,IAAI;AACpB,WAAO,QAAQ,aAAa,GAAG;AAC/B,WAAO,UAAU,aAAa,GAAG;AACjC,WAAO,OAAO;AAAA,EAChB;AACF;AAGA,IAAO,2BAAQ;",
   "names": []
 }

package/dist/esm/InputProtected/DSInputProtected.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useState, useCallback, useEffect } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useState, useCallback, useEffect } from "react";
 import { describe } from "@elliemae/ds-utilities";
 import { LockUnlocked, LockLocked, VisibleView, InvisibleHide } from "@elliemae/ds-icons";
 import { DSButton } from "@elliemae/ds-button";
@@ -9,10 +10,10 @@ import { inputProtectedProps } from "./props";
 import { defaultProps } from "./defaultProps";
 import { LEFT_ADDON_OPTIONS, RIGHT_ADDON_OPTIONS } from "./options";
 const ADDON_ICON_OPTIONS = {
-  LockUnlocked: /* @__PURE__ */ React2.createElement(LockUnlocked, null),
-  LockLocked: /* @__PURE__ */ React2.createElement(LockLocked, null),
-  VisibleView: /* @__PURE__ */ React2.createElement(VisibleView, null),
-  InvisibleHide: /* @__PURE__ */ React2.createElement(InvisibleHide, null)
+  LockUnlocked: /* @__PURE__ */ jsx(LockUnlocked, {}),
+  LockLocked: /* @__PURE__ */ jsx(LockLocked, {}),
+  VisibleView: /* @__PURE__ */ jsx(VisibleView, {}),
+  InvisibleHide: /* @__PURE__ */ jsx(InvisibleHide, {})
 };
 const DSInputProtected = ({
   leftAddon,
@@ -39,31 +40,34 @@ const DSInputProtected = ({
   const handleRight = useCallback(() => {
     setHidden(!inputHidden);
   }, [inputHidden]);
-  return /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement(DSInputGroup, {
-    leftAddon: left ? /* @__PURE__ */ React2.createElement(DSButton, {
-      "aria-label": `${inputLocked ? "Allow" : "Disallow"} Edition`,
-      buttonType: "secondary",
-      icon: ADDON_ICON_OPTIONS[inputLocked ? LEFT_ADDON_OPTIONS.LockLocked : LEFT_ADDON_OPTIONS.LockUnlocked],
-      onClick: handleLeft
-    }) : void 0,
-    rightAddon: right ? /* @__PURE__ */ React2.createElement(DSButton, {
-      "aria-label": `${inputHidden ? "Show" : "Hide"} Characters`,
-      buttonType: "secondary",
-      icon: ADDON_ICON_OPTIONS[inputHidden ? RIGHT_ADDON_OPTIONS.InvisibleHide : RIGHT_ADDON_OPTIONS.VisibleView],
-      onClick: handleRight,
-      containerProps: {
-        "data-testid": "inputprotected-show-hide-button"
-      }
-    }) : void 0
-  }, /* @__PURE__ */ React2.createElement(DSInputMask, {
-    ...rest,
-    mask,
-    placeholderChar,
-    onChange,
-    disabled: left ? inputLocked : readOnly,
-    type: right && inputHidden ? "password" : type,
-    value
-  })));
+  return /* @__PURE__ */ jsx("div", {
+    children: /* @__PURE__ */ jsx(DSInputGroup, {
+      leftAddon: left ? /* @__PURE__ */ jsx(DSButton, {
+        "aria-label": `${inputLocked ? "Allow" : "Disallow"} Edition`,
+        buttonType: "secondary",
+        icon: ADDON_ICON_OPTIONS[inputLocked ? LEFT_ADDON_OPTIONS.LockLocked : LEFT_ADDON_OPTIONS.LockUnlocked],
+        onClick: handleLeft
+      }) : void 0,
+      rightAddon: right ? /* @__PURE__ */ jsx(DSButton, {
+        "aria-label": `${inputHidden ? "Show" : "Hide"} Characters`,
+        buttonType: "secondary",
+        icon: ADDON_ICON_OPTIONS[inputHidden ? RIGHT_ADDON_OPTIONS.InvisibleHide : RIGHT_ADDON_OPTIONS.VisibleView],
+        onClick: handleRight,
+        containerProps: {
+          "data-testid": "inputprotected-show-hide-button"
+        }
+      }) : void 0,
+      children: /* @__PURE__ */ jsx(DSInputMask, {
+        ...rest,
+        mask,
+        placeholderChar,
+        onChange,
+        disabled: left ? inputLocked : readOnly,
+        type: right && inputHidden ? "password" : type,
+        value
+      })
+    })
+  });
 };
 DSInputProtected.propTypes = inputProtectedProps;
 DSInputProtected.defaultProps = defaultProps;

package/dist/esm/InputProtected/DSInputProtected.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/InputProtected/DSInputProtected.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/no-unresolved */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useState, useCallback, useEffect } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { LockUnlocked, LockLocked, VisibleView, InvisibleHide } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSInputGroup } from '../InputGroup';\nimport { DSInputMask } from '../InputMask';\nimport { inputProtectedProps } from './props';\nimport { defaultProps } from './defaultProps';\nimport { LEFT_ADDON_OPTIONS, RIGHT_ADDON_OPTIONS } from './options';\n\nconst ADDON_ICON_OPTIONS = {\n  LockUnlocked: <LockUnlocked />,\n  LockLocked: <LockLocked />,\n  VisibleView: <VisibleView />,\n  InvisibleHide: <InvisibleHide />,\n};\n\nconst DSInputProtected = ({\n  leftAddon,\n  rightAddon,\n  onChange,\n  value,\n  readOnly,\n  mask,\n  type,\n  placeholderChar = undefined,\n  ...rest\n}) => {\n  const left = leftAddon && ADDON_ICON_OPTIONS[leftAddon];\n  const right = rightAddon && ADDON_ICON_OPTIONS[rightAddon];\n  const [inputLocked, setLocked] = useState(leftAddon === LEFT_ADDON_OPTIONS.LockLocked);\n  const [inputHidden, setHidden] = useState(rightAddon === RIGHT_ADDON_OPTIONS.InvisibleHide);\n\n  useEffect(() => {\n    setLocked(leftAddon === LEFT_ADDON_OPTIONS.LockLocked);\n    setHidden(rightAddon === RIGHT_ADDON_OPTIONS.InvisibleHide);\n  }, [leftAddon, rightAddon]);\n\n  const handleLeft = useCallback(() => {\n    setLocked(!inputLocked);\n  }, [inputLocked]);\n  const handleRight = useCallback(() => {\n    setHidden(!inputHidden);\n  }, [inputHidden]);\n\n  return (\n    <div>\n      <DSInputGroup\n        leftAddon={\n          left ? (\n            <DSButton\n              aria-label={`${inputLocked ? 'Allow' : 'Disallow'} Edition`}\n              buttonType=\"secondary\"\n              icon={ADDON_ICON_OPTIONS[inputLocked ? LEFT_ADDON_OPTIONS.LockLocked : LEFT_ADDON_OPTIONS.LockUnlocked]}\n              onClick={handleLeft}\n            />\n          ) : undefined\n        }\n        rightAddon={\n          right ? (\n            <DSButton\n              aria-label={`${inputHidden ? 'Show' : 'Hide'} Characters`}\n              buttonType=\"secondary\"\n              icon={\n                ADDON_ICON_OPTIONS[inputHidden ? RIGHT_ADDON_OPTIONS.InvisibleHide : RIGHT_ADDON_OPTIONS.VisibleView]\n              }\n              onClick={handleRight}\n              containerProps={{\n                'data-testid': 'inputprotected-show-hide-button',\n              }}\n            />\n          ) : undefined\n        }\n      >\n        <DSInputMask\n          {...rest}\n          mask={mask}\n          placeholderChar={placeholderChar}\n          onChange={onChange}\n          disabled={left ? inputLocked : readOnly}\n          type={right && inputHidden ? 'password' : type}\n          value={value}\n        />\n      </DSInputGroup>\n    </div>\n  );\n};\n\nDSInputProtected.propTypes = inputProtectedProps;\nDSInputProtected.defaultProps = defaultProps;\nDSInputProtected.displayName = 'DSInputProtected';\nconst DSInputProtectedWithSchema = describe(DSInputProtected);\nDSInputProtectedWithSchema.propTypes = inputProtectedProps;\n\nexport { DSInputProtectedWithSchema, DSInputProtected };\nexport default DSInputProtected;\n"],
-  "mappings": "AAAA;ACGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,qBAAqB;AAAA,EACzB,cAAc,qCAAC,kBAAa;AAAA,EAC5B,YAAY,qCAAC,gBAAW;AAAA,EACxB,aAAa,qCAAC,iBAAY;AAAA,EAC1B,eAAe,qCAAC,mBAAc;AAChC;AAEA,MAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,KACf;AAAA,MACC;AACJ,QAAM,OAAO,aAAa,mBAAmB;AAC7C,QAAM,QAAQ,cAAc,mBAAmB;AAC/C,QAAM,CAAC,aAAa,aAAa,SAAS,cAAc,mBAAmB,UAAU;AACrF,QAAM,CAAC,aAAa,aAAa,SAAS,eAAe,oBAAoB,aAAa;AAE1F,YAAU,MAAM;AACd,cAAU,cAAc,mBAAmB,UAAU;AACrD,cAAU,eAAe,oBAAoB,aAAa;AAAA,EAC5D,GAAG,CAAC,WAAW,UAAU,CAAC;AAE1B,QAAM,aAAa,YAAY,MAAM;AACnC,cAAU,CAAC,WAAW;AAAA,EACxB,GAAG,CAAC,WAAW,CAAC;AAChB,QAAM,cAAc,YAAY,MAAM;AACpC,cAAU,CAAC,WAAW;AAAA,EACxB,GAAG,CAAC,WAAW,CAAC;AAEhB,SACE,qCAAC,aACC,qCAAC;AAAA,IACC,WACE,OACE,qCAAC;AAAA,MACC,cAAY,GAAG,cAAc,UAAU;AAAA,MACvC,YAAW;AAAA,MACX,MAAM,mBAAmB,cAAc,mBAAmB,aAAa,mBAAmB;AAAA,MAC1F,SAAS;AAAA,KACX,IACE;AAAA,IAEN,YACE,QACE,qCAAC;AAAA,MACC,cAAY,GAAG,cAAc,SAAS;AAAA,MACtC,YAAW;AAAA,MACX,MACE,mBAAmB,cAAc,oBAAoB,gBAAgB,oBAAoB;AAAA,MAE3F,SAAS;AAAA,MACT,gBAAgB;AAAA,QACd,eAAe;AAAA,MACjB;AAAA,KACF,IACE;AAAA,KAGN,qCAAC;AAAA,IACE,GAAG;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,OAAO,cAAc;AAAA,IAC/B,MAAM,SAAS,cAAc,aAAa;AAAA,IAC1C;AAAA,GACF,CACF,CACF;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,eAAe;AAChC,iBAAiB,cAAc;AAC/B,MAAM,6BAA6B,SAAS,gBAAgB;AAC5D,2BAA2B,YAAY;AAGvC,IAAO,2BAAQ;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AAGA,SAAgB,UAAU,aAAa,iBAAiB;AACxD,SAAS,gBAAgB;AACzB,SAAS,cAAc,YAAY,aAAa,qBAAqB;AACrE,SAAS,gBAAgB;AACzB,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AAC5B,SAAS,2BAA2B;AACpC,SAAS,oBAAoB;AAC7B,SAAS,oBAAoB,2BAA2B;AAExD,MAAM,qBAAqB;AAAA,EACzB,cAAc,oBAAC,gBAAa;AAAA,EAC5B,YAAY,oBAAC,cAAW;AAAA,EACxB,aAAa,oBAAC,eAAY;AAAA,EAC1B,eAAe,oBAAC,iBAAc;AAChC;AAEA,MAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,KACf;AACL,MAAM;AACJ,QAAM,OAAO,aAAa,mBAAmB;AAC7C,QAAM,QAAQ,cAAc,mBAAmB;AAC/C,QAAM,CAAC,aAAa,SAAS,IAAI,SAAS,cAAc,mBAAmB,UAAU;AACrF,QAAM,CAAC,aAAa,SAAS,IAAI,SAAS,eAAe,oBAAoB,aAAa;AAE1F,YAAU,MAAM;AACd,cAAU,cAAc,mBAAmB,UAAU;AACrD,cAAU,eAAe,oBAAoB,aAAa;AAAA,EAC5D,GAAG,CAAC,WAAW,UAAU,CAAC;AAE1B,QAAM,aAAa,YAAY,MAAM;AACnC,cAAU,CAAC,WAAW;AAAA,EACxB,GAAG,CAAC,WAAW,CAAC;AAChB,QAAM,cAAc,YAAY,MAAM;AACpC,cAAU,CAAC,WAAW;AAAA,EACxB,GAAG,CAAC,WAAW,CAAC;AAEhB,SACE,oBAAC;AAAA,IACC,8BAAC;AAAA,MACC,WACE,OACE,oBAAC;AAAA,QACC,cAAY,GAAG,cAAc,UAAU;AAAA,QACvC,YAAW;AAAA,QACX,MAAM,mBAAmB,cAAc,mBAAmB,aAAa,mBAAmB;AAAA,QAC1F,SAAS;AAAA,OACX,IACE;AAAA,MAEN,YACE,QACE,oBAAC;AAAA,QACC,cAAY,GAAG,cAAc,SAAS;AAAA,QACtC,YAAW;AAAA,QACX,MACE,mBAAmB,cAAc,oBAAoB,gBAAgB,oBAAoB;AAAA,QAE3F,SAAS;AAAA,QACT,gBAAgB;AAAA,UACd,eAAe;AAAA,QACjB;AAAA,OACF,IACE;AAAA,MAGN,8BAAC;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU,OAAO,cAAc;AAAA,QAC/B,MAAM,SAAS,cAAc,aAAa;AAAA,QAC1C;AAAA,OACF;AAAA,KACF;AAAA,GACF;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,eAAe;AAChC,iBAAiB,cAAc;AAC/B,MAAM,6BAA6B,SAAS,gBAAgB;AAC5D,2BAA2B,YAAY;AAGvC,IAAO,2BAAQ;",
   "names": []
 }

package/dist/esm/InputProtected/defaultProps.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/InputProtected/defaultProps.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { RIGHT_ADDON_OPTIONS } from './options';\n\nexport const defaultProps = {\n  rightAddon: RIGHT_ADDON_OPTIONS.InvisibleHide,\n  mask: (data) => new Array(data.length).fill(/./),\n};\n"],
-  "mappings": "AAAA;ACAA;AAEO,MAAM,eAAe;AAAA,EAC1B,YAAY,oBAAoB;AAAA,EAChC,MAAM,CAAC,SAAS,IAAI,MAAM,KAAK,MAAM,EAAE,KAAK,GAAG;AACjD;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,2BAA2B;AAE7B,MAAM,eAAe;AAAA,EAC1B,YAAY,oBAAoB;AAAA,EAChC,MAAM,CAAC,SAAS,IAAI,MAAM,KAAK,MAAM,EAAE,KAAK,GAAG;AACjD;",
   "names": []
 }

package/dist/esm/InputProtected/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/InputProtected/index.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSInputProtected';\nexport * from './options';\n"],
-  "mappings": "AAAA;ACAA;AACA;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;",
   "names": []
 }

package/dist/esm/InputProtected/options.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/InputProtected/options.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const LEFT_ADDON_OPTIONS = {\n  LockUnlocked: 'LockUnlocked',\n  LockLocked: 'LockLocked',\n};\n\nexport const RIGHT_ADDON_OPTIONS = {\n  VisibleView: 'VisibleView',\n  InvisibleHide: 'InvisibleHide',\n};\n"],
-  "mappings": "AAAA;ACAO,MAAM,qBAAqB;AAAA,EAChC,cAAc;AAAA,EACd,YAAY;AACd;AAEO,MAAM,sBAAsB;AAAA,EACjC,aAAa;AAAA,EACb,eAAe;AACjB;",
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,qBAAqB;AAAA,EAChC,cAAc;AAAA,EACd,YAAY;AACd;AAEO,MAAM,sBAAsB;AAAA,EACjC,aAAa;AAAA,EACb,eAAe;AACjB;",
   "names": []
 }

package/dist/esm/InputProtected/props.js

@@ -10,8 +10,12 @@ const inputProtectedProps = {
     RIGHT_ADDON_OPTIONS.VisibleView,
     RIGHT_ADDON_OPTIONS.InvisibleHide
   ]).description("right addon component to display").defaultValue(RIGHT_ADDON_OPTIONS.InvisibleHide),
-  onChange: PropTypes.func.description("Function executed when input s value changes"),
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description("input s value"),
+  onChange: PropTypes.func.description(
+    "Function executed when input s value changes"
+  ),
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(
+    "input s value"
+  ),
   readOnly: PropTypes.bool.description("Whether the input is read-only or not").defaultValue(false),
   mask: PropTypes.oneOfType([
     PropTypes.array,
@@ -19,9 +23,13 @@ const inputProtectedProps = {
     PropTypes.object,
     PropTypes.string
   ]).description("mask to apply"),
-  type: PropTypes.oneOf(["password", "number", "text"]).description("type of input"),
-  placeholderChar: PropTypes.string.description(`The placeholder character represents the fillable spot in the mask.
-  * The default placeholder character is underscore, _.`)
+  type: PropTypes.oneOf(["password", "number", "text"]).description(
+    "type of input"
+  ),
+  placeholderChar: PropTypes.string.description(
+    `The placeholder character represents the fillable spot in the mask.
+  * The default placeholder character is underscore, _.`
+  )
 };
 export {
   inputProtectedProps

package/dist/esm/InputProtected/props.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/InputProtected/props.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from '@elliemae/ds-utilities';\nimport { LEFT_ADDON_OPTIONS, RIGHT_ADDON_OPTIONS } from './options';\n\nexport const inputProtectedProps = {\n  leftAddon: PropTypes.oneOf([\n    LEFT_ADDON_OPTIONS.LockLocked,\n    LEFT_ADDON_OPTIONS.LockUnlocked,\n  ]).description('left addon component to display'),\n  rightAddon: PropTypes.oneOf([\n    RIGHT_ADDON_OPTIONS.VisibleView,\n    RIGHT_ADDON_OPTIONS.InvisibleHide,\n  ])\n    .description('right addon component to display')\n    .defaultValue(RIGHT_ADDON_OPTIONS.InvisibleHide),\n  onChange: PropTypes.func.description(\n    'Function executed when input s value changes',\n  ),\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n    'input s value',\n  ),\n  readOnly: PropTypes.bool\n    .description('Whether the input is read-only or not')\n    .defaultValue(false),\n  mask: PropTypes.oneOfType([\n    PropTypes.array,\n    PropTypes.func,\n    PropTypes.object,\n    PropTypes.string,\n  ]).description('mask to apply'),\n  type: PropTypes.oneOf(['password', 'number', 'text']).description(\n    'type of input',\n  ),\n  /**\n   * PlaceholderChar: The placeholder character represents the fillable spot in the mask.\n   * The default placeholder character is underscore, _.\n   */\n  placeholderChar: PropTypes.string.description(\n    `The placeholder character represents the fillable spot in the mask.\n  * The default placeholder character is underscore, _.`,\n  ),\n};\n"],
-  "mappings": "AAAA;ACAA;AACA;AAEO,MAAM,sBAAsB;AAAA,EACjC,WAAW,UAAU,MAAM;AAAA,IACzB,mBAAmB;AAAA,IACnB,mBAAmB;AAAA,EACrB,CAAC,EAAE,YAAY,iCAAiC;AAAA,EAChD,YAAY,UAAU,MAAM;AAAA,IAC1B,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,EACtB,CAAC,EACE,YAAY,kCAAkC,EAC9C,aAAa,oBAAoB,aAAa;AAAA,EACjD,UAAU,UAAU,KAAK,YACvB,8CACF;AAAA,EACA,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,EAAE,YAC/D,eACF;AAAA,EACA,UAAU,UAAU,KACjB,YAAY,uCAAuC,EACnD,aAAa,KAAK;AAAA,EACrB,MAAM,UAAU,UAAU;AAAA,IACxB,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,EACZ,CAAC,EAAE,YAAY,eAAe;AAAA,EAC9B,MAAM,UAAU,MAAM,CAAC,YAAY,UAAU,MAAM,CAAC,EAAE,YACpD,eACF;AAAA,EAKA,iBAAiB,UAAU,OAAO,YAChC;AAAA,wDAEF;AACF;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB;AAC1B,SAAS,oBAAoB,2BAA2B;AAEjD,MAAM,sBAAsB;AAAA,EACjC,WAAW,UAAU,MAAM;AAAA,IACzB,mBAAmB;AAAA,IACnB,mBAAmB;AAAA,EACrB,CAAC,EAAE,YAAY,iCAAiC;AAAA,EAChD,YAAY,UAAU,MAAM;AAAA,IAC1B,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,EACtB,CAAC,EACE,YAAY,kCAAkC,EAC9C,aAAa,oBAAoB,aAAa;AAAA,EACjD,UAAU,UAAU,KAAK;AAAA,IACvB;AAAA,EACF;AAAA,EACA,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,EAAE;AAAA,IAC/D;AAAA,EACF;AAAA,EACA,UAAU,UAAU,KACjB,YAAY,uCAAuC,EACnD,aAAa,KAAK;AAAA,EACrB,MAAM,UAAU,UAAU;AAAA,IACxB,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,EACZ,CAAC,EAAE,YAAY,eAAe;AAAA,EAC9B,MAAM,UAAU,MAAM,CAAC,YAAY,UAAU,MAAM,CAAC,EAAE;AAAA,IACpD;AAAA,EACF;AAAA,EAKA,iBAAiB,UAAU,OAAO;AAAA,IAChC;AAAA;AAAA,EAEF;AACF;",
   "names": []
 }

package/dist/esm/LargeInputText/DSLargeInputText.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useMemo } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
 import { describe } from "@elliemae/ds-utilities";
 import {
   convertPropToCssClassName,
@@ -7,9 +8,13 @@ import {
 } from "@elliemae/ds-classnames";
 import { props } from "./props";
 import { defaultProps } from "./defaultProps";
-const CounterArea = aggregatedClasses("div")("counter", "textarea", ({ limitError }) => ({
-  "limit-error": limitError
-}));
+const CounterArea = aggregatedClasses("div")(
+  "counter",
+  "textarea",
+  ({ limitError }) => ({
+    "limit-error": limitError
+  })
+);
 const DSLargeInputText = ({
   containerProps,
   autoFocus,
@@ -41,7 +46,10 @@ const DSLargeInputText = ({
   errorLimit,
   tabIndex
 }) => {
-  const limitError = useMemo(() => characterLimitCounter < String(value).length && characterLimitCounter > 0, [characterLimitCounter, value]);
+  const limitError = useMemo(
+    () => characterLimitCounter < String(value).length && characterLimitCounter > 0,
+    [characterLimitCounter, value]
+  );
   const {
     cssClassName,
     classNameElement,
@@ -54,50 +62,60 @@ const DSLargeInputText = ({
   const handleKeyUp = (e) => {
     onKeyUp(e);
   };
-  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", {
-    ...containerProps,
-    className: `${cssClassName} ${className}`
-  }, /* @__PURE__ */ React2.createElement("div", {
-    className: classNameBlock("wrapper")
-  }, /* @__PURE__ */ React2.createElement("textarea", {
-    ref: innerRef,
-    "aria-autocomplete": ariaAutocomplete,
-    "aria-label": ariaLabel,
-    "aria-multiline": true,
-    "aria-placeholder": placeholder,
-    "aria-required": required,
-    autoFocus,
-    className: classNameElement("textarea"),
-    "data-testid": "ds-large-input_main-component",
-    disabled,
-    id,
-    maxLength,
-    minLength,
-    name,
-    onBlur,
-    onChange,
-    onClick,
-    onFocus,
-    onKeyDown,
-    onKeyUp: handleKeyUp,
-    onPaste,
-    placeholder,
-    role,
-    rows: String(rows),
-    style: {
-      resize
-    },
-    value,
-    tabIndex
-  }))), characterLimitCounter > 0 && /* @__PURE__ */ React2.createElement(CounterArea, {
-    classProps: { limitError },
-    "data-testid": "counter-area"
-  }, `${limitError ? `${errorLimit} ${characterLimitCounter} characters.   ` : ""}${String(value).length} / ${characterLimitCounter}`));
+  return /* @__PURE__ */ jsxs(Fragment, {
+    children: [
+      /* @__PURE__ */ jsx("div", {
+        ...containerProps,
+        className: `${cssClassName} ${className}`,
+        children: /* @__PURE__ */ jsx("div", {
+          className: classNameBlock("wrapper"),
+          children: /* @__PURE__ */ jsx("textarea", {
+            ref: innerRef,
+            "aria-autocomplete": ariaAutocomplete,
+            "aria-label": ariaLabel,
+            "aria-multiline": true,
+            "aria-placeholder": placeholder,
+            "aria-required": required,
+            autoFocus,
+            className: classNameElement("textarea"),
+            "data-testid": "ds-large-input_main-component",
+            disabled,
+            id,
+            maxLength,
+            minLength,
+            name,
+            onBlur,
+            onChange,
+            onClick,
+            onFocus,
+            onKeyDown,
+            onKeyUp: handleKeyUp,
+            onPaste,
+            placeholder,
+            role,
+            rows: String(rows),
+            style: {
+              resize
+            },
+            value,
+            tabIndex
+          })
+        })
+      }),
+      characterLimitCounter > 0 && /* @__PURE__ */ jsx(CounterArea, {
+        classProps: { limitError },
+        "data-testid": "counter-area",
+        children: `${limitError ? `${errorLimit} ${characterLimitCounter} characters.   ` : ""}${String(value).length} / ${characterLimitCounter}`
+      })
+    ]
+  });
 };
 DSLargeInputText.propTypes = props;
 DSLargeInputText.defaultProps = defaultProps;
 DSLargeInputText.displayName = "DSLargeInputText";
-const DSLargeInputTextWithSchema = describe(DSLargeInputText).description("A large input");
+const DSLargeInputTextWithSchema = describe(DSLargeInputText).description(
+  "A large input"
+);
 DSLargeInputTextWithSchema.propTypes = props;
 var DSLargeInputText_default = DSLargeInputText;
 export {

package/dist/esm/LargeInputText/DSLargeInputText.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/LargeInputText/DSLargeInputText.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable jsx-a11y/no-autofocus, react/prop-types */\nimport React, { useMemo } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport {\n  convertPropToCssClassName,\n  aggregatedClasses,\n} from '@elliemae/ds-classnames';\nimport { props } from './props';\nimport { defaultProps } from './defaultProps';\n\nconst CounterArea = aggregatedClasses('div')(\n  'counter',\n  'textarea',\n  ({ limitError }) => ({\n    'limit-error': limitError,\n  }),\n);\n\nconst DSLargeInputText = ({\n  containerProps,\n  autoFocus,\n  className,\n  disabled,\n  name,\n  id,\n  maxLength,\n  minLength,\n  placeholder,\n  onClick,\n  onChange,\n  onFocus,\n  onBlur,\n  onKeyUp,\n  onKeyDown,\n  onPaste,\n  value,\n  hasError,\n  required,\n  readOnly,\n  resize,\n  innerRef,\n  ariaLabel,\n  ariaAutocomplete,\n  role,\n  characterLimitCounter,\n  rows,\n  errorLimit,\n  tabIndex,\n}) => {\n  const limitError = useMemo(\n    () =>\n      characterLimitCounter < String(value).length && characterLimitCounter > 0,\n    [characterLimitCounter, value],\n  );\n  const {\n    cssClassName,\n    classNameElement,\n    classNameBlock,\n  } = convertPropToCssClassName('form-element-textarea', 'text', {\n    hasError: limitError || hasError,\n    readOnly,\n    disabled,\n  });\n  // auto size when user types\n  const handleKeyUp = (e) => {\n    // const { target } = e\n    onKeyUp(e);\n    // if (e.key !== 'Enter') return\n    // target.style.cssText = 'height:auto; padding:0'\n    // target.style.cssText = `height: ${target.scrollHeight}px`\n  };\n  return (\n    <>\n      <div {...containerProps} className={`${cssClassName} ${className}`}>\n        <div className={classNameBlock('wrapper')}>\n          <textarea\n            ref={innerRef}\n            aria-autocomplete={ariaAutocomplete}\n            aria-label={ariaLabel}\n            aria-multiline\n            aria-placeholder={placeholder}\n            aria-required={required}\n            autoFocus={autoFocus}\n            className={classNameElement('textarea')}\n            data-testid=\"ds-large-input_main-component\"\n            disabled={disabled}\n            id={id}\n            maxLength={maxLength}\n            minLength={minLength}\n            name={name}\n            onBlur={onBlur}\n            onChange={onChange}\n            onClick={onClick}\n            onFocus={onFocus}\n            onKeyDown={onKeyDown}\n            onKeyUp={handleKeyUp}\n            onPaste={onPaste}\n            placeholder={placeholder}\n            role={role}\n            rows={String(rows)}\n            style={{\n              resize,\n            }}\n            value={value}\n            tabIndex={tabIndex}\n          />\n        </div>\n      </div>\n      {characterLimitCounter > 0 && (\n        <CounterArea classProps={{ limitError }} data-testid=\"counter-area\">\n          {`${\n            limitError\n              ? `${errorLimit} ${characterLimitCounter} characters.   `\n              : ''\n          }${String(value).length} / ${characterLimitCounter}`}\n        </CounterArea>\n      )}\n    </>\n  );\n};\n\nDSLargeInputText.propTypes = props;\nDSLargeInputText.defaultProps = defaultProps;\nDSLargeInputText.displayName = 'DSLargeInputText';\nconst DSLargeInputTextWithSchema = describe(DSLargeInputText).description(\n  'A large input',\n);\nDSLargeInputTextWithSchema.propTypes = props;\n\nexport { DSLargeInputTextWithSchema, DSLargeInputText };\n\nexport default DSLargeInputText;\n"],
-  "mappings": "AAAA;ACEA;AACA;AACA;AAAA;AAAA;AAAA;AAIA;AACA;AAEA,MAAM,cAAc,kBAAkB,KAAK,EACzC,WACA,YACA,CAAC,EAAE,iBAAkB;AAAA,EACnB,eAAe;AACjB,EACF;AAEA,MAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACI;AACJ,QAAM,aAAa,QACjB,MACE,wBAAwB,OAAO,KAAK,EAAE,UAAU,wBAAwB,GAC1E,CAAC,uBAAuB,KAAK,CAC/B;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,MACE,0BAA0B,yBAAyB,QAAQ;AAAA,IAC7D,UAAU,cAAc;AAAA,IACxB;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,cAAc,CAAC,MAAM;AAEzB,YAAQ,CAAC;AAAA,EAIX;AACA,SACE,4DACE,qCAAC;AAAA,IAAK,GAAG;AAAA,IAAgB,WAAW,GAAG,gBAAgB;AAAA,KACrD,qCAAC;AAAA,IAAI,WAAW,eAAe,SAAS;AAAA,KACtC,qCAAC;AAAA,IACC,KAAK;AAAA,IACL,qBAAmB;AAAA,IACnB,cAAY;AAAA,IACZ,kBAAc;AAAA,IACd,oBAAkB;AAAA,IAClB,iBAAe;AAAA,IACf;AAAA,IACA,WAAW,iBAAiB,UAAU;AAAA,IACtC,eAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM,OAAO,IAAI;AAAA,IACjB,OAAO;AAAA,MACL;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,GACF,CACF,CACF,GACC,wBAAwB,KACvB,qCAAC;AAAA,IAAY,YAAY,EAAE,WAAW;AAAA,IAAG,eAAY;AAAA,KAClD,GACC,aACI,GAAG,cAAc,yCACjB,KACH,OAAO,KAAK,EAAE,YAAY,uBAC/B,CAEJ;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,eAAe;AAChC,iBAAiB,cAAc;AAC/B,MAAM,6BAA6B,SAAS,gBAAgB,EAAE,YAC5D,eACF;AACA,2BAA2B,YAAY;AAIvC,IAAO,2BAAQ;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AAEA,SAAgB,eAAe;AAC/B,SAAS,gBAAgB;AACzB;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,aAAa;AACtB,SAAS,oBAAoB;AAE7B,MAAM,cAAc,kBAAkB,KAAK;AAAA,EACzC;AAAA,EACA;AAAA,EACA,CAAC,EAAE,WAAW,OAAO;AAAA,IACnB,eAAe;AAAA,EACjB;AACF;AAEA,MAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,aAAa;AAAA,IACjB,MACE,wBAAwB,OAAO,KAAK,EAAE,UAAU,wBAAwB;AAAA,IAC1E,CAAC,uBAAuB,KAAK;AAAA,EAC/B;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,0BAA0B,yBAAyB,QAAQ;AAAA,IAC7D,UAAU,cAAc;AAAA,IACxB;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,cAAc,CAAC,MAAM;AAEzB,YAAQ,CAAC;AAAA,EAIX;AACA,SACE;AAAA,IACE;AAAA,0BAAC;AAAA,QAAK,GAAG;AAAA,QAAgB,WAAW,GAAG,gBAAgB;AAAA,QACrD,8BAAC;AAAA,UAAI,WAAW,eAAe,SAAS;AAAA,UACtC,8BAAC;AAAA,YACC,KAAK;AAAA,YACL,qBAAmB;AAAA,YACnB,cAAY;AAAA,YACZ,kBAAc;AAAA,YACd,oBAAkB;AAAA,YAClB,iBAAe;AAAA,YACf;AAAA,YACA,WAAW,iBAAiB,UAAU;AAAA,YACtC,eAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAS;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA,MAAM,OAAO,IAAI;AAAA,YACjB,OAAO;AAAA,cACL;AAAA,YACF;AAAA,YACA;AAAA,YACA;AAAA,WACF;AAAA,SACF;AAAA,OACF;AAAA,MACC,wBAAwB,KACvB,oBAAC;AAAA,QAAY,YAAY,EAAE,WAAW;AAAA,QAAG,eAAY;AAAA,QAClD,aACC,aACI,GAAG,cAAc,yCACjB,KACH,OAAO,KAAK,EAAE,YAAY;AAAA,OAC/B;AAAA;AAAA,GAEJ;AAEJ;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,eAAe;AAChC,iBAAiB,cAAc;AAC/B,MAAM,6BAA6B,SAAS,gBAAgB,EAAE;AAAA,EAC5D;AACF;AACA,2BAA2B,YAAY;AAIvC,IAAO,2BAAQ;",
   "names": []
 }

package/dist/esm/LargeInputText/defaultProps.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/LargeInputText/defaultProps.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const defaultProps = {\n  containerProps: {},\n  autoFocus: false,\n  className: '',\n  disabled: false,\n  name: '',\n  id: null,\n  maxLength: null,\n  minLength: 0,\n  placeholder: '',\n  onClick: () => null,\n  onChange: () => null,\n  onFocus: () => null,\n  onBlur: () => null,\n  onKeyUp: () => null,\n  onKeyDown: () => null,\n  onPaste: () => null,\n  value: '',\n  hasError: false,\n  required: false,\n  readOnly: false,\n  resize: 'vertical',\n  innerRef: null,\n  ariaLabel: 'Enter text',\n  ariaAutocomplete: 'none',\n  role: 'textbox',\n  characterLimitCounter: 0,\n  rows: 3,\n  errorLimit: 'Please limit your entry to',\n  tabIndex: '',\n};\n"],
-  "mappings": "AAAA;ACAO,MAAM,eAAe;AAAA,EAC1B,gBAAgB,CAAC;AAAA,EACjB,WAAW;AAAA,EACX,WAAW;AAAA,EACX,UAAU;AAAA,EACV,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,WAAW;AAAA,EACX,WAAW;AAAA,EACX,aAAa;AAAA,EACb,SAAS,MAAM;AAAA,EACf,UAAU,MAAM;AAAA,EAChB,SAAS,MAAM;AAAA,EACf,QAAQ,MAAM;AAAA,EACd,SAAS,MAAM;AAAA,EACf,WAAW,MAAM;AAAA,EACjB,SAAS,MAAM;AAAA,EACf,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,WAAW;AAAA,EACX,kBAAkB;AAAA,EAClB,MAAM;AAAA,EACN,uBAAuB;AAAA,EACvB,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,UAAU;AACZ;",
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,eAAe;AAAA,EAC1B,gBAAgB,CAAC;AAAA,EACjB,WAAW;AAAA,EACX,WAAW;AAAA,EACX,UAAU;AAAA,EACV,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,WAAW;AAAA,EACX,WAAW;AAAA,EACX,aAAa;AAAA,EACb,SAAS,MAAM;AAAA,EACf,UAAU,MAAM;AAAA,EAChB,SAAS,MAAM;AAAA,EACf,QAAQ,MAAM;AAAA,EACd,SAAS,MAAM;AAAA,EACf,WAAW,MAAM;AAAA,EACjB,SAAS,MAAM;AAAA,EACf,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,WAAW;AAAA,EACX,kBAAkB;AAAA,EAClB,MAAM;AAAA,EACN,uBAAuB;AAAA,EACvB,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,UAAU;AACZ;",
   "names": []
 }

package/dist/esm/LargeInputText/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/LargeInputText/index.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default, DSLargeInputTextWithSchema, DSLargeInputText } from './DSLargeInputText';\n"],
-  "mappings": "AAAA;ACAA;",
-  "names": []
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAAA,UAAS,4BAA4B,wBAAwB;",
+  "names": ["default"]
 }

package/dist/esm/LargeInputText/props.js

@@ -1,7 +1,9 @@
 import * as React from "react";
 import { PropTypes } from "@elliemae/ds-utilities";
 const props = {
-  containerProps: PropTypes.object.description("Injected props to wrapper element of component"),
+  containerProps: PropTypes.object.description(
+    "Injected props to wrapper element of component"
+  ),
   autoFocus: PropTypes.bool.description("Whether uses auto focus or not"),
   className: PropTypes.string.description("CSS class"),
   disabled: PropTypes.bool.description("Whether is disabled or not"),
@@ -10,23 +12,49 @@ const props = {
   maxLength: PropTypes.number.description("Max length for text to be entered"),
   minLength: PropTypes.number.description("Min length for text to be entered"),
   placeholder: PropTypes.string.description("Placeholder for the text"),
-  onClick: PropTypes.func.description("Allows a function that is triggered once the input text is clicked"),
-  onChange: PropTypes.func.description("Allows a function that is triggered once the input text changes"),
-  onFocus: PropTypes.func.description("Allows a function that is triggered once the input text is focused"),
-  onBlur: PropTypes.func.description("Allows a function that is triggered once the input text loses focus"),
-  onKeyUp: PropTypes.func.description("Allows a function that is triggered once in the input a keyboard key is released"),
-  onKeyDown: PropTypes.func.description("Allows a function that is triggered once a key is being pressed"),
-  onPaste: PropTypes.func.description("Allows a function that is triggered once the input text is pasted"),
-  value: PropTypes.string.description("Default value once the component is initialized"),
-  hasError: PropTypes.bool.description("Whether the input text has error or not"),
-  required: PropTypes.bool.description("Whether the input text is required or not"),
-  readOnly: PropTypes.bool.description("Whether the input text is read only or not"),
-  resize: PropTypes.string.description("Whether the input text style is vertical or not"),
+  onClick: PropTypes.func.description(
+    "Allows a function that is triggered once the input text is clicked"
+  ),
+  onChange: PropTypes.func.description(
+    "Allows a function that is triggered once the input text changes"
+  ),
+  onFocus: PropTypes.func.description(
+    "Allows a function that is triggered once the input text is focused"
+  ),
+  onBlur: PropTypes.func.description(
+    "Allows a function that is triggered once the input text loses focus"
+  ),
+  onKeyUp: PropTypes.func.description(
+    "Allows a function that is triggered once in the input a keyboard key is released"
+  ),
+  onKeyDown: PropTypes.func.description(
+    "Allows a function that is triggered once a key is being pressed"
+  ),
+  onPaste: PropTypes.func.description(
+    "Allows a function that is triggered once the input text is pasted"
+  ),
+  value: PropTypes.string.description(
+    "Default value once the component is initialized"
+  ),
+  hasError: PropTypes.bool.description(
+    "Whether the input text has error or not"
+  ),
+  required: PropTypes.bool.description(
+    "Whether the input text is required or not"
+  ),
+  readOnly: PropTypes.bool.description(
+    "Whether the input text is read only or not"
+  ),
+  resize: PropTypes.string.description(
+    "Whether the input text style is vertical or not"
+  ),
   innerRef: PropTypes.func.description("ref forwarded to component"),
   ariaLabel: PropTypes.string.description("a11y aria label"),
   ariaAutocomplete: PropTypes.string.description(""),
   role: PropTypes.string.description("Type of input. Ex: textbox"),
-  characterLimitCounter: PropTypes.number.description("it will show a counter/limit if the value is greater than 0"),
+  characterLimitCounter: PropTypes.number.description(
+    "it will show a counter/limit if the value is greater than 0"
+  ),
   tabIndex: PropTypes.string.description("Tab index html property.")
 };
 export {