@elliemae/ds-form-input-textarea 3.12.0-rc.2 → 3.12.0-rc.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/dist/cjs/DSControlledLargeTextInput.js +37 -31
  2. package/dist/cjs/DSControlledLargeTextInput.js.map +2 -2
  3. package/dist/cjs/exported-related/theming.js +1 -1
  4. package/dist/cjs/exported-related/theming.js.map +1 -1
  5. package/dist/esm/DSControlledLargeTextInput.js +38 -32
  6. package/dist/esm/DSControlledLargeTextInput.js.map +2 -2
  7. package/dist/esm/exported-related/theming.js +1 -1
  8. package/dist/esm/exported-related/theming.js.map +1 -1
  9. package/package.json +3 -3
package/dist/cjs/DSControlledLargeTextInput.js CHANGED
@@ -36,7 +36,7 @@ var import_react_desc_prop_types = require("./react-desc-prop-types");
36
36
  var import_styles = require("./styles");
37
37
  var import_exported_related = require("./exported-related");
38
38
  const DSControlledLargeTextInput = (props) => {
39
- (0, import_ds_utilities.useValidateTypescriptPropTypes)(props, import_react_desc_prop_types.propTypes);
39
+ (0, import_ds_utilities.useValidateTypescriptPropTypes)(props, import_react_desc_prop_types.propTypes, import_exported_related.DSControlledLargeTextInputName);
40
40
  const propsWithDefault = (0, import_ds_utilities.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultProps);
41
41
  const { value, onChange, innerRef, resizable, name, id, hasError, maxHeight, ...otherProps } = propsWithDefault;
42
42
  const { className, ...globalAttributes } = (0, import_ds_utilities.useGetGlobalAttributes)(otherProps);
@@ -59,36 +59,42 @@ const DSControlledLargeTextInput = (props) => {
59
59
  ghostRef.current.style.maxHeight = `${maxHeight}px`;
60
60
  }
61
61
  }, [maxHeight, value]);
62
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledContainer, {
63
- className,
64
- "data-testid": import_exported_related.DSControlledLargetTextInputDatatestids.CONTAINER,
65
- ...xstyledProps,
66
- children: [
67
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.WrapperBorder, {
68
- $hasError: hasError,
69
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledTextArea, {
70
- ref: (0, import_ds_utilities.mergeRefs)(innerRef, textareaRef),
71
- "aria-multiline": true,
72
- value,
73
- $maxHeight: maxHeight,
74
- $minHeight: calculatedMinHeight,
75
- onChange: handleOnChange,
76
- resizable,
77
- name,
78
- id,
79
- "data-testid": import_exported_related.DSControlledLargetTextInputDatatestids.INPUT,
80
- ...globalAttributes
81
- })
82
- }),
83
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledTextArea, {
84
- disabled: true,
85
- ref: ghostRef,
86
- value,
87
- style: { visibility: "hidden", pointerEvents: "none", position: "absolute" },
88
- $maxHeight: maxHeight
89
- })
90
- ]
91
- });
62
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
63
+ import_styles.StyledContainer,
64
+ {
65
+ className,
66
+ "data-testid": import_exported_related.DSControlledLargetTextInputDatatestids.CONTAINER,
67
+ ...xstyledProps,
68
+ children: [
69
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.WrapperBorder, { $hasError: hasError, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
70
+ import_styles.StyledTextArea,
71
+ {
72
+ ref: (0, import_ds_utilities.mergeRefs)(innerRef, textareaRef),
73
+ "aria-multiline": true,
74
+ value,
75
+ $maxHeight: maxHeight,
76
+ $minHeight: calculatedMinHeight,
77
+ onChange: handleOnChange,
78
+ resizable,
79
+ name,
80
+ id,
81
+ "data-testid": import_exported_related.DSControlledLargetTextInputDatatestids.INPUT,
82
+ ...globalAttributes
83
+ }
84
+ ) }),
85
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
86
+ import_styles.StyledTextArea,
87
+ {
88
+ disabled: true,
89
+ ref: ghostRef,
90
+ value,
91
+ style: { visibility: "hidden", pointerEvents: "none", position: "absolute" },
92
+ $maxHeight: maxHeight
93
+ }
94
+ )
95
+ ]
96
+ }
97
+ );
92
98
  };
