Socket
Socket
Sign inDemoInstall

@khanacademy/wonder-blocks-icon-button

Package Overview
Dependencies
Maintainers
1
Versions
383
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@khanacademy/wonder-blocks-icon-button - npm Package Compare versions

Comparing version 3.0.2 to 3.0.3

231

dist/es/index.js

@@ -9,2 +9,24 @@ import React from 'react';

function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
function _defineProperty(obj, key, value) {

@@ -62,2 +84,33 @@ if (key in obj) {

function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
if (superClass) _setPrototypeOf(subClass, superClass);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
function _objectWithoutPropertiesLoose(source, excluded) {

@@ -99,8 +152,37 @@ if (source == null) return {};

const StyledAnchor = addStyle("a");
const StyledButton = addStyle("button");
const StyledLink = addStyle(Link);
class IconButtonCore extends React.Component {
render() {
const _this$props = this.props,
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (typeof call === "object" || typeof call === "function")) {
return call;
}
return _assertThisInitialized(self);
}
var StyledAnchor = addStyle("a");
var StyledButton = addStyle("button");
var StyledLink = addStyle(Link);
var IconButtonCore =
/*#__PURE__*/
function (_React$Component) {
_inherits(IconButtonCore, _React$Component);
function IconButtonCore() {
_classCallCheck(this, IconButtonCore);
return _possibleConstructorReturn(this, _getPrototypeOf(IconButtonCore).apply(this, arguments));
}
_createClass(IconButtonCore, [{
key: "render",
value: function render() {
var _this$props = this.props,
skipClientNav = _this$props.skipClientNav,

@@ -121,42 +203,44 @@ ariaLabel = _this$props["aria-label"],

const router = this.context.router;
const buttonColor = color === "destructive" ? SemanticColor.controlDestructive : SemanticColor.controlDefault;
var router = this.context.router;
var buttonColor = color === "destructive" ? SemanticColor.controlDestructive : SemanticColor.controlDefault;
const buttonStyles = _generateStyles(buttonColor, kind, light);
var buttonStyles = _generateStyles(buttonColor, kind, light);
const defaultStyle = [sharedStyles.shared, disabled && sharedStyles.disabled, buttonStyles.default, disabled && buttonStyles.disabled, !disabled && (pressed ? buttonStyles.active : (hovered || focused) && buttonStyles.focus)];
const child = React.createElement(Icon, {
size: "medium",
color: "currentColor",
icon: icon
});
var defaultStyle = [sharedStyles.shared, disabled && sharedStyles.disabled, buttonStyles.default, disabled && buttonStyles.disabled, !disabled && (pressed ? buttonStyles.active : (hovered || focused) && buttonStyles.focus)];
var child = React.createElement(Icon, {
size: "medium",
color: "currentColor",
icon: icon
});
const commonProps = _objectSpread({
// TODO(kevinb): figure out a better way of forward ARIA props
"aria-disabled": disabled ? "true" : undefined,
"aria-label": ariaLabel,
"data-test-id": testId,
style: defaultStyle
}, handlers);
var commonProps = _objectSpread({
// TODO(kevinb): figure out a better way of forward ARIA props
"aria-disabled": disabled ? "true" : undefined,
"aria-label": ariaLabel,
"data-test-id": testId,
style: defaultStyle
}, handlers);
if (href) {
return router && !skipClientNav ? React.createElement(View, {
style: style
}, React.createElement(StyledLink, _extends({}, commonProps, {
to: href
}), child)) : React.createElement(View, null, React.createElement(StyledAnchor, _extends({}, commonProps, {
href: href
}), child));
} else {
return React.createElement(View, {
style: style
}, React.createElement(StyledButton, _extends({
type: "button"
}, commonProps, {
disabled: disabled
}), child));
if (href) {
return router && !skipClientNav ? React.createElement(View, {
style: style
}, React.createElement(StyledLink, _extends({}, commonProps, {
to: href
}), child)) : React.createElement(View, null, React.createElement(StyledAnchor, _extends({}, commonProps, {
href: href
}), child));
} else {
return React.createElement(View, {
style: style
}, React.createElement(StyledButton, _extends({
type: "button"
}, commonProps, {
disabled: disabled
}), child));
}
}
}
}]);
}
return IconButtonCore;
}(React.Component);

@@ -166,4 +250,3 @@ _defineProperty(IconButtonCore, "contextTypes", {

});
const sharedStyles = StyleSheet.create({
var sharedStyles = StyleSheet.create({
shared: {

@@ -192,6 +275,6 @@ position: "relative",

});
const styles = {};
var styles = {};
const _generateStyles = (color, kind, light) => {
const buttonType = color + kind + light.toString();
var _generateStyles = function _generateStyles(color, kind, light) {
var buttonType = color + kind + light.toString();

@@ -206,7 +289,7 @@ if (styles[buttonType]) {

const white = Color.white,
offBlack32 = Color.offBlack32,
offBlack64 = Color.offBlack64,
offBlack = Color.offBlack;
const newStyles = {
var white = Color.white,
offBlack32 = Color.offBlack32,
offBlack64 = Color.offBlack64,
offBlack = Color.offBlack;
var newStyles = {
default: {},

@@ -289,5 +372,17 @@ focus: {

*/
class IconButton extends React.Component {
render() {
const _this$props = this.props,
var IconButton =
/*#__PURE__*/
function (_React$Component) {
_inherits(IconButton, _React$Component);
function IconButton() {
_classCallCheck(this, IconButton);
return _possibleConstructorReturn(this, _getPrototypeOf(IconButton).apply(this, arguments));
}
_createClass(IconButton, [{
key: "render",
value: function render() {
var _this$props = this.props,
onClick = _this$props.onClick,

@@ -298,17 +393,19 @@ href = _this$props.href,

const ClickableBehavior = getClickableBehavior(href, skipClientNav, this.context.router);
return React.createElement(ClickableBehavior, {
disabled: sharedProps.disabled,
href: href,
onClick: onClick,
role: "button"
}, (state, handlers) => {
return React.createElement(IconButtonCore, _extends({}, sharedProps, state, handlers, {
skipClientNav: skipClientNav,
href: href
}));
});
}
var ClickableBehavior = getClickableBehavior(href, skipClientNav, this.context.router);
return React.createElement(ClickableBehavior, {
disabled: sharedProps.disabled,
href: href,
onClick: onClick,
role: "button"
}, function (state, handlers) {
return React.createElement(IconButtonCore, _extends({}, sharedProps, state, handlers, {
skipClientNav: skipClientNav,
href: href
}));
});
}
}]);
}
return IconButton;
}(React.Component);

@@ -315,0 +412,0 @@ _defineProperty(IconButton, "defaultProps", {

@@ -163,2 +163,4 @@ module.exports =

// CONCATENATED MODULE: ./packages/wonder-blocks-icon-button/components/icon-button-core.js
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

@@ -172,2 +174,18 @@

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

@@ -182,8 +200,21 @@

const StyledAnchor = Object(wonder_blocks_core_["addStyle"])("a");
const StyledButton = Object(wonder_blocks_core_["addStyle"])("button");
const StyledLink = Object(wonder_blocks_core_["addStyle"])(external_react_router_dom_["Link"]);
class icon_button_core_IconButtonCore extends external_react_default.a.Component {
render() {
const _this$props = this.props,
var StyledAnchor = Object(wonder_blocks_core_["addStyle"])("a");
var StyledButton = Object(wonder_blocks_core_["addStyle"])("button");
var StyledLink = Object(wonder_blocks_core_["addStyle"])(external_react_router_dom_["Link"]);
var icon_button_core_IconButtonCore =
/*#__PURE__*/
function (_React$Component) {
_inherits(IconButtonCore, _React$Component);
function IconButtonCore() {
_classCallCheck(this, IconButtonCore);
return _possibleConstructorReturn(this, _getPrototypeOf(IconButtonCore).apply(this, arguments));
}
_createClass(IconButtonCore, [{
key: "render",
value: function render() {
var _this$props = this.props,
skipClientNav = _this$props.skipClientNav,

@@ -204,42 +235,44 @@ ariaLabel = _this$props["aria-label"],

const router = this.context.router;
const buttonColor = color === "destructive" ? wonder_blocks_color_["SemanticColor"].controlDestructive : wonder_blocks_color_["SemanticColor"].controlDefault;
var router = this.context.router;
var buttonColor = color === "destructive" ? wonder_blocks_color_["SemanticColor"].controlDestructive : wonder_blocks_color_["SemanticColor"].controlDefault;
const buttonStyles = _generateStyles(buttonColor, kind, light);
var buttonStyles = icon_button_core_generateStyles(buttonColor, kind, light);
const defaultStyle = [sharedStyles.shared, disabled && sharedStyles.disabled, buttonStyles.default, disabled && buttonStyles.disabled, !disabled && (pressed ? buttonStyles.active : (hovered || focused) && buttonStyles.focus)];
const child = external_react_default.a.createElement(wonder_blocks_icon_default.a, {
size: "medium",
color: "currentColor",
icon: icon
});
var defaultStyle = [sharedStyles.shared, disabled && sharedStyles.disabled, buttonStyles.default, disabled && buttonStyles.disabled, !disabled && (pressed ? buttonStyles.active : (hovered || focused) && buttonStyles.focus)];
var child = external_react_default.a.createElement(wonder_blocks_icon_default.a, {
size: "medium",
color: "currentColor",
icon: icon
});
const commonProps = _objectSpread({
// TODO(kevinb): figure out a better way of forward ARIA props
"aria-disabled": disabled ? "true" : undefined,
"aria-label": ariaLabel,
"data-test-id": testId,
style: defaultStyle
}, handlers);
var commonProps = _objectSpread({
// TODO(kevinb): figure out a better way of forward ARIA props
"aria-disabled": disabled ? "true" : undefined,
"aria-label": ariaLabel,
"data-test-id": testId,
style: defaultStyle
}, handlers);
if (href) {
return router && !skipClientNav ? external_react_default.a.createElement(wonder_blocks_core_["View"], {
style: style
}, external_react_default.a.createElement(StyledLink, _extends({}, commonProps, {
to: href
}), child)) : external_react_default.a.createElement(wonder_blocks_core_["View"], null, external_react_default.a.createElement(StyledAnchor, _extends({}, commonProps, {
href: href
}), child));
} else {
return external_react_default.a.createElement(wonder_blocks_core_["View"], {
style: style
}, external_react_default.a.createElement(StyledButton, _extends({
type: "button"
}, commonProps, {
disabled: disabled
}), child));
if (href) {
return router && !skipClientNav ? external_react_default.a.createElement(wonder_blocks_core_["View"], {
style: style
}, external_react_default.a.createElement(StyledLink, _extends({}, commonProps, {
to: href
}), child)) : external_react_default.a.createElement(wonder_blocks_core_["View"], null, external_react_default.a.createElement(StyledAnchor, _extends({}, commonProps, {
href: href
}), child));
} else {
return external_react_default.a.createElement(wonder_blocks_core_["View"], {
style: style
}, external_react_default.a.createElement(StyledButton, _extends({
type: "button"
}, commonProps, {
disabled: disabled
}), child));
}
}
}
}]);
}
return IconButtonCore;
}(external_react_default.a.Component);

@@ -250,3 +283,4 @@ _defineProperty(icon_button_core_IconButtonCore, "contextTypes", {

const sharedStyles = external_aphrodite_["StyleSheet"].create({
var sharedStyles = external_aphrodite_["StyleSheet"].create({
shared: {

@@ -275,6 +309,6 @@ position: "relative",

});
const styles = {};
var styles = {};
const _generateStyles = (color, kind, light) => {
const buttonType = color + kind + light.toString();
var icon_button_core_generateStyles = function _generateStyles(color, kind, light) {
var buttonType = color + kind + light.toString();

@@ -289,7 +323,7 @@ if (styles[buttonType]) {

const white = wonder_blocks_color_default.a.white,
offBlack32 = wonder_blocks_color_default.a.offBlack32,
offBlack64 = wonder_blocks_color_default.a.offBlack64,
offBlack = wonder_blocks_color_default.a.offBlack;
const newStyles = {
var white = wonder_blocks_color_default.a.white,
offBlack32 = wonder_blocks_color_default.a.offBlack32,
offBlack64 = wonder_blocks_color_default.a.offBlack64,
offBlack = wonder_blocks_color_default.a.offBlack;
var newStyles = {
default: {},

@@ -336,2 +370,4 @@ focus: {

// CONCATENATED MODULE: ./packages/wonder-blocks-icon-button/components/icon-button.js
function icon_button_typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { icon_button_typeof = function _typeof(obj) { return typeof obj; }; } else { icon_button_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return icon_button_typeof(obj); }
function icon_button_extends() { icon_button_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return icon_button_extends.apply(this, arguments); }

@@ -343,2 +379,18 @@

function icon_button_classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function icon_button_defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function icon_button_createClass(Constructor, protoProps, staticProps) { if (protoProps) icon_button_defineProperties(Constructor.prototype, protoProps); if (staticProps) icon_button_defineProperties(Constructor, staticProps); return Constructor; }
function icon_button_possibleConstructorReturn(self, call) { if (call && (icon_button_typeof(call) === "object" || typeof call === "function")) { return call; } return icon_button_assertThisInitialized(self); }
function icon_button_assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function icon_button_getPrototypeOf(o) { icon_button_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return icon_button_getPrototypeOf(o); }
function icon_button_inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) icon_button_setPrototypeOf(subClass, superClass); }
function icon_button_setPrototypeOf(o, p) { icon_button_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return icon_button_setPrototypeOf(o, p); }
function icon_button_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

@@ -387,5 +439,17 @@

*/
class icon_button_IconButton extends external_react_default.a.Component {
render() {
const _this$props = this.props,
var icon_button_IconButton =
/*#__PURE__*/
function (_React$Component) {
icon_button_inherits(IconButton, _React$Component);
function IconButton() {
icon_button_classCallCheck(this, IconButton);
return icon_button_possibleConstructorReturn(this, icon_button_getPrototypeOf(IconButton).apply(this, arguments));
}
icon_button_createClass(IconButton, [{
key: "render",
value: function render() {
var _this$props = this.props,
onClick = _this$props.onClick,

@@ -396,17 +460,19 @@ href = _this$props.href,

const ClickableBehavior = Object(wonder_blocks_core_["getClickableBehavior"])(href, skipClientNav, this.context.router);
return external_react_default.a.createElement(ClickableBehavior, {
disabled: sharedProps.disabled,
href: href,
onClick: onClick,
role: "button"
}, (state, handlers) => {
return external_react_default.a.createElement(icon_button_core_IconButtonCore, icon_button_extends({}, sharedProps, state, handlers, {
skipClientNav: skipClientNav,
href: href
}));
});
}
var ClickableBehavior = Object(wonder_blocks_core_["getClickableBehavior"])(href, skipClientNav, this.context.router);
return external_react_default.a.createElement(ClickableBehavior, {
disabled: sharedProps.disabled,
href: href,
onClick: onClick,
role: "button"
}, function (state, handlers) {
return external_react_default.a.createElement(icon_button_core_IconButtonCore, icon_button_extends({}, sharedProps, state, handlers, {
skipClientNav: skipClientNav,
href: href
}));
});
}
}]);
}
return IconButton;
}(external_react_default.a.Component);

@@ -423,2 +489,4 @@ icon_button_defineProperty(icon_button_IconButton, "defaultProps", {

});
// CONCATENATED MODULE: ./packages/wonder-blocks-icon-button/index.js

@@ -425,0 +493,0 @@ /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "default", function() { return icon_button_IconButton; });

{
"name": "@khanacademy/wonder-blocks-icon-button",
"version": "3.0.2",
"version": "3.0.3",
"design": "v1",

@@ -18,5 +18,5 @@ "publishConfig": {

"dependencies": {
"@khanacademy/wonder-blocks-color": "^1.0.12",
"@khanacademy/wonder-blocks-core": "^1.2.5",
"@khanacademy/wonder-blocks-icon": "^1.0.9"
"@khanacademy/wonder-blocks-color": "^1.0.13",
"@khanacademy/wonder-blocks-core": "^1.2.6",
"@khanacademy/wonder-blocks-icon": "^1.0.10"
},

@@ -28,3 +28,6 @@ "peerDependencies": {

"react-router-dom": "^4.2.2"
},
"devDependencies": {
"wb-dev-build-settings": "^0.0.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