@grafana/ui/dist/esm/components/Forms/RadioButtonList/RadioButtonList.mjs

Grafana Components Library

import { jsx } from 'react/jsx-runtime';
import { css, cx } from '@emotion/css';
import { uniqueId } from 'lodash';
import { useStyles2 } from '../../../themes/ThemeContext.mjs';
import { RadioButtonDot } from './RadioButtonDot.mjs';

"use strict";
function RadioButtonList({
  name,
  id,
  options,
  value,
  onChange,
  className,
  disabled,
  disabledOptions = []
}) {
  const styles = useStyles2(getStyles);
  const internalId = id != null ? id : uniqueId("radiogroup-list-");
  return /* @__PURE__ */ jsx("div", { id, className: cx(styles.container, className), role: "radiogroup", children: options.map((option, index) => {
    const itemId = `${internalId}-${index}`;
    const isChecked = value && value === option.value;
    const isDisabled = disabled || disabledOptions.some((optionValue) => optionValue === option.value);
    const handleChange = () => onChange && option.value && onChange(option.value);
    return /* @__PURE__ */ jsx(
      RadioButtonDot,
      {
        id: itemId,
        name,
        label: option.label,
        description: option.description,
        checked: isChecked,
        value: option.value,
        disabled: isDisabled,
        onChange: handleChange
      },
      index
    );
  }) });
}
const getStyles = (theme) => ({
  container: css({
    display: "grid",
    gap: theme.spacing(1)
  })
});

export { RadioButtonList };
//# sourceMappingURL=RadioButtonList.mjs.map