93
99
  DSControlledLargeTextInput.displayName = "DSControlledLargeTextInput";
94
100
  const DSControlledLargeTextInputWithSchema = (0, import_ds_utilities.describe)(DSControlledLargeTextInput);
package/dist/cjs/DSControlledLargeTextInput.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/DSControlledLargeTextInput.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport React, { useCallback, 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, WrapperBorder } 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 <WrapperBorder $hasError={hasError}>\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 {...globalAttributes}\n />\n </WrapperBorder>\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", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD+CnB;AA9CJ,mBAAsE;AACtE,0BAOO;AACP,mCAAwC;AACxC,oBAA+D;AAC/D,8BAAuD;AAGvD,MAAM,6BAA6B,CAAC,UAA0D;AAC5F,0DAA+B,OAAO,sCAAS;AAE/C,QAAM,uBAAmB,kDAAgE,OAAO,yCAAY;AAE5G,QAAM,EAAE,OAAO,UAAU,UAAU,WAAW,MAAM,IAAI,UAAU,cAAc,WAAW,IAAI;AAE/F,QAAM,EAAE,cAAc,iBAAiB,QAAI,4CAAuB,UAAU;AAE5E,QAAM,mBAAe,wCAAmB,UAAU;AAElD,QAAM,CAAC,qBAAqB,sBAAsB,QAAI,uBAAS,MAAS;AAExE,QAAM,kBAAc,qBAAmC,IAAI;AAC3D,QAAM,eAAW,qBAAmC,IAAI;AAExD,QAAM,qBAAiB;AAAA,IACrB,CAAC,MAA2B,SAAU,EAAE,OAA4B,OAAO,CAAC;AAAA,IAC5E,CAAC,QAAQ;AAAA,EACX;AAEA,oCAAgB,MAAM;AACpB,QAAI,YAAY,SAAS,WAAW,UAAU,IAAI;AAChD,eAAS,QAAQ,MAAM,YAAY;AACnC,YAAM,EAAE,aAAa,IAAI,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,6CAAC;AAAA,IACC;AAAA,IACA,eAAa,+DAAuC;AAAA,IACnD,GAAG;AAAA,IAEJ;AAAA,kDAAC;AAAA,QAAc,WAAW;AAAA,QACxB,sDAAC;AAAA,UACC,SAAK,+BAAU,UAAU,WAAW;AAAA,UACpC,kBAAc;AAAA,UACd;AAAA,UACA,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,UAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA;AAAA,UACA,eAAa,+DAAuC;AAAA,UACnD,GAAG;AAAA,SACN;AAAA,OACF;AAAA,MACA,4CAAC;AAAA,QACC,UAAQ;AAAA,QACR,KAAK;AAAA,QACL;AAAA,QACA,OAAO,EAAE,YAAY,UAAU,eAAe,QAAQ,UAAU,WAAW;AAAA,QAC3E,YAAY;AAAA,OACd;AAAA;AAAA,GACF;AAEJ;AAEA,2BAA2B,cAAc;AACzC,MAAM,2CAAuC,8BAAS,0BAA0B;AAChF,qCAAqC,YAAY;",
4
+ "sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport React, { useCallback, 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, WrapperBorder } from './styles';\nimport { DSControlledLargeTextInputName, DSControlledLargetTextInputDatatestids } from './exported-related';\nimport type { DSControlledLargeTextInputT } from './react-desc-prop-types';\n\nconst DSControlledLargeTextInput = (props: DSControlledLargeTextInputT.Props): JSX.Element => {\n useValidateTypescriptPropTypes(props, propTypes, DSControlledLargeTextInputName);\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 <WrapperBorder $hasError={hasError}>\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 {...globalAttributes}\n />\n </WrapperBorder>\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", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD+CnB;AA9CJ,mBAAsE;AACtE,0BAOO;AACP,mCAAwC;AACxC,oBAA+D;AAC/D,8BAAuF;AAGvF,MAAM,6BAA6B,CAAC,UAA0D;AAC5F,0DAA+B,OAAO,wCAAW,sDAA8B;AAE/E,QAAM,uBAAmB,kDAAgE,OAAO,yCAAY;AAE5G,QAAM,EAAE,OAAO,UAAU,UAAU,WAAW,MAAM,IAAI,UAAU,cAAc,WAAW,IAAI;AAE/F,QAAM,EAAE,cAAc,iBAAiB,QAAI,4CAAuB,UAAU;AAE5E,QAAM,mBAAe,wCAAmB,UAAU;AAElD,QAAM,CAAC,qBAAqB,sBAAsB,QAAI,uBAAS,MAAS;AAExE,QAAM,kBAAc,qBAAmC,IAAI;AAC3D,QAAM,eAAW,qBAAmC,IAAI;AAExD,QAAM,qBAAiB;AAAA,IACrB,CAAC,MAA2B,SAAU,EAAE,OAA4B,OAAO,CAAC;AAAA,IAC5E,CAAC,QAAQ;AAAA,EACX;AAEA,oCAAgB,MAAM;AACpB,QAAI,YAAY,SAAS,WAAW,UAAU,IAAI;AAChD,eAAS,QAAQ,MAAM,YAAY;AACnC,YAAM,EAAE,aAAa,IAAI,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;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,eAAa,+DAAuC;AAAA,MACnD,GAAG;AAAA,MAEJ;AAAA,oDAAC,+BAAc,WAAW,UACxB;AAAA,UAAC;AAAA;AAAA,YACC,SAAK,+BAAU,UAAU,WAAW;AAAA,YACpC,kBAAc;AAAA,YACd;AAAA,YACA,YAAY;AAAA,YACZ,YAAY;AAAA,YACZ,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,YACA,eAAa,+DAAuC;AAAA,YACnD,GAAG;AAAA;AAAA,QACN,GACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,UAAQ;AAAA,YACR,KAAK;AAAA,YACL;AAAA,YACA,OAAO,EAAE,YAAY,UAAU,eAAe,QAAQ,UAAU,WAAW;AAAA,YAC3E,YAAY;AAAA;AAAA,QACd;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,2BAA2B,cAAc;AACzC,MAAM,2CAAuC,8BAAS,0BAA0B;AAChF,qCAAqC,YAAY;",
6
6
  "names": []
