wix-style-react/src/AddressInputItem/docs/AddressInputItem.examples.js

wix-style-react

export const _structure = `
<AddressInputItem mainLabel="Main Label" secondaryLabel="Secondary Label" />;`;

export const _states = `
<StorybookComponents.Stack flexDirection="column">
  <AddressInputItem mainLabel="Highlighted" highlighted />
  <AddressInputItem mainLabel="Selected" selected />
  <AddressInputItem mainLabel="Disabled" disabled />
</StorybookComponents.Stack>;`;

export const _layout = `
<StorybookComponents.Stack flexDirection="column">
  <AddressInputItem
    mainLabel="Single Line"
    secondaryLabel="Layout"
    optionLayout="single-line"
  />
  <AddressInputItem
    mainLabel="Double Line"
    secondaryLabel="Layout"
    optionLayout="double-line"
  />
</StorybookComponents.Stack>;`;

export const _affix = `
<StorybookComponents.Stack flexDirection="column">
  <AddressInputItem
    mainLabel="Address"
    secondaryLabel="With a default layout"
  />
  <AddressInputItem
    mainLabel="Address"
    secondaryLabel="With a removed prefix"
    prefix={false}
  />
  <AddressInputItem
    mainLabel="Address"
    secondaryLabel="With a custom prefix and suffix"
    suffix="Suffix"
    prefix={<Icons.Toolbox />}
  />
</StorybookComponents.Stack>`;

export const _listItemBuilders = `() => {
  const options = [
    listItemSectionBuilder({
      title: 'Saved Addresses',
      type: 'title',
    }),
    addressInputItemBuilder({
      id: 0,
      mainLabel: '2818 Saint Patrick Pl, Helena, 35080',
      secondaryLabel: 'Alabama, USA ',
      prefix: <Icons.Toolbox />,
      suffix: '2km away',
      optionLayout: 'double-line',
    }),
    addressInputItemBuilder({
      id: 1,
      mainLabel: '512 4th St NE, Montgomery, 56069',
      secondaryLabel: 'Minnesota, USA',
      prefix: <Icons.Home />,
      suffix: '34km away',
      optionLayout: 'double-line',
    }),
    listItemSectionBuilder({
      type: 'divider',
    }),
    addressInputItemBuilder({
      id: 2,
      mainLabel: '3499  Henry Ford Avenue, Sallisaw, 74955',
      secondaryLabel: 'Oklahoma, USA ',
      optionLayout: 'double-line',
    }),
    addressInputItemBuilder({
      id: 3,
      mainLabel: '1382  Goosetown Drive, Newland, 28657',
      secondaryLabel: 'North Carolina, USA',
      optionLayout: 'double-line',
    }),
    addressInputItemBuilder({
      id: 4,
      mainLabel: '2887  Eagle Drive, Flat Rock, 48134',
      secondaryLabel: 'Michigan, USA',
      optionLayout: 'double-line',
    }),
  ];

  return <AddressInput options={options} />;
};`;