@kwiz/fluentui 1.0.31 → 1.0.32

Sign up to get free protection for your applications and to get access to all the features.
Files changed (25) hide show
  1. package/dist/controls/button.js +7 -7
  2. package/dist/controls/button.js.map +1 -1
  3. package/dist/controls/divider.js +2 -2
  4. package/dist/controls/divider.js.map +1 -1
  5. package/dist/controls/menu.d.ts +34 -0
  6. package/dist/controls/menu.js +78 -0
  7. package/dist/controls/menu.js.map +1 -0
  8. package/dist/controls/search.js +4 -3
  9. package/dist/controls/search.js.map +1 -1
  10. package/dist/helpers/drag-drop/drag-drop-container.js +3 -3
  11. package/dist/helpers/drag-drop/drag-drop-container.js.map +1 -1
  12. package/dist/index.d.ts +2 -1
  13. package/dist/index.js +2 -1
  14. package/dist/index.js.map +1 -1
  15. package/dist/styles/styles.d.ts +5 -1
  16. package/dist/styles/styles.js +5 -2
  17. package/dist/styles/styles.js.map +1 -1
  18. package/package.json +1 -1
  19. package/src/controls/button.tsx +11 -7
  20. package/src/controls/divider.tsx +3 -3
  21. package/src/controls/menu.tsx +139 -0
  22. package/src/controls/search.tsx +4 -3
  23. package/src/helpers/drag-drop/drag-drop-container.tsx +3 -3
  24. package/src/index.ts +2 -1
  25. package/src/styles/styles.ts +5 -2
