react-science 0.22.1 → 0.23.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/components/accordion/Accordion.js +10 -6
- package/lib/components/forms/Checkbox.js +62 -0
- package/lib/components/forms/Select.js +114 -0
- package/lib/components/forms/index.js +1 -0
- package/lib/components/table/Table.js +6 -6
- package/lib-esm/app/about/AboutDialogToolbarButton.d.ts +1 -1
- package/lib-esm/app/about/AboutDialogToolbarButton.d.ts.map +1 -1
- package/lib-esm/app/explorer/ExplorerPlotView.d.ts +1 -2
- package/lib-esm/app/explorer/ExplorerPlotView.d.ts.map +1 -1
- package/lib-esm/app/explorer/MeasurementExplorer.d.ts +1 -2
- package/lib-esm/app/explorer/MeasurementExplorer.d.ts.map +1 -1
- package/lib-esm/app/explorer/MeasurementExplorerWithState.d.ts +1 -2
- package/lib-esm/app/explorer/MeasurementExplorerWithState.d.ts.map +1 -1
- package/lib-esm/app/helpers/MeasurementPlot.d.ts +1 -2
- package/lib-esm/app/helpers/MeasurementPlot.d.ts.map +1 -1
- package/lib-esm/app/helpers/MeasurementVariableSelect.d.ts +1 -2
- package/lib-esm/app/helpers/MeasurementVariableSelect.d.ts.map +1 -1
- package/lib-esm/app/helpers/react-plot.d.ts +1 -1
- package/lib-esm/app/helpers/react-plot.d.ts.map +1 -1
- package/lib-esm/app/kinds/ir/IrPeaksPanel.d.ts +1 -2
- package/lib-esm/app/kinds/ir/IrPeaksPanel.d.ts.map +1 -1
- package/lib-esm/app/kinds/iv/plot-view/IvMeasurementsPlot.d.ts +1 -2
- package/lib-esm/app/kinds/iv/plot-view/IvMeasurementsPlot.d.ts.map +1 -1
- package/lib-esm/app/kinds/iv/plot-view/IvPlotVariablesSelector.d.ts +1 -2
- package/lib-esm/app/kinds/iv/plot-view/IvPlotVariablesSelector.d.ts.map +1 -1
- package/lib-esm/app/kinds/iv/plot-view/IvPlotView.d.ts +1 -2
- package/lib-esm/app/kinds/iv/plot-view/IvPlotView.d.ts.map +1 -1
- package/lib-esm/app/kinds/iv/plot-view/IvSeries.d.ts +1 -2
- package/lib-esm/app/kinds/iv/plot-view/IvSeries.d.ts.map +1 -1
- package/lib-esm/app/kinds/mass/MassPlotView.d.ts +1 -2
- package/lib-esm/app/kinds/mass/MassPlotView.d.ts.map +1 -1
- package/lib-esm/app/kinds/mass/MeasurementMassPlot.d.ts +1 -2
- package/lib-esm/app/kinds/mass/MeasurementMassPlot.d.ts.map +1 -1
- package/lib-esm/app/panels/SignalProcessingPanel.d.ts +1 -2
- package/lib-esm/app/panels/SignalProcessingPanel.d.ts.map +1 -1
- package/lib-esm/app/panels/measurement-config/MeasurementConfigPanel.d.ts +1 -2
- package/lib-esm/app/panels/measurement-config/MeasurementConfigPanel.d.ts.map +1 -1
- package/lib-esm/app/panels/measurement-config/MeasurementConfigPanelAccordion.d.ts +1 -2
- package/lib-esm/app/panels/measurement-config/MeasurementConfigPanelAccordion.d.ts.map +1 -1
- package/lib-esm/app/panels/measurement-info/MeasurementInfoPanel.d.ts +1 -2
- package/lib-esm/app/panels/measurement-info/MeasurementInfoPanel.d.ts.map +1 -1
- package/lib-esm/app/panels/measurement-info/MeasurementInfoPanelAccordion.d.ts +1 -2
- package/lib-esm/app/panels/measurement-info/MeasurementInfoPanelAccordion.d.ts.map +1 -1
- package/lib-esm/app/panels/measurements/MeasurementCheckbox.d.ts +1 -2
- package/lib-esm/app/panels/measurements/MeasurementCheckbox.d.ts.map +1 -1
- package/lib-esm/app/panels/measurements/MeasurementColorPreview.d.ts +1 -2
- package/lib-esm/app/panels/measurements/MeasurementColorPreview.d.ts.map +1 -1
- package/lib-esm/app/panels/measurements/MeasurementVisibilityToggle.d.ts +2 -3
- package/lib-esm/app/panels/measurements/MeasurementVisibilityToggle.d.ts.map +1 -1
- package/lib-esm/app/panels/measurements/MeasurementsPanel.d.ts +1 -2
- package/lib-esm/app/panels/measurements/MeasurementsPanel.d.ts.map +1 -1
- package/lib-esm/app/panels/measurements/MeasurementsPanelAccordion.d.ts +1 -2
- package/lib-esm/app/panels/measurements/MeasurementsPanelAccordion.d.ts.map +1 -1
- package/lib-esm/app/panels/measurements/MeasurementsTable.d.ts +1 -2
- package/lib-esm/app/panels/measurements/MeasurementsTable.d.ts.map +1 -1
- package/lib-esm/app-data/state/appState.d.ts +1 -1
- package/lib-esm/app-data/state/appState.d.ts.map +1 -1
- package/lib-esm/components/accordion/Accordion.d.ts.map +1 -1
- package/lib-esm/components/accordion/Accordion.js +10 -6
- package/lib-esm/components/accordion/Accordion.js.map +1 -1
- package/lib-esm/components/accordion/AccordionContext.d.ts +1 -1
- package/lib-esm/components/accordion/AccordionContext.d.ts.map +1 -1
- package/lib-esm/components/button/ButtonGroup.d.ts +2 -2
- package/lib-esm/components/button/ButtonGroup.d.ts.map +1 -1
- package/lib-esm/components/color-picker/color-picker-dropdown/ColorPickerDropdown.d.ts +1 -2
- package/lib-esm/components/color-picker/color-picker-dropdown/ColorPickerDropdown.d.ts.map +1 -1
- package/lib-esm/components/color-picker/gradient-select/GradientSelect.d.ts +1 -2
- package/lib-esm/components/color-picker/gradient-select/GradientSelect.d.ts.map +1 -1
- package/lib-esm/components/color-picker/preview/ColorPreview.d.ts +1 -2
- package/lib-esm/components/color-picker/preview/ColorPreview.d.ts.map +1 -1
- package/lib-esm/components/color-picker/preview/FixedColorPreview.d.ts +1 -2
- package/lib-esm/components/color-picker/preview/FixedColorPreview.d.ts.map +1 -1
- package/lib-esm/components/color-picker/preview/FixedGradientPreview.d.ts +1 -2
- package/lib-esm/components/color-picker/preview/FixedGradientPreview.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/ColorPicker.d.ts +1 -1
- package/lib-esm/components/color-picker/react-color/ColorPicker.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/common/Alpha.d.ts +1 -1
- package/lib-esm/components/color-picker/react-color/common/Alpha.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/common/CheckBoard.d.ts +1 -1
- package/lib-esm/components/color-picker/react-color/common/CheckBoard.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/common/EditableInput.d.ts +1 -1
- package/lib-esm/components/color-picker/react-color/common/EditableInput.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/common/Hue.d.ts +1 -1
- package/lib-esm/components/color-picker/react-color/common/Hue.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/common/Saturation.d.ts +1 -1
- package/lib-esm/components/color-picker/react-color/common/Saturation.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/common/Swatch.d.ts +3 -3
- package/lib-esm/components/color-picker/react-color/common/Swatch.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/common/interaction.d.ts +2 -2
- package/lib-esm/components/color-picker/react-color/sketch/SketchFields.d.ts +1 -2
- package/lib-esm/components/color-picker/react-color/sketch/SketchFields.d.ts.map +1 -1
- package/lib-esm/components/color-picker/react-color/sketch/SketchPresetColors.d.ts +1 -2
- package/lib-esm/components/color-picker/react-color/sketch/SketchPresetColors.d.ts.map +1 -1
- package/lib-esm/components/drop-zone/DropZone.d.ts +2 -2
- package/lib-esm/components/drop-zone/DropZone.d.ts.map +1 -1
- package/lib-esm/components/dropdown-menu/DropdownMenu.d.ts +1 -1
- package/lib-esm/components/dropdown-menu/DropdownMenu.d.ts.map +1 -1
- package/lib-esm/components/dropdown-menu/MenuItems.d.ts +1 -1
- package/lib-esm/components/dropdown-menu/MenuItems.d.ts.map +1 -1
- package/lib-esm/components/forms/Checkbox.d.ts +11 -0
- package/lib-esm/components/forms/Checkbox.d.ts.map +1 -0
- package/lib-esm/components/forms/Checkbox.js +36 -0
- package/lib-esm/components/forms/Checkbox.js.map +1 -0
- package/lib-esm/components/forms/Input.d.ts +1 -1
- package/lib-esm/components/forms/Input.d.ts.map +1 -1
- package/lib-esm/components/forms/Select.d.ts +21 -0
- package/lib-esm/components/forms/Select.d.ts.map +1 -0
- package/lib-esm/components/forms/Select.js +85 -0
- package/lib-esm/components/forms/Select.js.map +1 -0
- package/lib-esm/components/forms/context/FieldsContext.d.ts +1 -1
- package/lib-esm/components/forms/context/FieldsContext.d.ts.map +1 -1
- package/lib-esm/components/forms/index.d.ts +1 -0
- package/lib-esm/components/forms/index.d.ts.map +1 -1
- package/lib-esm/components/forms/index.js +1 -0
- package/lib-esm/components/forms/index.js.map +1 -1
- package/lib-esm/components/fullscreen/FullscreenContext.d.ts +1 -1
- package/lib-esm/components/fullscreen/FullscreenContext.d.ts.map +1 -1
- package/lib-esm/components/fullscreen/FullscreenToolbarButton.d.ts +1 -2
- package/lib-esm/components/fullscreen/FullscreenToolbarButton.d.ts.map +1 -1
- package/lib-esm/components/modal/ConfirmModal.d.ts +1 -1
- package/lib-esm/components/modal/ConfirmModal.d.ts.map +1 -1
- package/lib-esm/components/modal/Modal.d.ts +4 -4
- package/lib-esm/components/modal/Modal.d.ts.map +1 -1
- package/lib-esm/components/root-layout/RootLayoutContext.d.ts +1 -1
- package/lib-esm/components/root-layout/RootLayoutContext.d.ts.map +1 -1
- package/lib-esm/components/spinner/FullSpinner.d.ts +1 -2
- package/lib-esm/components/spinner/FullSpinner.d.ts.map +1 -1
- package/lib-esm/components/table/Table.d.ts +4 -3
- package/lib-esm/components/table/Table.d.ts.map +1 -1
- package/lib-esm/components/table/Table.js +6 -6
- package/lib-esm/components/table/Table.js.map +1 -1
- package/lib-esm/components/tabs/TabsContext.d.ts +1 -1
- package/lib-esm/components/tabs/TabsContext.d.ts.map +1 -1
- package/lib-esm/components/toolbar/ToolbarContext.d.ts +1 -1
- package/lib-esm/components/toolbar/ToolbarContext.d.ts.map +1 -1
- package/lib-esm/components/value-renderers/Boolean.d.ts +1 -2
- package/lib-esm/components/value-renderers/Boolean.d.ts.map +1 -1
- package/lib-esm/components/value-renderers/Component.d.ts +1 -1
- package/lib-esm/components/value-renderers/Component.d.ts.map +1 -1
- package/lib-esm/components/value-renderers/Header.d.ts +1 -2
- package/lib-esm/components/value-renderers/Header.d.ts.map +1 -1
- package/lib-esm/components/value-renderers/Number.d.ts +1 -2
- package/lib-esm/components/value-renderers/Number.d.ts.map +1 -1
- package/lib-esm/components/value-renderers/ObjectRenderer.d.ts +1 -2
- package/lib-esm/components/value-renderers/ObjectRenderer.d.ts.map +1 -1
- package/package.json +14 -7
- package/src/components/accordion/Accordion.tsx +18 -8
- package/src/components/forms/Checkbox.tsx +78 -0
- package/src/components/forms/Select.tsx +185 -0
- package/src/components/forms/index.ts +1 -0
- package/src/components/table/Table.tsx +14 -6
- package/src/styles/storybook-globals.css +6 -0
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
|
|
2
|
+
/** @jsxImportSource @emotion/react */
|
|
3
|
+
import styled from '@emotion/styled';
|
|
4
|
+
import * as RadixSelect from '@radix-ui/react-select';
|
|
5
|
+
import { SelectGroup } from '@radix-ui/react-select';
|
|
6
|
+
import { Fragment } from 'react';
|
|
7
|
+
import { FaCheck, FaChevronDown, FaChevronUp } from 'react-icons/fa';
|
|
8
|
+
import { Portal } from '../root-layout/Portal';
|
|
9
|
+
const SelectRoot = styled.div `
|
|
10
|
+
display: inline-flex;
|
|
11
|
+
align-items: center;
|
|
12
|
+
justify-content: space-between;
|
|
13
|
+
background-color: #ffffff;
|
|
14
|
+
font-size: 1.125em;
|
|
15
|
+
width: 120px;
|
|
16
|
+
`;
|
|
17
|
+
const SelectTrigger = styled(RadixSelect.Trigger) `
|
|
18
|
+
width: 100%;
|
|
19
|
+
display: flex;
|
|
20
|
+
align-items: center;
|
|
21
|
+
justify-content: space-between;
|
|
22
|
+
border-radius: 4px;
|
|
23
|
+
border: 1px solid rgba(0, 0, 0, 0.15);
|
|
24
|
+
padding: 4px 11px;
|
|
25
|
+
user-select: none;
|
|
26
|
+
font-size: 1.125em;
|
|
27
|
+
line-height: 1.125em;
|
|
28
|
+
|
|
29
|
+
&[data-disabled] {
|
|
30
|
+
color: rgba(0, 0, 0, 0.5);
|
|
31
|
+
background-color: #f5f5f5;
|
|
32
|
+
}
|
|
33
|
+
`;
|
|
34
|
+
const SelectContent = styled(RadixSelect.Content) `
|
|
35
|
+
width: var(--radix-select-trigger-width);
|
|
36
|
+
max-height: var(--radix-select-content-available-height);
|
|
37
|
+
`;
|
|
38
|
+
const SelectViewport = styled(RadixSelect.Viewport) `
|
|
39
|
+
width: var(--radix-select-trigger-width);
|
|
40
|
+
border-radius: 4px;
|
|
41
|
+
box-sizing: border-box;
|
|
42
|
+
border: 1px solid rgba(0, 0, 0, 0.15);
|
|
43
|
+
background-color: white;
|
|
44
|
+
padding: 5px;
|
|
45
|
+
`;
|
|
46
|
+
const SelectItem = styled(RadixSelect.Item) `
|
|
47
|
+
user-select: none;
|
|
48
|
+
font-size: 1.125em;
|
|
49
|
+
padding: 4px 11px;
|
|
50
|
+
width: 100%;
|
|
51
|
+
display: flex;
|
|
52
|
+
align-items: center;
|
|
53
|
+
justify-content: space-between;
|
|
54
|
+
|
|
55
|
+
&:hover {
|
|
56
|
+
background-color: #e6f4ff;
|
|
57
|
+
}
|
|
58
|
+
&[data-disabled] {
|
|
59
|
+
color: rgba(0, 0, 0, 0.5);
|
|
60
|
+
}
|
|
61
|
+
`;
|
|
62
|
+
const SelectLabel = styled(RadixSelect.Label) `
|
|
63
|
+
color: rgba(0, 0, 0, 0.5);
|
|
64
|
+
font-size: 1em;
|
|
65
|
+
padding: 4px 11px;
|
|
66
|
+
margin-top: 8px;
|
|
67
|
+
`;
|
|
68
|
+
const SelectItemIndicator = styled(RadixSelect.ItemIndicator) `
|
|
69
|
+
right: 0;
|
|
70
|
+
width: 25px;
|
|
71
|
+
display: inline-flex;
|
|
72
|
+
align-items: center;
|
|
73
|
+
justify-content: center;
|
|
74
|
+
`;
|
|
75
|
+
const SelectSeparator = styled(RadixSelect.Separator) `
|
|
76
|
+
height: 1px;
|
|
77
|
+
width: 100%;
|
|
78
|
+
background-color: rgba(0, 0, 0, 0.15);
|
|
79
|
+
margin: 5px 0;
|
|
80
|
+
`;
|
|
81
|
+
export function Select(props) {
|
|
82
|
+
const { placeholder, value, onSelect, options, disabled = false, style, } = props;
|
|
83
|
+
return (_jsx(SelectRoot, { style: { ...style }, children: _jsxs(RadixSelect.Root, { value: value, onValueChange: onSelect, disabled: disabled, children: [_jsxs(SelectTrigger, { children: [_jsx(RadixSelect.Value, { placeholder: placeholder }), _jsx(RadixSelect.Icon, { asChild: true, children: _jsx(FaChevronDown, {}) })] }), _jsx(Portal, { children: _jsxs(SelectContent, { position: "popper", children: [_jsx(RadixSelect.ScrollUpButton, { children: _jsx(FaChevronUp, {}) }), _jsx(SelectViewport, { children: options.map((group, groupIndex) => (_jsxs(Fragment, { children: [group.map((optionOrCategory, optionOrCategoryIndex) => 'options' in optionOrCategory ? (_jsxs(SelectGroup, { children: [_jsx(SelectLabel, { children: optionOrCategory.label }), optionOrCategory.options.map((option) => (_jsxs(SelectItem, { value: option.value, disabled: option.disabled, children: [_jsx(RadixSelect.ItemText, { children: option.label }), _jsx(SelectItemIndicator, { children: _jsx(FaCheck, {}) })] }, option.value)))] }, optionOrCategoryIndex)) : (_jsxs(SelectItem, { value: optionOrCategory.value, disabled: optionOrCategory.disabled, children: [_jsx(RadixSelect.ItemText, { children: optionOrCategory.label }), _jsx(SelectItemIndicator, { children: _jsx(FaCheck, {}) })] }, optionOrCategory.value))), groupIndex < options.length - 1 && _jsx(SelectSeparator, {})] }, groupIndex))) }), _jsx(RadixSelect.ScrollDownButton, {}), _jsx(RadixSelect.Arrow, {})] }) })] }) }));
|
|
84
|
+
}
|
|
85
|
+
//# sourceMappingURL=Select.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/components/forms/Select.tsx"],"names":[],"mappings":"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"}
|
|
@@ -11,6 +11,6 @@ interface FieldProps {
|
|
|
11
11
|
required?: boolean;
|
|
12
12
|
}
|
|
13
13
|
export declare function useFieldsContext(): FieldContext;
|
|
14
|
-
export declare function Field(props: FieldProps): JSX.Element;
|
|
14
|
+
export declare function Field(props: FieldProps): import("react/jsx-runtime").JSX.Element;
|
|
15
15
|
export {};
|
|
16
16
|
//# sourceMappingURL=FieldsContext.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldsContext.d.ts","sourceRoot":"","sources":["../../../../src/components/forms/context/FieldsContext.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,SAAS,EAAuB,MAAM,OAAO,CAAC;AAEtE,UAAU,YAAY;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,SAAS,GAAG,OAAO,CAAC;CAC9B;AAED,UAAU,UAAU;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAoCD,wBAAgB,gBAAgB,IAAI,YAAY,CAQ/C;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,
|
|
1
|
+
{"version":3,"file":"FieldsContext.d.ts","sourceRoot":"","sources":["../../../../src/components/forms/context/FieldsContext.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,SAAS,EAAuB,MAAM,OAAO,CAAC;AAEtE,UAAU,YAAY;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,SAAS,GAAG,OAAO,CAAC;CAC9B;AAED,UAAU,UAAU;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAoCD,wBAAgB,gBAAgB,IAAI,YAAY,CAQ/C;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,2CAqBtC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/forms/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/forms/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/forms/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/forms/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC"}
|
|
@@ -9,6 +9,6 @@ interface ContextType extends FullscreenState {
|
|
|
9
9
|
toggle: () => void;
|
|
10
10
|
}
|
|
11
11
|
export declare function useFullscreen(): ContextType;
|
|
12
|
-
export declare function FullScreenProvider(props: FullscreenProps): JSX.Element;
|
|
12
|
+
export declare function FullScreenProvider(props: FullscreenProps): import("react/jsx-runtime").JSX.Element;
|
|
13
13
|
export {};
|
|
14
14
|
//# sourceMappingURL=FullscreenContext.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FullscreenContext.d.ts","sourceRoot":"","sources":["../../../src/components/fullscreen/FullscreenContext.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,SAAS,EAMV,MAAM,OAAO,CAAC;AAUf,UAAU,eAAe;IACvB,QAAQ,EAAE,SAAS,CAAC;CACrB;AACD,UAAU,eAAe;IACvB,YAAY,EAAE,OAAO,CAAC;CACvB;AAED,UAAU,WAAY,SAAQ,eAAe;IAC3C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AASD,wBAAgB,aAAa,gBAE5B;AACD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,eAAe,
|
|
1
|
+
{"version":3,"file":"FullscreenContext.d.ts","sourceRoot":"","sources":["../../../src/components/fullscreen/FullscreenContext.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,SAAS,EAMV,MAAM,OAAO,CAAC;AAUf,UAAU,eAAe;IACvB,QAAQ,EAAE,SAAS,CAAC;CACrB;AACD,UAAU,eAAe;IACvB,YAAY,EAAE,OAAO,CAAC;CACvB;AAED,UAAU,WAAY,SAAQ,eAAe;IAC3C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AASD,wBAAgB,aAAa,gBAE5B;AACD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,eAAe,2CAYxD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FullscreenToolbarButton.d.ts","sourceRoot":"","sources":["../../../src/components/fullscreen/FullscreenToolbarButton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FullscreenToolbarButton.d.ts","sourceRoot":"","sources":["../../../src/components/fullscreen/FullscreenToolbarButton.tsx"],"names":[],"mappings":"AAMA,wBAAgB,uBAAuB,4CAOtC"}
|
|
@@ -12,6 +12,6 @@ interface ConfirmModalProps {
|
|
|
12
12
|
headerColor: string;
|
|
13
13
|
maxWidth?: number;
|
|
14
14
|
}
|
|
15
|
-
export declare function ConfirmModal(props: ConfirmModalProps): JSX.Element | null;
|
|
15
|
+
export declare function ConfirmModal(props: ConfirmModalProps): import("react/jsx-runtime").JSX.Element | null;
|
|
16
16
|
export {};
|
|
17
17
|
//# sourceMappingURL=ConfirmModal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmModal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/ConfirmModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC,UAAU,iBAAiB;IACzB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAuCD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"ConfirmModal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/ConfirmModal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC,UAAU,iBAAiB;IACzB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAuCD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kDA4DpD"}
|
|
@@ -10,16 +10,16 @@ export interface ModalProps {
|
|
|
10
10
|
width?: number;
|
|
11
11
|
height?: number;
|
|
12
12
|
}
|
|
13
|
-
export declare function Modal(props: ModalProps): JSX.Element | null;
|
|
13
|
+
export declare function Modal(props: ModalProps): import("react/jsx-runtime").JSX.Element | null;
|
|
14
14
|
export declare namespace Modal {
|
|
15
15
|
var Header: (props: {
|
|
16
16
|
children: ReactNode;
|
|
17
|
-
}) => JSX.Element;
|
|
17
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
18
18
|
var Body: (props: {
|
|
19
19
|
children: ReactNode;
|
|
20
|
-
}) => JSX.Element;
|
|
20
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
21
21
|
var Footer: (props: {
|
|
22
22
|
children: ReactNode;
|
|
23
|
-
}) => JSX.Element;
|
|
23
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
24
24
|
}
|
|
25
25
|
//# sourceMappingURL=Modal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/Modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOrD,MAAM,WAAW,UAAU;IACzB,QAAQ,EAAE,YAAY,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC;IAC7C,MAAM,EAAE,OAAO,CAAC;IAChB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAwCD,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/Modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOrD,MAAM,WAAW,UAAU;IACzB,QAAQ,EAAE,YAAY,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC;IAC7C,MAAM,EAAE,OAAO,CAAC;IAChB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAwCD,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,kDAwCtC;yBAxCe,KAAK"}
|
|
@@ -3,5 +3,5 @@ export declare function useRootLayoutContext(): HTMLElement;
|
|
|
3
3
|
export declare function RootLayoutProvider(props: {
|
|
4
4
|
children: ReactNode;
|
|
5
5
|
innerRef: HTMLElement | null;
|
|
6
|
-
}): JSX.Element;
|
|
6
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
//# sourceMappingURL=RootLayoutContext.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RootLayoutContext.d.ts","sourceRoot":"","sources":["../../../src/components/root-layout/RootLayoutContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAI7D,wBAAgB,oBAAoB,gBAOnC;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE;IACxC,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAC;CAC9B,
|
|
1
|
+
{"version":3,"file":"RootLayoutContext.d.ts","sourceRoot":"","sources":["../../../src/components/root-layout/RootLayoutContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAI7D,wBAAgB,oBAAoB,gBAOnC;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE;IACxC,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAC;CAC9B,2CAMA"}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
interface FullSpinnerProps {
|
|
3
2
|
width?: number;
|
|
4
3
|
height?: number;
|
|
5
4
|
}
|
|
6
|
-
export declare function FullSpinner(props: FullSpinnerProps): JSX.Element;
|
|
5
|
+
export declare function FullSpinner(props: FullSpinnerProps): import("react/jsx-runtime").JSX.Element;
|
|
7
6
|
export {};
|
|
8
7
|
//# sourceMappingURL=FullSpinner.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FullSpinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner/FullSpinner.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FullSpinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner/FullSpinner.tsx"],"names":[],"mappings":"AASA,UAAU,gBAAgB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAQD,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAoClD"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
2
|
export interface TableProps {
|
|
3
3
|
children?: ReactNode;
|
|
4
4
|
border?: boolean;
|
|
5
|
+
style?: CSSProperties;
|
|
5
6
|
}
|
|
6
7
|
export declare function Table(props: TableProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
7
8
|
export declare namespace Table {
|
|
8
|
-
var Row: ({ children, border }: TableProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
9
|
-
var Header: ({ children, border }: TableProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
9
|
+
var Row: ({ children, style, border }: TableProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
10
|
+
var Header: ({ children, style, border }: TableProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
10
11
|
}
|
|
11
12
|
//# sourceMappingURL=Table.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/components/table/Table.tsx"],"names":[],"mappings":"AAEA,OAAO,
|
|
1
|
+
{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/components/table/Table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGL,aAAa,EAGb,SAAS,EAGV,MAAM,OAAO,CAAC;AAiDf,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,oDAYtC;yBAZe,KAAK"}
|
|
@@ -41,10 +41,10 @@ function splitChildren(children) {
|
|
|
41
41
|
return { Rows, Header };
|
|
42
42
|
}
|
|
43
43
|
export function Table(props) {
|
|
44
|
-
const { border = true, children } = props;
|
|
44
|
+
const { border = true, style = {}, children } = props;
|
|
45
45
|
const { Header, Rows } = splitChildren(children);
|
|
46
46
|
const tableContextValue = useMemo(() => ({ border }), [border]);
|
|
47
|
-
return (_jsx(TableContext.Provider, { value: tableContextValue, children: _jsxs("table", { children: [Header, _jsx("tbody", { children: Rows })] }) }));
|
|
47
|
+
return (_jsx(TableContext.Provider, { value: tableContextValue, children: _jsxs("table", { style: style, children: [Header, _jsx("tbody", { children: Rows })] }) }));
|
|
48
48
|
}
|
|
49
49
|
function useRowChildren(children) {
|
|
50
50
|
const cells = [];
|
|
@@ -75,12 +75,12 @@ function useRowChildren(children) {
|
|
|
75
75
|
}
|
|
76
76
|
return { cells };
|
|
77
77
|
}
|
|
78
|
-
function Row({ children, border = false }) {
|
|
78
|
+
function Row({ children, style = {}, border = false }) {
|
|
79
79
|
const { cells } = useRowChildren(children);
|
|
80
|
-
return _jsx("tr", { style: { border: border ? '1px solid black' : '' }, children: cells });
|
|
80
|
+
return (_jsx("tr", { style: { border: border ? '1px solid black' : '', ...style }, children: cells }));
|
|
81
81
|
}
|
|
82
82
|
Table.Row = Row;
|
|
83
|
-
Table.Header = ({ children, border = false }) => {
|
|
84
|
-
return (_jsx("thead", { children: _jsx(Table.Row, { border: border, children: children }) }));
|
|
83
|
+
Table.Header = ({ children, style, border = false }) => {
|
|
84
|
+
return (_jsx("thead", { children: _jsx(Table.Row, { border: border, style: style, children: children }) }));
|
|
85
85
|
};
|
|
86
86
|
//# sourceMappingURL=Table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../src/components/table/Table.tsx"],"names":[],"mappings":";AAAA,sCAAsC;AACtC,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EACL,QAAQ,EACR,aAAa,
|
|
1
|
+
{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../src/components/table/Table.tsx"],"names":[],"mappings":"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"}
|
|
@@ -4,5 +4,5 @@ export declare function useTabsContext(): TabItem<string> | undefined;
|
|
|
4
4
|
export declare function TabsProvider<T extends string = string>(props: {
|
|
5
5
|
children: ReactNode;
|
|
6
6
|
opened?: TabItem<T>;
|
|
7
|
-
}): JSX.Element;
|
|
7
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
8
8
|
//# sourceMappingURL=TabsContext.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabsContext.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/TabsContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAE7D,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAItC,wBAAgB,cAAc,gCAO7B;AAED,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE;IAC7D,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;CACrB,
|
|
1
|
+
{"version":3,"file":"TabsContext.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/TabsContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAE7D,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAItC,wBAAgB,cAAc,gCAO7B;AAED,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE;IAC7D,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;CACrB,2CAGA"}
|
|
@@ -4,5 +4,5 @@ export declare function useToolbarContext(): ToolbarOrientation;
|
|
|
4
4
|
export declare function ToolbarProvider(props: {
|
|
5
5
|
children: ReactNode;
|
|
6
6
|
orientation: ToolbarOrientation;
|
|
7
|
-
}): JSX.Element;
|
|
7
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
8
8
|
//# sourceMappingURL=ToolbarContext.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToolbarContext.d.ts","sourceRoot":"","sources":["../../../src/components/toolbar/ToolbarContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAE7D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAIpD,wBAAgB,iBAAiB,uBAOhC;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,EAAE,kBAAkB,CAAC;CACjC,
|
|
1
|
+
{"version":3,"file":"ToolbarContext.d.ts","sourceRoot":"","sources":["../../../src/components/toolbar/ToolbarContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAE7D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAIpD,wBAAgB,iBAAiB,uBAOhC;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,EAAE,kBAAkB,CAAC;CACjC,2CAMA"}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import type { ValueRenderersProps } from '.';
|
|
3
2
|
interface BooleanProps extends ValueRenderersProps {
|
|
4
3
|
value?: boolean;
|
|
5
4
|
}
|
|
6
|
-
export declare function Boolean({ value, ...other }: BooleanProps): JSX.Element;
|
|
5
|
+
export declare function Boolean({ value, ...other }: BooleanProps): import("react/jsx-runtime").JSX.Element;
|
|
7
6
|
export {};
|
|
8
7
|
//# sourceMappingURL=Boolean.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Boolean.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/Boolean.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Boolean.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/Boolean.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,GAAG,CAAC;AAE7C,UAAU,YAAa,SAAQ,mBAAmB;IAChD,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,wBAAgB,OAAO,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,2CAExD"}
|
|
@@ -3,6 +3,6 @@ import type { ValueRenderersProps } from '.';
|
|
|
3
3
|
interface ComponentProps extends ValueRenderersProps {
|
|
4
4
|
children?: ReactElement | ReactElement[];
|
|
5
5
|
}
|
|
6
|
-
export declare function Component({ children, ...other }: ComponentProps): JSX.Element;
|
|
6
|
+
export declare function Component({ children, ...other }: ComponentProps): import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
export {};
|
|
8
8
|
//# sourceMappingURL=Component.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/Component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,GAAG,CAAC;AAE7C,UAAU,cAAe,SAAQ,mBAAmB;IAClD,QAAQ,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;CAC1C;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"Component.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/Component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,GAAG,CAAC;AAE7C,UAAU,cAAe,SAAQ,mBAAmB;IAClD,QAAQ,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;CAC1C;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,2CAE/D"}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { TitleProps } from './Title';
|
|
3
2
|
interface HeaderProps extends TitleProps {
|
|
4
3
|
sorted?: 'asc' | 'desc' | false;
|
|
5
4
|
}
|
|
6
|
-
export declare function Header({ sorted, ...other }: HeaderProps): JSX.Element;
|
|
5
|
+
export declare function Header({ sorted, ...other }: HeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
7
6
|
export {};
|
|
8
7
|
//# sourceMappingURL=Header.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/Header.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;AAE5C,UAAU,WAAY,SAAQ,UAAU;IACtC,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,KAAK,CAAC;CACjC;AACD,wBAAgB,MAAM,CAAC,EAAE,MAAc,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAY/D"}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import type { ValueRenderersProps } from '.';
|
|
3
2
|
interface NumberProps extends ValueRenderersProps {
|
|
4
3
|
value?: number;
|
|
5
4
|
fixed?: number;
|
|
6
5
|
}
|
|
7
|
-
export declare function Number({ value, fixed, ...other }: NumberProps): JSX.Element;
|
|
6
|
+
export declare function Number({ value, fixed, ...other }: NumberProps): import("react/jsx-runtime").JSX.Element;
|
|
8
7
|
export {};
|
|
9
8
|
//# sourceMappingURL=Number.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Number.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/Number.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Number.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/Number.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,GAAG,CAAC;AAE7C,UAAU,WAAY,SAAQ,mBAAmB;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAI7D"}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import type { ValueRenderersProps } from '.';
|
|
3
2
|
interface ObjectRendererProps extends ValueRenderersProps {
|
|
4
3
|
value?: object;
|
|
5
4
|
}
|
|
6
|
-
export declare function ObjectRenderer({ value, ...other }: ObjectRendererProps): JSX.Element;
|
|
5
|
+
export declare function ObjectRenderer({ value, ...other }: ObjectRendererProps): import("react/jsx-runtime").JSX.Element;
|
|
7
6
|
export {};
|
|
8
7
|
//# sourceMappingURL=ObjectRenderer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ObjectRenderer.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/ObjectRenderer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ObjectRenderer.d.ts","sourceRoot":"","sources":["../../../src/components/value-renderers/ObjectRenderer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,GAAG,CAAC;AAE7C,UAAU,mBAAoB,SAAQ,mBAAmB;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CAEtE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-science",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.23.0",
|
|
4
4
|
"description": "React components to build analysis UI",
|
|
5
5
|
"exports": {
|
|
6
6
|
"./app": {
|
|
@@ -26,15 +26,14 @@
|
|
|
26
26
|
],
|
|
27
27
|
"scripts": {
|
|
28
28
|
"build": "npm run clean && npm run build-ts && npm run fix-react-shadow",
|
|
29
|
-
"build-all": "npm run build-app && npm run build-
|
|
29
|
+
"build-all": "npm run build-app && npm run build-storybook && mv storybook-static dist/stories",
|
|
30
30
|
"build-app": "cross-env NO_MINIFY=true vite build",
|
|
31
|
-
"build-
|
|
31
|
+
"build-storybook": "storybook build",
|
|
32
32
|
"build-ts": "tsc -p tsconfig.cjs.json && tsc -p tsconfig.esm.json",
|
|
33
33
|
"check-types": "tsc --noEmit",
|
|
34
34
|
"clean": "rimraf lib lib-esm",
|
|
35
35
|
"createData": "npm run prepack && node scripts/createData",
|
|
36
|
-
"dev": "echo Use npm run dev-app or npm run
|
|
37
|
-
"dev-stories": "ladle serve",
|
|
36
|
+
"dev": "echo Use npm run dev-app or npm run storybook && exit 1",
|
|
38
37
|
"dev-app": "vite --open /pages/demo.html",
|
|
39
38
|
"eslint": "eslint .",
|
|
40
39
|
"eslint-fix": "npm run eslint -- --fix",
|
|
@@ -46,6 +45,7 @@
|
|
|
46
45
|
"prettier": "prettier --check .",
|
|
47
46
|
"prettier-write": "prettier --write .",
|
|
48
47
|
"serve": "vite preview",
|
|
48
|
+
"storybook": "storybook dev -p 6006",
|
|
49
49
|
"test": "npm run playwright && npm run test-only && npm run eslint && npm run prettier && npm run check-types",
|
|
50
50
|
"test-only": "vitest run --coverage "
|
|
51
51
|
},
|
|
@@ -66,6 +66,8 @@
|
|
|
66
66
|
"@headlessui/react": "^1.7.14",
|
|
67
67
|
"@lukeed/uuid": "^2.0.1",
|
|
68
68
|
"@popperjs/core": "^2.11.7",
|
|
69
|
+
"@radix-ui/react-checkbox": "^1.0.4",
|
|
70
|
+
"@radix-ui/react-select": "^1.2.2",
|
|
69
71
|
"@tanstack/react-query": "^4.29.5",
|
|
70
72
|
"@tanstack/react-table": "^8.8.5",
|
|
71
73
|
"biologic-converter": "^0.6.0",
|
|
@@ -78,7 +80,7 @@
|
|
|
78
80
|
"ml-gsd": "^12.1.3",
|
|
79
81
|
"ml-peak-shape-generator": "^4.1.2",
|
|
80
82
|
"ml-signal-processing": "^1.0.3",
|
|
81
|
-
"ml-spectra-processing": "
|
|
83
|
+
"ml-spectra-processing": "12.3.0",
|
|
82
84
|
"ms-spectrum": "^2.3.1",
|
|
83
85
|
"netcdfjs": "^2.0.2",
|
|
84
86
|
"react-d3-utils": "^1.0.0",
|
|
@@ -98,9 +100,12 @@
|
|
|
98
100
|
"devDependencies": {
|
|
99
101
|
"@babel/core": "^7.21.4",
|
|
100
102
|
"@babel/eslint-parser": "^7.21.3",
|
|
101
|
-
"@ladle/react": "^2.12.3",
|
|
102
103
|
"@playwright/experimental-ct-react": "^1.33.0",
|
|
103
104
|
"@playwright/test": "^1.33.0",
|
|
105
|
+
"@storybook/addon-essentials": "^7.0.10",
|
|
106
|
+
"@storybook/blocks": "^7.0.10",
|
|
107
|
+
"@storybook/react": "^7.0.10",
|
|
108
|
+
"@storybook/react-vite": "^7.0.10",
|
|
104
109
|
"@types/babel__core": "^7.20.0",
|
|
105
110
|
"@types/d3-scale-chromatic": "^3.0.0",
|
|
106
111
|
"@types/lodash": "^4.14.194",
|
|
@@ -113,11 +118,13 @@
|
|
|
113
118
|
"cross-env": "^7.0.3",
|
|
114
119
|
"eslint": "^8.39.0",
|
|
115
120
|
"eslint-config-zakodium": "^7.2.0",
|
|
121
|
+
"eslint-plugin-storybook": "^0.6.12",
|
|
116
122
|
"prettier": "^2.8.8",
|
|
117
123
|
"react": "^18.2.0",
|
|
118
124
|
"react-dom": "^18.2.0",
|
|
119
125
|
"react-ocl": "^5.0.0",
|
|
120
126
|
"rimraf": "^5.0.0",
|
|
127
|
+
"storybook": "^7.0.10",
|
|
121
128
|
"typescript": "^5.0.4",
|
|
122
129
|
"vite": "^4.3.3",
|
|
123
130
|
"vitest": "^0.30.1"
|
|
@@ -1,8 +1,12 @@
|
|
|
1
1
|
/** @jsxImportSource @emotion/react */
|
|
2
2
|
import { css } from '@emotion/react';
|
|
3
|
-
import type {
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
import type {
|
|
4
|
+
ReactElement,
|
|
5
|
+
ReactNode,
|
|
6
|
+
ReactFragment,
|
|
7
|
+
MouseEvent as ReactMouseEvent,
|
|
8
|
+
} from 'react';
|
|
9
|
+
import { useCallback } from 'react';
|
|
6
10
|
|
|
7
11
|
import { useAccordionContext } from './AccordionContext';
|
|
8
12
|
|
|
@@ -61,10 +65,16 @@ export function Accordion(props: AccordionProps) {
|
|
|
61
65
|
Accordion.Item = function AccordionItem(props: AccordionItemProps) {
|
|
62
66
|
const { item, utils } = useAccordionContext(props.title, props.defaultOpened);
|
|
63
67
|
|
|
64
|
-
const onClickHandle =
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
+
const onClickHandle = useCallback(
|
|
69
|
+
(event: ReactMouseEvent<HTMLButtonElement, MouseEvent>) => {
|
|
70
|
+
if (event.shiftKey) {
|
|
71
|
+
utils.clear();
|
|
72
|
+
} else {
|
|
73
|
+
utils.toggle();
|
|
74
|
+
}
|
|
75
|
+
},
|
|
76
|
+
[utils],
|
|
77
|
+
);
|
|
68
78
|
|
|
69
79
|
let displayable = false;
|
|
70
80
|
|
|
@@ -87,7 +97,7 @@ Accordion.Item = function AccordionItem(props: AccordionItemProps) {
|
|
|
87
97
|
display: 'flex',
|
|
88
98
|
alignItems: 'center',
|
|
89
99
|
width: '100%',
|
|
90
|
-
userSelect: '
|
|
100
|
+
userSelect: 'none',
|
|
91
101
|
}}
|
|
92
102
|
css={styles.header}
|
|
93
103
|
>
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
/** @jsxImportSource @emotion/react */
|
|
2
|
+
import { css } from '@emotion/react';
|
|
3
|
+
import * as RadixCheckbox from '@radix-ui/react-checkbox';
|
|
4
|
+
import { ReactNode } from 'react';
|
|
5
|
+
import { RxCheck, RxMinus } from 'react-icons/rx/index';
|
|
6
|
+
|
|
7
|
+
export type CheckedState = boolean | 'indeterminate';
|
|
8
|
+
|
|
9
|
+
interface CheckboxProps {
|
|
10
|
+
checked?: CheckedState;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
label?: ReactNode;
|
|
13
|
+
onChange?: (checked: CheckedState) => void;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
const enabledColor = '#1677ff';
|
|
17
|
+
const disabledColor = '#b8b8b8';
|
|
18
|
+
|
|
19
|
+
export function Checkbox(props: CheckboxProps) {
|
|
20
|
+
const {
|
|
21
|
+
checked = 'indeterminate',
|
|
22
|
+
disabled = false,
|
|
23
|
+
label,
|
|
24
|
+
onChange,
|
|
25
|
+
} = props;
|
|
26
|
+
|
|
27
|
+
return (
|
|
28
|
+
<label
|
|
29
|
+
style={{
|
|
30
|
+
display: 'flex',
|
|
31
|
+
alignItems: 'center',
|
|
32
|
+
fontSize: '1.125em',
|
|
33
|
+
}}
|
|
34
|
+
>
|
|
35
|
+
<RadixCheckbox.Root
|
|
36
|
+
checked={checked}
|
|
37
|
+
onCheckedChange={onChange}
|
|
38
|
+
disabled={disabled}
|
|
39
|
+
css={css({
|
|
40
|
+
width: '16px',
|
|
41
|
+
height: '16px',
|
|
42
|
+
backgroundColor: disabled
|
|
43
|
+
? 'rgba(0, 0, 0, 0.04)'
|
|
44
|
+
: checked
|
|
45
|
+
? enabledColor
|
|
46
|
+
: 'white',
|
|
47
|
+
borderWidth: '1px',
|
|
48
|
+
borderColor: checked && !disabled ? enabledColor : disabledColor,
|
|
49
|
+
borderRadius: '4px',
|
|
50
|
+
display: 'flex',
|
|
51
|
+
alignItems: 'center',
|
|
52
|
+
justifyContent: 'center',
|
|
53
|
+
cursor: disabled ? 'not-allowed' : 'pointer',
|
|
54
|
+
})}
|
|
55
|
+
>
|
|
56
|
+
<RadixCheckbox.Indicator
|
|
57
|
+
css={css({
|
|
58
|
+
color: disabled ? disabledColor : 'white',
|
|
59
|
+
})}
|
|
60
|
+
>
|
|
61
|
+
{checked === true ? (
|
|
62
|
+
<RxCheck />
|
|
63
|
+
) : checked === 'indeterminate' ? (
|
|
64
|
+
<RxMinus />
|
|
65
|
+
) : null}
|
|
66
|
+
</RadixCheckbox.Indicator>
|
|
67
|
+
</RadixCheckbox.Root>
|
|
68
|
+
<span
|
|
69
|
+
style={{
|
|
70
|
+
paddingInline: '8px',
|
|
71
|
+
lineHeight: '16px',
|
|
72
|
+
}}
|
|
73
|
+
>
|
|
74
|
+
{label}
|
|
75
|
+
</span>
|
|
76
|
+
</label>
|
|
77
|
+
);
|
|
78
|
+
}
|