@mezzanine-ui/react 0.10.2 → 0.10.5

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.
Files changed (25) hide show
  1. package/Accordion/AccordionControlContext.d.ts +1 -1
  2. package/Button/Button.d.ts +1 -1
  3. package/Button/IconButton.d.ts +1 -1
  4. package/Calendar/CalendarContext.d.ts +1 -1
  5. package/Checkbox/CheckboxGroupContext.d.ts +1 -1
  6. package/DateRangePicker/useDateRangePickerValue.d.ts +5 -4
  7. package/Form/FormControlContext.d.ts +1 -1
  8. package/Message/Message.js +1 -1
  9. package/Notification/Notification.d.ts +2 -2
  10. package/Notification/Notification.js +12 -12
  11. package/Notifier/createNotifier.js +6 -2
  12. package/Picker/usePickerValue.d.ts +2 -2
  13. package/Picker/useRangePickerValue.d.ts +1 -1
  14. package/Radio/RadioGroupContext.d.ts +1 -1
  15. package/Select/Select.d.ts +2 -1
  16. package/Select/Select.js +2 -2
  17. package/Select/SelectControlContext.d.ts +1 -1
  18. package/Table/TableContext.d.ts +3 -3
  19. package/Table/useTableFetchMore.d.ts +1 -1
  20. package/Table/useTableScroll.d.ts +256 -256
  21. package/TextField/useTextFieldControl.d.ts +2 -2
  22. package/Typography/Typography.d.ts +1 -1
  23. package/Upload/UploadPictureWall.d.ts +4 -0
  24. package/Upload/UploadPictureWall.js +8 -6
  25. package/package.json +6 -5
package/Accordion/AccordionControlContext.d.ts CHANGED
@@ -6,4 +6,4 @@ export interface AccordionControlContextValue {
6
6
  summaryId?: string;
7
7
  toggleExpanded(e: boolean): void;
8
8
  }
9
- export declare const AccordionControlContext: import("react").Context<AccordionControlContextValue | undefined>;
9
+ export declare const AccordionControlContext: import("react").Context<AccordionControlContextValue>;
package/Button/Button.d.ts CHANGED
@@ -6,6 +6,6 @@ export declare type ButtonProps<C extends ButtonComponent = 'button'> = Componen
6
6
  * The react component for `mezzanine` button.
7
7
  */
8
8
  declare const Button: import("react").ForwardRefExoticComponent<Omit<Omit<import("../utils/jsx-types").ComponentPropsWithoutKeyAndRef<"button">, keyof ButtonPropsBase> & ButtonPropsBase, "component"> & {
9
- component?: ButtonComponent | undefined;
9
+ component?: ButtonComponent;
10
10
  } & import("react").RefAttributes<HTMLButtonElement>>;
11
11
  export default Button;
package/Button/IconButton.d.ts CHANGED
@@ -16,6 +16,6 @@ declare const IconButton: import("react").ForwardRefExoticComponent<Omit<Omit<im
16
16
  */
17
17
  children?: ReactNode;
18
18
  }, "component"> & {
19
- component?: ButtonComponent | undefined;
19
+ component?: ButtonComponent;
20
20
  } & import("react").RefAttributes<HTMLButtonElement>>;
21
21
  export default IconButton;
package/Calendar/CalendarContext.d.ts CHANGED
@@ -16,7 +16,7 @@ export declare type CalendarConfigProviderProps = {
16
16
  methods: CalendarMethods;
17
17
  valueLocale?: string;
18
18
  };
19
- export declare const CalendarContext: import("react").Context<CalendarConfigs | undefined>;
19
+ export declare const CalendarContext: import("react").Context<CalendarConfigs>;
20
20
  export declare function useCalendarContext(): CalendarConfigs;
21
21
  declare function CalendarConfigProvider(props: CalendarConfigProviderProps): JSX.Element;
22
22
  export default CalendarConfigProvider;
package/Checkbox/CheckboxGroupContext.d.ts CHANGED
@@ -6,4 +6,4 @@ export interface CheckboxGroupContextValue extends CheckboxGroupControlContextVa
6
6
  name?: string;
7
7
  size?: CheckboxSize;
8
8
  }
9
- export declare const CheckboxGroupContext: import("react").Context<CheckboxGroupContextValue | undefined>;
9
+ export declare const CheckboxGroupContext: import("react").Context<CheckboxGroupContextValue>;
package/DateRangePicker/useDateRangePickerValue.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import { DateType } from '@mezzanine-ui/core/calendar';
1
2
  import { RangePickerPickingValue, RangePickerValue } from '@mezzanine-ui/core/picker';
2
3
  import { ChangeEventHandler, KeyboardEventHandler } from 'react';
3
4
  import { UseRangePickerValueProps } from '../Picker/useRangePickerValue';
@@ -5,12 +6,12 @@ export interface UseDateRangePickerValueProps extends Omit<UseRangePickerValuePr
5
6
  onChange?: (value?: RangePickerValue) => void;
6
7
  }
