@ntbjs/react-components 1.1.0-beta.72 → 1.1.0-beta.73

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.
@@ -3,7 +3,7 @@
3
3
  var defaultTheme = require('./defaultTheme-50f2b88f.js');
4
4
  var React = require('react');
5
5
  var lodash = require('lodash');
6
- var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
6
+ var TextInput = require('./TextInput-a1083be3.js');
7
7
  var ResizeObserver = require('resize-observer-polyfill');
8
8
  var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
9
9
  var ActionButton = require('./ActionButton-c3f5ed94.js');
@@ -14,8 +14,7 @@ require('./CompactStarRating-53593d92.js');
14
14
  require('./CompactTextInput-b4215024.js');
15
15
  require('./MultiSelect-5b008b32.js');
16
16
  require('./Radio-0594409d.js');
17
- require('./TextArea-6003c382.js');
18
- require('./TextInput-c656bf03.js');
17
+ require('./TextArea-96e5e095.js');
19
18
  require('./Switch-cd165c8c.js');
20
19
  require('./Alert-3e4f8be1.js');
21
20
  require('./Badge-9bcebe96.js');
@@ -870,7 +869,7 @@ var AssetGalleryBase = React__default['default'].forwardRef(function AssetGaller
870
869
  props = defaultTheme._objectWithoutProperties(_ref, ["assets", "viewMode", "thumbnailMaxHeight", "selectable", "selectedAssetKeys", "onAssetSelected", "onAssetUnselected", "softSelectable", "softSelectedAssetKey", "scrollElement", "onAssetSoftSelectedChanged", "component"]);
871
870
 
872
871
  var assetGalleryDOMNode = React.useRef();
873
- var assetGalleryCompactRef = useMergedRefs.useMergedRefs(forwardedRef, assetGalleryDOMNode);
872
+ var assetGalleryCompactRef = TextInput.useMergedRefs(forwardedRef, assetGalleryDOMNode);
874
873
  var assetGalleryWidth = React.useRef(0);
875
874
  var minimumRowAspectRatio = React.useRef(0);
876
875
  var calculatedAssets = React.useRef([]);
@@ -3,7 +3,7 @@
3
3
  var defaultTheme = require('./defaultTheme-50f2b88f.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
- var TextArea = require('./TextArea-6003c382.js');
6
+ var TextArea = require('./TextArea-96e5e095.js');
7
7
  var CompactAutocompleteSelect = require('./CompactAutocompleteSelect-05c45f9a.js');
8
8
  var warningCircle = require('./warning-circle-24522402.js');
9
9
  var lodash = require('lodash');
@@ -5,7 +5,6 @@ var React = require('react');
5
5
  var nanoid = require('nanoid');
6
6
  var styled = require('styled-components');
7
7
  var lodash = require('lodash');
8
- var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
9
8
  var editNote = require('./edit-note-c47d292e.js');
10
9
  var checkCircleFilled = require('./check-circle-filled-1640873e.js');
11
10
 
@@ -133,7 +132,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
133
132
  rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "required", "disabled", "hidden", "readOnly", "edit", "maxRows", "showMore", "showMoreText", "autoComplete", "description", "success", "error", "warning", "icon", "rows", "className", "style", "onChange", "onBlur", "lightBackground", "noBorder", "warningAlert", "errorAlert"]);
134
133
 
135
134
  var textAreaRef = React.useRef(null);
136
- var textInputRef = useMergedRefs.useMergedRefs(forwardedRef, textAreaRef);
135
+ var textInputRef = forwardedRef || textAreaRef;
137
136
 
138
137
  var _useState = React.useState(''),
139
138
  _useState2 = defaultTheme._slicedToArray(_useState, 2),
@@ -162,7 +161,7 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
162
161
 
163
162
  React.useEffect(function () {
164
163
  setDefaultRows(rows);
165
- }, []);
164
+ }, [rows]);
166
165
 
167
166
  var _useState11 = React.useState(nanoid.nanoid()),
168
167
  _useState12 = defaultTheme._slicedToArray(_useState11, 1),
