@kwiz/fluentui 1.0.3 → 1.0.4
Sign up to get free protection for your applications and to get access to all the features.
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Dropdown, Option } from '@fluentui/react-components';
|
|
3
|
-
import { firstOrNull, isNullOrUndefined } from '@kwiz/common';
|
|
3
|
+
import { filterEmptyEntries, firstOrNull, isNullOrUndefined } from '@kwiz/common';
|
|
4
4
|
import React from 'react';
|
|
5
5
|
function $DropdownEX(props, ref) {
|
|
6
6
|
const selected = Array.isArray(props.selected) ? props.selected : isNullOrUndefined(props.selected) ? [] : [props.selected];
|
|
7
|
-
|
|
7
|
+
//sometimes control will lose value when re-rendered
|
|
8
|
+
//use case: public forms when editing other fields after the dropdown was set
|
|
9
|
+
//re-set the text value manually to fix
|
|
10
|
+
let text = Array.isArray(props.selected)
|
|
11
|
+
? filterEmptyEntries(props.selected.map(s => {
|
|
12
|
+
let v = firstOrNull(props.items, i => i.key === s);
|
|
13
|
+
return v ? v.value : '';
|
|
14
|
+
})).join(', ')
|
|
15
|
+
: props.selected || "";
|
|
16
|
+
return (_jsx(Dropdown, Object.assign({}, props, { onSelect: undefined, ref: ref, clearable: !props.required && !props.multiselect, appearance: 'underline', selectedOptions: selected, value: text, onOptionSelect: (e, data) => {
|
|
8
17
|
let o = firstOrNull(props.items, i => i.key === data.optionValue);
|
|
9
18
|
if (props.multiselect) {
|
|
10
19
|
let current = data.selectedOptions.map(s => firstOrNull(props.items, i => i.key === s));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../src/controls/dropdown.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAiB,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../src/controls/dropdown.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAiB,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAClF,OAAO,KAAK,MAAM,OAAO,CAAC;AAmB1B,SAAS,WAAW,CAAoD,KAAgC,EAAE,GAA0C;IAChJ,MAAM,QAAQ,GAAc,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAEvI,oDAAoD;IACpD,6EAA6E;IAC7E,uCAAuC;IACvC,IAAI,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC;QACpC,CAAC,CAAC,kBAAkB,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;YACxC,IAAI,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC;YACnD,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA;QAC3B,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QACd,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,EAAE,CAAC;IAE3B,OAAO,CACH,KAAC,QAAQ,oBAAU,KAAK,IAAE,QAAQ,EAAE,SAAS,EAAI,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,KAAK,CAAC,WAAW,EACvG,UAAU,EAAC,WAAW,EAAC,eAAe,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE;YACvF,IAAI,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,WAAW,CAAC,CAAC;YAClE,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC;gBACpB,IAAI,OAAO,GAAG,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;gBACxF,KAAK,CAAC,QAAQ,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;YAC/B,CAAC;;gBACI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;QAC3B,CAAC,YACA,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,KAAC,MAAM,IAAa,KAAK,EAAE,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC,KAAK,YAAG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAlE,CAAC,CAAC,GAAG,CAAuE,CAAC,IACzG,CAEd,CAAC;AACN,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Dropdown, DropdownProps, Option } from '@fluentui/react-components';
|
|
2
|
-
import { firstOrNull, isNullOrUndefined } from '@kwiz/common';
|
|
2
|
+
import { filterEmptyEntries, firstOrNull, isNullOrUndefined } from '@kwiz/common';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
|
|
5
5
|
type ForwardProps = Omit<DropdownProps, "onSelect" | "selectedOptions" | "clearable">;
|
|
@@ -20,12 +20,21 @@ interface IProps<dataType, keyType extends string = string> extends ForwardProps
|
|
|
20
20
|
}
|
|
21
21
|
|
|
22
22
|
function $DropdownEX<keyType extends string = string, dataType = never>(props: IProps<dataType, keyType>, ref: React.ForwardedRef<HTMLButtonElement>) {
|
|
23
|
-
|
|
24
23
|
const selected: keyType[] = Array.isArray(props.selected) ? props.selected : isNullOrUndefined(props.selected) ? [] : [props.selected];
|
|
25
24
|
|
|
25
|
+
//sometimes control will lose value when re-rendered
|
|
26
|
+
//use case: public forms when editing other fields after the dropdown was set
|
|
27
|
+
//re-set the text value manually to fix
|
|
28
|
+
let text = Array.isArray(props.selected)
|
|
29
|
+
? filterEmptyEntries(props.selected.map(s => {
|
|
30
|
+
let v = firstOrNull(props.items, i => i.key === s);
|
|
31
|
+
return v ? v.value : ''
|
|
32
|
+
})).join(', ')
|
|
33
|
+
: props.selected || "";
|
|
34
|
+
|
|
26
35
|
return (
|
|
27
36
|
<Dropdown {...{ ...props, onSelect: undefined }} ref={ref} clearable={!props.required && !props.multiselect}
|
|
28
|
-
appearance='underline' selectedOptions={selected} onOptionSelect={(e, data) => {
|
|
37
|
+
appearance='underline' selectedOptions={selected} value={text} onOptionSelect={(e, data) => {
|
|
29
38
|
let o = firstOrNull(props.items, i => i.key === data.optionValue);
|
|
30
39
|
if (props.multiselect) {
|
|
31
40
|
let current = data.selectedOptions.map(s => firstOrNull(props.items, i => i.key === s));
|