jsx-to-styled - npm Package Compare versions

Comparing version 1.5.1 to 1.5.2

CHANGELOG.md

@@ -7,7 +7,14 @@ ### Changelog
 
+#### [1.5.2](https://github.com/mleralec/jsx-to-styled/compare/1.5.1...1.5.2)
+
+- chore: add benchmarks [`43d3ff9`](https://github.com/mleralec/jsx-to-styled/commit/43d3ff96cde57f07450d45885d0f8fa56c04ba7c)
+- chore: replace gridGap, gridColumnGap, gridRowGap with shortand names [`d8e8ef9`](https://github.com/mleralec/jsx-to-styled/commit/d8e8ef9baa30ce4b33380a8eed65d54a9e972923)
+
 #### [1.5.1](https://github.com/mleralec/jsx-to-styled/compare/1.5.0...1.5.1)
 
+> 17 August 2022
+
 - perf: iterate over props instead of configs [`1133dab`](https://github.com/mleralec/jsx-to-styled/commit/1133dab636a538858824a561b3d85d22057fb091)
 - docs: update README [`f4065db`](https://github.com/mleralec/jsx-to-styled/commit/f4065db8bc8b075fdc501b7c15ee5b3b226b3924)
-- docs: update README [`99b4bba`](https://github.com/mleralec/jsx-to-styled/commit/99b4bba8bd2c51ee37f73ab87730147bcc232351)
+- chore: release v1.5.1 [`c4c68d6`](https://github.com/mleralec/jsx-to-styled/commit/c4c68d62da8b92bb59eab8b53c766caa2bbb0119)
 
@@ -14,0 +21,0 @@ #### [1.5.0](https://github.com/mleralec/jsx-to-styled/compare/1.4.0...1.5.0)

dist/index.es.js

@@ -133,5 +133,5 @@ const get = (key, theme, scope) => {
 const gridConfig = [
-  { jsxProperty: "$gridGap", scope: "spaces" },
-  { jsxProperty: "$gridRowGap", scope: "spaces" },
-  { jsxProperty: "$gridColumnGap", scope: "spaces" },
+  { jsxProperty: "$gap", scope: "spaces" },
+  { jsxProperty: "$rowGap", scope: "spaces" },
+  { jsxProperty: "$columnGap", scope: "spaces" },
   { jsxProperty: "$gridColumn" },
@@ -138,0 +138,0 @@ { jsxProperty: "$gridRow" },

dist/index.umd.js

@@ -1,1 +0,1 @@
-(function(o,a){typeof exports=="object"&&typeof module!="undefined"?a(exports):typeof define=="function"&&define.amd?define(["exports"],a):(o=typeof globalThis!="undefined"?globalThis:o||self,a(o["jsx-to-styled"]={}))})(this,function(o){"use strict";const a=(s,p,r)=>{var i;return((i=p==null?void 0:p[r])==null?void 0:i[s])||s},w=s=>`@media(min-width: ${s})`,x=(s,p,r,i,c)=>{const y={},n=a(r,i,c);return s?s.forEach(P=>{y[P]=n}):y[p]=n,y},B=s=>s.startsWith("$"),z=(s,p)=>{let r={};for(const i in p){if(!B(i))continue;const c=p[i];if(!c)continue;const y=s.find(W=>W.jsxProperty===i);if(!y)continue;const{scope:n,cssProperties:P,jsxProperty:_}=y,{theme:t}=p,$=_.substring(1);if(typeof c=="string"&&(r={...r,...x(P,$,c,t,n)}),typeof c=="object"){const W=Object.keys((t==null?void 0:t.states)||{}),D=Object.keys((t==null?void 0:t.breakpoints)||{});Object.keys(c).forEach(d=>{const T=c[d];if(d==="_"&&(r={...r,...x(P,$,T,t,n)}),W.includes(d)){const j=t.states[d];r[j]={...r[j],...x(P,$,T,t,n)}}if(D.includes(d)){const j=w(t.breakpoints[d]);r[j]={...r[j],...x(P,$,T,t,n)}}})}}return r},e=(...s)=>p=>{const r=[];return s.forEach(i=>r.push(...i)),z(r,p)},g=[{jsxProperty:"$background"},{jsxProperty:"$backgroundImage"},{jsxProperty:"$backgroundSize"},{jsxProperty:"$backgroundPosition"},{jsxProperty:"$backgroundRepeat"}],L=e(g),f=[{jsxProperty:"$border"},{jsxProperty:"$borderWidth",scope:"borderWidths"},{jsxProperty:"$borderStyle"},{jsxProperty:"$borderColor",scope:"colors"},{jsxProperty:"$borderRadius",scope:"radii"},{jsxProperty:"$borderTop"},{jsxProperty:"$borderTopWidth",scope:"borderWidths"},{jsxProperty:"$borderTopStyle"},{jsxProperty:"$borderTopColor",scope:"colors"},{jsxProperty:"$borderTopLeftRadius",scope:"radii"},{jsxProperty:"$borderTopRightRadius",scope:"radii"},{jsxProperty:"$borderRight"},{jsxProperty:"$borderRightWidth",scope:"borderWidths"},{jsxProperty:"$borderRightStyle"},{jsxProperty:"$borderRightColor",scope:"colors"},{jsxProperty:"$borderBottom"},{jsxProperty:"$borderBottomWidth",scope:"borderWidths"},{jsxProperty:"$borderBottomStyle"},{jsxProperty:"$borderBottomColor",scope:"colors"},{jsxProperty:"$borderBottomLeftRadius",scope:"radii"},{jsxProperty:"$borderBottomRightRadius",scope:"radii"},{jsxProperty:"$borderLeft"},{jsxProperty:"$borderLeftWidth",scope:"borderWidths"},{jsxProperty:"$borderLeftStyle"},{jsxProperty:"$borderLeftColor",scope:"colors"}],v=e(f),l=[{jsxProperty:"$color",scope:"colors"},{jsxProperty:"$backgroundColor",scope:"colors"},{jsxProperty:"$opacity"}],A=e(l),b=[{jsxProperty:"$alignItems"},{jsxProperty:"$alignContent"},{jsxProperty:"$justifyItems"},{jsxProperty:"$justifyContent"},{jsxProperty:"$flex"},{jsxProperty:"$flexBasis"},{jsxProperty:"$flexDirection"},{jsxProperty:"$flexGrow"},{jsxProperty:"$flexShrink"},{jsxProperty:"$flexWrap"},{jsxProperty:"$justifySelf"},{jsxProperty:"$alignSelf"},{jsxProperty:"$order"}],H=e(b),u=[{jsxProperty:"$gridGap",scope:"spaces"},{jsxProperty:"$gridRowGap",scope:"spaces"},{jsxProperty:"$gridColumnGap",scope:"spaces"},{jsxProperty:"$gridColumn"},{jsxProperty:"$gridRow"},{jsxProperty:"$gridArea"},{jsxProperty:"$gridAutoFlow"},{jsxProperty:"$gridAutoRows"},{jsxProperty:"$gridAutoColumns"},{jsxProperty:"$gridTemplateRows"},{jsxProperty:"$gridTemplateColumns"},{jsxProperty:"$gridTemplateAreas"}],G=e(u),m=[{jsxProperty:"$w",scope:"sizes",cssProperties:["width"]},{jsxProperty:"$h",scope:"sizes",cssProperties:["height"]},{jsxProperty:"$minW",scope:"sizes",cssProperties:["minWidth"]},{jsxProperty:"$maxW",scope:"sizes",cssProperties:["maxWidth"]},{jsxProperty:"$minH",scope:"sizes",cssProperties:["minHeight"]},{jsxProperty:"$maxH",scope:"sizes",cssProperties:["maxHeight"]},{jsxProperty:"$display"},{jsxProperty:"$verticalAlign"},{jsxProperty:"$overflow"},{jsxProperty:"$overflowX"},{jsxProperty:"$overflowY"}],I=e(m),h=[{jsxProperty:"$cursor"},{jsxProperty:"$float"},{jsxProperty:"$objectFit"},{jsxProperty:"$objectPosition"},{jsxProperty:"$transform"},{jsxProperty:"$visibility"}],O=e(h),C=[{jsxProperty:"$position"},{jsxProperty:"$zIndex"},{jsxProperty:"$top",scope:"spaces"},{jsxProperty:"$right",scope:"spaces"},{jsxProperty:"$bottom",scope:"spaces"},{jsxProperty:"$left",scope:"spaces"}],E=e(C),R=[{jsxProperty:"$m",scope:"spaces",cssProperties:["margin"]},{jsxProperty:"$mt",scope:"spaces",cssProperties:["marginTop"]},{jsxProperty:"$mr",scope:"spaces",cssProperties:["marginRight"]},{jsxProperty:"$mb",scope:"spaces",cssProperties:["marginBottom"]},{jsxProperty:"$ml",scope:"spaces",cssProperties:["marginLeft"]},{jsxProperty:"$my",scope:"spaces",cssProperties:["marginTop","marginBottom"]},{jsxProperty:"$mx",scope:"spaces",cssProperties:["marginRight","marginLeft"]},{jsxProperty:"$p",scope:"spaces",cssProperties:["padding"]},{jsxProperty:"$pt",scope:"spaces",cssProperties:["paddingTop"]},{jsxProperty:"$pr",scope:"spaces",cssProperties:["paddingRight"]},{jsxProperty:"$pb",scope:"spaces",cssProperties:["paddingBottom"]},{jsxProperty:"$pl",scope:"spaces",cssProperties:["paddingLeft"]},{jsxProperty:"$py",scope:"spaces",cssProperties:["paddingTop","paddingBottom"]},{jsxProperty:"$px",scope:"spaces",cssProperties:["paddingRight","paddingLeft"]}],F=e(R),S=[{jsxProperty:"$fontFamily",scope:"fonts"},{jsxProperty:"$fontSize",scope:"fontSizes"},{jsxProperty:"$fontWeight",scope:"fontWeights"},{jsxProperty:"$lineHeight",scope:"lineHeights"},{jsxProperty:"$letterSpacing",scope:"letterSpacings"},{jsxProperty:"$textAlign"},{jsxProperty:"$fontStyle"},{jsxProperty:"$textDecoration"}],M=e(S),k=e(g,f,l,b,u,m,h,C,R,S);o.background=L,o.backgroundConfig=g,o.border=v,o.borderConfig=f,o.color=A,o.colorConfig=l,o.compose=e,o.default=k,o.flex=H,o.flexConfig=b,o.grid=G,o.gridConfig=u,o.layout=I,o.layoutConfig=m,o.other=O,o.otherConfig=h,o.position=E,o.positionConfig=C,o.space=F,o.spaceConfig=R,o.system=k,o.typography=M,o.typographyConfig=S,Object.defineProperties(o,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(o,a){typeof exports=="object"&&typeof module!="undefined"?a(exports):typeof define=="function"&&define.amd?define(["exports"],a):(o=typeof globalThis!="undefined"?globalThis:o||self,a(o["jsx-to-styled"]={}))})(this,function(o){"use strict";const a=(s,p,r)=>{var i;return((i=p==null?void 0:p[r])==null?void 0:i[s])||s},w=s=>`@media(min-width: ${s})`,x=(s,p,r,i,c)=>{const y={},n=a(r,i,c);return s?s.forEach(P=>{y[P]=n}):y[p]=n,y},B=s=>s.startsWith("$"),z=(s,p)=>{let r={};for(const i in p){if(!B(i))continue;const c=p[i];if(!c)continue;const y=s.find(W=>W.jsxProperty===i);if(!y)continue;const{scope:n,cssProperties:P,jsxProperty:_}=y,{theme:t}=p,$=_.substring(1);if(typeof c=="string"&&(r={...r,...x(P,$,c,t,n)}),typeof c=="object"){const W=Object.keys((t==null?void 0:t.states)||{}),D=Object.keys((t==null?void 0:t.breakpoints)||{});Object.keys(c).forEach(d=>{const T=c[d];if(d==="_"&&(r={...r,...x(P,$,T,t,n)}),W.includes(d)){const j=t.states[d];r[j]={...r[j],...x(P,$,T,t,n)}}if(D.includes(d)){const j=w(t.breakpoints[d]);r[j]={...r[j],...x(P,$,T,t,n)}}})}}return r},e=(...s)=>p=>{const r=[];return s.forEach(i=>r.push(...i)),z(r,p)},g=[{jsxProperty:"$background"},{jsxProperty:"$backgroundImage"},{jsxProperty:"$backgroundSize"},{jsxProperty:"$backgroundPosition"},{jsxProperty:"$backgroundRepeat"}],L=e(g),f=[{jsxProperty:"$border"},{jsxProperty:"$borderWidth",scope:"borderWidths"},{jsxProperty:"$borderStyle"},{jsxProperty:"$borderColor",scope:"colors"},{jsxProperty:"$borderRadius",scope:"radii"},{jsxProperty:"$borderTop"},{jsxProperty:"$borderTopWidth",scope:"borderWidths"},{jsxProperty:"$borderTopStyle"},{jsxProperty:"$borderTopColor",scope:"colors"},{jsxProperty:"$borderTopLeftRadius",scope:"radii"},{jsxProperty:"$borderTopRightRadius",scope:"radii"},{jsxProperty:"$borderRight"},{jsxProperty:"$borderRightWidth",scope:"borderWidths"},{jsxProperty:"$borderRightStyle"},{jsxProperty:"$borderRightColor",scope:"colors"},{jsxProperty:"$borderBottom"},{jsxProperty:"$borderBottomWidth",scope:"borderWidths"},{jsxProperty:"$borderBottomStyle"},{jsxProperty:"$borderBottomColor",scope:"colors"},{jsxProperty:"$borderBottomLeftRadius",scope:"radii"},{jsxProperty:"$borderBottomRightRadius",scope:"radii"},{jsxProperty:"$borderLeft"},{jsxProperty:"$borderLeftWidth",scope:"borderWidths"},{jsxProperty:"$borderLeftStyle"},{jsxProperty:"$borderLeftColor",scope:"colors"}],v=e(f),l=[{jsxProperty:"$color",scope:"colors"},{jsxProperty:"$backgroundColor",scope:"colors"},{jsxProperty:"$opacity"}],A=e(l),b=[{jsxProperty:"$alignItems"},{jsxProperty:"$alignContent"},{jsxProperty:"$justifyItems"},{jsxProperty:"$justifyContent"},{jsxProperty:"$flex"},{jsxProperty:"$flexBasis"},{jsxProperty:"$flexDirection"},{jsxProperty:"$flexGrow"},{jsxProperty:"$flexShrink"},{jsxProperty:"$flexWrap"},{jsxProperty:"$justifySelf"},{jsxProperty:"$alignSelf"},{jsxProperty:"$order"}],H=e(b),u=[{jsxProperty:"$gap",scope:"spaces"},{jsxProperty:"$rowGap",scope:"spaces"},{jsxProperty:"$columnGap",scope:"spaces"},{jsxProperty:"$gridColumn"},{jsxProperty:"$gridRow"},{jsxProperty:"$gridArea"},{jsxProperty:"$gridAutoFlow"},{jsxProperty:"$gridAutoRows"},{jsxProperty:"$gridAutoColumns"},{jsxProperty:"$gridTemplateRows"},{jsxProperty:"$gridTemplateColumns"},{jsxProperty:"$gridTemplateAreas"}],I=e(u),m=[{jsxProperty:"$w",scope:"sizes",cssProperties:["width"]},{jsxProperty:"$h",scope:"sizes",cssProperties:["height"]},{jsxProperty:"$minW",scope:"sizes",cssProperties:["minWidth"]},{jsxProperty:"$maxW",scope:"sizes",cssProperties:["maxWidth"]},{jsxProperty:"$minH",scope:"sizes",cssProperties:["minHeight"]},{jsxProperty:"$maxH",scope:"sizes",cssProperties:["maxHeight"]},{jsxProperty:"$display"},{jsxProperty:"$verticalAlign"},{jsxProperty:"$overflow"},{jsxProperty:"$overflowX"},{jsxProperty:"$overflowY"}],O=e(m),h=[{jsxProperty:"$cursor"},{jsxProperty:"$float"},{jsxProperty:"$objectFit"},{jsxProperty:"$objectPosition"},{jsxProperty:"$transform"},{jsxProperty:"$visibility"}],E=e(h),C=[{jsxProperty:"$position"},{jsxProperty:"$zIndex"},{jsxProperty:"$top",scope:"spaces"},{jsxProperty:"$right",scope:"spaces"},{jsxProperty:"$bottom",scope:"spaces"},{jsxProperty:"$left",scope:"spaces"}],F=e(C),R=[{jsxProperty:"$m",scope:"spaces",cssProperties:["margin"]},{jsxProperty:"$mt",scope:"spaces",cssProperties:["marginTop"]},{jsxProperty:"$mr",scope:"spaces",cssProperties:["marginRight"]},{jsxProperty:"$mb",scope:"spaces",cssProperties:["marginBottom"]},{jsxProperty:"$ml",scope:"spaces",cssProperties:["marginLeft"]},{jsxProperty:"$my",scope:"spaces",cssProperties:["marginTop","marginBottom"]},{jsxProperty:"$mx",scope:"spaces",cssProperties:["marginRight","marginLeft"]},{jsxProperty:"$p",scope:"spaces",cssProperties:["padding"]},{jsxProperty:"$pt",scope:"spaces",cssProperties:["paddingTop"]},{jsxProperty:"$pr",scope:"spaces",cssProperties:["paddingRight"]},{jsxProperty:"$pb",scope:"spaces",cssProperties:["paddingBottom"]},{jsxProperty:"$pl",scope:"spaces",cssProperties:["paddingLeft"]},{jsxProperty:"$py",scope:"spaces",cssProperties:["paddingTop","paddingBottom"]},{jsxProperty:"$px",scope:"spaces",cssProperties:["paddingRight","paddingLeft"]}],G=e(R),S=[{jsxProperty:"$fontFamily",scope:"fonts"},{jsxProperty:"$fontSize",scope:"fontSizes"},{jsxProperty:"$fontWeight",scope:"fontWeights"},{jsxProperty:"$lineHeight",scope:"lineHeights"},{jsxProperty:"$letterSpacing",scope:"letterSpacings"},{jsxProperty:"$textAlign"},{jsxProperty:"$fontStyle"},{jsxProperty:"$textDecoration"}],M=e(S),k=e(g,f,l,b,u,m,h,C,R,S);o.background=L,o.backgroundConfig=g,o.border=v,o.borderConfig=f,o.color=A,o.colorConfig=l,o.compose=e,o.default=k,o.flex=H,o.flexConfig=b,o.grid=I,o.gridConfig=u,o.layout=O,o.layoutConfig=m,o.other=E,o.otherConfig=h,o.position=F,o.positionConfig=C,o.space=G,o.spaceConfig=R,o.system=k,o.typography=M,o.typographyConfig=S,Object.defineProperties(o,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

dist/types/config/background.d.ts

@@ -62,5 +62,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -67,0 +67,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/border.d.ts

@@ -82,5 +82,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -87,0 +87,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/color.d.ts

@@ -60,5 +60,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -65,0 +65,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/flex.d.ts

@@ -70,5 +70,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -75,0 +75,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/grid.d.ts

 import type * as CSS from 'csstype';
 import type { Config, Props, ThemeValues, ObjectProps } from '../types';
 export declare type GridProps = Props<{
-    $gridGap: ObjectProps<ThemeValues<'spaces'> | CSS.Property.GridGap>;
-    $gridRowGap: ObjectProps<ThemeValues<'spaces'> | CSS.Property.GridRowGap>;
-    $gridColumnGap: ObjectProps<ThemeValues<'spaces'> | CSS.Property.GridColumnGap>;
+    $gap: ObjectProps<ThemeValues<'spaces'> | CSS.Property.Gap>;
+    $rowGap: ObjectProps<ThemeValues<'spaces'> | CSS.Property.GridRowGap>;
+    $columnGap: ObjectProps<ThemeValues<'spaces'> | CSS.Property.GridColumnGap>;
     $gridColumn: ObjectProps<CSS.Property.GridColumn>;
@@ -69,5 +69,5 @@ $gridRow: ObjectProps<CSS.Property.GridRow>;
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -74,0 +74,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/layout.d.ts

@@ -68,5 +68,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -73,0 +73,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/other.d.ts

@@ -63,5 +63,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -68,0 +68,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/position.d.ts

@@ -63,5 +63,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -68,0 +68,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/space.d.ts

@@ -71,5 +71,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -76,0 +76,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/config/typography.d.ts

@@ -65,5 +65,5 @@ import type * as CSS from 'csstype';
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridColumn>>;
@@ -70,0 +70,0 @@ $gridRow: (string & {}) | CSS.Globals | "auto" | Partial<Record<"_", CSS.Property.GridRow>>;

dist/types/system.d.ts

@@ -52,5 +52,5 @@ export declare const system: (props: Partial<{
 }> & Partial<{
-    $gridGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridRowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
-    $gridColumnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $gap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $rowGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
+    $columnGap: string | (string & {}) | Partial<Record<"_", string | number | symbol | (string & {})>>;
     $gridColumn: (string & {}) | import("csstype").Globals | "auto" | Partial<Record<"_", import("csstype").Property.GridColumn>>;
@@ -57,0 +57,0 @@ $gridRow: (string & {}) | import("csstype").Globals | "auto" | Partial<Record<"_", import("csstype").Property.GridRow>>;

package.json

 {
   "name": "jsx-to-styled",
   "description": "jsx-to-styled adds styled props to your React components",
-  "version": "1.5.1",
+  "version": "1.5.2",
   "author": "mleralec",
@@ -6,0 +6,0 @@ "license": "MIT",

README.md

@@ -218,5 +218,5 @@ <div align="center">
 | -------------------- | --------------------- | --------- |
-| $gridGap             | grid-gap              | spaces    |
-| $gridColumnGap       | grid-column-gap       | spaces    |
-| $gridRowGap          | grid-row-gap          | spaces    |
+| $gap                 | gap                   | spaces    |
+| $columnGap           | column-gap            | spaces    |
+| $rowGap              | row-gap               | spaces    |
 | $gridColumn          | grid-column           |           |
@@ -223,0 +223,0 @@ | $gridRow             | grid-row              |           |

No alert changes

Improved metrics

Total package byte prevSize

344981

increased by0.07%

No dependency changes