@workday/canvas-kit-react/dist/commonjs/form-field/lib/FormFieldHint.js

The parent module that contains all Workday Canvas Kit React components

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.FormFieldHint = exports.formFieldHintStencil = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const common_1 = require("@workday/canvas-kit-react/common");
const layout_1 = require("@workday/canvas-kit-react/layout");
const text_1 = require("@workday/canvas-kit-react/text");
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
const hooks_1 = require("./hooks");
exports.formFieldHintStencil = (0, canvas_kit_styling_1.createStencil)({
    extends: text_1.textStencil,
    base: { name: "23p41k", styles: "box-sizing:border-box;margin:0;" },
    modifiers: {
        error: {
            error: { name: "p0xde", styles: "color:var(--cnvs-sys-color-brand-fg-critical-default, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1)));" },
            caution: { name: "3176zr", styles: "color:var(--cnvs-sys-color-fg-default);" }
        }
    },
    defaultModifiers: {
        typeLevel: 'subtext.medium',
    }
}, "form-field-hint-4a6eb6");
exports.FormFieldHint = (0, common_1.createSubcomponent)('p')({
    displayName: 'FormField.Hint',
    modelHook: hooks_1.useFormFieldModel,
    elemPropsHook: hooks_1.useFormFieldHint,
})(({ children, typeLevel, variant, ...elemProps }, Element, model) => {
    if (!children) {
        // If there is no hint text just skip rendering
        return null;
    }
    return ((0, jsx_runtime_1.jsx)(Element, { ...(0, layout_1.mergeStyles)(elemProps, (0, exports.formFieldHintStencil)({ typeLevel, variant, error: model.state.error })), children: children }));
});