7
8
  export declare function useDateRangePickerValue({ format, formats, inputFromRef, inputToRef, onChange: onChangeProp, value: valueProp, }: UseDateRangePickerValueProps): {
8
- calendarValue: string[] | undefined;
9
+ calendarValue: string[];
9
10
  inputFromValue: string;
10
11
  inputToValue: string;
11
- onCalendarChange: (val?: string | undefined) => void;
12
- onCalendarHover: import("react").Dispatch<import("react").SetStateAction<string | undefined>> | undefined;
13
- onChange: (target?: RangePickerPickingValue<string> | undefined) => RangePickerPickingValue<string> | undefined;
12
+ onCalendarChange: (val?: DateType) => void;
13
+ onCalendarHover: import("react").Dispatch<import("react").SetStateAction<string>>;
14
+ onChange: (target?: RangePickerPickingValue<string>) => RangePickerPickingValue<string>;
14
15
  onClear: () => void;
15
16
  onFromBlur: import("react").FocusEventHandler<HTMLInputElement>;
16
17
  onFromKeyDown: KeyboardEventHandler<HTMLInputElement>;
package/Form/FormControlContext.d.ts CHANGED
@@ -6,4 +6,4 @@ export interface FormControl {
6
6
  required: boolean;
7
7
  severity?: Severity;
8
8
  }
9
- export declare const FormControlContext: import("react").Context<FormControl | undefined>;
9
+ export declare const FormControlContext: import("react").Context<FormControl>;
package/Message/Message.js CHANGED
@@ -38,7 +38,7 @@ const { add, config, destroy, remove, } = createNotifier({
38
38
  duration: 3000,
39
39
  render: (message) => jsx(Message, { ...message }),
40
40
  setRoot: (root) => {
41
- root.setAttribute('class', messageClasses.root);
41
+ root === null || root === void 0 ? void 0 : root.setAttribute('class', messageClasses.root);
42
42
  },
43
43
  });
44
44
  Message.add = add;
package/Notification/Notification.d.ts CHANGED
@@ -50,5 +50,5 @@ export interface Notification extends FC<NotificationData>, Notifier<Notificatio
50
50
  * Use the API from the Notification instance such as `Notification.success` and `Notification.error`
51
51
  * to display a notification globally.
52
52
  */
53
- declare const Notification: Notification;
54
- export default Notification;
53
+ declare const NotificationElement: Notification;
54
+ export default NotificationElement;
package/Notification/Notification.js CHANGED
@@ -16,9 +16,9 @@ import { createNotifier } from '../Notifier/createNotifier.js';
16
16
  * to display a notification globally.
17
17
  */
18
18
  // eslint-disable-next-line @typescript-eslint/no-redeclare
19
- const Notification = ((props) => {
19
+ const NotificationElement = ((props) => {
20
20
  const { cancelText, children, confirmText, direction = 'left', duration, onCancel: onCancelProp, onClose: onCloseProp, onConfirm: onConfirmProp, onExited: onExitedProp, reference, severity, title, ...restTransitionProps } = props;
21
- const targetIcon = severity ? notificationIcons[severity] : severity;
21
+ const targetIcon = severity ? (notificationIcons[severity]) : undefined;
22
22
  const [open, setOpen] = useState(true);
23
23
  useEffect(() => {
24
24
  if (open && duration) {
@@ -48,27 +48,27 @@ const Notification = ((props) => {
48
48
  if (onExitedProp) {
49
49
  onExitedProp(node);
50
50
  }
51
- Notification.remove(reference);
51
+ NotificationElement.remove(reference);
52
52
  };
53
53
  return (jsx(SlideFade, { in: open, appear: true, onExited: onExited, direction: direction, ...restTransitionProps, children: jsxs("div", { className: cx(notificationClasses.host, severity ? notificationClasses.severity(severity) : undefined), children: [targetIcon ? (jsx("div", { className: notificationClasses.iconContainer, children: jsx(Icon, { icon: targetIcon, className: notificationClasses.severityIcon }) })) : null, jsxs("div", { className: notificationClasses.body, children: [jsx("h4", { className: notificationClasses.title, children: title }), jsx("div", { className: notificationClasses.content, children: children }), onConfirm && !severity ? (jsxs(ButtonGroup, { className: notificationClasses.action, children: [jsx(Button, { variant: "contained", onClick: onConfirm, children: confirmText }), jsx(Button, { variant: "outlined", onClick: onCancel || onClose, children: cancelText })] })) : null] }), jsx(Icon, { icon: TimesIcon, className: notificationClasses.closeIcon, onClick: onClose })] }) }));
54
54
  });
55
55
  const { add, config, destroy, remove, } = createNotifier({
56
56
  duration: false,
57
- render: (notif) => jsx(Notification, { ...notif }),
57
+ render: (notif) => jsx(NotificationElement, { ...notif }),
58
58
  setRoot: (root) => {
59
- root.setAttribute('class', notificationClasses.root);
59
+ root === null || root === void 0 ? void 0 : root.setAttribute('class', notificationClasses.root);
60
60
  },
61
61
  });
62
- Notification.add = add;
63
- Notification.config = config;
64
- Notification.destroy = destroy;
65
- Notification.remove = remove;
62
+ NotificationElement.add = add;
63
+ NotificationElement.config = config;
64
+ NotificationElement.destroy = destroy;
65
+ NotificationElement.remove = remove;
66
66
  ['success', 'warning', 'error', 'info'].forEach((severity) => {
67
- Notification[severity] = (props) => Notification.add({
67
+ NotificationElement[severity] = (props) => NotificationElement.add({
68
68
  ...props,
69
69
  severity,
70
70
  });
71
71
  });
72
- var Notification$1 = Notification;
72
+ var NotificationElement$1 = NotificationElement;
73
73
 
74
- export { Notification$1 as default };
74
+ export { NotificationElement$1 as default };
package/Notifier/createNotifier.js CHANGED
@@ -10,19 +10,21 @@ import NotifierManager from './NotifierManager.js';
10
10
  */
11
11
  function createNotifier(props) {
12
12
  const { config: configProp, render: renderNotifier, setRoot, duration, maxCount, ...restNotifierProps } = props;
13
- const root = document.createElement('div');
13
+ const root = typeof document === 'undefined' ? null : document.createElement('div');
14
14
  const controllerRef = createRef();
15
15
  let currentConfig = {
16
16
  duration,
17
17
  maxCount,
18
18
  ...configProp,
19
19
  };
20
- if (setRoot) {
20
+ if (setRoot && root) {
21
21
  setRoot(root);
22
22
  }
23
23
  return {
24
24
  add(notifier) {
25
25
  var _a, _b;
26
+ if (root === null)
27
+ return 'NOT_SET';
26
28
  document.body.appendChild(root);
27
29
  const key = (_a = notifier.key) !== null && _a !== void 0 ? _a : Date.now();
28
30
  const resolvedNotifier = {
@@ -47,6 +49,8 @@ function createNotifier(props) {
47
49
  }
48
50
  },
49
51
  destroy() {
52
+ if (root === null)
53
+ return;
50
54
  unmountComponentAtNode(root);
51
55
  if (root.parentNode) {
52
56
  root.parentNode.removeChild(root);
package/Picker/usePickerValue.d.ts CHANGED
@@ -13,8 +13,8 @@ export declare type UsePickerValueProps = {
13
13
  export declare function usePickerValue({ defaultValue, format, formats, inputRef, value: valueProp, }: UsePickerValueProps): {
14
14
  inputValue: string;
15
15
  onBlur: FocusEventHandler<HTMLInputElement>;
16
- onChange: (val?: string | undefined) => void;
16
+ onChange: (val?: DateType) => void;
17
17
  onInputChange: import("react").ChangeEventHandler<HTMLInputElement>;
18
18
  onKeyDown: KeyboardEventHandler<HTMLInputElement>;
19
- value: string | undefined;
19
+ value: string;
20
20
  };
package/Picker/useRangePickerValue.d.ts CHANGED
@@ -9,7 +9,7 @@ export interface UseRangePickerValueProps extends Pick<UsePickerValueProps, 'for
9
9
  export declare function useRangePickerValue({ format, formats, inputFromRef, inputToRef, value: valueProp, }: UseRangePickerValueProps): {
10
10
  inputFromValue: string;
11
11
  inputToValue: string;
12
- onChange: (target?: RangePickerPickingValue<string> | undefined) => RangePickerPickingValue | undefined;
12
+ onChange: (target?: RangePickerPickingValue) => RangePickerPickingValue | undefined;
13
13
  onFromBlur: import("react").FocusEventHandler<HTMLInputElement>;
14
14
  onFromKeyDown: KeyboardEventHandler<HTMLInputElement>;
15
15
  onInputFromChange: ChangeEventHandler<HTMLInputElement>;
package/Radio/RadioGroupContext.d.ts CHANGED
@@ -6,4 +6,4 @@ export interface RadioGroupContextValue extends RadioGroupControlContextValue {
6
6
  name?: string;
7
7
  size?: RadioSize;
8
8
  }
9
- export declare const RadioGroupContext: import("react").Context<RadioGroupContextValue | undefined>;
9
+ export declare const RadioGroupContext: import("react").Context<RadioGroupContextValue>;
package/Select/Select.d.ts CHANGED
@@ -10,8 +10,9 @@ export interface SelectBaseProps extends Omit<SelectTriggerProps, 'active' | 'in
10
10
  maxHeight: 'menuMaxHeight';
11
11
  role: 'menuRole';
12
12
  size: 'menuSize';
13
- }>, PickRenameMulti<Pick<PopperProps, 'options'>, {
13
+ }>, PickRenameMulti<Pick<PopperProps, 'options' | 'disablePortal'>, {
14
14
  options: 'popperOptions';
15
+ disablePortal: 'disablePortal';
15
16
  }>, Pick<MenuProps, 'children'> {
16
17
  /**
17
18
  * The other native props for input element.
package/Select/Select.js CHANGED
@@ -16,7 +16,7 @@ const MENU_ID = 'mzn-select-menu-id';
16
16
  const Select = forwardRef(function Select(props, ref) {
17
17
  var _a, _b;
18
18
  const { disabled: disabledFromFormControl, fullWidth: fullWidthFromFormControl, required: requiredFromFormControl, severity, } = useContext(FormControlContext) || {};
19
- const { children, className, clearable = false, defaultValue, disabled = disabledFromFormControl || false, error = severity === 'error' || false, fullWidth = fullWidthFromFormControl || false, inputProps, inputRef, itemsInView = 4, menuMaxHeight, menuRole = 'listbox', menuSize, mode = 'single', onBlur, onChange: onChangeProp, onClear: onClearProp, onFocus, placeholder = '', popperOptions = {}, prefix, renderValue, required = requiredFromFormControl || false, size, suffixActionIcon, value: valueProp, } = props;
19
+ const { children, className, clearable = false, defaultValue, disabled = disabledFromFormControl || false, disablePortal = false, error = severity === 'error' || false, fullWidth = fullWidthFromFormControl || false, inputProps, inputRef, itemsInView = 4, menuMaxHeight, menuRole = 'listbox', menuSize, mode = 'single', onBlur, onChange: onChangeProp, onClear: onClearProp, onFocus, placeholder = '', popperOptions = {}, prefix, renderValue, required = requiredFromFormControl || false, size, suffixActionIcon, value: valueProp, } = props;
20
20
  const [open, toggleOpen] = useState(false);
21
21
  const onOpen = () => {
22
22
  onFocus === null || onFocus === void 0 ? void 0 : onFocus();
@@ -110,7 +110,7 @@ const Select = forwardRef(function Select(props, ref) {
110
110
  onChange,
111
111
  value,
112
112
  }), [onChange, value]);
113
- return (jsx(SelectControlContext.Provider, { value: context, children: jsxs("div", { ref: nodeRef, className: cx(selectClasses.host, fullWidth && selectClasses.hostFullWidth), children: [jsx(SelectTrigger, { ref: composedRef, active: open, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputRef: inputRef, mode: mode, onTagClose: onChange, onClear: onClear, onClick: onClickTextField, onKeyDown: onKeyDownTextField, prefix: prefix, readOnly: true, renderValue: renderValue, required: required, inputProps: resolvedInputProps, size: size, suffixActionIcon: suffixActionIcon, value: value }), jsx(InputTriggerPopper, { ref: popperRef, anchor: controlRef, className: selectClasses.popper, open: open, sameWidth: true, options: popperOptions, children: jsx(Menu, { id: MENU_ID, "aria-activedescendant": Array.isArray(value) ? (_b = (_a = value === null || value === void 0 ? void 0 : value[0]) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : '' : value === null || value === void 0 ? void 0 : value.id, itemsInView: itemsInView, maxHeight: menuMaxHeight, role: menuRole, size: menuSize, style: { border: 0 }, children: children }) })] }) }));
113
+ return (jsx(SelectControlContext.Provider, { value: context, children: jsxs("div", { ref: nodeRef, className: cx(selectClasses.host, fullWidth && selectClasses.hostFullWidth), children: [jsx(SelectTrigger, { ref: composedRef, active: open, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputRef: inputRef, mode: mode, onTagClose: onChange, onClear: onClear, onClick: onClickTextField, onKeyDown: onKeyDownTextField, prefix: prefix, readOnly: true, renderValue: renderValue, required: required, inputProps: resolvedInputProps, size: size, suffixActionIcon: suffixActionIcon, value: value }), jsx(InputTriggerPopper, { ref: popperRef, anchor: controlRef, className: selectClasses.popper, disablePortal: disablePortal, open: open, options: popperOptions, sameWidth: true, children: jsx(Menu, { id: MENU_ID, "aria-activedescendant": Array.isArray(value) ? (_b = (_a = value === null || value === void 0 ? void 0 : value[0]) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : '' : value === null || value === void 0 ? void 0 : value.id, itemsInView: itemsInView, maxHeight: menuMaxHeight, role: menuRole, size: menuSize, style: { border: 0 }, children: children }) })] }) }));
114
114
  });
115
115
  var Select$1 = Select;
116
116
 
package/Select/SelectControlContext.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  /// <reference types="react" />
2
2
  import { SelectControl } from './typings';
3
- export declare const SelectControlContext: import("react").Context<SelectControl | undefined>;
3
+ export declare const SelectControlContext: import("react").Context<SelectControl>;
package/Table/TableContext.d.ts CHANGED
@@ -34,13 +34,13 @@ export interface TableContextProps {
34
34
  fetchMore?: FetchMoreContext;
35
35
  pagination?: TablePagination;
36
36
  }
37
- export declare const TableContext: import("react").Context<TableContextProps | null>;
37
+ export declare const TableContext: import("react").Context<TableContextProps>;
38
38
  export interface TableDataContextProps {
39
39
  columns: TableColumn<TableRecord<unknown>>[];
40
40
  dataSource: TableDataSource[];
41
41
  }
42
- export declare const TableDataContext: import("react").Context<TableDataContextProps | null>;
42
+ export declare const TableDataContext: import("react").Context<TableDataContextProps>;
43
43
  export interface TableComponentContextProps {
44
44
  bodyCell?: any;
45
45
  }
46
- export declare const TableComponentContext: import("react").Context<TableComponentContextProps | null>;
46
+ export declare const TableComponentContext: import("react").Context<TableComponentContextProps>;
package/Table/useTableFetchMore.d.ts CHANGED
@@ -4,7 +4,7 @@ export interface UseTableFetchMore extends TableFetchMore {
4
4
  disabled?: boolean;
5
5
  }
6
6
  export declare function useTableFetchMore(props: UseTableFetchMore): {
7
- readonly fetchMore: (() => void) | undefined;
7
+ readonly fetchMore: () => void;
8
8
  readonly isFetching: boolean;
9
9
  readonly isReachEnd: boolean;
10
10
  };
package/Table/useTableScroll.d.ts CHANGED
@@ -1,272 +1,272 @@
1
1
  /// <reference types="react" />
2
2
  export default function useTableScroll(): readonly [{
3
- ref: import("react").RefObject<HTMLDivElement>;
3
+ ref: import("react").MutableRefObject<HTMLDivElement>;
4
4
  onScroll: () => void;
5
5
  }, {
6
- ref: import("react").RefObject<HTMLDivElement>;
6
+ ref: import("react").MutableRefObject<HTMLDivElement>;
7
7
  onMouseDown: ({ target, clientY }: any) => void;
8
8
  onMouseUp: () => void;
9
9
  onMouseEnter: () => void;
10
10
  onMouseLeave: () => void;
11
11
  style: {
12
12
  height: string;
13
- ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
14
- key?: import("react").Key | null | undefined;
15
- defaultChecked?: boolean | undefined;
16
- defaultValue?: string | number | readonly string[] | undefined;
17
- suppressContentEditableWarning?: boolean | undefined;
18
- suppressHydrationWarning?: boolean | undefined;
19
- accessKey?: string | undefined;
20
- className?: string | undefined;
21
- contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
22
- contextMenu?: string | undefined;
23
- dir?: string | undefined;
24
- draggable?: (boolean | "true" | "false") | undefined;
25
- hidden?: boolean | undefined;
26
- id?: string | undefined;
27
- lang?: string | undefined;
28
- placeholder?: string | undefined;
29
- slot?: string | undefined;
30
- spellCheck?: (boolean | "true" | "false") | undefined;
31
- style?: import("react").CSSProperties | undefined;
32
- tabIndex?: number | undefined;
33
- title?: string | undefined;
34
- translate?: "yes" | "no" | undefined;
35
- radioGroup?: string | undefined;
36
- role?: import("react").AriaRole | undefined;
37
- about?: string | undefined;
38
- datatype?: string | undefined;
13
+ ref?: import("react").LegacyRef<HTMLDivElement>;
14
+ key?: import("react").Key;
15
+ defaultChecked?: boolean;
16
+ defaultValue?: string | number | readonly string[];
17
+ suppressContentEditableWarning?: boolean;
18
+ suppressHydrationWarning?: boolean;
19
+ accessKey?: string;
20
+ className?: string;
21
+ contentEditable?: (boolean | "true" | "false") | "inherit";
22
+ contextMenu?: string;
23
+ dir?: string;
24
+ draggable?: boolean | "true" | "false";
25
+ hidden?: boolean;
26
+ id?: string;
27
+ lang?: string;
28
+ placeholder?: string;
29
+ slot?: string;
30
+ spellCheck?: boolean | "true" | "false";
31
+ style?: import("react").CSSProperties;
32
+ tabIndex?: number;
33
+ title?: string;
34
+ translate?: "yes" | "no";
35
+ radioGroup?: string;
36
+ role?: import("react").AriaRole;
37
+ about?: string;
38
+ datatype?: string;
39
39
  inlist?: any;
40
- prefix?: string | undefined;
41
- property?: string | undefined;
42
- resource?: string | undefined;
43
- typeof?: string | undefined;
44
- vocab?: string | undefined;
45
- autoCapitalize?: string | undefined;
46
- autoCorrect?: string | undefined;
47
- autoSave?: string | undefined;
48
- color?: string | undefined;
49
- itemProp?: string | undefined;
50
- itemScope?: boolean | undefined;
51
- itemType?: string | undefined;
52
- itemID?: string | undefined;
53
- itemRef?: string | undefined;
54
- results?: number | undefined;
55
- security?: string | undefined;
56
- unselectable?: "on" | "off" | undefined;
57
- inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
58
- is?: string | undefined;
59
- 'aria-activedescendant'?: string | undefined;
60
- 'aria-atomic'?: (boolean | "true" | "false") | undefined;
61
- 'aria-autocomplete'?: "none" | "list" | "inline" | "both" | undefined;
62
- 'aria-busy'?: (boolean | "true" | "false") | undefined;
63
- 'aria-checked'?: boolean | "true" | "false" | "mixed" | undefined;
64
- 'aria-colcount'?: number | undefined;
65
- 'aria-colindex'?: number | undefined;
66
- 'aria-colspan'?: number | undefined;
67
- 'aria-controls'?: string | undefined;
68
- 'aria-current'?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
69
- 'aria-describedby'?: string | undefined;
70
- 'aria-details'?: string | undefined;
71
- 'aria-disabled'?: (boolean | "true" | "false") | undefined;
72
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
73
- 'aria-errormessage'?: string | undefined;
74
- 'aria-expanded'?: (boolean | "true" | "false") | undefined;
75
- 'aria-flowto'?: string | undefined;
76
- 'aria-grabbed'?: (boolean | "true" | "false") | undefined;
77
- 'aria-haspopup'?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
78
- 'aria-hidden'?: (boolean | "true" | "false") | undefined;
79
- 'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
80
- 'aria-keyshortcuts'?: string | undefined;
81
- 'aria-label'?: string | undefined;
82
- 'aria-labelledby'?: string | undefined;
83
- 'aria-level'?: number | undefined;
84
- 'aria-live'?: "off" | "assertive" | "polite" | undefined;
85
- 'aria-modal'?: (boolean | "true" | "false") | undefined;
86
- 'aria-multiline'?: (boolean | "true" | "false") | undefined;
87
- 'aria-multiselectable'?: (boolean | "true" | "false") | undefined;
88
- 'aria-orientation'?: "horizontal" | "vertical" | undefined;
89
- 'aria-owns'?: string | undefined;
90
- 'aria-placeholder'?: string | undefined;
91
- 'aria-posinset'?: number | undefined;
92
- 'aria-pressed'?: boolean | "true" | "false" | "mixed" | undefined;
93
- 'aria-readonly'?: (boolean | "true" | "false") | undefined;
94
- 'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
95
- 'aria-required'?: (boolean | "true" | "false") | undefined;
96
- 'aria-roledescription'?: string | undefined;
97
- 'aria-rowcount'?: number | undefined;
98
- 'aria-rowindex'?: number | undefined;
99
- 'aria-rowspan'?: number | undefined;
100
- 'aria-selected'?: (boolean | "true" | "false") | undefined;
101
- 'aria-setsize'?: number | undefined;
102
- 'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
103
- 'aria-valuemax'?: number | undefined;
104
- 'aria-valuemin'?: number | undefined;
105
- 'aria-valuenow'?: number | undefined;
106
- 'aria-valuetext'?: string | undefined;
40
+ prefix?: string;
41
+ property?: string;
42
+ resource?: string;
43
+ typeof?: string;
44
+ vocab?: string;
45
+ autoCapitalize?: string;
46
+ autoCorrect?: string;
47
+ autoSave?: string;
48
+ color?: string;
49
+ itemProp?: string;
50
+ itemScope?: boolean;
51
+ itemType?: string;
52
+ itemID?: string;
53
+ itemRef?: string;
54
+ results?: number;
55
+ security?: string;
56
+ unselectable?: "on" | "off";
57
+ inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal";
58
+ is?: string;
59
+ 'aria-activedescendant'?: string;
60
+ 'aria-atomic'?: boolean | "true" | "false";
61
+ 'aria-autocomplete'?: "none" | "list" | "inline" | "both";
62
+ 'aria-busy'?: boolean | "true" | "false";
63
+ 'aria-checked'?: boolean | "true" | "false" | "mixed";
64
+ 'aria-colcount'?: number;
65
+ 'aria-colindex'?: number;
66
+ 'aria-colspan'?: number;
67
+ 'aria-controls'?: string;
68
+ 'aria-current'?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time";
69
+ 'aria-describedby'?: string;
70
+ 'aria-details'?: string;
71
+ 'aria-disabled'?: boolean | "true" | "false";
72
+ 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup";
73
+ 'aria-errormessage'?: string;
74
+ 'aria-expanded'?: boolean | "true" | "false";
75
+ 'aria-flowto'?: string;
76
+ 'aria-grabbed'?: boolean | "true" | "false";
77
+ 'aria-haspopup'?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree";
78
+ 'aria-hidden'?: boolean | "true" | "false";
79
+ 'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling";
80
+ 'aria-keyshortcuts'?: string;
81
+ 'aria-label'?: string;
82
+ 'aria-labelledby'?: string;
83
+ 'aria-level'?: number;
84
+ 'aria-live'?: "off" | "assertive" | "polite";
85
+ 'aria-modal'?: boolean | "true" | "false";
86
+ 'aria-multiline'?: boolean | "true" | "false";
87
+ 'aria-multiselectable'?: boolean | "true" | "false";
88
+ 'aria-orientation'?: "horizontal" | "vertical";
89
+ 'aria-owns'?: string;
90
+ 'aria-placeholder'?: string;
91
+ 'aria-posinset'?: number;
92
+ 'aria-pressed'?: boolean | "true" | "false" | "mixed";
93
+ 'aria-readonly'?: boolean | "true" | "false";
94
+ 'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
95
+ 'aria-required'?: boolean | "true" | "false";
96
+ 'aria-roledescription'?: string;
97
+ 'aria-rowcount'?: number;
98
+ 'aria-rowindex'?: number;
99
+ 'aria-rowspan'?: number;
100
+ 'aria-selected'?: boolean | "true" | "false";
101
+ 'aria-setsize'?: number;
102
+ 'aria-sort'?: "none" | "ascending" | "descending" | "other";
103
+ 'aria-valuemax'?: number;
104
+ 'aria-valuemin'?: number;
105
+ 'aria-valuenow'?: number;
106
+ 'aria-valuetext'?: string;
107
107
  children?: import("react").ReactNode;
108
108
  dangerouslySetInnerHTML?: {
109
109
  __html: string;
110
- } | undefined;
111
- onCopy?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
112
- onCopyCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
113
- onCut?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
114
- onCutCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
115
- onPaste?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
116
- onPasteCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
117
- onCompositionEnd?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
118
- onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
119
- onCompositionStart?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
120
- onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
121
- onCompositionUpdate?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
122
- onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
123
- onFocus?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
124
- onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
125
- onBlur?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
126
- onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
127
- onChange?: import("react").FormEventHandler<HTMLDivElement> | undefined;
128
- onChangeCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
129
- onBeforeInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
130
- onBeforeInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
131
- onInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
132
- onInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
133
- onReset?: import("react").FormEventHandler<HTMLDivElement> | undefined;
134
- onResetCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
135
- onSubmit?: import("react").FormEventHandler<HTMLDivElement> | undefined;
136
- onSubmitCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
137
- onInvalid?: import("react").FormEventHandler<HTMLDivElement> | undefined;
138
- onInvalidCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
139
- onLoad?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
140
- onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
141
- onError?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
142
- onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
143
- onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
144
- onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
145
- onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
146
- onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
147
- onKeyUp?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
148
- onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
149
- onAbort?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
150
- onAbortCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
151
- onCanPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
152
- onCanPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
153
- onCanPlayThrough?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
154
- onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
155
- onDurationChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
156
- onDurationChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
157
- onEmptied?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
158
- onEmptiedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
159
- onEncrypted?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
160
- onEncryptedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
161
- onEnded?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
162
- onEndedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
163
- onLoadedData?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
164
- onLoadedDataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
165
- onLoadedMetadata?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
166
- onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
167
- onLoadStart?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
168
- onLoadStartCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
169
- onPause?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
170
- onPauseCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
171
- onPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
172
- onPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
173
- onPlaying?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
174
- onPlayingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
175
- onProgress?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
176
- onProgressCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
177
- onRateChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
178
- onRateChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
179
- onSeeked?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
180
- onSeekedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
181
- onSeeking?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
182
- onSeekingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
183
- onStalled?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
184
- onStalledCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
185
- onSuspend?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
186
- onSuspendCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
187
- onTimeUpdate?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
188
- onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
189
- onVolumeChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
190
- onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
191
- onWaiting?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
192
- onWaitingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
193
- onAuxClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
194
- onAuxClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
195
- onClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
196
- onClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
197
- onContextMenu?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
198
- onContextMenuCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
199
- onDoubleClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
200
- onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
201
- onDrag?: import("react").DragEventHandler<HTMLDivElement> | undefined;
202
- onDragCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
203
- onDragEnd?: import("react").DragEventHandler<HTMLDivElement> | undefined;
204
- onDragEndCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
205
- onDragEnter?: import("react").DragEventHandler<HTMLDivElement> | undefined;
206
- onDragEnterCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
207
- onDragExit?: import("react").DragEventHandler<HTMLDivElement> | undefined;
208
- onDragExitCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
209
- onDragLeave?: import("react").DragEventHandler<HTMLDivElement> | undefined;
210
- onDragLeaveCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
211
- onDragOver?: import("react").DragEventHandler<HTMLDivElement> | undefined;
212
- onDragOverCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
213
- onDragStart?: import("react").DragEventHandler<HTMLDivElement> | undefined;
214
- onDragStartCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
215
- onDrop?: import("react").DragEventHandler<HTMLDivElement> | undefined;
216
- onDropCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
217
- onMouseDown?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
218
- onMouseDownCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
219
- onMouseEnter?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
220
- onMouseLeave?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
221
- onMouseMove?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
222
- onMouseMoveCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
223
- onMouseOut?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
224
- onMouseOutCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
225
- onMouseOver?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
226
- onMouseOverCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
227
- onMouseUp?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
228
- onMouseUpCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
229
- onSelect?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
230
- onSelectCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
231
- onTouchCancel?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
232
- onTouchCancelCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
233
- onTouchEnd?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
234
- onTouchEndCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
235
- onTouchMove?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
236
- onTouchMoveCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
237
- onTouchStart?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
238
- onTouchStartCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
239
- onPointerDown?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
240
- onPointerDownCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
241
- onPointerMove?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
242
- onPointerMoveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
243
- onPointerUp?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
244
- onPointerUpCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
245
- onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
246
- onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
247
- onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
248
- onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
249
- onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
250
- onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
251
- onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
252
- onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
253
- onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
254
- onPointerOutCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
255
- onGotPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
256
- onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
257
- onLostPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
258
- onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
259
- onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
260
- onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
261
- onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
262
- onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
263
- onAnimationStart?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
264
- onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
265
- onAnimationEnd?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
266
- onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
267
- onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
268
- onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
269
- onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
270
- onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
110
+ };
111
+ onCopy?: import("react").ClipboardEventHandler<HTMLDivElement>;
112
+ onCopyCapture?: import("react").ClipboardEventHandler<HTMLDivElement>;
113
+ onCut?: import("react").ClipboardEventHandler<HTMLDivElement>;
114
+ onCutCapture?: import("react").ClipboardEventHandler<HTMLDivElement>;
115
+ onPaste?: import("react").ClipboardEventHandler<HTMLDivElement>;
116
+ onPasteCapture?: import("react").ClipboardEventHandler<HTMLDivElement>;
117
+ onCompositionEnd?: import("react").CompositionEventHandler<HTMLDivElement>;
118
+ onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLDivElement>;
119
+ onCompositionStart?: import("react").CompositionEventHandler<HTMLDivElement>;
120
+ onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLDivElement>;
121
+ onCompositionUpdate?: import("react").CompositionEventHandler<HTMLDivElement>;
122
+ onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLDivElement>;
123
+ onFocus?: import("react").FocusEventHandler<HTMLDivElement>;
124
+ onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement>;
125
+ onBlur?: import("react").FocusEventHandler<HTMLDivElement>;
126
+ onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement>;
127
+ onChange?: import("react").FormEventHandler<HTMLDivElement>;
128
+ onChangeCapture?: import("react").FormEventHandler<HTMLDivElement>;
129
+ onBeforeInput?: import("react").FormEventHandler<HTMLDivElement>;
130
+ onBeforeInputCapture?: import("react").FormEventHandler<HTMLDivElement>;
131
+ onInput?: import("react").FormEventHandler<HTMLDivElement>;
132
+ onInputCapture?: import("react").FormEventHandler<HTMLDivElement>;
133
+ onReset?: import("react").FormEventHandler<HTMLDivElement>;
134
+ onResetCapture?: import("react").FormEventHandler<HTMLDivElement>;
135
+ onSubmit?: import("react").FormEventHandler<HTMLDivElement>;
136
+ onSubmitCapture?: import("react").FormEventHandler<HTMLDivElement>;
137
+ onInvalid?: import("react").FormEventHandler<HTMLDivElement>;
138
+ onInvalidCapture?: import("react").FormEventHandler<HTMLDivElement>;
139
+ onLoad?: import("react").ReactEventHandler<HTMLDivElement>;
140
+ onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement>;
141
+ onError?: import("react").ReactEventHandler<HTMLDivElement>;
142
+ onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement>;
143
+ onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement>;
144
+ onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement>;
145
+ onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement>;
146
+ onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement>;
147
+ onKeyUp?: import("react").KeyboardEventHandler<HTMLDivElement>;
148
+ onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLDivElement>;
149
+ onAbort?: import("react").ReactEventHandler<HTMLDivElement>;
150
+ onAbortCapture?: import("react").ReactEventHandler<HTMLDivElement>;
151
+ onCanPlay?: import("react").ReactEventHandler<HTMLDivElement>;
152
+ onCanPlayCapture?: import("react").ReactEventHandler<HTMLDivElement>;
153
+ onCanPlayThrough?: import("react").ReactEventHandler<HTMLDivElement>;
154
+ onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLDivElement>;
155
+ onDurationChange?: import("react").ReactEventHandler<HTMLDivElement>;
156
+ onDurationChangeCapture?: import("react").ReactEventHandler<HTMLDivElement>;
157
+ onEmptied?: import("react").ReactEventHandler<HTMLDivElement>;
158
+ onEmptiedCapture?: import("react").ReactEventHandler<HTMLDivElement>;
159
+ onEncrypted?: import("react").ReactEventHandler<HTMLDivElement>;
160
+ onEncryptedCapture?: import("react").ReactEventHandler<HTMLDivElement>;
161
+ onEnded?: import("react").ReactEventHandler<HTMLDivElement>;
162
+ onEndedCapture?: import("react").ReactEventHandler<HTMLDivElement>;
163
+ onLoadedData?: import("react").ReactEventHandler<HTMLDivElement>;
164
+ onLoadedDataCapture?: import("react").ReactEventHandler<HTMLDivElement>;
165
+ onLoadedMetadata?: import("react").ReactEventHandler<HTMLDivElement>;
166
+ onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLDivElement>;
167
+ onLoadStart?: import("react").ReactEventHandler<HTMLDivElement>;
168
+ onLoadStartCapture?: import("react").ReactEventHandler<HTMLDivElement>;
169
+ onPause?: import("react").ReactEventHandler<HTMLDivElement>;
170
+ onPauseCapture?: import("react").ReactEventHandler<HTMLDivElement>;
171
+ onPlay?: import("react").ReactEventHandler<HTMLDivElement>;
172
+ onPlayCapture?: import("react").ReactEventHandler<HTMLDivElement>;
173
+ onPlaying?: import("react").ReactEventHandler<HTMLDivElement>;
174
+ onPlayingCapture?: import("react").ReactEventHandler<HTMLDivElement>;
175
+ onProgress?: import("react").ReactEventHandler<HTMLDivElement>;
176
+ onProgressCapture?: import("react").ReactEventHandler<HTMLDivElement>;
177
+ onRateChange?: import("react").ReactEventHandler<HTMLDivElement>;
178
+ onRateChangeCapture?: import("react").ReactEventHandler<HTMLDivElement>;
179
+ onSeeked?: import("react").ReactEventHandler<HTMLDivElement>;
180
+ onSeekedCapture?: import("react").ReactEventHandler<HTMLDivElement>;
181
+ onSeeking?: import("react").ReactEventHandler<HTMLDivElement>;
182
+ onSeekingCapture?: import("react").ReactEventHandler<HTMLDivElement>;
183
+ onStalled?: import("react").ReactEventHandler<HTMLDivElement>;
184
+ onStalledCapture?: import("react").ReactEventHandler<HTMLDivElement>;
185
+ onSuspend?: import("react").ReactEventHandler<HTMLDivElement>;
186
+ onSuspendCapture?: import("react").ReactEventHandler<HTMLDivElement>;
187
+ onTimeUpdate?: import("react").ReactEventHandler<HTMLDivElement>;
188
+ onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLDivElement>;
189
+ onVolumeChange?: import("react").ReactEventHandler<HTMLDivElement>;
190
+ onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLDivElement>;
191
+ onWaiting?: import("react").ReactEventHandler<HTMLDivElement>;
192
+ onWaitingCapture?: import("react").ReactEventHandler<HTMLDivElement>;
193
+ onAuxClick?: import("react").MouseEventHandler<HTMLDivElement>;
194
+ onAuxClickCapture?: import("react").MouseEventHandler<HTMLDivElement>;
195
+ onClick?: import("react").MouseEventHandler<HTMLDivElement>;
196
+ onClickCapture?: import("react").MouseEventHandler<HTMLDivElement>;
197
+ onContextMenu?: import("react").MouseEventHandler<HTMLDivElement>;
198
+ onContextMenuCapture?: import("react").MouseEventHandler<HTMLDivElement>;
199
+ onDoubleClick?: import("react").MouseEventHandler<HTMLDivElement>;
200
+ onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDivElement>;
201
+ onDrag?: import("react").DragEventHandler<HTMLDivElement>;
202
+ onDragCapture?: import("react").DragEventHandler<HTMLDivElement>;
203
+ onDragEnd?: import("react").DragEventHandler<HTMLDivElement>;
204
+ onDragEndCapture?: import("react").DragEventHandler<HTMLDivElement>;
205
+ onDragEnter?: import("react").DragEventHandler<HTMLDivElement>;
206
+ onDragEnterCapture?: import("react").DragEventHandler<HTMLDivElement>;
207
+ onDragExit?: import("react").DragEventHandler<HTMLDivElement>;
208
+ onDragExitCapture?: import("react").DragEventHandler<HTMLDivElement>;
209
+ onDragLeave?: import("react").DragEventHandler<HTMLDivElement>;
210
+ onDragLeaveCapture?: import("react").DragEventHandler<HTMLDivElement>;
211
+ onDragOver?: import("react").DragEventHandler<HTMLDivElement>;
212
+ onDragOverCapture?: import("react").DragEventHandler<HTMLDivElement>;
213
+ onDragStart?: import("react").DragEventHandler<HTMLDivElement>;
214
+ onDragStartCapture?: import("react").DragEventHandler<HTMLDivElement>;
215
+ onDrop?: import("react").DragEventHandler<HTMLDivElement>;
216
+ onDropCapture?: import("react").DragEventHandler<HTMLDivElement>;
217
+ onMouseDown?: import("react").MouseEventHandler<HTMLDivElement>;
218
+ onMouseDownCapture?: import("react").MouseEventHandler<HTMLDivElement>;
219
+ onMouseEnter?: import("react").MouseEventHandler<HTMLDivElement>;
220
+ onMouseLeave?: import("react").MouseEventHandler<HTMLDivElement>;
221
+ onMouseMove?: import("react").MouseEventHandler<HTMLDivElement>;
222
+ onMouseMoveCapture?: import("react").MouseEventHandler<HTMLDivElement>;
223
+ onMouseOut?: import("react").MouseEventHandler<HTMLDivElement>;
224
+ onMouseOutCapture?: import("react").MouseEventHandler<HTMLDivElement>;
225
+ onMouseOver?: import("react").MouseEventHandler<HTMLDivElement>;
226
+ onMouseOverCapture?: import("react").MouseEventHandler<HTMLDivElement>;
227
+ onMouseUp?: import("react").MouseEventHandler<HTMLDivElement>;
228
+ onMouseUpCapture?: import("react").MouseEventHandler<HTMLDivElement>;
229
+ onSelect?: import("react").ReactEventHandler<HTMLDivElement>;
230
+ onSelectCapture?: import("react").ReactEventHandler<HTMLDivElement>;
231
+ onTouchCancel?: import("react").TouchEventHandler<HTMLDivElement>;
232
+ onTouchCancelCapture?: import("react").TouchEventHandler<HTMLDivElement>;
233
+ onTouchEnd?: import("react").TouchEventHandler<HTMLDivElement>;
234
+ onTouchEndCapture?: import("react").TouchEventHandler<HTMLDivElement>;
235
+ onTouchMove?: import("react").TouchEventHandler<HTMLDivElement>;
236
+ onTouchMoveCapture?: import("react").TouchEventHandler<HTMLDivElement>;
237
+ onTouchStart?: import("react").TouchEventHandler<HTMLDivElement>;
238
+ onTouchStartCapture?: import("react").TouchEventHandler<HTMLDivElement>;
239
+ onPointerDown?: import("react").PointerEventHandler<HTMLDivElement>;
240
+ onPointerDownCapture?: import("react").PointerEventHandler<HTMLDivElement>;
241
+ onPointerMove?: import("react").PointerEventHandler<HTMLDivElement>;
242
+ onPointerMoveCapture?: import("react").PointerEventHandler<HTMLDivElement>;
243
+ onPointerUp?: import("react").PointerEventHandler<HTMLDivElement>;
244
+ onPointerUpCapture?: import("react").PointerEventHandler<HTMLDivElement>;
245
+ onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement>;
246
+ onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement>;
247
+ onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement>;
248
+ onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement>;
249
+ onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement>;
250
+ onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement>;
251
+ onPointerOver?: import("react").PointerEventHandler<HTMLDivElement>;
252
+ onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement>;
253
+ onPointerOut?: import("react").PointerEventHandler<HTMLDivElement>;
254
+ onPointerOutCapture?: import("react").PointerEventHandler<HTMLDivElement>;
255
+ onGotPointerCapture?: import("react").PointerEventHandler<HTMLDivElement>;
256
+ onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement>;
257
+ onLostPointerCapture?: import("react").PointerEventHandler<HTMLDivElement>;
258
+ onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement>;
259
+ onScroll?: import("react").UIEventHandler<HTMLDivElement>;
260
+ onScrollCapture?: import("react").UIEventHandler<HTMLDivElement>;
261
+ onWheel?: import("react").WheelEventHandler<HTMLDivElement>;
262
+ onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement>;
263
+ onAnimationStart?: import("react").AnimationEventHandler<HTMLDivElement>;
264
+ onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDivElement>;
265
+ onAnimationEnd?: import("react").AnimationEventHandler<HTMLDivElement>;
266
+ onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement>;
267
+ onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement>;
268
+ onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement>;
269
+ onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement>;
270
+ onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement>;
271
271
  };
272
272
  }];
package/TextField/useTextFieldControl.d.ts CHANGED
@@ -5,6 +5,6 @@ export interface UseTextFieldControlProps {
5
5
  }
6
6
  export declare function useTextFieldControl(props: UseTextFieldControlProps): {
7
7
  role: string;
8
- onClick: MouseEventHandler<Element> | undefined;
9
- onKeyDown: KeyboardEventHandler<Element> | undefined;
8
+ onClick: MouseEventHandler<Element>;
9
+ onKeyDown: KeyboardEventHandler<Element>;
10
10
  };
package/Typography/Typography.d.ts CHANGED
@@ -38,6 +38,6 @@ export declare type TypographyProps<C extends TypographyComponent = 'p'> = Compo
38
38
  * The react component for `mezzanine` typography.
39
39
  */
40
40
  declare const Typography: import("react").ForwardRefExoticComponent<Omit<Omit<import("../utils/jsx-types").ComponentPropsWithoutKeyAndRef<"p">, keyof TypographyPropsBase> & TypographyPropsBase, "component"> & {
41
- component?: TypographyComponent | undefined;
41
+ component?: TypographyComponent;
42
42
  } & import("react").RefAttributes<HTMLParagraphElement>>;
43
43
  export default Typography;
package/Upload/UploadPictureWall.d.ts CHANGED
@@ -22,6 +22,10 @@ export interface UploadPictureWallBaseProps extends Omit<NativeElementPropsWitho
22
22
  * @default false
23
23
  */
24
24
  disabled?: boolean;
25
+ /**
26
+ * maximum file lengths
27
+ */
28
+ maxLength?: number;
25
29
  /**
26
30
  * Whether the input which is multiple.
27
31
  * @default true
package/Upload/UploadPictureWall.js CHANGED
@@ -9,7 +9,7 @@ import UploadPictureWallItem from './UploadPictureWallItem.js';
9
9
  import cx from 'clsx';
10
10
 
11
11
  const UploadPictureWall = forwardRef(function UploadPictureWall(props, ref) {
12
- const { accept = 'image/*', className, controllerRef, defaultValues, disabled = false, multiple = true, onChange, onDelete, onError, onMultiUpload, onUpload, onUploadSuccess, parallel = false, style, } = props;
12
+ const { accept = 'image/*', className, controllerRef, defaultValues, disabled = false, maxLength, multiple = true, onChange, onDelete, onError, onMultiUpload, onUpload, onUploadSuccess, parallel = false, style, } = props;
13
13
  const [uploadPictureImageLoaders, setUploadPictureImageLoader] = useState(defaultValues ? compact(defaultValues).map((value) => new ImageUploader(undefined, value)) : []);
14
14
  const [needUploadImageLoaders, setNeedUploadImageLoaders] = useState([]);
15
15
  const [needUploadImageLoaderSets, setNeedUploadImageLoaderSets] = useState([]);
@@ -24,8 +24,8 @@ const UploadPictureWall = forwardRef(function UploadPictureWall(props, ref) {
24
24
  }
25
25
  }, [onChange, prevValues, values]);
26
26
  useEffect(() => {
27
- if (prevNeedUploadImageLoadersLength > needUploadImageLoaders.length ||
28
- prevNeedUploadImageLoaderSetsLength > needUploadImageLoaderSets.length) {
27
+ if (prevNeedUploadImageLoadersLength > needUploadImageLoaders.length
28
+ || prevNeedUploadImageLoaderSetsLength > needUploadImageLoaderSets.length) {
29
29
  setValues(compact(uploadPictureImageLoaders.map((loader) => loader.getUrl())));
30
30
  }
31
31
  }, [
@@ -99,7 +99,9 @@ const UploadPictureWall = forwardRef(function UploadPictureWall(props, ref) {
99
99
  }, [needUploadImageLoaders, onError, onUpload, onUploadSuccess]);
100
100
  const onImagesUpload = useCallback((files) => {
101
101
  if (files.length) {
102
- const imageLoaders = files.map((file) => new ImageUploader(file));
102
+ const imageLoaders = files
103
+ .map((file) => new ImageUploader(file))
104
+ .slice(0, Math.max(0, (maxLength !== null && maxLength !== void 0 ? maxLength : 999999) - loaderList.length));
103
105
  setUploadPictureImageLoader((ups) => [...ups, ...imageLoaders]);
104
106
  if (onMultiUpload) {
105
107
  const uploadFiles = imageLoaders.map((loader) => loader.getFile());
@@ -134,7 +136,7 @@ const UploadPictureWall = forwardRef(function UploadPictureWall(props, ref) {
134
136
  }
135
137
  }
136
138
  }
137
- }, [onError, onMultiUpload, onUpload, onUploadSuccess, parallel]);
139
+ }, [onError, onMultiUpload, onUpload, onUploadSuccess, parallel, maxLength, loaderList]);
138
140
  const onImageDelete = useCallback((uid) => {
139
141
  setUploadPictureImageLoader((ups) => ups.filter((up) => up.getUid() !== uid));
140
142
  setNeedUploadImageLoaders((nUps) => nUps.filter((nUp) => nUp.getUid() !== uid));
@@ -148,7 +150,7 @@ const UploadPictureWall = forwardRef(function UploadPictureWall(props, ref) {
148
150
  useImperativeHandle(controllerRef, () => ({
149
151
  getAllData: () => uploadPictureImageLoaders.map((loader) => loader.getAll()),
150
152
  }));
151
- return (jsxs("div", { ref: ref, className: cx(uploadPictureWallClasses.host, className), style: style, children: [loaderList.map((up) => (jsx(UploadPictureWallItem, { accept: accept, disabled: disabled, imageLoader: up, multiple: multiple, onDelete: () => onImageDelete(up.getUid()) }, up.getUid()))), jsx(UploadPictureWallItem, { accept: accept, disabled: disabled, imageLoader: new ImageUploader(), multiple: multiple, onUpload: onImagesUpload })] }));
153
+ return (jsxs("div", { ref: ref, className: cx(uploadPictureWallClasses.host, className), style: style, children: [loaderList.map((up) => (jsx(UploadPictureWallItem, { accept: accept, disabled: disabled, imageLoader: up, multiple: multiple, onDelete: () => onImageDelete(up.getUid()) }, up.getUid()))), maxLength && loaderList.length >= maxLength ? null : (jsx(UploadPictureWallItem, { accept: accept, disabled: disabled, imageLoader: new ImageUploader(), multiple: multiple, onUpload: onImagesUpload }))] }));
152
154
  });
153
155
  var UploadPictureWall$1 = UploadPictureWall;
154
156
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mezzanine-ui/react",
3
- "version": "0.10.2",
3
+ "version": "0.10.5",
4
4
  "description": "React components for mezzanine-ui",
5
5
  "author": "Mezzanine",
6
6
  "repository": {
@@ -31,12 +31,13 @@
31
31
  "react-dom": "^17.0.2"
32
32
  },
33
33
  "dependencies": {
34
- "@mezzanine-ui/core": "^0.10.2",
34
+ "@mezzanine-ui/core": "^0.10.5",
35
35
  "@mezzanine-ui/icons": "^0.10.2",
36
36
  "@mezzanine-ui/system": "^0.7.0",
37
37
  "@popperjs/core": "^2.9.2",
38
38
  "@types/react-transition-group": "4.4.1",
39
39
  "clsx": "^1.1.1",
40
+ "lodash": "^4.17.21",
40
41
  "react-popper": "^2.2.5",
41
42
  "react-transition-group": "4.4.1",
42
43
  "tslib": "^2.1.0"
@@ -47,9 +48,9 @@
47
48
  "@testing-library/react-hooks": "^5.1.0",
48
49
  "@types/lodash": "^4.14.168",
49
50
  "@types/moment": "^2.13.0",
50
- "@types/react": "^17.0.43",
51
- "@types/react-dom": "^17.0.14",
52
- "@types/react-test-renderer": "^17.0.1",
51
+ "@types/react": "17.0.43",
52
+ "@types/react-dom": "17.0.14",
53
+ "@types/react-test-renderer": "17.0.1",
53
54
  "chromatic": "^5.10.1",
54
55
  "dayjs": "^1.10.7",
55
56
  "lodash": "^4.17.21",