@mw-kit/mw-ui 1.7.3 → 1.7.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.
- package/dist/components/Input/components/Select/hooks/Select/interfaces.d.ts +3 -9
- package/dist/components/Input/components/Select/hooks/SelectMultiple/interfaces.d.ts +3 -3
- package/dist/components/Input/components/Select/hooks/interfaces.d.ts +1 -0
- package/dist/components/Menu/interfaces.d.ts +2 -1
- package/dist/index.js +73 -27
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +73 -27
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,13 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { CommonContext, CommonOption, CommonProps } from '../interfaces';
|
|
3
3
|
export interface Option extends CommonOption {
|
|
4
|
-
onClick?: (index: number, data:
|
|
5
|
-
label: {
|
|
6
|
-
text: string;
|
|
7
|
-
element: ElementOrString;
|
|
8
|
-
};
|
|
9
|
-
value: string;
|
|
10
|
-
}) => void;
|
|
4
|
+
onClick?: (index: number, data: Option, event: React.MouseEvent) => void;
|
|
11
5
|
}
|
|
12
6
|
interface LoaderReturn {
|
|
13
7
|
options: Option[];
|
|
@@ -17,7 +11,7 @@ export declare type Loader = (search: string, page: number) => Promise<LoaderRet
|
|
|
17
11
|
export interface SelectProps extends CommonProps {
|
|
18
12
|
type: 'select';
|
|
19
13
|
name?: string;
|
|
20
|
-
setValue: (value: string) => void;
|
|
14
|
+
setValue: (value: string, option: CommonOption) => void;
|
|
21
15
|
value: string;
|
|
22
16
|
loader: Loader;
|
|
23
17
|
}
|
|
@@ -8,12 +8,12 @@ interface LoaderReturn {
|
|
|
8
8
|
export declare type Loader = (search: string, page: number) => Promise<LoaderReturn | Option[]>;
|
|
9
9
|
export interface SelectProps extends CommonProps {
|
|
10
10
|
type: 'select-multiple';
|
|
11
|
-
setValue: (value: string[]) => void;
|
|
12
|
-
value: string[];
|
|
11
|
+
setValue: (value: string[], options: Option[]) => void;
|
|
12
|
+
value: string[] | Option[];
|
|
13
13
|
selectAll?: boolean;
|
|
14
14
|
loader: Loader;
|
|
15
15
|
}
|
|
16
16
|
export interface ContextInterface extends CommonContext<SelectProps, Option> {
|
|
17
|
-
checked: [
|
|
17
|
+
checked: [Option[], React.Dispatch<React.SetStateAction<Option[]>>];
|
|
18
18
|
}
|
|
19
19
|
export {};
|
|
@@ -15,8 +15,9 @@ export interface Option {
|
|
|
15
15
|
delimiter?: boolean;
|
|
16
16
|
keepOpen?: boolean;
|
|
17
17
|
caret?: boolean;
|
|
18
|
-
onClick?: (index: number) => void;
|
|
18
|
+
onClick?: (index: number, option: Option, event: React.MouseEvent) => void;
|
|
19
19
|
rules?: Rule[];
|
|
20
|
+
data?: any;
|
|
20
21
|
}
|
|
21
22
|
export interface CommonProps extends Omit<AbsoluteContainerProps, 'children'> {
|
|
22
23
|
bordered?: boolean;
|
package/dist/index.js
CHANGED
|
@@ -12356,8 +12356,8 @@ var MenuComponent = function MenuComponent(props, ref) {
|
|
|
12356
12356
|
if (rule === undefined) {
|
|
12357
12357
|
var _onClick = option.onClick || function () {};
|
|
12358
12358
|
|
|
12359
|
-
onClick = function onClick() {
|
|
12360
|
-
_onClick(index);
|
|
12359
|
+
onClick = function onClick(e) {
|
|
12360
|
+
_onClick(index, option, e);
|
|
12361
12361
|
|
|
12362
12362
|
closeMenu();
|
|
12363
12363
|
};
|
|
@@ -13638,22 +13638,21 @@ var Header$1 = function Header() {
|
|
|
13638
13638
|
};
|
|
13639
13639
|
|
|
13640
13640
|
var getOptions = function getOptions(props, options) {
|
|
13641
|
-
return options.map(function (option
|
|
13641
|
+
return options.map(function (option) {
|
|
13642
13642
|
var label = isString(option.label) ? {
|
|
13643
13643
|
text: option.label,
|
|
13644
13644
|
element: option.label
|
|
13645
13645
|
} : option.label;
|
|
13646
13646
|
var value = option.value,
|
|
13647
|
-
onClick = option.onClick
|
|
13647
|
+
onClick = option.onClick,
|
|
13648
|
+
data = option.data;
|
|
13648
13649
|
return {
|
|
13649
13650
|
label: label,
|
|
13650
|
-
|
|
13651
|
-
|
|
13652
|
-
|
|
13653
|
-
value: value
|
|
13654
|
-
});
|
|
13651
|
+
data: data,
|
|
13652
|
+
onClick: onClick ? function (index, _option, event) {
|
|
13653
|
+
onClick(index, option, event);
|
|
13655
13654
|
} : function () {
|
|
13656
|
-
props.setValue(value);
|
|
13655
|
+
props.setValue(value, option);
|
|
13657
13656
|
}
|
|
13658
13657
|
};
|
|
13659
13658
|
});
|
|
@@ -13713,7 +13712,9 @@ var Footer$1 = function Footer() {
|
|
|
13713
13712
|
setOpen = context.setOpen;
|
|
13714
13713
|
|
|
13715
13714
|
var onClick = function onClick() {
|
|
13716
|
-
setValue(
|
|
13715
|
+
setValue(checked.map(function (c) {
|
|
13716
|
+
return c.value;
|
|
13717
|
+
}), [].concat(checked));
|
|
13717
13718
|
setOpen(false);
|
|
13718
13719
|
};
|
|
13719
13720
|
|
|
@@ -13759,9 +13760,7 @@ var Header$2 = function Header() {
|
|
|
13759
13760
|
|
|
13760
13761
|
var onClick = function onClick() {
|
|
13761
13762
|
setChecked(function (prev) {
|
|
13762
|
-
return prev.length === options.length ? [] :
|
|
13763
|
-
return option.value;
|
|
13764
|
-
});
|
|
13763
|
+
return prev.length === options.length ? [] : [].concat(options);
|
|
13765
13764
|
});
|
|
13766
13765
|
};
|
|
13767
13766
|
|
|
@@ -13800,7 +13799,9 @@ var getOptions$1 = function getOptions(options, checked, setChecked) {
|
|
|
13800
13799
|
text: label.text,
|
|
13801
13800
|
element: React__default.createElement(Checkbox, {
|
|
13802
13801
|
type: 'checkbox',
|
|
13803
|
-
checked: checked.
|
|
13802
|
+
checked: checked.findIndex(function (e) {
|
|
13803
|
+
return e.value === option.value;
|
|
13804
|
+
}) !== -1,
|
|
13804
13805
|
label: option.disabled && option.disabledText ? React__default.createElement(semanticUiReact.Popup, {
|
|
13805
13806
|
on: 'click',
|
|
13806
13807
|
trigger: React__default.createElement("div", null, label.element),
|
|
@@ -13814,9 +13815,9 @@ var getOptions$1 = function getOptions(options, checked, setChecked) {
|
|
|
13814
13815
|
var isChecked = event.target.checked;
|
|
13815
13816
|
setChecked(function (prev) {
|
|
13816
13817
|
var newState = prev.filter(function (v) {
|
|
13817
|
-
return v !== option.value;
|
|
13818
|
+
return v.value !== option.value;
|
|
13818
13819
|
});
|
|
13819
|
-
if (isChecked) newState.push(option
|
|
13820
|
+
if (isChecked) newState.push(_extends({}, option));
|
|
13820
13821
|
return newState;
|
|
13821
13822
|
});
|
|
13822
13823
|
},
|
|
@@ -13839,19 +13840,61 @@ var getInputValue$1 = function getInputValue(value) {
|
|
|
13839
13840
|
};
|
|
13840
13841
|
|
|
13841
13842
|
var useSelectMultiple = function useSelectMultiple(props) {
|
|
13843
|
+
var init = function init() {
|
|
13844
|
+
return props.value.length === 0 ? [] : typeof props.value[0] === 'string' ? [].concat(props.value).map(function (value) {
|
|
13845
|
+
return {
|
|
13846
|
+
value: value,
|
|
13847
|
+
label: value
|
|
13848
|
+
};
|
|
13849
|
+
}) : [].concat(props.value);
|
|
13850
|
+
};
|
|
13851
|
+
|
|
13842
13852
|
var _useState = React.useState([]),
|
|
13843
13853
|
options = _useState[0],
|
|
13844
13854
|
setOptions = _useState[1];
|
|
13845
13855
|
|
|
13846
|
-
var _useState2 = React.useState(
|
|
13847
|
-
|
|
13848
|
-
|
|
13856
|
+
var _useState2 = React.useState(init),
|
|
13857
|
+
inital = _useState2[0],
|
|
13858
|
+
setInitial = _useState2[1];
|
|
13859
|
+
|
|
13860
|
+
var _useState3 = React.useState(init),
|
|
13861
|
+
checked = _useState3[0],
|
|
13862
|
+
setChecked = _useState3[1];
|
|
13849
13863
|
|
|
13864
|
+
React.useEffect(function () {
|
|
13865
|
+
var getOption = function getOption(def, options, prev) {
|
|
13866
|
+
var index = options.findIndex(function (o) {
|
|
13867
|
+
return o.value === def.value;
|
|
13868
|
+
});
|
|
13869
|
+
if (index !== -1) return _extends({}, options[index]);else {
|
|
13870
|
+
var _index = prev.findIndex(function (o) {
|
|
13871
|
+
return o.value === def.value;
|
|
13872
|
+
});
|
|
13873
|
+
|
|
13874
|
+
if (_index !== -1) return _extends({}, prev[_index]);
|
|
13875
|
+
}
|
|
13876
|
+
return def;
|
|
13877
|
+
};
|
|
13878
|
+
|
|
13879
|
+
var mapper = function mapper(prev) {
|
|
13880
|
+
return props.value.length > 0 && typeof props.value[0] === 'string' ? props.value.map(function (value) {
|
|
13881
|
+
return getOption({
|
|
13882
|
+
value: value,
|
|
13883
|
+
label: value
|
|
13884
|
+
}, options, prev);
|
|
13885
|
+
}) : props.value.map(function (value) {
|
|
13886
|
+
return getOption(value, options, prev);
|
|
13887
|
+
});
|
|
13888
|
+
};
|
|
13889
|
+
|
|
13890
|
+
setInitial(mapper);
|
|
13891
|
+
setChecked(mapper);
|
|
13892
|
+
}, [props.value, options]);
|
|
13850
13893
|
var parsedOptions = getOptions$1(options, checked, setChecked);
|
|
13851
13894
|
var inputValue = getInputValue$1(props.value);
|
|
13852
13895
|
|
|
13853
13896
|
var onReset = function onReset() {
|
|
13854
|
-
setChecked([].concat(
|
|
13897
|
+
setChecked([].concat(inital));
|
|
13855
13898
|
};
|
|
13856
13899
|
|
|
13857
13900
|
var returnData = {
|
|
@@ -13995,6 +14038,12 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13995
14038
|
setSearch('');
|
|
13996
14039
|
};
|
|
13997
14040
|
|
|
14041
|
+
var onClick = function onClick() {
|
|
14042
|
+
setOpen(function (prev) {
|
|
14043
|
+
return !prev;
|
|
14044
|
+
});
|
|
14045
|
+
};
|
|
14046
|
+
|
|
13998
14047
|
return getContext({
|
|
13999
14048
|
setOpen: setOpen,
|
|
14000
14049
|
search: [search, setSearch],
|
|
@@ -14009,11 +14058,7 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
14009
14058
|
}, React__default.createElement(Input$1, Object.assign({}, inputProps, {
|
|
14010
14059
|
type: 'search',
|
|
14011
14060
|
readOnly: true,
|
|
14012
|
-
onClick:
|
|
14013
|
-
setOpen(function (prev) {
|
|
14014
|
-
return !prev;
|
|
14015
|
-
});
|
|
14016
|
-
},
|
|
14061
|
+
onClick: onClick,
|
|
14017
14062
|
loading: loading,
|
|
14018
14063
|
icon: {
|
|
14019
14064
|
position: 'right',
|
|
@@ -14021,7 +14066,8 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
14021
14066
|
type: 'semantic',
|
|
14022
14067
|
icon: open ? 'caret up' : 'caret down',
|
|
14023
14068
|
width: '14px'
|
|
14024
|
-
}
|
|
14069
|
+
},
|
|
14070
|
+
onClick: onClick
|
|
14025
14071
|
},
|
|
14026
14072
|
ref: ref
|
|
14027
14073
|
})), React__default.createElement(Menu, Object.assign({}, menuProps, {
|