New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

@jouwomgeving/ui-button

Package Overview
Dependencies
Maintainers
4
Versions
167
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@jouwomgeving/ui-button - npm Package Compare versions

Comparing version 0.0.2-alpha.5ffe785b to 0.0.2-alpha.65a9fb6d

es/Action/index.js

105

dist/bundle.js

@@ -87,3 +87,3 @@ (function webpackUniversalModuleDefinition(root, factory) {

throw new Error("Module build failed: Error: \"extract-text-webpack-plugin\" loader is used without the corresponding plugin, refer to https://github.com/webpack/extract-text-webpack-plugin for the usage example\n at Object.module.exports.pitch (/Users/jvanleeuwen/Projects/dictator/node_modules/extract-text-webpack-plugin/loader.js:26:9)");
throw new Error("Module build failed: Error: \"extract-text-webpack-plugin\" loader is used without the corresponding plugin, refer to https://github.com/webpack/extract-text-webpack-plugin for the usage example\n at Object.module.exports.pitch (/Users/jvanleeuwen/Projects/dictator/node_modules/extract-text-webpack-plugin/loader.js:27:9)");

@@ -201,7 +201,7 @@ /***/ },

var Button = function Button(_ref) {
var type = _ref.type;
var children = _ref.children;
var disabled = _ref.disabled;
var onClick = _ref.onClick;
var submit = _ref.submit;
var type = _ref.type,
children = _ref.children,
disabled = _ref.disabled,
onClick = _ref.onClick,
submit = _ref.submit;
return _react2.default.createElement(

@@ -220,3 +220,3 @@ 'button',

Button.propTypes = {
type: _react.PropTypes.oneOf(['primary', 'secondary', 'success', 'error']).isRequired,
type: _react.PropTypes.oneOf(['primary', 'secondary', 'approve', 'decline']).isRequired,
children: _react.PropTypes.any,

@@ -313,4 +313,4 @@ label: _react.PropTypes.string,

function Group(_ref) {
var children = _ref.children;
var direction = _ref.direction;
var children = _ref.children,
direction = _ref.direction;

@@ -349,76 +349,47 @@ return _react2.default.createElement(

"use strict";
'use strict';
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react__ = __webpack_require__(0);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_react__);
/* eslint-disable */
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = __webpack_require__(0);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* eslint-disable */
var styles = {
'Icon': 'styles__Icon___1AoIC',
'FontAwesome': 'styles__FontAwesome___2qE0j styles__Icon___1AoIC',
'EmojiOne': 'styles__EmojiOne___1O8Uz styles__Icon___1AoIC',
'SmashIcon': 'styles__SmashIcon___2EIyE styles__Icon___1AoIC',
'Label': 'styles__Label___1x7t5',
'left': 'styles__left___1Hxlz',
'Label-content': 'styles__Label-content___3zclq',
'right': 'styles__right___2Jy5H',
'center': 'styles__center___Sc0qq',
'bottom': 'styles__bottom___bQQRE',
'top': 'styles__top___1gFk9',
'Label-icon': 'styles__Label-icon___3viAW'
const styles = {
'Icon': 'Icon___8b8faa44bfd1e9c34fb3e79dbbc96264',
'FontAwesome': 'FontAwesome___801f65c0d5abff4c0804a822db04a09a Icon___8b8faa44bfd1e9c34fb3e79dbbc96264',
'JOIcon': 'JOIcon___4895433daf52965e8045c458a605a4ef Icon___8b8faa44bfd1e9c34fb3e79dbbc96264',
'EmojiOne': 'EmojiOne___e7f2c8d7751346ef09b18098ea882372 Icon___8b8faa44bfd1e9c34fb3e79dbbc96264',
'SmashIcon': 'SmashIcon___e5d20307fffe6ccf13feedfc002ab2a8 Icon___8b8faa44bfd1e9c34fb3e79dbbc96264',
'Label': 'Label___84e83318da2eecf957b7ba0d4fd11d61',
'left': 'left___93e9eac96d3ba5930def1fd3c358856b',
'Label-content': 'Label-content___3fa83d95100a99b71ac9a7e7935631e3',
'right': 'right___63e4d5620a5c5fe6af9aea64e75a88ad',
'center': 'center___a9796ca931d45d43862ee4c59a063036',
'bottom': 'bottom___17b3b2cce444b4df7d46b785684dd30b',
'top': 'top___5c2094aed29f3777662657b26942a550',
'Label-icon': 'Label-icon___beafeb39f870981a3c6e72f5b54e4adf'
};
var FaClose = function (_Component) {
_inherits(FaClose, _Component);
function FaClose() {
_classCallCheck(this, FaClose);
return _possibleConstructorReturn(this, _Component.apply(this, arguments));
}
FaClose.prototype.render = function render() {
var _props = this.props;
var size = _props.size;
var color = _props.color;
return _react2.default.createElement('div', {
class FaClose extends __WEBPACK_IMPORTED_MODULE_0_react__["Component"] {
render() {
const { size, color } = this.props;
return __WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement('div', {
style: {
width: size,
height: size,
color: color
color
},
className: styles.FontAwesome
}, _react2.default.createElement('svg', {
}, __WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement('svg', {
width: '11',
height: '14',
viewBox: '0 0 11 14'
}, _react2.default.createElement('path', {
}, __WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement('path', {
fill: '#000666',
d: 'M10.141 10.328q0 .312-.219.531L8.86 11.921q-.219.219-.531.219t-.531-.219L5.501 9.624l-2.297 2.297q-.219.219-.531.219t-.531-.219L1.08 10.859q-.219-.219-.219-.531t.219-.531L3.377 7.5 1.08 5.203q-.219-.219-.219-.531t.219-.531l1.062-1.062q.219-.219.531-.219t.531.219l2.297 2.297 2.297-2.297q.219-.219.531-.219t.531.219l1.062 1.062q.219.219.219.531t-.219.531L7.625 7.5l2.297 2.297q.219.219.219.531z'
}, null)));
};
return FaClose;
}(_react.Component);
}
}
FaClose.propTypes = {
size: _react.PropTypes.oneOf(['9px', '12px', '14px', '16px', '18px', '24px']),
color: _react.PropTypes.string
size: __WEBPACK_IMPORTED_MODULE_0_react__["PropTypes"].oneOf(['9px', '12px', '14px', '16px', '18px', '24px']),
color: __WEBPACK_IMPORTED_MODULE_0_react__["PropTypes"].string
};
FaClose.defaultProps = { size: '16px' };
exports.default = FaClose;
/* harmony default export */ exports["default"] = FaClose;

@@ -425,0 +396,0 @@ /***/ },

import React, { PropTypes } from 'react';
import classnames from 'classnames/bind';
import styled from 'styled-components';
const styles = {
'Button': 'styles__Button___25D3l',
'Button-content': 'styles__Button-content___asVnw',
'disabled': 'styles__disabled___3PoLx',
'Button-prefix': 'styles__Button-prefix___2euxs',
'Button-suffix': 'styles__Button-suffix___2gXk2',
'primary': 'styles__primary___2056t',
'secondary': 'styles__secondary___2Z3NI',
'Group': 'styles__Group___3t-Hw',
'Group-item': 'styles__Group-item___xJZUV',
'horizontal': 'styles__horizontal___1pcjx',
'vertical': 'styles__vertical___3Brjx',
'Close': 'styles__Close___3VI-x'
import { button, typography } from '@jouwomgeving/util-vars';
const background = ({ buttonType, state }) => button.button[buttonType][state].gradient;
const borderColor = ({ buttonType, state }) => button.button[buttonType][state].border;
const color = ({ buttonType, state }) => button.button[buttonType][state].color;
const activeBackground = ({ buttonType }) => button.button[buttonType].active.gradient;
const activeBorderColor = ({ buttonType }) => button.button[buttonType].active.border;
const activeColor = ({ buttonType }) => button.button[buttonType].active.color;
const padding = ({ size }) => {
if (size === 'medium') return '0 0.5rem';
if (size === 'large') return '0 0.625rem';
};
const cx = classnames.bind(styles);
const height = ({ size }) => {
if (size === 'medium') return '2.1875rem';
if (size === 'large') return '3.125rem';
};
const Button = ({ type, children, disabled, onClick, submit }) => React.createElement(
'button',
const StyledButton = styled.button`
display: inline-flex;
flex-direction: row;
align-items: center;
font-weight: 600;
background: ${background};
border-color: ${borderColor};
font-size: ${typography.size.normal};
cursor: pointer;
padding: ${padding};
height: ${height};
border-radius: 0.1875rem;
white-space: nowrap;
min-height: 2.1875rem;
box-sizing: border-box;
border-width: 0.0625rem;
border-style: solid;
box-shadow: 0 0.0625rem 0.0625rem rgba(198, 195, 150, 0.25);
color: ${color};
&:active {
background: ${activeBackground};
border-color: ${activeBorderColor};
color: ${activeColor};
}
&:hover {
box-shadow: none;
}
&.disabled {
cursor: not-allowed;
}
`;
const Button = ({ state, children, disabled, onClick, size, submit, type }) => React.createElement(
StyledButton,
{
type: submit ? 'submit' : 'button',
buttonType: type,
className: `Button ${size} ${{ disabled }}`,
disabled: disabled,
onClick: onClick,
disabled: disabled,
className: cx('Button', type, { disabled })
size: size,
state: state,
type: submit ? 'submit' : 'button'
},

@@ -33,16 +78,21 @@ children

Button.propTypes = {
type: PropTypes.oneOf(['primary', 'secondary', 'success', 'error']).isRequired,
children: PropTypes.any,
disabled: PropTypes.bool,
label: PropTypes.string,
disabled: PropTypes.bool,
onClick: PropTypes.func,
submit: PropTypes.bool
size: PropTypes.oneOf('medium', 'large'),
state: PropTypes.oneOf(['default', 'active']),
submit: PropTypes.bool,
type: PropTypes.oneOf(['primary', 'secondary', 'approve', 'decline']).isRequired
};
Button.defaultProps = {
type: 'primary',
active: false,
disabled: false,
submit: false
size: 'medium',
state: 'default',
submit: false,
type: 'primary'
};
export default Button;
import React, { PropTypes } from 'react';
import classnames from 'classnames/bind';
import FaClose from '@jouwomgeving/ui-icon/es/FontAwesome/FaClose';
import FaClose from '@jouwomgeving/ui-icon/FontAwesome/FaClose';
const styles = {
'Button': 'styles__Button___25D3l',
'Button-content': 'styles__Button-content___asVnw',
'disabled': 'styles__disabled___3PoLx',
'Button-prefix': 'styles__Button-prefix___2euxs',
'Button-suffix': 'styles__Button-suffix___2gXk2',
'primary': 'styles__primary___2056t',
'secondary': 'styles__secondary___2Z3NI',
'Group': 'styles__Group___3t-Hw',
'Group-item': 'styles__Group-item___xJZUV',
'horizontal': 'styles__horizontal___1pcjx',
'vertical': 'styles__vertical___3Brjx',
'Close': 'styles__Close___3VI-x'
};
const styles = {};

@@ -21,0 +8,0 @@ const cx = classnames.bind(styles);

@@ -5,16 +5,3 @@ import React, { PropTypes } from 'react';

const styles = {
'Button': 'styles__Button___25D3l',
'Button-content': 'styles__Button-content___asVnw',
'disabled': 'styles__disabled___3PoLx',
'Button-prefix': 'styles__Button-prefix___2euxs',
'Button-suffix': 'styles__Button-suffix___2gXk2',
'primary': 'styles__primary___2056t',
'secondary': 'styles__secondary___2Z3NI',
'Group': 'styles__Group___3t-Hw',
'Group-item': 'styles__Group-item___xJZUV',
'horizontal': 'styles__horizontal___1pcjx',
'vertical': 'styles__vertical___3Brjx',
'Close': 'styles__Close___3VI-x'
};
const styles = {};

@@ -21,0 +8,0 @@ const cx = classnames.bind(styles);

@@ -7,2 +7,4 @@ 'use strict';

var _templateObject = _taggedTemplateLiteral(['\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n font-weight: 600;\n background: ', ';\n border-color: ', ';\n font-size: ', ';\n cursor: pointer;\n padding: ', ';\n height: ', ';\n border-radius: 0.1875rem;\n white-space: nowrap;\n min-height: 2.1875rem;\n box-sizing: border-box;\n border-width: 0.0625rem;\n border-style: solid;\n box-shadow: 0 0.0625rem 0.0625rem rgba(198, 195, 150, 0.25);\n color: ', ';\n\n &:active {\n background: ', ';\n border-color: ', ';\n color: ', ';\n }\n\n &:hover {\n box-shadow: none;\n }\n\n &.disabled {\n cursor: not-allowed;\n }\n'], ['\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n font-weight: 600;\n background: ', ';\n border-color: ', ';\n font-size: ', ';\n cursor: pointer;\n padding: ', ';\n height: ', ';\n border-radius: 0.1875rem;\n white-space: nowrap;\n min-height: 2.1875rem;\n box-sizing: border-box;\n border-width: 0.0625rem;\n border-style: solid;\n box-shadow: 0 0.0625rem 0.0625rem rgba(198, 195, 150, 0.25);\n color: ', ';\n\n &:active {\n background: ', ';\n border-color: ', ';\n color: ', ';\n }\n\n &:hover {\n box-shadow: none;\n }\n\n &.disabled {\n cursor: not-allowed;\n }\n']);
var _react = require('react');

@@ -12,38 +14,79 @@

var _bind = require('classnames/bind');
var _styledComponents = require('styled-components');
var _bind2 = _interopRequireDefault(_bind);
var _styledComponents2 = _interopRequireDefault(_styledComponents);
var _utilVars = require('@jouwomgeving/util-vars');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var styles = {
'Button': 'styles__Button___25D3l',
'Button-content': 'styles__Button-content___asVnw',
'disabled': 'styles__disabled___3PoLx',
'Button-prefix': 'styles__Button-prefix___2euxs',
'Button-suffix': 'styles__Button-suffix___2gXk2',
'primary': 'styles__primary___2056t',
'secondary': 'styles__secondary___2Z3NI',
'Group': 'styles__Group___3t-Hw',
'Group-item': 'styles__Group-item___xJZUV',
'horizontal': 'styles__horizontal___1pcjx',
'vertical': 'styles__vertical___3Brjx',
'Close': 'styles__Close___3VI-x'
function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
var background = function background(_ref) {
var buttonType = _ref.buttonType,
state = _ref.state;
return _utilVars.button.button[buttonType][state].gradient;
};
var cx = _bind2.default.bind(styles);
var borderColor = function borderColor(_ref2) {
var buttonType = _ref2.buttonType,
state = _ref2.state;
return _utilVars.button.button[buttonType][state].border;
};
var Button = function Button(_ref) {
var type = _ref.type;
var children = _ref.children;
var disabled = _ref.disabled;
var onClick = _ref.onClick;
var submit = _ref.submit;
var color = function color(_ref3) {
var buttonType = _ref3.buttonType,
state = _ref3.state;
return _utilVars.button.button[buttonType][state].color;
};
var activeBackground = function activeBackground(_ref4) {
var buttonType = _ref4.buttonType;
return _utilVars.button.button[buttonType].active.gradient;
};
var activeBorderColor = function activeBorderColor(_ref5) {
var buttonType = _ref5.buttonType;
return _utilVars.button.button[buttonType].active.border;
};
var activeColor = function activeColor(_ref6) {
var buttonType = _ref6.buttonType;
return _utilVars.button.button[buttonType].active.color;
};
var padding = function padding(_ref7) {
var size = _ref7.size;
if (size === 'medium') return '0 0.5rem';
if (size === 'large') return '0 0.625rem';
};
var height = function height(_ref8) {
var size = _ref8.size;
if (size === 'medium') return '2.1875rem';
if (size === 'large') return '3.125rem';
};
var StyledButton = _styledComponents2.default.button(_templateObject, background, borderColor, _utilVars.typography.size.normal, padding, height, color, activeBackground, activeBorderColor, activeColor);
var Button = function Button(_ref9) {
var state = _ref9.state,
children = _ref9.children,
disabled = _ref9.disabled,
onClick = _ref9.onClick,
size = _ref9.size,
submit = _ref9.submit,
type = _ref9.type;
return _react2.default.createElement(
'button',
StyledButton,
{
type: submit ? 'submit' : 'button',
buttonType: type,
className: 'Button ' + size + ' ' + { disabled: disabled },
disabled: disabled,
onClick: onClick,
disabled: disabled,
className: cx('Button', type, { disabled: disabled })
size: size,
state: state,
type: submit ? 'submit' : 'button'
},

@@ -55,16 +98,21 @@ children

Button.propTypes = {
type: _react.PropTypes.oneOf(['primary', 'secondary', 'success', 'error']).isRequired,
children: _react.PropTypes.any,
disabled: _react.PropTypes.bool,
label: _react.PropTypes.string,
disabled: _react.PropTypes.bool,
onClick: _react.PropTypes.func,
submit: _react.PropTypes.bool
size: _react.PropTypes.oneOf('medium', 'large'),
state: _react.PropTypes.oneOf(['default', 'active']),
submit: _react.PropTypes.bool,
type: _react.PropTypes.oneOf(['primary', 'secondary', 'approve', 'decline']).isRequired
};
Button.defaultProps = {
type: 'primary',
active: false,
disabled: false,
submit: false
size: 'medium',
state: 'default',
submit: false,
type: 'primary'
};
exports.default = Button;

@@ -15,3 +15,3 @@ 'use strict';

var _FaClose = require('@jouwomgeving/ui-icon/lib/FontAwesome/FaClose');
var _FaClose = require('@jouwomgeving/ui-icon/FontAwesome/FaClose');

@@ -22,16 +22,3 @@ var _FaClose2 = _interopRequireDefault(_FaClose);

var styles = {
'Button': 'styles__Button___25D3l',
'Button-content': 'styles__Button-content___asVnw',
'disabled': 'styles__disabled___3PoLx',
'Button-prefix': 'styles__Button-prefix___2euxs',
'Button-suffix': 'styles__Button-suffix___2gXk2',
'primary': 'styles__primary___2056t',
'secondary': 'styles__secondary___2Z3NI',
'Group': 'styles__Group___3t-Hw',
'Group-item': 'styles__Group-item___xJZUV',
'horizontal': 'styles__horizontal___1pcjx',
'vertical': 'styles__vertical___3Brjx',
'Close': 'styles__Close___3VI-x'
};
var styles = {};

@@ -38,0 +25,0 @@ var cx = _bind2.default.bind(styles);

@@ -17,16 +17,3 @@ 'use strict';

var styles = {
'Button': 'styles__Button___25D3l',
'Button-content': 'styles__Button-content___asVnw',
'disabled': 'styles__disabled___3PoLx',
'Button-prefix': 'styles__Button-prefix___2euxs',
'Button-suffix': 'styles__Button-suffix___2gXk2',
'primary': 'styles__primary___2056t',
'secondary': 'styles__secondary___2Z3NI',
'Group': 'styles__Group___3t-Hw',
'Group-item': 'styles__Group-item___xJZUV',
'horizontal': 'styles__horizontal___1pcjx',
'vertical': 'styles__vertical___3Brjx',
'Close': 'styles__Close___3VI-x'
};
var styles = {};

@@ -36,4 +23,4 @@ var cx = _bind2.default.bind(styles);

function Group(_ref) {
var children = _ref.children;
var direction = _ref.direction;
var children = _ref.children,
direction = _ref.direction;

@@ -40,0 +27,0 @@ return _react2.default.createElement(

{
"name": "@jouwomgeving/ui-button",
"version": "0.0.2-alpha.5ffe785b",
"version": "0.0.2-alpha.65a9fb6d",
"author": "Jouw Omgeving",
"dictator": [
"web"
],
"license": "UNLICENSED",

@@ -23,3 +26,3 @@ "repository": {

"devDependencies": {
"@jouwomgeving/ui-icon": "^0.0.1-alpha.5ffe785b"
"@jouwomgeving/ui-icon": "^0.0.1-alpha.65a9fb6d"
},

@@ -26,0 +29,0 @@ "dependencies": {

Sorry, the diff of this file is not supported yet

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