diff options
author | Sebastian <sebasjm@gmail.com> | 2023-12-31 15:31:53 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2023-12-31 15:31:53 -0300 |
commit | 08d3e79a9c2adbc295549bdcc05353b6e50565f3 (patch) | |
tree | d3624007d901ba638200239427eae19cddebea47 /packages/web-util | |
parent | 5ed54d872a70c2ba3c0a727d99093335e03f7a77 (diff) | |
download | wallet-core-08d3e79a9c2adbc295549bdcc05353b6e50565f3.tar.xz |
fixing imports
Diffstat (limited to 'packages/web-util')
23 files changed, 53 insertions, 152 deletions
diff --git a/packages/web-util/src/forms/Calendar.tsx b/packages/web-util/src/forms/Calendar.tsx index e476bf6f6..a0df639f3 100644 --- a/packages/web-util/src/forms/Calendar.tsx +++ b/packages/web-util/src/forms/Calendar.tsx @@ -1,8 +1,8 @@ import { AbsoluteTime } from "@gnu-taler/taler-util" -import { useTranslationContext } from "@gnu-taler/web-util/browser" import { add as dateAdd, sub as dateSub, eachDayOfInterval, endOfMonth, endOfWeek, format, getMonth, getYear, isSameDay, isSameMonth, startOfDay, startOfMonth, startOfWeek } from "date-fns" import { VNode, h } from "preact" import { useState } from "preact/hooks" +import { useTranslationContext } from "../index.browser.js" export function Calendar({ value, onChange }: { value: AbsoluteTime | undefined, onChange: (v: AbsoluteTime) => void }): VNode { const today = startOfDay(new Date()) diff --git a/packages/web-util/src/forms/DefaultForm.tsx b/packages/web-util/src/forms/DefaultForm.tsx index be8affbec..ffd2812da 100644 --- a/packages/web-util/src/forms/DefaultForm.tsx +++ b/packages/web-util/src/forms/DefaultForm.tsx @@ -1,14 +1,6 @@ - import { ComponentChildren, Fragment, h } from "preact"; -import { FormProvider, FormState } from "./FormProvider.js"; -import { DoubleColumnForm, RenderAllFieldsByUiConfig } from "./forms.js"; - - -export interface FlexibleForm<T extends object> { - versionId: string; - design: DoubleColumnForm; - behavior?: (form: Partial<T>) => FormState<T>; -} +import { FormProvider } from "./FormProvider.js"; +import { FlexibleForm, RenderAllFieldsByUiConfig } from "./forms.js"; export function DefaultForm<T extends object>({ initial, @@ -16,11 +8,13 @@ export function DefaultForm<T extends object>({ form, onSubmit, children, + readOnly, }: { children?: ComponentChildren; initial: Partial<T>; onSubmit?: (v: Partial<T>) => void; form: FlexibleForm<T>; + readOnly?: boolean; onUpdate?: (d: Partial<T>) => void; }) { return ( @@ -28,6 +22,7 @@ export function DefaultForm<T extends object>({ initialValue={initial} onUpdate={onUpdate} onSubmit={onSubmit} + readOnly={readOnly} computeFormState={form.behavior} > <div class="space-y-10 divide-y -mt-5 divide-gray-900/10"> diff --git a/packages/web-util/src/forms/InputAbsoluteTime.stories.tsx b/packages/web-util/src/forms/InputAbsoluteTime.stories.tsx index 54e41ffae..d146d20bf 100644 --- a/packages/web-util/src/forms/InputAbsoluteTime.stories.tsx +++ b/packages/web-util/src/forms/InputAbsoluteTime.stories.tsx @@ -22,8 +22,8 @@ import { AbsoluteTime, TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputAmount.stories.tsx b/packages/web-util/src/forms/InputAmount.stories.tsx index 872726247..d6dd9387a 100644 --- a/packages/web-util/src/forms/InputAmount.stories.tsx +++ b/packages/web-util/src/forms/InputAmount.stories.tsx @@ -22,8 +22,8 @@ import { AmountJson, Amounts, TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputArray.stories.tsx b/packages/web-util/src/forms/InputArray.stories.tsx index ee25d355b..c44789c37 100644 --- a/packages/web-util/src/forms/InputArray.stories.tsx +++ b/packages/web-util/src/forms/InputArray.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputChoiceHorizontal.stories.tsx b/packages/web-util/src/forms/InputChoiceHorizontal.stories.tsx index 7872afac7..a1c60e44a 100644 --- a/packages/web-util/src/forms/InputChoiceHorizontal.stories.tsx +++ b/packages/web-util/src/forms/InputChoiceHorizontal.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputChoiceHorizontal.tsx b/packages/web-util/src/forms/InputChoiceHorizontal.tsx index 594b1c32e..b490a2c25 100644 --- a/packages/web-util/src/forms/InputChoiceHorizontal.tsx +++ b/packages/web-util/src/forms/InputChoiceHorizontal.tsx @@ -4,14 +4,14 @@ import { LabelWithTooltipMaybeRequired } from "./InputLine.js"; import { useField } from "./useField.js"; import { UIFormProps } from "./FormProvider.js"; -export interface Choice<V> { +export interface ChoiceH<V> { label: TranslatedString; value: V; } export function InputChoiceHorizontal<T extends object, K extends keyof T>( props: { - choices: Choice<T[K]>[]; + choices: ChoiceH<T[K]>[]; } & UIFormProps<T, K>, ): VNode { const { diff --git a/packages/web-util/src/forms/InputChoiceStacked.stories.tsx b/packages/web-util/src/forms/InputChoiceStacked.stories.tsx index 215418430..11816ed98 100644 --- a/packages/web-util/src/forms/InputChoiceStacked.stories.tsx +++ b/packages/web-util/src/forms/InputChoiceStacked.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputChoiceStacked.tsx b/packages/web-util/src/forms/InputChoiceStacked.tsx index 48d367ff2..e49b87800 100644 --- a/packages/web-util/src/forms/InputChoiceStacked.tsx +++ b/packages/web-util/src/forms/InputChoiceStacked.tsx @@ -4,7 +4,7 @@ import { LabelWithTooltipMaybeRequired } from "./InputLine.js"; import { useField } from "./useField.js"; import { UIFormProps } from "./FormProvider.js"; -export interface Choice<V> { +export interface ChoiceS<V> { label: TranslatedString; description?: TranslatedString; value: V; @@ -12,7 +12,7 @@ export interface Choice<V> { export function InputChoiceStacked<T extends object, K extends keyof T>( props: { - choices: Choice<T[K]>[]; + choices: ChoiceS<T[K]>[]; } & UIFormProps<T, K>, ): VNode { const { diff --git a/packages/web-util/src/forms/InputDate.tsx b/packages/web-util/src/forms/InputDate.tsx deleted file mode 100644 index 1fd81aad9..000000000 --- a/packages/web-util/src/forms/InputDate.tsx +++ /dev/null @@ -1,37 +0,0 @@ -import { AbsoluteTime } from "@gnu-taler/taler-util"; -import { InputLine, UIFormProps } from "./InputLine.js"; -import { CalendarIcon } from "@heroicons/react/24/outline"; -import { VNode, h } from "preact"; -import { format, parse } from "date-fns"; - -export function InputDate<T extends object, K extends keyof T>( - props: { pattern?: string } & UIFormProps<T, K>, -): VNode { - const pattern = props.pattern ?? "dd/MM/yyyy"; - return ( - <InputLine<T, K> - type="text" - after={{ - type: "icon", - icon: <CalendarIcon class="h-6 w-6" />, - }} - converter={{ - //@ts-ignore - fromStringUI: (v): AbsoluteTime => { - if (!v) return AbsoluteTime.never(); - const t_ms = parse(v, pattern, Date.now()).getTime(); - return AbsoluteTime.fromMilliseconds(t_ms); - }, - //@ts-ignore - toStringUI: (v: AbsoluteTime) => { - return !v || !v.t_ms - ? "" - : v.t_ms === "never" - ? "never" - : format(v.t_ms, pattern); - }, - }} - {...props} - /> - ); -} diff --git a/packages/web-util/src/forms/InputFile.stories.tsx b/packages/web-util/src/forms/InputFile.stories.tsx index 8a1783bda..6779977b6 100644 --- a/packages/web-util/src/forms/InputFile.stories.tsx +++ b/packages/web-util/src/forms/InputFile.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputInteger.stories.tsx b/packages/web-util/src/forms/InputInteger.stories.tsx index 344865817..f3bdfc500 100644 --- a/packages/web-util/src/forms/InputInteger.stories.tsx +++ b/packages/web-util/src/forms/InputInteger.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputLine.stories.tsx b/packages/web-util/src/forms/InputLine.stories.tsx index 0d55bddf7..d048aa05a 100644 --- a/packages/web-util/src/forms/InputLine.stories.tsx +++ b/packages/web-util/src/forms/InputLine.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputSelectMultiple.stories.tsx b/packages/web-util/src/forms/InputSelectMultiple.stories.tsx index 4dac61f21..7fdc7fca5 100644 --- a/packages/web-util/src/forms/InputSelectMultiple.stories.tsx +++ b/packages/web-util/src/forms/InputSelectMultiple.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputSelectMultiple.tsx b/packages/web-util/src/forms/InputSelectMultiple.tsx index 06eb91bb3..a721eadce 100644 --- a/packages/web-util/src/forms/InputSelectMultiple.tsx +++ b/packages/web-util/src/forms/InputSelectMultiple.tsx @@ -1,5 +1,5 @@ import { Fragment, VNode, h } from "preact"; -import { Choice } from "./InputChoiceStacked.js"; +import { ChoiceS } from "./InputChoiceStacked.js"; import { LabelWithTooltipMaybeRequired } from "./InputLine.js"; import { useField } from "./useField.js"; import { useState } from "preact/hooks"; @@ -7,7 +7,7 @@ import { UIFormProps } from "./FormProvider.js"; export function InputSelectMultiple<T extends object, K extends keyof T>( props: { - choices: Choice<T[K]>[]; + choices: ChoiceS<T[K]>[]; unique?: boolean; max?: number; } & UIFormProps<T, K>, diff --git a/packages/web-util/src/forms/InputSelectOne.stories.tsx b/packages/web-util/src/forms/InputSelectOne.stories.tsx index 0bb871500..acf2d0c8f 100644 --- a/packages/web-util/src/forms/InputSelectOne.stories.tsx +++ b/packages/web-util/src/forms/InputSelectOne.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputSelectOne.tsx b/packages/web-util/src/forms/InputSelectOne.tsx index 98430306e..d100b079d 100644 --- a/packages/web-util/src/forms/InputSelectOne.tsx +++ b/packages/web-util/src/forms/InputSelectOne.tsx @@ -1,13 +1,13 @@ import { Fragment, VNode, h } from "preact"; -import { Choice } from "./InputChoiceStacked.js"; -import { LabelWithTooltipMaybeRequired } from "./InputLine.js"; -import { useField } from "./useField.js"; import { useState } from "preact/hooks"; import { UIFormProps } from "./FormProvider.js"; +import { ChoiceS } from "./InputChoiceStacked.js"; +import { LabelWithTooltipMaybeRequired } from "./InputLine.js"; +import { useField } from "./useField.js"; export function InputSelectOne<T extends object, K extends keyof T>( props: { - choices: Choice<T[K]>[]; + choices: ChoiceS<T[K]>[]; } & UIFormProps<T, K>, ): VNode { const { name, label, choices, placeholder, tooltip, required } = props; diff --git a/packages/web-util/src/forms/InputText.stories.tsx b/packages/web-util/src/forms/InputText.stories.tsx index 9ce733d4a..0137b7488 100644 --- a/packages/web-util/src/forms/InputText.stories.tsx +++ b/packages/web-util/src/forms/InputText.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputTextArea.stories.tsx b/packages/web-util/src/forms/InputTextArea.stories.tsx index df35b25c4..50d659a74 100644 --- a/packages/web-util/src/forms/InputTextArea.stories.tsx +++ b/packages/web-util/src/forms/InputTextArea.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/InputToggle.stories.tsx b/packages/web-util/src/forms/InputToggle.stories.tsx index 735e812f3..005a1d448 100644 --- a/packages/web-util/src/forms/InputToggle.stories.tsx +++ b/packages/web-util/src/forms/InputToggle.stories.tsx @@ -22,8 +22,8 @@ import { TranslatedString } from "@gnu-taler/taler-util"; import * as tests from "@gnu-taler/web-util/testing"; import { - NiceForm as TestedComponent, -} from "./NiceForm.js"; + DefaultForm as TestedComponent, +} from "./DefaultForm.js"; import { FlexibleForm } from "./forms.js"; export default { diff --git a/packages/web-util/src/forms/NiceForm.tsx b/packages/web-util/src/forms/NiceForm.tsx deleted file mode 100644 index d01b80b02..000000000 --- a/packages/web-util/src/forms/NiceForm.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { ComponentChildren, Fragment, h } from "preact"; -import { FormProvider } from "./FormProvider.js"; -import { FlexibleForm, RenderAllFieldsByUiConfig } from "./forms.js"; - -export function NiceForm<T extends object>({ - initial, - onUpdate, - form, - onSubmit, - children, - readOnly, -}: { - children?: ComponentChildren; - initial: Partial<T>; - onSubmit?: (v: Partial<T>) => void; - form: FlexibleForm<T>; - readOnly?: boolean; - onUpdate?: (d: Partial<T>) => void; -}) { - return ( - <FormProvider - initialValue={initial} - onUpdate={onUpdate} - onSubmit={onSubmit} - readOnly={readOnly} - computeFormState={form.behavior} - > - <div class="space-y-10 divide-y -mt-5 divide-gray-900/10"> - {form.design.map((section, i) => { - if (!section) return <Fragment />; - return ( - <div class="grid grid-cols-1 gap-x-8 gap-y-8 pt-5 md:grid-cols-3"> - <div class="px-4 sm:px-0"> - <h2 class="text-base font-semibold leading-7 text-gray-900"> - {section.title} - </h2> - {section.description && ( - <p class="mt-1 text-sm leading-6 text-gray-600"> - {section.description} - </p> - )} - </div> - <div class="bg-white shadow-sm ring-1 ring-gray-900/5 rounded-md md:col-span-2"> - <div class="p-3"> - <div class="grid max-w-2xl grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6"> - <RenderAllFieldsByUiConfig - key={i} - fields={section.fields} - /> - </div> - </div> - </div> - </div> - ); - })} - </div> - {children} - </FormProvider> - ); -} diff --git a/packages/web-util/src/forms/TimePicker.tsx b/packages/web-util/src/forms/TimePicker.tsx index c6dc3e794..5e4e7a8fa 100644 --- a/packages/web-util/src/forms/TimePicker.tsx +++ b/packages/web-util/src/forms/TimePicker.tsx @@ -1,8 +1,7 @@ import { AbsoluteTime } from "@gnu-taler/taler-util" -import { useTranslationContext } from "@gnu-taler/web-util/browser" -import { startOfDay, getHours, getMinutes, getSeconds, setHours } from "date-fns" +import { getHours, getMinutes, getSeconds, setHours } from "date-fns" import { Fragment, VNode, h } from "preact" -import { useState } from "preact/hooks" +import { useTranslationContext } from "../index.browser.js" export function TimePicker({ value, onChange, onConfirm }: { value: AbsoluteTime | undefined, onChange: (v: AbsoluteTime) => void, onConfirm: () => void }): VNode { const date = !value ? new Date() : new Date(AbsoluteTime.toStampMs(value)) diff --git a/packages/web-util/src/forms/index.ts b/packages/web-util/src/forms/index.ts index 08bb9ee77..4ff71f197 100644 --- a/packages/web-util/src/forms/index.ts +++ b/packages/web-util/src/forms/index.ts @@ -1,19 +1,23 @@ +export * from "./Calendar.js" export * from "./Caption.js" +export * from "./DefaultForm.js" +export * from "./Dialog.js" export * from "./FormProvider.js" -export * from "./forms.js" export * from "./Group.js" -export * from "./index.js" +export * from "./InputAbsoluteTime.js" export * from "./InputAmount.js" export * from "./InputArray.js" export * from "./InputChoiceHorizontal.js" export * from "./InputChoiceStacked.js" -export * from "./InputDate.js" export * from "./InputFile.js" export * from "./InputInteger.js" export * from "./InputLine.js" export * from "./InputSelectMultiple.js" export * from "./InputSelectOne.js" -export * from "./InputTextArea.js" export * from "./InputText.js" +export * from "./InputTextArea.js" +export * from "./InputToggle.js" +export * from "./TimePicker.js" +export * from "./forms.js" export * from "./useField.js" -export * from "./DefaultForm.js" + |