@elliemae/ds-form-input-textarea 3.3.0-rc.5 → 3.3.1-rc.1

package/dist/esm/DSControlledLargeTextInput.js

@@ -1,4 +1,3 @@
-"use strict";
 import * as React from "react";
 import React2, { useCallback, useRef, useState, useLayoutEffect } from "react";
 import {

package/dist/esm/DSControlledLargeTextInput.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSControlledLargeTextInput.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, WeakValidationMap, useRef, useState, useLayoutEffect } from 'react';\nimport {\n  describe,\n  mergeRefs,\n  useValidateTypescriptPropTypes,\n  useMemoMergePropsWithDefault,\n  useGetGlobalAttributes,\n  useGetXstyledProps,\n} from '@elliemae/ds-utilities';\nimport { propTypes, defaultProps } from './react-desc-prop-types';\nimport { StyledTextArea, StyledContainer } from './styles';\nimport { DSControlledLargetTextInputDatatestids } from './exported-related';\nimport type { DSControlledLargeTextInputT } from './react-desc-prop-types';\n\nconst DSControlledLargeTextInput = (props: DSControlledLargeTextInputT.Props): JSX.Element => {\n  useValidateTypescriptPropTypes(props, propTypes);\n\n  const propsWithDefault = useMemoMergePropsWithDefault<DSControlledLargeTextInputT.Props>(props, defaultProps);\n\n  const { value, onChange, innerRef, resizable, name, id, hasError, maxHeight, ...otherProps } = propsWithDefault;\n\n  const { className, ...globalAttributes } = useGetGlobalAttributes(otherProps);\n\n  const xstyledProps = useGetXstyledProps(otherProps);\n\n  const [calculatedMinHeight, setCalculatedMinHeight] = useState(undefined)\n\n  const textareaRef = useRef<HTMLTextAreaElement | null>(null);\n  const ghostRef = useRef<HTMLTextAreaElement | null>(null);\n\n  const handleOnChange = useCallback(\n    (e: React.KeyboardEvent) => onChange((e.target as HTMLInputElement).value, e),\n    [onChange],\n  );\n\n  useLayoutEffect(() => {\n    if (ghostRef && ghostRef.current && value !== '') {\n      ghostRef.current.style.maxHeight = '0px';\n      const { scrollHeight } = ghostRef.current;\n      if (maxHeight !== undefined && scrollHeight >= maxHeight) setCalculatedMinHeight(`${maxHeight}`);\n      else setCalculatedMinHeight(`${scrollHeight}`)\n      ghostRef.current.style.maxHeight = `${maxHeight}px`;\n    }\n  }, [maxHeight, value]);\n\n  return (\n    <StyledContainer\n      className={className}\n      data-testid={DSControlledLargetTextInputDatatestids.CONTAINER}\n      {...xstyledProps}\n    >\n      <StyledTextArea\n        ref={mergeRefs(innerRef, textareaRef)}\n        aria-multiline\n        value={value}\n        $maxHeight={maxHeight}\n        $minHeight={calculatedMinHeight}\n        onChange={handleOnChange}\n        resizable={resizable}\n        name={name}\n        id={id}\n        data-testid={DSControlledLargetTextInputDatatestids.INPUT}\n        $hasError={hasError}\n        {...globalAttributes}\n      />\n      <StyledTextArea\n        disabled\n        ref={ghostRef}\n        value={value}\n        style={{ visibility: 'hidden', pointerEvents: 'none', position: 'absolute' }}\n        $maxHeight={maxHeight}\n      />\n    </StyledContainer>\n  );\n};\n\nDSControlledLargeTextInput.displayName = 'DSControlledLargeTextInput';\nconst DSControlledLargeTextInputWithSchema = describe(DSControlledLargeTextInput);\nDSControlledLargeTextInputWithSchema.propTypes = propTypes as WeakValidationMap<unknown>;\n\nexport { DSControlledLargeTextInput, DSControlledLargeTextInputWithSchema };\n"],
-  "mappings": ";AAAA;ACAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AAGA,MAAM,6BAA6B,CAAC,UAA0D;AAC5F,iCAA+B,OAAO,SAAS;AAE/C,QAAM,mBAAmB,6BAAgE,OAAO,YAAY;AAE5G,QAAM,EAAE,OAAO,UAAU,UAAU,WAAW,MAAM,IAAI,UAAU,cAAc,eAAe;AAE/F,QAAM,EAAE,cAAc,qBAAqB,uBAAuB,UAAU;AAE5E,QAAM,eAAe,mBAAmB,UAAU;AAElD,QAAM,CAAC,qBAAqB,0BAA0B,SAAS,MAAS;AAExE,QAAM,cAAc,OAAmC,IAAI;AAC3D,QAAM,WAAW,OAAmC,IAAI;AAExD,QAAM,iBAAiB,YACrB,CAAC,MAA2B,SAAU,EAAE,OAA4B,OAAO,CAAC,GAC5E,CAAC,QAAQ,CACX;AAEA,kBAAgB,MAAM;AACpB,QAAI,YAAY,SAAS,WAAW,UAAU,IAAI;AAChD,eAAS,QAAQ,MAAM,YAAY;AACnC,YAAM,EAAE,iBAAiB,SAAS;AAClC,UAAI,cAAc,UAAa,gBAAgB;AAAW,+BAAuB,GAAG,WAAW;AAAA;AAC1F,+BAAuB,GAAG,cAAc;AAC7C,eAAS,QAAQ,MAAM,YAAY,GAAG;AAAA,IACxC;AAAA,EACF,GAAG,CAAC,WAAW,KAAK,CAAC;AAErB,SACE,qCAAC;AAAA,IACC;AAAA,IACA,eAAa,uCAAuC;AAAA,IACnD,GAAG;AAAA,KAEJ,qCAAC;AAAA,IACC,KAAK,UAAU,UAAU,WAAW;AAAA,IACpC,kBAAc;AAAA,IACd;AAAA,IACA,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAa,uCAAuC;AAAA,IACpD,WAAW;AAAA,IACV,GAAG;AAAA,GACN,GACA,qCAAC;AAAA,IACC,UAAQ;AAAA,IACR,KAAK;AAAA,IACL;AAAA,IACA,OAAO,EAAE,YAAY,UAAU,eAAe,QAAQ,UAAU,WAAW;AAAA,IAC3E,YAAY;AAAA,GACd,CACF;AAEJ;AAEA,2BAA2B,cAAc;AACzC,MAAM,uCAAuC,SAAS,0BAA0B;AAChF,qCAAqC,YAAY;",
+  "mappings": "AAAA;ACAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AAGA,MAAM,6BAA6B,CAAC,UAA0D;AAC5F,iCAA+B,OAAO,SAAS;AAE/C,QAAM,mBAAmB,6BAAgE,OAAO,YAAY;AAE5G,QAAM,EAAE,OAAO,UAAU,UAAU,WAAW,MAAM,IAAI,UAAU,cAAc,eAAe;AAE/F,QAAM,EAAE,cAAc,qBAAqB,uBAAuB,UAAU;AAE5E,QAAM,eAAe,mBAAmB,UAAU;AAElD,QAAM,CAAC,qBAAqB,0BAA0B,SAAS,MAAS;AAExE,QAAM,cAAc,OAAmC,IAAI;AAC3D,QAAM,WAAW,OAAmC,IAAI;AAExD,QAAM,iBAAiB,YACrB,CAAC,MAA2B,SAAU,EAAE,OAA4B,OAAO,CAAC,GAC5E,CAAC,QAAQ,CACX;AAEA,kBAAgB,MAAM;AACpB,QAAI,YAAY,SAAS,WAAW,UAAU,IAAI;AAChD,eAAS,QAAQ,MAAM,YAAY;AACnC,YAAM,EAAE,iBAAiB,SAAS;AAClC,UAAI,cAAc,UAAa,gBAAgB;AAAW,+BAAuB,GAAG,WAAW;AAAA;AAC1F,+BAAuB,GAAG,cAAc;AAC7C,eAAS,QAAQ,MAAM,YAAY,GAAG;AAAA,IACxC;AAAA,EACF,GAAG,CAAC,WAAW,KAAK,CAAC;AAErB,SACE,qCAAC;AAAA,IACC;AAAA,IACA,eAAa,uCAAuC;AAAA,IACnD,GAAG;AAAA,KAEJ,qCAAC;AAAA,IACC,KAAK,UAAU,UAAU,WAAW;AAAA,IACpC,kBAAc;AAAA,IACd;AAAA,IACA,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAa,uCAAuC;AAAA,IACpD,WAAW;AAAA,IACV,GAAG;AAAA,GACN,GACA,qCAAC;AAAA,IACC,UAAQ;AAAA,IACR,KAAK;AAAA,IACL;AAAA,IACA,OAAO,EAAE,YAAY,UAAU,eAAe,QAAQ,UAAU,WAAW;AAAA,IAC3E,YAAY;AAAA,GACd,CACF;AAEJ;AAEA,2BAA2B,cAAc;AACzC,MAAM,uCAAuC,SAAS,0BAA0B;AAChF,qCAAqC,YAAY;",
   "names": []
 }

