@teknim/rjsf-mantine
Version:
Mantine theme, fields and widgets for react-jsonschema-form
1,743 lines (1,703 loc) • 50.1 kB
JavaScript
// src/Form/index.ts
import { withTheme } from "@rjsf/core";
// src/templates/ArrayFieldItemTemplate.tsx
import { Box, Flex, Group } from "@mantine/core";
import { jsx, jsxs } from "react/jsx-runtime";
function ArrayFieldItemTemplate(props) {
const {
disabled,
className,
hasCopy,
hasMoveDown,
hasMoveUp,
hasRemove,
hasToolbar,
index,
onCopyIndexClick,
onDropIndexClick,
onReorderClick,
readonly,
uiSchema,
registry,
children
} = props;
const { CopyButton: CopyButton2, MoveDownButton: MoveDownButton2, MoveUpButton: MoveUpButton2, RemoveButton: RemoveButton2 } = registry.templates.ButtonTemplates;
return /* @__PURE__ */ jsx(Box, { className: className || "array-item", mb: "xs", children: /* @__PURE__ */ jsxs(Flex, { gap: "xs", align: "end", justify: "center", children: [
/* @__PURE__ */ jsx(Box, { w: "100%", children }),
hasToolbar && /* @__PURE__ */ jsxs(Group, { wrap: "nowrap", gap: 2, children: [
(hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx(
MoveUpButton2,
{
iconType: "sm",
className: "array-item-move-up",
disabled: disabled || readonly || !hasMoveUp,
onClick: onReorderClick(index, index - 1),
uiSchema,
registry
}
),
(hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx(
MoveDownButton2,
{
iconType: "sm",
className: "array-item-move-down",
disabled: disabled || readonly || !hasMoveDown,
onClick: onReorderClick(index, index + 1),
uiSchema,
registry
}
),
hasCopy && /* @__PURE__ */ jsx(
CopyButton2,
{
iconType: "sm",
className: "array-item-copy",
disabled: disabled || readonly,
onClick: onCopyIndexClick(index),
uiSchema,
registry
}
),
hasRemove && /* @__PURE__ */ jsx(
RemoveButton2,
{
iconType: "sm",
className: "array-item-remove",
disabled: disabled || readonly,
onClick: onDropIndexClick(index),
uiSchema,
registry
}
)
] })
] }) }, `array-item-${index}`);
}
// src/templates/ArrayFieldTemplate.tsx
import {
getTemplate,
getUiOptions
} from "@rjsf/utils";
import { Fieldset, Box as Box2, Group as Group2 } from "@mantine/core";
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
function ArrayFieldTemplate(props) {
const {
canAdd,
className,
disabled,
idSchema,
items,
onAddClick,
readonly,
required,
schema,
uiSchema,
title,
registry
} = props;
const uiOptions = getUiOptions(uiSchema);
const ArrayFieldDescriptionTemplate = getTemplate(
"ArrayFieldDescriptionTemplate",
registry,
uiOptions
);
const ArrayFieldItemTemplate2 = getTemplate(
"ArrayFieldItemTemplate",
registry,
uiOptions
);
const ArrayFieldTitleTemplate2 = getTemplate(
"ArrayFieldTitleTemplate",
registry,
uiOptions
);
const {
ButtonTemplates: { AddButton: AddButton2 }
} = registry.templates;
const legend = (uiOptions.title || title) && /* @__PURE__ */ jsx2(
ArrayFieldTitleTemplate2,
{
idSchema,
required,
title: uiOptions.title || title,
schema,
uiSchema,
registry
}
);
return /* @__PURE__ */ jsxs2(Fieldset, { legend, className, id: idSchema.$id, children: [
(uiOptions.description || schema.description) && /* @__PURE__ */ jsx2(
ArrayFieldDescriptionTemplate,
{
description: uiOptions.description || schema.description,
idSchema,
schema,
uiSchema,
registry
}
),
/* @__PURE__ */ jsx2(Box2, { className: "row array-item-list", children: items && items.map(({ key, ...itemProps }) => /* @__PURE__ */ jsx2(ArrayFieldItemTemplate2, { ...itemProps }, key)) }),
canAdd && /* @__PURE__ */ jsx2(Group2, { justify: "flex-end", children: /* @__PURE__ */ jsx2(
AddButton2,
{
className: "array-item-add",
disabled: disabled || readonly,
onClick: onAddClick,
uiSchema,
registry
}
) })
] });
}
// src/templates/ArrayFieldTitleTemplate.tsx
import {
getUiOptions as getUiOptions2,
titleId
} from "@rjsf/utils";
import { Title } from "@mantine/core";
import { jsx as jsx3 } from "react/jsx-runtime";
function ArrayFieldTitleTemplate(props) {
const { idSchema, title, uiSchema, registry } = props;
const options = getUiOptions2(uiSchema, registry.globalUiOptions);
const { label: displayLabel = true } = options;
if (!title || !displayLabel) {
return null;
}
return /* @__PURE__ */ jsx3(Title, { id: titleId(idSchema), order: 4, fw: "normal", children: title });
}
// src/templates/BaseInputTemplate.tsx
import {
ariaDescribedByIds,
examplesId,
getInputProps,
labelValue
} from "@rjsf/utils";
import { TextInput, NumberInput } from "@mantine/core";
// src/utils.ts
var uiOptionsKeys = [
"emptyValue",
"classNames",
"title",
"help",
"autocomplete",
"disabled",
"enumDisabled",
"hideError",
"readonly",
"order",
"filePreview",
"inline",
"inputType",
"submitButtonOptions",
"widget",
"enumNames",
"addable",
"copyable",
"orderable",
"removable",
"duplicateKeySuffixSeparator",
"enumOptions",
"enableMarkdownInDescription"
];
function cleanupOptions(options) {
const result = {};
for (const key in options) {
if (!uiOptionsKeys.includes(key)) {
result[key] = options[key];
}
}
return result;
}
// src/templates/BaseInputTemplate.tsx
import { Fragment, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
function BaseInputTemplate(props) {
const {
id,
type,
schema,
value,
placeholder,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
onChange,
onChangeOverride,
onBlur,
onFocus,
options,
rawErrors
} = props;
const inputProps = getInputProps(schema, type, options, false);
const themeProps = cleanupOptions(options);
const handleNumberChange = (value2) => onChange(value2);
const handleChange = onChangeOverride ? onChangeOverride : (e) => onChange(e.target.value === "" ? options.emptyValue ?? "" : e.target.value);
const handleBlur = (e) => onBlur(id, e.target && e.target.value);
const handleFocus = (e) => onFocus(id, e.target && e.target.value);
const input = inputProps.type === "number" || inputProps.type === "integer" ? /* @__PURE__ */ jsx4(
NumberInput,
{
id,
name: id,
label: labelValue(label || void 0, hideLabel, false),
required,
autoFocus: autofocus,
disabled: disabled || readonly,
onBlur: !readonly ? handleBlur : void 0,
onChange: !readonly ? handleNumberChange : void 0,
onFocus: !readonly ? handleFocus : void 0,
placeholder,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
list: schema.examples ? examplesId(id) : void 0,
...inputProps,
...themeProps,
step: typeof inputProps.step === "number" ? inputProps.step : 1,
type: "text",
value,
"aria-describedby": ariaDescribedByIds(id, !!schema.examples)
}
) : /* @__PURE__ */ jsx4(
TextInput,
{
id,
name: id,
label: labelValue(label || void 0, hideLabel, false),
required,
autoFocus: autofocus,
disabled: disabled || readonly,
onBlur: !readonly ? handleBlur : void 0,
onChange: !readonly ? handleChange : void 0,
onFocus: !readonly ? handleFocus : void 0,
placeholder,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
list: schema.examples ? examplesId(id) : void 0,
...inputProps,
...themeProps,
value,
"aria-describedby": ariaDescribedByIds(id, !!schema.examples)
}
);
return /* @__PURE__ */ jsxs3(Fragment, { children: [
input,
Array.isArray(schema.examples) && /* @__PURE__ */ jsx4("datalist", { id: examplesId(id), children: schema.examples.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : []).map((example) => {
return /* @__PURE__ */ jsx4("option", { value: example }, example);
}) })
] });
}
// src/templates/ErrorList.tsx
import { TranslatableString } from "@rjsf/utils";
import { Alert, Title as Title2, List } from "@mantine/core";
// src/templates/icons.tsx
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
function Plus({ size, style, ...others }) {
return /* @__PURE__ */ jsxs4(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
width: "24",
height: "24",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
className: "icon icon-tabler icons-tabler-outline icon-tabler-plus",
style: { width: size, height: size, ...style },
...others,
children: [
/* @__PURE__ */ jsx5("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
/* @__PURE__ */ jsx5("path", { d: "M12 5l0 14" }),
/* @__PURE__ */ jsx5("path", { d: "M5 12l14 0" })
]
}
);
}
function Copy({ size, style, ...others }) {
return /* @__PURE__ */ jsxs4(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
width: "24",
height: "24",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
className: "icon icon-tabler icons-tabler-outline icon-tabler-copy",
style: { width: size, height: size, ...style },
...others,
children: [
/* @__PURE__ */ jsx5("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
/* @__PURE__ */ jsx5("path", { d: "M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" }),
/* @__PURE__ */ jsx5("path", { d: "M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" })
]
}
);
}
function ChevronDown({ size, style, ...others }) {
return /* @__PURE__ */ jsxs4(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
width: "24",
height: "24",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
className: "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down",
style: { width: size, height: size, ...style },
...others,
children: [
/* @__PURE__ */ jsx5("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
/* @__PURE__ */ jsx5("path", { d: "M6 9l6 6l6 -6" })
]
}
);
}
function ChevronUp({ size, style, ...others }) {
return /* @__PURE__ */ jsxs4(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
width: "24",
height: "24",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
className: "icon icon-tabler icons-tabler-outline icon-tabler-chevron-up",
style: { width: size, height: size, ...style },
...others,
children: [
/* @__PURE__ */ jsx5("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
/* @__PURE__ */ jsx5("path", { d: "M6 15l6 -6l6 6" })
]
}
);
}
function X({ size, style, ...others }) {
return /* @__PURE__ */ jsxs4(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
width: "24",
height: "24",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
className: "icon icon-tabler icons-tabler-outline icon-tabler-x",
style: { width: size, height: size, ...style },
...others,
children: [
/* @__PURE__ */ jsx5("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
/* @__PURE__ */ jsx5("path", { d: "M18 6l-12 12" }),
/* @__PURE__ */ jsx5("path", { d: "M6 6l12 12" })
]
}
);
}
function ExclamationCircle({ size, style, ...others }) {
return /* @__PURE__ */ jsxs4(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
width: "24",
height: "24",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
className: "icon icon-tabler icons-tabler-outline icon-tabler-exclamation-circle",
style: { width: size, height: size, ...style },
...others,
children: [
/* @__PURE__ */ jsx5("path", { d: "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" }),
/* @__PURE__ */ jsx5("path", { d: "M12 9v4" }),
/* @__PURE__ */ jsx5("path", { d: "M12 16v.01" })
]
}
);
}
// src/templates/ErrorList.tsx
import { jsx as jsx6 } from "react/jsx-runtime";
function ErrorList({
errors,
registry
}) {
const { translateString } = registry;
return /* @__PURE__ */ jsx6(
Alert,
{
color: "red",
variant: "transparent",
title: /* @__PURE__ */ jsx6(Title2, { order: 5, fw: "normal", children: translateString(TranslatableString.ErrorsLabel) }),
icon: /* @__PURE__ */ jsx6(ExclamationCircle, {}),
children: /* @__PURE__ */ jsx6(List, { children: errors.map((error, index) => /* @__PURE__ */ jsx6(List.Item, { c: "red", children: error.stack }, `error-${index}`)) })
}
);
}
// src/templates/ButtonTemplates/SubmitButton.tsx
import { Button } from "@mantine/core";
import { getSubmitButtonOptions } from "@rjsf/utils";
import { jsx as jsx7 } from "react/jsx-runtime";
function SubmitButton({ uiSchema }) {
const { submitText, norender, props: submitButtonProps = {} } = getSubmitButtonOptions(uiSchema);
if (norender) {
return null;
}
return /* @__PURE__ */ jsx7(Button, { type: "submit", variant: "filled", ...submitButtonProps, children: submitText });
}
// src/templates/ButtonTemplates/AddButton.tsx
import { TranslatableString as TranslatableString3 } from "@rjsf/utils";
// src/templates/ButtonTemplates/IconButton.tsx
import { ActionIcon } from "@mantine/core";
import { TranslatableString as TranslatableString2 } from "@rjsf/utils";
import { jsx as jsx8 } from "react/jsx-runtime";
function IconButton(props) {
const { icon, iconType, color, onClick, uiSchema, registry, ...otherProps } = props;
return /* @__PURE__ */ jsx8(
ActionIcon,
{
size: iconType,
color,
onClick,
...otherProps,
children: icon
}
);
}
function CopyButton(props) {
const {
registry: { translateString }
} = props;
return /* @__PURE__ */ jsx8(IconButton, { title: translateString(TranslatableString2.CopyButton), variant: "subtle", ...props, icon: /* @__PURE__ */ jsx8(Copy, {}) });
}
function MoveDownButton(props) {
const {
registry: { translateString }
} = props;
return /* @__PURE__ */ jsx8(
IconButton,
{
title: translateString(TranslatableString2.MoveDownButton),
variant: "subtle",
...props,
icon: /* @__PURE__ */ jsx8(ChevronDown, {})
}
);
}
function MoveUpButton(props) {
const {
registry: { translateString }
} = props;
return /* @__PURE__ */ jsx8(
IconButton,
{
title: translateString(TranslatableString2.MoveUpButton),
variant: "subtle",
...props,
icon: /* @__PURE__ */ jsx8(ChevronUp, {})
}
);
}
function RemoveButton(props) {
const {
registry: { translateString }
} = props;
return /* @__PURE__ */ jsx8(
IconButton,
{
title: translateString(TranslatableString2.RemoveButton),
variant: "subtle",
color: "red",
...props,
icon: /* @__PURE__ */ jsx8(X, {})
}
);
}
// src/templates/ButtonTemplates/AddButton.tsx
import { jsx as jsx9 } from "react/jsx-runtime";
function AddButton(props) {
const {
registry: { translateString }
} = props;
return /* @__PURE__ */ jsx9(IconButton, { title: translateString(TranslatableString3.CopyButton), variant: "subtle", ...props, icon: /* @__PURE__ */ jsx9(Plus, {}) });
}
// src/templates/ButtonTemplates/index.ts
function buttonTemplates() {
return {
SubmitButton,
AddButton,
CopyButton,
MoveDownButton,
MoveUpButton,
RemoveButton
};
}
var ButtonTemplates_default = buttonTemplates;
// src/templates/FieldErrorTemplate.tsx
import { errorId } from "@rjsf/utils";
import { Box as Box3, List as List2 } from "@mantine/core";
import { jsx as jsx10 } from "react/jsx-runtime";
function FieldErrorTemplate({ errors, idSchema }) {
if (!errors || !errors.length) {
return null;
}
const id = errorId(idSchema);
return /* @__PURE__ */ jsx10(Box3, { id, c: "red", display: "none", children: /* @__PURE__ */ jsx10(List2, { children: errors.map((error, index) => /* @__PURE__ */ jsx10(List2.Item, { children: error }, `field-error-${index}`)) }) });
}
// src/templates/FieldTemplate.tsx
import {
getTemplate as getTemplate2,
getUiOptions as getUiOptions3
} from "@rjsf/utils";
import { Box as Box4 } from "@mantine/core";
import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
function FieldTemplate(props) {
const { id, classNames, style, label, errors, help, hidden, schema, uiSchema, registry, children, ...otherProps } = props;
const uiOptions = getUiOptions3(uiSchema);
const WrapIfAdditionalTemplate2 = getTemplate2(
"WrapIfAdditionalTemplate",
registry,
uiOptions
);
if (hidden) {
return /* @__PURE__ */ jsx11(Box4, { display: "none", children });
}
return /* @__PURE__ */ jsxs5(
WrapIfAdditionalTemplate2,
{
id,
classNames,
style,
label,
schema,
uiSchema,
registry,
...otherProps,
children: [
children,
help,
errors
]
}
);
}
// src/templates/FieldHelpTemplate.tsx
import { helpId } from "@rjsf/utils";
import { Text } from "@mantine/core";
import { jsx as jsx12 } from "react/jsx-runtime";
function FieldHelpTemplate(props) {
const { idSchema, help } = props;
const id = helpId(idSchema);
return !help ? null : /* @__PURE__ */ jsx12(Text, { id, size: "sm", my: "xs", c: "dimmed", children: help });
}
// src/templates/ObjectFieldTemplate.tsx
import {
canExpand,
descriptionId,
getTemplate as getTemplate3,
getUiOptions as getUiOptions4,
titleId as titleId2
} from "@rjsf/utils";
import { Container, Box as Box5, SimpleGrid } from "@mantine/core";
import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
function ObjectFieldTemplate(props) {
const {
title,
description,
disabled,
properties,
onAddClick,
readonly,
required,
schema,
uiSchema,
idSchema,
formData,
registry
} = props;
const uiOptions = getUiOptions4(uiSchema);
const TitleFieldTemplate = getTemplate3("TitleFieldTemplate", registry, uiOptions);
const DescriptionFieldTemplate = getTemplate3(
"DescriptionFieldTemplate",
registry,
uiOptions
);
const {
ButtonTemplates: { AddButton: AddButton2 }
} = registry.templates;
const gridCols = typeof uiOptions?.gridCols === "number" && uiOptions?.gridCols || void 0;
const gridSpacing = uiOptions?.gridSpacing;
const gridVerticalSpacing = uiOptions?.gridVerticalSpacing;
return /* @__PURE__ */ jsxs6(Container, { id: idSchema.$id, children: [
title && /* @__PURE__ */ jsx13(
TitleFieldTemplate,
{
id: titleId2(idSchema),
title,
required,
schema,
uiSchema,
registry
}
),
description && /* @__PURE__ */ jsx13(
DescriptionFieldTemplate,
{
id: descriptionId(idSchema),
description,
schema,
uiSchema,
registry
}
),
/* @__PURE__ */ jsx13(
SimpleGrid,
{
cols: gridCols,
spacing: gridSpacing,
verticalSpacing: gridVerticalSpacing,
children: properties.filter((e) => !e.hidden).map((element) => /* @__PURE__ */ jsx13(Box5, { children: element.content }, element.name))
}
),
canExpand(schema, uiSchema, formData) && /* @__PURE__ */ jsx13(Box5, { mt: "xs", children: /* @__PURE__ */ jsx13(
AddButton2,
{
disabled: disabled || readonly,
onClick: onAddClick(schema),
uiSchema,
registry
}
) })
] });
}
// src/templates/TitleField.tsx
import { Title as Title3 } from "@mantine/core";
import { jsx as jsx14 } from "react/jsx-runtime";
function TitleField(props) {
const { id, title } = props;
return title ? /* @__PURE__ */ jsx14(Title3, { id, order: 3, fw: "normal", children: title }) : null;
}
// src/templates/WrapIfAdditionalTemplate.tsx
import {
ADDITIONAL_PROPERTY_FLAG,
UI_OPTIONS_KEY,
TranslatableString as TranslatableString4
} from "@rjsf/utils";
import { Flex as Flex2, Grid, TextInput as TextInput2 } from "@mantine/core";
import { jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
function WrapIfAdditionalTemplate(props) {
const {
id,
classNames,
style,
label,
required,
readonly,
disabled,
schema,
uiSchema,
onKeyChange,
onDropPropertyClick,
registry,
children
} = props;
const { templates, translateString } = registry;
const { RemoveButton: RemoveButton2 } = templates.ButtonTemplates;
const keyLabel = translateString(TranslatableString4.KeyLabel, [label]);
const additional = ADDITIONAL_PROPERTY_FLAG in schema;
if (!additional) {
return /* @__PURE__ */ jsx15("div", { className: classNames, style, children });
}
const handleBlur = ({ target }) => onKeyChange(target && target.value);
const uiOptions = uiSchema ? uiSchema[UI_OPTIONS_KEY] : {};
const buttonUiOptions = {
...uiSchema,
[UI_OPTIONS_KEY]: { ...uiOptions, block: true }
};
return /* @__PURE__ */ jsx15("div", { className: classNames, style, children: /* @__PURE__ */ jsxs7(Flex2, { gap: "xs", align: "end", justify: "center", children: [
/* @__PURE__ */ jsxs7(Grid, { w: "100%", align: "center", children: [
/* @__PURE__ */ jsx15(Grid.Col, { span: 6, className: "form-additional", children: /* @__PURE__ */ jsx15("div", { className: "form-group", children: /* @__PURE__ */ jsx15(
TextInput2,
{
className: "form-group",
label: keyLabel,
defaultValue: label,
required,
disabled: disabled || readonly,
id: `${id}-key`,
name: `${id}-key`,
onBlur: !readonly ? handleBlur : void 0
}
) }) }),
/* @__PURE__ */ jsx15(Grid.Col, { span: 6, className: "form-additional", children })
] }),
/* @__PURE__ */ jsx15(
RemoveButton2,
{
iconType: "sm",
className: "array-item-remove",
disabled: disabled || readonly,
onClick: onDropPropertyClick(label),
uiSchema: buttonUiOptions,
registry
}
)
] }) });
}
// src/templates/index.ts
function generateTemplates() {
return {
ArrayFieldItemTemplate,
ArrayFieldTemplate,
ArrayFieldTitleTemplate,
BaseInputTemplate,
ButtonTemplates: ButtonTemplates_default(),
ErrorListTemplate: ErrorList,
FieldErrorTemplate,
FieldTemplate,
FieldHelpTemplate,
ObjectFieldTemplate,
TitleFieldTemplate: TitleField,
WrapIfAdditionalTemplate
};
}
var templates_default = generateTemplates();
// src/widgets/index.ts
import dayjs2 from "dayjs";
import customParseFormat from "dayjs/plugin/customParseFormat";
// src/widgets/DateTime/AltDateWidget.tsx
import { useCallback, useEffect, useState } from "react";
import {
ariaDescribedByIds as ariaDescribedByIds2,
dateRangeOptions,
parseDateString,
toDateString,
getDateElementProps,
titleId as titleId3,
TranslatableString as TranslatableString5
} from "@rjsf/utils";
import { Flex as Flex3, Box as Box6, Group as Group3, Button as Button2, Select, Input } from "@mantine/core";
import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
function readyForChange(state) {
return Object.values(state).every((value) => value !== -1);
}
function AltDateWidget(props) {
const {
id,
value,
required,
disabled,
readonly,
label,
hideLabel,
rawErrors,
options,
onChange,
showTime = false,
registry
} = props;
const { translateString } = registry;
const [lastValue, setLastValue] = useState(value);
const [state, setState] = useState(parseDateString(value, showTime));
useEffect(() => {
const stateValue = toDateString(state, showTime);
if (lastValue !== value) {
setLastValue(value);
setState(parseDateString(value, showTime));
} else if (readyForChange(state) && stateValue !== value) {
onChange(stateValue);
setLastValue(stateValue);
}
}, [showTime, value, onChange, state, lastValue]);
const handleChange = useCallback((property, nextValue) => {
setState((prev) => ({ ...prev, [property]: typeof nextValue === "undefined" ? -1 : nextValue }));
}, []);
const handleSetNow = useCallback(() => {
if (!disabled && !readonly) {
const nextState = parseDateString((/* @__PURE__ */ new Date()).toJSON(), showTime);
onChange(toDateString(nextState, showTime));
}
}, [disabled, readonly, showTime]);
const handleClear = useCallback(() => {
if (!disabled && !readonly) {
onChange("");
}
}, [disabled, readonly, onChange]);
return /* @__PURE__ */ jsxs8(Fragment2, { children: [
!hideLabel && !!label && /* @__PURE__ */ jsx16(Input.Label, { id: titleId3(id), required, children: label }),
/* @__PURE__ */ jsxs8(Flex3, { gap: "xs", align: "center", wrap: "nowrap", children: [
getDateElementProps(
state,
showTime,
options.yearsRange,
options.format
).map((elemProps, i) => {
const elemId = id + "_" + elemProps.type;
return /* @__PURE__ */ jsx16(Box6, { children: /* @__PURE__ */ jsx16(
Select,
{
id: elemId,
name: elemId,
placeholder: elemProps.type,
disabled: disabled || readonly,
data: dateRangeOptions(elemProps.range[0], elemProps.range[1]).map((item) => item.value.toString()),
value: !elemProps.value || elemProps.value < 0 ? null : elemProps.value.toString(),
onChange: (v) => handleChange(elemProps.type, v),
searchable: false,
allowDeselect: false,
comboboxProps: { withinPortal: false },
"aria-describedby": ariaDescribedByIds2(elemId)
}
) }, i);
}),
/* @__PURE__ */ jsxs8(Group3, { wrap: "nowrap", gap: 3, children: [
(options.hideNowButton !== "undefined" ? !options.hideNowButton : true) && /* @__PURE__ */ jsx16(Button2, { variant: "subtle", size: "xs", onClick: handleSetNow, children: translateString(TranslatableString5.NowLabel) }),
(options.hideClearButton !== "undefined" ? !options.hideClearButton : true) && /* @__PURE__ */ jsx16(Button2, { variant: "subtle", size: "xs", onClick: handleClear, children: translateString(TranslatableString5.ClearLabel) })
] })
] }),
rawErrors && rawErrors?.length > 0 && rawErrors.map((error, index) => /* @__PURE__ */ jsx16(Input.Error, { children: error }, `alt-date-widget-input-errors-${index}`))
] });
}
AltDateWidget.defaultProps = {
showTime: false
};
var AltDateWidget_default = AltDateWidget;
// src/widgets/DateTime/AltDateTimeWidget.tsx
import { jsx as jsx17 } from "react/jsx-runtime";
function AltDateTimeWidget(props) {
const { AltDateWidget: AltDateWidget2 } = props.registry.widgets;
return /* @__PURE__ */ jsx17(AltDateWidget2, { showTime: true, ...props });
}
AltDateTimeWidget.defaultProps = {
...AltDateWidget_default?.defaultProps,
showTime: true
};
// src/widgets/DateTime/DateTimeInput.tsx
import { useCallback as useCallback2 } from "react";
import {
ariaDescribedByIds as ariaDescribedByIds3,
labelValue as labelValue2
} from "@rjsf/utils";
import dayjs from "dayjs";
import { DateInput } from "@mantine/dates";
import { jsx as jsx18 } from "react/jsx-runtime";
var dateParser = (input, format) => {
if (!input) {
return null;
}
const d = dayjs(input, format);
return d.isValid() ? d.toDate() : null;
};
var dateFormat = (date, format) => {
if (!date) {
return "";
}
return dayjs(date).format(format || "YYYY-MM-DD");
};
function DateTimeInput(props) {
const {
id,
name,
value,
placeholder,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus,
valueFormat,
displayFormat
} = props;
const emptyValue = options?.emptyValue ?? "";
const handleChange = useCallback2(
(nextValue) => {
onChange(dateFormat(nextValue, valueFormat));
},
[onChange, emptyValue]
);
const handleBlur = () => onBlur && onBlur(id, value);
const handleFocus = () => onFocus && onFocus(id, value);
return /* @__PURE__ */ jsx18(
DateInput,
{
id,
name,
value: dateParser(value, valueFormat),
dateParser: (v) => dateParser(v, displayFormat),
placeholder: placeholder || void 0,
required,
disabled: disabled || readonly,
autoFocus: autofocus,
label: labelValue2(label || void 0, hideLabel, false),
onChange: handleChange,
onBlur: handleBlur,
onFocus: handleFocus,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
...options,
"aria-describedby": ariaDescribedByIds3(id),
popoverProps: { withinPortal: false },
classNames: typeof options?.classNames === "object" ? options.classNames : void 0,
valueFormat: displayFormat
}
);
}
// src/widgets/DateTime/DateWidget.tsx
import { jsx as jsx19 } from "react/jsx-runtime";
function DateWidget(props) {
const { valueFormat = "YYYY-MM-DD", displayFormat, ...otherOptions } = props.options;
return /* @__PURE__ */ jsx19(
DateTimeInput,
{
...props,
options: otherOptions,
valueFormat,
displayFormat: displayFormat || valueFormat
}
);
}
// src/widgets/DateTime/DateTimeWidget.tsx
import { jsx as jsx20 } from "react/jsx-runtime";
function DateTimeWidget(props) {
const { valueFormat = "YYYY-MM-DD HH:mm:ss", displayFormat, ...otherOptions } = props.options;
return /* @__PURE__ */ jsx20(
DateTimeInput,
{
...props,
options: otherOptions,
valueFormat,
displayFormat: displayFormat || valueFormat
}
);
}
// src/widgets/DateTime/TimeWidget.tsx
import { useCallback as useCallback3 } from "react";
import {
labelValue as labelValue3,
ariaDescribedByIds as ariaDescribedByIds4
} from "@rjsf/utils";
import { TimeInput } from "@mantine/dates";
import { jsx as jsx21 } from "react/jsx-runtime";
function TimeWidget(props) {
const {
id,
name,
value,
placeholder,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus
} = props;
const emptyValue = options.emptyValue || "";
const handleChange = useCallback3(
(e) => {
onChange(e.target.value === "" ? emptyValue : e.target.value);
},
[onChange, emptyValue]
);
const handleBlur = useCallback3(
({ target }) => {
if (onBlur) {
onBlur(id, target && target.value);
}
},
[onBlur, id]
);
const handleFocus = useCallback3(
({ target }) => {
if (onFocus) {
onFocus(id, target && target.value);
}
},
[onFocus, id]
);
return /* @__PURE__ */ jsx21(
TimeInput,
{
id,
name,
value: value || "",
placeholder: placeholder || void 0,
required,
disabled: disabled || readonly,
autoFocus: autofocus,
label: labelValue3(label || void 0, hideLabel, false),
onChange: handleChange,
onBlur: handleBlur,
onFocus: handleFocus,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
...options,
"aria-describedby": ariaDescribedByIds4(id),
classNames: typeof options?.classNames === "object" ? options.classNames : void 0
}
);
}
// src/widgets/CheckboxesWidget.tsx
import { useCallback as useCallback4 } from "react";
import {
ariaDescribedByIds as ariaDescribedByIds5,
enumOptionsValueForIndex,
enumOptionsIndexForValue,
optionId,
titleId as titleId4
} from "@rjsf/utils";
import { Checkbox, Flex as Flex4, Input as Input2 } from "@mantine/core";
import { Fragment as Fragment3, jsx as jsx22, jsxs as jsxs9 } from "react/jsx-runtime";
function CheckboxesWidget(props) {
const {
id,
value,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus
} = props;
const { enumOptions, enumDisabled, inline, emptyValue } = options;
const themeProps = cleanupOptions(options);
const handleChange = useCallback4(
(nextValue) => {
if (!disabled && !readonly && onChange) {
onChange(enumOptionsValueForIndex(nextValue, enumOptions, emptyValue));
}
},
[onChange, disabled, readonly, enumOptions, emptyValue]
);
const handleBlur = useCallback4(
({ target }) => {
if (onBlur) {
onBlur(id, enumOptionsValueForIndex(target.value, enumOptions, emptyValue));
}
},
[onBlur, id, enumOptions, emptyValue]
);
const handleFocus = useCallback4(
({ target }) => {
if (onFocus) {
onFocus(id, enumOptionsValueForIndex(target.value, enumOptions, emptyValue));
}
},
[onFocus, id, enumOptions, emptyValue]
);
const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, true);
return Array.isArray(enumOptions) && enumOptions.length > 0 ? /* @__PURE__ */ jsxs9(Fragment3, { children: [
!hideLabel && !!label && /* @__PURE__ */ jsx22(Input2.Label, { id: titleId4(id), required, children: label }),
/* @__PURE__ */ jsx22(
Checkbox.Group,
{
id,
value: selectedIndexes,
onChange: handleChange,
required,
readOnly: disabled || readonly,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
"aria-describedby": ariaDescribedByIds5(id),
...themeProps,
children: Array.isArray(enumOptions) ? /* @__PURE__ */ jsx22(Flex4, { mt: "xs", direction: inline ? "row" : "column", gap: "xs", wrap: "wrap", children: enumOptions.map((option, i) => /* @__PURE__ */ jsx22(
Checkbox,
{
id: optionId(id, i),
name: id,
value: String(i),
label: option.label,
disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1,
autoFocus: i === 0 && autofocus,
onBlur: handleBlur,
onFocus: handleFocus
},
i
)) }) : null
}
)
] }) : null;
}
// src/widgets/CheckboxWidget.tsx
import { useCallback as useCallback5 } from "react";
import {
labelValue as labelValue4,
ariaDescribedByIds as ariaDescribedByIds6
} from "@rjsf/utils";
import { Checkbox as Checkbox2 } from "@mantine/core";
import { jsx as jsx23 } from "react/jsx-runtime";
function CheckboxWidget(props) {
const {
id,
name,
value = false,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus
} = props;
const themeProps = cleanupOptions(options);
const handleCheckboxChange = useCallback5(
(e) => {
if (!disabled && !readonly && onChange) {
onChange(e.currentTarget.checked);
}
},
[onChange, disabled, readonly]
);
const handleBlur = useCallback5(
({ target }) => {
if (onBlur) {
onBlur(id, target.checked);
}
},
[onBlur, id]
);
const handleFocus = useCallback5(
({ target }) => {
if (onFocus) {
onFocus(id, target.checked);
}
},
[onFocus, id]
);
return /* @__PURE__ */ jsx23(
Checkbox2,
{
id,
name,
label: labelValue4(label || void 0, hideLabel, false),
disabled: disabled || readonly,
required,
autoFocus: autofocus,
checked: typeof value === "undefined" ? false : value === "true" || value,
onChange: handleCheckboxChange,
onBlur: handleBlur,
onFocus: handleFocus,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
"aria-describedby": ariaDescribedByIds6(id),
...themeProps
}
);
}
// src/widgets/ColorWidget.tsx
import { useCallback as useCallback6 } from "react";
import {
labelValue as labelValue5,
ariaDescribedByIds as ariaDescribedByIds7
} from "@rjsf/utils";
import { ColorInput } from "@mantine/core";
import { jsx as jsx24 } from "react/jsx-runtime";
function ColorWidget(props) {
const {
id,
name,
value,
placeholder,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus
} = props;
const emptyValue = options.emptyValue || "";
const themeProps = cleanupOptions(options);
const handleChange = useCallback6(
(nextValue) => {
onChange(nextValue);
},
[onChange, emptyValue]
);
const handleBlur = useCallback6(
({ target }) => {
if (onBlur) {
onBlur(id, target && target.value);
}
},
[onBlur, id]
);
const handleFocus = useCallback6(
({ target }) => {
if (onFocus) {
onFocus(id, target && target.value);
}
},
[onFocus, id]
);
return /* @__PURE__ */ jsx24(
ColorInput,
{
id,
name,
value: value || "",
placeholder: placeholder || void 0,
required,
disabled: disabled || readonly,
autoFocus: autofocus,
label: labelValue5(label || void 0, hideLabel, false),
onChange: handleChange,
onBlur: handleBlur,
onFocus: handleFocus,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
...themeProps,
"aria-describedby": ariaDescribedByIds7(id),
popoverProps: { withinPortal: false }
}
);
}
// src/widgets/PasswordWidget.tsx
import { useCallback as useCallback7 } from "react";
import {
ariaDescribedByIds as ariaDescribedByIds8,
labelValue as labelValue6
} from "@rjsf/utils";
import { PasswordInput } from "@mantine/core";
import { jsx as jsx25 } from "react/jsx-runtime";
function PasswordWidget(props) {
const {
id,
name,
value,
placeholder,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus
} = props;
const emptyValue = options.emptyValue || "";
const themeProps = cleanupOptions(options);
const handleChange = useCallback7(
(e) => {
onChange(e.target.value === "" ? emptyValue : e.target.value);
},
[onChange, emptyValue]
);
const handleBlur = useCallback7(
({ target }) => {
if (onBlur) {
onBlur(id, target && target.value);
}
},
[onBlur, id]
);
const handleFocus = useCallback7(
({ target }) => {
if (onFocus) {
onFocus(id, target && target.value);
}
},
[onFocus, id]
);
return /* @__PURE__ */ jsx25(
PasswordInput,
{
id,
name,
value: value || "",
placeholder: placeholder || void 0,
required,
disabled: disabled || readonly,
autoFocus: autofocus,
label: labelValue6(label || void 0, hideLabel, false),
onChange: handleChange,
onBlur: handleBlur,
onFocus: handleFocus,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
...themeProps,
"aria-describedby": ariaDescribedByIds8(id)
}
);
}
// src/widgets/RadioWidget.tsx
import { useCallback as useCallback8 } from "react";
import {
ariaDescribedByIds as ariaDescribedByIds9,
enumOptionsIndexForValue as enumOptionsIndexForValue2,
enumOptionsValueForIndex as enumOptionsValueForIndex2,
optionId as optionId2
} from "@rjsf/utils";
import { Radio, Flex as Flex5 } from "@mantine/core";
import { jsx as jsx26 } from "react/jsx-runtime";
function RadioWidget(props) {
const {
id,
value,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus
} = props;
const { enumOptions, enumDisabled, inline, emptyValue } = options;
const themeProps = cleanupOptions(options);
const handleChange = useCallback8(
(nextValue) => {
if (!disabled && !readonly && onChange) {
onChange(enumOptionsValueForIndex2(nextValue, enumOptions, emptyValue));
}
},
[onChange, disabled, readonly, enumOptions, emptyValue]
);
const handleBlur = useCallback8(
({ target }) => {
if (onBlur) {
onBlur(id, enumOptionsValueForIndex2(target && target.value, enumOptions, emptyValue));
}
},
[onBlur, id, enumOptions, emptyValue]
);
const handleFocus = useCallback8(
({ target }) => {
if (onFocus) {
onFocus(id, enumOptionsValueForIndex2(target && target.value, enumOptions, emptyValue));
}
},
[onFocus, id, enumOptions, emptyValue]
);
const selected = enumOptionsIndexForValue2(value, enumOptions);
return /* @__PURE__ */ jsx26(
Radio.Group,
{
id,
name: id,
value: selected,
label: !hideLabel ? label : void 0,
onChange: handleChange,
required,
readOnly: disabled || readonly,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
"aria-describedby": ariaDescribedByIds9(id),
...themeProps,
children: Array.isArray(enumOptions) ? /* @__PURE__ */ jsx26(Flex5, { mt: "xs", direction: inline ? "row" : "column", gap: "xs", wrap: "wrap", children: enumOptions.map((option, i) => /* @__PURE__ */ jsx26(
Radio,
{
id: optionId2(id, i),
value: String(i),
label: option.label,
disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1,
autoFocus: i === 0 && autofocus,
onBlur: handleBlur,
onFocus: handleFocus
},
i
)) }) : null
}
);
}
// src/widgets/RangeWidget.tsx
import { useCallback as useCallback9 } from "react";
import {
ariaDescribedByIds as ariaDescribedByIds10,
rangeSpec,
titleId as titleId5
} from "@rjsf/utils";
import { Slider, Input as Input3 } from "@mantine/core";
import { Fragment as Fragment4, jsx as jsx27, jsxs as jsxs10 } from "react/jsx-runtime";
function RangeWidget(props) {
const {
id,
name,
value,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus,
schema
} = props;
const themeProps = cleanupOptions(options);
const { min, max, step } = rangeSpec(schema);
const handleChange = useCallback9(
(nextValue) => {
if (!disabled && !readonly && onChange) {
onChange(nextValue);
}
},
[onChange, disabled, readonly]
);
const handleBlur = () => onBlur && onBlur(id, value);
const handleFocus = () => onFocus && onFocus(id, value);
return /* @__PURE__ */ jsxs10(Fragment4, { children: [
!hideLabel && !!label && /* @__PURE__ */ jsx27(Input3.Label, { id: titleId5(id), required, children: label }),
options?.description && /* @__PURE__ */ jsx27(Input3.Description, { children: options.description }),
/* @__PURE__ */ jsx27(
Slider,
{
id,
name,
value,
max,
min,
step,
disabled: disabled || readonly,
autoFocus: autofocus,
onChange: handleChange,
onBlur: handleBlur,
onFocus: handleFocus,
...themeProps,
"aria-describedby": ariaDescribedByIds10(id)
}
),
rawErrors && rawErrors?.length > 0 && rawErrors.map((error, index) => /* @__PURE__ */ jsx27(Input3.Error, { children: error }, `range-widget-input-errors-${index}`))
] });
}
// src/widgets/SelectWidget.tsx
import { useCallback as useCallback10, useMemo } from "react";
import {
ariaDescribedByIds as ariaDescribedByIds11,
enumOptionsIndexForValue as enumOptionsIndexForValue3,
enumOptionsValueForIndex as enumOptionsValueForIndex3,
labelValue as labelValue7
} from "@rjsf/utils";
import { Select as Select2, MultiSelect } from "@mantine/core";
import { jsx as jsx28 } from "react/jsx-runtime";
function SelectWidget(props) {
const {
id,
value,
placeholder,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
multiple,
rawErrors,
options,
onChange,
onBlur,
onFocus
} = props;
const { enumOptions, enumDisabled, emptyValue } = options;
const themeProps = cleanupOptions(options);
const handleChange = useCallback10(
(nextValue) => {
if (!disabled && !readonly && onChange) {
onChange(enumOptionsValueForIndex3(nextValue, enumOptions, emptyValue));
}
},
[onChange, disabled, readonly, enumOptions, emptyValue]
);
const handleBlur = useCallback10(
({ target }) => {
if (onBlur) {
onBlur(id, enumOptionsValueForIndex3(target && target.value, enumOptions, emptyValue));
}
},
[onBlur, id, enumOptions, emptyValue]
);
const handleFocus = useCallback10(
({ target }) => {
if (onFocus) {
onFocus(id, enumOptionsValueForIndex3(target && target.value, enumOptions, emptyValue));
}
},
[onFocus, id, enumOptions, emptyValue]
);
const selectedIndexes = enumOptionsIndexForValue3(value, enumOptions, multiple);
const selectOptions = useMemo(() => {
if (Array.isArray(enumOptions)) {
return enumOptions.map((option, index) => ({
key: String(index),
value: String(index),
label: option.label,
disabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1
}));
}
return [];
}, [enumDisabled, enumOptions]);
const Component = multiple ? MultiSelect : Select2;
return /* @__PURE__ */ jsx28(
Component,
{
id,
name: id,
label: labelValue7(label || void 0, hideLabel, false),
data: selectOptions,
value: multiple ? selectedIndexes : selectedIndexes,
onChange: !readonly ? handleChange : void 0,
onBlur: !readonly ? handleBlur : void 0,
onFocus: !readonly ? handleFocus : void 0,
autoFocus: autofocus,
placeholder,
disabled: disabled || readonly,
required,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
searchable: true,
...themeProps,
"aria-describedby": ariaDescribedByIds11(id),
comboboxProps: { withinPortal: false }
}
);
}
// src/widgets/TextareaWidget.tsx
import { useCallback as useCallback11 } from "react";
import { labelValue as labelValue8 } from "@rjsf/utils";
import { Textarea } from "@mantine/core";
import { jsx as jsx29 } from "react/jsx-runtime";
function TextareaWidget(props) {
const {
id,
name,
value,
placeholder,
required,
disabled,
readonly,
autofocus,
label,
hideLabel,
rawErrors,
options,
onChange,
onBlur,
onFocus
} = props;
const themeProps = cleanupOptions(options);
const emptyValue = options?.emptyValue ?? "";
const handleChange = useCallback11(
(e) => {
onChange(e.target.value === "" ? emptyValue : e.target.value);
},
[onChange, emptyValue]
);
const handleBlur = useCallback11(
({ target }) => {
if (onBlur) {
onBlur(id, target && target.value);
}
},
[onBlur, id]
);
const handleFocus = useCallback11(
({ target }) => {
if (onFocus) {
onFocus(id, target && target.value);
}
},
[onFocus, id]
);
return /* @__PURE__ */ jsx29(
Textarea,
{
id,
name,
value: value || "",
placeholder: placeholder || void 0,
required,
disabled: disabled || readonly,
autoFocus: autofocus,
label: labelValue8(label || void 0, hideLabel, false),
onChange: handleChange,
onBlur: handleBlur,
onFocus: handleFocus,
error: rawErrors && rawErrors.length > 0 ? rawErrors.join("\n") : void 0,
...themeProps
}
);
}
// src/widgets/index.ts
dayjs2.extend(customParseFormat);
function generateWidgets() {
return {
AltDateTimeWidget,
AltDateWidget: AltDateWidget_default,
CheckboxesWidget,
CheckboxWidget,
ColorWidget,
DateTimeWidget,
DateWidget,
PasswordWidget,
RadioWidget,
RangeWidget,
SelectWidget,
TextareaWidget,
TimeWidget
};
}
var widgets_default = generateWidgets();
// src/Theme/index.ts
function generateTheme() {
return {
templates: generateTemplates(),
widgets: generateWidgets()
};
}
var Theme_default = generateTheme();
// src/Form/index.ts
function generateForm() {
return withTheme(generateTheme());
}
var Form_default = generateForm();
// src/index.ts
var src_default = Form_default;
export {
Form_default as Form,
templates_default as Templates,
Theme_default as Theme,
widgets_default as Widgets,
src_default as default,
generateForm,
generateTemplates,
generateThe