@financial-times/n-conversion-forms/components/delivery-option.stories.js

Containing jsx components and styles for forms included on Accounts and Acqusition apps (next-signup, next-profile, next-retention, etc).

import React from 'react';
import { DeliveryOption } from './delivery-option';
import { countriesSupportedISO } from '../helpers/supportedCountries';

export default {
	title: 'Delivery Options',
	component: DeliveryOption,
	argTypes: {
		options: { control: 'array' },
		country: {
			control: {
				type: 'inline-radio',
				options: countriesSupportedISO,
			},
		},
		productCode: { control: 'string' },
	},
};

export const Basic = (args) => (
	<div className="ncf">
		<DeliveryOption {...args} />
	</div>
);
Basic.args = {
	country: 'GBR',
	options: [
		{
			value: 'PV',
			isValidDeliveryOption: true,
		},
		{
			value: 'HD',
			isValidDeliveryOption: true,
		},
		{
			value: 'EV',
			isValidDeliveryOption: true,
		},
	],
};

export const US5or6DaysWeekDeliveryOptions = (args) => (
	<div className="ncf">
		<DeliveryOption {...args} />
	</div>
);
US5or6DaysWeekDeliveryOptions.args = {
	options: [
		{
			value: 'HD',
			isValidDeliveryOption: true,
			deliveryOnPublicationDate: true,
			flightMarket: false,
			mailDelivery: false,
		},
		{
			value: 'HD',
			isValidDeliveryOption: true,
			deliveryOnPublicationDate: false,
			flightMarket: false,
			mailDelivery: true,
		},
	],
	country: 'USA',
	productCode: 'P2N6D',
};

export const USWeekendOnlyDeliveryOptions = (args) => (
	<div className="ncf">
		<DeliveryOption {...args} />
	</div>
);
USWeekendOnlyDeliveryOptions.args = {
	options: [
		{
			value: 'HD',
			isValidDeliveryOption: true,
			deliveryOnPublicationDate: false,
			flightMarket: false,
			mailDelivery: false,
		},
		{
			value: 'HD',
			isValidDeliveryOption: true,
			mailDelivery: true,
		},
	],
	country: 'USA',
	productCode: 'NWE',
};