@theme-ui/css - npm Package Compare versions

Comparing version 0.4.0-rc.5 to 0.4.0-rc.6

dist/index.d.ts

@@ -10,2 +10,4 @@ import { CSSObject, ThemeUIStyleObject, Theme } from './types';
     paddingY: string[];
+    scrollPaddingX: string[];
+    scrollPaddingY: string[];
     size: string[];
@@ -46,2 +48,9 @@ };
     readonly paddingInlineStart: "space";
+    readonly scrollPadding: "space";
+    readonly scrollPaddingTop: "space";
+    readonly scrollPaddingRight: "space";
+    readonly scrollPaddingBottom: "space";
+    readonly scrollPaddingLeft: "space";
+    readonly scrollPaddingX: "space";
+    readonly scrollPaddingY: "space";
     readonly inset: "space";
@@ -48,0 +57,0 @@ readonly insetBlock: "space";

dist/index.esm.js

@@ -57,2 +57,4 @@ function _extends() {
   paddingY: ['paddingTop', 'paddingBottom'],
+  scrollPaddingX: ['scrollPaddingLeft', 'scrollPaddingRight'],
+  scrollPaddingY: ['scrollPaddingTop', 'scrollPaddingBottom'],
   size: ['width', 'height']
@@ -93,2 +95,9 @@ };
   paddingInlineStart: 'space',
+  scrollPadding: 'space',
+  scrollPaddingTop: 'space',
+  scrollPaddingRight: 'space',
+  scrollPaddingBottom: 'space',
+  scrollPaddingLeft: 'space',
+  scrollPaddingX: 'space',
+  scrollPaddingY: 'space',
   inset: 'space',
@@ -95,0 +104,0 @@ insetBlock: 'space',

dist/index.js

@@ -57,2 +57,4 @@ function _extends() {
   paddingY: ['paddingTop', 'paddingBottom'],
+  scrollPaddingX: ['scrollPaddingLeft', 'scrollPaddingRight'],
+  scrollPaddingY: ['scrollPaddingTop', 'scrollPaddingBottom'],
   size: ['width', 'height']
@@ -93,2 +95,9 @@ };
   paddingInlineStart: 'space',
+  scrollPadding: 'space',
+  scrollPaddingTop: 'space',
+  scrollPaddingRight: 'space',
+  scrollPaddingBottom: 'space',
+  scrollPaddingLeft: 'space',
+  scrollPaddingX: 'space',
+  scrollPaddingY: 'space',
   inset: 'space',
@@ -95,0 +104,0 @@ insetBlock: 'space',

dist/index.modern.js

@@ -37,2 +37,4 @@ function get(obj, key, def, p, undef) {
   paddingY: ['paddingTop', 'paddingBottom'],
+  scrollPaddingX: ['scrollPaddingLeft', 'scrollPaddingRight'],
+  scrollPaddingY: ['scrollPaddingTop', 'scrollPaddingBottom'],
   size: ['width', 'height']
@@ -73,2 +75,9 @@ };
   paddingInlineStart: 'space',
+  scrollPadding: 'space',
+  scrollPaddingTop: 'space',
+  scrollPaddingRight: 'space',
+  scrollPaddingBottom: 'space',
+  scrollPaddingLeft: 'space',
+  scrollPaddingX: 'space',
+  scrollPaddingY: 'space',
   inset: 'space',
@@ -75,0 +84,0 @@ insetBlock: 'space',

dist/index.umd.js

@@ -62,2 +62,4 @@ (function (global, factory) {
     paddingY: ['paddingTop', 'paddingBottom'],
+    scrollPaddingX: ['scrollPaddingLeft', 'scrollPaddingRight'],
+    scrollPaddingY: ['scrollPaddingTop', 'scrollPaddingBottom'],
     size: ['width', 'height']
@@ -98,2 +100,9 @@ };
     paddingInlineStart: 'space',
+    scrollPadding: 'space',
+    scrollPaddingTop: 'space',
+    scrollPaddingRight: 'space',
+    scrollPaddingBottom: 'space',
+    scrollPaddingLeft: 'space',
+    scrollPaddingX: 'space',
+    scrollPaddingY: 'space',
     inset: 'space',
@@ -100,0 +109,0 @@ insetBlock: 'space',

dist/types.d.ts

@@ -291,2 +291,16 @@ import * as CSS from 'csstype';
      */
+    /**
+    * The **`scrollPaddingX`** is shorthand property for CSS properties **`scroll-padding-left`** and **`scroll-padding-right`**. They set the width of the scroll padding area on the left and right side of an element.
+    *
+    * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-padding-left
+    * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-padding-right
+    */
+    scrollPaddingX?: StandardCSSProperties['scrollPaddingLeft'];
+    /**
+       * The **`scrollPaddingY`** is shorthand property for CSS properties **`scroll-padding-top`** and **`scroll-padding-bottom`**. They set the width of the scroll padding area on the top and bottom side of an element.
+       *
+       * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-padding-top
+       * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-padding-bottom
+       */
+    scrollPaddingY?: StandardCSSProperties['scrollPaddingTop'];
     size?: StandardCSSProperties['width'];
@@ -293,0 +307,0 @@ }

