@kopexa/sight/dist/components/radio-card/radio-card-item.d.mts

Kopexa Sight Design System — React component library for GRC applications

import * as react_jsx_runtime from 'react/jsx-runtime';
import React__default from 'react';
import { RadioCardItemBaseProps } from './radio-card.mjs';
import '@ark-ui/react/radio-group';
import '@kopexa/theme';

interface RadioCardItemProps extends RadioCardItemBaseProps {
    /** Optional leading icon rendered inside the content area. */
    icon?: React__default.ReactElement;
    /** Primary label text for the option. */
    label?: React__default.ReactNode;
    /** Secondary description rendered below the label. */
    description?: React__default.ReactNode;
    /**
     * Radio dot to render. Pass `null` or `false` to hide the indicator
     * (useful for icon-only variants).
     *
     * @default <RadioCardItemIndicator />
     */
    indicator?: React__default.ReactNode | null;
    /**
     * Where the indicator sits relative to the content.
     *
     * - `"start"` — indicator on the leading edge of the control (default).
     * - `"end"` — indicator on the trailing edge.
     * - `"inside"` — indicator rendered at the end of the content column.
     *
     * @default "start"
     */
    indicatorPlacement?: "start" | "end" | "inside";
    /** Props forwarded to the hidden native input (e.g. for form libraries). */
    inputProps?: React__default.InputHTMLAttributes<HTMLInputElement>;
}
/**
 * Ergonomic card-style radio option.
 *
 * @example
 * ```tsx
 * <RadioCardRoot value={value} onValueChange={({ value }) => setValue(value)}>
 *   <RadioCardItem
 *     value="option-a"
 *     label="Option A"
 *     description="Helpful description."
 *   />
 * </RadioCardRoot>
 * ```
 */
declare const RadioCardItem: (props: RadioCardItemProps) => react_jsx_runtime.JSX.Element;

export { RadioCardItem, type RadioCardItemProps };