@jobber/components 4.24.1 → 4.24.2
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.
|
@@ -1,9 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
import React from "react";
|
|
2
2
|
import { XOR } from "ts-xor";
|
|
3
3
|
import { GroupOption, Option } from "./Option";
|
|
4
|
+
import { InputTextRef } from "../InputText";
|
|
4
5
|
import { FormFieldProps } from "../FormField";
|
|
5
6
|
type OptionCollection = XOR<Option[], GroupOption[]>;
|
|
6
|
-
interface AutocompleteProps extends Pick<FormFieldProps, "
|
|
7
|
+
interface AutocompleteProps extends Pick<FormFieldProps, "invalid" | "name" | "onBlur" | "onFocus" | "prefix" | "size" | "suffix" | "validations"> {
|
|
8
|
+
/**
|
|
9
|
+
* @deprecated
|
|
10
|
+
* Use `ref` instead.
|
|
11
|
+
*/
|
|
12
|
+
readonly inputRef?: FormFieldProps["inputRef"];
|
|
7
13
|
/**
|
|
8
14
|
* Initial options to show when user first focuses the Autocomplete
|
|
9
15
|
*/
|
|
@@ -40,5 +46,5 @@ interface AutocompleteProps extends Pick<FormFieldProps, "inputRef" | "invalid"
|
|
|
40
46
|
*/
|
|
41
47
|
readonly placeholder: string;
|
|
42
48
|
}
|
|
43
|
-
export declare
|
|
49
|
+
export declare const Autocomplete: React.ForwardRefExoticComponent<AutocompleteProps & React.RefAttributes<InputTextRef>>;
|
|
44
50
|
export {};
|
|
@@ -13,7 +13,7 @@ var reactPopper = require('react-popper');
|
|
|
13
13
|
var Text = require('../Text-e7ed0974.js');
|
|
14
14
|
var Icon = require('../Icon-405a216c.js');
|
|
15
15
|
var Heading = require('../Heading-a1191b15.js');
|
|
16
|
-
var InputText = require('../InputText-
|
|
16
|
+
var InputText = require('../InputText-c66e199a.js');
|
|
17
17
|
require('../Typography-fd6f932a.js');
|
|
18
18
|
require('@jobber/design');
|
|
19
19
|
require('../FormField-090113ec.js');
|
|
@@ -147,7 +147,7 @@ function useRepositionMenu(attachTo, visible = false) {
|
|
|
147
147
|
|
|
148
148
|
// Max statements increased to make room for the debounce functions
|
|
149
149
|
/* eslint max-statements: ["error", 14] */
|
|
150
|
-
function
|
|
150
|
+
function AutocompleteInternal(_a, ref) {
|
|
151
151
|
var _b;
|
|
152
152
|
var { initialOptions = [], value, allowFreeForm = true, size = undefined, debounce: debounceRate = 300, onChange, getOptions, placeholder, onBlur, onFocus, validations } = _a, inputProps = tslib_es6.__rest(_a, ["initialOptions", "value", "allowFreeForm", "size", "debounce", "onChange", "getOptions", "placeholder", "onBlur", "onFocus", "validations"]);
|
|
153
153
|
const [options, setOptions] = React.useState(initialOptions);
|
|
@@ -164,7 +164,7 @@ function Autocomplete(_a) {
|
|
|
164
164
|
updateInput((_a = value === null || value === void 0 ? void 0 : value.label) !== null && _a !== void 0 ? _a : "");
|
|
165
165
|
}, [value]);
|
|
166
166
|
return (React__default["default"].createElement("div", { className: styles.autocomplete, ref: autocompleteRef },
|
|
167
|
-
React__default["default"].createElement(InputText.InputText, Object.assign({ autocomplete: false, size: size, value: inputText, onChange: handleInputChange, placeholder: placeholder, onFocus: handleInputFocus, onBlur: handleInputBlur, validations: validations }, inputProps)),
|
|
167
|
+
React__default["default"].createElement(InputText.InputText, Object.assign({ ref: ref, autocomplete: false, size: size, value: inputText, onChange: handleInputChange, placeholder: placeholder, onFocus: handleInputFocus, onBlur: handleInputBlur, validations: validations }, inputProps)),
|
|
168
168
|
menuVisible && (React__default["default"].createElement(Menu, { attachTo: autocompleteRef, visible: menuVisible && options.length > 0, options: options, selectedOption: value, onOptionSelect: handleMenuChange }))));
|
|
169
169
|
function updateInput(newText) {
|
|
170
170
|
setInputText(newText);
|
|
@@ -214,5 +214,6 @@ function mapToOptions(items) {
|
|
|
214
214
|
return result;
|
|
215
215
|
}, []);
|
|
216
216
|
}
|
|
217
|
+
const Autocomplete = React.forwardRef(AutocompleteInternal);
|
|
217
218
|
|
|
218
219
|
exports.Autocomplete = Autocomplete;
|
package/dist/InputText/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var InputText = require('../InputText-
|
|
5
|
+
var InputText = require('../InputText-c66e199a.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('../FormField-090113ec.js');
|
|
8
8
|
require('../tslib.es6-5b8768b7.js');
|
|
@@ -8,8 +8,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
8
8
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
9
9
|
|
|
10
10
|
function InputTextInternal(props, ref) {
|
|
11
|
-
const inputRef = React.
|
|
12
|
-
const actionsRef = React.
|
|
11
|
+
const inputRef = React.useRef(null);
|
|
12
|
+
const actionsRef = React.useRef(null);
|
|
13
13
|
const rowRange = getRowRange();
|
|
14
14
|
React.useImperativeHandle(ref, () => ({
|
|
15
15
|
insert: (text) => {
|
|
@@ -27,6 +27,12 @@ function InputTextInternal(props, ref) {
|
|
|
27
27
|
input.focus();
|
|
28
28
|
}
|
|
29
29
|
},
|
|
30
|
+
scrollIntoView: arg => {
|
|
31
|
+
const input = inputRef.current;
|
|
32
|
+
if (input) {
|
|
33
|
+
input.scrollIntoView(arg);
|
|
34
|
+
}
|
|
35
|
+
},
|
|
30
36
|
}));
|
|
31
37
|
React.useLayoutEffect(() => {
|
|
32
38
|
if (inputRef && inputRef.current instanceof HTMLTextAreaElement) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jobber/components",
|
|
3
|
-
"version": "4.24.
|
|
3
|
+
"version": "4.24.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -83,5 +83,5 @@
|
|
|
83
83
|
"> 1%",
|
|
84
84
|
"IE 10"
|
|
85
85
|
],
|
|
86
|
-
"gitHead": "
|
|
86
|
+
"gitHead": "2a7429f445c7d4af80b9706b05796d62bc810bc9"
|
|
87
87
|
}
|