Socket
Socket
Sign inDemoInstall

@uidu/fab

Package Overview
Dependencies
Maintainers
1
Versions
87
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@uidu/fab - npm Package Compare versions

Comparing version 0.3.3 to 0.3.4

9

CHANGELOG.md
# @uidu/fab
## 0.3.4
### Patch Changes
- ce58773: Try bump all packages
## 0.3.3

@@ -7,3 +13,4 @@

- 0c395cf: Tried preconstruct all forms elements
- e4db094: Tried preconstruct all forms elements
- e4db094: Try rebuild with new preconstruct version

@@ -10,0 +17,0 @@ ## 0.3.2

39

dist/fab.cjs.dev.js

@@ -5,26 +5,27 @@ 'use strict';

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
var React = require('react');
var React__default = _interopDefault(React);
var styled = require('styled-components');
var styled__default = _interopDefault(styled);
var StyledMainButton = styled__default.button.withConfig({
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefault(React);
var styled__default = /*#__PURE__*/_interopDefault(styled);
var StyledMainButton = styled__default['default'].button.withConfig({
displayName: "styled__StyledMainButton",
componentId: "ps9aer-0"
})(["height:48px;width:48px;z-index:9999;background-color:#666666;display:inline-flex;justify-content:center;align-items:center;position:relative;border:none;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28);cursor:pointer;outline:none;padding:0;-webkit-user-drag:none;font-weight:bold;color:#f1f1f1;font-size:18px;> *{transition:ease-in-out transform 0.2s;}"]);
var StyledActionWrapper = styled__default.li.withConfig({
var StyledActionWrapper = styled__default['default'].li.withConfig({
displayName: "styled__StyledActionWrapper",
componentId: "ps9aer-1"
})(["display:block;position:absolute;top:0;right:1px;padding:10px 0;margin:-10px 0;transition:ease-in-out transform 0.2s;> span{transition:ease-in-out opacity 0.2s;position:absolute;top:50%;transform:translateY(-50%);margin:0 8px;background:rgba(0,0,0,0.75);padding:4px 8px;border-radius:3px;color:white;font-size:13px;&.right{right:100%;}}&:nth-child(1){transform:translateY(-60px) scale(0);transition-delay:0.21s;&.top{transform:translateY(60px) scale(0);}}&:nth-child(2){transform:translateY(-120px) scale(0);transition-delay:0.18s;&.top{transform:translateY(120px) scale(0);}}&:nth-child(3){transform:translateY(-180px) scale(0);transition-delay:0.15s;&.top{transform:translateY(180px) scale(0);}}&:nth-child(4){transform:translateY(-240px) scale(0);transition-delay:0.12s;&.top{transform:translateY(240px) scale(0);}}&:nth-child(5){transform:translateY(-300px) scale(0);transition-delay:0.09s;&.top{transform:translateY(300px) scale(0);}}&:nth-child(6){transform:translateY(-360px) scale(0);transition-delay:0.03s;&.top{transform:translateY(360px) scale(0);}}"]);
var StyledActions = styled__default.li.withConfig({
var StyledActions = styled__default['default'].li.withConfig({
displayName: "styled__StyledActions",
componentId: "ps9aer-2"
})(["padding:25px;margin:-25px;*:last-child{margin-bottom:0;}"]);
var StyledAction = styled__default.button.withConfig({
var StyledAction = styled__default['default'].button.withConfig({
displayName: "styled__StyledAction",
componentId: "ps9aer-3"
})(["height:40px;width:40px;background-color:#aaaaaa;display:inline-flex;justify-content:center;align-items:center;position:relative;border:none;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28);cursor:pointer;outline:none;padding:0;-webkit-user-drag:none;font-weight:bold;color:#f1f1f1;margin-right:2px;font-size:1rem;z-index:10000;"]);
var StyledFab = styled__default.ul.withConfig({
var StyledFab = styled__default['default'].ul.withConfig({
displayName: "styled__StyledFab",

@@ -49,3 +50,3 @@ componentId: "ps9aer-4"

return /*#__PURE__*/React__default.createElement(StyledAction, rest, children);
return /*#__PURE__*/React__default['default'].createElement(StyledAction, rest, children);
});

@@ -60,3 +61,3 @@

return /*#__PURE__*/React__default.createElement(StyledMainButton, rest, children);
return /*#__PURE__*/React__default['default'].createElement(StyledMainButton, rest, children);
});

@@ -159,7 +160,7 @@

var open = this.state.open;
if (React__default.Children.count(c) > 6) console.warn('@uidu/fab only supports up to 6 action buttons');
return React__default.Children.map(c, function (ch, i) {
return /*#__PURE__*/React__default.createElement(StyledActionWrapper, {
if (React__default['default'].Children.count(c) > 6) console.warn('@uidu/fab only supports up to 6 action buttons');
return React__default['default'].Children.map(c, function (ch, i) {
return /*#__PURE__*/React__default['default'].createElement(StyledActionWrapper, {
className: "".concat('top' in p ? 'top' : '')
}, /*#__PURE__*/React__default.cloneElement(ch, _objectSpread(_objectSpread({
}, /*#__PURE__*/React__default['default'].cloneElement(ch, _objectSpread(_objectSpread({
'data-testid': "action-button-".concat(i),

@@ -172,3 +173,3 @@ 'aria-label': ch.props.text || "Menu button ".concat(i + 1),

}
})), ch.props.text && /*#__PURE__*/React__default.createElement("span", {
})), ch.props.text && /*#__PURE__*/React__default['default'].createElement("span", {
className: 'right' in p ? 'right' : '',

@@ -186,3 +187,3 @@ "aria-hidden": !open

mainButtonStyles = _this$props2.mainButtonStyles;
return /*#__PURE__*/React__default.createElement(StyledFab, {
return /*#__PURE__*/React__default['default'].createElement(StyledFab, {
onMouseEnter: this.enter,

@@ -192,3 +193,3 @@ onMouseLeave: this.leave,

style: position
}, /*#__PURE__*/React__default.createElement(StyledActions, null, /*#__PURE__*/React__default.createElement(MainButton, {
}, /*#__PURE__*/React__default['default'].createElement(StyledActions, null, /*#__PURE__*/React__default['default'].createElement(MainButton, {
onClick: this.toggle,

@@ -199,3 +200,3 @@ style: mainButtonStyles,

tabIndex: "0"
}, icon), /*#__PURE__*/React__default.createElement("ul", null, this.rc())));
}, icon), /*#__PURE__*/React__default['default'].createElement("ul", null, this.rc())));
}

@@ -202,0 +203,0 @@ }]);

"use strict";
function _interopDefault(ex) {
return ex && "object" == typeof ex && "default" in ex ? ex.default : ex;
}
Object.defineProperty(exports, "__esModule", {

@@ -11,15 +7,23 @@ value: !0

var React = require("react"), React__default = _interopDefault(React), styled = require("styled-components"), styled__default = _interopDefault(styled), StyledMainButton = styled__default.button.withConfig({
var React = require("react"), styled = require("styled-components");
function _interopDefault(e) {
return e && e.__esModule ? e : {
default: e
};
}
var React__default = _interopDefault(React), styled__default = _interopDefault(styled), StyledMainButton = styled__default.default.button.withConfig({
displayName: "styled__StyledMainButton",
componentId: "ps9aer-0"
})([ "height:48px;width:48px;z-index:9999;background-color:#666666;display:inline-flex;justify-content:center;align-items:center;position:relative;border:none;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28);cursor:pointer;outline:none;padding:0;-webkit-user-drag:none;font-weight:bold;color:#f1f1f1;font-size:18px;> *{transition:ease-in-out transform 0.2s;}" ]), StyledActionWrapper = styled__default.li.withConfig({
})([ "height:48px;width:48px;z-index:9999;background-color:#666666;display:inline-flex;justify-content:center;align-items:center;position:relative;border:none;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28);cursor:pointer;outline:none;padding:0;-webkit-user-drag:none;font-weight:bold;color:#f1f1f1;font-size:18px;> *{transition:ease-in-out transform 0.2s;}" ]), StyledActionWrapper = styled__default.default.li.withConfig({
displayName: "styled__StyledActionWrapper",
componentId: "ps9aer-1"
})([ "display:block;position:absolute;top:0;right:1px;padding:10px 0;margin:-10px 0;transition:ease-in-out transform 0.2s;> span{transition:ease-in-out opacity 0.2s;position:absolute;top:50%;transform:translateY(-50%);margin:0 8px;background:rgba(0,0,0,0.75);padding:4px 8px;border-radius:3px;color:white;font-size:13px;&.right{right:100%;}}&:nth-child(1){transform:translateY(-60px) scale(0);transition-delay:0.21s;&.top{transform:translateY(60px) scale(0);}}&:nth-child(2){transform:translateY(-120px) scale(0);transition-delay:0.18s;&.top{transform:translateY(120px) scale(0);}}&:nth-child(3){transform:translateY(-180px) scale(0);transition-delay:0.15s;&.top{transform:translateY(180px) scale(0);}}&:nth-child(4){transform:translateY(-240px) scale(0);transition-delay:0.12s;&.top{transform:translateY(240px) scale(0);}}&:nth-child(5){transform:translateY(-300px) scale(0);transition-delay:0.09s;&.top{transform:translateY(300px) scale(0);}}&:nth-child(6){transform:translateY(-360px) scale(0);transition-delay:0.03s;&.top{transform:translateY(360px) scale(0);}}" ]), StyledActions = styled__default.li.withConfig({
})([ "display:block;position:absolute;top:0;right:1px;padding:10px 0;margin:-10px 0;transition:ease-in-out transform 0.2s;> span{transition:ease-in-out opacity 0.2s;position:absolute;top:50%;transform:translateY(-50%);margin:0 8px;background:rgba(0,0,0,0.75);padding:4px 8px;border-radius:3px;color:white;font-size:13px;&.right{right:100%;}}&:nth-child(1){transform:translateY(-60px) scale(0);transition-delay:0.21s;&.top{transform:translateY(60px) scale(0);}}&:nth-child(2){transform:translateY(-120px) scale(0);transition-delay:0.18s;&.top{transform:translateY(120px) scale(0);}}&:nth-child(3){transform:translateY(-180px) scale(0);transition-delay:0.15s;&.top{transform:translateY(180px) scale(0);}}&:nth-child(4){transform:translateY(-240px) scale(0);transition-delay:0.12s;&.top{transform:translateY(240px) scale(0);}}&:nth-child(5){transform:translateY(-300px) scale(0);transition-delay:0.09s;&.top{transform:translateY(300px) scale(0);}}&:nth-child(6){transform:translateY(-360px) scale(0);transition-delay:0.03s;&.top{transform:translateY(360px) scale(0);}}" ]), StyledActions = styled__default.default.li.withConfig({
displayName: "styled__StyledActions",
componentId: "ps9aer-2"
})([ "padding:25px;margin:-25px;*:last-child{margin-bottom:0;}" ]), StyledAction = styled__default.button.withConfig({
})([ "padding:25px;margin:-25px;*:last-child{margin-bottom:0;}" ]), StyledAction = styled__default.default.button.withConfig({
displayName: "styled__StyledAction",
componentId: "ps9aer-3"
})([ "height:40px;width:40px;background-color:#aaaaaa;display:inline-flex;justify-content:center;align-items:center;position:relative;border:none;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28);cursor:pointer;outline:none;padding:0;-webkit-user-drag:none;font-weight:bold;color:#f1f1f1;margin-right:2px;font-size:1rem;z-index:10000;" ]), StyledFab = styled__default.ul.withConfig({
})([ "height:40px;width:40px;background-color:#aaaaaa;display:inline-flex;justify-content:center;align-items:center;position:relative;border:none;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28);cursor:pointer;outline:none;padding:0;-webkit-user-drag:none;font-weight:bold;color:#f1f1f1;margin-right:2px;font-size:1rem;z-index:10000;" ]), StyledFab = styled__default.default.ul.withConfig({
displayName: "styled__StyledFab",

@@ -50,3 +54,3 @@ componentId: "ps9aer-4"

var children = _ref.children, rest = _objectWithoutProperties(_ref, [ "children" ]);
return React__default.createElement(StyledAction, rest, children);
return React__default.default.createElement(StyledAction, rest, children);
};

@@ -73,3 +77,3 @@

var children = _ref.children, rest = _objectWithoutProperties$1(_ref, [ "children" ]);
return React__default.createElement(StyledMainButton, rest, children);
return React__default.default.createElement(StyledMainButton, rest, children);
};

@@ -227,7 +231,7 @@

var _this2 = this, _this$props = this.props, c = _this$props.children, p = _this$props.position, open = this.state.open;
return React__default.Children.count(c) > 6 && console.warn("@uidu/fab only supports up to 6 action buttons"),
React__default.Children.map(c, (function(ch, i) {
return React__default.createElement(StyledActionWrapper, {
return React__default.default.Children.count(c) > 6 && console.warn("@uidu/fab only supports up to 6 action buttons"),
React__default.default.Children.map(c, (function(ch, i) {
return React__default.default.createElement(StyledActionWrapper, {
className: "".concat("top" in p ? "top" : "")
}, React__default.cloneElement(ch, _objectSpread(_objectSpread({
}, React__default.default.cloneElement(ch, _objectSpread(_objectSpread({
"data-testid": "action-button-".concat(i),

@@ -240,3 +244,3 @@ "aria-label": ch.props.text || "Menu button ".concat(i + 1),

}
})), ch.props.text && React__default.createElement("span", {
})), ch.props.text && React__default.default.createElement("span", {
className: "right" in p ? "right" : "",

@@ -251,3 +255,3 @@ "aria-hidden": !open

var _this$props2 = this.props, position = _this$props2.position, icon = _this$props2.icon, mainButtonStyles = _this$props2.mainButtonStyles;
return React__default.createElement(StyledFab, {
return React__default.default.createElement(StyledFab, {
onMouseEnter: this.enter,

@@ -257,3 +261,3 @@ onMouseLeave: this.leave,

style: position
}, React__default.createElement(StyledActions, null, React__default.createElement(MainButton, {
}, React__default.default.createElement(StyledActions, null, React__default.default.createElement(MainButton, {
onClick: this.toggle,

@@ -264,3 +268,3 @@ style: mainButtonStyles,

tabIndex: "0"
}, icon), React__default.createElement("ul", null, this.rc())));
}, icon), React__default.default.createElement("ul", null, this.rc())));
}

@@ -267,0 +271,0 @@ } ]), Fab;

{
"name": "@uidu/fab",
"version": "0.3.3"
"version": "0.3.4"
}
{
"name": "@uidu/fab",
"version": "0.3.3",
"version": "0.3.4",
"private": false,

@@ -19,5 +19,5 @@ "description": "Floating action buttons",

"devDependencies": {
"@uidu/docs": "^0.2.2"
"@uidu/docs": "^0.2.3"
},
"uidu:src": "src/index.ts"
}
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