@@ -212,21 +211,33 @@ var TextArea = React__default['default'].forwardRef(function TextArea(_ref, forw
212
211
  };
213
212
 
214
213
  React.useEffect(function () {
215
- var lineheight = 1.5;
216
- var textarea = textAreaRef.current ? textAreaRef.current.scrollHeight : 0;
217
- var rowsLimit = Math.floor(textarea / (lineheight * 11.5));
218
- var maxHeight = rowsLimit * lineheight + 'em';
219
- setMaxContentRows(rowsLimit);
220
- setMaxHeight(maxHeight);
214
+ var calculateRows = function calculateRows() {
215
+ var lineheight = 1.5;
216
+ var textareaRefCurrent = textInputRef.current;
221
217
 
222
- if (rowsLimit > defaultRows) {
223
- setExpanded(true);
224
- }
218
+ if (textareaRefCurrent) {
219
+ var textarea = textareaRefCurrent.scrollHeight;
220
+ var rowsLimit = Math.floor(textarea / (lineheight * 11.5));
221
+
222
+ var _maxHeight = rowsLimit * lineheight + 'em';
223
+
224
+ setMaxContentRows(rowsLimit);
225
+ setMaxHeight(_maxHeight);
226
+
227
+ if (rowsLimit > defaultRows) {
228
+ setExpanded(true);
229
+ }
230
+
231
+ if (typeof maxRows === 'function') {
232
+ maxRows(rowsLimit);
233
+ }
234
+ }
235
+ };
225
236
 
226
- if (typeof maxRows === 'function') {
227
- maxRows(rowsLimit);
237
+ if (textInputRef.current) {
238
+ calculateRows();
228
239
  }
229
- }, []);
240
+ }, [textInputRef, defaultRows, maxRows]);
230
241
  if (hidden) return null;
