@kwiz/fluentui 1.0.6 → 1.0.8
Sign up to get free protection for your applications and to get access to all the features.
package/dist/controls/date.js
CHANGED
|
@@ -7,13 +7,11 @@ import { useKWIZFluentContextContext } from '../helpers/context';
|
|
|
7
7
|
export const DatePickerEx = (props) => {
|
|
8
8
|
const ctx = useKWIZFluentContextContext();
|
|
9
9
|
const [showClear, setShowClear] = React.useState(isDate(props.value));
|
|
10
|
-
const [v, setV] = React.useState(0);
|
|
11
10
|
const reset = React.useCallback(() => {
|
|
12
11
|
setShowClear(false);
|
|
13
|
-
setV(v + 1);
|
|
14
12
|
if (isFunction(props.onSelectDate))
|
|
15
13
|
props.onSelectDate(undefined);
|
|
16
|
-
}, [
|
|
14
|
+
}, [showClear]);
|
|
17
15
|
return (_jsx(DatePicker, Object.assign({ appearance: ctx.inputAppearance, mountNode: ctx.mountNode }, props, { onSelectDate: (date) => {
|
|
18
16
|
setShowClear(isDate(date));
|
|
19
17
|
if (isFunction(props.onSelectDate))
|
|
@@ -29,6 +27,6 @@ export const DatePickerEx = (props) => {
|
|
|
29
27
|
else if (isFunction(props.onCancel) && e.key === "Escape")
|
|
30
28
|
props.onCancel();
|
|
31
29
|
}
|
|
32
|
-
: undefined, contentBefore: showClear && _jsx(CalendarCancelRegular, { title: 'Clear', onClick: () => reset() }) })
|
|
30
|
+
: undefined, contentBefore: showClear && _jsx(CalendarCancelRegular, { title: 'Clear', onClick: () => reset() }) })));
|
|
33
31
|
};
|
|
34
32
|
//# sourceMappingURL=date.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date.js","sourceRoot":"","sources":["../../src/controls/date.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,mCAAmC,CAAC;AAChF,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACvE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,2BAA2B,EAAE,MAAM,oBAAoB,CAAC;AAOjE,MAAM,CAAC,MAAM,YAAY,GAA6D,CAAC,KAAK,EAAE,EAAE;IAC5F,MAAM,GAAG,GAAG,2BAA2B,EAAE,CAAC;IAC1C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IACtE,MAAM,
|
|
1
|
+
{"version":3,"file":"date.js","sourceRoot":"","sources":["../../src/controls/date.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,mCAAmC,CAAC;AAChF,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACvE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,2BAA2B,EAAE,MAAM,oBAAoB,CAAC;AAOjE,MAAM,CAAC,MAAM,YAAY,GAA6D,CAAC,KAAK,EAAE,EAAE;IAC5F,MAAM,GAAG,GAAG,2BAA2B,EAAE,CAAC;IAC1C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IACtE,MAAM,KAAK,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACjC,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,IAAI,UAAU,CAAC,KAAK,CAAC,YAAY,CAAC;YAAE,KAAK,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACtE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,CACH,KAAC,UAAU,kBAAC,UAAU,EAAE,GAAG,CAAC,eAAe,EAAE,SAAS,EAAE,GAAG,CAAC,SAAS,IAAM,KAAK,IAC5E,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE;YACnB,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;YAC3B,IAAI,UAAU,CAAC,KAAK,CAAC,YAAY,CAAC;gBAAE,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;QACjE,CAAC,EACD,QAAQ,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE;YAClB,YAAY,CAAC,CAAC,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;YAC/C,IAAI,UAAU,CAAC,KAAK,CAAC,QAAQ,CAAC;gBAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;QAC5D,CAAC,EACD,SAAS,EAAE,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,UAAU,CAAC,KAAK,CAAC,QAAQ,CAAC;YAC3D,CAAC,CAAC,CAAC,CAAC,EAAE;gBACF,IAAI,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO;oBAAE,KAAK,CAAC,IAAI,EAAE,CAAC;qBACzD,IAAI,UAAU,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;oBAAE,KAAK,CAAC,QAAQ,EAAE,CAAC;YAChF,CAAC;YACD,CAAC,CAAC,SAAS,EAEf,aAAa,EAAE,SAAS,IAAI,KAAC,qBAAqB,IAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,GAAI,IAC7F,CACL,CAAC;AACN,CAAC,CAAA"}
|
|
@@ -9,12 +9,10 @@ function $DropdownEX(props, ref) {
|
|
|
9
9
|
//sometimes control will lose value when re-rendered
|
|
10
10
|
//use case: public forms when editing other fields after the dropdown was set
|
|
11
11
|
//re-set the text value manually to fix
|
|
12
|
-
let text = Array.isArray(props.selected)
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
})).join(', ')
|
|
17
|
-
: props.selected || "";
|
|
12
|
+
let text = filterEmptyEntries((Array.isArray(props.selected) ? props.selected : [props.selected]).map(s => {
|
|
13
|
+
let v = firstOrNull(props.items, i => i.key === s);
|
|
14
|
+
return v ? v.value : '';
|
|
15
|
+
})).join(', ');
|
|
18
16
|
return (_jsx(Dropdown, Object.assign({}, props, { onSelect: undefined, ref: ref, clearable: !props.required && !props.multiselect, appearance: ctx.inputAppearance, mountNode: ctx.mountNode, selectedOptions: selected, value: text, onOptionSelect: (e, data) => {
|
|
19
17
|
let o = firstOrNull(props.items, i => i.key === data.optionValue);
|
|
20
18
|
if (props.multiselect) {
|
|
@@ -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,kBAAkB,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAClF,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,2BAA2B,EAAE,MAAM,oBAAoB,CAAC;AAmBjE,SAAS,WAAW,CAAoD,KAAgC,EAAE,GAA0C;IAChJ,MAAM,GAAG,GAAG,2BAA2B,EAAE,CAAC;IAC1C,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
|
|
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;AAC1B,OAAO,EAAE,2BAA2B,EAAE,MAAM,oBAAoB,CAAC;AAmBjE,SAAS,WAAW,CAAoD,KAAgC,EAAE,GAA0C;IAChJ,MAAM,GAAG,GAAG,2BAA2B,EAAE,CAAC;IAC1C,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,kBAAkB,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAA,CAAC,CAAA,KAAK,CAAC,QAAQ,CAAA,CAAC,CAAA,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;QAC9F,IAAI,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC;QACnD,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA;IAC3B,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAEnB,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,EAAE,GAAG,CAAC,eAAe,EAAE,SAAS,EAAE,GAAG,CAAC,SAAS,EACzD,eAAe,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE;YAChE,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
package/src/controls/date.tsx
CHANGED
|
@@ -12,15 +12,13 @@ interface IProps extends DatePickerProps {
|
|
|
12
12
|
export const DatePickerEx: React.FunctionComponent<React.PropsWithChildren<IProps>> = (props) => {
|
|
13
13
|
const ctx = useKWIZFluentContextContext();
|
|
14
14
|
const [showClear, setShowClear] = React.useState(isDate(props.value));
|
|
15
|
-
const [v, setV] = React.useState(0);
|
|
16
15
|
const reset = React.useCallback(() => {
|
|
17
16
|
setShowClear(false);
|
|
18
|
-
setV(v + 1);
|
|
19
17
|
if (isFunction(props.onSelectDate)) props.onSelectDate(undefined);
|
|
20
|
-
}, [
|
|
18
|
+
}, [showClear]);
|
|
21
19
|
|
|
22
20
|
return (
|
|
23
|
-
<DatePicker
|
|
21
|
+
<DatePicker appearance={ctx.inputAppearance} mountNode={ctx.mountNode} {...props}
|
|
24
22
|
onSelectDate={(date) => {
|
|
25
23
|
setShowClear(isDate(date));
|
|
26
24
|
if (isFunction(props.onSelectDate)) props.onSelectDate(date);
|
|
@@ -27,12 +27,10 @@ function $DropdownEX<keyType extends string = string, dataType = never>(props: I
|
|
|
27
27
|
//sometimes control will lose value when re-rendered
|
|
28
28
|
//use case: public forms when editing other fields after the dropdown was set
|
|
29
29
|
//re-set the text value manually to fix
|
|
30
|
-
let text = Array.isArray(props.selected)
|
|
31
|
-
? filterEmptyEntries(props.selected.map(s => {
|
|
30
|
+
let text = filterEmptyEntries((Array.isArray(props.selected)?props.selected:[props.selected]).map(s => {
|
|
32
31
|
let v = firstOrNull(props.items, i => i.key === s);
|
|
33
32
|
return v ? v.value : ''
|
|
34
|
-
})).join(', ')
|
|
35
|
-
: props.selected || "";
|
|
33
|
+
})).join(', ');
|
|
36
34
|
|
|
37
35
|
return (
|
|
38
36
|
<Dropdown {...{ ...props, onSelect: undefined }} ref={ref} clearable={!props.required && !props.multiselect}
|