@wix/design-system
Version:
@wix/design-system
282 lines • 8.1 kB
JavaScript
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/esm/TableToolbar/test/TableToolbar.visual.jsx",
_this = this;
import React from 'react';
import { storiesOf } from '@storybook/react';
import TableToolbar from '../TableToolbar';
import Button from '../../Button';
import MainExample from './MainExample';
var tests = [{
describe: 'TableToolbar',
its: [{
it: 'should display table toolbar',
component: function component() {
return /*#__PURE__*/React.createElement(MainExample, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 14,
columnNumber: 26
}
});
}
}, {
it: 'should display table toolbar in RTL',
component: function component() {
return /*#__PURE__*/React.createElement("div", {
className: "rtl",
dir: "rtl",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 20,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement(MainExample, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 21,
columnNumber: 13
}
}));
}
}, {
it: 'should display items with layout="button"',
component: function component() {
return /*#__PURE__*/React.createElement(TableToolbar, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 28,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement(TableToolbar.ItemGroup, {
position: "start",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 29,
columnNumber: 13
}
}, /*#__PURE__*/React.createElement(TableToolbar.Item, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 30,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(TableToolbar.Title, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 31,
columnNumber: 17
}
}, "My Table")), /*#__PURE__*/React.createElement(TableToolbar.Item, {
layout: "button",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 33,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(Button, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 34,
columnNumber: 17
}
}, "Button 1")), /*#__PURE__*/React.createElement(TableToolbar.Item, {
layout: "button",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 36,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(Button, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 37,
columnNumber: 17
}
}, "Button 2"))));
}
}, {
it: 'should display items with divider',
component: function component() {
return /*#__PURE__*/React.createElement(TableToolbar, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 46,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement(TableToolbar.ItemGroup, {
position: "start",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 47,
columnNumber: 13
}
}, /*#__PURE__*/React.createElement(TableToolbar.Item, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 48,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(TableToolbar.Title, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 49,
columnNumber: 17
}
}, "My Table")), /*#__PURE__*/React.createElement(TableToolbar.Divider, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 51,
columnNumber: 15
}
}), /*#__PURE__*/React.createElement(TableToolbar.Item, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 52,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(Button, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 53,
columnNumber: 17
}
}, "Button 2"))));
}
}, {
it: 'should display items with selected count',
component: function component() {
return /*#__PURE__*/React.createElement(TableToolbar, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 62,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement(TableToolbar.ItemGroup, {
position: "start",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 63,
columnNumber: 13
}
}, /*#__PURE__*/React.createElement(TableToolbar.Item, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 64,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(TableToolbar.SelectedCount, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 65,
columnNumber: 17
}
}, "12 Selected"))), /*#__PURE__*/React.createElement(TableToolbar.ItemGroup, {
position: "end",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 70,
columnNumber: 13
}
}, /*#__PURE__*/React.createElement(TableToolbar.Item, {
layout: "button",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 71,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(Button, {
skin: "light",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 72,
columnNumber: 17
}
}, "Export")), /*#__PURE__*/React.createElement(TableToolbar.Item, {
layout: "button",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 74,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(Button, {
skin: "light",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 75,
columnNumber: 17
}
}, "Duplicate")), /*#__PURE__*/React.createElement(TableToolbar.Item, {
layout: "button",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 77,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(Button, {
skin: "light",
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 78,
columnNumber: 17
}
}, "Edit")), /*#__PURE__*/React.createElement(TableToolbar.Divider, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 80,
columnNumber: 15
}
})));
}
}, {
it: 'should remove container vertical padding',
component: function component() {
return /*#__PURE__*/React.createElement(MainExample, {
removeVerticalPadding: true,
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 87,
columnNumber: 26
}
});
}
}]
}];
tests.forEach(function (_ref) {
var describe = _ref.describe,
its = _ref.its;
its.forEach(function (_ref2) {
var it = _ref2.it,
component = _ref2.component;
storiesOf("TableToolbar".concat(describe ? '/' + describe : ''), module).add(it, component);
});
});