@salutejs/plasma-new-hope 0.190.0-canary.1538.11794569428.0 → 0.190.0-canary.1552.11794692529.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Combobox/ComboboxNew/Combobox.css +2 -0
- package/cjs/components/Combobox/ComboboxNew/Combobox.js +31 -6
- package/cjs/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/ui/Form/Form.css +1 -0
- package/cjs/components/Combobox/ComboboxNew/ui/Form/Form.js +37 -0
- package/cjs/components/Combobox/ComboboxNew/ui/Form/Form.js.map +1 -0
- package/cjs/components/Combobox/ComboboxNew/ui/Form/Form.styles.js +15 -0
- package/cjs/components/Combobox/ComboboxNew/ui/Form/Form.styles.js.map +1 -0
- package/cjs/components/Combobox/ComboboxNew/ui/Form/Form.styles_22v2s5.css +1 -0
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/Inner.css +2 -0
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.css +2 -0
- package/cjs/components/Dropdown/Dropdown.js +4 -6
- package/cjs/components/Dropdown/Dropdown.js.map +1 -1
- package/cjs/index.css +2 -0
- package/cjs/utils/syntheticEvent.js +55 -0
- package/cjs/utils/syntheticEvent.js.map +1 -0
- package/emotion/cjs/components/Combobox/ComboboxNew/Combobox.js +32 -7
- package/emotion/cjs/components/Combobox/ComboboxNew/ui/Form/Form.js +38 -0
- package/emotion/cjs/components/Combobox/ComboboxNew/ui/Form/Form.styles.js +13 -0
- package/emotion/cjs/components/Dropdown/Dropdown.js +4 -6
- package/emotion/cjs/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
- package/emotion/cjs/examples/plasma_b2c/components/Dropdown/Dropdown.stories.tsx +0 -9
- package/emotion/cjs/examples/plasma_web/components/Dropdown/Dropdown.stories.tsx +0 -9
- package/emotion/cjs/utils/syntheticEvent.js +53 -0
- package/emotion/es/components/Combobox/ComboboxNew/Combobox.js +33 -7
- package/emotion/es/components/Combobox/ComboboxNew/ui/Form/Form.js +29 -0
- package/emotion/es/components/Combobox/ComboboxNew/ui/Form/Form.styles.js +6 -0
- package/emotion/es/components/Dropdown/Dropdown.js +4 -6
- package/emotion/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
- package/emotion/es/examples/plasma_b2c/components/Dropdown/Dropdown.stories.tsx +0 -9
- package/emotion/es/examples/plasma_web/components/Dropdown/Dropdown.stories.tsx +0 -9
- package/emotion/es/utils/syntheticEvent.js +47 -0
- package/es/components/Combobox/ComboboxNew/Combobox.css +2 -0
- package/es/components/Combobox/ComboboxNew/Combobox.js +33 -8
- package/es/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/es/components/Combobox/ComboboxNew/ui/Form/Form.css +1 -0
- package/es/components/Combobox/ComboboxNew/ui/Form/Form.js +33 -0
- package/es/components/Combobox/ComboboxNew/ui/Form/Form.js.map +1 -0
- package/es/components/Combobox/ComboboxNew/ui/Form/Form.styles.js +11 -0
- package/es/components/Combobox/ComboboxNew/ui/Form/Form.styles.js.map +1 -0
- package/es/components/Combobox/ComboboxNew/ui/Form/Form.styles_22v2s5.css +1 -0
- package/es/components/Combobox/ComboboxNew/ui/Inner/Inner.css +2 -0
- package/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.css +2 -0
- package/es/components/Dropdown/Dropdown.js +4 -6
- package/es/components/Dropdown/Dropdown.js.map +1 -1
- package/es/index.css +2 -0
- package/es/utils/syntheticEvent.js +50 -0
- package/es/utils/syntheticEvent.js.map +1 -0
- package/package.json +2 -2
- package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.js +32 -7
- package/styled-components/cjs/components/Combobox/ComboboxNew/ui/Form/Form.js +38 -0
- package/styled-components/cjs/components/Combobox/ComboboxNew/ui/Form/Form.styles.js +12 -0
- package/styled-components/cjs/components/Dropdown/Dropdown.js +4 -6
- package/styled-components/cjs/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Dropdown/Dropdown.stories.tsx +0 -9
- package/styled-components/cjs/examples/plasma_web/components/Dropdown/Dropdown.stories.tsx +0 -9
- package/styled-components/cjs/utils/syntheticEvent.js +53 -0
- package/styled-components/es/components/Combobox/ComboboxNew/Combobox.js +33 -7
- package/styled-components/es/components/Combobox/ComboboxNew/ui/Form/Form.js +29 -0
- package/styled-components/es/components/Combobox/ComboboxNew/ui/Form/Form.styles.js +5 -0
- package/styled-components/es/components/Dropdown/Dropdown.js +4 -6
- package/styled-components/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
- package/styled-components/es/examples/plasma_b2c/components/Dropdown/Dropdown.stories.tsx +0 -9
- package/styled-components/es/examples/plasma_web/components/Dropdown/Dropdown.stories.tsx +0 -9
- package/styled-components/es/utils/syntheticEvent.js +47 -0
- package/types/components/Combobox/ComboboxNew/Combobox.d.ts +2 -2
- package/types/components/Combobox/ComboboxNew/Combobox.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts +24 -2
- package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/ui/Form/Form.d.ts +6 -0
- package/types/components/Combobox/ComboboxNew/ui/Form/Form.d.ts.map +1 -0
- package/types/components/Combobox/ComboboxNew/ui/Form/Form.styles.d.ts +3 -0
- package/types/components/Combobox/ComboboxNew/ui/Form/Form.styles.d.ts.map +1 -0
- package/types/components/Dropdown/Dropdown.d.ts.map +1 -1
- package/types/components/Dropdown/Dropdown.types.d.ts +0 -4
- package/types/components/Dropdown/Dropdown.types.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Combobox/Combobox.d.ts +1076 -116
- package/types/examples/plasma_b2c/components/Combobox/Combobox.d.ts.map +1 -1
- package/types/examples/plasma_web/components/Combobox/Combobox.d.ts +1076 -116
- package/types/examples/plasma_web/components/Combobox/Combobox.d.ts.map +1 -1
- package/types/utils/syntheticEvent.d.ts +4 -0
- package/types/utils/syntheticEvent.d.ts.map +1 -0
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"syntheticEvent.js","sources":["../../src/utils/syntheticEvent.ts"],"sourcesContent":["import { RefObject } from 'react';\n\nexport const createEvent = <T extends HTMLSelectElement | HTMLInputElement | HTMLTextAreaElement>(\n ref: RefObject<T>,\n) => {\n if (ref.current) {\n const event = new Event('change', { bubbles: true });\n Object.defineProperty(event, 'target', { writable: false, value: ref.current });\n const syntheticEvent = createSyntheticEvent(event) as React.ChangeEvent<typeof ref.current>;\n return syntheticEvent;\n }\n\n return null;\n};\n\nexport const createSyntheticEvent = <T extends Element, E extends Event>(event: E): React.SyntheticEvent<T, E> => {\n let isDefaultPrevented = false;\n let isPropagationStopped = false;\n const preventDefault = () => {\n isDefaultPrevented = true;\n event.preventDefault();\n };\n const stopPropagation = () => {\n isPropagationStopped = true;\n event.stopPropagation();\n };\n return {\n nativeEvent: event,\n currentTarget: event.currentTarget as EventTarget & T,\n target: event.target as EventTarget & T,\n bubbles: event.bubbles,\n cancelable: event.cancelable,\n defaultPrevented: event.defaultPrevented,\n eventPhase: event.eventPhase,\n isTrusted: event.isTrusted,\n preventDefault,\n isDefaultPrevented: () => isDefaultPrevented,\n stopPropagation,\n isPropagationStopped: () => isPropagationStopped,\n persist: () => {},\n timeStamp: event.timeStamp,\n type: event.type,\n };\n};\n"],"names":["createEvent","ref","current","event","Event","bubbles","Object","defineProperty","writable","value","syntheticEvent","createSyntheticEvent","isDefaultPrevented","isPropagationStopped","preventDefault","stopPropagation","nativeEvent","currentTarget","target","cancelable","defaultPrevented","eventPhase","isTrusted","persist","timeStamp","type"],"mappings":";;;;IAEaA,WAAW,GAAG,SAAdA,WAAWA,CACpBC,GAAiB,EAChB;EACD,IAAIA,GAAG,CAACC,OAAO,EAAE;AACb,IAAA,IAAMC,KAAK,GAAG,IAAIC,KAAK,CAAC,QAAQ,EAAE;AAAEC,MAAAA,OAAO,EAAE,IAAA;AAAK,KAAC,CAAC,CAAA;AACpDC,IAAAA,MAAM,CAACC,cAAc,CAACJ,KAAK,EAAE,QAAQ,EAAE;AAAEK,MAAAA,QAAQ,EAAE,KAAK;MAAEC,KAAK,EAAER,GAAG,CAACC,OAAAA;AAAQ,KAAC,CAAC,CAAA;AAC/E,IAAA,IAAMQ,cAAc,GAAGC,oBAAoB,CAACR,KAAK,CAA0C,CAAA;AAC3F,IAAA,OAAOO,cAAc,CAAA;AACzB,GAAA;AAEA,EAAA,OAAO,IAAI,CAAA;AACf,EAAC;IAEYC,oBAAoB,GAAG,SAAvBA,oBAAoBA,CAAwCR,KAAQ,EAAiC;EAC9G,IAAIS,mBAAkB,GAAG,KAAK,CAAA;EAC9B,IAAIC,qBAAoB,GAAG,KAAK,CAAA;AAChC,EAAA,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,GAAS;AACzBF,IAAAA,mBAAkB,GAAG,IAAI,CAAA;IACzBT,KAAK,CAACW,cAAc,EAAE,CAAA;GACzB,CAAA;AACD,EAAA,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,GAAS;AAC1BF,IAAAA,qBAAoB,GAAG,IAAI,CAAA;IAC3BV,KAAK,CAACY,eAAe,EAAE,CAAA;GAC1B,CAAA;EACD,OAAO;AACHC,IAAAA,WAAW,EAAEb,KAAK;IAClBc,aAAa,EAAEd,KAAK,CAACc,aAAgC;IACrDC,MAAM,EAAEf,KAAK,CAACe,MAAyB;IACvCb,OAAO,EAAEF,KAAK,CAACE,OAAO;IACtBc,UAAU,EAAEhB,KAAK,CAACgB,UAAU;IAC5BC,gBAAgB,EAAEjB,KAAK,CAACiB,gBAAgB;IACxCC,UAAU,EAAElB,KAAK,CAACkB,UAAU;IAC5BC,SAAS,EAAEnB,KAAK,CAACmB,SAAS;AAC1BR,IAAAA,cAAc,EAAdA,cAAc;IACdF,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;AAAA,MAAA,OAAMA,mBAAkB,CAAA;AAAA,KAAA;AAC5CG,IAAAA,eAAe,EAAfA,eAAe;IACfF,oBAAoB,EAAE,SAAAA,oBAAA,GAAA;AAAA,MAAA,OAAMA,qBAAoB,CAAA;AAAA,KAAA;AAChDU,IAAAA,OAAO,EAAE,SAAAA,OAAA,GAAM,EAAE;IACjBC,SAAS,EAAErB,KAAK,CAACqB,SAAS;IAC1BC,IAAI,EAAEtB,KAAK,CAACsB,IAAAA;GACf,CAAA;AACL;;;;;"}
|
@@ -1,6 +1,5 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
5
4
|
value: true
|
6
5
|
});
|
@@ -20,10 +19,12 @@ var _getPathMaps = /*#__PURE__*/require("./hooks/getPathMaps");
|
|
20
19
|
var _Combobox2 = /*#__PURE__*/require("./Combobox.styles");
|
21
20
|
var _base = /*#__PURE__*/require("./variations/_view/base");
|
22
21
|
var _base2 = /*#__PURE__*/require("./variations/_size/base");
|
23
|
-
var
|
22
|
+
var _Form = /*#__PURE__*/require("./ui/Form/Form");
|
23
|
+
var _excluded = ["name", "multiple", "value", "onChange", "defaultValue", "isTargetAmount", "targetAmount", "items", "placement", "label", "placeholder", "helperText", "contentLeft", "textBefore", "textAfter", "variant", "listOverflow", "listHeight", "listWidth", "portal", "renderItem", "view", "size", "labelPlacement", "readOnly", "disabled", "alwaysOpened", "filter", "closeAfterSelect", "renderValue"];
|
24
24
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
25
25
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
26
26
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
27
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
27
28
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
28
29
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
29
30
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
@@ -37,12 +38,15 @@ var Context = exports.Context = /*#__PURE__*/(0, _react.createContext)({});
|
|
37
38
|
/**
|
38
39
|
* Поле ввода с выпадающим списком и возможностью фильтрации и выбора элементов.
|
39
40
|
*/
|
41
|
+
|
40
42
|
var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
41
43
|
return /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
42
44
|
var _valueToItemMap$get, _valueToItemMap$get2, _getItemByFocused;
|
43
|
-
var
|
45
|
+
var name = props.name,
|
46
|
+
multiple = props.multiple,
|
44
47
|
outerValue = props.value,
|
45
48
|
outerOnChange = props.onChange,
|
49
|
+
defaultValue = props.defaultValue,
|
46
50
|
isTargetAmount = props.isTargetAmount,
|
47
51
|
targetAmount = props.targetAmount,
|
48
52
|
items = props.items,
|
@@ -151,9 +155,19 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
151
155
|
}, floatingPopoverRef);
|
152
156
|
var onChange = function onChange(newValue) {
|
153
157
|
if (outerOnChange) {
|
154
|
-
|
158
|
+
if (!name && !multiple && typeof newValue === 'string') {
|
159
|
+
outerOnChange(newValue);
|
160
|
+
}
|
161
|
+
if (!name && multiple && Array.isArray(newValue)) {
|
162
|
+
outerOnChange(newValue);
|
163
|
+
}
|
164
|
+
if (name && _typeof(newValue) === 'object' && !Array.isArray(newValue)) {
|
165
|
+
outerOnChange(newValue);
|
166
|
+
}
|
167
|
+
}
|
168
|
+
if (typeof newValue === 'string' || Array.isArray(newValue)) {
|
169
|
+
setInternalValue(newValue);
|
155
170
|
}
|
156
|
-
setInternalValue(newValue);
|
157
171
|
};
|
158
172
|
var handleClickArrow = function handleClickArrow() {
|
159
173
|
if (disabled || readOnly) {
|
@@ -342,13 +356,24 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
342
356
|
// Т.к. вначале нужно отфильтровать и провалидировать outerValue и результат положить в переменную.
|
343
357
|
// А переменную, содержащую сложные типы данных, нельзя помещать в deps.
|
344
358
|
}, [outerValue, internalValue, items]);
|
359
|
+
(0, _react.useEffect)(function () {
|
360
|
+
if (defaultValue) {
|
361
|
+
setInternalValue(defaultValue);
|
362
|
+
}
|
363
|
+
}, [defaultValue]);
|
345
364
|
return /*#__PURE__*/_react["default"].createElement(Root, {
|
346
365
|
size: size,
|
347
366
|
view: view,
|
348
367
|
labelPlacement: labelPlacement,
|
349
368
|
disabled: disabled,
|
350
369
|
readOnly: readOnly
|
351
|
-
},
|
370
|
+
}, name && /*#__PURE__*/_react["default"].createElement(_Form.Form, {
|
371
|
+
name: name,
|
372
|
+
value: internalValue,
|
373
|
+
multiple: multiple,
|
374
|
+
onChange: onChange,
|
375
|
+
ref: ref
|
376
|
+
}), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(Context.Provider, {
|
352
377
|
value: {
|
353
378
|
focusedPath: focusedPath,
|
354
379
|
checked: checked,
|
@@ -372,7 +397,7 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
372
397
|
listWidth: listWidth,
|
373
398
|
target: function target(referenceRef) {
|
374
399
|
return /*#__PURE__*/_react["default"].createElement(_ui.StyledTextField, _extends({
|
375
|
-
ref: inputForkRef,
|
400
|
+
ref: name ? inputRef : inputForkRef,
|
376
401
|
inputWrapperRef: referenceRef,
|
377
402
|
value: textValue,
|
378
403
|
onChange: handleTextValueChange,
|
@@ -0,0 +1,38 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
5
|
+
value: true
|
6
|
+
});
|
7
|
+
exports.Form = void 0;
|
8
|
+
var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
|
9
|
+
var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
|
10
|
+
var _syntheticEvent = /*#__PURE__*/require("../../../../../utils/syntheticEvent");
|
11
|
+
var _Form = /*#__PURE__*/require("./Form.styles");
|
12
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
13
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
14
|
+
var Form = exports.Form = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
15
|
+
var name = _ref.name,
|
16
|
+
multiple = _ref.multiple,
|
17
|
+
value = _ref.value,
|
18
|
+
onChange = _ref.onChange;
|
19
|
+
var values = multiple ? value : [value];
|
20
|
+
var selectRef = (0, _react.useRef)(null);
|
21
|
+
var forkRef = (0, _plasmaCore.useForkRef)(selectRef, ref);
|
22
|
+
(0, _react.useEffect)(function () {
|
23
|
+
var event = (0, _syntheticEvent.createEvent)(selectRef);
|
24
|
+
onChange && onChange(event);
|
25
|
+
}, [values]);
|
26
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Form.SelectHidden, {
|
27
|
+
ref: forkRef,
|
28
|
+
multiple: multiple,
|
29
|
+
name: name,
|
30
|
+
hidden: true,
|
31
|
+
value: multiple ? values : values[0]
|
32
|
+
}, values.map(function (v) {
|
33
|
+
return /*#__PURE__*/_react["default"].createElement("option", {
|
34
|
+
key: v,
|
35
|
+
value: v
|
36
|
+
}, v);
|
37
|
+
})));
|
38
|
+
});
|
@@ -0,0 +1,13 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.SelectHidden = void 0;
|
7
|
+
var _base = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("@emotion/styled/base"));
|
8
|
+
var _mixins = /*#__PURE__*/require("../../../../../mixins");
|
9
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
10
|
+
var SelectHidden = exports.SelectHidden = /*#__PURE__*/(0, _base["default"])("select", {
|
11
|
+
target: "e10p9ksh0",
|
12
|
+
label: "plasma-new-hope__SelectHidden"
|
13
|
+
})( /*#__PURE__*/(0, _mixins.applyHidden)(), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29tYm9ib3gvQ29tYm9ib3hOZXcvdWkvRm9ybS9Gb3JtLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJeUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vLi4vLi4vLi4vc3JjLWVtb3Rpb24vY29tcG9uZW50cy9Db21ib2JveC9Db21ib2JveE5ldy91aS9Gb3JtL0Zvcm0uc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQgeyBhcHBseUhpZGRlbiB9IGZyb20gJy4uLy4uLy4uLy4uLy4uL21peGlucyc7XG5cbmV4cG9ydCBjb25zdCBTZWxlY3RIaWRkZW4gPSBzdHlsZWQuc2VsZWN0YFxuICAgICR7YXBwbHlIaWRkZW4oKX07XG5gO1xuIl19 */"));
|
@@ -20,7 +20,7 @@ var _Dropdown2 = /*#__PURE__*/require("./Dropdown.tokens");
|
|
20
20
|
var _useKeyboardNavigation = /*#__PURE__*/require("./hooks/useKeyboardNavigation");
|
21
21
|
var _useHashMaps3 = /*#__PURE__*/require("./hooks/useHashMaps");
|
22
22
|
var _FloatingPopover = /*#__PURE__*/require("./FloatingPopover");
|
23
|
-
var _excluded = ["items", "children", "placement", "offset", "closeOnOverlayClick", "onToggle", "size", "view", "itemRole", "className", "listWidth", "listHeight", "listOverflow", "closeOnSelect", "onHover", "onItemSelect", "onItemClick", "trigger", "variant", "hasArrow", "
|
23
|
+
var _excluded = ["items", "children", "placement", "offset", "closeOnOverlayClick", "onToggle", "size", "view", "itemRole", "className", "listWidth", "listHeight", "listOverflow", "closeOnSelect", "onHover", "onItemSelect", "onItemClick", "trigger", "variant", "hasArrow", "portal"];
|
24
24
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
25
25
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
26
26
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
@@ -66,8 +66,6 @@ var dropdownRoot = exports.dropdownRoot = function dropdownRoot(Root) {
|
|
66
66
|
variant = _ref$variant === void 0 ? 'normal' : _ref$variant,
|
67
67
|
_ref$hasArrow = _ref.hasArrow,
|
68
68
|
hasArrow = _ref$hasArrow === void 0 ? true : _ref$hasArrow,
|
69
|
-
_ref$alwaysOpened = _ref.alwaysOpened,
|
70
|
-
alwaysOpened = _ref$alwaysOpened === void 0 ? false : _ref$alwaysOpened,
|
71
69
|
portal = _ref.portal,
|
72
70
|
rest = _objectWithoutProperties(_ref, _excluded);
|
73
71
|
var _useReducer = (0, _react.useReducer)(_pathReducer.pathReducer, []),
|
@@ -88,7 +86,7 @@ var dropdownRoot = exports.dropdownRoot = function dropdownRoot(Root) {
|
|
88
86
|
|
89
87
|
// Логика работы при клике за пределами выпадающего списка
|
90
88
|
var targetRef = (0, _hooks.useOutsideClick)(function (event) {
|
91
|
-
if (!isCurrentListOpen || !closeOnOverlayClick
|
89
|
+
if (!isCurrentListOpen || !closeOnOverlayClick) {
|
92
90
|
return;
|
93
91
|
}
|
94
92
|
dispatchPath({
|
@@ -102,7 +100,7 @@ var dropdownRoot = exports.dropdownRoot = function dropdownRoot(Root) {
|
|
102
100
|
}
|
103
101
|
}, floatingPopoverRef);
|
104
102
|
var handleGlobalToggle = function handleGlobalToggle(opened, event) {
|
105
|
-
if (
|
103
|
+
if (opened) {
|
106
104
|
dispatchPath({
|
107
105
|
type: 'opened_first_level'
|
108
106
|
});
|
@@ -131,7 +129,7 @@ var dropdownRoot = exports.dropdownRoot = function dropdownRoot(Root) {
|
|
131
129
|
onItemClick: onItemClick
|
132
130
|
}),
|
133
131
|
onKeyDown = _useKeyNavigation.onKeyDown;
|
134
|
-
var isCurrentListOpen =
|
132
|
+
var isCurrentListOpen = Boolean(path[0]);
|
135
133
|
return /*#__PURE__*/_react["default"].createElement(Context.Provider, {
|
136
134
|
value: {
|
137
135
|
focusedPath: focusedPath,
|
@@ -353,11 +353,11 @@ const items = [
|
|
353
353
|
|
354
354
|
const SingleStory = (args: StorySelectProps) => {
|
355
355
|
const [value, setValue] = useState('');
|
356
|
-
|
357
356
|
return (
|
358
357
|
<div style={{ width: '400px' }}>
|
359
358
|
<Combobox
|
360
359
|
{...args}
|
360
|
+
name="mau"
|
361
361
|
items={items}
|
362
362
|
value={value}
|
363
363
|
onChange={setValue}
|
@@ -45,14 +45,6 @@ const meta: Meta<StoryDropdownProps> = {
|
|
45
45
|
type: 'select',
|
46
46
|
},
|
47
47
|
},
|
48
|
-
closeOnOverlayClick: {
|
49
|
-
control: { type: 'boolean' },
|
50
|
-
if: { arg: 'alwaysOpened', truthy: false },
|
51
|
-
},
|
52
|
-
closeOnSelect: {
|
53
|
-
control: { type: 'boolean' },
|
54
|
-
if: { arg: 'alwaysOpened', truthy: false },
|
55
|
-
},
|
56
48
|
},
|
57
49
|
args: {
|
58
50
|
size: 'm',
|
@@ -62,7 +54,6 @@ const meta: Meta<StoryDropdownProps> = {
|
|
62
54
|
offset: [0, 0],
|
63
55
|
listWidth: '',
|
64
56
|
hasArrow: true,
|
65
|
-
alwaysOpened: false,
|
66
57
|
closeOnOverlayClick: true,
|
67
58
|
closeOnSelect: true,
|
68
59
|
},
|
@@ -45,14 +45,6 @@ const meta: Meta<StoryDropdownProps> = {
|
|
45
45
|
type: 'select',
|
46
46
|
},
|
47
47
|
},
|
48
|
-
closeOnOverlayClick: {
|
49
|
-
control: { type: 'boolean' },
|
50
|
-
if: { arg: 'alwaysOpened', truthy: false },
|
51
|
-
},
|
52
|
-
closeOnSelect: {
|
53
|
-
control: { type: 'boolean' },
|
54
|
-
if: { arg: 'alwaysOpened', truthy: false },
|
55
|
-
},
|
56
48
|
},
|
57
49
|
args: {
|
58
50
|
size: 'm',
|
@@ -62,7 +54,6 @@ const meta: Meta<StoryDropdownProps> = {
|
|
62
54
|
offset: [0, 0],
|
63
55
|
listWidth: '',
|
64
56
|
hasArrow: true,
|
65
|
-
alwaysOpened: false,
|
66
57
|
closeOnOverlayClick: true,
|
67
58
|
closeOnSelect: true,
|
68
59
|
},
|
@@ -0,0 +1,53 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.createSyntheticEvent = exports.createEvent = void 0;
|
7
|
+
var createEvent = exports.createEvent = function createEvent(ref) {
|
8
|
+
if (ref.current) {
|
9
|
+
var event = new Event('change', {
|
10
|
+
bubbles: true
|
11
|
+
});
|
12
|
+
Object.defineProperty(event, 'target', {
|
13
|
+
writable: false,
|
14
|
+
value: ref.current
|
15
|
+
});
|
16
|
+
var syntheticEvent = createSyntheticEvent(event);
|
17
|
+
return syntheticEvent;
|
18
|
+
}
|
19
|
+
return null;
|
20
|
+
};
|
21
|
+
var createSyntheticEvent = exports.createSyntheticEvent = function createSyntheticEvent(event) {
|
22
|
+
var _isDefaultPrevented = false;
|
23
|
+
var _isPropagationStopped = false;
|
24
|
+
var preventDefault = function preventDefault() {
|
25
|
+
_isDefaultPrevented = true;
|
26
|
+
event.preventDefault();
|
27
|
+
};
|
28
|
+
var stopPropagation = function stopPropagation() {
|
29
|
+
_isPropagationStopped = true;
|
30
|
+
event.stopPropagation();
|
31
|
+
};
|
32
|
+
return {
|
33
|
+
nativeEvent: event,
|
34
|
+
currentTarget: event.currentTarget,
|
35
|
+
target: event.target,
|
36
|
+
bubbles: event.bubbles,
|
37
|
+
cancelable: event.cancelable,
|
38
|
+
defaultPrevented: event.defaultPrevented,
|
39
|
+
eventPhase: event.eventPhase,
|
40
|
+
isTrusted: event.isTrusted,
|
41
|
+
preventDefault: preventDefault,
|
42
|
+
isDefaultPrevented: function isDefaultPrevented() {
|
43
|
+
return _isDefaultPrevented;
|
44
|
+
},
|
45
|
+
stopPropagation: stopPropagation,
|
46
|
+
isPropagationStopped: function isPropagationStopped() {
|
47
|
+
return _isPropagationStopped;
|
48
|
+
},
|
49
|
+
persist: function persist() {},
|
50
|
+
timeStamp: event.timeStamp,
|
51
|
+
type: event.type
|
52
|
+
};
|
53
|
+
};
|
@@ -1,5 +1,6 @@
|
|
1
|
-
var _excluded = ["multiple", "value", "onChange", "isTargetAmount", "targetAmount", "items", "placement", "label", "placeholder", "helperText", "contentLeft", "textBefore", "textAfter", "variant", "listOverflow", "listHeight", "listWidth", "portal", "renderItem", "view", "size", "labelPlacement", "readOnly", "disabled", "alwaysOpened", "filter", "closeAfterSelect", "renderValue"];
|
1
|
+
var _excluded = ["name", "multiple", "value", "onChange", "defaultValue", "isTargetAmount", "targetAmount", "items", "placement", "label", "placeholder", "helperText", "contentLeft", "textBefore", "textAfter", "variant", "listOverflow", "listHeight", "listWidth", "portal", "renderItem", "view", "size", "labelPlacement", "readOnly", "disabled", "alwaysOpened", "filter", "closeAfterSelect", "renderValue"];
|
2
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
3
4
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
4
5
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
5
6
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
@@ -8,7 +9,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
|
|
8
9
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
9
10
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
10
11
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
11
|
-
import React, { forwardRef, useState, useReducer, useMemo, createContext, useLayoutEffect, useRef } from 'react';
|
12
|
+
import React, { forwardRef, useState, useReducer, useMemo, createContext, useLayoutEffect, useRef, useEffect } from 'react';
|
12
13
|
import { safeUseId, useForkRef } from '@salutejs/plasma-core';
|
13
14
|
import { isEmpty } from '../../../utils';
|
14
15
|
import { useOutsideClick } from '../../../hooks';
|
@@ -23,17 +24,21 @@ import { getPathMap, getTreeMaps } from './hooks/getPathMaps';
|
|
23
24
|
import { Ul, base, StyledArrow, IconArrowWrapper, StyledEmptyState } from './Combobox.styles';
|
24
25
|
import { base as viewCSS } from './variations/_view/base';
|
25
26
|
import { base as sizeCSS } from './variations/_size/base';
|
27
|
+
import { Form } from './ui/Form/Form';
|
26
28
|
export var Context = /*#__PURE__*/createContext({});
|
27
29
|
|
28
30
|
/**
|
29
31
|
* Поле ввода с выпадающим списком и возможностью фильтрации и выбора элементов.
|
30
32
|
*/
|
33
|
+
|
31
34
|
export var comboboxRoot = function comboboxRoot(Root) {
|
32
35
|
return /*#__PURE__*/forwardRef(function (props, ref) {
|
33
36
|
var _valueToItemMap$get, _valueToItemMap$get2, _getItemByFocused;
|
34
|
-
var
|
37
|
+
var name = props.name,
|
38
|
+
multiple = props.multiple,
|
35
39
|
outerValue = props.value,
|
36
40
|
outerOnChange = props.onChange,
|
41
|
+
defaultValue = props.defaultValue,
|
37
42
|
isTargetAmount = props.isTargetAmount,
|
38
43
|
targetAmount = props.targetAmount,
|
39
44
|
items = props.items,
|
@@ -142,9 +147,19 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
142
147
|
}, floatingPopoverRef);
|
143
148
|
var onChange = function onChange(newValue) {
|
144
149
|
if (outerOnChange) {
|
145
|
-
|
150
|
+
if (!name && !multiple && typeof newValue === 'string') {
|
151
|
+
outerOnChange(newValue);
|
152
|
+
}
|
153
|
+
if (!name && multiple && Array.isArray(newValue)) {
|
154
|
+
outerOnChange(newValue);
|
155
|
+
}
|
156
|
+
if (name && _typeof(newValue) === 'object' && !Array.isArray(newValue)) {
|
157
|
+
outerOnChange(newValue);
|
158
|
+
}
|
159
|
+
}
|
160
|
+
if (typeof newValue === 'string' || Array.isArray(newValue)) {
|
161
|
+
setInternalValue(newValue);
|
146
162
|
}
|
147
|
-
setInternalValue(newValue);
|
148
163
|
};
|
149
164
|
var handleClickArrow = function handleClickArrow() {
|
150
165
|
if (disabled || readOnly) {
|
@@ -333,13 +348,24 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
333
348
|
// Т.к. вначале нужно отфильтровать и провалидировать outerValue и результат положить в переменную.
|
334
349
|
// А переменную, содержащую сложные типы данных, нельзя помещать в deps.
|
335
350
|
}, [outerValue, internalValue, items]);
|
351
|
+
useEffect(function () {
|
352
|
+
if (defaultValue) {
|
353
|
+
setInternalValue(defaultValue);
|
354
|
+
}
|
355
|
+
}, [defaultValue]);
|
336
356
|
return /*#__PURE__*/React.createElement(Root, {
|
337
357
|
size: size,
|
338
358
|
view: view,
|
339
359
|
labelPlacement: labelPlacement,
|
340
360
|
disabled: disabled,
|
341
361
|
readOnly: readOnly
|
342
|
-
},
|
362
|
+
}, name && /*#__PURE__*/React.createElement(Form, {
|
363
|
+
name: name,
|
364
|
+
value: internalValue,
|
365
|
+
multiple: multiple,
|
366
|
+
onChange: onChange,
|
367
|
+
ref: ref
|
368
|
+
}), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Context.Provider, {
|
343
369
|
value: {
|
344
370
|
focusedPath: focusedPath,
|
345
371
|
checked: checked,
|
@@ -363,7 +389,7 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
363
389
|
listWidth: listWidth,
|
364
390
|
target: function target(referenceRef) {
|
365
391
|
return /*#__PURE__*/React.createElement(StyledTextField, _extends({
|
366
|
-
ref: inputForkRef,
|
392
|
+
ref: name ? inputRef : inputForkRef,
|
367
393
|
inputWrapperRef: referenceRef,
|
368
394
|
value: textValue,
|
369
395
|
onChange: handleTextValueChange,
|
@@ -0,0 +1,29 @@
|
|
1
|
+
import React, { forwardRef, useEffect, useRef } from 'react';
|
2
|
+
import { useForkRef } from '@salutejs/plasma-core';
|
3
|
+
import { createEvent } from '../../../../../utils/syntheticEvent';
|
4
|
+
import { SelectHidden } from './Form.styles';
|
5
|
+
export var Form = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
6
|
+
var name = _ref.name,
|
7
|
+
multiple = _ref.multiple,
|
8
|
+
value = _ref.value,
|
9
|
+
onChange = _ref.onChange;
|
10
|
+
var values = multiple ? value : [value];
|
11
|
+
var selectRef = useRef(null);
|
12
|
+
var forkRef = useForkRef(selectRef, ref);
|
13
|
+
useEffect(function () {
|
14
|
+
var event = createEvent(selectRef);
|
15
|
+
onChange && onChange(event);
|
16
|
+
}, [values]);
|
17
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SelectHidden, {
|
18
|
+
ref: forkRef,
|
19
|
+
multiple: multiple,
|
20
|
+
name: name,
|
21
|
+
hidden: true,
|
22
|
+
value: multiple ? values : values[0]
|
23
|
+
}, values.map(function (v) {
|
24
|
+
return /*#__PURE__*/React.createElement("option", {
|
25
|
+
key: v,
|
26
|
+
value: v
|
27
|
+
}, v);
|
28
|
+
})));
|
29
|
+
});
|
@@ -0,0 +1,6 @@
|
|
1
|
+
import _styled from "@emotion/styled/base";
|
2
|
+
import { applyHidden } from '../../../../../mixins';
|
3
|
+
export var SelectHidden = /*#__PURE__*/_styled("select", {
|
4
|
+
target: "e10p9ksh0",
|
5
|
+
label: "plasma-new-hope__SelectHidden"
|
6
|
+
})( /*#__PURE__*/applyHidden(), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQ29tYm9ib3gvQ29tYm9ib3hOZXcvdWkvRm9ybS9Gb3JtLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJeUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vLi4vLi4vLi4vc3JjLWVtb3Rpb24vY29tcG9uZW50cy9Db21ib2JveC9Db21ib2JveE5ldy91aS9Gb3JtL0Zvcm0uc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQgeyBhcHBseUhpZGRlbiB9IGZyb20gJy4uLy4uLy4uLy4uLy4uL21peGlucyc7XG5cbmV4cG9ydCBjb25zdCBTZWxlY3RIaWRkZW4gPSBzdHlsZWQuc2VsZWN0YFxuICAgICR7YXBwbHlIaWRkZW4oKX07XG5gO1xuIl19 */"));
|
@@ -1,4 +1,4 @@
|
|
1
|
-
var _excluded = ["items", "children", "placement", "offset", "closeOnOverlayClick", "onToggle", "size", "view", "itemRole", "className", "listWidth", "listHeight", "listOverflow", "closeOnSelect", "onHover", "onItemSelect", "onItemClick", "trigger", "variant", "hasArrow", "
|
1
|
+
var _excluded = ["items", "children", "placement", "offset", "closeOnOverlayClick", "onToggle", "size", "view", "itemRole", "className", "listWidth", "listHeight", "listOverflow", "closeOnSelect", "onHover", "onItemSelect", "onItemClick", "trigger", "variant", "hasArrow", "portal"];
|
2
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
3
3
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
4
4
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
@@ -57,8 +57,6 @@ export var dropdownRoot = function dropdownRoot(Root) {
|
|
57
57
|
variant = _ref$variant === void 0 ? 'normal' : _ref$variant,
|
58
58
|
_ref$hasArrow = _ref.hasArrow,
|
59
59
|
hasArrow = _ref$hasArrow === void 0 ? true : _ref$hasArrow,
|
60
|
-
_ref$alwaysOpened = _ref.alwaysOpened,
|
61
|
-
alwaysOpened = _ref$alwaysOpened === void 0 ? false : _ref$alwaysOpened,
|
62
60
|
portal = _ref.portal,
|
63
61
|
rest = _objectWithoutProperties(_ref, _excluded);
|
64
62
|
var _useReducer = useReducer(pathReducer, []),
|
@@ -79,7 +77,7 @@ export var dropdownRoot = function dropdownRoot(Root) {
|
|
79
77
|
|
80
78
|
// Логика работы при клике за пределами выпадающего списка
|
81
79
|
var targetRef = useOutsideClick(function (event) {
|
82
|
-
if (!isCurrentListOpen || !closeOnOverlayClick
|
80
|
+
if (!isCurrentListOpen || !closeOnOverlayClick) {
|
83
81
|
return;
|
84
82
|
}
|
85
83
|
dispatchPath({
|
@@ -93,7 +91,7 @@ export var dropdownRoot = function dropdownRoot(Root) {
|
|
93
91
|
}
|
94
92
|
}, floatingPopoverRef);
|
95
93
|
var handleGlobalToggle = function handleGlobalToggle(opened, event) {
|
96
|
-
if (
|
94
|
+
if (opened) {
|
97
95
|
dispatchPath({
|
98
96
|
type: 'opened_first_level'
|
99
97
|
});
|
@@ -122,7 +120,7 @@ export var dropdownRoot = function dropdownRoot(Root) {
|
|
122
120
|
onItemClick: onItemClick
|
123
121
|
}),
|
124
122
|
onKeyDown = _useKeyNavigation.onKeyDown;
|
125
|
-
var isCurrentListOpen =
|
123
|
+
var isCurrentListOpen = Boolean(path[0]);
|
126
124
|
return /*#__PURE__*/React.createElement(Context.Provider, {
|
127
125
|
value: {
|
128
126
|
focusedPath: focusedPath,
|
@@ -353,11 +353,11 @@ const items = [
|
|
353
353
|
|
354
354
|
const SingleStory = (args: StorySelectProps) => {
|
355
355
|
const [value, setValue] = useState('');
|
356
|
-
|
357
356
|
return (
|
358
357
|
<div style={{ width: '400px' }}>
|
359
358
|
<Combobox
|
360
359
|
{...args}
|
360
|
+
name="mau"
|
361
361
|
items={items}
|
362
362
|
value={value}
|
363
363
|
onChange={setValue}
|
@@ -45,14 +45,6 @@ const meta: Meta<StoryDropdownProps> = {
|
|
45
45
|
type: 'select',
|
46
46
|
},
|
47
47
|
},
|
48
|
-
closeOnOverlayClick: {
|
49
|
-
control: { type: 'boolean' },
|
50
|
-
if: { arg: 'alwaysOpened', truthy: false },
|
51
|
-
},
|
52
|
-
closeOnSelect: {
|
53
|
-
control: { type: 'boolean' },
|
54
|
-
if: { arg: 'alwaysOpened', truthy: false },
|
55
|
-
},
|
56
48
|
},
|
57
49
|
args: {
|
58
50
|
size: 'm',
|
@@ -62,7 +54,6 @@ const meta: Meta<StoryDropdownProps> = {
|
|
62
54
|
offset: [0, 0],
|
63
55
|
listWidth: '',
|
64
56
|
hasArrow: true,
|
65
|
-
alwaysOpened: false,
|
66
57
|
closeOnOverlayClick: true,
|
67
58
|
closeOnSelect: true,
|
68
59
|
},
|
@@ -45,14 +45,6 @@ const meta: Meta<StoryDropdownProps> = {
|
|
45
45
|
type: 'select',
|
46
46
|
},
|
47
47
|
},
|
48
|
-
closeOnOverlayClick: {
|
49
|
-
control: { type: 'boolean' },
|
50
|
-
if: { arg: 'alwaysOpened', truthy: false },
|
51
|
-
},
|
52
|
-
closeOnSelect: {
|
53
|
-
control: { type: 'boolean' },
|
54
|
-
if: { arg: 'alwaysOpened', truthy: false },
|
55
|
-
},
|
56
48
|
},
|
57
49
|
args: {
|
58
50
|
size: 'm',
|
@@ -62,7 +54,6 @@ const meta: Meta<StoryDropdownProps> = {
|
|
62
54
|
offset: [0, 0],
|
63
55
|
listWidth: '',
|
64
56
|
hasArrow: true,
|
65
|
-
alwaysOpened: false,
|
66
57
|
closeOnOverlayClick: true,
|
67
58
|
closeOnSelect: true,
|
68
59
|
},
|
@@ -0,0 +1,47 @@
|
|
1
|
+
export var createEvent = function createEvent(ref) {
|
2
|
+
if (ref.current) {
|
3
|
+
var event = new Event('change', {
|
4
|
+
bubbles: true
|
5
|
+
});
|
6
|
+
Object.defineProperty(event, 'target', {
|
7
|
+
writable: false,
|
8
|
+
value: ref.current
|
9
|
+
});
|
10
|
+
var syntheticEvent = createSyntheticEvent(event);
|
11
|
+
return syntheticEvent;
|
12
|
+
}
|
13
|
+
return null;
|
14
|
+
};
|
15
|
+
export var createSyntheticEvent = function createSyntheticEvent(event) {
|
16
|
+
var _isDefaultPrevented = false;
|
17
|
+
var _isPropagationStopped = false;
|
18
|
+
var preventDefault = function preventDefault() {
|
19
|
+
_isDefaultPrevented = true;
|
20
|
+
event.preventDefault();
|
21
|
+
};
|
22
|
+
var stopPropagation = function stopPropagation() {
|
23
|
+
_isPropagationStopped = true;
|
24
|
+
event.stopPropagation();
|
25
|
+
};
|
26
|
+
return {
|
27
|
+
nativeEvent: event,
|
28
|
+
currentTarget: event.currentTarget,
|
29
|
+
target: event.target,
|
30
|
+
bubbles: event.bubbles,
|
31
|
+
cancelable: event.cancelable,
|
32
|
+
defaultPrevented: event.defaultPrevented,
|
33
|
+
eventPhase: event.eventPhase,
|
34
|
+
isTrusted: event.isTrusted,
|
35
|
+
preventDefault: preventDefault,
|
36
|
+
isDefaultPrevented: function isDefaultPrevented() {
|
37
|
+
return _isDefaultPrevented;
|
38
|
+
},
|
39
|
+
stopPropagation: stopPropagation,
|
40
|
+
isPropagationStopped: function isPropagationStopped() {
|
41
|
+
return _isPropagationStopped;
|
42
|
+
},
|
43
|
+
persist: function persist() {},
|
44
|
+
timeStamp: event.timeStamp,
|
45
|
+
type: event.type
|
46
|
+
};
|
47
|
+
};
|
@@ -157,3 +157,5 @@
|
|
157
157
|
|
158
158
|
|
159
159
|
.Combobox_styles_18a8p75_s11cn92k__ba048029{--plasma-emptystate-border-radius:var(--plasma-combobox-new-textfield-border-radius);--plasma-emptystate-padding:var(--plasma-combobox-new-empty-state-padding);--plasma-emptystate-font-family:var(--plasma-combobox-new-textfield-font-family);--plasma-emptystate-font-size:var(--plasma-combobox-new-textfield-font-size);--plasma-emptystate-font-style:var(--plasma-combobox-new-textfield-font-style);--plasma-emptystate-font-weight:var(--plasma-combobox-new-textfield-font-weight);--plasma-emptystate-font-letter-spacing:var(--plasma-combobox-new-textfield-letter-spacing);--plasma-emptystate-font-line-height:var(--plasma-combobox-new-textfield-line-height);}
|
160
|
+
|
161
|
+
.Form_styles_22v2s5_sngk5la__4621e773{visibility:hidden;width:0;height:0;opacity:0;margin:0;padding:0;border:none;}
|