package/dist/esm/exported-related/data-test-ids.js

@@ -1,4 +1,3 @@
-"use strict";
 import * as React from "react";
 const DSControlledLargetTextInputDatatestids = {
   CONTAINER: "ds-controlled-large-text-input-container",

package/dist/esm/exported-related/data-test-ids.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/data-test-ids.ts"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSControlledLargetTextInputDatatestids = {\n  CONTAINER: 'ds-controlled-large-text-input-container',\n  CHAR_COUNTER: 'ds-controlled-large-text-input-char-counter',\n  INPUT: 'ds-controlled-large-text-input',\n};\n"],
-  "mappings": ";AAAA;ACAO,MAAM,yCAAyC;AAAA,EACpD,WAAW;AAAA,EACX,cAAc;AAAA,EACd,OAAO;AACT;",
+  "mappings": "AAAA;ACAO,MAAM,yCAAyC;AAAA,EACpD,WAAW;AAAA,EACX,cAAc;AAAA,EACd,OAAO;AACT;",
   "names": []
 }

package/dist/esm/exported-related/index.js

@@ -1,4 +1,3 @@
-"use strict";
 import * as React from "react";
 export * from "./data-test-ids";
 export * from "./theming";

package/dist/esm/exported-related/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/index.ts"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './data-test-ids';\nexport * from './theming';\n"],
-  "mappings": ";AAAA;ACAA;AACA;",
+  "mappings": "AAAA;ACAA;AACA;",
   "names": []
 }

