@wix/design-system
Version:
@wix/design-system
242 lines • 6.45 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/esm/HorizontalTimeline/test/HorizontalTimeline.visual.jsx",
_this = this;
import React from 'react';
import { storiesOf } from '@storybook/react';
import HorizontalTimeline from '../HorizontalTimeline';
var tests = [{
describe: 'items',
its: [{
it: 'defaults',
props: {
items: [{
label: 'Instructions completed'
}, {
label: 'Domain check'
}, {
label: 'Site is live worldwide'
}]
}
}, {
it: 'should have custom width for items',
props: {
items: [{
label: 'Instructions completed',
width: '50px'
}, {
label: 'Domain check'
}, {
label: 'Site is live worldwide',
width: '5%'
}]
}
}, {
it: 'should have start alignment for label',
props: {
alignLabel: 'start',
items: [{
label: 'Instructions completed'
}, {
label: 'Domain check'
}, {
label: 'Site is live worldwide'
}]
}
}, {
it: 'should have dark skin by default',
props: {
items: [{
label: 'Instructions completed'
}, {
label: 'Domain check'
}, {
label: 'Site is live worldwide'
}]
}
}, {
it: 'should have standard skin when applied',
props: {
skin: 'standard',
items: [{
label: 'Instructions completed',
line: 'filled'
}, {
label: 'Domain check',
line: 'filled'
}, {
label: 'Site is live worldwide',
line: 'filled'
}]
}
}, {
it: 'should have filled line on dark skin',
props: {
items: [{
label: 'Instructions completed',
line: 'filled'
}, {
label: 'Domain check',
line: 'filled'
}, {
label: 'Site is live worldwide',
line: 'filled'
}]
}
}, {
it: 'should have tooltip for long label by default',
props: {
items: [{
label: 'Instructions completed'
}, {
label: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.'
}, {
label: 'Site is live worldwide'
}]
}
}, {
it: 'should not have tooltip for long label when labelEllipsis is false',
props: {
items: [{
label: 'Instructions completed'
}, {
label: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',
labelEllipsis: false
}, {
label: 'Site is live worldwide'
}]
}
}, {
it: 'should have dark skin for icons by default',
props: {
items: [{
label: 'Instructions completed',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.CompleteIcon, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 104,
columnNumber: 21
}
})
}, {
label: 'Domain check',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.ActiveIcon, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 108,
columnNumber: 21
}
})
}, {
label: 'Domain connecting',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.DefaultIcon, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 112,
columnNumber: 21
}
})
}, {
label: 'Site is live worldwide',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.DestructiveIcon, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 116,
columnNumber: 21
}
})
}, {
label: 'Domain ending',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.BoundaryIcon, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 120,
columnNumber: 21
}
})
}]
}
}, {
it: 'should have icons standard skin when applied',
props: {
items: [{
label: 'Instructions completed',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.CompleteIcon, {
skin: "standard",
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 131,
columnNumber: 21
}
})
}, {
label: 'Domain check',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.ActiveIcon, {
skin: "standard",
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 135,
columnNumber: 21
}
})
}, {
label: 'Domain connecting',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.DefaultIcon, {
skin: "standard",
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 139,
columnNumber: 21
}
})
}, {
label: 'Site is live worldwide',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.DestructiveIcon, {
skin: "standard",
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 143,
columnNumber: 21
}
})
}, {
label: 'Domain ending',
icon: /*#__PURE__*/React.createElement(HorizontalTimeline.BoundaryIcon, {
skin: "standard",
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 147,
columnNumber: 21
}
})
}]
}
}]
}];
tests.forEach(function (_ref) {
var describe = _ref.describe,
its = _ref.its;
its.forEach(function (_ref2) {
var it = _ref2.it,
props = _ref2.props;
storiesOf("".concat(HorizontalTimeline.displayName).concat(describe ? '/' + describe : ''), module).add(it, function () {
return /*#__PURE__*/React.createElement(HorizontalTimeline, _extends({}, props, {
__self: _this,
__source: {
fileName: _jsxFileName,
lineNumber: 161,
columnNumber: 21
}
}));
});
});
});