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

The parent module that contains all Workday Canvas Kit React components

import React from 'react';
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: "d5h44j", styles: "box-sizing:border-box;margin:var(--cnvs-sys-space-zero);" },
    modifiers: {
        error: {
            error: { name: "d5h44k", styles: "color:var(--cnvs-brand-error-base);" },
            alert: { name: "d5h44l", styles: "" }
        }
    },
    defaultModifiers: {
        typeLevel: 'subtext.medium',
    }
}, "form-field-hint-07fcb3");
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 (React.createElement(Element, { ...mergeStyles(elemProps, formFieldHintStencil({ typeLevel, variant, error: model.state.error })) }, children));
});