package/dist/esm/exported-related/theming.js

@@ -1,4 +1,3 @@
-"use strict";
 import * as React from "react";
 const DSControlledLargeTextInputName = "DS-ControlledLargeTextInput";
 const DSControlledLargeTextInputSlots = {

package/dist/esm/exported-related/theming.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/theming.ts"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSControlledLargeTextInputName = 'DS-ControlledLargeTextInput';\n\nexport const DSControlledLargeTextInputSlots = {\n  CONTAINER: 'root',\n  INPUT: 'input',\n  CHAR_COUNTER: 'char-counter',\n};\n"],
-  "mappings": ";AAAA;ACAO,MAAM,iCAAiC;AAEvC,MAAM,kCAAkC;AAAA,EAC7C,WAAW;AAAA,EACX,OAAO;AAAA,EACP,cAAc;AAChB;",
+  "mappings": "AAAA;ACAO,MAAM,iCAAiC;AAEvC,MAAM,kCAAkC;AAAA,EAC7C,WAAW;AAAA,EACX,OAAO;AAAA,EACP,cAAc;AAChB;",
   "names": []
 }

package/dist/esm/index.js

@@ -1,4 +1,3 @@
-"use strict";
 import * as React from "react";
 export * from "./DSControlledLargeTextInput";
 export * from "./exported-related";

package/dist/esm/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.ts"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSControlledLargeTextInput';\nexport * from './exported-related';\n"],
-  "mappings": ";AAAA;ACAA;AACA;",
+  "mappings": "AAAA;ACAA;AACA;",
   "names": []
 }

package/dist/esm/react-desc-prop-types.js

