react-antd-admin-panel/dist/form/Radio.js

Modern TypeScript-first React admin panel builder with Ant Design 6

import { jsx as _jsx } from "react/jsx-runtime";
import { Radio as AntRadio } from 'antd';
import { FormFieldBuilder } from '../base/FormFieldBuilder';
/**
 * RadioGroup Field Builder
 * Wrapper for Ant Design Radio.Group component with generics
 * @template T - The type of radio option values
 */
export class RadioGroup extends FormFieldBuilder {
    /**
     * Set radio options
     */
    options(opts) {
        this._config.options = opts;
        return this;
    }
    /**
     * Add a single radio option
     */
    option(label, value, disabled) {
        if (!this._config.options) {
            this._config.options = [];
        }
        this._config.options.push({ label, value, disabled });
        return this;
    }
    /**
     * Set layout direction
     */
    direction(dir) {
        this._config.direction = dir;
        return this;
    }
    /**
     * Set button style (only applies when optionType is 'button')
     */
    buttonStyle(style) {
        this._config.buttonStyle = style;
        return this;
    }
    /**
     * Set option type (default radio or button style)
     */
    optionType(type) {
        this._config.optionType = type;
        return this;
    }
    /**
     * Set size (only applies when optionType is 'button')
     */
    size(value) {
        this._config.size = value;
        return this;
    }
    /**
     * Render the radio group component
     */
    render() {
        if (this._config.hidden) {
            return null;
        }
        const props = {
            disabled: this._config.disabled,
            buttonStyle: this._config.buttonStyle,
            optionType: this._config.optionType,
            size: this._config.size,
            value: this._value,
            onChange: (e) => this.handleChange(e.target.value),
        };
        const style = this._config.direction === 'vertical'
            ? { display: 'flex', flexDirection: 'column' }
            : undefined;
        return (_jsx(AntRadio.Group, { ...props, style: style, children: this._config.options?.map((opt, idx) => {
                const RadioComponent = this._config.optionType === 'button'
                    ? AntRadio.Button
                    : AntRadio;
                return (_jsx(RadioComponent, { value: opt.value, disabled: opt.disabled, children: opt.label }, idx));
            }) }, this._key));
    }
}
// Alias for convenience
export { RadioGroup as Radio };
//# sourceMappingURL=Radio.js.map