Skip to content

Commit 2bf8b89

Browse files
committed
wip: add textStyle group
Needs to update ACSExportOptions type from core
1 parent 2d4cb55 commit 2bf8b89

1 file changed

Lines changed: 45 additions & 29 deletions

File tree

src/component/modal/PublicationStringModal.tsx

Lines changed: 45 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,13 @@ import { Button, Checkbox, Dialog, DialogFooter } from '@blueprintjs/core';
22
import styled from '@emotion/styled';
33
import type { ACSExportOptions, Spectrum1D } from '@zakodium/nmrium-core';
44
import type { FormEvent } from 'react';
5-
import { Form, assert, useForm } from 'react-science/ui';
5+
import {
6+
FieldGroupSVGTextStyleFields,
7+
Form,
8+
assert,
9+
svgTextStyleFieldsSchema,
10+
useForm,
11+
} from 'react-science/ui';
612
import { z } from 'zod';
713

814
import { isSpectrum1D } from '../../data/data1d/Spectrum1D/isSpectrum1D.js';
@@ -36,6 +42,7 @@ const validationSchema = z.object({
3642
format: z.enum(['IMJA', 'IMJ', 'D']),
3743
couplingFormat: z.string(),
3844
deltaFormat: z.string(),
45+
textStyle: svgTextStyleFieldsSchema,
3946
});
4047

4148
const exportOptions: Array<SelectItem<ExportSignalKind>> = [
@@ -94,7 +101,15 @@ function InnerPublicationStringModal(props: InnerPublicationStringModalProps) {
94101
const { dispatch } = usePreferences();
95102
const currentACSOptions = useACSSettings();
96103
const form = useForm({
97-
defaultValues: currentACSOptions,
104+
defaultValues: {
105+
...currentACSOptions,
106+
textStyle: {
107+
fill: '#000000',
108+
fontSize: '16',
109+
fontStyle: 'normal',
110+
fontWeight: 'normal',
111+
} as z.input<typeof svgTextStyleFieldsSchema>,
112+
},
98113
validators: { onChange: validationSchema },
99114
onSubmit: ({ value }) => {
100115
assert(spectrum && isSpectrum1D(spectrum));
@@ -124,28 +139,33 @@ function InnerPublicationStringModal(props: InnerPublicationStringModalProps) {
124139
style={{ minWidth: 600 }}
125140
>
126141
<Form noValidate onSubmit={onSubmit} layout="inline">
127-
<DialogBodyStyled>
128-
<form.Section title="Composition">
129-
<form.AppField name="signalKind">
130-
{(field) => (
131-
<field.Select label="Export filter" items={exportOptions} />
132-
)}
133-
</form.AppField>
134-
<form.AppField name="format">
135-
{(field) => (
136-
<field.Select label="Export format" items={exportFormats} />
137-
)}
138-
</form.AppField>
139-
<form.AppField name="ascending">
140-
{(field) => <field.Checkbox label="Ascending order" />}
141-
</form.AppField>
142-
<form.AppField name="deltaFormat">
143-
{(field) => <field.Input label="Delta format" />}
144-
</form.AppField>
145-
<form.AppField name="couplingFormat">
146-
{(field) => <field.Input label="Couplings format" />}
147-
</form.AppField>
148-
</form.Section>
142+
<StyledDialogBody>
143+
<form.AppField name="signalKind">
144+
{(field) => (
145+
<field.Select label="Export filter" items={exportOptions} />
146+
)}
147+
</form.AppField>
148+
<form.AppField name="format">
149+
{(field) => (
150+
<field.Select label="Export format" items={exportFormats} />
151+
)}
152+
</form.AppField>
153+
<form.AppField name="ascending">
154+
{(field) => <field.Checkbox label="Ascending order" />}
155+
</form.AppField>
156+
<form.AppField name="deltaFormat">
157+
{(field) => <field.Input label="Delta format" />}
158+
</form.AppField>
159+
<form.AppField name="couplingFormat">
160+
{(field) => <field.Input label="Couplings format" />}
161+
</form.AppField>
162+
163+
<FieldGroupSVGTextStyleFields
164+
form={form}
165+
fields="textStyle"
166+
label="Text style"
167+
previewText="Publication string"
168+
/>
149169

150170
<Body>
151171
<form.Subscribe selector={(s) => s.values}>
@@ -158,7 +178,7 @@ function InnerPublicationStringModal(props: InnerPublicationStringModalProps) {
158178
)}
159179
</form.Subscribe>
160180
</Body>
161-
</DialogBodyStyled>
181+
</StyledDialogBody>
162182
<DialogFooter
163183
actions={
164184
<form.SubmitButton intent="success">
@@ -178,10 +198,6 @@ function InnerPublicationStringModal(props: InnerPublicationStringModalProps) {
178198
);
179199
}
180200

181-
const DialogBodyStyled = styled(StyledDialogBody)`
182-
margin-top: -15px;
183-
`;
184-
185201
const CopyPreviewButton = styled(Button)`
186202
float: right;
187203
margin-left: 5px;

0 commit comments

Comments
 (0)