wix-style-react/src/AddressInput/docs/AddressInput.demo.js

wix-style-react

import React from 'react';
import AddressInput from '..';
import { addressInputItemBuilder } from '../../AddressInputItem';
import { StorybookComponents } from 'wix-storybook-utils/StorybookComponents';

export default () => {
  const predictions = [
    {
      id: 0,
      displayLabel: 'Home 2818 Saint Patrick Pl, Helena, AL, 35080',
      mainLabel: 'Home',
      secondaryLabel: '2818 Saint Patrick Pl, Helena, AL, 35080',
    },
    {
      id: 1,
      displayLabel: 'Work 512 4th St NE, Montgomery, MN, 56069',
      mainLabel: 'Work',
      secondaryLabel: '512 4th St NE, Montgomery, MN, 56069',
    },
  ];
  const options = predictions.map(addressInputItemBuilder);

  return (
    <StorybookComponents.Stack flexDirection="column" width="50%">
      <AddressInput placeholder="Search places..." options={options} />
    </StorybookComponents.Stack>
  );
};