lucid-ui
Version:
A UI component library from AppNexus.
45 lines (44 loc) • 3.04 kB
JavaScript
import React from 'react';
import createClass from 'create-react-class';
import { Banner } from '../../../index';
export default createClass({
render() {
return (React.createElement("div", null,
React.createElement("div", null,
React.createElement(Banner, { style: { marginBottom: 8 }, isSmall: true }, "Default"),
React.createElement(Banner, { isCloseable: false, style: { marginBottom: 8 }, isSmall: true },
"Default -- No Close ",
String.fromCharCode(0x00d7))),
React.createElement("div", null,
React.createElement(Banner, { kind: 'success', style: { marginBottom: 8 }, isSmall: true }, "Success"),
React.createElement(Banner, { kind: 'success', isCloseable: false, isSmall: true, style: { marginBottom: 8 } },
"Success -- No Close ",
String.fromCharCode(0x00d7))),
React.createElement("div", null,
React.createElement(Banner, { kind: 'warning', style: { marginBottom: 8 }, isSmall: true }, "Warning"),
React.createElement(Banner, { kind: 'warning', isCloseable: false, isSmall: true, style: { marginBottom: 8 } },
"Warning -- No Close ",
String.fromCharCode(0x00d7))),
React.createElement("div", null,
React.createElement(Banner, { kind: 'danger', style: { marginBottom: 8 }, isSmall: true }, "Danger"),
React.createElement(Banner, { kind: 'danger', isCloseable: false, style: { marginBottom: 8 }, isSmall: true },
"Danger -- No Close ",
String.fromCharCode(0x00d7))),
React.createElement("div", null,
React.createElement(Banner, { kind: 'info', style: { marginBottom: 8 }, isSmall: true }, "Info"),
React.createElement(Banner, { kind: 'info', isCloseable: false, style: { marginBottom: 8 }, isSmall: true },
"Info -- No Close ",
String.fromCharCode(0x00d7))),
React.createElement("div", null,
React.createElement(Banner, { style: { marginBottom: 8 }, isSmall: true, isFilled: false }, "Default -- Outline Only"),
React.createElement(Banner, { kind: 'success', style: { marginBottom: 8 }, isSmall: true, isFilled: false }, "Success -- Outline Only"),
React.createElement(Banner, { kind: 'warning', style: { marginBottom: 8 }, isSmall: true, isFilled: false }, "Warning -- Outline Only"),
React.createElement(Banner, { kind: 'danger', style: { marginBottom: 8 }, isSmall: true, isFilled: false }, "Danger -- Outline Only"),
React.createElement(Banner, { kind: 'info', style: { marginBottom: 8 }, isSmall: true, isFilled: false }, "Info -- Outline Only"))));
},
});
// begin-hide-from-docs
export const notes = `
Use small banners inside \`Panels\`. Don't use icons inside small banners.
`;
// end-hide-from-docs