lucid-ui
Version:
A UI component library from AppNexus.
107 lines • 5.19 kB
JavaScript
import React from 'react';
import createClass from 'create-react-class';
import { Banner, ChatIcon } from '../../../index';
export default createClass({
render: function render() {
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Banner, {
style: {
marginBottom: 8
}
}, "Default"), /*#__PURE__*/React.createElement(Banner, {
isCloseable: false,
style: {
marginBottom: 8
}
}, "Default -- No Close ", String.fromCharCode(0x00d7))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Banner, {
kind: "success",
style: {
marginBottom: 8
}
}, "Success"), /*#__PURE__*/React.createElement(Banner, {
kind: "success",
isCloseable: false,
style: {
marginBottom: 8
}
}, "Success -- No Close ", String.fromCharCode(0x00d7))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Banner, {
kind: "warning",
style: {
marginBottom: 8
}
}, "Warning ", /*#__PURE__*/React.createElement("a", {
href: "#"
}, "Don't Click Here")), /*#__PURE__*/React.createElement(Banner, {
kind: "warning",
isCloseable: false,
style: {
marginBottom: 8
}
}, "Warning -- No Close ", String.fromCharCode(0x00d7))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Banner, {
kind: "danger",
style: {
marginBottom: 8
}
}, "Danger"), /*#__PURE__*/React.createElement(Banner, {
kind: "danger",
isCloseable: false,
style: {
marginBottom: 8
}
}, "Danger -- No Close ", String.fromCharCode(0x00d7))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Banner, {
kind: "info",
style: {
marginBottom: 8
}
}, "Info"), /*#__PURE__*/React.createElement(Banner, {
kind: "info",
isCloseable: false,
style: {
marginBottom: 8
}
}, "Info -- No Close ", String.fromCharCode(0x00d7))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Banner, {
style: {
marginBottom: 8
},
icon: /*#__PURE__*/React.createElement(ChatIcon, null),
kind: "danger"
}, "Has Icon")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Banner, {
style: {
marginBottom: 8
},
isFilled: false
}, /*#__PURE__*/React.createElement("div", null, "Sit totam voluptas error dolorum ullam Quo ipsam esse amet mollitia consequuntur Cumque cum nisi porro cumque sit nisi Facilis placeat suscipit earum blanditiis eveniet Earum dolor voluptates perferendis quis"), /*#__PURE__*/React.createElement("div", null, "Adipisicing culpa atque totam quidem dicta consequatur fugiat quaerat Facilis cupiditate amet nam in perferendis Veritatis iusto molestiae illum doloribus deserunt Odit autem obcaecati dolores ad incidunt? Ipsa eveniet modi."), /*#__PURE__*/React.createElement("div", null, "Lorem sit explicabo vitae illum labore Nostrum inventore dolor nisi deserunt voluptatem Voluptas itaque nesciunt omnis necessitatibus asperiores! Eius error ab consequatur necessitatibus repudiandae quibusdam Odio consequuntur at necessitatibus at"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("a", {
href: "#"
}, "Click Me"))), /*#__PURE__*/React.createElement(Banner, {
kind: "success",
style: {
marginBottom: 8
},
isFilled: false
}, /*#__PURE__*/React.createElement("div", null, "Success -- Outline"), /*#__PURE__*/React.createElement("div", null, "Outline banners are for messages with multi-line content.")), /*#__PURE__*/React.createElement(Banner, {
kind: "warning",
style: {
marginBottom: 8
},
isFilled: false
}, /*#__PURE__*/React.createElement("div", null, "Warning -- Outline"), /*#__PURE__*/React.createElement("div", null, "Outline banners are for messages with multi-line content.")), /*#__PURE__*/React.createElement(Banner, {
kind: "danger",
style: {
marginBottom: 8
},
isFilled: false
}, /*#__PURE__*/React.createElement("div", null, "Danger -- Outline"), /*#__PURE__*/React.createElement("div", null, "Outline banners are for messages with multi-line content.")), /*#__PURE__*/React.createElement(Banner, {
kind: "info",
style: {
marginBottom: 8
},
isFilled: false
}, /*#__PURE__*/React.createElement("div", null, "Info -- Outline"), /*#__PURE__*/React.createElement("div", null, "Outline banners are for messages with multi-line content.")), /*#__PURE__*/React.createElement(Banner, {
style: {
marginBottom: 8
},
icon: /*#__PURE__*/React.createElement(ChatIcon, null),
kind: "danger",
isFilled: false
}, /*#__PURE__*/React.createElement("div", null, "Has Icon -- Outline"), /*#__PURE__*/React.createElement("div", null, "Outline banners are for messages with multi-line content."))));
}
});