import { componentName } from '../src/components/descope-hcaptcha';
import { sizeControl, directionControl } from './commonControls';

const Template = ({ size, direction }) => `
  <descope-hcaptcha
    size="${size}"
    st-host-direction="${direction ?? ''}"
  >
  </descope-hcaptcha>
`;

export default {
  component: componentName,
  title: 'descope-hcaptcha',
  parameters: {
    panelPosition: 'right',
    controls: { expanded: true },
  },
  argTypes: {
    ...sizeControl,
    ...directionControl,
  },
};

export const Default = Template.bind({});

Default.args = {
  size: 'md',
};
