@bsuite/page-builder 0.1.0 → 0.2.1

package/dist/buildResponsiveLayouts.d.ts

@@ -0,0 +1,15 @@
+import type { GridLayouts } from './types.js';
+export declare const RESPONSIVE_BREAKPOINTS: readonly ["lg", "md", "sm", "xs", "xxs"];
+export type ResponsiveBreakpoint = (typeof RESPONSIVE_BREAKPOINTS)[number];
+export interface BuildResponsiveLayoutsOptions {
+    cols?: number;
+}
+/**
+ * Ensure a GridLayouts object has entries for all responsive breakpoints
+ * (lg, md, sm, xs, xxs). Missing smaller breakpoints (sm/xs/xxs) are derived
+ * from `lg` as a single-column vertical stack so that consumer-supplied
+ * lg-only layouts no longer squash on phone viewports. Missing `md` is
+ * mirrored from `lg`. Consumer-supplied breakpoints are preserved verbatim.
+ */
+export declare function buildResponsiveLayouts(layouts: GridLayouts, { cols }?: BuildResponsiveLayoutsOptions): GridLayouts;
+//# sourceMappingURL=buildResponsiveLayouts.d.ts.map

package/dist/buildResponsiveLayouts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"buildResponsiveLayouts.d.ts","sourceRoot":"","sources":["../src/buildResponsiveLayouts.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAkB,WAAW,EAAE,MAAM,YAAY,CAAC;AAE9D,eAAO,MAAM,sBAAsB,0CAA2C,CAAC;AAC/E,MAAM,MAAM,oBAAoB,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC;AAE3E,MAAM,WAAW,6BAA6B;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAkBD;;;;;;GAMG;AACH,wBAAgB,sBAAsB,CACpC,OAAO,EAAE,WAAW,EACpB,EAAE,IAAS,EAAE,GAAE,6BAAkC,GAChD,WAAW,CAyBb"}

package/dist/buildResponsiveLayouts.js

@@ -0,0 +1,47 @@
+export const RESPONSIVE_BREAKPOINTS = ['lg', 'md', 'sm', 'xs', 'xxs'];
+function stackToSingleColumn(items, cols) {
+    const sorted = [...items].sort((a, b) => (a.y !== b.y ? a.y - b.y : a.x - b.x));
+    let nextY = 0;
+    return sorted.map((item) => {
+        const stacked = {
+            ...item,
+            x: 0,
+            y: nextY,
+            w: cols,
+            ...(item.minW !== undefined && { minW: Math.min(item.minW, cols) }),
+        };
+        nextY += item.h;
+        return stacked;
+    });
+}
+/**
+ * Ensure a GridLayouts object has entries for all responsive breakpoints
+ * (lg, md, sm, xs, xxs). Missing smaller breakpoints (sm/xs/xxs) are derived
+ * from `lg` as a single-column vertical stack so that consumer-supplied
+ * lg-only layouts no longer squash on phone viewports. Missing `md` is
+ * mirrored from `lg`. Consumer-supplied breakpoints are preserved verbatim.
+ */
+export function buildResponsiveLayouts(layouts, { cols = 12 } = {}) {
+    const lg = layouts.lg ?? [];
+    const result = { lg };
+    for (const bp of RESPONSIVE_BREAKPOINTS) {
+        if (bp === 'lg')
+            continue;
+        const supplied = layouts[bp];
+        if (supplied) {
+            result[bp] = supplied;
+            continue;
+        }
+        if (bp === 'md') {
+            result[bp] = lg;
+            continue;
+        }
+        result[bp] = stackToSingleColumn(lg, cols);
+    }
+    for (const bp of Object.keys(layouts)) {
+        if (!(bp in result)) {
+            result[bp] = layouts[bp];
+        }
+    }
+    return result;
+}

package/dist/index.d.ts

@@ -1,6 +1,8 @@
 export { PageGridLayout } from './PageGridLayout.js';
 export { usePageGridLayout, DEFAULT_EDITOR_EVENT_NAMES } from './usePageGridLayout.js';
 export { rescaleLayout } from './rescaleLayout.js';