7
7
  }
package/dist/cjs/exported-related/theming.js CHANGED
@@ -29,7 +29,7 @@ __export(theming_exports, {
29
29
  });
30
30
  module.exports = __toCommonJS(theming_exports);
31
31
  var React = __toESM(require("react"));
32
- const DSControlledLargeTextInputName = "DS-ControlledLargeTextInput";
32
+ const DSControlledLargeTextInputName = "DSControlledLargeTextInput";
33
33
  const DSControlledLargeTextInputSlots = {
34
34
  CONTAINER: "root",
35
35
  INPUT: "input",
package/dist/cjs/exported-related/theming.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/exported-related/theming.ts", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["export const DSControlledLargeTextInputName = 'DS-ControlledLargeTextInput';\n\nexport const DSControlledLargeTextInputSlots = {\n CONTAINER: 'root',\n INPUT: 'input',\n CHAR_COUNTER: 'char-counter',\n};\n", "import * as React from 'react';\nexport { React };\n"],
4
+ "sourcesContent": ["export const DSControlledLargeTextInputName = 'DSControlledLargeTextInput';\n\nexport const DSControlledLargeTextInputSlots = {\n CONTAINER: 'root',\n INPUT: 'input',\n CHAR_COUNTER: 'char-counter',\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,iCAAiC;AAEvC,MAAM,kCAAkC;AAAA,EAC7C,WAAW;AAAA,EACX,OAAO;AAAA,EACP,cAAc;AAChB;",
6
6
  "names": []
7
7
  }
package/dist/esm/DSControlledLargeTextInput.js CHANGED
@@ -11,9 +11,9 @@ import {
11
11
  } from "@elliemae/ds-utilities";
12
12
  import { propTypes, defaultProps } from "./react-desc-prop-types";
13
13
  import { StyledTextArea, StyledContainer, WrapperBorder } from "./styles";
14
- import { DSControlledLargetTextInputDatatestids } from "./exported-related";
14
+ import { DSControlledLargeTextInputName, DSControlledLargetTextInputDatatestids } from "./exported-related";
15
15
  const DSControlledLargeTextInput = (props) => {
16
- useValidateTypescriptPropTypes(props, propTypes);
16
+ useValidateTypescriptPropTypes(props, propTypes, DSControlledLargeTextInputName);
17
17
  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);
18
18
  const { value, onChange, innerRef, resizable, name, id, hasError, maxHeight, ...otherProps } = propsWithDefault;
19
19
  const { className, ...globalAttributes } = useGetGlobalAttributes(otherProps);
@@ -36,36 +36,42 @@ const DSControlledLargeTextInput = (props) => {
36
36
  ghostRef.current.style.maxHeight = `${maxHeight}px`;
37
37
  }
38
38
  }, [maxHeight, value]);
39
- return /* @__PURE__ */ jsxs(StyledContainer, {
40
- className,
41
- "data-testid": DSControlledLargetTextInputDatatestids.CONTAINER,
42
- ...xstyledProps,
43
- children: [
44
- /* @__PURE__ */ jsx(WrapperBorder, {
45
- $hasError: hasError,
46
- children: /* @__PURE__ */ jsx(StyledTextArea, {
47
- ref: mergeRefs(innerRef, textareaRef),
48
- "aria-multiline": true,
49
- value,
50
- $maxHeight: maxHeight,
51
- $minHeight: calculatedMinHeight,
52
- onChange: handleOnChange,
53
- resizable,
54
- name,
55
- id,
56
- "data-testid": DSControlledLargetTextInputDatatestids.INPUT,
57
- ...globalAttributes
58
- })
59
- }),
60
- /* @__PURE__ */ jsx(StyledTextArea, {
61
- disabled: true,
62
- ref: ghostRef,
63
- value,
64
- style: { visibility: "hidden", pointerEvents: "none", position: "absolute" },
65
- $maxHeight: maxHeight
66
- })
67
- ]
68
- });
39
+ return /* @__PURE__ */ jsxs(
40
+ StyledContainer,
41
+ {
42
+ className,
43
+ "data-testid": DSControlledLargetTextInputDatatestids.CONTAINER,
44
+ ...xstyledProps,
45
+ children: [
46
+ /* @__PURE__ */ jsx(WrapperBorder, { $hasError: hasError, children: /* @__PURE__ */ jsx(
47
+ StyledTextArea,
48
+ {
49
+ ref: mergeRefs(innerRef, textareaRef),
50
+ "aria-multiline": true,
51
+ value,
52
+ $maxHeight: maxHeight,
53
+ $minHeight: calculatedMinHeight,
54
+ onChange: handleOnChange,
55
+ resizable,
56
+ name,
57
+ id,
58
+ "data-testid": DSControlledLargetTextInputDatatestids.INPUT,
59
+ ...globalAttributes
60
+ }
61
+ ) }),
62
+ /* @__PURE__ */ jsx(
63
+ StyledTextArea,
64
+ {
65
+ disabled: true,
66
+ ref: ghostRef,
67
+ value,
68
+ style: { visibility: "hidden", pointerEvents: "none", position: "absolute" },
69
+ $maxHeight: maxHeight
70
+ }
71
+ )
72
+ ]
73
+ }
74
+ );
69
75
  };
70
76
  DSControlledLargeTextInput.displayName = "DSControlledLargeTextInput";
71
77
  const DSControlledLargeTextInputWithSchema = describe(DSControlledLargeTextInput);
package/dist/esm/DSControlledLargeTextInput.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSControlledLargeTextInput.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport React, { useCallback, 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, WrapperBorder } 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 <WrapperBorder $hasError={hasError}>\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 {...globalAttributes}\n />\n </WrapperBorder>\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"],
5
- "mappings": "AAAA,YAAY,WAAW;AC+CnB,SAMI,KANJ;AA9CJ,SAAgB,aAAa,QAAQ,UAAU,uBAAuB;AACtE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,WAAW,oBAAoB;AACxC,SAAS,gBAAgB,iBAAiB,qBAAqB;AAC/D,SAAS,8CAA8C;AAGvD,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,WAAW,IAAI;AAE/F,QAAM,EAAE,cAAc,iBAAiB,IAAI,uBAAuB,UAAU;AAE5E,QAAM,eAAe,mBAAmB,UAAU;AAElD,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAAS,MAAS;AAExE,QAAM,cAAc,OAAmC,IAAI;AAC3D,QAAM,WAAW,OAAmC,IAAI;AAExD,QAAM,iBAAiB;AAAA,IACrB,CAAC,MAA2B,SAAU,EAAE,OAA4B,OAAO,CAAC;AAAA,IAC5E,CAAC,QAAQ;AAAA,EACX;AAEA,kBAAgB,MAAM;AACpB,QAAI,YAAY,SAAS,WAAW,UAAU,IAAI;AAChD,eAAS,QAAQ,MAAM,YAAY;AACnC,YAAM,EAAE,aAAa,IAAI,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,qBAAC;AAAA,IACC;AAAA,IACA,eAAa,uCAAuC;AAAA,IACnD,GAAG;AAAA,IAEJ;AAAA,0BAAC;AAAA,QAAc,WAAW;AAAA,QACxB,8BAAC;AAAA,UACC,KAAK,UAAU,UAAU,WAAW;AAAA,UACpC,kBAAc;AAAA,UACd;AAAA,UACA,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,UAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA;AAAA,UACA,eAAa,uCAAuC;AAAA,UACnD,GAAG;AAAA,SACN;AAAA,OACF;AAAA,MACA,oBAAC;AAAA,QACC,UAAQ;AAAA,QACR,KAAK;AAAA,QACL;AAAA,QACA,OAAO,EAAE,YAAY,UAAU,eAAe,QAAQ,UAAU,WAAW;AAAA,QAC3E,YAAY;AAAA,OACd;AAAA;AAAA,GACF;AAEJ;AAEA,2BAA2B,cAAc;AACzC,MAAM,uCAAuC,SAAS,0BAA0B;AAChF,qCAAqC,YAAY;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport React, { useCallback, 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, WrapperBorder } from './styles';\nimport { DSControlledLargeTextInputName, DSControlledLargetTextInputDatatestids } from './exported-related';\nimport type { DSControlledLargeTextInputT } from './react-desc-prop-types';\n\nconst DSControlledLargeTextInput = (props: DSControlledLargeTextInputT.Props): JSX.Element => {\n useValidateTypescriptPropTypes(props, propTypes, DSControlledLargeTextInputName);\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 <WrapperBorder $hasError={hasError}>\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 {...globalAttributes}\n />\n </WrapperBorder>\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"],
5
+ "mappings": "AAAA,YAAY,WAAW;AC+CnB,SAMI,KANJ;AA9CJ,SAAgB,aAAa,QAAQ,UAAU,uBAAuB;AACtE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,WAAW,oBAAoB;AACxC,SAAS,gBAAgB,iBAAiB,qBAAqB;AAC/D,SAAS,gCAAgC,8CAA8C;AAGvF,MAAM,6BAA6B,CAAC,UAA0D;AAC5F,iCAA+B,OAAO,WAAW,8BAA8B;AAE/E,QAAM,mBAAmB,6BAAgE,OAAO,YAAY;AAE5G,QAAM,EAAE,OAAO,UAAU,UAAU,WAAW,MAAM,IAAI,UAAU,cAAc,WAAW,IAAI;AAE/F,QAAM,EAAE,cAAc,iBAAiB,IAAI,uBAAuB,UAAU;AAE5E,QAAM,eAAe,mBAAmB,UAAU;AAElD,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAAS,MAAS;AAExE,QAAM,cAAc,OAAmC,IAAI;AAC3D,QAAM,WAAW,OAAmC,IAAI;AAExD,QAAM,iBAAiB;AAAA,IACrB,CAAC,MAA2B,SAAU,EAAE,OAA4B,OAAO,CAAC;AAAA,IAC5E,CAAC,QAAQ;AAAA,EACX;AAEA,kBAAgB,MAAM;AACpB,QAAI,YAAY,SAAS,WAAW,UAAU,IAAI;AAChD,eAAS,QAAQ,MAAM,YAAY;AACnC,YAAM,EAAE,aAAa,IAAI,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;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,eAAa,uCAAuC;AAAA,MACnD,GAAG;AAAA,MAEJ;AAAA,4BAAC,iBAAc,WAAW,UACxB;AAAA,UAAC;AAAA;AAAA,YACC,KAAK,UAAU,UAAU,WAAW;AAAA,YACpC,kBAAc;AAAA,YACd;AAAA,YACA,YAAY;AAAA,YACZ,YAAY;AAAA,YACZ,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,YACA,eAAa,uCAAuC;AAAA,YACnD,GAAG;AAAA;AAAA,QACN,GACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,UAAQ;AAAA,YACR,KAAK;AAAA,YACL;AAAA,YACA,OAAO,EAAE,YAAY,UAAU,eAAe,QAAQ,UAAU,WAAW;AAAA,YAC3E,YAAY;AAAA;AAAA,QACd;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,2BAA2B,cAAc;AACzC,MAAM,uCAAuC,SAAS,0BAA0B;AAChF,qCAAqC,YAAY;",
6
6
  "names": []
7
7
  }
package/dist/esm/exported-related/theming.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from "react";
2
- const DSControlledLargeTextInputName = "DS-ControlledLargeTextInput";
2
+ const DSControlledLargeTextInputName = "DSControlledLargeTextInput";
3
3
  const DSControlledLargeTextInputSlots = {
4
4
  CONTAINER: "root",
5
5
  INPUT: "input",
package/dist/esm/exported-related/theming.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/theming.ts"],
4
- "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"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSControlledLargeTextInputName = 'DSControlledLargeTextInput';\n\nexport const DSControlledLargeTextInputSlots = {\n CONTAINER: 'root',\n INPUT: 'input',\n CHAR_COUNTER: 'char-counter',\n};\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,iCAAiC;AAEvC,MAAM,kCAAkC;AAAA,EAC7C,WAAW;AAAA,EACX,OAAO;AAAA,EACP,cAAc;AAChB;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-form-input-textarea",
3
- "version": "3.12.0-rc.2",
3
+ "version": "3.12.0-rc.4",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Controlled Form Input Textarea",
6
6
  "files": [
@@ -35,8 +35,8 @@
35
35
  "indent": 4
36
36
  },
37
37
  "dependencies": {
38
- "@elliemae/ds-system": "3.12.0-rc.2",
39
- "@elliemae/ds-utilities": "3.12.0-rc.2"
38
+ "@elliemae/ds-system": "3.12.0-rc.4",
39
+ "@elliemae/ds-utilities": "3.12.0-rc.4"
40
40
  },
41
41
  "devDependencies": {
42
42
  "@elliemae/pui-theme": "~2.6.0",