Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

styled-system

Package Overview
Dependencies
Maintainers
2
Versions
149
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

styled-system - npm Package Compare versions

Comparing version 5.0.0-2 to 5.0.0-3

185

dist/index.js

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

var e=require("@styled-system/space"),r=require("@styled-system/core"),t=require("@styled-system/variant"),o={color:{property:"color",scale:"colors"},backgroundColor:{property:"backgroundColor",scale:"colors"}};o.bg=o.backgroundColor;var s=r.system(o),p={width:{property:"width",scale:"sizes",transform:function(e,t){return r.get(t,e,!function(e){return"number"==typeof e&&!isNaN(e)}(e)||e>1?e:100*e+"%")}},height:{property:"height",scale:"sizes"},minWidth:{property:"minWidth",scale:"sizes"},minHeight:{property:"minHeight",scale:"sizes"},maxWidth:{property:"maxWidth",scale:"sizes"},maxHeight:{property:"maxHeight",scale:"sizes"},display:!0,verticalAlign:!0,size:{properties:["width","height"],scale:"sizes"}},i=r.system(p),a=r.system({fontSize:{property:"fontSize",scale:"fontSizes",defaultScale:[12,14,16,20,24,32,48,64,72]},fontWeight:{property:"fontWeight",scale:"fontWeights"},lineHeight:{property:"lineHeight",scale:"lineHeights"},letterSpacing:{property:"letterSpacing",scale:"letterSpacings"},fontStyle:!0,textAlign:!0}),d=r.system({alignItems:!0,alignContent:!0,justifyItems:!0,justifyContent:!0,flexWrap:!0,flexDirection:!0,flex:!0,flexGrow:!0,flexShrink:!0,flexBasis:!0,justifySelf:!0,alignSelf:!0,order:!0}),l=r.system({border:{property:"border",scale:"borders"},borderWidth:{property:"borderWidth",scale:"borderWidths"},borderStyle:{property:"borderStyle",scale:"borderStyles"},borderColor:{property:"borderColor",scale:"colors"},borderRadius:{property:"borderRadius",scale:"radii"},borderTop:{property:"borderTop",scale:"borders"},borderRight:{property:"borderRight",scale:"borders"},borderBottom:{property:"borderBottom",scale:"borders"},borderLeft:{property:"borderLeft",scale:"borders"},borderX:{properties:["borderLeft","borderRight"],scale:"borders"},borderY:{properties:["borderTop","borderBottom"],scale:"borders"}}),n={background:!0,backgroundImage:!0,backgroundSize:!0,backgroundPosition:!0,backgroundRepeat:!0};n.bgImage=n.backgroundImage,n.bgSize=n.backgroundSize,n.bgPosition=n.backgroundPosition,n.bgRepeat=n.backgroundRepeat;var g=r.system(n),x={space:[0,4,8,16,32,64,128,256,512]},c=r.system({gridGap:{property:"gridGap",scale:"space",defaultScale:x.space},gridColumnGap:{property:"gridColumnGap",scale:"space",defaultScale:x.space},gridRowGap:{property:"gridRowGap",scale:"space",defaultScale:x.space},gridColumn:!0,gridRow:!0,gridAutoFlow:!0,gridAutoColumns:!0,gridAutoRows:!0,gridTemplateColumns:!0,gridTemplateRows:!0,gridTemplateAreas:!0,gridArea:!0}),y=r.system({position:!0,zIndex:{property:"zIndex",scale:"zIndices"},top:!0,right:!0,bottom:!0,left:!0}),m=r.system({boxShadow:{property:"boxShadow",scale:"shadows"}}),b=r.system({opacity:!0}),u=r.system({overflow:!0}),f=t.variant({key:"buttons"}),h=t.variant({key:"textStyles",prop:"textStyle"}),S=t.variant({key:"colorStyles",prop:"colors"});exports.margin=e.margin,exports.marginTop=e.marginTop,exports.marginRight=e.marginRight,exports.marginBottom=e.marginBottom,exports.marginLeft=e.marginLeft,exports.marginX=e.marginX,exports.padding=e.padding,exports.paddingTop=e.paddingTop,exports.paddingRight=e.paddingRight,exports.paddingBottom=e.paddingBottom,exports.paddingLeft=e.paddingLeft,exports.paddingX=e.paddingX,exports.paddingY=e.paddingY,exports.space=e.space,exports.get=r.get,exports.createParser=r.createParser,exports.createStyleFunction=r.createStyleFunction,exports.compose=r.compose,exports.variant=t.variant,exports.style=function(e){var t=e.prop,o=e.alias,s={};return s[t]=r.createStyleFunction({properties:e.properties,property:e.cssProperty||t,scale:e.key,defaultScale:e.scale,transform:e.transformValue}),o&&(s[o]=s[t]),r.createParser(s)},exports.color=s,exports.layout=i,exports.typography=a,exports.flexbox=d,exports.border=l,exports.background=g,exports.width=i,exports.height=i,exports.minWidth=i,exports.minHeight=i,exports.maxWidth=i,exports.maxHeight=i,exports.size=i,exports.verticalAlign=i,exports.display=i,exports.fontSize=a,exports.fontFamily=a,exports.fontWeight=a,exports.lineHeight=a,exports.textAlign=a,exports.fontStyle=a,exports.letterSpacing=a,exports.alignItems=d,exports.alignContent=d,exports.justifyItems=d,exports.justifyContent=d,exports.flexWrap=d,exports.flexDirection=d,exports.flex=d,exports.flexGrow=d,exports.flexShrink=d,exports.flexBasis=d,exports.justifySelf=d,exports.alignSelf=d,exports.order=d,exports.gridGap=c,exports.gridColumnGap=c,exports.gridRowGap=c,exports.gridColumn=c,exports.gridRow=c,exports.gridAutoFlow=c,exports.gridAutoColumns=c,exports.gridAutoRows=c,exports.gridTemplateColumns=c,exports.gridTemplateRows=c,exports.gridTemplateAreas=c,exports.gridArea=c,exports.borderWidth=l,exports.borderStyle=l,exports.borderColor=l,exports.borderTop=l,exports.borderRight=l,exports.borderBottom=l,exports.borderLeft=l,exports.borderRadius=l,exports.borders=l,exports.backgroundImage=g,exports.backgroundSize=g,exports.backgroundPosition=g,exports.backgroundRepeat=g,exports.position=y,exports.zIndex=y,exports.top=y,exports.right=y,exports.bottom=y,exports.left=y,exports.boxShadow=m,exports.opacity=b,exports.overflow=u,exports.buttonStyle=f,exports.textStyle=h,exports.colorStyle=S;
//# sourceMappingURL=index.js.map
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
exports.__esModule = true;
exports.colorStyle = exports.textStyle = exports.buttonStyle = exports.overflow = exports.opacity = exports.boxShadow = exports.style = exports.left = exports.bottom = exports.right = exports.top = exports.zIndex = exports.position = exports.backgroundRepeat = exports.backgroundPosition = exports.backgroundSize = exports.backgroundImage = exports.borders = exports.borderRadius = exports.borderLeft = exports.borderBottom = exports.borderRight = exports.borderTop = exports.borderColor = exports.borderStyle = exports.borderWidth = exports.gridArea = exports.gridTemplateAreas = exports.gridTemplateRows = exports.gridTemplateColumns = exports.gridAutoRows = exports.gridAutoColumns = exports.gridAutoFlow = exports.gridRow = exports.gridColumn = exports.gridRowGap = exports.gridColumnGap = exports.gridGap = exports.order = exports.alignSelf = exports.justifySelf = exports.flexBasis = exports.flexShrink = exports.flexGrow = exports.flex = exports.flexDirection = exports.flexWrap = exports.justifyContent = exports.justifyItems = exports.alignContent = exports.alignItems = exports.letterSpacing = exports.fontStyle = exports.textAlign = exports.lineHeight = exports.fontWeight = exports.fontFamily = exports.fontSize = exports.display = exports.verticalAlign = exports.size = exports.maxHeight = exports.maxWidth = exports.minHeight = exports.minWidth = exports.height = exports.width = exports.background = exports.border = exports.flexbox = exports.typography = exports.layout = exports.color = exports.space = exports.paddingY = exports.paddingX = exports.paddingLeft = exports.paddingBottom = exports.paddingRight = exports.paddingTop = exports.padding = exports.marginX = exports.marginLeft = exports.marginBottom = exports.marginRight = exports.marginTop = exports.margin = exports.compose = exports.get = void 0;
var _core = require("@styled-system/core");
exports.createStyleFunction = _core.createStyleFunction;
exports.createParser = _core.createParser;
exports.get = _core.get;
exports.compose = _core.compose;
var _variant = require("@styled-system/variant");
exports.variant = _variant.variant;
var _space = require("@styled-system/space");
exports.margin = _space.margin;
exports.marginTop = _space.marginTop;
exports.marginRight = _space.marginRight;
exports.marginBottom = _space.marginBottom;
exports.marginLeft = _space.marginLeft;
exports.marginX = _space.marginX;
exports.padding = _space.padding;
exports.paddingTop = _space.paddingTop;
exports.paddingRight = _space.paddingRight;
exports.paddingBottom = _space.paddingBottom;
exports.paddingLeft = _space.paddingLeft;
exports.paddingX = _space.paddingX;
exports.paddingY = _space.paddingY;
exports.space = _space.space;
var _color = require("@styled-system/color");
exports.color = _color.color;
var _layout = _interopRequireWildcard(require("@styled-system/layout"));
exports.layout = _layout.layout;
exports.width = _layout["default"];
exports.height = _layout["default"];
exports.minWidth = _layout["default"];
exports.minHeight = _layout["default"];
exports.maxWidth = _layout["default"];
exports.maxHeight = _layout["default"];
exports.size = _layout["default"];
exports.verticalAlign = _layout["default"];
exports.display = _layout["default"];
var _typography = _interopRequireWildcard(require("@styled-system/typography"));
exports.typography = _typography.typography;
exports.fontSize = _typography["default"];
exports.fontFamily = _typography["default"];
exports.fontWeight = _typography["default"];
exports.lineHeight = _typography["default"];
exports.textAlign = _typography["default"];
exports.fontStyle = _typography["default"];
exports.letterSpacing = _typography["default"];
var _flexbox = _interopRequireWildcard(require("@styled-system/flexbox"));
exports.flexbox = _flexbox.flexbox;
exports.alignItems = _flexbox["default"];
exports.alignContent = _flexbox["default"];
exports.justifyItems = _flexbox["default"];
exports.justifyContent = _flexbox["default"];
exports.flexWrap = _flexbox["default"];
exports.flexDirection = _flexbox["default"];
exports.flex = _flexbox["default"];
exports.flexGrow = _flexbox["default"];
exports.flexShrink = _flexbox["default"];
exports.flexBasis = _flexbox["default"];
exports.justifySelf = _flexbox["default"];
exports.alignSelf = _flexbox["default"];
exports.order = _flexbox["default"];
var _border = _interopRequireWildcard(require("@styled-system/border"));
exports.border = _border.border;
exports.borderWidth = _border["default"];
exports.borderStyle = _border["default"];
exports.borderColor = _border["default"];
exports.borderTop = _border["default"];
exports.borderRight = _border["default"];
exports.borderBottom = _border["default"];
exports.borderLeft = _border["default"];
exports.borderRadius = _border["default"];
exports.borders = _border["default"];
var _background = _interopRequireWildcard(require("@styled-system/background"));
exports.background = _background.background;
exports.backgroundImage = _background["default"];
exports.backgroundSize = _background["default"];
exports.backgroundPosition = _background["default"];
exports.backgroundRepeat = _background["default"];
var _grid = _interopRequireDefault(require("@styled-system/grid"));
exports.gridGap = _grid["default"];
exports.gridColumnGap = _grid["default"];
exports.gridRowGap = _grid["default"];
exports.gridColumn = _grid["default"];
exports.gridRow = _grid["default"];
exports.gridAutoFlow = _grid["default"];
exports.gridAutoColumns = _grid["default"];
exports.gridAutoRows = _grid["default"];
exports.gridTemplateColumns = _grid["default"];
exports.gridTemplateRows = _grid["default"];
exports.gridTemplateAreas = _grid["default"];
exports.gridArea = _grid["default"];
var _position = _interopRequireDefault(require("@styled-system/position"));
exports.position = _position["default"];
exports.zIndex = _position["default"];
exports.top = _position["default"];
exports.right = _position["default"];
exports.bottom = _position["default"];
exports.left = _position["default"];
// new packages
// v4 api shims
// v4 style API shim
var style = function style(_ref) {
var prop = _ref.prop,
cssProperty = _ref.cssProperty,
alias = _ref.alias,
key = _ref.key,
transformValue = _ref.transformValue,
scale = _ref.scale,
properties = _ref.properties;
var config = {};
config[prop] = (0, _core.createStyleFunction)({
properties: properties,
property: cssProperty || prop,
scale: key,
defaultScale: scale,
transform: transformValue
});
if (alias) config[alias] = config[prop];
var parse = (0, _core.createParser)(config);
return parse;
}; // todo move to separate package
exports.style = style;
var boxShadow = (0, _core.system)({
boxShadow: {
property: 'boxShadow',
scale: 'shadows'
}
});
exports.boxShadow = boxShadow;
var opacity = (0, _core.system)({
opacity: true
});
exports.opacity = opacity;
var overflow = (0, _core.system)({
overflow: true
}); // variants
exports.overflow = overflow;
var buttonStyle = (0, _variant.variant)({
key: 'buttons'
});
exports.buttonStyle = buttonStyle;
var textStyle = (0, _variant.variant)({
key: 'textStyles',
prop: 'textStyle'
});
exports.textStyle = textStyle;
var colorStyle = (0, _variant.variant)({
key: 'colorStyles',
prop: 'colors'
});
exports.colorStyle = colorStyle;

15

package.json
{
"name": "styled-system",
"version": "5.0.0-2",
"version": "5.0.0-3",
"description": "Responsive, theme-based style props for building design systems with React",
"main": "dist/index.js",
"module": "dist/index.esm.js",
"keywords": [

@@ -16,14 +15,14 @@ "react",

"devDependencies": {
"microbundle": "^0.11.0"
"@babel/cli": "^7.4.4"
},
"dependencies": {
"@styled-system/core": "^5.0.0-2",
"@styled-system/space": "^5.0.0-1",
"@styled-system/variant": "^5.0.0-2",
"@styled-system/core": "^5.0.0-3",
"@styled-system/space": "^5.0.0-3",
"@styled-system/variant": "^5.0.0-3",
"object-assign": "^4.1.1"
},
"scripts": {
"prepare": "microbundle"
"prepare": "NODE_ENV=cjs babel src -d dist"
},
"gitHead": "97dba5f4aded4362695c886ce13f9dcb730df8d2"
"gitHead": "dabec1cd94786c71679a550b4e3686bf7f8993dd"
}
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