@devopness/ui-react 2.153.2 → 2.155.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.
|
@@ -4,6 +4,7 @@ import { InjectedProps as PopupStateProps } from 'material-ui-popup-state';
|
|
|
4
4
|
import { Color } from '../../../colors';
|
|
5
5
|
import { ButtonProps } from '../../Buttons';
|
|
6
6
|
import { IconProps } from '../Icon';
|
|
7
|
+
import { LinkProps } from '../Link';
|
|
7
8
|
import { TooltipProps } from '../Tooltip';
|
|
8
9
|
import { Unwrap } from '../../types';
|
|
9
10
|
type DropdownOptionIcon = Unwrap<Partial<Pick<IconProps, 'name' | 'size'>> & Pick<React.CSSProperties, 'backgroundColor' | 'color'>> & {
|
|
@@ -14,9 +15,9 @@ type DropdownOptionLetter = Unwrap<Pick<React.CSSProperties, 'backgroundColor' |
|
|
|
14
15
|
};
|
|
15
16
|
type DropdownOption = {
|
|
16
17
|
/**
|
|
17
|
-
*
|
|
18
|
+
* Background Color to use when option is active
|
|
18
19
|
*/
|
|
19
|
-
|
|
20
|
+
activeBackgroundColor?: Color;
|
|
20
21
|
/**
|
|
21
22
|
* Option Badge configuration
|
|
22
23
|
*
|
|
@@ -24,31 +25,37 @@ type DropdownOption = {
|
|
|
24
25
|
*/
|
|
25
26
|
badge?: DropdownOptionIcon | DropdownOptionLetter;
|
|
26
27
|
/**
|
|
27
|
-
*
|
|
28
|
+
* Add separator from previous options
|
|
28
29
|
*/
|
|
29
|
-
|
|
30
|
+
brokenSequence?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Label text color
|
|
33
|
+
*
|
|
34
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/color}
|
|
35
|
+
*/
|
|
36
|
+
color?: Color;
|
|
30
37
|
/**
|
|
31
38
|
* Highlight option
|
|
32
39
|
*/
|
|
33
40
|
isActive?: boolean;
|
|
34
41
|
/**
|
|
35
|
-
*
|
|
42
|
+
* Disables option
|
|
36
43
|
*/
|
|
37
|
-
|
|
44
|
+
isDisabled?: boolean;
|
|
38
45
|
/**
|
|
39
|
-
*
|
|
46
|
+
* Option description
|
|
40
47
|
*/
|
|
41
|
-
|
|
48
|
+
label?: string;
|
|
42
49
|
/**
|
|
43
|
-
*
|
|
50
|
+
* Link properties
|
|
44
51
|
*
|
|
45
52
|
* @see {Link}
|
|
46
53
|
*/
|
|
47
|
-
|
|
54
|
+
linkProps?: LinkProps;
|
|
48
55
|
/**
|
|
49
|
-
*
|
|
56
|
+
* Event handler called when this option is clicked.
|
|
50
57
|
*/
|
|
51
|
-
|
|
58
|
+
onClick?: () => null;
|
|
52
59
|
/**
|
|
53
60
|
* Tooltip's title
|
|
54
61
|
*
|
|
@@ -56,11 +63,11 @@ type DropdownOption = {
|
|
|
56
63
|
*/
|
|
57
64
|
tooltip?: TooltipProps['title'];
|
|
58
65
|
/**
|
|
59
|
-
*
|
|
66
|
+
* Transforms label to a Link and point user to this url
|
|
60
67
|
*
|
|
61
|
-
* @see {
|
|
68
|
+
* @see {Link}
|
|
62
69
|
*/
|
|
63
|
-
|
|
70
|
+
url?: string;
|
|
64
71
|
};
|
|
65
72
|
type DropdownSharedProps = {
|
|
66
73
|
/**
|
|
@@ -75,45 +82,45 @@ type DropdownSharedProps = {
|
|
|
75
82
|
* help: https://mui.com/material-ui/react-popover/#anchor-playground
|
|
76
83
|
*/
|
|
77
84
|
anchorOrigin?: PopoverOrigin;
|
|
78
|
-
/**
|
|
79
|
-
* This is the point on the popover which
|
|
80
|
-
* will attach to the anchor's origin.
|
|
81
|
-
*
|
|
82
|
-
* Options:
|
|
83
|
-
* vertical: [top, center, bottom, x(px)];
|
|
84
|
-
* horizontal: [left, center, right, x(px)].
|
|
85
|
-
*
|
|
86
|
-
* help: https://mui.com/material-ui/react-popover/#anchor-playground
|
|
87
|
-
*/
|
|
88
|
-
transformOrigin?: PopoverOrigin;
|
|
89
85
|
/**
|
|
90
86
|
* The unique id to identify the dropdown anchor element.
|
|
91
87
|
*/
|
|
92
88
|
id: string;
|
|
93
89
|
/**
|
|
94
|
-
*
|
|
90
|
+
* Event handler called when a dropdown option is selected.
|
|
91
|
+
*
|
|
92
|
+
* This prop can be overriden using option.onClick
|
|
95
93
|
*
|
|
96
94
|
* @see {DropdownOption}
|
|
97
95
|
*/
|
|
98
|
-
|
|
96
|
+
onSelect?: (itemClicked: DropdownOption) => void;
|
|
99
97
|
/**
|
|
100
98
|
* Event handler called when the dropdown is opened or closed.
|
|
101
99
|
*/
|
|
102
100
|
onToggle?: (popupState: PopupStateProps) => void;
|
|
103
101
|
/**
|
|
104
|
-
*
|
|
105
|
-
*
|
|
106
|
-
* This prop can be overriden using option.onClick
|
|
102
|
+
* Options listed in the Dropdown menu popup.
|
|
107
103
|
*
|
|
108
104
|
* @see {DropdownOption}
|
|
109
105
|
*/
|
|
110
|
-
|
|
106
|
+
options: DropdownOption[] | undefined;
|
|
111
107
|
/**
|
|
112
108
|
* Tooltip's title
|
|
113
109
|
*
|
|
114
110
|
* @see {Tooltip}
|
|
115
111
|
*/
|
|
116
112
|
tooltip?: TooltipProps['title'];
|
|
113
|
+
/**
|
|
114
|
+
* This is the point on the popover which
|
|
115
|
+
* will attach to the anchor's origin.
|
|
116
|
+
*
|
|
117
|
+
* Options:
|
|
118
|
+
* vertical: [top, center, bottom, x(px)];
|
|
119
|
+
* horizontal: [left, center, right, x(px)].
|
|
120
|
+
*
|
|
121
|
+
* @see {@link https://mui.com/material-ui/react-popover/#anchor-playground}
|
|
122
|
+
*/
|
|
123
|
+
transformOrigin?: PopoverOrigin;
|
|
117
124
|
};
|
|
118
125
|
type DropdownVariationButtonProps = DropdownSharedProps & {
|
|
119
126
|
/**
|
|
@@ -122,6 +129,13 @@ type DropdownVariationButtonProps = DropdownSharedProps & {
|
|
|
122
129
|
* @see {Button}
|
|
123
130
|
*/
|
|
124
131
|
anchorType: 'button';
|
|
132
|
+
/**
|
|
133
|
+
* Button properties
|
|
134
|
+
*
|
|
135
|
+
* @see {Button}
|
|
136
|
+
*/
|
|
137
|
+
buttonProps?: ButtonProps;
|
|
138
|
+
content?: never;
|
|
125
139
|
/**
|
|
126
140
|
* Hide dropdown arrow icon
|
|
127
141
|
*/
|
|
@@ -130,19 +144,12 @@ type DropdownVariationButtonProps = DropdownSharedProps & {
|
|
|
130
144
|
* Hide dropdown label text
|
|
131
145
|
*/
|
|
132
146
|
hideLabel?: boolean;
|
|
133
|
-
/**
|
|
134
|
-
* Button properties
|
|
135
|
-
*
|
|
136
|
-
* @see {Button}
|
|
137
|
-
*/
|
|
138
|
-
buttonProps?: ButtonProps;
|
|
139
147
|
/**
|
|
140
148
|
* Button label
|
|
141
149
|
*
|
|
142
150
|
* Default value: 'Open Popover'
|
|
143
151
|
*/
|
|
144
152
|
label?: string | React.JSX.Element;
|
|
145
|
-
content?: never;
|
|
146
153
|
};
|
|
147
154
|
type DropdownVariationContainerProps = DropdownSharedProps & {
|
|
148
155
|
/**
|
|
@@ -160,6 +167,6 @@ type DropdownProps = DropdownVariationContainerProps | DropdownVariationButtonPr
|
|
|
160
167
|
/**
|
|
161
168
|
* Display a menu with a list of options
|
|
162
169
|
*/
|
|
163
|
-
declare const Dropdown: ({
|
|
170
|
+
declare const Dropdown: ({ anchorType, content, onSelect, onToggle, ...props }: DropdownProps) => import("react/jsx-runtime").JSX.Element;
|
|
164
171
|
export type { DropdownOption, DropdownProps };
|
|
165
172
|
export { Dropdown };
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import { DropdownOption } from './Dropdown';
|
|
2
|
-
import { Color } from '../../../colors';
|
|
3
2
|
type StyledProps = {
|
|
4
|
-
brokenSequence
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
declare const
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
declare const
|
|
15
|
-
declare const
|
|
16
|
-
declare const
|
|
3
|
+
[Key in keyof Pick<DropdownOption, 'activeBackgroundColor' | 'brokenSequence' | 'isActive' | 'color'> as `$${Key}`]: DropdownOption[Key];
|
|
4
|
+
} & {
|
|
5
|
+
disabled: DropdownOption['isDisabled'];
|
|
6
|
+
};
|
|
7
|
+
declare const MenuContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
8
|
+
declare const MenuOption: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<StyledProps, "disabled" | "$activeBackgroundColor" | "$brokenSequence" | "$isActive">>> & string;
|
|
9
|
+
declare const Text: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<StyledProps, "$color">>> & string;
|
|
10
|
+
type ContentBadgeProps = {
|
|
11
|
+
[Key in keyof Pick<NonNullable<DropdownOption['badge']>, 'backgroundColor'> as `$${Key}`]: NonNullable<DropdownOption['badge']>[Key];
|
|
12
|
+
};
|
|
13
|
+
declare const ContentBadge: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Pick<ContentBadgeProps, "$backgroundColor">>> & string;
|
|
14
|
+
declare const ClickableContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
15
|
+
declare const Grid: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
16
|
+
declare const Wrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
17
17
|
export { MenuContainer, MenuOption, Text, ContentBadge, ClickableContainer, Grid, Wrapper, };
|
|
@@ -279,7 +279,7 @@ declare const iconList: readonly [{
|
|
|
279
279
|
readonly component: string;
|
|
280
280
|
}, {
|
|
281
281
|
readonly type: "image";
|
|
282
|
-
readonly accessor: "
|
|
282
|
+
readonly accessor: "github-white";
|
|
283
283
|
readonly component: string;
|
|
284
284
|
}, {
|
|
285
285
|
readonly type: "image";
|
|
@@ -291,16 +291,24 @@ declare const iconList: readonly [{
|
|
|
291
291
|
readonly component: string;
|
|
292
292
|
}, {
|
|
293
293
|
readonly type: "image";
|
|
294
|
-
readonly accessor: "
|
|
294
|
+
readonly accessor: "bitbucket-white";
|
|
295
295
|
readonly component: string;
|
|
296
296
|
}, {
|
|
297
297
|
readonly type: "image";
|
|
298
298
|
readonly accessor: "docker";
|
|
299
299
|
readonly component: string;
|
|
300
|
+
}, {
|
|
301
|
+
readonly type: "image";
|
|
302
|
+
readonly accessor: "c-sharp";
|
|
303
|
+
readonly component: string;
|
|
300
304
|
}, {
|
|
301
305
|
readonly type: "image";
|
|
302
306
|
readonly accessor: "dotnetcore";
|
|
303
307
|
readonly component: string;
|
|
308
|
+
}, {
|
|
309
|
+
readonly type: "image";
|
|
310
|
+
readonly accessor: "dotnetcore-aspnetcore";
|
|
311
|
+
readonly component: string;
|
|
304
312
|
}, {
|
|
305
313
|
readonly type: "image";
|
|
306
314
|
readonly accessor: "html";
|
|
@@ -313,17 +321,25 @@ declare const iconList: readonly [{
|
|
|
313
321
|
readonly type: "image";
|
|
314
322
|
readonly accessor: "php";
|
|
315
323
|
readonly component: string;
|
|
324
|
+
}, {
|
|
325
|
+
readonly type: "image";
|
|
326
|
+
readonly accessor: "php-laravel";
|
|
327
|
+
readonly component: string;
|
|
316
328
|
}, {
|
|
317
329
|
readonly type: "image";
|
|
318
330
|
readonly accessor: "python";
|
|
319
331
|
readonly component: string;
|
|
320
332
|
}, {
|
|
321
333
|
readonly type: "image";
|
|
322
|
-
readonly accessor: "
|
|
334
|
+
readonly accessor: "python-django";
|
|
335
|
+
readonly component: string;
|
|
336
|
+
}, {
|
|
337
|
+
readonly type: "image";
|
|
338
|
+
readonly accessor: "python-flask";
|
|
323
339
|
readonly component: string;
|
|
324
340
|
}, {
|
|
325
341
|
readonly type: "image";
|
|
326
|
-
readonly accessor: "
|
|
342
|
+
readonly accessor: "python-fastapi";
|
|
327
343
|
readonly component: string;
|
|
328
344
|
}, {
|
|
329
345
|
readonly type: "image";
|