2016-11-22 18:45:22 +02:00
|
|
|
# `<Modal> `
|
|
|
|
|
|
|
|
## demo
|
|
|
|
|
|
|
|
```embed
|
|
|
|
const React = require('react');
|
|
|
|
const ReactDOM = require('react-dom/server');
|
|
|
|
const Base = require('../base');
|
|
|
|
const Container = require('../container');
|
|
|
|
const Row = require('../row');
|
|
|
|
const Column = require('../column');
|
|
|
|
const Modal = require('./index.js');
|
|
|
|
const styles = require('./style.css');
|
|
|
|
|
2016-11-23 13:59:37 +02:00
|
|
|
const trigger = () => {
|
|
|
|
return (
|
|
|
|
<p>This is the trigger</p>
|
|
|
|
)
|
|
|
|
};
|
|
|
|
|
2016-11-22 18:45:22 +02:00
|
|
|
nmodule.exports = ReactDOM.renderToString(
|
|
|
|
<Base>
|
|
|
|
<Row>
|
|
|
|
<Column>
|
2016-11-23 13:59:37 +02:00
|
|
|
<Modal name="modal1" trigger={trigger} >
|
|
|
|
<h2>This is the Modal</h2>
|
2016-11-22 18:45:22 +02:00
|
|
|
</Modal>
|
|
|
|
</Column>
|
2016-11-23 13:59:37 +02:00
|
|
|
</Row>
|
2016-11-22 18:45:22 +02:00
|
|
|
</Base>
|
|
|
|
);
|
|
|
|
```
|
|
|
|
|
|
|
|
## usage
|
|
|
|
|
|
|
|
```js
|
|
|
|
const React = require('react');
|
|
|
|
const Modal = require('ui/button');
|
|
|
|
|
2016-11-23 13:59:37 +02:00
|
|
|
const trigger = () => {
|
|
|
|
return (
|
|
|
|
<p>This is the trigger</p>
|
|
|
|
)
|
|
|
|
};
|
|
|
|
|
2016-11-22 18:45:22 +02:00
|
|
|
module.exports = () => {
|
|
|
|
return (
|
2016-11-23 13:59:37 +02:00
|
|
|
<Modal name="modal1" trigger={trigger} >
|
|
|
|
<h2>This is the Modal</h2>
|
2016-11-22 18:45:22 +02:00
|
|
|
</Modal>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
```
|