react-science 0.28.1 → 0.30.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/lib-esm/app/hooks/file-loading.d.ts +2 -1
- package/lib-esm/app/hooks/file-loading.d.ts.map +1 -1
- package/lib-esm/app/hooks/file-loading.js.map +1 -1
- package/lib-esm/app/panels/SignalProcessingPanel.d.ts.map +1 -1
- package/lib-esm/app/panels/SignalProcessingPanel.js +3 -3
- package/lib-esm/app/panels/SignalProcessingPanel.js.map +1 -1
- package/lib-esm/components/button/Button.d.ts +8 -14
- package/lib-esm/components/button/Button.d.ts.map +1 -1
- package/lib-esm/components/button/Button.js +7 -31
- package/lib-esm/components/button/Button.js.map +1 -1
- package/lib-esm/components/drop-zone/DropZone.d.ts +6 -2
- package/lib-esm/components/drop-zone/DropZone.d.ts.map +1 -1
- package/lib-esm/components/drop-zone/DropZone.js +9 -15
- package/lib-esm/components/drop-zone/DropZone.js.map +1 -1
- package/lib-esm/components/forms/index.d.ts +0 -5
- package/lib-esm/components/forms/index.d.ts.map +1 -1
- package/lib-esm/components/forms/index.js +0 -5
- package/lib-esm/components/forms/index.js.map +1 -1
- package/lib-esm/components/forms/radio-group/RadioGroup.d.ts +1 -0
- package/lib-esm/components/forms/radio-group/RadioGroup.d.ts.map +1 -1
- package/lib-esm/components/forms/radio-group/RadioGroup.js +2 -2
- package/lib-esm/components/forms/radio-group/RadioGroup.js.map +1 -1
- package/lib-esm/components/forms/styles.d.ts +0 -22
- package/lib-esm/components/forms/styles.d.ts.map +1 -1
- package/lib-esm/components/forms/styles.js +0 -72
- package/lib-esm/components/forms/styles.js.map +1 -1
- package/lib-esm/components/header/PanelHeader.d.ts.map +1 -1
- package/lib-esm/components/header/PanelHeader.js +1 -2
- package/lib-esm/components/header/PanelHeader.js.map +1 -1
- package/lib-esm/components/index.d.ts +0 -2
- package/lib-esm/components/index.d.ts.map +1 -1
- package/lib-esm/components/index.js +0 -2
- package/lib-esm/components/index.js.map +1 -1
- package/lib-esm/components/info-panel/InfoPanel.d.ts.map +1 -1
- package/lib-esm/components/info-panel/InfoPanel.js +5 -4
- package/lib-esm/components/info-panel/InfoPanel.js.map +1 -1
- package/lib-esm/components/modal/ConfirmModal.d.ts.map +1 -1
- package/lib-esm/components/modal/ConfirmModal.js +1 -7
- package/lib-esm/components/modal/ConfirmModal.js.map +1 -1
- package/lib-esm/components/modal/Modal.d.ts.map +1 -1
- package/lib-esm/components/modal/Modal.js +2 -2
- package/lib-esm/components/modal/Modal.js.map +1 -1
- package/lib-esm/components/toolbar/PanelPreferencesToolbar.d.ts.map +1 -1
- package/lib-esm/components/toolbar/PanelPreferencesToolbar.js +1 -2
- package/lib-esm/components/toolbar/PanelPreferencesToolbar.js.map +1 -1
- package/lib-esm/components/toolbar/Toolbar.d.ts.map +1 -1
- package/lib-esm/components/toolbar/Toolbar.js +16 -12
- package/lib-esm/components/toolbar/Toolbar.js.map +1 -1
- package/package.json +25 -23
- package/src/app/hooks/file-loading.ts +4 -2
- package/src/app/panels/SignalProcessingPanel.tsx +3 -6
- package/src/components/button/Button.tsx +29 -59
- package/src/components/drop-zone/DropZone.tsx +42 -25
- package/src/components/forms/index.ts +0 -5
- package/src/components/forms/radio-group/RadioGroup.tsx +3 -0
- package/src/components/forms/styles.ts +0 -92
- package/src/components/header/PanelHeader.tsx +1 -8
- package/src/components/index.ts +0 -2
- package/src/components/info-panel/InfoPanel.tsx +6 -3
- package/src/components/modal/ConfirmModal.tsx +2 -16
- package/src/components/modal/Modal.tsx +10 -2
- package/src/components/toolbar/PanelPreferencesToolbar.tsx +2 -15
- package/src/components/toolbar/Toolbar.tsx +25 -29
- package/lib-esm/components/dropdown-menu/DropdownMenu.d.ts +0 -28
- package/lib-esm/components/dropdown-menu/DropdownMenu.d.ts.map +0 -1
- package/lib-esm/components/dropdown-menu/DropdownMenu.js +0 -41
- package/lib-esm/components/dropdown-menu/DropdownMenu.js.map +0 -1
- package/lib-esm/components/dropdown-menu/MenuItems.d.ts +0 -19
- package/lib-esm/components/dropdown-menu/MenuItems.d.ts.map +0 -1
- package/lib-esm/components/dropdown-menu/MenuItems.js +0 -77
- package/lib-esm/components/dropdown-menu/MenuItems.js.map +0 -1
- package/lib-esm/components/dropdown-menu/index.d.ts +0 -3
- package/lib-esm/components/dropdown-menu/index.d.ts.map +0 -1
- package/lib-esm/components/dropdown-menu/index.js +0 -2
- package/lib-esm/components/dropdown-menu/index.js.map +0 -1
- package/lib-esm/components/dropdown-menu/useContextMenuPlacement.d.ts +0 -18
- package/lib-esm/components/dropdown-menu/useContextMenuPlacement.d.ts.map +0 -1
- package/lib-esm/components/dropdown-menu/useContextMenuPlacement.js +0 -49
- package/lib-esm/components/dropdown-menu/useContextMenuPlacement.js.map +0 -1
- package/lib-esm/components/forms/Checkbox.d.ts +0 -11
- package/lib-esm/components/forms/Checkbox.d.ts.map +0 -1
- package/lib-esm/components/forms/Checkbox.js +0 -35
- package/lib-esm/components/forms/Checkbox.js.map +0 -1
- package/lib-esm/components/forms/Input.d.ts +0 -19
- package/lib-esm/components/forms/Input.d.ts.map +0 -1
- package/lib-esm/components/forms/Input.js +0 -60
- package/lib-esm/components/forms/Input.js.map +0 -1
- package/lib-esm/components/forms/Select.d.ts +0 -21
- package/lib-esm/components/forms/Select.d.ts.map +0 -1
- package/lib-esm/components/forms/Select.js +0 -90
- package/lib-esm/components/forms/Select.js.map +0 -1
- package/lib-esm/components/forms/TextArea.d.ts +0 -8
- package/lib-esm/components/forms/TextArea.d.ts.map +0 -1
- package/lib-esm/components/forms/TextArea.js +0 -19
- package/lib-esm/components/forms/TextArea.js.map +0 -1
- package/lib-esm/components/forms/context/FieldsContext.d.ts +0 -16
- package/lib-esm/components/forms/context/FieldsContext.d.ts.map +0 -1
- package/lib-esm/components/forms/context/FieldsContext.js +0 -47
- package/lib-esm/components/forms/context/FieldsContext.js.map +0 -1
- package/lib-esm/components/forms/context/index.d.ts +0 -2
- package/lib-esm/components/forms/context/index.d.ts.map +0 -1
- package/lib-esm/components/forms/context/index.js +0 -2
- package/lib-esm/components/forms/context/index.js.map +0 -1
- package/lib-esm/components/modal/ModalCloseButton.d.ts +0 -4
- package/lib-esm/components/modal/ModalCloseButton.d.ts.map +0 -1
- package/lib-esm/components/modal/ModalCloseButton.js +0 -11
- package/lib-esm/components/modal/ModalCloseButton.js.map +0 -1
- package/lib-esm/components/spinner/FullSpinner.d.ts +0 -7
- package/lib-esm/components/spinner/FullSpinner.d.ts.map +0 -1
- package/lib-esm/components/spinner/FullSpinner.js +0 -24
- package/lib-esm/components/spinner/FullSpinner.js.map +0 -1
- package/lib-esm/components/spinner/index.d.ts +0 -2
- package/lib-esm/components/spinner/index.d.ts.map +0 -1
- package/lib-esm/components/spinner/index.js +0 -2
- package/lib-esm/components/spinner/index.js.map +0 -1
- package/src/components/dropdown-menu/DropdownMenu.tsx +0 -160
- package/src/components/dropdown-menu/MenuItems.tsx +0 -146
- package/src/components/dropdown-menu/index.ts +0 -2
- package/src/components/dropdown-menu/useContextMenuPlacement.ts +0 -76
- package/src/components/forms/Checkbox.tsx +0 -77
- package/src/components/forms/Input.tsx +0 -144
- package/src/components/forms/Select.tsx +0 -197
- package/src/components/forms/TextArea.tsx +0 -45
- package/src/components/forms/context/FieldsContext.tsx +0 -82
- package/src/components/forms/context/index.ts +0 -1
- package/src/components/modal/ModalCloseButton.tsx +0 -21
- package/src/components/spinner/FullSpinner.tsx +0 -57
- package/src/components/spinner/index.ts +0 -1
|
@@ -1,96 +1,4 @@
|
|
|
1
|
-
import styled from '@emotion/styled';
|
|
2
|
-
|
|
3
1
|
export type InputVariant = 'default' | 'small';
|
|
4
2
|
|
|
5
|
-
interface StyledProps {
|
|
6
|
-
variant: InputVariant;
|
|
7
|
-
hasLeading?: boolean;
|
|
8
|
-
hasTrailing?: boolean;
|
|
9
|
-
}
|
|
10
3
|
export const enabledColor = '#1677ff';
|
|
11
4
|
export const disabledColor = '#b8b8b8';
|
|
12
|
-
|
|
13
|
-
export const LabelStyled = styled.label<StyledProps>`
|
|
14
|
-
padding: ${(props) =>
|
|
15
|
-
props.variant === 'default'
|
|
16
|
-
? props.hasTrailing
|
|
17
|
-
? '2px 9px 4px 9px'
|
|
18
|
-
: '2px 9px'
|
|
19
|
-
: props.hasTrailing
|
|
20
|
-
? '1px 7px 1px 7px'
|
|
21
|
-
: '1px 7px'};
|
|
22
|
-
|
|
23
|
-
font-size: ${(props) => (props.variant === 'small' ? '1em' : '1.125em')};
|
|
24
|
-
line-height: '17px';
|
|
25
|
-
|
|
26
|
-
background-color: white;
|
|
27
|
-
border-width: 1px;
|
|
28
|
-
align-items: center;
|
|
29
|
-
flex-direction: row;
|
|
30
|
-
flex: 1 1 0%;
|
|
31
|
-
display: flex;
|
|
32
|
-
position: relative;
|
|
33
|
-
|
|
34
|
-
border-top-right-radius: ${(props) =>
|
|
35
|
-
props.hasLeading && !props.hasTrailing && '0.375rem'};
|
|
36
|
-
|
|
37
|
-
border-bottom-right-radius: ${(props) =>
|
|
38
|
-
props.hasLeading && !props.hasTrailing && '0.375rem'};
|
|
39
|
-
|
|
40
|
-
border-top-left-radius: ${(props) =>
|
|
41
|
-
props.hasTrailing && !props.hasLeading && '0.375rem'};
|
|
42
|
-
|
|
43
|
-
border-bottom-left-radius: ${(props) =>
|
|
44
|
-
props.hasTrailing && !props.hasLeading && '0.375rem'};
|
|
45
|
-
|
|
46
|
-
border-radius: ${(props) =>
|
|
47
|
-
!props.hasLeading && !props.hasTrailing && '0.375rem'};
|
|
48
|
-
|
|
49
|
-
border-color: var(--custom-border-color);
|
|
50
|
-
`;
|
|
51
|
-
|
|
52
|
-
function getStyleColor(hasError: boolean, hasValid: boolean) {
|
|
53
|
-
if (hasError) {
|
|
54
|
-
return {
|
|
55
|
-
default: '#ffa39e',
|
|
56
|
-
hover: '#f95d55',
|
|
57
|
-
};
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
if (hasValid) {
|
|
61
|
-
return {
|
|
62
|
-
default: '#6adc24',
|
|
63
|
-
hover: '#62cb21',
|
|
64
|
-
};
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
return {
|
|
68
|
-
default: 'rgb(217, 217, 217)',
|
|
69
|
-
hover: '#4096ff',
|
|
70
|
-
};
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
export const GroupStyled = styled.div<{ hasError: boolean; hasValid: boolean }>`
|
|
74
|
-
display: flex;
|
|
75
|
-
border-radius: 0.375rem;
|
|
76
|
-
margin-top: 0.25rem;
|
|
77
|
-
|
|
78
|
-
.addon {
|
|
79
|
-
color: ${({ hasError }) => hasError && '#f95d55'};
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
--custom-border-color: ${({ hasError, hasValid }) =>
|
|
83
|
-
getStyleColor(hasError, hasValid).default};
|
|
84
|
-
|
|
85
|
-
:hover,
|
|
86
|
-
:focus-within {
|
|
87
|
-
--custom-border-color: ${({ hasError, hasValid }) =>
|
|
88
|
-
getStyleColor(hasError, hasValid).hover};
|
|
89
|
-
}
|
|
90
|
-
`;
|
|
91
|
-
|
|
92
|
-
export const InputContainer = styled.div`
|
|
93
|
-
display: flex;
|
|
94
|
-
flex-direction: column;
|
|
95
|
-
gap: 2px;
|
|
96
|
-
`;
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
/** @jsxImportSource @emotion/react */
|
|
2
2
|
import { css } from '@emotion/react';
|
|
3
3
|
import { ReactNode, useEffect, useRef } from 'react';
|
|
4
|
-
import { FaCog } from 'react-icons/fa';
|
|
5
4
|
|
|
6
5
|
import { Button } from '../button/Button';
|
|
7
6
|
|
|
@@ -62,13 +61,7 @@ export function PanelHeader({
|
|
|
62
61
|
<div css={styles.leftContainer}>{children}</div>
|
|
63
62
|
<p ref={labelRef} css={styles.counterLabel} />
|
|
64
63
|
{onClickSettings && (
|
|
65
|
-
<Button
|
|
66
|
-
onClick={onClickSettings}
|
|
67
|
-
color={{ basic: 'black', hover: 'black' }}
|
|
68
|
-
backgroundColor={{ basic: 'white', hover: '#f7f7f7' }}
|
|
69
|
-
>
|
|
70
|
-
<FaCog />
|
|
71
|
-
</Button>
|
|
64
|
+
<Button color="black" minimal onClick={onClickSettings} icon="cog" />
|
|
72
65
|
)}
|
|
73
66
|
</div>
|
|
74
67
|
);
|
package/src/components/index.ts
CHANGED
|
@@ -2,7 +2,6 @@ export * from './accordion/index';
|
|
|
2
2
|
export * from './button/index';
|
|
3
3
|
export * from './color-picker/index';
|
|
4
4
|
export * from './drop-zone/index';
|
|
5
|
-
export * from './dropdown-menu/index';
|
|
6
5
|
export * from './forms/index';
|
|
7
6
|
export * from './fullscreen/index';
|
|
8
7
|
export * from './header/index';
|
|
@@ -11,7 +10,6 @@ export * from './info-panel/index';
|
|
|
11
10
|
export * from './layout-manager/index';
|
|
12
11
|
export * from './modal/index';
|
|
13
12
|
export * from './root-layout/index';
|
|
14
|
-
export * from './spinner/index';
|
|
15
13
|
export * from './split-pane/index';
|
|
16
14
|
export * from './table/index';
|
|
17
15
|
export * from './tabs/index';
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/** @jsxImportSource @emotion/react */
|
|
2
|
+
import { InputGroup } from '@blueprintjs/core';
|
|
2
3
|
import { css } from '@emotion/react';
|
|
3
4
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error
|
|
4
5
|
// @ts-ignore
|
|
@@ -6,7 +7,7 @@ import { Disclosure } from '@headlessui/react';
|
|
|
6
7
|
import { CSSProperties, useState } from 'react';
|
|
7
8
|
import { FaChevronRight } from 'react-icons/fa';
|
|
8
9
|
|
|
9
|
-
import {
|
|
10
|
+
import { ValueRenderers } from '../index';
|
|
10
11
|
import { Table } from '../table/Table';
|
|
11
12
|
|
|
12
13
|
export interface InfoPanelData {
|
|
@@ -89,13 +90,15 @@ export function InfoPanel(props: InfoPanelProps) {
|
|
|
89
90
|
return (
|
|
90
91
|
<div css={style.container}>
|
|
91
92
|
<div style={titleStyle}>{title}</div>
|
|
92
|
-
<
|
|
93
|
+
<InputGroup
|
|
93
94
|
placeholder="search for a parameter ..."
|
|
94
95
|
value={search}
|
|
95
96
|
onChange={({ target }) => {
|
|
96
97
|
if (target.value !== undefined) setSearch(target.value);
|
|
97
98
|
}}
|
|
98
99
|
style={inputStyle}
|
|
100
|
+
leftIcon="search"
|
|
101
|
+
type="search"
|
|
99
102
|
/>
|
|
100
103
|
|
|
101
104
|
{data.map(({ description, data }) => {
|
|
@@ -133,7 +136,7 @@ export function InfoPanel(props: InfoPanelProps) {
|
|
|
133
136
|
function valueCell(value: number | string | object | boolean) {
|
|
134
137
|
switch (typeof value) {
|
|
135
138
|
case 'boolean':
|
|
136
|
-
return <ValueRenderers.
|
|
139
|
+
return <ValueRenderers.Text value={value ? 'Yes' : 'No'} />;
|
|
137
140
|
case 'number':
|
|
138
141
|
return <ValueRenderers.Number value={value} />;
|
|
139
142
|
case 'object':
|
|
@@ -118,24 +118,10 @@ export function ConfirmModal(props: ConfirmModalProps) {
|
|
|
118
118
|
</ConfirmModalChildrenRoot>
|
|
119
119
|
|
|
120
120
|
<ConfirmModalFooter>
|
|
121
|
-
<Button
|
|
122
|
-
onClick={onConfirm}
|
|
123
|
-
backgroundColor={{
|
|
124
|
-
basic: 'hsla(243deg, 75%, 58%, 1)',
|
|
125
|
-
hover: 'hsla(245deg, 58%, 50%, 1)',
|
|
126
|
-
}}
|
|
127
|
-
color={{ basic: 'white' }}
|
|
128
|
-
>
|
|
121
|
+
<Button intent="primary" onClick={onConfirm}>
|
|
129
122
|
{saveText}
|
|
130
123
|
</Button>
|
|
131
|
-
<Button
|
|
132
|
-
onClick={onCancel}
|
|
133
|
-
backgroundColor={{
|
|
134
|
-
basic: 'hsla(0deg, 72%, 50%, 1)',
|
|
135
|
-
hover: 'hsla(0deg, 73%, 42%, 1)',
|
|
136
|
-
}}
|
|
137
|
-
color={{ basic: 'white' }}
|
|
138
|
-
>
|
|
124
|
+
<Button intent="danger" onClick={onCancel}>
|
|
139
125
|
{cancelText}
|
|
140
126
|
</Button>
|
|
141
127
|
</ConfirmModalFooter>
|
|
@@ -2,10 +2,10 @@ import styled from '@emotion/styled';
|
|
|
2
2
|
import type { ReactElement, ReactNode } from 'react';
|
|
3
3
|
import { useCallback, useImperativeHandle, useRef, useState } from 'react';
|
|
4
4
|
|
|
5
|
+
import { Button } from '../index';
|
|
5
6
|
import { Portal } from '../root-layout/Portal';
|
|
6
7
|
import { RootLayoutProvider } from '../root-layout/RootLayoutContext';
|
|
7
8
|
|
|
8
|
-
import ModalCloseButton from './ModalCloseButton';
|
|
9
9
|
import { useDialog } from './useDialog';
|
|
10
10
|
|
|
11
11
|
export interface ModalProps {
|
|
@@ -113,7 +113,15 @@ export function Modal(props: ModalProps) {
|
|
|
113
113
|
}}
|
|
114
114
|
>
|
|
115
115
|
{children}
|
|
116
|
-
{hasCloseButton &&
|
|
116
|
+
{hasCloseButton && (
|
|
117
|
+
<Button
|
|
118
|
+
style={{ position: 'absolute', top: 4, right: 4 }}
|
|
119
|
+
onClick={onRequestClose}
|
|
120
|
+
intent="danger"
|
|
121
|
+
minimal
|
|
122
|
+
icon="cross"
|
|
123
|
+
/>
|
|
124
|
+
)}
|
|
117
125
|
</DialogContents>
|
|
118
126
|
</RootLayoutProvider>
|
|
119
127
|
)}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
/** @jsxImportSource @emotion/react */
|
|
2
2
|
import { css } from '@emotion/react';
|
|
3
|
-
import { FaCheck, FaTimes } from 'react-icons/fa';
|
|
4
3
|
|
|
5
4
|
import { Button } from '../button/Button';
|
|
6
5
|
|
|
@@ -27,20 +26,8 @@ export function PanelPreferencesToolbar(props: PanelPreferencesToolbarProps) {
|
|
|
27
26
|
const { onClose, onSave } = props;
|
|
28
27
|
return (
|
|
29
28
|
<div css={styles.toolbar}>
|
|
30
|
-
<Button
|
|
31
|
-
|
|
32
|
-
color={{ basic: '#ca0000', hover: '#ca0000' }}
|
|
33
|
-
backgroundColor={{ basic: 'white', hover: 'white' }}
|
|
34
|
-
>
|
|
35
|
-
<FaTimes />
|
|
36
|
-
</Button>
|
|
37
|
-
<Button
|
|
38
|
-
onClick={onSave}
|
|
39
|
-
color={{ basic: 'green', hover: 'green' }}
|
|
40
|
-
backgroundColor={{ basic: 'white', hover: 'white' }}
|
|
41
|
-
>
|
|
42
|
-
<FaCheck />
|
|
43
|
-
</Button>
|
|
29
|
+
<Button minimal onClick={onClose} intent="danger" icon="cross" />
|
|
30
|
+
<Button minimal onClick={onSave} intent="success" icon="tick" />
|
|
44
31
|
</div>
|
|
45
32
|
);
|
|
46
33
|
}
|
|
@@ -1,12 +1,10 @@
|
|
|
1
1
|
/** @jsxImportSource @emotion/react */
|
|
2
2
|
import {
|
|
3
|
-
Button,
|
|
4
3
|
ButtonGroup,
|
|
5
4
|
ButtonProps,
|
|
6
5
|
Classes,
|
|
7
6
|
Colors,
|
|
8
7
|
Intent,
|
|
9
|
-
Tooltip,
|
|
10
8
|
} from '@blueprintjs/core';
|
|
11
9
|
import { css } from '@emotion/react';
|
|
12
10
|
import {
|
|
@@ -17,6 +15,8 @@ import {
|
|
|
17
15
|
useRef,
|
|
18
16
|
} from 'react';
|
|
19
17
|
|
|
18
|
+
import { Button } from '../index';
|
|
19
|
+
|
|
20
20
|
import {
|
|
21
21
|
ToolbarContext,
|
|
22
22
|
toolbarContext,
|
|
@@ -106,36 +106,32 @@ Toolbar.Item = function ToolbarItem(props: ToolbarItemProps) {
|
|
|
106
106
|
|
|
107
107
|
const { intent, large, vertical, disabled } = useToolbarContext();
|
|
108
108
|
return (
|
|
109
|
-
<
|
|
109
|
+
<Button
|
|
110
|
+
minimal
|
|
111
|
+
disabled={disabled}
|
|
110
112
|
css={css`
|
|
111
|
-
|
|
113
|
+
.${Classes.ICON} {
|
|
114
|
+
color: ${Colors.DARK_GRAY3};
|
|
115
|
+
}
|
|
112
116
|
`}
|
|
113
|
-
compact={!large}
|
|
114
117
|
intent={intent}
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
if (onClick) {
|
|
133
|
-
onClick(props);
|
|
134
|
-
}
|
|
135
|
-
}}
|
|
136
|
-
{...other}
|
|
137
|
-
/>
|
|
138
|
-
</Tooltip>
|
|
118
|
+
style={{ position: 'relative', fontSize: '1.25em', width: 'auto' }}
|
|
119
|
+
type="button"
|
|
120
|
+
active={active}
|
|
121
|
+
icon={icon}
|
|
122
|
+
onClick={() => {
|
|
123
|
+
if (onClick) {
|
|
124
|
+
onClick(props);
|
|
125
|
+
}
|
|
126
|
+
}}
|
|
127
|
+
tooltipProps={{
|
|
128
|
+
content: title,
|
|
129
|
+
placement: vertical ? 'right' : 'bottom',
|
|
130
|
+
intent,
|
|
131
|
+
compact: !large,
|
|
132
|
+
}}
|
|
133
|
+
{...other}
|
|
134
|
+
/>
|
|
139
135
|
);
|
|
140
136
|
};
|
|
141
137
|
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import type { Placement } from '@popperjs/core';
|
|
2
|
-
import { ReactNode, ElementType, ComponentProps } from 'react';
|
|
3
|
-
import { MenuOption, MenuOptions } from './MenuItems';
|
|
4
|
-
interface DropdownMenuBaseProps<T> {
|
|
5
|
-
/**
|
|
6
|
-
* Placement for react-popper
|
|
7
|
-
*/
|
|
8
|
-
placement?: Placement;
|
|
9
|
-
options: MenuOptions<T>;
|
|
10
|
-
onSelect: (selected: MenuOption<T>) => void;
|
|
11
|
-
}
|
|
12
|
-
type ElementProps<E = unknown> = E extends ElementType ? ComponentProps<E> : never;
|
|
13
|
-
interface DropdownMenuClickProps<T> extends DropdownMenuBaseProps<T> {
|
|
14
|
-
/**
|
|
15
|
-
* Node to be inside the Button
|
|
16
|
-
*/
|
|
17
|
-
children: ReactNode;
|
|
18
|
-
trigger: 'click';
|
|
19
|
-
}
|
|
20
|
-
interface DropdownMenuContextProps<T, E> extends DropdownMenuBaseProps<T> {
|
|
21
|
-
trigger: 'contextMenu';
|
|
22
|
-
children: ReactNode;
|
|
23
|
-
as?: E;
|
|
24
|
-
}
|
|
25
|
-
export type DropdownMenuProps<T, E> = DropdownMenuContextProps<T, E> | DropdownMenuClickProps<T>;
|
|
26
|
-
export declare function DropdownMenu<T = unknown, E extends ElementType = 'div'>(props: DropdownMenuProps<T, E> & Omit<ElementProps<E>, keyof DropdownMenuProps<T, E>>): import("react/jsx-runtime").JSX.Element;
|
|
27
|
-
export {};
|
|
28
|
-
//# sourceMappingURL=DropdownMenu.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/DropdownMenu.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAU,WAAW,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAOvE,OAAO,EAAa,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAGjE,UAAU,qBAAqB,CAAC,CAAC;IAC/B;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;IACxB,QAAQ,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;CAC7C;AAED,KAAK,YAAY,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,SAAS,WAAW,GAClD,cAAc,CAAC,CAAC,CAAC,GACjB,KAAK,CAAC;AAEV,UAAU,sBAAsB,CAAC,CAAC,CAAE,SAAQ,qBAAqB,CAAC,CAAC,CAAC;IAClE;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,wBAAwB,CAAC,CAAC,EAAE,CAAC,CAAE,SAAQ,qBAAqB,CAAC,CAAC,CAAC;IACvE,OAAO,EAAE,aAAa,CAAC;IACvB,QAAQ,EAAE,SAAS,CAAC;IACpB,EAAE,CAAC,EAAE,CAAC,CAAC;CACR;AAED,MAAM,MAAM,iBAAiB,CAAC,CAAC,EAAE,CAAC,IAC9B,wBAAwB,CAAC,CAAC,EAAE,CAAC,CAAC,GAC9B,sBAAsB,CAAC,CAAC,CAAC,CAAC;AAE9B,wBAAgB,YAAY,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,SAAS,WAAW,GAAG,KAAK,EACrE,KAAK,EAAE,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,GAC5B,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,MAAM,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,2CAUvD"}
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error
|
|
3
|
-
// @ts-ignore This import fails when compiling to CJS.
|
|
4
|
-
import { Menu } from '@headlessui/react';
|
|
5
|
-
import { useRef } from 'react';
|
|
6
|
-
import { useModifiedPopper } from '../hooks/useModifiedPopper';
|
|
7
|
-
import { useOnClickOutside } from '../hooks/useOnClickOutside';
|
|
8
|
-
import { useOnOff } from '../hooks/useOnOff';
|
|
9
|
-
import { Portal } from '../root-layout/Portal';
|
|
10
|
-
import { MenuItems } from './MenuItems';
|
|
11
|
-
import { useContextMenuPlacement } from './useContextMenuPlacement';
|
|
12
|
-
export function DropdownMenu(props) {
|
|
13
|
-
const { trigger, ...otherProps } = props;
|
|
14
|
-
if (trigger === 'contextMenu') {
|
|
15
|
-
return _jsx(DropdownContextMenu, { ...props });
|
|
16
|
-
}
|
|
17
|
-
return (_jsx(DropdownClickMenu, { ...otherProps, children: props.children }));
|
|
18
|
-
}
|
|
19
|
-
function DropdownContextMenu(props) {
|
|
20
|
-
const { children, onSelect, as: Wrapper = 'div', placement = 'right-start', options, ...otherProps } = props;
|
|
21
|
-
const { isPopperElementOpen, closePopperElement, handleContextMenu, setPopperElement, styles, attributes, } = useContextMenuPlacement(placement);
|
|
22
|
-
const ref = useRef(null);
|
|
23
|
-
useOnClickOutside(ref, closePopperElement);
|
|
24
|
-
const { style = {}, ...otherWrapperProps } = otherProps;
|
|
25
|
-
return (_jsx(Wrapper, { style: { ...(!props?.as && { display: 'contents' }), ...style }, ...otherWrapperProps, onContextMenu: handleContextMenu, children: _jsxs(_Fragment, { children: [isPopperElementOpen && (_jsx(Portal, { children: _jsx("div", { ref: ref, children: _jsx("div", { ref: setPopperElement, style: styles.popper, ...attributes.popper, children: _jsx(Menu, { children: _jsx(MenuItems, { itemsStatic: true, onSelect: (selected) => {
|
|
26
|
-
closePopperElement();
|
|
27
|
-
onSelect(selected);
|
|
28
|
-
}, options: options }) }) }) }) })), children] }) }));
|
|
29
|
-
}
|
|
30
|
-
function DropdownClickMenu(props) {
|
|
31
|
-
const { placement = 'bottom-start', onSelect, ...otherProps } = props;
|
|
32
|
-
const [isOpened, , closeItems, toggle] = useOnOff(false);
|
|
33
|
-
const ref = useRef(null);
|
|
34
|
-
useOnClickOutside(ref, closeItems);
|
|
35
|
-
const { setReferenceElement, setPopperElement, popperProps } = useModifiedPopper({ placement, offset: 6 });
|
|
36
|
-
return (_jsxs(Menu, { children: [_jsx(Menu.Button, { ref: setReferenceElement, onClick: toggle, children: props.children }), isOpened && (_jsx(Portal, { children: _jsx("div", { ref: ref, children: _jsx("div", { ref: setPopperElement, ...popperProps, children: _jsx(MenuItems, { itemsStatic: true, onSelect: (selected) => {
|
|
37
|
-
closeItems();
|
|
38
|
-
onSelect(selected);
|
|
39
|
-
}, ...otherProps }) }) }) }))] }));
|
|
40
|
-
}
|
|
41
|
-
//# sourceMappingURL=DropdownMenu.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenu.js","sourceRoot":"","sources":["../../../src/components/dropdown-menu/DropdownMenu.tsx"],"names":[],"mappings":";AAAA,wGAAwG;AACxG,sDAAsD;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEzC,OAAO,EAAa,MAAM,EAA+B,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAE/C,OAAO,EAAE,SAAS,EAA2B,MAAM,aAAa,CAAC;AACjE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAkCpE,MAAM,UAAU,YAAY,CAC1B,KACsD;IAEtD,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC;IAEzC,IAAI,OAAO,KAAK,aAAa,EAAE;QAC7B,OAAO,KAAC,mBAAmB,OAAW,KAAK,GAAI,CAAC;KACjD;IACD,OAAO,CACL,KAAC,iBAAiB,OAAK,UAAU,YAAG,KAAK,CAAC,QAAQ,GAAqB,CACxE,CAAC;AACJ,CAAC;AAED,SAAS,mBAAmB,CAC1B,KACsD;IAEtD,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,EAAE,EAAE,OAAO,GAAG,KAAK,EACnB,SAAS,GAAG,aAAa,EACzB,OAAO,EACP,GAAG,UAAU,EACd,GAAG,KAAK,CAAC;IAEV,MAAM,EACJ,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAChB,MAAM,EACN,UAAU,GACX,GAAG,uBAAuB,CAAC,SAAS,CAAC,CAAC;IAEvC,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,iBAAiB,CAAC,GAAG,EAAE,kBAAkB,CAAC,CAAC;IAE3C,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,GAAG,iBAAiB,EAAE,GAAG,UAA6B,CAAC;IAE3E,OAAO,CACL,KAAC,OAAO,IACN,KAAK,EAAE,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,EAAE,GAAG,KAAK,EAAE,KAC3D,iBAAiB,EACrB,aAAa,EAAE,iBAAiB,YAEhC,8BACG,mBAAmB,IAAI,CACtB,KAAC,MAAM,cACL,cAAK,GAAG,EAAE,GAAG,YACX,cACE,GAAG,EAAE,gBAAgB,EACrB,KAAK,EAAE,MAAM,CAAC,MAAM,KAChB,UAAU,CAAC,MAAM,YAErB,KAAC,IAAI,cACH,KAAC,SAAS,IACR,WAAW,QACX,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE;wCACrB,kBAAkB,EAAE,CAAC;wCACrB,QAAQ,CAAC,QAAQ,CAAC,CAAC;oCACrB,CAAC,EACD,OAAO,EAAE,OAAO,GAChB,GACG,GACH,GACF,GACC,CACV,EAEA,QAAQ,IACR,GACK,CACX,CAAC;AACJ,CAAC;AAED,SAAS,iBAAiB,CACxB,KAAyE;IAEzE,MAAM,EAAE,SAAS,GAAG,cAAc,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC;IAEtE,MAAM,CAAC,QAAQ,EAAE,AAAD,EAAG,UAAU,EAAE,MAAM,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEzD,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,iBAAiB,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC;IAEnC,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,WAAW,EAAE,GAC1D,iBAAiB,CAAoB,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC;IAEjE,OAAO,CACL,MAAC,IAAI,eACH,KAAC,IAAI,CAAC,MAAM,IAAC,GAAG,EAAE,mBAAmB,EAAE,OAAO,EAAE,MAAM,YACnD,KAAK,CAAC,QAAQ,GACH,EACb,QAAQ,IAAI,CACX,KAAC,MAAM,cACL,cAAK,GAAG,EAAE,GAAG,YACX,cAAK,GAAG,EAAE,gBAAgB,KAAM,WAAW,YACzC,KAAC,SAAS,IACR,WAAW,QACX,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE;gCACrB,UAAU,EAAE,CAAC;gCACb,QAAQ,CAAC,QAAQ,CAAC,CAAC;4BACrB,CAAC,KACG,UAAU,GACd,GACE,GACF,GACC,CACV,IACI,CACR,CAAC;AACJ,CAAC"}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import type { ReactNode } from 'react';
|
|
2
|
-
export interface MenuOption<T> {
|
|
3
|
-
type: 'option';
|
|
4
|
-
label: ReactNode;
|
|
5
|
-
icon?: ReactNode;
|
|
6
|
-
disabled?: boolean;
|
|
7
|
-
data?: T;
|
|
8
|
-
}
|
|
9
|
-
export interface MenuDivider {
|
|
10
|
-
type: 'divider';
|
|
11
|
-
}
|
|
12
|
-
export type MenuOptions<T> = Array<MenuOption<T> | MenuDivider>;
|
|
13
|
-
export interface MenuItemsProps<T> {
|
|
14
|
-
options: MenuOptions<T>;
|
|
15
|
-
onSelect: (selected: MenuOption<T>) => void;
|
|
16
|
-
itemsStatic?: boolean;
|
|
17
|
-
}
|
|
18
|
-
export declare function MenuItems<T>(props: MenuItemsProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
19
|
-
//# sourceMappingURL=MenuItems.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItems.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/MenuItems.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,UAAU,CAAC,CAAC;IAC3B,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,SAAS,CAAC;CACjB;AAED,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC;AAmEhE,MAAM,WAAW,cAAc,CAAC,CAAC;IAC/B,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC;IACxB,QAAQ,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAC5C,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,2CAsBpD"}
|
|
@@ -1,77 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import styled from '@emotion/styled';
|
|
3
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error
|
|
4
|
-
// @ts-ignore This import fails when compiling to CJS.
|
|
5
|
-
import { Menu } from '@headlessui/react';
|
|
6
|
-
const ItemDiv = styled.div `
|
|
7
|
-
display: contents;
|
|
8
|
-
cursor: ${(props) => (props.disabled ? 'default' : 'pointer')};
|
|
9
|
-
font-size: 0.875rem;
|
|
10
|
-
color: ${(props) => (!props.disabled ? 'black' : 'rgb(163, 163, 163)')};
|
|
11
|
-
& > div {
|
|
12
|
-
padding-top: 2px;
|
|
13
|
-
padding-bottom: 2px;
|
|
14
|
-
${(props) => props.active && 'background-color: rgb(243, 244, 246);'}
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
${(props) => !props.disabled &&
|
|
18
|
-
`
|
|
19
|
-
&:hover > div {
|
|
20
|
-
background-color: rgb(243, 244, 246);
|
|
21
|
-
}
|
|
22
|
-
`}
|
|
23
|
-
`;
|
|
24
|
-
const Divider = styled.hr `
|
|
25
|
-
width: 100%;
|
|
26
|
-
color: rgb(229, 229, 229);
|
|
27
|
-
margin-top: 5px;
|
|
28
|
-
margin-bottom: 5px;
|
|
29
|
-
grid-column: 1 / -1;
|
|
30
|
-
`;
|
|
31
|
-
const ItemsDiv = styled.div `
|
|
32
|
-
display: grid;
|
|
33
|
-
grid-template-columns: [icon-start] ${(props) => props.hasOneIconOrMore ? '40px' : '0px'} [label-start] auto;
|
|
34
|
-
width: fit-content;
|
|
35
|
-
align-items: center;
|
|
36
|
-
border-radius: 6px;
|
|
37
|
-
background-color: white;
|
|
38
|
-
box-shadow:
|
|
39
|
-
rgba(0, 0, 0, 0.3) 0px 19px 38px,
|
|
40
|
-
rgba(0, 0, 0, 0.22) 0px 5px 12px;
|
|
41
|
-
padding-top: 5px;
|
|
42
|
-
padding-bottom: 5px;
|
|
43
|
-
--cell-padding: 16px;
|
|
44
|
-
`;
|
|
45
|
-
const LabelDiv = styled.div `
|
|
46
|
-
grid-column-start: label-start;
|
|
47
|
-
padding-right: var(--cell-padding);
|
|
48
|
-
padding-left: var(--cell-padding);
|
|
49
|
-
`;
|
|
50
|
-
const IconDiv = styled.div `
|
|
51
|
-
grid-column-start: icon-start;
|
|
52
|
-
width: 100%;
|
|
53
|
-
height: 100%;
|
|
54
|
-
padding-left: var(--cell-padding);
|
|
55
|
-
display: flex;
|
|
56
|
-
justify-content: center;
|
|
57
|
-
align-items: center;
|
|
58
|
-
`;
|
|
59
|
-
export function MenuItems(props) {
|
|
60
|
-
const { options, onSelect, itemsStatic } = props;
|
|
61
|
-
const hasOneOrMoreIcon = options.some((option) => option.type === 'option' && option.icon);
|
|
62
|
-
return (_jsx(Menu.Items, { as: ItemsDiv, static: itemsStatic, hasOneIconOrMore: hasOneOrMoreIcon, children: options.map((option, index) => (_jsx(Item
|
|
63
|
-
// eslint-disable-next-line react/no-array-index-key
|
|
64
|
-
, { onSelect: onSelect, option: option }, index))) }));
|
|
65
|
-
}
|
|
66
|
-
function Item(props) {
|
|
67
|
-
const { option, onSelect } = props;
|
|
68
|
-
const isDivider = option.type === 'divider';
|
|
69
|
-
if (isDivider) {
|
|
70
|
-
return _jsx(Divider, {});
|
|
71
|
-
}
|
|
72
|
-
return (_jsx(Menu.Item, { disabled: option.disabled, children: ({ active }) => (_jsxs(ItemDiv, { onClick: (event) => {
|
|
73
|
-
event.stopPropagation();
|
|
74
|
-
onSelect(option);
|
|
75
|
-
}, active: active, disabled: option.disabled || false, children: [_jsx(IconDiv, { children: option.icon }), _jsx(LabelDiv, { children: option.label })] })) }));
|
|
76
|
-
}
|
|
77
|
-
//# sourceMappingURL=MenuItems.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItems.js","sourceRoot":"","sources":["../../../src/components/dropdown-menu/MenuItems.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,wGAAwG;AACxG,sDAAsD;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAiBzC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAGxB;;YAEU,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;;WAEpD,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,oBAAoB,CAAC;;;;MAIlE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,IAAI,uCAAuC;;;IAGpE,CAAC,KAAK,EAAE,EAAE,CACV,CAAC,KAAK,CAAC,QAAQ;IACf;;;;SAIK;CACR,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,EAAE,CAAA;;;;;;CAMxB,CAAC;AAEF,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAEzB;;wCAEsC,CAAC,KAAK,EAAE,EAAE,CAC5C,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK;;;;;;;;;;;CAW5C,CAAC;AAEF,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI1B,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;CAQzB,CAAC;AAQF,MAAM,UAAU,SAAS,CAAI,KAAwB;IACnD,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IACjD,MAAM,gBAAgB,GAAG,OAAO,CAAC,IAAI,CACnC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,KAAK,QAAQ,IAAI,MAAM,CAAC,IAAI,CACpD,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,CAAC,KAAK,IACT,EAAE,EAAE,QAAQ,EACZ,MAAM,EAAE,WAAW,EACnB,gBAAgB,EAAE,gBAAgB,YAEjC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAC9B,KAAC,IAAI;QACH,oDAAoD;YAEpD,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,IAFT,KAAK,CAGV,CACH,CAAC,GACS,CACd,CAAC;AACJ,CAAC;AAOD,SAAS,IAAI,CAAI,KAAmB;IAClC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACnC,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,KAAK,SAAS,CAAC;IAE5C,IAAI,SAAS,EAAE;QACb,OAAO,KAAC,OAAO,KAAG,CAAC;KACpB;IAED,OAAO,CACL,KAAC,IAAI,CAAC,IAAI,IAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,YACjC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CACf,MAAC,OAAO,IACN,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;gBACjB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,QAAQ,CAAC,MAAM,CAAC,CAAC;YACnB,CAAC,EACD,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAI,KAAK,aAElC,KAAC,OAAO,cAAE,MAAM,CAAC,IAAI,GAAW,EAChC,KAAC,QAAQ,cAAE,MAAM,CAAC,KAAK,GAAY,IAC3B,CACX,GACS,CACb,CAAC;AACJ,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/dropdown-menu/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import type { Placement } from '@popperjs/core';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
export declare function useContextMenuPlacement(placement: Placement): {
|
|
4
|
-
setPopperElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;
|
|
5
|
-
styles: {
|
|
6
|
-
[key: string]: React.CSSProperties;
|
|
7
|
-
};
|
|
8
|
-
attributes: {
|
|
9
|
-
[key: string]: {
|
|
10
|
-
[key: string]: string;
|
|
11
|
-
} | undefined;
|
|
12
|
-
};
|
|
13
|
-
popperState: import("@popperjs/core").State | null;
|
|
14
|
-
isPopperElementOpen: boolean;
|
|
15
|
-
handleContextMenu: (event: React.MouseEvent<HTMLDivElement>) => void;
|
|
16
|
-
closePopperElement: () => void;
|
|
17
|
-
};
|
|
18
|
-
//# sourceMappingURL=useContextMenuPlacement.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useContextMenuPlacement.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/useContextMenuPlacement.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAyC,MAAM,OAAO,CAAC;AAU9D,wBAAgB,uBAAuB,CAAC,SAAS,EAAE,SAAS;;;;;;;;;;;;+BAMhD,gBAAgB,CAAC,cAAc,CAAC;;EA0D3C"}
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import { useCallback, useMemo, useState } from 'react';
|
|
2
|
-
import { usePopper } from 'react-popper';
|
|
3
|
-
export function useContextMenuPlacement(placement) {
|
|
4
|
-
const [positionState, setPositionState] = useState(null);
|
|
5
|
-
const handleContextMenu = useCallback((event) => {
|
|
6
|
-
const { clientX, clientY, pageX, pageY } = event;
|
|
7
|
-
event.preventDefault();
|
|
8
|
-
setPositionState({
|
|
9
|
-
clientX,
|
|
10
|
-
clientY,
|
|
11
|
-
pageX,
|
|
12
|
-
pageY,
|
|
13
|
-
});
|
|
14
|
-
}, []);
|
|
15
|
-
const boundingClientRect = useMemo(() => {
|
|
16
|
-
return {
|
|
17
|
-
top: positionState?.clientY || 0,
|
|
18
|
-
left: positionState?.clientX || 0,
|
|
19
|
-
x: positionState?.pageX || 0,
|
|
20
|
-
y: positionState?.pageY || 0,
|
|
21
|
-
bottom: 0,
|
|
22
|
-
right: 0,
|
|
23
|
-
height: 0,
|
|
24
|
-
width: 0,
|
|
25
|
-
toJSON: () => '',
|
|
26
|
-
};
|
|
27
|
-
}, [positionState]);
|
|
28
|
-
const virtualElement = useMemo(() => {
|
|
29
|
-
return {
|
|
30
|
-
getBoundingClientRect: () => boundingClientRect,
|
|
31
|
-
};
|
|
32
|
-
}, [boundingClientRect]);
|
|
33
|
-
const [popperElement, setPopperElement] = useState(null);
|
|
34
|
-
const { styles, attributes, state } = usePopper(virtualElement, popperElement, {
|
|
35
|
-
placement,
|
|
36
|
-
});
|
|
37
|
-
return {
|
|
38
|
-
setPopperElement,
|
|
39
|
-
styles,
|
|
40
|
-
attributes,
|
|
41
|
-
popperState: state,
|
|
42
|
-
isPopperElementOpen: positionState !== null,
|
|
43
|
-
handleContextMenu,
|
|
44
|
-
closePopperElement: () => {
|
|
45
|
-
setPositionState(null);
|
|
46
|
-
},
|
|
47
|
-
};
|
|
48
|
-
}
|
|
49
|
-
//# sourceMappingURL=useContextMenuPlacement.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useContextMenuPlacement.js","sourceRoot":"","sources":["../../../src/components/dropdown-menu/useContextMenuPlacement.ts"],"names":[],"mappings":"AACA,OAAc,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AASzC,MAAM,UAAU,uBAAuB,CAAC,SAAoB;IAC1D,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAChD,IAAI,CACL,CAAC;IAEF,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,KAAuC,EAAE,EAAE;QAC1C,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;QACjD,KAAK,CAAC,cAAc,EAAE,CAAC;QAEvB,gBAAgB,CAAC;YACf,OAAO;YACP,OAAO;YACP,KAAK;YACL,KAAK;SACN,CAAC,CAAC;IACL,CAAC,EACD,EAAE,CACH,CAAC;IAEF,MAAM,kBAAkB,GAAG,OAAO,CAAC,GAAG,EAAE;QACtC,OAAO;YACL,GAAG,EAAE,aAAa,EAAE,OAAO,IAAI,CAAC;YAChC,IAAI,EAAE,aAAa,EAAE,OAAO,IAAI,CAAC;YACjC,CAAC,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;YAC5B,CAAC,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;YAE5B,MAAM,EAAE,CAAC;YACT,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,CAAC;YACT,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,GAAG,EAAE,CAAC,EAAE;SACjB,CAAC;IACJ,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,OAAO;YACL,qBAAqB,EAAE,GAAG,EAAE,CAAC,kBAAkB;SAChD,CAAC;IACJ,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEzB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAChD,IAAI,CACL,CAAC;IAEF,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,SAAS,CAC7C,cAAc,EACd,aAAa,EACb;QACE,SAAS;KACV,CACF,CAAC;IAEF,OAAO;QACL,gBAAgB;QAChB,MAAM;QACN,UAAU;QACV,WAAW,EAAE,KAAK;QAClB,mBAAmB,EAAE,aAAa,KAAK,IAAI;QAC3C,iBAAiB;QACjB,kBAAkB,EAAE,GAAG,EAAE;YACvB,gBAAgB,CAAC,IAAI,CAAC,CAAC;QACzB,CAAC;KACF,CAAC;AACJ,CAAC"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
export type CheckedState = boolean | 'indeterminate';
|
|
3
|
-
interface CheckboxProps {
|
|
4
|
-
checked?: CheckedState;
|
|
5
|
-
disabled?: boolean;
|
|
6
|
-
label?: ReactNode;
|
|
7
|
-
onChange?: (checked: CheckedState) => void;
|
|
8
|
-
}
|
|
9
|
-
export declare function Checkbox(props: CheckboxProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
10
|
-
export {};
|
|
11
|
-
//# sourceMappingURL=Checkbox.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/forms/Checkbox.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlC,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,eAAe,CAAC;AAErD,UAAU,aAAa;IACrB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;CAC5C;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,oDA2D5C"}
|