package/dist/controls/button.js CHANGED
@@ -3,7 +3,7 @@ import { Button, CompoundButton, compoundButtonClassNames, makeStyles, mergeClas
3
3
  import { capitalizeFirstLetter, isFunction, isNullOrEmptyString, isNullOrUndefined, isString, PushNoDuplicate } from '@kwiz/common';
4
4
  import React from 'react';
5
5
  import { useKWIZFluentContext } from '../helpers/context';
6
- import { useCommonStyles, widthMedium } from '../styles/styles';
6
+ import { commonSizes, useCommonStyles } from '../styles/styles';
7
7
  const useStyles = makeStyles({
8
8
  buttonNoCenter: {
9
9
  justifyContent: 'flex-start',
@@ -39,6 +39,7 @@ const useStyles = makeStyles({
39
39
  }
40
40
  });
41
41
  export const ButtonEX = React.forwardRef((props, ref) => {
42
+ const ctx = useKWIZFluentContext();
42
43
  const [hover, setHover] = React.useState(false);
43
44
  const trackHover = !isNullOrEmptyString(props.hoverTitle) || !isNullOrUndefined(props.hoverIcon);
44
45
  const title = hover && !isNullOrEmptyString(props.hoverTitle) ? props.hoverTitle
@@ -53,9 +54,7 @@ export const ButtonEX = React.forwardRef((props, ref) => {
53
54
  PushNoDuplicate(css, commonCssNames.printHide);
54
55
  if (props.dontCenterText)
55
56
  PushNoDuplicate(css, cssNames.buttonNoCenter);
56
- if (!isNullOrEmptyString(props.className))
57
- css.push(...props.className.split(' '));
58
- let btn = _jsx(Button, Object.assign({ ref: ref, appearance: 'subtle' }, props, { className: mergeClasses(...css), "aria-label": title, title: undefined, icon: icon, onMouseEnter: trackHover ? (e) => {
57
+ let btn = _jsx(Button, Object.assign({ ref: ref, appearance: 'subtle' }, props, { className: mergeClasses(...css, props.className), "aria-label": title, title: undefined, icon: icon, onMouseEnter: trackHover ? (e) => {
59
58
  setHover(true);
60
59
  if (isFunction(props.onMouseEnter))
61
60
  props.onMouseEnter(e);
@@ -67,7 +66,7 @@ export const ButtonEX = React.forwardRef((props, ref) => {
67
66
  //no icon? will show the title by default
68
67
  (hasText && capitalizeFirstLetter(title)) }));
69
68
  if (!hasText || props.children) //icon only or when content is different than props.title
70
- btn = _jsx(Tooltip, { showDelay: 1000, relationship: 'label', withArrow: true, appearance: 'inverted', content: title, children: btn });
69
+ btn = _jsx(Tooltip, { showDelay: 1000, relationship: 'label', withArrow: true, appearance: 'inverted', content: title, mountNode: ctx.mountNode, children: btn });
71
70
  return (props.dontStretch ? _jsx("div", { children: btn }) : btn);
72
71
  });
73
72
  export const ButtonEXSecondary = React.forwardRef((props, ref) => {
@@ -94,10 +93,11 @@ export const ButtonEXDangerSubtle = React.forwardRef((props, ref) => {
94
93
  return (_jsx(ButtonEX, Object.assign({ ref: ref, className: props.disabled ? undefined : cssNames.dangerSubtle }, props, { children: props.children })));
95
94
  });
96
95
  export const CompoundButtonEX = React.forwardRef((props, ref) => {
96
+ const ctx = useKWIZFluentContext();
97
97
  let title = props.title || props['aria-label'];
98
98
  let tooltip = isString(props.secondaryContent) ? props.secondaryContent : title;
99
- let max = typeof (props.width) === "undefined" ? widthMedium : props.width;
100
- return (_jsx(Tooltip, { showDelay: 1000, relationship: 'label', withArrow: true, appearance: 'inverted', content: tooltip, children: _jsx(CompoundButton, Object.assign({ ref: ref, appearance: 'subtle', style: { justifyContent: "flex-start", maxWidth: max } }, props, { "aria-label": tooltip, title: undefined, children: props.children || capitalizeFirstLetter(title) })) }));
99
+ let max = typeof (props.width) === "undefined" ? commonSizes.widthMedium : props.width;
100
+ return (_jsx(Tooltip, { showDelay: 1000, relationship: 'label', withArrow: true, appearance: 'inverted', content: tooltip, mountNode: ctx.mountNode, children: _jsx(CompoundButton, Object.assign({ ref: ref, appearance: 'subtle', style: { justifyContent: "flex-start", maxWidth: max } }, props, { "aria-label": tooltip, title: undefined, children: props.children || capitalizeFirstLetter(title) })) }));
101
101
  });
102
102
  export const CompoundButtonEXSecondary = React.forwardRef((props, ref) => {
103
103
  const ctx = useKWIZFluentContext();
package/dist/controls/button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/controls/button.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/controls/button.tsx"],"names":[],"mappings":"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"}
package/dist/controls/divider.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { Divider, makeStyles } from '@fluentui/react-components';
2
+ import { Divider, makeStyles, mergeClasses } from '@fluentui/react-components';
3
3
  import React from 'react';
4
4
  const useStyles = makeStyles({
5
5
  separator: {
@@ -8,6 +8,6 @@ const useStyles = makeStyles({
8
8
  });
9
9
  export const DividerEX = React.forwardRef((props, ref) => {
10
10
  const cssNames = useStyles();
11
- return (_jsx(Divider, Object.assign({ ref: ref }, props, { className: cssNames.separator })));
11
+ return (_jsx(Divider, Object.assign({ ref: ref }, props, { className: mergeClasses(cssNames.separator, props.className) })));
12
12
  });
13
13
  //# sourceMappingURL=divider.js.map
package/dist/controls/divider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"divider.js","sourceRoot":"","sources":["../../src/controls/divider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAgB,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAC/E,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,SAAS,EAAE;QACP,QAAQ,EAAE,CAAC;KACd;CACJ,CAAC,CAAC;AAGH,MAAM,CAAC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAoD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACxG,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,OAAO,CACH,KAAC,OAAO,kBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,IAAE,SAAS,EAAE,QAAQ,CAAC,SAAS,IAAI,CAClE,CAAC;AACN,CAAC,CAAC,CAAC"}
1
+ {"version":3,"file":"divider.js","sourceRoot":"","sources":["../../src/controls/divider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAgB,UAAU,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC7F,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,SAAS,EAAE;QACP,QAAQ,EAAE,CAAC;KACd;CACJ,CAAC,CAAC;AAGH,MAAM,CAAC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAoD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACxG,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,OAAO,CACH,KAAC,OAAO,kBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,IAAE,SAAS,EAAE,YAAY,CAAC,QAAQ,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,IAAI,CACjG,CAAC;AACN,CAAC,CAAC,CAAC"}
package/dist/controls/menu.d.ts ADDED
@@ -0,0 +1,34 @@
1
+ import { MenuListProps, MenuPopoverProps, MenuProps } from '@fluentui/react-components';
2
+ import React from 'react';
3
+ import { ButtonEXProps } from './button';
4
+ interface iMenuItemEXItem {
5
+ type?: "item";
6
+ title: string;
7
+ onClick: () => void;
8
+ disabled?: boolean;
9
+ icon?: JSX.Element;
10
+ items?: iMenuItemEX[];
11
+ checked?: boolean;
12
+ }
13
+ interface iMenuItemEXSeparator {
14
+ type: "separator";
15
+ }
16
+ interface iMenuItemEXGroup {
17
+ type: "group";
18
+ title: string;
19
+ items: iMenuItemEX[];
20
+ }
21
+ export type iMenuItemEX = iMenuItemEXItem | iMenuItemEXSeparator | iMenuItemEXGroup;
22
+ interface IProps {
23
+ menuProps?: MenuProps;
24
+ menuPopOverProps?: MenuPopoverProps;
25
+ menuListProps?: MenuListProps;
26
+ trigger: JSX.Element | string | ButtonEXProps;
27
+ items: iMenuItemEX[];
28
+ /** default 8 0/null to disable */
29
+ filterThreshold?: number;
30
+ /** default 8, 0/null to disable */
31
+ pageSize?: number;
32
+ }
33
+ export declare const MenuEx: React.FunctionComponent<React.PropsWithChildren<IProps>>;
34
+ export {};
package/dist/controls/menu.js ADDED
@@ -0,0 +1,78 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { Menu, MenuDivider, MenuGroup, MenuGroupHeader, MenuItem, MenuList, MenuPopover, MenuTrigger } from '@fluentui/react-components';
3
+ import { ChevronLeftRegular, ChevronRightRegular } from '@fluentui/react-icons';
4
+ import { isNotEmptyArray, isNullOrEmptyString, isNullOrUndefined, isNumber, isString, isUndefined, jsonClone } from '@kwiz/common';
5
+ import { useKWIZFluentContext } from '../helpers/context';
6
+ import { useStateEX } from '../helpers/hooks';
7
+ import { ButtonEX } from './button';
8
+ import { Horizontal } from './horizontal';
9
+ import { Search } from './search';
10
+ import { Section } from './section';
11
+ export const MenuEx = (props) => {
12
+ const ctx = useKWIZFluentContext();
13
+ const [startIndexPerLevel, setStartIndexPerLevel] = useStateEX({});
14
+ const [filterPerLevel, setFilterPerLevel] = useStateEX({});
15
+ let pageSize = isUndefined(props.pageSize) ? 8 : props.pageSize;
16
+ let filterThreshold = isUndefined(props.filterThreshold) ? 8 : props.filterThreshold;
17
+ if (!isNumber(pageSize))
18
+ pageSize = 99999999999;
19
+ if (!isNumber(filterThreshold))
20
+ filterThreshold = 99999999999;
21
+ function renderItems(items, level) {
22
+ const myLevelFilter = filterPerLevel[level];
23
+ if (!isNullOrEmptyString(myLevelFilter)) {
24
+ items = items.filter(i => i.type !== "separator" && i.title.toLowerCase().indexOf(myLevelFilter) >= 0);
25
+ }
26
+ let menuItems = items.map((item, index) => {
27
+ switch (item.type) {
28
+ case "group":
29
+ return _jsxs(MenuGroup, { children: [_jsx(MenuGroupHeader, { children: item.title }), renderItems(item.items, level + 1)] }, index);
30
+ case "separator":
31
+ return _jsx(MenuDivider, {}, index);
32
+ case "item":
33
+ default:
34
+ const menuItem = _jsx(MenuItem, { icon: item.icon, disabled: item.disabled, onClick: item.onClick, children: item.title }, index);
35
+ if (isNotEmptyArray(item.items)) {
36
+ _jsxs(Menu, { children: [_jsx(MenuTrigger, { disableButtonEnhancement: true, children: menuItem }), _jsx(MenuPopover, { children: _jsx(MenuList, { children: renderItems(item.items, level + 1) }) })] }, index);
37
+ }
38
+ else
39
+ return menuItem;
40
+ }
41
+ });
42
+ const paged = menuItems.length > pageSize;
43
+ const filtered = menuItems.length > filterThreshold || !isNullOrEmptyString(myLevelFilter);
44
+ const filterControl = filtered && _jsx(Search, { value: myLevelFilter || "", onChangeDeferred: (newValue) => {
45
+ const s = jsonClone(filterPerLevel);
46
+ s[level] = newValue ? newValue.toLowerCase() : "";
47
+ setFilterPerLevel(s);
48
+ } });
49
+ if (paged) {
50
+ let start = startIndexPerLevel[level];
51
+ if (isNullOrUndefined(start))
52
+ start = 0;
53
+ let hasMore = menuItems.length > start + pageSize;
54
+ menuItems = menuItems.slice(start, start + pageSize);
55
+ if (start > 0 || hasMore)
56
+ menuItems.splice(0, 0, _jsxs(Horizontal, { children: [_jsx(ButtonEX, { disabled: start < 1, icon: _jsx(ChevronLeftRegular, {}), title: 'previous', onClick: () => {
57
+ const s = jsonClone(startIndexPerLevel);
58
+ s[level] = start - pageSize;
59
+ setStartIndexPerLevel(s);
60
+ } }), _jsx(Section, { main: true, children: filterControl }), _jsx(ButtonEX, { disabled: !hasMore, icon: _jsx(ChevronRightRegular, {}), title: 'next', onClick: () => {
61
+ const s = jsonClone(startIndexPerLevel);
62
+ s[level] = start + pageSize;
63
+ setStartIndexPerLevel(s);
64
+ } })] }, '$next'));
65
+ }
66
+ else if (filtered) {
67
+ //just filter - no paging
68
+ menuItems.splice(0, 0, _jsx(Horizontal, { children: filterControl }, '$next'));
69
+ }
70
+ return menuItems;
71
+ }
72
+ return (_jsxs(Menu, Object.assign({ mountNode: ctx.mountNode }, props.menuProps, { children: [_jsx(MenuTrigger, { disableButtonEnhancement: true, children: isString(props.trigger)
73
+ ? _jsx(ButtonEX, { title: props.trigger })
74
+ : isString(props.trigger.title)
75
+ ? _jsx(ButtonEX, Object.assign({}, props.trigger))
76
+ : props.trigger }), _jsx(MenuPopover, Object.assign({}, props.menuPopOverProps, { children: _jsx(MenuList, Object.assign({}, props.menuListProps, { children: renderItems(props.items, 0) })) }))] })));
77
+ };
78
+ //# sourceMappingURL=menu.js.map
package/dist/controls/menu.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"menu.js","sourceRoot":"","sources":["../../src/controls/menu.tsx"],"names":[],"mappings":"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"}
package/dist/controls/search.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { Input, makeStyles } from '@fluentui/react-components';
3
3
  import { DismissRegular, SearchRegular } from "@fluentui/react-icons";
4
- import { debounce, isFunction, isNullOrEmptyString } from '@kwiz/common';
4
+ import { debounce, isFunction, isNullOrEmptyString, isUndefined } from '@kwiz/common';
5
5
  import React, { useState } from 'react';
6
6
  import { GetLogger } from '../_modules/config';
7
7
  import { useStateEX } from '../helpers/hooks';
@@ -21,7 +21,7 @@ export const Search = (props) => {
21
21
  logger.log(`Set: ${v}`);
22
22
  props.onChangeDeferred(v);
23
23
  }, delay * 1000), [delay]);
24
- let [value, setValue] = useStateEX(props.value, {
24
+ let [value, setValue] = useStateEX(props.value || "", {
25
25
  onChange: newValue => {
26
26
  if (isFunction(props.onChangeSync))
27
27
  props.onChangeSync(newValue);
@@ -32,7 +32,8 @@ export const Search = (props) => {
32
32
  });
33
33
  //once props change, reset this control value to match
34
34
  React.useEffect(() => {
35
- setValue(props.resetValue);
35
+ if (!isUndefined(props.resetValue))
36
+ setValue(props.resetValue);
36
37
  //todo: bug: setting value does not sync into the text box
37
38
  setResetKey(resetKey + 1);
38
39
  }, [props.resetValue]);
package/dist/controls/search.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"search.js","sourceRoot":"","sources":["../../src/controls/search.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"search.js","sourceRoot":"","sources":["../../src/controls/search.tsx"],"names":[],"mappings":"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"}
package/dist/helpers/drag-drop/drag-drop-container.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { isNullOrEmptyString } from "@kwiz/common";
2
+ import { mergeClasses } from "@fluentui/react-components";
3
3
  import { useDragDropContext } from "./drag-drop-context";
4
4
  export function DragDropContainer(props) {
5
5
  const { drag, drop, dragDropRef } = useDragDropContext(props);
6
- const classNames = isNullOrEmptyString(props.className) ? [] : props.className.split(' ');
6
+ const classNames = [];
7
7
  if (drag.isDragging && props.onDraggingClassName)
8
8
  classNames.push(props.onDraggingClassName);
9
9
  if (drop.isOver && props.onDragOverClassName)
@@ -13,6 +13,6 @@ export function DragDropContainer(props) {
13
13
  delete propsWithoutExtras.dropInfo;
14
14
  delete propsWithoutExtras.onDraggingClassName;
15
15
  delete propsWithoutExtras.onDragOverClassName;
16
- return _jsx("div", Object.assign({}, propsWithoutExtras, { ref: dragDropRef, className: classNames.join(' '), children: props.children }));
16
+ return _jsx("div", Object.assign({}, propsWithoutExtras, { ref: dragDropRef, className: mergeClasses(...classNames, props.className), children: props.children }));
17
17
  }
18
18
  //# sourceMappingURL=drag-drop-container.js.map
package/dist/helpers/drag-drop/drag-drop-container.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"drag-drop-container.js","sourceRoot":"","sources":["../../../src/helpers/drag-drop/drag-drop-container.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAgCzD,MAAM,UAAU,iBAAiB,CAI/B,KAAsF;IAEpF,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAE9D,MAAM,UAAU,GAAa,mBAAmB,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACpG,IAAI,IAAI,CAAC,UAAU,IAAI,KAAK,CAAC,mBAAmB;QAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;IAC7F,IAAI,IAAI,CAAC,MAAM,IAAI,KAAK,CAAC,mBAAmB;QAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;IAEzF,MAAM,kBAAkB,qBACjB,KAAK,CACX,CAAC;IACF,OAAO,kBAAkB,CAAC,QAAQ,CAAC;IACnC,OAAO,kBAAkB,CAAC,QAAQ,CAAC;IACnC,OAAO,kBAAkB,CAAC,mBAAmB,CAAC;IAC9C,OAAO,kBAAkB,CAAC,mBAAmB,CAAC;IAE9C,OAAO,8BAAS,kBAAkB,IAAE,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,YAAG,KAAK,CAAC,QAAQ,IAAO,CAAC;AAClH,CAAC"}
1
+ {"version":3,"file":"drag-drop-container.js","sourceRoot":"","sources":["../../../src/helpers/drag-drop/drag-drop-container.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAgCzD,MAAM,UAAU,iBAAiB,CAI/B,KAAsF;IAEpF,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAE9D,MAAM,UAAU,GAAa,EAAE,CAAC;IAChC,IAAI,IAAI,CAAC,UAAU,IAAI,KAAK,CAAC,mBAAmB;QAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;IAC7F,IAAI,IAAI,CAAC,MAAM,IAAI,KAAK,CAAC,mBAAmB;QAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;IAEzF,MAAM,kBAAkB,qBACjB,KAAK,CACX,CAAC;IACF,OAAO,kBAAkB,CAAC,QAAQ,CAAC;IACnC,OAAO,kBAAkB,CAAC,QAAQ,CAAC;IACnC,OAAO,kBAAkB,CAAC,mBAAmB,CAAC;IAC9C,OAAO,kBAAkB,CAAC,mBAAmB,CAAC;IAE9C,OAAO,8BAAS,kBAAkB,IAAE,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,YAAG,KAAK,CAAC,QAAQ,IAAO,CAAC;AAC1I,CAAC"}
package/dist/index.d.ts CHANGED
@@ -12,6 +12,7 @@ export * from './controls/input';
12
12
  export * from './controls/kwizoverflow';
13
13
  export * from './controls/list';
14
14
  export * from './controls/loading';
15
+ export * from './controls/menu';
15
16
  export * from './controls/please-wait';
16
17
  export * from './controls/prompt';
17
18
  export * from './controls/search';
@@ -24,4 +25,4 @@ export { KWIZFluentContext, useKWIZFluentContext } from './helpers/context';
24
25
  export type { iKWIZFluentContext } from './helpers/context';
25
26
  export * from './helpers/drag-drop/exports';
26
27
  export * from './helpers/hooks';
27
- export { KnownClassNames } from './styles/styles';
28
+ export { KnownClassNames, commonSizes } from './styles/styles';
package/dist/index.js CHANGED
@@ -12,6 +12,7 @@ export * from './controls/input';
12
12
  export * from './controls/kwizoverflow';
13
13
  export * from './controls/list';
14
14
  export * from './controls/loading';
15
+ export * from './controls/menu';
15
16
  export * from './controls/please-wait';
16
17
  export * from './controls/prompt';
17
18
  export * from './controls/search';
@@ -23,5 +24,5 @@ export * from './controls/vertical-content';
23
24
  export { KWIZFluentContext, useKWIZFluentContext } from './helpers/context';
24
25
  export * from './helpers/drag-drop/exports';
25
26
  export * from './helpers/hooks';
26
- export { KnownClassNames } from './styles/styles';
27
+ export { KnownClassNames, commonSizes } from './styles/styles';
27
28
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AACjC,cAAc,yBAAyB,CAAC;AACxC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,6BAA6B,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAE5E,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AACjC,cAAc,yBAAyB,CAAC;AACxC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,6BAA6B,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAE5E,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC"}
package/dist/styles/styles.d.ts CHANGED
@@ -22,4 +22,8 @@ export declare const KnownClassNames: {
22
22
  isOpen: string;
23
23
  };
24
24
  export declare const useCommonStyles: () => Record<"printShow" | "printHide", string>;
25
- export declare const widthMedium = 360;
25
+ export declare const commonSizes: {
26
+ widthMedium: number;
27
+ widthWide: number;
28
+ extraWidthWide: number;
29
+ };
package/dist/styles/styles.js CHANGED
@@ -80,6 +80,9 @@ export const useCommonStyles = makeStyles({
80
80
  }
81
81
  },
82
82
  });
83
- export const widthMedium = 360;
84
- //export const widthWide = 520;
83
+ export const commonSizes = {
84
+ widthMedium: 360,
85
+ widthWide: 520,
86
+ extraWidthWide: 820,
87
+ };
85
88
  //# sourceMappingURL=styles.js.map
package/dist/styles/styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,UAAU,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAE9E,MAAM,KAAQ,MAAM,CAsDnB;AAtDD,WAAc,MAAM;IACH,WAAI,GAAiB;QAC9B,UAAU,EAAE,CAAC;QACb,QAAQ,EAAE,CAAC;KACd,CAAC;IACW,gBAAS,GAAiB;QACnC,MAAM,EAAE,SAAS;QACjB,CAAC,SAAS,CAAC,EAAE;YACT,MAAM,EAAE,SAAS;SACpB;KACJ,CAAA;IACD,MAAM,GAAG,GAAiB;QACtB,OAAO,EAAE,MAAM,CAAC,kBAAkB;QAClC,YAAY,EAAE,MAAM,CAAC,kBAAkB;QACvC,SAAS,EAAE,MAAM,CAAC,OAAO;QACzB,MAAM,EAAE,MAAM,CAAC,oBAAoB;KACtC,CAAA;IACY,YAAK,mCACX,GAAG;QACN,wBAAwB;QACxB,QAAQ,EAAE,UAAU;QACpB,wBAAwB;QACxB,QAAQ,EAAE,KAAK;QACf,8BAA8B;QAC9B,SAAS,EAAE,QAAQ,EAEnB,CAAC,OAAO,CAAC,EAAE;YACP,QAAQ,EAAE,MAAM;SACnB,GACJ,CAAA;IAEY,WAAI,GAAiB;QAC9B,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,QAAQ;QAClB,MAAM,EAAE,MAAM,CAAC,gBAAgB;QAC/B,SAAS,EAAE,MAAM,CAAC,gBAAgB;KACrC,CAAA;IAEY,WAAI,GAAiB;QAC9B,QAAQ,EAAE,MAAM;KACnB,CAAA;IACY,YAAK,GAAiB;QAC/B,MAAM,EAAE,CAAC;QACT,SAAS,EAAE,CAAC;KACf,CAAA;IACY,eAAQ,GAAiB;QAClC,UAAU,EAAE,QAAQ;QACpB,OAAO,EAAE,OAAO;QAChB,QAAQ,EAAE,QAAQ;QAClB,YAAY,EAAE,UAAU;KAC3B,CAAA;IAED,qCAAqC;IACrC,IAAI;AACR,CAAC,EAtDa,MAAM,KAAN,MAAM,QAsDnB;AAED,MAAM,CAAC,MAAM,eAAe,GAAG;IAC3B,KAAK,EAAE,YAAY;IACnB,OAAO,EAAE,cAAc;IACvB,QAAQ,EAAE,eAAe;IACzB,UAAU,EAAE,iBAAiB;IAC7B,IAAI,EAAE,WAAW;IACjB,SAAS,EAAE,gBAAgB;IAC3B,eAAe,EAAE,uBAAuB;IACxC,aAAa,EAAE,qBAAqB;IACpC,oBAAoB,EAAE,6BAA6B;IACnD,mBAAmB,EAAE,uBAAuB;IAC5C,MAAM,EAAE,WAAW;CACtB,CAAA;AACD,MAAM,CAAC,MAAM,eAAe,GAAG,UAAU,CAAC;IACtC,SAAS,EAAE;QACP,OAAO,EAAE,MAAM;QACf,CAAC,gBAAgB,eAAe,CAAC,KAAK,GAAG,CAAC,EAAE;YACxC,OAAO,EAAE,OAAO;SACnB;QACD,cAAc,EAAE;YACZ,OAAO,EAAE,OAAO;SACnB;KACJ;IACD,SAAS,EAAE;QACP,CAAC,gBAAgB,eAAe,CAAC,KAAK,GAAG,CAAC,EAAE;YACxC,OAAO,EAAE,iBAAiB;SAC7B;QACD,cAAc,EAAE;YACZ,OAAO,EAAE,iBAAiB;SAC7B;KACJ;CACJ,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAC;AAC/B,+BAA+B"}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,UAAU,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAE9E,MAAM,KAAQ,MAAM,CAsDnB;AAtDD,WAAc,MAAM;IACH,WAAI,GAAiB;QAC9B,UAAU,EAAE,CAAC;QACb,QAAQ,EAAE,CAAC;KACd,CAAC;IACW,gBAAS,GAAiB;QACnC,MAAM,EAAE,SAAS;QACjB,CAAC,SAAS,CAAC,EAAE;YACT,MAAM,EAAE,SAAS;SACpB;KACJ,CAAA;IACD,MAAM,GAAG,GAAiB;QACtB,OAAO,EAAE,MAAM,CAAC,kBAAkB;QAClC,YAAY,EAAE,MAAM,CAAC,kBAAkB;QACvC,SAAS,EAAE,MAAM,CAAC,OAAO;QACzB,MAAM,EAAE,MAAM,CAAC,oBAAoB;KACtC,CAAA;IACY,YAAK,mCACX,GAAG;QACN,wBAAwB;QACxB,QAAQ,EAAE,UAAU;QACpB,wBAAwB;QACxB,QAAQ,EAAE,KAAK;QACf,8BAA8B;QAC9B,SAAS,EAAE,QAAQ,EAEnB,CAAC,OAAO,CAAC,EAAE;YACP,QAAQ,EAAE,MAAM;SACnB,GACJ,CAAA;IAEY,WAAI,GAAiB;QAC9B,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,QAAQ;QAClB,MAAM,EAAE,MAAM,CAAC,gBAAgB;QAC/B,SAAS,EAAE,MAAM,CAAC,gBAAgB;KACrC,CAAA;IAEY,WAAI,GAAiB;QAC9B,QAAQ,EAAE,MAAM;KACnB,CAAA;IACY,YAAK,GAAiB;QAC/B,MAAM,EAAE,CAAC;QACT,SAAS,EAAE,CAAC;KACf,CAAA;IACY,eAAQ,GAAiB;QAClC,UAAU,EAAE,QAAQ;QACpB,OAAO,EAAE,OAAO;QAChB,QAAQ,EAAE,QAAQ;QAClB,YAAY,EAAE,UAAU;KAC3B,CAAA;IAED,qCAAqC;IACrC,IAAI;AACR,CAAC,EAtDa,MAAM,KAAN,MAAM,QAsDnB;AAED,MAAM,CAAC,MAAM,eAAe,GAAG;IAC3B,KAAK,EAAE,YAAY;IACnB,OAAO,EAAE,cAAc;IACvB,QAAQ,EAAE,eAAe;IACzB,UAAU,EAAE,iBAAiB;IAC7B,IAAI,EAAE,WAAW;IACjB,SAAS,EAAE,gBAAgB;IAC3B,eAAe,EAAE,uBAAuB;IACxC,aAAa,EAAE,qBAAqB;IACpC,oBAAoB,EAAE,6BAA6B;IACnD,mBAAmB,EAAE,uBAAuB;IAC5C,MAAM,EAAE,WAAW;CACtB,CAAA;AACD,MAAM,CAAC,MAAM,eAAe,GAAG,UAAU,CAAC;IACtC,SAAS,EAAE;QACP,OAAO,EAAE,MAAM;QACf,CAAC,gBAAgB,eAAe,CAAC,KAAK,GAAG,CAAC,EAAE;YACxC,OAAO,EAAE,OAAO;SACnB;QACD,cAAc,EAAE;YACZ,OAAO,EAAE,OAAO;SACnB;KACJ;IACD,SAAS,EAAE;QACP,CAAC,gBAAgB,eAAe,CAAC,KAAK,GAAG,CAAC,EAAE;YACxC,OAAO,EAAE,iBAAiB;SAC7B;QACD,cAAc,EAAE;YACZ,OAAO,EAAE,iBAAiB;SAC7B;KACJ;CACJ,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG;IACvB,WAAW,EAAE,GAAG;IAChB,SAAS,EAAE,GAAG;IACd,cAAc,EAAE,GAAG;CACtB,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kwiz/fluentui",
3
- "version": "1.0.31",
3
+ "version": "1.0.32",
4
4
  "description": "KWIZ common controls for FluentUI",
5
5
  "module": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
package/src/controls/button.tsx CHANGED
@@ -2,7 +2,7 @@ import { Button, ButtonProps, CompoundButton, compoundButtonClassNames, Compound
2
2
  import { capitalizeFirstLetter, isFunction, isNullOrEmptyString, isNullOrUndefined, isString, PushNoDuplicate } from '@kwiz/common';
3
3
  import React from 'react';
4
4
  import { useKWIZFluentContext } from '../helpers/context';
5
- import { useCommonStyles, widthMedium } from '../styles/styles';
5
+ import { commonSizes, useCommonStyles } from '../styles/styles';
6
6
 
7
7
  interface IProps {
8
8
  title: string;//required
@@ -61,6 +61,7 @@ const useStyles = makeStyles({
61
61
 
62
62
 
63
63
  export const ButtonEX = React.forwardRef<HTMLButtonElement, (ButtonEXProps)>((props, ref) => {
64
+ const ctx = useKWIZFluentContext();
64
65
  const [hover, setHover] = React.useState(false);
65
66
  const trackHover = !isNullOrEmptyString(props.hoverTitle) || !isNullOrUndefined(props.hoverIcon);
66
67
 
@@ -77,9 +78,7 @@ export const ButtonEX = React.forwardRef<HTMLButtonElement, (ButtonEXProps)>((pr
77
78
  if (props.hideOnPrint) PushNoDuplicate(css, commonCssNames.printHide);
78
79
  if (props.dontCenterText) PushNoDuplicate(css, cssNames.buttonNoCenter);
79
80
 
80
- if (!isNullOrEmptyString(props.className)) css.push(...props.className.split(' '));
81
-
82
- let btn = <Button ref={ref} appearance='subtle' {...props} className={mergeClasses(...css)}
81
+ let btn = <Button ref={ref} appearance='subtle' {...props} className={mergeClasses(...css, props.className)}
83
82
  aria-label={title} title={undefined} icon={icon}
84
83
  onMouseEnter={trackHover ? (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
85
84
  setHover(true);
@@ -95,7 +94,9 @@ export const ButtonEX = React.forwardRef<HTMLButtonElement, (ButtonEXProps)>((pr
95
94
  //no icon? will show the title by default
96
95
  (hasText && capitalizeFirstLetter(title))}</Button>;
97
96
  if (!hasText || props.children)//icon only or when content is different than props.title
98
- btn = <Tooltip showDelay={1000} relationship='label' withArrow appearance='inverted' content={title}>
97
+ btn = <Tooltip showDelay={1000} relationship='label' withArrow appearance='inverted' content={title}
98
+ mountNode={ctx.mountNode}
99
+ >
99
100
  {btn}
100
101
  </Tooltip>;
101
102
 
@@ -141,11 +142,14 @@ export const ButtonEXDangerSubtle = React.forwardRef<HTMLButtonElement, (ButtonE
141
142
  });
142
143
 
143
144
  export const CompoundButtonEX = React.forwardRef<HTMLButtonElement, (CompoundButtonEXProps)>((props, ref) => {
145
+ const ctx = useKWIZFluentContext();
144
146
  let title = props.title || props['aria-label'];
145
147
  let tooltip = isString(props.secondaryContent) ? props.secondaryContent : title;
146
- let max = typeof (props.width) === "undefined" ? widthMedium : props.width;
148
+ let max = typeof (props.width) === "undefined" ? commonSizes.widthMedium : props.width;
147
149
  return (
148
- <Tooltip showDelay={1000} relationship='label' withArrow appearance='inverted' content={tooltip}>
150
+ <Tooltip showDelay={1000} relationship='label' withArrow appearance='inverted' content={tooltip}
151
+ mountNode={ctx.mountNode}
152
+ >
149
153
  <CompoundButton ref={ref} appearance='subtle' style={{ justifyContent: "flex-start", maxWidth: max }} {...props} aria-label={tooltip} title={undefined}>
150
154
  {props.children || capitalizeFirstLetter(title)}</CompoundButton>
151
155
  </Tooltip>
package/src/controls/divider.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { Divider, DividerProps, makeStyles } from '@fluentui/react-components';
1
+ import { Divider, DividerProps, makeStyles, mergeClasses } from '@fluentui/react-components';
2
2
  import React from 'react';
3
3
 
4
4
  const useStyles = makeStyles({
@@ -11,6 +11,6 @@ interface IProps extends DividerProps {
11
11
  export const DividerEX = React.forwardRef<HTMLDivElement, (React.PropsWithChildren<IProps>)>((props, ref) => {
12
12
  const cssNames = useStyles();
13
13
  return (
14
- <Divider ref={ref} {...props} className={cssNames.separator} />
14
+ <Divider ref={ref} {...props} className={mergeClasses(cssNames.separator, props.className)} />
15
15
  );
16
- });
16
+ });
package/src/controls/menu.tsx ADDED
@@ -0,0 +1,139 @@
1
+ import { Menu, MenuDivider, MenuGroup, MenuGroupHeader, MenuItem, MenuList, MenuListProps, MenuPopover, MenuPopoverProps, MenuProps, MenuTrigger } from '@fluentui/react-components';
2
+ import { ChevronLeftRegular, ChevronRightRegular } from '@fluentui/react-icons';
3
+ import { IDictionary, isNotEmptyArray, isNullOrEmptyString, isNullOrUndefined, isNumber, isString, isUndefined, jsonClone } from '@kwiz/common';
4
+ import React from 'react';
5
+ import { useKWIZFluentContext } from '../helpers/context';
6
+ import { useStateEX } from '../helpers/hooks';
7
+ import { ButtonEX, ButtonEXProps } from './button';
8
+ import { Horizontal } from './horizontal';
9
+ import { Search } from './search';
10
+ import { Section } from './section';
11
+
12
+ interface iMenuItemEXItem {
13
+ type?: "item";
14
+ title: string;
15
+ onClick: () => void;
16
+ disabled?: boolean;
17
+ icon?: JSX.Element;
18
+ items?: iMenuItemEX[];
19
+ checked?: boolean;
20
+ }
21
+ interface iMenuItemEXSeparator {
22
+ type: "separator";
23
+ }
24
+ interface iMenuItemEXGroup {
25
+ type: "group";
26
+ title: string;
27
+ items: iMenuItemEX[];
28
+ }
29
+ export type iMenuItemEX = iMenuItemEXItem | iMenuItemEXSeparator | iMenuItemEXGroup;
30
+
31
+ interface IProps {
32
+ menuProps?: MenuProps;
33
+ menuPopOverProps?: MenuPopoverProps;
34
+ menuListProps?: MenuListProps;
35
+ trigger: JSX.Element | string | ButtonEXProps;
36
+ items: iMenuItemEX[];
37
+ /** default 8 0/null to disable */
38
+ filterThreshold?: number;
39
+ /** default 8, 0/null to disable */
40
+ pageSize?: number;
41
+ }
42
+ export const MenuEx: React.FunctionComponent<React.PropsWithChildren<IProps>> = (props) => {
43
+ const ctx = useKWIZFluentContext();
44
+ const [startIndexPerLevel, setStartIndexPerLevel] = useStateEX<IDictionary<number>>({});
45
+ const [filterPerLevel, setFilterPerLevel] = useStateEX<IDictionary<string>>({});
46
+ let pageSize = isUndefined(props.pageSize) ? 8 : props.pageSize;
47
+ let filterThreshold = isUndefined(props.filterThreshold) ? 8 : props.filterThreshold;
48
+ if (!isNumber(pageSize)) pageSize = 99999999999;
49
+ if (!isNumber(filterThreshold)) filterThreshold = 99999999999;
50
+
51
+ function renderItems(items: iMenuItemEX[], level: number) {
52
+ const myLevelFilter = filterPerLevel[level];
53
+ if (!isNullOrEmptyString(myLevelFilter)) {
54
+ items = items.filter(i => i.type !== "separator" && i.title.toLowerCase().indexOf(myLevelFilter) >= 0);
55
+ }
56
+
57
+ let menuItems = items.map((item, index) => {
58
+ switch (item.type) {
59
+ case "group":
60
+ return <MenuGroup key={index}>
61
+ <MenuGroupHeader>{item.title}</MenuGroupHeader>
62
+ {renderItems(item.items, level + 1)}
63
+ </MenuGroup>;
64
+ case "separator":
65
+ return <MenuDivider key={index} />;
66
+ case "item":
67
+ default:
68
+ const menuItem = <MenuItem key={index} icon={item.icon}
69
+ disabled={item.disabled}
70
+ onClick={item.onClick}
71
+ >{item.title}</MenuItem>;
72
+ if (isNotEmptyArray(item.items)) {
73
+ <Menu key={index}>
74
+ <MenuTrigger disableButtonEnhancement>
75
+ {menuItem}
76
+ </MenuTrigger>
77
+ <MenuPopover>
78
+ <MenuList>
79
+ {renderItems(item.items, level + 1)}
80
+ </MenuList>
81
+ </MenuPopover>
82
+ </Menu>
83
+ }
84
+ else return menuItem;
85
+ }
86
+ });
87
+ const paged = menuItems.length > pageSize;
88
+ const filtered = menuItems.length > filterThreshold || !isNullOrEmptyString(myLevelFilter);
89
+ const filterControl = filtered && <Search value={myLevelFilter || ""} onChangeDeferred={(newValue) => {
90
+ const s = jsonClone(filterPerLevel);
91
+ s[level] = newValue ? newValue.toLowerCase() : "";
92
+ setFilterPerLevel(s);
93
+ }} />;
94
+ if (paged) {
95
+ let start = startIndexPerLevel[level];
96
+ if (isNullOrUndefined(start)) start = 0;
97
+ let hasMore = menuItems.length > start + pageSize;
98
+ menuItems = menuItems.slice(start, start + pageSize);
99
+ if (start > 0 || hasMore) menuItems.splice(0, 0, <Horizontal key='$next'>
100
+ <ButtonEX disabled={start < 1} icon={<ChevronLeftRegular />} title='previous' onClick={() => {
101
+ const s = jsonClone(startIndexPerLevel);
102
+ s[level] = start - pageSize;
103
+ setStartIndexPerLevel(s);
104
+ }} />
105
+ <Section main>
106
+ {filterControl}
107
+ </Section>
108
+ <ButtonEX disabled={!hasMore} icon={<ChevronRightRegular />} title='next' onClick={() => {
109
+ const s = jsonClone(startIndexPerLevel);
110
+ s[level] = start + pageSize;
111
+ setStartIndexPerLevel(s);
112
+ }} />
113
+ </Horizontal>);
114
+ }
115
+ else if (filtered) {
116
+ //just filter - no paging
117
+ menuItems.splice(0, 0, <Horizontal key='$next'>
118
+ {filterControl}
119
+ </Horizontal>);
120
+ }
121
+ return menuItems;
122
+ }
123
+ return (
124
+ <Menu mountNode={ctx.mountNode} {...props.menuProps}>
125
+ <MenuTrigger disableButtonEnhancement>
126
+ {isString(props.trigger)
127
+ ? <ButtonEX title={props.trigger} />
128
+ : isString((props.trigger as ButtonEXProps).title)
129
+ ? <ButtonEX {...(props.trigger as ButtonEXProps)} />
130
+ : props.trigger as JSX.Element}
131
+ </MenuTrigger>
132
+ <MenuPopover {...props.menuPopOverProps}>
133
+ <MenuList {...props.menuListProps}>
134
+ {renderItems(props.items, 0)}
135
+ </MenuList>
136
+ </MenuPopover>
137
+ </Menu>
138
+ );
139
+ }
package/src/controls/search.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import { Input, InputProps, makeStyles } from '@fluentui/react-components';
2
2
  import { DismissRegular, SearchRegular } from "@fluentui/react-icons";
3
- import { debounce, isFunction, isNullOrEmptyString } from '@kwiz/common';
3
+ import { debounce, isFunction, isNullOrEmptyString, isUndefined } from '@kwiz/common';
4
4
  import React, { useState } from 'react';
5
5
  import { GetLogger } from '../_modules/config';
6
6
  import { useStateEX } from '../helpers/hooks';
@@ -35,7 +35,7 @@ export const Search: React.FunctionComponent<React.PropsWithChildren<IProps>> =
35
35
  props.onChangeDeferred(v);
36
36
  }, delay * 1000), [delay]);
37
37
 
38
- let [value, setValue] = useStateEX(props.value, {
38
+ let [value, setValue] = useStateEX(props.value || "", {
39
39
  onChange: newValue => {
40
40
  if (isFunction(props.onChangeSync)) props.onChangeSync(newValue as string);
41
41
  if (isFunction(props.onChangeDeferred)) notifyParent(newValue);
@@ -45,7 +45,8 @@ export const Search: React.FunctionComponent<React.PropsWithChildren<IProps>> =
45
45
 
46
46
  //once props change, reset this control value to match
47
47
  React.useEffect(() => {
48
- setValue(props.resetValue);
48
+ if (!isUndefined(props.resetValue))
49
+ setValue(props.resetValue);
49
50
  //todo: bug: setting value does not sync into the text box
50
51
  setResetKey(resetKey + 1)
51
52
  }, [props.resetValue]);
package/src/helpers/drag-drop/drag-drop-container.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { isNullOrEmptyString } from "@kwiz/common";
1
+ import { mergeClasses } from "@fluentui/react-components";
2
2
  import { useDragDropContext } from "./drag-drop-context";
3
3
  import { iDraggableProps, iDraggedItemType } from "./use-draggable";
4
4
  import { iDroppableProps } from "./use-droppable";
@@ -39,7 +39,7 @@ export function DragDropContainer<
39
39
 
40
40
  const { drag, drop, dragDropRef } = useDragDropContext(props);
41
41
 
42
- const classNames: string[] = isNullOrEmptyString(props.className) ? [] : props.className.split(' ');
42
+ const classNames: string[] = [];
43
43
  if (drag.isDragging && props.onDraggingClassName) classNames.push(props.onDraggingClassName);
44
44
  if (drop.isOver && props.onDragOverClassName) classNames.push(props.onDragOverClassName);
45
45
 
@@ -51,5 +51,5 @@ export function DragDropContainer<
51
51
  delete propsWithoutExtras.onDraggingClassName;
52
52
  delete propsWithoutExtras.onDragOverClassName;
53
53
 
54
- return <div {...propsWithoutExtras} ref={dragDropRef} className={classNames.join(' ')}>{props.children}</div>;
54
+ return <div {...propsWithoutExtras} ref={dragDropRef} className={mergeClasses(...classNames, props.className)}>{props.children}</div>;
55
55
  }
package/src/index.ts CHANGED
@@ -12,6 +12,7 @@ export * from './controls/input';
12
12
  export * from './controls/kwizoverflow';
13
13
  export * from './controls/list';
14
14
  export * from './controls/loading';
15
+ export * from './controls/menu';
15
16
  export * from './controls/please-wait';
16
17
  export * from './controls/prompt';
17
18
  export * from './controls/search';
@@ -24,5 +25,5 @@ export { KWIZFluentContext, useKWIZFluentContext } from './helpers/context';
24
25
  export type { iKWIZFluentContext } from './helpers/context';
25
26
  export * from './helpers/drag-drop/exports';
26
27
  export * from './helpers/hooks';
27
- export { KnownClassNames } from './styles/styles';
28
+ export { KnownClassNames, commonSizes } from './styles/styles';
28
29
 
package/src/styles/styles.ts CHANGED
@@ -89,5 +89,8 @@ export const useCommonStyles = makeStyles({
89
89
  },
90
90
  })
91
91
 
92
- export const widthMedium = 360;
93
- //export const widthWide = 520;
92
+ export const commonSizes = {
93
+ widthMedium: 360,
94
+ widthWide: 520,
95
+ extraWidthWide: 820,
96
+ }