import { create, tsx } from '@dojo/framework/core/vdom';
import * as baseCss from '../common/styles/base.m.css';
import theme from '../middleware/theme';
import * as css from '../theme/default/label.m.css';
import { formatAriaProperties } from '../common/util';
const factory = create({ theme }).properties();
export const Label = factory(function Label({ properties, id, children, middleware: { theme } }) {
    const { aria = {}, active, disabled, focused, forId, hidden, readOnly, required, secondary, valid, widgetId = `label-${id}` } = properties();
    const themeCss = theme.classes(css);
    return (tsx("label", Object.assign({}, formatAriaProperties(aria), { id: widgetId, classes: [
            theme.variant(),
            themeCss.root,
            disabled ? themeCss.disabled : null,
            focused ? themeCss.focused : null,
            valid === true ? themeCss.valid : null,
            valid === false ? themeCss.invalid : null,
            readOnly ? themeCss.readonly : null,
            required ? themeCss.required : null,
            secondary ? themeCss.secondary : null,
            active ? themeCss.active : null,
            hidden ? baseCss.visuallyHidden : null
        ], for: forId }), children()));
});
export default Label;

/*# sourceMappingURL=index.mjs.map*/