231
242
  return React__default['default'].createElement(TextInput, {
232
243
  disabled: disabled,
@@ -5,7 +5,6 @@ var React = require('react');
5
5
  var nanoid = require('nanoid');
6
6
  var styled = require('styled-components');
7
7
  var lodash = require('lodash');
8
- var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
9
8
  var editNote = require('./edit-note-c47d292e.js');
10
9
 
11
10
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -88,6 +87,43 @@ var Description = styled__default['default'].p.attrs(defaultTheme.applyDefaultTh
88
87
  return props.error && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
89
88
  });
90
89
 
90
+ var toFnRef = function toFnRef(ref) {
91
+ return !ref || typeof ref === 'function' ? ref : function (value) {
92
+ ref.current = value;
93
+ };
94
+ };
95
+
96
+ function mergeRefs(refA, refB) {
97
+ var a = toFnRef(refA);
98
+ var b = toFnRef(refB);
99
+ return function (value) {
100
+ if (a) a(value);
101
+ if (b) b(value);
102
+ };
103
+ }
104
+ /**
105
+ * Create and returns a single callback ref composed from two other Refs.
106
+ *
107
+ * ```tsx
108
+ * const Button = React.forwardRef((props, ref) => {
109
+ * const [element, attachRef] = useCallbackRef<HTMLButtonElement>();
110
+ * const mergedRef = useMergedRefs(ref, attachRef);
111
+ *
112
+ * return <button ref={mergedRef} {...props}/>
113
+ * })
114
+ * ```
115
+ *
116
+ * @param refA A Callback or mutable Ref
117
+ * @param refB A Callback or mutable Ref
118
+ * @category refs
119
+ */
120
+
121
+ function useMergedRefs(refA, refB) {
122
+ return React.useMemo(function () {
123
+ return mergeRefs(refA, refB);
124
+ }, [refA, refB]);
125
+ }
126
+
91
127
  var TextInput = React__default['default'].forwardRef(function TextInput(_ref, forwardedRef) {
92
128
  var value = _ref.value,
93
129
  defaultValue = _ref.defaultValue,
@@ -112,7 +148,7 @@ var TextInput = React__default['default'].forwardRef(function TextInput(_ref, fo
112
148
  rest = defaultTheme._objectWithoutProperties(_ref, ["value", "defaultValue", "name", "label", "placeholder", "type", "required", "disabled", "readOnly", "autoComplete", "description", "error", "warning", "icon", "adornments", "className", "style", "onChange", "onBlur", "noBorder"]);
113
149
 
114
150
  var textInputDomNode = React.useRef(null);
115
- var textInputRef = useMergedRefs.useMergedRefs(forwardedRef, textInputDomNode);
151
+ var textInputRef = useMergedRefs(forwardedRef, textInputDomNode);
116
152
 
117
153
  var _useState = React.useState(nanoid.nanoid()),
118
154
  _useState2 = defaultTheme._slicedToArray(_useState, 1),
@@ -231,3 +267,4 @@ TextInput.propTypes = process.env.NODE_ENV !== "production" ? {
231
267
  } : {};
232
268
 
233
269
  exports.TextInput = TextInput;
270
+ exports.useMergedRefs = useMergedRefs;
@@ -1,12 +1,11 @@
1
1
  'use strict';
2
2
 
3
- var TextArea = require('../../TextArea-6003c382.js');
3
+ var TextArea = require('../../TextArea-96e5e095.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
7
7
  require('nanoid');
8
8
  require('lodash');
9
- require('../../useMergedRefs-b6d2f8fc.js');
10
9
  require('../../edit-note-c47d292e.js');
11
10
  require('../../check-circle-filled-1640873e.js');
12
11
 
@@ -1,12 +1,11 @@
1
1
  'use strict';
2
2
 
3
- var TextInput = require('../../TextInput-c656bf03.js');
3
+ var TextInput = require('../../TextInput-a1083be3.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
7
7
  require('nanoid');
8
8
  require('lodash');
9
- require('../../useMergedRefs-b6d2f8fc.js');
10
9
  require('../../edit-note-c47d292e.js');
11
10
 
12
11
 
package/inputs/index.js CHANGED
@@ -10,8 +10,8 @@ var CompactStarRating = require('../CompactStarRating-53593d92.js');
10
10
  var CompactTextInput = require('../CompactTextInput-b4215024.js');
11
11
  var MultiSelect = require('../MultiSelect-5b008b32.js');
12
12
  var Radio = require('../Radio-0594409d.js');
13
- var TextArea = require('../TextArea-6003c382.js');
14
- var TextInput = require('../TextInput-c656bf03.js');
13
+ var TextArea = require('../TextArea-96e5e095.js');
14
+ var TextInput = require('../TextInput-a1083be3.js');
15
15
  var Switch = require('../Switch-cd165c8c.js');
16
16
  require('../defaultTheme-50f2b88f.js');
17
17
  require('styled-components');
@@ -36,7 +36,6 @@ require('../Badge-9bcebe96.js');
36
36
  require('../Tab-bd0f3345.js');
37
37
  require('../Tabs-cfc35dc0.js');
38
38
  require('../Tooltip-f4f9ab8f.js');
39
- require('../useMergedRefs-b6d2f8fc.js');
40
39
 
41
40
 
42
41
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "1.1.0-beta.72",
3
+ "version": "1.1.0-beta.73",
4
4
  "description": "NTBs common front-end design utilities and React components.",
5
5
  "scripts": {
6
6
  "build": "cross-env NODE_ENV=production rollup -c",
@@ -1,11 +1,13 @@
1
1
  'use strict';
2
2
 
3
- var AssetGallery = require('../../AssetGallery-d66dcce2.js');
3
+ var AssetGallery = require('../../AssetGallery-7bc44f2d.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
7
7
  require('lodash');
8
- require('../../useMergedRefs-b6d2f8fc.js');
8
+ require('../../TextInput-a1083be3.js');
9
+ require('nanoid');
10
+ require('../../edit-note-c47d292e.js');
9
11
  require('resize-observer-polyfill');
10
12
  require('react-lazy-load-image-component');
11
13
  require('../../ActionButton-c3f5ed94.js');
@@ -17,7 +19,6 @@ require('../../shift-away-subtle-cfdf1dbe.js');
17
19
  require('../../ContextMenu-d088833b.js');
18
20
  require('../../expand-more-94585605.js');
19
21
  require('../../Checkbox-012bbd3f.js');
20
- require('nanoid');
21
22
  require('../../CompactAutocompleteSelect-05c45f9a.js');
22
23
  require('react-select');
23
24
  require('../../react-select-creatable.esm-2f23d6c6.js');
@@ -27,7 +28,6 @@ require('../../close-ebf2f3cf.js');
27
28
  require('../../check-circle-filled-1640873e.js');
28
29
  require('../../CompactStarRating-53593d92.js');
29
30
  require('../../CompactTextInput-b4215024.js');
30
- require('../../edit-note-c47d292e.js');
31
31
  require('../../Alert-3e4f8be1.js');
32
32
  require('../../Badge-9bcebe96.js');
33
33
  require('../../Tab-bd0f3345.js');
@@ -35,8 +35,7 @@ require('../../Tabs-cfc35dc0.js');
35
35
  require('../../Tooltip-f4f9ab8f.js');
36
36
  require('../../MultiSelect-5b008b32.js');
37
37
  require('../../Radio-0594409d.js');
38
- require('../../TextArea-6003c382.js');
39
- require('../../TextInput-c656bf03.js');
38
+ require('../../TextArea-96e5e095.js');
40
39
  require('../../Switch-cd165c8c.js');
41
40
  require('../../warning-circle-24522402.js');
42
41
 
@@ -1,13 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var Instructions = require('../../Instructions-d699d7b1.js');
3
+ var Instructions = require('../../Instructions-2bef3a68.js');
4
4
  require('../../defaultTheme-50f2b88f.js');
5
5
  require('styled-components');
6
6
  require('react');
7
- require('../../TextArea-6003c382.js');
7
+ require('../../TextArea-96e5e095.js');
8
8
  require('nanoid');
9
9
  require('lodash');
10
- require('../../useMergedRefs-b6d2f8fc.js');
11
10
  require('../../edit-note-c47d292e.js');
12
11
  require('../../check-circle-filled-1640873e.js');
13
12
  require('../../CompactAutocompleteSelect-05c45f9a.js');
package/widgets/index.js CHANGED
@@ -2,15 +2,17 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var AssetGallery = require('../AssetGallery-d66dcce2.js');
5
+ var AssetGallery = require('../AssetGallery-7bc44f2d.js');
6
6
  var ContextMenu = require('../ContextMenu-d088833b.js');
7
7
  var AssetPreviewTopBar = require('../AssetPreviewTopBar-449e6019.js');
8
- var Instructions = require('../Instructions-d699d7b1.js');
8
+ var Instructions = require('../Instructions-2bef3a68.js');
9
9
  require('../defaultTheme-50f2b88f.js');
10
10
  require('styled-components');
11
11
  require('react');
12
12
  require('lodash');
13
- require('../useMergedRefs-b6d2f8fc.js');
13
+ require('../TextInput-a1083be3.js');
14
+ require('nanoid');
15
+ require('../edit-note-c47d292e.js');
14
16
  require('resize-observer-polyfill');
15
17
  require('react-lazy-load-image-component');
16
18
  require('../ActionButton-c3f5ed94.js');
@@ -21,7 +23,6 @@ require('@tippyjs/react');
21
23
  require('../shift-away-subtle-cfdf1dbe.js');
22
24
  require('../expand-more-94585605.js');
23
25
  require('../Checkbox-012bbd3f.js');
24
- require('nanoid');
25
26
  require('../CompactAutocompleteSelect-05c45f9a.js');
26
27
  require('react-select');
27
28
  require('../react-select-creatable.esm-2f23d6c6.js');
@@ -31,7 +32,6 @@ require('../close-ebf2f3cf.js');
31
32
  require('../check-circle-filled-1640873e.js');
32
33
  require('../CompactStarRating-53593d92.js');
33
34
  require('../CompactTextInput-b4215024.js');
34
- require('../edit-note-c47d292e.js');
35
35
  require('../Alert-3e4f8be1.js');
36
36
  require('../Badge-9bcebe96.js');
37
37
  require('../Tab-bd0f3345.js');
@@ -39,8 +39,7 @@ require('../Tabs-cfc35dc0.js');
39
39
  require('../Tooltip-f4f9ab8f.js');
40
40
  require('../MultiSelect-5b008b32.js');
41
41
  require('../Radio-0594409d.js');
42
- require('../TextArea-6003c382.js');
43
- require('../TextInput-c656bf03.js');
42
+ require('../TextArea-96e5e095.js');
44
43
  require('../Switch-cd165c8c.js');
45
44
  require('../warning-circle-24522402.js');
46
45
 
@@ -1,42 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
-
5
- var toFnRef = function toFnRef(ref) {
6
- return !ref || typeof ref === 'function' ? ref : function (value) {
7
- ref.current = value;
8
- };
9
- };
10
-
11
- function mergeRefs(refA, refB) {
12
- var a = toFnRef(refA);
13
- var b = toFnRef(refB);
14
- return function (value) {
15
- if (a) a(value);
16
- if (b) b(value);
17
- };
18
- }
19
- /**
20
- * Create and returns a single callback ref composed from two other Refs.
21
- *
22
- * ```tsx
23
- * const Button = React.forwardRef((props, ref) => {
24
- * const [element, attachRef] = useCallbackRef<HTMLButtonElement>();
25
- * const mergedRef = useMergedRefs(ref, attachRef);
26
- *
27
- * return <button ref={mergedRef} {...props}/>
28
- * })
29
- * ```
30
- *
31
- * @param refA A Callback or mutable Ref
32
- * @param refB A Callback or mutable Ref
33
- * @category refs
34
- */
35
-
36
- function useMergedRefs(refA, refB) {
37
- return React.useMemo(function () {
38
- return mergeRefs(refA, refB);
39
- }, [refA, refB]);
40
- }
41
-
42
- exports.useMergedRefs = useMergedRefs;