@cainiaofe/cn-ui-m
Version:
43 lines (42 loc) • 2.19 kB
JavaScript
import { __assign } from "tslib";
import { CnButton, CnDemoBlock as DemoBlock, CnDemoDescription as DemoDescription, CnPopup, CnSlider, CnSliderItem, CnDemoPage, } from "../../..";
import React, { useState } from 'react';
var fullPopupStyle = {
height: '100%',
width: '100vw',
maxHeight: '100vh',
};
var fullContentFullStyle = {
color: '#fff',
height: '100vh',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
fontSize: '48px',
userSelect: 'none',
};
var WithPopup = function () {
var _a = useState(false), visible = _a[0], setVisible = _a[1];
return (React.createElement(React.Fragment, null,
React.createElement(CnButton, { onClick: function () {
setVisible(true);
} }, "\u663E\u793A\u5F39\u51FA\u5C42"),
React.createElement(CnPopup, { visible: visible, destroyOnClose: true, style: fullPopupStyle },
React.createElement(CnSlider, { loop: false, style: { width: '100vw', height: '100vh' } },
React.createElement(CnSliderItem, null,
React.createElement("div", { style: __assign(__assign({}, fullContentFullStyle), { background: '#ace0ff' }) }, "1")),
React.createElement(CnSliderItem, null,
React.createElement("div", { style: __assign(__assign({}, fullContentFullStyle), { background: '#bcffbd' }) }, "2")),
React.createElement(CnSliderItem, null,
React.createElement("div", { style: fullContentFullStyle },
React.createElement(CnButton, { onClick: function () {
setVisible(false);
} }, "\u5F00\u59CB\u4F7F\u7528")))))));
};
export var 全屏引导 = function () {
return (React.createElement(CnDemoPage, { title: "\u5168\u5C4F\u5F15\u5BFC" },
React.createElement(DemoBlock, { title: "\u5168\u5C4F\u5F15\u5BFC" },
React.createElement(WithPopup, null),
React.createElement(DemoDescription, { content: "\u914D\u5408 Popup \u7EC4\u4EF6\u53EF\u4EE5\u5B9E\u73B0\u5168\u5C4F\u5F15\u5BFC" }))));
};
export default { title: 'demo/CnSlider' };