corrad-ui-2025/formkit.config.js

70 lines
1.6 KiB
JavaScript

// formkit.config.ts
import { generateClasses } from "@formkit/themes";
import defaultTheme from "./formkit.theme.js";
import customInputs from "./components/formkit";
import { genesisIcons } from "@formkit/icons";
import {
createAutoHeightTextareaPlugin,
createMultiStepPlugin,
} from "@formkit/addons";
import "@formkit/addons/css/multistep";
const legends = ["checkbox_multi", "radio_multi", "repeater", "transferlist"];
function addAsteriskPlugin(node) {
if (
["button", "submit", "hidden", "group", "list", "meta"].includes(
node.props.type
)
)
return;
node.on("created", () => {
const legendOrLabel = legends.includes(
`${node.props.type}${node.props.options ? "_multi" : ""}`
)
? "legend"
: "label";
if (node.props.definition.schemaMemoKey) {
node.props.definition.schemaMemoKey += `${
node.props.options ? "_multi" : ""
}_add_asterisk`;
}
const schemaFn = node.props.definition.schema;
node.props.definition.schema = (sectionsSchema = {}) => {
sectionsSchema[legendOrLabel] = {
children: [
"$label",
{
$el: "span",
if: "$state.required",
attrs: {
class: "$classes.asterisk",
},
children: ["*"],
},
],
};
return schemaFn(sectionsSchema);
};
});
}
export default {
plugins: [
addAsteriskPlugin,
createAutoHeightTextareaPlugin(),
createMultiStepPlugin(),
],
icons: {
...genesisIcons,
},
config: {
classes: generateClasses(defaultTheme),
},
inputs: customInputs,
};