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

The parent module that contains all Workday Canvas Kit React components

import { jsx as _jsx } from "react/jsx-runtime";
import { createSubcomponent } from '@workday/canvas-kit-react/common';
import { system, brand } from '@workday/canvas-tokens-web';
import { createStencil } from '@workday/canvas-kit-styling';
import { textStencil } from '@workday/canvas-kit-react/text';
import { mergeStyles } from '@workday/canvas-kit-react/layout';
import { useFormFieldHint, useFormFieldModel } from './hooks';
export const formFieldHintStencil = createStencil({
    extends: textStencil,
    base: { name: "jbbdb", styles: "box-sizing:border-box;margin:var(--cnvs-sys-space-zero);" },
    modifiers: {
        error: {
            error: { name: "2obq9y", styles: "color:var(--cnvs-brand-error-base);" },
            caution: { name: "140tk3", styles: "color:var(--cnvs-sys-color-text-caution-default);" }
        }
    },
    defaultModifiers: {
        typeLevel: 'subtext.medium',
    }
}, "form-field-hint-4fcd54");
export const FormFieldHint = createSubcomponent('p')({
    displayName: 'FormField.Hint',
    modelHook: useFormFieldModel,
    elemPropsHook: useFormFieldHint,
})(({ children, typeLevel, variant, ...elemProps }, Element, model) => {
    if (!children) {
        // If there is no hint text just skip rendering
        return null;
    }
    return (_jsx(Element, { ...mergeStyles(elemProps, formFieldHintStencil({ typeLevel, variant, error: model.state.error })), children: children }));
});