@@ -1,4 +1,3 @@
-"use strict";
 import * as React from "react";
 import { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from "@elliemae/ds-utilities";
 const noop = () => {

package/dist/esm/react-desc-prop-types.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.ts"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-utilities';\n\nconst noop = () => {};\n\nexport declare namespace DSControlledLargeTextInputT {\n  export interface DefaultProps {\n    value: string;\n    onChange: () => void;\n    resizable: boolean;\n    hasError: boolean;\n    rows: string;\n  }\n\n  export interface RequiredProps {\n    name: string;\n    id: string;\n  }\n\n  export interface PropsOptional {\n    disabled?: boolean;\n    readOnly?: boolean;\n    maxHeight?: number;\n    innerRef?: React.MutableRefObject<HTMLTextAreaElement | null>;\n    hasError?: boolean;\n  }\n\n  export interface Props extends DefaultProps, PropsOptional, RequiredProps {}\n}\n\nexport const defaultProps: DSControlledLargeTextInputT.DefaultProps = {\n  rows: '2',\n  value: '',\n  onChange: noop,\n  resizable: false,\n  hasError: false,\n};\n\nexport const propTypes = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  value: PropTypes.string.description('Text are value.').defaultValue(''),\n  onChange: PropTypes.func.description('OnChange cb.').defaultValue('() => {}'),\n  resizable: PropTypes.bool.description('Enables to resize the component.').defaultValue(false),\n  rows: PropTypes.string.description(\n    'Sets the number of lines for the default height. Once lines are reached, scroll behavior enables.',\n  ),\n  id: PropTypes.string.description('Unique id.'),\n  innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to the input.'),\n  disabled: PropTypes.bool.description('Set disabled state.'),\n  readOnly: PropTypes.bool.description('Set readonly state.'),\n  maxHeight: PropTypes.number.description('Set max height to recize input text'),\n  hasError: PropTypes.bool.description('Set error state.').defaultValue(false),\n};\n"],
-  "mappings": ";AAAA;ACAA;AAEA,MAAM,OAAO,MAAM;AAAC;AA2Bb,MAAM,eAAyD;AAAA,EACpE,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,UAAU;AACZ;AAEO,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAO,UAAU,OAAO,YAAY,iBAAiB,EAAE,aAAa,EAAE;AAAA,EACtE,UAAU,UAAU,KAAK,YAAY,cAAc,EAAE,aAAa,UAAU;AAAA,EAC5E,WAAW,UAAU,KAAK,YAAY,kCAAkC,EAAE,aAAa,KAAK;AAAA,EAC5F,MAAM,UAAU,OAAO,YACrB,mGACF;AAAA,EACA,IAAI,UAAU,OAAO,YAAY,YAAY;AAAA,EAC7C,UAAU,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,IAAI,CAAC,EAAE,YAAY,yBAAyB;AAAA,EACvG,UAAU,UAAU,KAAK,YAAY,qBAAqB;AAAA,EAC1D,UAAU,UAAU,KAAK,YAAY,qBAAqB;AAAA,EAC1D,WAAW,UAAU,OAAO,YAAY,qCAAqC;AAAA,EAC7E,UAAU,UAAU,KAAK,YAAY,kBAAkB,EAAE,aAAa,KAAK;AAC7E;",
+  "mappings": "AAAA;ACAA;AAEA,MAAM,OAAO,MAAM;AAAC;AA2Bb,MAAM,eAAyD;AAAA,EACpE,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,UAAU;AACZ;AAEO,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAO,UAAU,OAAO,YAAY,iBAAiB,EAAE,aAAa,EAAE;AAAA,EACtE,UAAU,UAAU,KAAK,YAAY,cAAc,EAAE,aAAa,UAAU;AAAA,EAC5E,WAAW,UAAU,KAAK,YAAY,kCAAkC,EAAE,aAAa,KAAK;AAAA,EAC5F,MAAM,UAAU,OAAO,YACrB,mGACF;AAAA,EACA,IAAI,UAAU,OAAO,YAAY,YAAY;AAAA,EAC7C,UAAU,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,IAAI,CAAC,EAAE,YAAY,yBAAyB;AAAA,EACvG,UAAU,UAAU,KAAK,YAAY,qBAAqB;AAAA,EAC1D,UAAU,UAAU,KAAK,YAAY,qBAAqB;AAAA,EAC1D,WAAW,UAAU,OAAO,YAAY,qCAAqC;AAAA,EAC7E,UAAU,UAAU,KAAK,YAAY,kBAAkB,EAAE,aAAa,KAAK;AAC7E;",
   "names": []
 }

package/dist/esm/styles.js

