// This file is part of Coog. The COPYRIGHT file at the top level of
// this repository contains the full copyright notices and license terms.

import React from 'react';
import OSMAddressField from './OSMAddressField';

import { OSMAddressFieldProps } from './OSMAddressField.types';

export default {
  title: 'OSMAddressField',
  parameters: {
    actions: {
      handles: ['mouseover', 'click .btn'],
    },
    component: OSMAddressField,
  },
  argTypes: {
    regions: {
      control: {
        type: 'multi-select',
        options: ['fr', 'us', 'de', 'es'],
      },
    },
    language: {
      control: {
        type: 'select',
        options: ['fr', 'us', 'de', 'es'],
      },
    },
  },
};

export const OSMAddressFieldStory = (args: OSMAddressFieldProps): JSX.Element => {
  const { apiKey, value, regions, language } = args;
  const eventEmitter = (fullAddress: string, data: any) => {
    console.log('eventEmitter');
    console.log('fullAddress', fullAddress);
    console.log('data', data);
  };

  return (
    <OSMAddressField apiKey={apiKey} eventEmitter={eventEmitter} value={value} regions={regions} language={language} />
  );
};

OSMAddressFieldStory.args = {
  apiKey: '',
  value: "1 Rue d'Hauteville, 75010 Paris, France",
};