@bedrock-layout/grid - npm Package Compare versions

Comparing version 4.2.10 to 4.3.0

lib/index.cjs.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@bedrock-layout/spacing-constants"),d=require("@bedrock-layout/type-utils"),m=require("react"),g=d.forwardRefWithAs(function({as:r="div",style:i={},minItemWidth:n,gutter:s,...o},a){const t=e.useTheme(),c=e.getSizeValue(t,n),u=e.getSafeGutter(t,s);return m.createElement(r,{ref:a,"data-bedrock-grid":!0,style:{"--minItemWidth":c,"--gutter":u,...i},...o})});exports.Grid=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@bedrock-layout/spacing-constants"),l=require("@bedrock-layout/type-utils"),y=require("react"),g=l.forwardRefWithAs(function({as:r="div",style:i={},minItemWidth:n,gutter:a,variant:s,...o},u){const e=t.useTheme(),c=t.getSizeValue(e,n),d=t.getSafeGutter(e,a),m=s==="masonry"?"variant:masonry":!0;return y.createElement(r,{ref:u,"data-bedrock-grid":m,style:{"--minItemWidth":c,"--gutter":d,...i},...o})});exports.Grid=g;

lib/index.d.ts

@@ -19,2 +19,6 @@ import { CSSLength, Gutter, SizesOptions } from "@bedrock-layout/spacing-constants";
     minItemWidth?: MinItemWidth;
+    /**
+     * The `variant` prop can be set to "grid" or "masonry".
+     */
+    variant?: "grid" | "masonry";
 };
@@ -21,0 +25,0 @@ /**

lib/index.m.js

@@ -1,17 +0,24 @@
-import { useTheme as c, getSizeValue as s, getSafeGutter as u } from "@bedrock-layout/spacing-constants";
-import { forwardRefWithAs as f } from "@bedrock-layout/type-utils";
-import h from "react";
-const l = f(function({ as: e = "div", style: r = {}, minItemWidth: i, gutter: m, ...o }, a) {
-  const t = c(), n = s(t, i), d = u(t, m);
-  return /* @__PURE__ */ h.createElement(
+import { useTheme as d, getSizeValue as f, getSafeGutter as h } from "@bedrock-layout/spacing-constants";
+import { forwardRefWithAs as y } from "@bedrock-layout/type-utils";
+import b from "react";
+const W = y(function({
+  as: e = "div",
+  style: r = {},
+  minItemWidth: o,
+  gutter: a,
+  variant: i,
+  ...m
+}, n) {
+  const t = d(), s = f(t, o), u = h(t, a), c = i === "masonry" ? "variant:masonry" : !0;
+  return /* @__PURE__ */ b.createElement(
     e,
     {
-      ref: a,
-      "data-bedrock-grid": !0,
+      ref: n,
+      "data-bedrock-grid": c,
       style: {
-        "--minItemWidth": n,
-        "--gutter": d,
+        "--minItemWidth": s,
+        "--gutter": u,
         ...r
       },
-      ...o
+      ...m
     }
@@ -21,3 +28,3 @@ );
 export {
-  l as Grid
+  W as Grid
 };

lib/index.umd.js

@@ -1,1 +0,1 @@
-(function(e,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("@bedrock-layout/spacing-constants"),require("@bedrock-layout/type-utils"),require("react")):typeof define=="function"&&define.amd?define(["exports","@bedrock-layout/spacing-constants","@bedrock-layout/type-utils","react"],t):(e=typeof globalThis<"u"?globalThis:e||self,t(e.grid={},e.spacingConstants,e.typeUtils,e.React))})(this,function(e,t,r,n){"use strict";const d=r.forwardRefWithAs(function({as:o="div",style:u={},minItemWidth:s,gutter:c,...a},f){const i=t.useTheme(),y=t.getSizeValue(i,s),m=t.getSafeGutter(i,c);return n.createElement(o,{ref:f,"data-bedrock-grid":!0,style:{"--minItemWidth":y,"--gutter":m,...u},...a})});e.Grid=d,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
+(function(e,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("@bedrock-layout/spacing-constants"),require("@bedrock-layout/type-utils"),require("react")):typeof define=="function"&&define.amd?define(["exports","@bedrock-layout/spacing-constants","@bedrock-layout/type-utils","react"],t):(e=typeof globalThis<"u"?globalThis:e||self,t(e.grid={},e.spacingConstants,e.typeUtils,e.React))})(this,function(e,t,r,n){"use strict";const o=r.forwardRefWithAs(function({as:u="div",style:d={},minItemWidth:s,gutter:a,variant:c,...f},y){const i=t.useTheme(),m=t.getSizeValue(i,s),p=t.getSafeGutter(i,a),l=c==="masonry"?"variant:masonry":!0;return n.createElement(u,{ref:y,"data-bedrock-grid":l,style:{"--minItemWidth":m,"--gutter":p,...d},...f})});e.Grid=o,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});

package.json

 {
   "name": "@bedrock-layout/grid",
-  "version": "4.2.10",
+  "version": "4.3.0",
   "description": "bedrock-layout grid",
@@ -63,3 +63,3 @@ "sideEffects": false,
   },
-  "gitHead": "5101f782e82614ab75c6ad3ad7d7bb01f1726636"
+  "gitHead": "a5b48830325ca9dcef72e231f4d2e9eee7b6bee8"
 }

New alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 2 instances in 1 package

Fixed alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 2 instances in 1 package

Improved metrics

Total package byte prevSize

7205

3.91%

Lines of code

64

20.75%

No dependency changes