package.json

 {
   "name": "@theme-ui/css",
-  "version": "0.4.0-rc.5",
+  "version": "0.4.0-rc.6",
   "source": "src/index.ts",
@@ -22,3 +22,3 @@ "main": "dist/index.js",
   },
-  "gitHead": "73f152a13647cae8f7e27c22fc9efd4a76e3c955"
+  "gitHead": "87e9ebb0cc66d8a5e1fcde7bb60f2077266aa437"
 }

src/index.ts

@@ -56,2 +56,4 @@ import {
   paddingY: ['paddingTop', 'paddingBottom'],
+  scrollPaddingX: ['scrollPaddingLeft', 'scrollPaddingRight'],
+  scrollPaddingY: ['scrollPaddingTop', 'scrollPaddingBottom'],
   size: ['width', 'height'],
@@ -93,2 +95,9 @@ }
   paddingInlineStart: 'space',
+  scrollPadding: 'space',
+  scrollPaddingTop: 'space',
+  scrollPaddingRight: 'space',
+  scrollPaddingBottom: 'space',
+  scrollPaddingLeft: 'space',
+  scrollPaddingX: 'space',
+  scrollPaddingY: 'space',
   inset: 'space',
@@ -95,0 +104,0 @@ insetBlock: 'space',

src/types.ts

@@ -300,2 +300,18 @@ import * as CSS from 'csstype'
    */
+
+   /**
+   * The **`scrollPaddingX`** is shorthand property for CSS properties **`scroll-padding-left`** and **`scroll-padding-right`**. They set the width of the scroll padding area on the left and right side of an element.
+   *
+   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-padding-left
+   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-padding-right
+   */
+  scrollPaddingX?: StandardCSSProperties['scrollPaddingLeft']
+
+/**
+   * The **`scrollPaddingY`** is shorthand property for CSS properties **`scroll-padding-top`** and **`scroll-padding-bottom`**. They set the width of the scroll padding area on the top and bottom side of an element.
+   *
+   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-padding-top
+   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-padding-bottom
+   */
+  scrollPaddingY?: StandardCSSProperties['scrollPaddingTop']  
   size?: StandardCSSProperties['width']
@@ -302,0 +318,0 @@ }

test/index.ts

@@ -118,2 +118,3 @@ import { css, Theme } from '../src'
       py: [3, 4],
+      scrollPaddingY: [2, 4]
     },
@@ -126,5 +127,10 @@ })({ theme })
       paddingBottom: 16,
+      scrollPaddingBottom: 8,
+      scrollPaddingTop: 8,
       '@media screen and (min-width: 40em)': {
         paddingTop: 32,
         paddingBottom: 32,
+        scrollPaddingBottom: 32,
+        scrollPaddingTop: 32,
+  
       },
@@ -142,2 +148,4 @@ },
     py: 4,
+    scrollPadding: 1,
+    scrollPaddingY: 2,
     fontSize: 3,
@@ -159,2 +167,5 @@ fontWeight: 'bold',
     paddingBottom: 32,
+    scrollPadding: 4,
+    scrollPaddingTop: 8,
+    scrollPaddingBottom: 8,
     color: 'tomato',
@@ -428,2 +439,5 @@ backgroundColor: 'cyan',
     paddingY: 2,
+    scrollPaddingX: 2,
+    scrollPaddingY: 2,
+
     size: 'large',
@@ -440,2 +454,6 @@ })(theme)
     paddingBottom: 8,
+    scrollPaddingLeft: 8,
+    scrollPaddingRight: 8,
+    scrollPaddingTop: 8,
+    scrollPaddingBottom: 8,
     width: 16,
@@ -488,2 +506,3 @@ height: 16,
     py: 4,
+    scrollPadding: 4,
   })(theme)
@@ -502,2 +521,3 @@ const keys = Object.keys(result)
     'paddingBottom',
+    'scrollPadding'
   ])
@@ -504,0 +524,0 @@ })

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

289652

increased by44.8%

Number of package files

149

increased by727.78%

Lines of code

5016

increased by40.27%

No dependency changes