react-magma-dom 4.9.1-next.0 → 4.9.2-next.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Combobox/index.d.ts +1 -14
- package/dist/components/Drawer/Drawer.d.ts +5 -0
- package/dist/components/Dropdown/DropdownButton.d.ts +5 -0
- package/dist/components/IconButton/index.d.ts +10 -1
- package/dist/components/Input/testUtils.d.ts +17 -0
- package/dist/components/Modal/Modal.d.ts +6 -1
- package/dist/components/Pagination/Pagination.d.ts +1 -0
- package/dist/components/Select/components.d.ts +1 -0
- package/dist/components/Select/index.d.ts +0 -13
- package/dist/components/SelectionControls/InputStyles.d.ts +0 -1
- package/dist/components/Toggle/index.d.ts +2 -2
- package/dist/components/TreeView/TreeItem.d.ts +3 -2
- package/dist/components/TreeView/useTreeItem.d.ts +4 -0
- package/dist/components/TreeView/useTreeView.d.ts +1 -0
- package/dist/components/TreeView/utils.d.ts +3 -1
- package/dist/esm/index.js +679 -307
- package/dist/esm/index.js.map +1 -1
- package/dist/hooks/useDeviceDetect.d.ts +6 -1
- package/dist/hooks/useMagmaFloating.d.ts +24 -0
- package/dist/index.d.ts +1 -0
- package/dist/properties.json +226 -112
- package/dist/react-magma-dom.cjs.development.js +677 -301
- package/dist/react-magma-dom.cjs.development.js.map +1 -1
- package/dist/react-magma-dom.cjs.production.min.js +1 -1
- package/dist/react-magma-dom.cjs.production.min.js.map +1 -1
- package/dist/utils/index.d.ts +2 -0
- package/package.json +1 -1
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ReferenceType } from '@floating-ui/react-dom';
|
|
3
2
|
import { UseComboboxProps, UseComboboxState, UseMultipleSelectionProps } from 'downshift';
|
|
4
3
|
import { InternalMultiProps, InternalSelectProps, SelectOptions } from '../Select';
|
|
5
4
|
import { Omit, XOR } from '../../utils';
|
|
@@ -14,7 +13,7 @@ export interface ComboboxProps<T extends SelectOptions> extends Omit<UseCombobox
|
|
|
14
13
|
*/
|
|
15
14
|
containerStyle?: React.CSSProperties;
|
|
16
15
|
/**
|
|
17
|
-
* Default selectable options. Allows for uncontrolled component and internal creation of items. Can be an array of strings or objects
|
|
16
|
+
* Default selectable options. Allows for an uncontrolled component and internal creation of items. Can be an array of strings or objects
|
|
18
17
|
*/
|
|
19
18
|
defaultItems?: T[];
|
|
20
19
|
/**
|
|
@@ -22,10 +21,6 @@ export interface ComboboxProps<T extends SelectOptions> extends Omit<UseCombobox
|
|
|
22
21
|
* @default false
|
|
23
22
|
*/
|
|
24
23
|
disableCreateItem?: boolean;
|
|
25
|
-
/**
|
|
26
|
-
* @internal
|
|
27
|
-
*/
|
|
28
|
-
floatingElementStyles?: React.CSSProperties;
|
|
29
24
|
/**
|
|
30
25
|
* @internal
|
|
31
26
|
*/
|
|
@@ -98,14 +93,6 @@ export interface ComboboxProps<T extends SelectOptions> extends Omit<UseCombobox
|
|
|
98
93
|
* Event that fires when a new item is created with the create item option is clicked in the item list menu
|
|
99
94
|
*/
|
|
100
95
|
onItemCreated?: (newItem: T) => void;
|
|
101
|
-
/**
|
|
102
|
-
* @internal
|
|
103
|
-
*/
|
|
104
|
-
setFloating?: (node: ReferenceType) => void;
|
|
105
|
-
/**
|
|
106
|
-
* @internal
|
|
107
|
-
*/
|
|
108
|
-
setReference?: (node: ReferenceType) => void;
|
|
109
96
|
/**
|
|
110
97
|
* Reference to the toggle button element wrapping the input in the combobox
|
|
111
98
|
*/
|
|
@@ -27,6 +27,11 @@ export interface DrawerProps extends Omit<ModalProps, 'size'> {
|
|
|
27
27
|
* @default DrawerPosition.top
|
|
28
28
|
*/
|
|
29
29
|
position?: DrawerPosition;
|
|
30
|
+
/**
|
|
31
|
+
* Shows a background overlay when the drawer is open.
|
|
32
|
+
* @default true
|
|
33
|
+
*/
|
|
34
|
+
showBackgroundOverlay?: boolean;
|
|
30
35
|
isInverse?: boolean;
|
|
31
36
|
}
|
|
32
37
|
export declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -23,6 +23,10 @@ export interface IconTextDropdownButtonProps extends ButtonProps {
|
|
|
23
23
|
* @default ButtonIconPosition.right
|
|
24
24
|
*/
|
|
25
25
|
iconPosition?: ButtonIconPosition;
|
|
26
|
+
/**
|
|
27
|
+
* Leading icon to display on the left side within the component
|
|
28
|
+
*/
|
|
29
|
+
leadingIcon?: React.ReactElement<IconProps>;
|
|
26
30
|
/**
|
|
27
31
|
* The content of the component
|
|
28
32
|
*/
|
|
@@ -32,4 +36,5 @@ export declare type DropdownButtonProps = XOR<IconOnlyDropdownButtonProps, IconT
|
|
|
32
36
|
export declare const DropdownButton: React.ForwardRefExoticComponent<({} & IconTextDropdownButtonProps & React.RefAttributes<HTMLButtonElement>) | ({
|
|
33
37
|
children?: never;
|
|
34
38
|
iconPosition?: never;
|
|
39
|
+
leadingIcon?: never;
|
|
35
40
|
} & IconOnlyDropdownButtonProps & React.RefAttributes<HTMLButtonElement>)>;
|
|
@@ -21,19 +21,28 @@ export interface IconTextButtonProps extends ButtonProps {
|
|
|
21
21
|
* Icon to display within the component
|
|
22
22
|
*/
|
|
23
23
|
icon: React.ReactElement<IconProps>;
|
|
24
|
-
children: React.ReactChild | React.ReactChild[];
|
|
25
24
|
/**
|
|
26
25
|
* Position within the button for the icon to appear
|
|
27
26
|
* @default ButtonIconPosition.right
|
|
28
27
|
*/
|
|
29
28
|
iconPosition?: ButtonIconPosition;
|
|
29
|
+
/**
|
|
30
|
+
* Leading icon to display on the left side of the button
|
|
31
|
+
*/
|
|
32
|
+
leadingIcon?: React.ReactElement<IconProps>;
|
|
33
|
+
/**
|
|
34
|
+
* The content of the component
|
|
35
|
+
*/
|
|
36
|
+
children: React.ReactChild | React.ReactChild[];
|
|
30
37
|
}
|
|
31
38
|
export declare type IconButtonProps = XOR<IconOnlyButtonProps, IconTextButtonProps>;
|
|
32
39
|
export interface SpanProps {
|
|
40
|
+
hasIconLeading?: boolean;
|
|
33
41
|
size?: ButtonSize;
|
|
34
42
|
}
|
|
35
43
|
export declare function instanceOfIconOnly(object: any): object is IconOnlyButtonProps;
|
|
36
44
|
export declare const IconButton: React.ForwardRefExoticComponent<({} & IconTextButtonProps & React.RefAttributes<HTMLButtonElement>) | ({
|
|
37
45
|
children?: never;
|
|
38
46
|
iconPosition?: never;
|
|
47
|
+
leadingIcon?: never;
|
|
39
48
|
} & IconOnlyButtonProps & React.RefAttributes<HTMLButtonElement>)>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const CustomTopicsRow: ({ topicList, isRemoveButtonDisabled, shouldValidate, topicTitle, testTopic, studyMaterialsTopic, order, setTopicTitle, setTestTopic, setStudyMaterialsTopic, removeTopicRow, }: {
|
|
3
|
+
topicList: {
|
|
4
|
+
reference: string;
|
|
5
|
+
title: string;
|
|
6
|
+
}[];
|
|
7
|
+
isRemoveButtonDisabled: boolean;
|
|
8
|
+
shouldValidate?: boolean;
|
|
9
|
+
topicTitle: string;
|
|
10
|
+
testTopic?: string;
|
|
11
|
+
studyMaterialsTopic?: string;
|
|
12
|
+
order: number;
|
|
13
|
+
setTopicTitle: (title: string) => void;
|
|
14
|
+
setTestTopic: (reference: string) => void;
|
|
15
|
+
setStudyMaterialsTopic: (reference: string) => void;
|
|
16
|
+
removeTopicRow: () => void;
|
|
17
|
+
}) => React.JSX.Element;
|
|
@@ -46,7 +46,7 @@ export interface ModalProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
46
46
|
*/
|
|
47
47
|
isBackgroundClickDisabled?: boolean;
|
|
48
48
|
/**
|
|
49
|
-
* If true, the close button the
|
|
49
|
+
* If true, the close button the modal will be suppressed
|
|
50
50
|
* @default false
|
|
51
51
|
*/
|
|
52
52
|
isCloseButtonHidden?: boolean;
|
|
@@ -83,6 +83,11 @@ export interface ModalProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
83
83
|
* @default ModalSize.medium
|
|
84
84
|
*/
|
|
85
85
|
size?: ModalSize;
|
|
86
|
+
/**
|
|
87
|
+
* @internal
|
|
88
|
+
* @default true
|
|
89
|
+
*/
|
|
90
|
+
showBackgroundOverlay?: boolean;
|
|
86
91
|
/**
|
|
87
92
|
* @internal
|
|
88
93
|
*/
|
|
@@ -92,6 +92,7 @@ export declare const NavButton: import("@emotion/styled").StyledComponent<({} &
|
|
|
92
92
|
}) | ({
|
|
93
93
|
children?: never;
|
|
94
94
|
iconPosition?: never;
|
|
95
|
+
leadingIcon?: never;
|
|
95
96
|
} & import("../IconButton").IconOnlyButtonProps & React.RefAttributes<HTMLButtonElement> & {
|
|
96
97
|
theme?: import("@emotion/react").Theme;
|
|
97
98
|
}), {}, {}>;
|
|
@@ -27,6 +27,7 @@ export declare function defaultComponents<T>(props: SelectComponents<T>): {
|
|
|
27
27
|
ClearIndicator: React.FunctionComponent<({} & import("../IconButton").IconTextButtonProps) | ({
|
|
28
28
|
children?: never;
|
|
29
29
|
iconPosition?: never;
|
|
30
|
+
leadingIcon?: never;
|
|
30
31
|
} & import("../IconButton").IconOnlyButtonProps)> | ((props: any) => React.JSX.Element);
|
|
31
32
|
DropdownIndicator: React.FunctionComponent<Partial<IconProps>> | ((props: any) => React.JSX.Element);
|
|
32
33
|
LoadingIndicator: React.FunctionComponent<SpinnerProps> | ((props: any) => React.JSX.Element);
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { ReferenceType } from '@floating-ui/react-dom/dist/floating-ui.react-dom';
|
|
3
2
|
import { UseMultipleSelectionProps, UseSelectProps } from 'downshift';
|
|
4
3
|
import { Omit, XOR } from '../../utils';
|
|
5
4
|
import { LabelPosition } from '../Label';
|
|
@@ -108,10 +107,6 @@ export interface SelectProps<T extends SelectOptions> extends UseSelectProps<T>,
|
|
|
108
107
|
* Id of the element that describes the select trigger button
|
|
109
108
|
*/
|
|
110
109
|
ariaDescribedBy?: string;
|
|
111
|
-
/**
|
|
112
|
-
* @internal
|
|
113
|
-
*/
|
|
114
|
-
floatingElementStyles?: React.CSSProperties;
|
|
115
110
|
/**
|
|
116
111
|
* @internal
|
|
117
112
|
*/
|
|
@@ -148,14 +143,6 @@ export interface SelectProps<T extends SelectOptions> extends UseSelectProps<T>,
|
|
|
148
143
|
* Event that will fire when a keypress is released while focused on the trigger button
|
|
149
144
|
*/
|
|
150
145
|
onKeyUp?: (event: React.KeyboardEvent) => void;
|
|
151
|
-
/**
|
|
152
|
-
* @internal
|
|
153
|
-
*/
|
|
154
|
-
setFloating?: (node: ReferenceType) => void;
|
|
155
|
-
/**
|
|
156
|
-
* @internal
|
|
157
|
-
*/
|
|
158
|
-
setReference?: (node: ReferenceType) => void;
|
|
159
146
|
}
|
|
160
147
|
export interface MultiSelectProps<T extends SelectOptions> extends UseMultipleSelectionProps<T>, Omit<SelectProps<T>, 'onStateChange' | 'stateReducer' | 'isMulti'>, InternalMultiProps<T> {
|
|
161
148
|
/**
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
export declare const DisplayInputStyles: (props: any) => import("@emotion/react").SerializedStyles;
|
|
2
|
-
export declare const DisplayInputActiveStyles: import("@emotion/react").SerializedStyles;
|
|
3
2
|
export declare function buildDisplayInputActiveBackground(props: any): any;
|
|
4
3
|
export declare function buildDisplayInputBorderColor(props: any): any;
|
|
5
4
|
export declare function buildDisplayInputFocusStyles(props: any): import("@emotion/react").SerializedStyles;
|
|
@@ -6,7 +6,7 @@ export declare enum ToggleTextPosition {
|
|
|
6
6
|
}
|
|
7
7
|
export interface ToggleProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
8
8
|
/**
|
|
9
|
-
* If true, element is checked (i.e
|
|
9
|
+
* If true, an element is checked (i.e., selected)
|
|
10
10
|
* @default false
|
|
11
11
|
*/
|
|
12
12
|
checked?: boolean;
|
|
@@ -29,7 +29,7 @@ export interface ToggleProps extends React.InputHTMLAttributes<HTMLInputElement>
|
|
|
29
29
|
hasError?: boolean;
|
|
30
30
|
isInverse?: boolean;
|
|
31
31
|
/**
|
|
32
|
-
* If true, label text will be hidden visually, but will still be read by assistive technology
|
|
32
|
+
* If true, a label text will be hidden visually, but will still be read by assistive technology
|
|
33
33
|
* @default false
|
|
34
34
|
*/
|
|
35
35
|
isTextVisuallyHidden?: boolean;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { UseTreeItemProps } from './useTreeItem';
|
|
3
|
-
export
|
|
4
|
-
|
|
3
|
+
export interface TreeItemProps extends UseTreeItemProps {
|
|
4
|
+
}
|
|
5
|
+
export declare const TreeItem: React.ForwardRefExoticComponent<TreeItemProps & React.RefAttributes<HTMLLIElement>>;
|
|
@@ -2,6 +2,10 @@ import * as React from 'react';
|
|
|
2
2
|
import { IconProps } from 'react-magma-icons';
|
|
3
3
|
import { IndeterminateCheckboxStatus } from '../IndeterminateCheckbox';
|
|
4
4
|
export interface UseTreeItemProps extends React.HTMLAttributes<HTMLLIElement> {
|
|
5
|
+
/**
|
|
6
|
+
* Enables additional content within the TreeItem.
|
|
7
|
+
*/
|
|
8
|
+
additionalContent?: React.ReactNode;
|
|
5
9
|
/**
|
|
6
10
|
* Index number
|
|
7
11
|
* private
|
|
@@ -34,7 +34,9 @@ export declare const getChildrenIds: ({ items, itemId, }: {
|
|
|
34
34
|
items: TreeViewItemInterface[];
|
|
35
35
|
itemId: TreeViewItemInterface['itemId'];
|
|
36
36
|
}) => any;
|
|
37
|
-
export declare const getInitialItems: ({ children, preselectedItems: rawPreselectedItems, checkParents, checkChildren, selectable, isDisabled: isTreeViewDisabled, isTopLevelSelectable, }: Pick<UseTreeViewProps,
|
|
37
|
+
export declare const getInitialItems: ({ children, preselectedItems: rawPreselectedItems, checkParents, checkChildren, selectable, isDisabled: isTreeViewDisabled, isTopLevelSelectable, items, }: Pick<UseTreeViewProps, "isDisabled" | "checkChildren" | "selectable" | "preselectedItems" | "checkParents" | "children" | "isTopLevelSelectable"> & {
|
|
38
|
+
items?: TreeViewItemInterface[];
|
|
39
|
+
}) => any;
|
|
38
40
|
export declare const selectSingle: ({ items, itemId, checkedStatus, }: {
|
|
39
41
|
items: TreeViewItemInterface[];
|
|
40
42
|
itemId: TreeViewItemInterface['itemId'];
|