commit ef6b025b7fbd80fab0da33cc1771d87fa55126d1 parent f040aa1126775f462cea46369386e01efef3459d Author: Sebastian <sebasjm@gmail.com> Date: Tue, 11 Feb 2025 12:54:59 -0300 fix #9517 Diffstat:
14 files changed, 105 insertions(+), 32 deletions(-)
diff --git a/packages/merchant-backoffice-ui/src/components/form/Input.tsx b/packages/merchant-backoffice-ui/src/components/form/Input.tsx @@ -107,7 +107,11 @@ export function Input<T>({ </span> )} </p> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} </div> {side} </div> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputArray.tsx b/packages/merchant-backoffice-ui/src/components/form/InputArray.tsx @@ -123,8 +123,13 @@ export function InputArray<T>({ )} </div> {help} - {error && <p class="help is-danger"> {error} </p>} - + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {" "} + {error}{" "} + </p> + )} + {suggestions.length > 0 ? ( <div> <DropdownList @@ -153,7 +158,9 @@ export function InputArray<T>({ class="tag is-medium is-danger is-delete mb-0" onClick={() => { onChange(array.filter((f) => f !== v) as T[keyof T]); - setCurrentValue(getSuggestion ? (v as any).description : toStr(v)); + setCurrentValue( + getSuggestion ? (v as any).description : toStr(v), + ); }} /> </div> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputBoolean.tsx b/packages/merchant-backoffice-ui/src/components/form/InputBoolean.tsx @@ -83,7 +83,11 @@ export function InputBoolean<T>({ </label> {help} </p> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} </div> </div> </div> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputDate.tsx b/packages/merchant-backoffice-ui/src/components/form/InputDate.tsx @@ -24,7 +24,10 @@ import { ComponentChildren, h, VNode } from "preact"; import { useState } from "preact/hooks"; import { DatePicker } from "../picker/DatePicker.js"; import { InputProps, useField } from "./useField.js"; -import { dateFormatForSettings, usePreference } from "../../hooks/preference.js"; +import { + dateFormatForSettings, + usePreference, +} from "../../hooks/preference.js"; export interface Props<T> extends InputProps<T> { readonly?: boolean; @@ -47,7 +50,7 @@ export function InputDate<T>({ }: Props<keyof T>): VNode { const [opened, setOpened] = useState(false); const { i18n } = useTranslationContext(); - const [settings] = usePreference() + const [settings] = usePreference(); const { error, required, value, onChange } = useField<T>(name); @@ -117,7 +120,11 @@ export function InputDate<T>({ </a> </div> </div> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} </div> {!readonly && ( diff --git a/packages/merchant-backoffice-ui/src/components/form/InputDuration.tsx b/packages/merchant-backoffice-ui/src/components/form/InputDuration.tsx @@ -147,7 +147,11 @@ export function InputDuration<T>({ </a> </div> </div> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} <span class="has-text-grey">{help}</span> </div> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx b/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx @@ -77,9 +77,8 @@ export function InputImage<T>({ readonly={readonly} onChange={(e) => { const f: FileList | null = e.currentTarget.files; - console.log("on change", e, f) + console.log("on change", e, f); if (!f || f.length != 1) { - return onChange(undefined!); } if (f[0].size > MAX_IMAGE_UPLOAD_SIZE) { @@ -94,16 +93,22 @@ export function InputImage<T>({ "", ), ); - return onChange(`data:${f[0].type};base64,${b64}` as T[keyof T]); + return onChange( + `data:${f[0].type};base64,${b64}` as T[keyof T], + ); }); }} /> {help} {children} </p> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} {sizeError && ( - <p class="help is-danger"> + <p class="help is-danger" style={{ fontSize: 16 }}> <i18n.Translate>Image must be smaller than 1 MB</i18n.Translate> </p> )} @@ -113,12 +118,15 @@ export function InputImage<T>({ </button> )} {value && ( - <button class="button" onClick={() => { - if (image.current) { - image.current.value = "" - } - onChange(undefined!); - }}> + <button + class="button" + onClick={() => { + if (image.current) { + image.current.value = ""; + } + onChange(undefined!); + }} + > <i18n.Translate>Remove</i18n.Translate> </button> )} diff --git a/packages/merchant-backoffice-ui/src/components/form/InputSecured.tsx b/packages/merchant-backoffice-ui/src/components/form/InputSecured.tsx @@ -133,7 +133,11 @@ export function InputSecured<T>({ </div> </Fragment> )} - {error ? <p class="help is-danger">{error}</p> : null} + {error ? ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + ) : null} </div> </div> {active && ( diff --git a/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx b/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx @@ -88,7 +88,11 @@ export function InputSelector<T>({ <i class="mdi mdi-alert" /> </span> )} - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} </div> </div> </div> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputTab.tsx b/packages/merchant-backoffice-ui/src/components/form/InputTab.tsx @@ -64,8 +64,12 @@ export function InputTab<T>({ <ul> {values.map((v, i) => { return ( - <li key={i} class={value === v ? "is-active" : ""} - onClick={(e) => { onChange(v) }} + <li + key={i} + class={value === v ? "is-active" : ""} + onClick={(e) => { + onChange(v); + }} > <a style={{ cursor: "initial" }}> <span>{toStr(v)}</span> @@ -78,11 +82,18 @@ export function InputTab<T>({ {help} </p> {required && ( - <span class="icon has-text-danger is-right" style={{ height: "2.5em" }}> + <span + class="icon has-text-danger is-right" + style={{ height: "2.5em" }} + > <i class="mdi mdi-alert" /> </span> )} - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} </div> </div> </div> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputToggle.tsx b/packages/merchant-backoffice-ui/src/components/form/InputToggle.tsx @@ -97,7 +97,11 @@ export function InputToggle<T>({ </label> <p>{help}</p> </p> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} </div> {side} </div> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputWithAddon.tsx b/packages/merchant-backoffice-ui/src/components/form/InputWithAddon.tsx @@ -118,7 +118,11 @@ export function InputWithAddon<T>({ </div> )} </div> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} <span class="has-text-grey">{help}</span> </div> {expand ? <div>{side}</div> : side} diff --git a/packages/merchant-backoffice-ui/src/components/form/JumpToElementById.tsx b/packages/merchant-backoffice-ui/src/components/form/JumpToElementById.tsx @@ -65,7 +65,11 @@ export function JumpToElementById({ onChange={(e) => setId(e.currentTarget.value)} placeholder={placeholder} /> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} </div> <span class="has-tooltip-bottom" data-tooltip={description}> <button class="button" onClick={() => check(id)}> diff --git a/packages/merchant-backoffice-ui/src/components/form/TextField.tsx b/packages/merchant-backoffice-ui/src/components/form/TextField.tsx @@ -62,7 +62,11 @@ export function TextField<T>({ {children} {help} </p> - {error && <p class="help is-danger">{error}</p>} + {error && ( + <p class="help is-danger" style={{ fontSize: 16 }}> + {error} + </p> + )} </div> {side} </div> diff --git a/packages/merchant-backoffice-ui/src/components/modal/index.tsx b/packages/merchant-backoffice-ui/src/components/modal/index.tsx @@ -285,10 +285,14 @@ export function ImportingAccountModal({ /> </p> {letter !== undefined && errors.letter && ( - <p class="help is-danger">{errors.letter}</p> + <p class="help is-danger" style={{ fontSize: 16 }}> + {errors.letter} + </p> )} {parsingError !== undefined && ( - <p class="help is-danger">{parsingError}</p> + <p class="help is-danger" style={{ fontSize: 16 }}> + {parsingError} + </p> )} </div> </div>