+export { buildResponsiveLayouts, RESPONSIVE_BREAKPOINTS, } from './buildResponsiveLayouts.js';
+export type { BuildResponsiveLayoutsOptions, ResponsiveBreakpoint, } from './buildResponsiveLayouts.js';
 export { useLocalPreference, defaultPreferenceAdapter } from './preferences.js';
 export type { EntityWidgetDetail, EntityWidgetFactoryOptions, GridLayoutItem, GridLayouts, PageGridLayoutProps, PageGridPreferenceAdapter, PageGridPreferenceFactory, UsePageGridLayoutOptions, UsePageGridLayoutResult, WidgetMeta, } from './types.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,0BAA0B,EAAE,MAAM,wBAAwB,CAAC;AACvF,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAChF,YAAY,EACV,kBAAkB,EAClB,0BAA0B,EAC1B,cAAc,EACd,WAAW,EACX,mBAAmB,EACnB,yBAAyB,EACzB,yBAAyB,EACzB,wBAAwB,EACxB,uBAAuB,EACvB,UAAU,GACX,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,0BAA0B,EAAE,MAAM,wBAAwB,CAAC;AACvF,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EACL,sBAAsB,EACtB,sBAAsB,GACvB,MAAM,6BAA6B,CAAC;AACrC,YAAY,EACV,6BAA6B,EAC7B,oBAAoB,GACrB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,kBAAkB,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAChF,YAAY,EACV,kBAAkB,EAClB,0BAA0B,EAC1B,cAAc,EACd,WAAW,EACX,mBAAmB,EACnB,yBAAyB,EACzB,yBAAyB,EACzB,wBAAwB,EACxB,uBAAuB,EACvB,UAAU,GACX,MAAM,YAAY,CAAC"}

package/dist/index.js

@@ -1,4 +1,5 @@
 export { PageGridLayout } from './PageGridLayout.js';
 export { usePageGridLayout, DEFAULT_EDITOR_EVENT_NAMES } from './usePageGridLayout.js';
 export { rescaleLayout } from './rescaleLayout.js';
+export { buildResponsiveLayouts, RESPONSIVE_BREAKPOINTS, } from './buildResponsiveLayouts.js';
 export { useLocalPreference, defaultPreferenceAdapter } from './preferences.js';

package/dist/usePageGridLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePageGridLayout.d.ts","sourceRoot":"","sources":["../src/usePageGridLayout.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAGV,wBAAwB,EACxB,uBAAuB,EACxB,MAAM,YAAY,CAAC;AAEpB,eAAO,MAAM,0BAA0B,2IAM7B,CAAC;AAEX,wBAAgB,iBAAiB,CAAC,EAChC,OAAO,EACP,cAAc,EACd,WAAgB,EAChB,aAAiB,EACjB,WAAkB,EAClB,gBAA6C,EAC7C,iBAA4C,GAC7C,EAAE,wBAAwB,GAAG,uBAAuB,CA4NpD"}
+{"version":3,"file":"usePageGridLayout.d.ts","sourceRoot":"","sources":["../src/usePageGridLayout.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAGV,wBAAwB,EACxB,uBAAuB,EACxB,MAAM,YAAY,CAAC;AAEpB,eAAO,MAAM,0BAA0B,2IAM7B,CAAC;AAEX,wBAAgB,iBAAiB,CAAC,EAChC,OAAO,EACP,cAAc,EACd,WAAgB,EAChB,aAAiB,EACjB,WAAkB,EAClB,gBAA6C,EAC7C,iBAA4C,GAC7C,EAAE,wBAAwB,GAAG,uBAAuB,CA6NpD"}

package/dist/usePageGridLayout.js

@@ -1,5 +1,6 @@
 import { startTransition, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, } from 'react';
 import { noCompactor, verticalCompactor } from 'react-grid-layout';
+import { buildResponsiveLayouts } from './buildResponsiveLayouts.js';
 import { defaultPreferenceAdapter } from './preferences.js';
 import { rescaleLayout } from './rescaleLayout.js';
 export const DEFAULT_EDITOR_EVENT_NAMES = [
@@ -87,9 +88,8 @@ export function usePageGridLayout({ pageKey, defaultLayouts, defaultCols = 12, l
         return changed ? merged : savedLayout;
     }, [savedLayout, defaultLayouts]);
     const currentLayouts = useMemo(() => {
-        if (baseCols !== layoutCols)
-            return rescaleLayout(rawLayouts, baseCols, layoutCols);
-        return rawLayouts;
+        const rescaled = baseCols !== layoutCols ? rescaleLayout(rawLayouts, baseCols, layoutCols) : rawLayouts;
+        return buildResponsiveLayouts(rescaled, { cols: layoutCols });
     }, [rawLayouts, baseCols, layoutCols]);
     useEffect(() => {
         if (baseCols !== layoutCols) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bsuite/page-builder",
-  "version": "0.1.0",
+  "version": "0.2.1",
   "description": "Shared BSuite responsive page-builder grid and layout persistence primitives",
   "type": "module",
   "license": "UNLICENSED",
@@ -9,7 +9,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/GaryOcean428/bsuite.git",
+    "url": "git+https://github.com/GaryOcean428/bsuite.git",
     "directory": "packages/page-builder"
   },
   "files": [
@@ -55,12 +55,13 @@
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
-    "@types/react": "^18.3.28",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
     "@vitejs/plugin-react": "^5.2.0",
     "jsdom": "^28.1.0",
     "lucide-react": "^0.576.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
     "react-grid-layout": "^2.2.2",
     "react-resizable": "^3.0.5",
     "typescript": "~5.7.3",