wix-style-react/dist/es/stories/MessageBox/DestructiveAlert.js

wix-style-react

import React from 'react';
import TabbedView from 'wix-storybook-utils/TabbedView';
import Markdown from 'wix-storybook-utils/Markdown';

import Readme from '../../src/MessageBox/README.md';
import ReadmeTestKit from '../../src/MessageBox/README.TESTKIT.md';
import CodeExample from 'wix-storybook-utils/CodeExample';

import StandardMessageBoxFunctionalLayout from './DestructiveAlertExamples/Standard';
import StandardMessageBoxFunctionalLayoutRaw from '!raw-loader!./DestructiveAlertExamples/Standard';

import SecondaryMessageBoxFunctionalLayout from './DestructiveAlertExamples/Secondary';
import SecondaryMessageBoxFunctionalLayoutRaw from '!raw-loader!./DestructiveAlertExamples/Secondary';

var introduction = '# Destructive Alert (`<MessageBoxFunctionalLayout/>`)\nComponents to be used within `wix-style-react/Modal`:\n';

var layoutStyles = {
  margin: '0 30px'
};

export default (function () {
  return React.createElement(
    TabbedView,
    { tabs: ['Usage', 'API', 'TestKits'] },
    React.createElement(
      'div',
      null,
      React.createElement(Markdown, { source: introduction }),
      React.createElement(
        'div',
        { style: layoutStyles },
        React.createElement(CodeExample, {
          title: 'Standard',
          code: StandardMessageBoxFunctionalLayoutRaw,
          children: React.createElement(StandardMessageBoxFunctionalLayout, null)
        }),
        React.createElement(CodeExample, {
          title: 'Secondary Action',
          code: SecondaryMessageBoxFunctionalLayoutRaw,
          children: React.createElement(SecondaryMessageBoxFunctionalLayout, null)
        })
      )
    ),
    React.createElement(Markdown, { source: Readme }),
    React.createElement(Markdown, { source: ReadmeTestKit })
  );
});