@@ -1,4 +1,3 @@
-"use strict";
 import * as React from "react";
 import { styled, layout, space, sizing } from "@elliemae/ds-system";
 import { DSControlledLargeTextInputName, DSControlledLargeTextInputSlots } from "./exported-related";

package/dist/esm/styles.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styles.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, layout, space, sizing } from '@elliemae/ds-system';\nimport { DSControlledLargeTextInputName, DSControlledLargeTextInputSlots } from './exported-related';\n\ninterface StyledTextAreaT {\n  resizable: boolean;\n  hasError: boolean;\n}\n\nexport const StyledContainer = styled('div', {\n  name: DSControlledLargeTextInputName,\n  slot: DSControlledLargeTextInputSlots.CONTAINER,\n})`\n  display: grid;\n  grid-gap: 4px;\n  grid-template-rows: auto auto;\n  grid-template-columns: fit-content;\n  ${layout}\n  ${space}\n  ${sizing}\n`;\n\nexport const StyledTextArea = styled('textarea', {\n  name: DSControlledLargeTextInputName,\n  slot: DSControlledLargeTextInputSlots.INPUT,\n})<StyledTextAreaT>`\n  &:hover { \n    border: 1px solid ${({theme}) => theme.colors.brand[700]};\n  }\n  width: 100%;\n  ${({ resizable }) => (resizable ? `` : `resize: none;`)}\n  &:disabled {\n    &:hover {\n      cursor: not-allowed;\n    }\n  }\n  ${({ $maxHeight }) => ($maxHeight ? `max-height: ${$maxHeight}px;` : ``)}\n  ${({ $minHeight }) => ($minHeight ? `min-height: ${$minHeight}px;` : ``)}\n  ${({ disabled }) => (disabled ? `overflow: hidden` : '')}\n  ${({ $hasError }) => ($hasError ? `border: 1px solid red;` : ``)}\n`;\n"],
-  "mappings": ";AAAA;ACAA;AACA;AAOO,MAAM,kBAAkB,OAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,gCAAgC;AACxC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKG;AAAA,IACA;AAAA,IACA;AAAA;AAGG,MAAM,iBAAiB,OAAO,YAAY;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,gCAAgC;AACxC,CAAC;AAAA;AAAA,wBAEuB,CAAC,EAAC,YAAW,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA,IAGpD,CAAC,EAAE,gBAAiB,YAAY,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMrC,CAAC,EAAE,iBAAkB,aAAa,eAAe,kBAAkB;AAAA,IACnE,CAAC,EAAE,iBAAkB,aAAa,eAAe,kBAAkB;AAAA,IACnE,CAAC,EAAE,eAAgB,WAAW,qBAAqB;AAAA,IACnD,CAAC,EAAE,gBAAiB,YAAY,2BAA2B;AAAA;",
+  "mappings": "AAAA;ACAA;AACA;AAOO,MAAM,kBAAkB,OAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,gCAAgC;AACxC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKG;AAAA,IACA;AAAA,IACA;AAAA;AAGG,MAAM,iBAAiB,OAAO,YAAY;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,gCAAgC;AACxC,CAAC;AAAA;AAAA,wBAEuB,CAAC,EAAC,YAAW,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA,IAGpD,CAAC,EAAE,gBAAiB,YAAY,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMrC,CAAC,EAAE,iBAAkB,aAAa,eAAe,kBAAkB;AAAA,IACnE,CAAC,EAAE,iBAAkB,aAAa,eAAe,kBAAkB;AAAA,IACnE,CAAC,EAAE,eAAgB,WAAW,qBAAqB;AAAA,IACnD,CAAC,EAAE,gBAAiB,YAAY,2BAA2B;AAAA;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-form-input-textarea",
-  "version": "3.3.0-rc.5",
+  "version": "3.3.1-rc.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Controlled Form Input Textarea",
   "files": [
@@ -35,8 +35,8 @@
     "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-system": "3.3.0-rc.5",
-    "@elliemae/ds-utilities": "3.3.0-rc.5",
+    "@elliemae/ds-system": "3.3.1-rc.1",
+    "@elliemae/ds-utilities": "3.3.1-rc.1",
     "@xstyled/styled-components": "~3.6.0"
   },
   "devDependencies": {