Socket
Socket
Sign inDemoInstall

@storybook/addon-a11y

Package Overview
Dependencies
Maintainers
10
Versions
1885
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@storybook/addon-a11y - npm Package Compare versions

Comparing version 4.0.0-alpha.16 to 4.0.0-alpha.17

190

dist/components/Panel.js

@@ -1,56 +0,47 @@

'use strict';
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _createClass2 = require('babel-runtime/helpers/createClass');
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _createClass3 = _interopRequireDefault(_createClass2);
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _react = _interopRequireWildcard(require("react"));
var _inherits2 = require('babel-runtime/helpers/inherits');
var _propTypes = _interopRequireDefault(require("prop-types"));
var _inherits3 = _interopRequireDefault(_inherits2);
var _reactEmotion = _interopRequireDefault(require("react-emotion"));
var _react = require('react');
var _coreEvents = require("@storybook/core-events");
var _react2 = _interopRequireDefault(_react);
var _components = require("@storybook/components");
var _propTypes = require('prop-types');
var _shared = require("../shared");
var _propTypes2 = _interopRequireDefault(_propTypes);
var _Tabs = _interopRequireDefault(require("./Tabs"));
var _reactEmotion = require('react-emotion');
var _Report = _interopRequireDefault(require("./Report"));
var _reactEmotion2 = _interopRequireDefault(_reactEmotion);
var _coreEvents = require('@storybook/core-events');
var _components = require('@storybook/components');
var _shared = require('../shared');
var _Tabs = require('./Tabs');
var _Tabs2 = _interopRequireDefault(_Tabs);
var _Report = require('./Report');
var _Report2 = _interopRequireDefault(_Report);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Passes = (0, _reactEmotion2.default)('span')(function (_ref) {
var Passes =
/*#__PURE__*/
(0, _reactEmotion.default)('span', {
target: "e1gxh7md0"
})(function (_ref) {
var theme = _ref.theme;

@@ -61,4 +52,7 @@ return {

});
var Violations = (0, _reactEmotion2.default)('span')(function (_ref2) {
var Violations =
/*#__PURE__*/
(0, _reactEmotion.default)('span', {
target: "e1gxh7md1"
})(function (_ref2) {
var theme = _ref2.theme;

@@ -70,22 +64,26 @@ return {

var Panel = function (_Component) {
(0, _inherits3.default)(Panel, _Component);
var Panel =
/*#__PURE__*/
function (_Component) {
(0, _inherits2.default)(Panel, _Component);
function Panel() {
var _ref3;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
(0, _classCallCheck3.default)(this, Panel);
(0, _classCallCheck2.default)(this, Panel);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref3 = Panel.__proto__ || (0, _getPrototypeOf2.default)(Panel)).call.apply(_ref3, [this].concat(args))), _this), _this.state = {
_this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(Panel)).call.apply(_getPrototypeOf2, [this].concat(args)));
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", {
passes: [],
violations: []
}, _this.onUpdate = function (_ref4) {
var passes = _ref4.passes,
violations = _ref4.violations;
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "onUpdate", function (_ref3) {
var passes = _ref3.passes,
violations = _ref3.violations;

@@ -96,3 +94,4 @@ _this.setState({

});
}, _this.requestCheck = function () {
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "requestCheck", function () {
var _this$props = _this.props,

@@ -102,15 +101,13 @@ channel = _this$props.channel,

if (active) {
channel.emit(_shared.REQUEST_CHECK_EVENT_ID);
}
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
});
return _this;
}
(0, _createClass3.default)(Panel, [{
key: 'componentDidMount',
(0, _createClass2.default)(Panel, [{
key: "componentDidMount",
value: function componentDidMount() {
var channel = this.props.channel;
channel.on(_shared.CHECK_EVENT_ID, this.onUpdate);

@@ -121,7 +118,6 @@ channel.on(_coreEvents.STORY_RENDERED, this.requestCheck);

}, {
key: 'componentDidUpdate',
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
var active = this.props.active;
if (!prevProps.active && active) {

@@ -132,7 +128,5 @@ this.requestCheck();

}, {
key: 'componentWillUnmount',
key: "componentWillUnmount",
value: function componentWillUnmount() {
var channel = this.props.channel;
channel.removeListener(_shared.CHECK_EVENT_ID, this.onUpdate);

@@ -143,42 +137,27 @@ channel.removeListener(_coreEvents.STORY_RENDERED, this.requestCheck);

}, {
key: 'render',
key: "render",
value: function render() {
var _state = this.state,
passes = _state.passes,
violations = _state.violations;
var _this$state = this.state,
passes = _this$state.passes,
violations = _this$state.violations;
var active = this.props.active;
return active ? _react2.default.createElement(
'div',
null,
_react2.default.createElement(_Tabs2.default, {
tabs: [{
label: _react2.default.createElement(
Violations,
null,
violations.length,
' Violations'
),
panel: _react2.default.createElement(_Report2.default, { passes: false, items: violations, empty: 'No a11y violations found.' })
}, {
label: _react2.default.createElement(
Passes,
null,
passes.length,
' Passes'
),
panel: _react2.default.createElement(_Report2.default, { passes: true, items: passes, empty: 'No a11y check passed' })
}]
}),
_react2.default.createElement(
_components.ActionBar,
null,
_react2.default.createElement(
_components.ActionButton,
{ onClick: this.requestCheck },
'RERUN TEST'
)
)
) : null;
return active ? _react.default.createElement("div", null, _react.default.createElement(_Tabs.default, {
tabs: [{
label: _react.default.createElement(Violations, null, violations.length, " Violations"),
panel: _react.default.createElement(_Report.default, {
passes: false,
items: violations,
empty: "No a11y violations found."
})
}, {
label: _react.default.createElement(Passes, null, passes.length, " Passes"),
panel: _react.default.createElement(_Report.default, {
passes: true,
items: passes,
empty: "No a11y check passed"
})
}]
}), _react.default.createElement(_components.ActionBar, null, _react.default.createElement(_components.ActionButton, {
onClick: this.requestCheck
}, "RERUN TEST"))) : null;
}

@@ -189,10 +168,11 @@ }]);

Panel.propTypes = {
active: _propTypes2.default.bool.isRequired,
channel: _propTypes2.default.shape({
on: _propTypes2.default.func,
emit: _propTypes2.default.func,
removeListener: _propTypes2.default.func
(0, _defineProperty2.default)(Panel, "propTypes", {
active: _propTypes.default.bool.isRequired,
channel: _propTypes.default.shape({
on: _propTypes.default.func,
emit: _propTypes.default.func,
removeListener: _propTypes.default.func
}).isRequired
};
exports.default = Panel;
});
var _default = Panel;
exports.default = _default;

@@ -1,33 +0,32 @@

'use strict';
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _toConsumableArray2 = require('babel-runtime/helpers/toConsumableArray');
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _toConsumableArray3 = _interopRequireDefault(_toConsumableArray2);
var _react = _interopRequireDefault(require("react"));
var _react = require('react');
var _propTypes = _interopRequireDefault(require("prop-types"));
var _react2 = _interopRequireDefault(_react);
var _reactEmotion = _interopRequireDefault(require("react-emotion"));
var _propTypes = require('prop-types');
var _Rules = _interopRequireDefault(require("./Rules"));
var _propTypes2 = _interopRequireDefault(_propTypes);
var _reactEmotion = require('react-emotion');
var _reactEmotion2 = _interopRequireDefault(_reactEmotion);
var _Rules = require('./Rules');
var _Rules2 = _interopRequireDefault(_Rules);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Item = (0, _reactEmotion2.default)('li')({
var Item =
/*#__PURE__*/
(0, _reactEmotion.default)('li', {
target: "eji8sqs0"
})({
fontWeight: 600
});
var ItemTitle = (0, _reactEmotion2.default)('span')({
var ItemTitle =
/*#__PURE__*/
(0, _reactEmotion.default)('span', {
target: "eji8sqs1"
})({
borderBottom: '1px solid rgb(130, 130, 130)',

@@ -46,48 +45,40 @@ width: '100%',

none = element.none;
var rules = (0, _toConsumableArray2.default)(any).concat((0, _toConsumableArray2.default)(all), (0, _toConsumableArray2.default)(none));
return _react.default.createElement(Item, null, _react.default.createElement(ItemTitle, null, element.target[0]), _react.default.createElement(_Rules.default, {
rules: rules,
passes: passes
}));
}
var rules = [].concat((0, _toConsumableArray3.default)(any), (0, _toConsumableArray3.default)(all), (0, _toConsumableArray3.default)(none));
return _react2.default.createElement(
Item,
null,
_react2.default.createElement(
ItemTitle,
null,
element.target[0]
),
_react2.default.createElement(_Rules2.default, { rules: rules, passes: passes })
);
}
Element.propTypes = {
element: _propTypes2.default.shape({
any: _propTypes2.default.array.isRequired,
all: _propTypes2.default.array.isRequired,
none: _propTypes2.default.array.isRequired
element: _propTypes.default.shape({
any: _propTypes.default.array.isRequired,
all: _propTypes.default.array.isRequired,
none: _propTypes.default.array.isRequired
}).isRequired,
passes: _propTypes2.default.bool.isRequired
passes: _propTypes.default.bool.isRequired
};
/* eslint-disable react/no-array-index-key */
/* eslint-disable react/no-array-index-key */
var Elements = function Elements(_ref2) {
var elements = _ref2.elements,
passes = _ref2.passes;
return _react2.default.createElement(
'ol',
null,
elements.map(function (element, index) {
return _react2.default.createElement(Element, { passes: passes, element: element, key: index });
})
);
return _react.default.createElement("ol", null, elements.map(function (element, index) {
return _react.default.createElement(Element, {
passes: passes,
element: element,
key: index
});
}));
};
Elements.propTypes = {
elements: _propTypes2.default.arrayOf(_propTypes2.default.shape({
any: _propTypes2.default.array.isRequired,
all: _propTypes2.default.array.isRequired,
none: _propTypes2.default.array.isRequired
elements: _propTypes.default.arrayOf(_propTypes.default.shape({
any: _propTypes.default.array.isRequired,
all: _propTypes.default.array.isRequired,
none: _propTypes.default.array.isRequired
})).isRequired,
passes: _propTypes2.default.bool.isRequired
passes: _propTypes.default.bool.isRequired
};
exports.default = Elements;
var _default = Elements;
exports.default = _default;

@@ -1,23 +0,18 @@

'use strict';
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require('react');
var _react = _interopRequireDefault(require("react"));
var _react2 = _interopRequireDefault(_react);
var _propTypes = _interopRequireDefault(require("prop-types"));
var _propTypes = require('prop-types');
var _components = require("@storybook/components");
var _propTypes2 = _interopRequireDefault(_propTypes);
var _Item = _interopRequireDefault(require("./Item"));
var _components = require('@storybook/components');
var _Item = require('./Item');
var _Item2 = _interopRequireDefault(_Item);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Report = function Report(_ref) {

@@ -27,25 +22,21 @@ var items = _ref.items,

passes = _ref.passes;
return _react2.default.createElement(
'div',
null,
items.length ? items.map(function (item) {
return _react2.default.createElement(_Item2.default, { passes: passes, item: item, key: item.id });
}) : _react2.default.createElement(
_components.Placeholder,
null,
empty
)
);
return _react.default.createElement("div", null, items.length ? items.map(function (item) {
return _react.default.createElement(_Item.default, {
passes: passes,
item: item,
key: item.id
});
}) : _react.default.createElement(_components.Placeholder, null, empty));
};
Report.propTypes = {
items: _propTypes2.default.arrayOf(_propTypes2.default.shape({
description: _propTypes2.default.string,
nodes: _propTypes2.default.array,
tags: _propTypes2.default.array
items: _propTypes.default.arrayOf(_propTypes.default.shape({
description: _propTypes.default.string,
nodes: _propTypes.default.array,
tags: _propTypes.default.array
})).isRequired,
empty: _propTypes2.default.string.isRequired,
passes: _propTypes2.default.bool.isRequired
empty: _propTypes.default.string.isRequired,
passes: _propTypes.default.bool.isRequired
};
exports.default = Report;
var _default = Report;
exports.default = _default;

@@ -1,22 +0,21 @@

'use strict';
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require('react');
var _react = _interopRequireDefault(require("react"));
var _react2 = _interopRequireDefault(_react);
var _propTypes = _interopRequireDefault(require("prop-types"));
var _propTypes = require('prop-types');
var _reactEmotion = _interopRequireDefault(require("react-emotion"));
var _propTypes2 = _interopRequireDefault(_propTypes);
var _reactEmotion = require('react-emotion');
var _reactEmotion2 = _interopRequireDefault(_reactEmotion);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Wrapper = (0, _reactEmotion2.default)('div')(function (_ref) {
var Wrapper =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "e1uet5c10"
})(function (_ref) {
var theme = _ref.theme;

@@ -29,6 +28,14 @@ return {

});
var Help = (0, _reactEmotion2.default)('p')({
var Help =
/*#__PURE__*/
(0, _reactEmotion.default)('p', {
target: "e1uet5c11"
})({
margin: '0 0 12px'
});
var Link = (0, _reactEmotion2.default)('a')({
var Link =
/*#__PURE__*/
(0, _reactEmotion.default)('a', {
target: "e1uet5c12"
})({
marginTop: '12px',

@@ -42,26 +49,15 @@ textDecoration: 'underline',

var item = _ref2.item;
return _react2.default.createElement(
Wrapper,
null,
_react2.default.createElement(
Help,
null,
item.help
),
_react2.default.createElement(
Link,
{ href: item.helpUrl, target: '_blank' },
'More info...'
)
);
return _react.default.createElement(Wrapper, null, _react.default.createElement(Help, null, item.help), _react.default.createElement(Link, {
href: item.helpUrl,
target: "_blank"
}, "More info..."));
}
Info.propTypes = {
item: _propTypes2.default.shape({
help: _propTypes2.default.node,
helpUrl: _propTypes2.default.string
item: _propTypes.default.shape({
help: _propTypes.default.node,
helpUrl: _propTypes.default.string
}).isRequired
};
exports.default = Info;
var _default = Info;
exports.default = _default;

@@ -1,56 +0,45 @@

'use strict';
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _createClass2 = require('babel-runtime/helpers/createClass');
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _createClass3 = _interopRequireDefault(_createClass2);
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _react = _interopRequireWildcard(require("react"));
var _inherits2 = require('babel-runtime/helpers/inherits');
var _propTypes = _interopRequireDefault(require("prop-types"));
var _inherits3 = _interopRequireDefault(_inherits2);
var _reactEmotion = _interopRequireDefault(require("react-emotion"));
var _react = require('react');
var _components = require("@storybook/components");
var _react2 = _interopRequireDefault(_react);
var _Info = _interopRequireDefault(require("./Info"));
var _propTypes = require('prop-types');
var _Tags = _interopRequireDefault(require("./Tags"));
var _propTypes2 = _interopRequireDefault(_propTypes);
var _Elements = _interopRequireDefault(require("./Elements"));
var _reactEmotion = require('react-emotion');
var _reactEmotion2 = _interopRequireDefault(_reactEmotion);
var _components = require('@storybook/components');
var _Info = require('./Info');
var _Info2 = _interopRequireDefault(_Info);
var _Tags = require('./Tags');
var _Tags2 = _interopRequireDefault(_Tags);
var _Elements = require('./Elements');
var _Elements2 = _interopRequireDefault(_Elements);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Wrapper = (0, _reactEmotion2.default)('div')(function (_ref) {
var Wrapper =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "e1my63jf0"
})(function (_ref) {
var theme = _ref.theme;

@@ -63,4 +52,7 @@ return {

});
var HeaderBar = (0, _reactEmotion2.default)('button')(function (_ref2) {
var HeaderBar =
/*#__PURE__*/
(0, _reactEmotion.default)('button', {
target: "e1my63jf1"
})(function (_ref2) {
var theme = _ref2.theme;

@@ -74,9 +66,7 @@ return {

color: 'inherit',
borderTop: '3px solid transparent',
borderBottom: '3px solid transparent',
'&:focus': {
outline: '0 none',
borderBottom: '3px solid ' + theme.highlightColor
borderBottom: "3px solid ".concat(theme.highlightColor)
}

@@ -86,19 +76,23 @@ };

var Item = function (_Component) {
(0, _inherits3.default)(Item, _Component);
var Item =
/*#__PURE__*/
function (_Component) {
(0, _inherits2.default)(Item, _Component);
function Item() {
var _ref3;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
(0, _classCallCheck3.default)(this, Item);
(0, _classCallCheck2.default)(this, Item);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref3 = Item.__proto__ || (0, _getPrototypeOf2.default)(Item)).call.apply(_ref3, [this].concat(args))), _this), _this.state = {
_this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(Item)).call.apply(_getPrototypeOf2, [this].concat(args)));
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", {
open: false
}, _this.onToggle = function () {
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "onToggle", function () {
return _this.setState(function (prevState) {

@@ -109,36 +103,32 @@ return {

});
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
});
return _this;
}
(0, _createClass3.default)(Item, [{
key: 'render',
(0, _createClass2.default)(Item, [{
key: "render",
value: function render() {
var _props = this.props,
item = _props.item,
passes = _props.passes;
var _this$props = this.props,
item = _this$props.item,
passes = _this$props.passes;
var open = this.state.open;
return _react2.default.createElement(
Wrapper,
null,
_react2.default.createElement(
HeaderBar,
{ onClick: this.onToggle },
_react2.default.createElement(_components.Icons.ChevronRight, {
size: 10,
color: '#9DA5AB',
style: {
marginRight: '5px',
marginBottom: '2px',
transform: 'rotate(' + (open ? 90 : 0) + 'deg)',
transition: 'transform 0.3s ease-in-out'
}
}),
item.description
),
open && _react2.default.createElement(_Info2.default, { item: item }),
open && _react2.default.createElement(_Elements2.default, { elements: item.nodes, passes: passes }),
open && _react2.default.createElement(_Tags2.default, { tags: item.tags })
);
return _react.default.createElement(Wrapper, null, _react.default.createElement(HeaderBar, {
onClick: this.onToggle
}, _react.default.createElement(_components.Icons.ChevronRight, {
size: 10,
color: "#9DA5AB",
style: {
marginRight: '5px',
marginBottom: '2px',
transform: "rotate(".concat(open ? 90 : 0, "deg)"),
transition: 'transform 0.3s ease-in-out'
}
}), item.description), open && _react.default.createElement(_Info.default, {
item: item
}), open && _react.default.createElement(_Elements.default, {
elements: item.nodes,
passes: passes
}), open && _react.default.createElement(_Tags.default, {
tags: item.tags
}));
}

@@ -149,10 +139,11 @@ }]);

Item.propTypes = {
item: _propTypes2.default.shape({
description: _propTypes2.default.string,
nodes: _propTypes2.default.array,
tags: _propTypes2.default.array
(0, _defineProperty2.default)(Item, "propTypes", {
item: _propTypes.default.shape({
description: _propTypes.default.string,
nodes: _propTypes.default.array,
tags: _propTypes.default.array
}).isRequired,
passes: _propTypes2.default.bool.isRequired
};
exports.default = Item;
passes: _propTypes.default.bool.isRequired
});
var _default = Item;
exports.default = _default;

@@ -1,21 +0,16 @@

'use strict';
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require('react');
var _react = _interopRequireDefault(require("react"));
var _react2 = _interopRequireDefault(_react);
var _propTypes = _interopRequireDefault(require("prop-types"));
var _propTypes = require('prop-types');
var _reactEmotion = _interopRequireDefault(require("react-emotion"));
var _propTypes2 = _interopRequireDefault(_propTypes);
var _reactEmotion = require('react-emotion');
var _reactEmotion2 = _interopRequireDefault(_reactEmotion);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var impactColors = {

@@ -28,4 +23,7 @@ minor: '#f1c40f',

};
var List = (0, _reactEmotion2.default)('div')({
var List =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "eu4a09m0"
})({
display: 'flex',

@@ -36,4 +34,7 @@ flexDirection: 'column',

});
var Item = (0, _reactEmotion2.default)('div')({
var Item =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "eu4a09m1"
})({
display: 'flex',

@@ -43,8 +44,14 @@ flexDirection: 'row',

});
var Message = (0, _reactEmotion2.default)('div')({
var Message =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "eu4a09m2"
})({
paddingLeft: '6px'
});
var Status = (0, _reactEmotion2.default)('div')(function (_ref) {
var Status =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "eu4a09m3"
})(function (_ref) {
var passes = _ref.passes,

@@ -70,45 +77,35 @@ impact = _ref.impact;

passes = _ref2.passes;
return _react2.default.createElement(
Item,
null,
_react2.default.createElement(
Status,
{ passes: passes || undefined, impact: rule.impact },
passes ? '✔' : '✘'
),
_react2.default.createElement(
Message,
null,
rule.message
)
);
return _react.default.createElement(Item, null, _react.default.createElement(Status, {
passes: passes || undefined,
impact: rule.impact
}, passes ? '✔' : '✘'), _react.default.createElement(Message, null, rule.message));
};
Rule.propTypes = {
rule: _propTypes2.default.shape({
message: _propTypes2.default.node
rule: _propTypes.default.shape({
message: _propTypes.default.node
}).isRequired,
passes: _propTypes2.default.bool.isRequired
passes: _propTypes.default.bool.isRequired
};
/* eslint-disable react/no-array-index-key */
/* eslint-disable react/no-array-index-key */
function Rules(_ref3) {
var rules = _ref3.rules,
passes = _ref3.passes;
return _react.default.createElement(List, null, rules.map(function (rule, index) {
return _react.default.createElement(Rule, {
passes: passes,
rule: rule,
key: index
});
}));
}
return _react2.default.createElement(
List,
null,
rules.map(function (rule, index) {
return _react2.default.createElement(Rule, { passes: passes, rule: rule, key: index });
})
);
}
Rules.propTypes = {
rules: _propTypes2.default.arrayOf(_propTypes2.default.shape({
message: _propTypes2.default.node
rules: _propTypes.default.arrayOf(_propTypes.default.shape({
message: _propTypes.default.node
})).isRequired,
passes: _propTypes2.default.bool.isRequired
passes: _propTypes.default.bool.isRequired
};
exports.default = Rules;
var _default = Rules;
exports.default = _default;

@@ -1,22 +0,21 @@

'use strict';
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require('react');
var _react = _interopRequireDefault(require("react"));
var _react2 = _interopRequireDefault(_react);
var _propTypes = _interopRequireDefault(require("prop-types"));
var _propTypes = require('prop-types');
var _reactEmotion = _interopRequireDefault(require("react-emotion"));
var _propTypes2 = _interopRequireDefault(_propTypes);
var _reactEmotion = require('react-emotion');
var _reactEmotion2 = _interopRequireDefault(_reactEmotion);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Wrapper = (0, _reactEmotion2.default)('div')({
var Wrapper =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "ez33kbu0"
})({
display: 'flex',

@@ -26,4 +25,7 @@ flexWrap: 'wrap',

});
var Item = (0, _reactEmotion2.default)('div')(function (_ref) {
var Item =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "ez33kbu1"
})(function (_ref) {
var theme = _ref.theme;

@@ -40,19 +42,13 @@ return {

var tags = _ref2.tags;
return _react.default.createElement(Wrapper, null, tags.map(function (tag) {
return _react.default.createElement(Item, {
key: tag
}, tag);
}));
}
return _react2.default.createElement(
Wrapper,
null,
tags.map(function (tag) {
return _react2.default.createElement(
Item,
{ key: tag },
tag
);
})
);
}
Tags.propTypes = {
tags: _propTypes2.default.arrayOf(_propTypes2.default.node).isRequired
tags: _propTypes.default.arrayOf(_propTypes.default.node).isRequired
};
exports.default = Tags;
var _default = Tags;
exports.default = _default;

@@ -1,42 +0,37 @@

'use strict';
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _createClass2 = require('babel-runtime/helpers/createClass');
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _createClass3 = _interopRequireDefault(_createClass2);
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _react = _interopRequireWildcard(require("react"));
var _inherits2 = require('babel-runtime/helpers/inherits');
var _propTypes = _interopRequireDefault(require("prop-types"));
var _inherits3 = _interopRequireDefault(_inherits2);
var _reactEmotion = _interopRequireDefault(require("react-emotion"));
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _reactEmotion = require('react-emotion');
var _reactEmotion2 = _interopRequireDefault(_reactEmotion);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Container = (0, _reactEmotion2.default)('div')({
var Container =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "ejaj2wl0"
})({
width: '100%',

@@ -46,4 +41,7 @@ position: 'relative',

});
var List = (0, _reactEmotion2.default)('div')(function (_ref) {
var List =
/*#__PURE__*/
(0, _reactEmotion.default)('div', {
target: "ejaj2wl1"
})(function (_ref) {
var theme = _ref.theme;

@@ -56,4 +54,7 @@ return {

});
var Item = (0, _reactEmotion2.default)('button')(function (_ref2) {
var Item =
/*#__PURE__*/
(0, _reactEmotion.default)('button', {
target: "ejaj2wl2"
})(function (_ref2) {
var active = _ref2.active;

@@ -79,6 +80,5 @@ return active ? {

flex: 1,
'&:focus': {
outline: '0 none',
borderBottom: '3px solid ' + theme.highlightColor
borderBottom: "3px solid ".concat(theme.highlightColor)
}

@@ -88,27 +88,32 @@ };

var Tabs = function (_Component) {
(0, _inherits3.default)(Tabs, _Component);
var Tabs =
/*#__PURE__*/
function (_Component) {
(0, _inherits2.default)(Tabs, _Component);
function Tabs() {
var _ref4;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
(0, _classCallCheck3.default)(this, Tabs);
(0, _classCallCheck2.default)(this, Tabs);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref4 = Tabs.__proto__ || (0, _getPrototypeOf2.default)(Tabs)).call.apply(_ref4, [this].concat(args))), _this), _this.state = {
_this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(Tabs)).call.apply(_getPrototypeOf2, [this].concat(args)));
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", {
active: 0
}, _this.onToggle = function (index) {
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "onToggle", function (index) {
_this.setState({
active: index
});
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
});
return _this;
}
(0, _createClass3.default)(Tabs, [{
key: 'render',
(0, _createClass2.default)(Tabs, [{
key: "render",
value: function render() {

@@ -119,31 +124,12 @@ var _this2 = this;

var active = this.state.active;
return _react2.default.createElement(
Container,
null,
_react2.default.createElement(
List,
null,
tabs.map(function (tab, index) {
return _react2.default.createElement(
Item
// eslint-disable-next-line react/no-array-index-key
,
{ key: index,
active: active === index ? true : undefined,
onClick: function onClick() {
return _this2.onToggle(index);
}
},
tab.label
);
})
),
_react2.default.createElement(
'div',
null,
tabs[active].panel
)
);
return _react.default.createElement(Container, null, _react.default.createElement(List, null, tabs.map(function (tab, index) {
return _react.default.createElement(Item // eslint-disable-next-line react/no-array-index-key
, {
key: index,
active: active === index ? true : undefined,
onClick: function onClick() {
return _this2.onToggle(index);
}
}, tab.label);
})), _react.default.createElement("div", null, tabs[active].panel));
}

@@ -155,8 +141,8 @@ }]);

Tabs.propTypes = {
tabs: _propTypes2.default.arrayOf(_propTypes2.default.shape({
label: _propTypes2.default.node,
panel: _propTypes2.default.node
tabs: _propTypes.default.arrayOf(_propTypes.default.shape({
label: _propTypes.default.node,
panel: _propTypes.default.node
})).isRequired
};
exports.default = Tabs;
var _default = Tabs;
exports.default = _default;

@@ -1,43 +0,41 @@

'use strict';
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.checkA11y = exports.configureA11y = undefined;
exports.checkA11y = exports.configureA11y = void 0;
var _global = require('global');
var _global = require("global");
var _axeCore = require('axe-core');
var _axeCore = _interopRequireDefault(require("axe-core"));
var _axeCore2 = _interopRequireDefault(_axeCore);
var _addons = _interopRequireDefault(require("@storybook/addons"));
var _addons = require('@storybook/addons');
var _coreEvents = _interopRequireDefault(require("@storybook/core-events"));
var _addons2 = _interopRequireDefault(_addons);
var _clientLogger = require("@storybook/client-logger");
var _coreEvents = require('@storybook/core-events');
var _shared = require("./shared");
var _coreEvents2 = _interopRequireDefault(_coreEvents);
var _clientLogger = require('@storybook/client-logger');
var _shared = require('./shared');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var axeOptions = {};
var configureA11y = exports.configureA11y = function configureA11y() {
var configureA11y = function configureA11y() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
axeOptions = options;
};
exports.configureA11y = configureA11y;
var runA11yCheck = function runA11yCheck() {
var channel = _addons2.default.getChannel();
var channel = _addons.default.getChannel();
var wrapper = _global.document.getElementById('root');
_axeCore2.default.reset();
_axeCore2.default.configure(axeOptions);
_axeCore2.default.run(wrapper).then(function (results) {
_axeCore.default.reset();
_axeCore.default.configure(axeOptions);
_axeCore.default.run(wrapper).then(function (results) {
return channel.emit(_shared.CHECK_EVENT_ID, results);

@@ -48,5 +46,5 @@ }, _clientLogger.logger.error);

var a11ySubscription = function a11ySubscription() {
var channel = _addons2.default.getChannel();
var channel = _addons.default.getChannel();
channel.on(_shared.REQUEST_CHECK_EVENT_ID, runA11yCheck);
return function () {

@@ -57,5 +55,8 @@ channel.removeListener(_shared.REQUEST_CHECK_EVENT_ID, runA11yCheck);

var checkA11y = exports.checkA11y = function checkA11y(story) {
_addons2.default.getChannel().emit(_coreEvents2.default.REGISTER_SUBSCRIPTION, a11ySubscription);
var checkA11y = function checkA11y(story) {
_addons.default.getChannel().emit(_coreEvents.default.REGISTER_SUBSCRIPTION, a11ySubscription);
return story();
};
};
exports.checkA11y = checkA11y;

@@ -1,28 +0,23 @@

'use strict';
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.init = undefined;
exports.init = init;
var _react = require('react');
var _react = _interopRequireDefault(require("react"));
var _react2 = _interopRequireDefault(_react);
var _addons = _interopRequireDefault(require("@storybook/addons"));
var _addons = require('@storybook/addons');
var _Panel = _interopRequireDefault(require("./components/Panel"));
var _addons2 = _interopRequireDefault(_addons);
var _shared = require("./shared");
var _Panel = require('./components/Panel');
function init() {
_addons.default.register(_shared.ADDON_ID, function (api) {
var channel = _addons.default.getChannel();
var _Panel2 = _interopRequireDefault(_Panel);
var _shared = require('./shared');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function init() {
_addons2.default.register(_shared.ADDON_ID, function (api) {
var channel = _addons2.default.getChannel();
_addons2.default.addPanel(_shared.PANEL_ID, {
_addons.default.addPanel(_shared.PANEL_ID, {
title: 'Accessibility',

@@ -32,8 +27,10 @@ // eslint-disable-next-line react/prop-types

var active = _ref.active;
return _react2.default.createElement(_Panel2.default, { channel: channel, api: api, active: active });
return _react.default.createElement(_Panel.default, {
channel: channel,
api: api,
active: active
});
}
});
});
}
exports.init = init;
}

@@ -1,2 +0,2 @@

'use strict';
"use strict";

@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", {

});
exports.REQUEST_CHECK_EVENT_ID = exports.RERUN_EVENT_ID = exports.CHECK_EVENT_ID = exports.PANEL_ID = exports.ADDON_ID = void 0;
// addons, panels and events get unique names using a prefix
var ADDON_ID = '@storybook/addon-a11y';
var PANEL_ID = ADDON_ID + '/panel';
var CHECK_EVENT_ID = ADDON_ID + '/check';
var RERUN_EVENT_ID = ADDON_ID + '/rerun';
var REQUEST_CHECK_EVENT_ID = ADDON_ID + '/request-check';
exports.ADDON_ID = ADDON_ID;
var PANEL_ID = "".concat(ADDON_ID, "/panel");
exports.PANEL_ID = PANEL_ID;
var CHECK_EVENT_ID = "".concat(ADDON_ID, "/check");
exports.CHECK_EVENT_ID = CHECK_EVENT_ID;
var RERUN_EVENT_ID = "".concat(ADDON_ID, "/rerun");
exports.RERUN_EVENT_ID = RERUN_EVENT_ID;
var REQUEST_CHECK_EVENT_ID = "".concat(ADDON_ID, "/request-check");
exports.REQUEST_CHECK_EVENT_ID = REQUEST_CHECK_EVENT_ID;
{
"name": "@storybook/addon-a11y",
"version": "4.0.0-alpha.16",
"version": "4.0.0-alpha.17",
"description": "a11y addon for storybook",

@@ -28,8 +28,7 @@ "keywords": [

"dependencies": {
"@storybook/addons": "4.0.0-alpha.16",
"@storybook/client-logger": "4.0.0-alpha.16",
"@storybook/components": "4.0.0-alpha.16",
"@storybook/core-events": "4.0.0-alpha.16",
"@storybook/addons": "4.0.0-alpha.17",
"@storybook/client-logger": "4.0.0-alpha.17",
"@storybook/components": "4.0.0-alpha.17",
"@storybook/core-events": "4.0.0-alpha.17",
"axe-core": "^3.0.3",
"babel-runtime": "^6.26.0",
"global": "^4.3.2",

@@ -36,0 +35,0 @@ "prop-types": "^15.6.2",

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc