[Bug]: Adding more than one radio per story results in shared ids

[liznelson]

Describe the bug

When creating a doc with more than one radio, unique ids are not created for each set of radios. The problem is you can't set default radio form values for the subsequent controls.

To Reproduce

Using the next/typescript sandbox, I updated the Button.tsx file to take two props with a set of choices. The autodocs generate two radio groups and you can see the ids are the same between each group. control-type-{n}

import React from 'react';
import './button.css';

interface ButtonProps {
  /**
   * Is this the principal call to action on the page?
   */
  primary?: boolean;
  /**
   * What background color to use
   */
  backgroundColor?: string;
  /**
   * How large should the button be?
   */
  size?: 'small' | 'medium' | 'large';
  /**
   * How large should the button be?
   */
  type?: 'primary' | 'secondary' | 'tertiary';
  /**
   * Button contents
   */
  label: string;
  /**
   * Optional click handler
   */
  onClick?: () => void;
}

/**
 * Primary UI component for user interaction
 */
export const Button = ({
  primary = false,
  size = 'medium',
  type = 'primary',
  backgroundColor,
  label,
  ...props
}: ButtonProps) => {
  const mode =
    type === 'primary'
      ? 'storybook-button--primary'
      : type === 'secondary'
      ? 'storybook-button--secondary'
      : 'storybook-button--tertiary';
  return (
    <button
      type="button"
      className={['storybook-button', `storybook-button--${size}`, mode].join(
        ' '
      )}
      {...props}
    >
      {label}
      <style jsx>{`
        button {
          background-color: ${backgroundColor};
        }
      `}</style>
    </button>
  );
};

System

Environment Info:

  System:
    OS: macOS 10.15.7
    CPU: (4) x64 Intel(R) Core(TM) i5-4570 CPU @ 3.20GHz
  Binaries:
    Node: 17.9.1 - ~/.nvm/versions/node/v17.9.1/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 8.11.0 - ~/.nvm/versions/node/v17.9.1/bin/npm
  Browsers:
    Chrome: 116.0.5845.187
    Edge: 117.0.2045.40
    Safari: 15.6.1
  npmPackages:
    @storybook/addon-essentials: ^7.4.5 => 7.4.5 
    @storybook/addon-interactions: ^7.4.5 => 7.4.5 
    @storybook/addon-links: ^7.4.5 => 7.4.5 
    @storybook/addon-onboarding: ^1.0.8 => 1.0.8 
    @storybook/addon-styling: ^1.3.7 => 1.3.7 
    @storybook/blocks: ^7.4.5 => 7.4.5 
    @storybook/nextjs: ^7.4.5 => 7.4.5 
    @storybook/react: ^7.4.5 => 7.4.5 
    @storybook/testing-library: ^0.2.1 => 0.2.1

Additional context

No response

[camila-frangp]

Hi, i have the same issue, any news?