@wordpress/grid 0.1.1-next.v.202606191442.0

package/build/dashboard-lanes/lane-placement.cjs

@@ -0,0 +1,110 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/grid/src/dashboard-lanes/lane-placement.ts
+var lane_placement_exports = {};
+__export(lane_placement_exports, {
+  computeLanePlacements: () => computeLanePlacements
+});
+module.exports = __toCommonJS(lane_placement_exports);
+function clampSpan(span, lanes) {
+  if (!Number.isFinite(span)) {
+    return 1;
+  }
+  return Math.max(1, Math.min(Math.floor(span), lanes));
+}
+function clampLane(lane, span, lanes) {
+  if (!Number.isFinite(lane)) {
+    return 0;
+  }
+  return Math.max(0, Math.min(Math.floor(lane), lanes - span));
+}
+function maxBaselineAcross(laneBottoms, startLane, span) {
+  let maxBaseline = 0;
+  for (let i = startLane; i < startLane + span; i++) {
+    if (laneBottoms[i] > maxBaseline) {
+      maxBaseline = laneBottoms[i];
+    }
+  }
+  return maxBaseline;
+}
+function computeLanePlacements(input) {
+  const lanes = Math.max(1, Math.floor(input.lanes));
+  const gap = Math.max(0, input.gap);
+  const tolerance = Math.max(0, input.flowTolerance);
+  const laneBottoms = new Array(lanes).fill(0);
+  const placements = /* @__PURE__ */ new Map();
+  const explicitItems = [];
+  const autoItems = [];
+  for (const item of input.items) {
+    if (item.lane !== void 0) {
+      explicitItems.push(item);
+    } else {
+      autoItems.push(item);
+    }
+  }
+  for (const item of explicitItems) {
+    const span = clampSpan(item.span, lanes);
+    const lane = clampLane(item.lane, span, lanes);
+    const baseline = maxBaselineAcross(laneBottoms, lane, span);
+    const top = baseline === 0 ? 0 : baseline + gap;
+    const height = Math.max(0, item.height);
+    placements.set(item.key, { key: item.key, lane, top, span });
+    const newBottom = top + height;
+    for (let i = lane; i < lane + span; i++) {
+      laneBottoms[i] = newBottom;
+    }
+  }
+  for (const item of autoItems) {
+    const span = clampSpan(item.span, lanes);
+    let bestLane = 0;
+    let bestBaseline = Infinity;
+    for (let candidate = 0; candidate <= lanes - span; candidate++) {
+      const baseline = maxBaselineAcross(laneBottoms, candidate, span);
+      if (bestBaseline - baseline > tolerance) {
+        bestBaseline = baseline;
+        bestLane = candidate;
+      }
+    }
+    const top = bestBaseline === 0 ? 0 : bestBaseline + gap;
+    const height = Math.max(0, item.height);
+    placements.set(item.key, {
+      key: item.key,
+      lane: bestLane,
+      top,
+      span
+    });
+    const newBottom = top + height;
+    for (let i = bestLane; i < bestLane + span; i++) {
+      laneBottoms[i] = newBottom;
+    }
+  }
+  let totalHeight = 0;
+  for (const bottom of laneBottoms) {
+    if (bottom > totalHeight) {
+      totalHeight = bottom;
+    }
+  }
+  return { placements, totalHeight };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  computeLanePlacements
+});
+//# sourceMappingURL=lane-placement.cjs.map

package/build/dashboard-lanes/lane-placement.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/dashboard-lanes/lane-placement.ts"],
+  "sourcesContent": ["/**\n * Lane placement algorithm for `display: grid-lanes` polyfill.\n *\n * Implements the source-ordered, shortest-lane placement described in\n * https://webkit.org/blog/17660/introducing-css-grid-lanes/.\n *\n * The skyline + tolerance core is adapted from the CSS Grid Lanes\n * Polyfill by Simon Willison (MIT,\n * https://tools.simonwillison.net/grid-lanes-polyfill.js). The rest\n * of this module is a pure function suitable for unit testing in\n * isolation from any DOM.\n *\n * Concepts:\n * - \"Lane\" is the cross-axis track: a column in waterfall mode, a row\n *   in brick mode. The algorithm is axis-agnostic; the renderer maps\n *   the chosen lane index plus offset to `grid-column-start` /\n *   `grid-row-start` (or vice versa).\n * - Items are placed in source order. Explicit-lane items are placed\n *   first so auto-placed items can flow around them.\n * - `flowTolerance` is a length: when two candidate lanes differ in\n *   baseline by no more than this, the earlier lane wins (preserves\n *   reading order).\n */\n\n/**\n * A single item to place. Heights are pre-measured by the caller.\n */\nexport type LanePlacementItem = {\n\t/**\n\t * Stable identity. Returned in the result map.\n\t */\n\tkey: string;\n\n\t/**\n\t * Number of contiguous lanes this item occupies. Clamped to\n\t * `[ 1, lanes ]` by the algorithm.\n\t */\n\tspan: number;\n\n\t/**\n\t * Measured cross-axis size (typically pixels). The algorithm only\n\t * adds and compares heights; the unit is whatever the caller uses,\n\t * as long as `gap` and `flowTolerance` use the same one.\n\t */\n\theight: number;\n\n\t/**\n\t * Explicit 0-indexed starting lane. When set, the item bypasses\n\t * the skyline lookup and is placed at this lane regardless of\n\t * source order. Out-of-range values are clamped.\n\t */\n\tlane?: number;\n};\n\n/**\n * Algorithm input.\n */\nexport type LanePlacementInput = {\n\t/**\n\t * Items in source order.\n\t */\n\titems: ReadonlyArray< LanePlacementItem >;\n\n\t/**\n\t * Total number of lanes. Clamped to `>= 1`.\n\t */\n\tlanes: number;\n\n\t/**\n\t * Gap between items in the same lane. Same unit as `height`.\n\t */\n\tgap: number;\n\n\t/**\n\t * Tolerance for source-order tiebreaking. When two candidate\n\t * lanes have baselines within this amount, the earlier lane wins.\n\t * Defaults to `0` if a negative value is passed.\n\t */\n\tflowTolerance: number;\n};\n\n/**\n * Resolved position for a single item.\n */\nexport type LanePlacement = {\n\t/**\n\t * Mirrors the input key.\n\t */\n\tkey: string;\n\n\t/**\n\t * 0-indexed starting lane. The renderer adds 1 for\n\t * `grid-column-start`.\n\t */\n\tlane: number;\n\n\t/**\n\t * Cross-axis offset from the container's start edge, in the same\n\t * unit as the input heights. Use as the item's start position\n\t * (e.g. `top`, or `grid-row-start` after dividing by a row unit).\n\t */\n\ttop: number;\n\n\t/**\n\t * Effective span after clamping. Useful for the renderer when the\n\t * input span exceeded the lane count.\n\t */\n\tspan: number;\n};\n\n/**\n * Algorithm output.\n */\nexport type LanePlacementResult = {\n\t/**\n\t * Per-key placement. Insertion-ordered: the first iteration yields\n\t * the explicit items in source order, then the auto items in\n\t * source order.\n\t */\n\tplacements: Map< string, LanePlacement >;\n\n\t/**\n\t * Sum of the tallest lane after all items are placed. The renderer\n\t * applies this as the container's intrinsic height.\n\t */\n\ttotalHeight: number;\n};\n\nfunction clampSpan( span: number, lanes: number ): number {\n\tif ( ! Number.isFinite( span ) ) {\n\t\treturn 1;\n\t}\n\treturn Math.max( 1, Math.min( Math.floor( span ), lanes ) );\n}\n\nfunction clampLane( lane: number, span: number, lanes: number ): number {\n\tif ( ! Number.isFinite( lane ) ) {\n\t\treturn 0;\n\t}\n\treturn Math.max( 0, Math.min( Math.floor( lane ), lanes - span ) );\n}\n\nfunction maxBaselineAcross(\n\tlaneBottoms: ReadonlyArray< number >,\n\tstartLane: number,\n\tspan: number\n): number {\n\tlet maxBaseline = 0;\n\tfor ( let i = startLane; i < startLane + span; i++ ) {\n\t\tif ( laneBottoms[ i ] > maxBaseline ) {\n\t\t\tmaxBaseline = laneBottoms[ i ];\n\t\t}\n\t}\n\treturn maxBaseline;\n}\n\n/**\n * Places all items into a fixed lane count using the grid-lanes\n * algorithm: explicit items first, then auto items chosen by the\n * shortest-lane skyline with a tolerance for source order.\n *\n * Pure: no DOM access, no mutation of inputs. Safe to call from a\n * worker or during SSR.\n *\n * @param input Items, lane count, gap, and tolerance.\n * @return Per-key placements plus the resulting total height.\n */\nexport function computeLanePlacements(\n\tinput: LanePlacementInput\n): LanePlacementResult {\n\tconst lanes = Math.max( 1, Math.floor( input.lanes ) );\n\tconst gap = Math.max( 0, input.gap );\n\tconst tolerance = Math.max( 0, input.flowTolerance );\n\n\tconst laneBottoms = new Array< number >( lanes ).fill( 0 );\n\tconst placements = new Map< string, LanePlacement >();\n\n\tconst explicitItems: LanePlacementItem[] = [];\n\tconst autoItems: LanePlacementItem[] = [];\n\tfor ( const item of input.items ) {\n\t\tif ( item.lane !== undefined ) {\n\t\t\texplicitItems.push( item );\n\t\t} else {\n\t\t\tautoItems.push( item );\n\t\t}\n\t}\n\n\tfor ( const item of explicitItems ) {\n\t\tconst span = clampSpan( item.span, lanes );\n\t\tconst lane = clampLane( item.lane as number, span, lanes );\n\t\tconst baseline = maxBaselineAcross( laneBottoms, lane, span );\n\t\tconst top = baseline === 0 ? 0 : baseline + gap;\n\t\tconst height = Math.max( 0, item.height );\n\n\t\tplacements.set( item.key, { key: item.key, lane, top, span } );\n\n\t\tconst newBottom = top + height;\n\t\tfor ( let i = lane; i < lane + span; i++ ) {\n\t\t\tlaneBottoms[ i ] = newBottom;\n\t\t}\n\t}\n\n\tfor ( const item of autoItems ) {\n\t\tconst span = clampSpan( item.span, lanes );\n\t\tlet bestLane = 0;\n\t\tlet bestBaseline = Infinity;\n\n\t\tfor ( let candidate = 0; candidate <= lanes - span; candidate++ ) {\n\t\t\tconst baseline = maxBaselineAcross( laneBottoms, candidate, span );\n\n\t\t\t// Only take a lane that is strictly shorter beyond\n\t\t\t// tolerance. Within-tolerance ties keep the earlier lane\n\t\t\t// because candidates iterate in lane order, so the first\n\t\t\t// acceptable baseline wins.\n\t\t\tif ( bestBaseline - baseline > tolerance ) {\n\t\t\t\tbestBaseline = baseline;\n\t\t\t\tbestLane = candidate;\n\t\t\t}\n\t\t}\n\n\t\tconst top = bestBaseline === 0 ? 0 : bestBaseline + gap;\n\t\tconst height = Math.max( 0, item.height );\n\n\t\tplacements.set( item.key, {\n\t\t\tkey: item.key,\n\t\t\tlane: bestLane,\n\t\t\ttop,\n\t\t\tspan,\n\t\t} );\n\n\t\tconst newBottom = top + height;\n\t\tfor ( let i = bestLane; i < bestLane + span; i++ ) {\n\t\t\tlaneBottoms[ i ] = newBottom;\n\t\t}\n\t}\n\n\tlet totalHeight = 0;\n\tfor ( const bottom of laneBottoms ) {\n\t\tif ( bottom > totalHeight ) {\n\t\t\ttotalHeight = bottom;\n\t\t}\n\t}\n\n\treturn { placements, totalHeight };\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgIA,SAAS,UAAW,MAAc,OAAwB;AACzD,MAAK,CAAE,OAAO,SAAU,IAAK,GAAI;AAChC,WAAO;AAAA,EACR;AACA,SAAO,KAAK,IAAK,GAAG,KAAK,IAAK,KAAK,MAAO,IAAK,GAAG,KAAM,CAAE;AAC3D;AAEA,SAAS,UAAW,MAAc,MAAc,OAAwB;AACvE,MAAK,CAAE,OAAO,SAAU,IAAK,GAAI;AAChC,WAAO;AAAA,EACR;AACA,SAAO,KAAK,IAAK,GAAG,KAAK,IAAK,KAAK,MAAO,IAAK,GAAG,QAAQ,IAAK,CAAE;AAClE;AAEA,SAAS,kBACR,aACA,WACA,MACS;AACT,MAAI,cAAc;AAClB,WAAU,IAAI,WAAW,IAAI,YAAY,MAAM,KAAM;AACpD,QAAK,YAAa,CAAE,IAAI,aAAc;AACrC,oBAAc,YAAa,CAAE;AAAA,IAC9B;AAAA,EACD;AACA,SAAO;AACR;AAaO,SAAS,sBACf,OACsB;AACtB,QAAM,QAAQ,KAAK,IAAK,GAAG,KAAK,MAAO,MAAM,KAAM,CAAE;AACrD,QAAM,MAAM,KAAK,IAAK,GAAG,MAAM,GAAI;AACnC,QAAM,YAAY,KAAK,IAAK,GAAG,MAAM,aAAc;AAEnD,QAAM,cAAc,IAAI,MAAiB,KAAM,EAAE,KAAM,CAAE;AACzD,QAAM,aAAa,oBAAI,IAA6B;AAEpD,QAAM,gBAAqC,CAAC;AAC5C,QAAM,YAAiC,CAAC;AACxC,aAAY,QAAQ,MAAM,OAAQ;AACjC,QAAK,KAAK,SAAS,QAAY;AAC9B,oBAAc,KAAM,IAAK;AAAA,IAC1B,OAAO;AACN,gBAAU,KAAM,IAAK;AAAA,IACtB;AAAA,EACD;AAEA,aAAY,QAAQ,eAAgB;AACnC,UAAM,OAAO,UAAW,KAAK,MAAM,KAAM;AACzC,UAAM,OAAO,UAAW,KAAK,MAAgB,MAAM,KAAM;AACzD,UAAM,WAAW,kBAAmB,aAAa,MAAM,IAAK;AAC5D,UAAM,MAAM,aAAa,IAAI,IAAI,WAAW;AAC5C,UAAM,SAAS,KAAK,IAAK,GAAG,KAAK,MAAO;AAExC,eAAW,IAAK,KAAK,KAAK,EAAE,KAAK,KAAK,KAAK,MAAM,KAAK,KAAK,CAAE;AAE7D,UAAM,YAAY,MAAM;AACxB,aAAU,IAAI,MAAM,IAAI,OAAO,MAAM,KAAM;AAC1C,kBAAa,CAAE,IAAI;AAAA,IACpB;AAAA,EACD;AAEA,aAAY,QAAQ,WAAY;AAC/B,UAAM,OAAO,UAAW,KAAK,MAAM,KAAM;AACzC,QAAI,WAAW;AACf,QAAI,eAAe;AAEnB,aAAU,YAAY,GAAG,aAAa,QAAQ,MAAM,aAAc;AACjE,YAAM,WAAW,kBAAmB,aAAa,WAAW,IAAK;AAMjE,UAAK,eAAe,WAAW,WAAY;AAC1C,uBAAe;AACf,mBAAW;AAAA,MACZ;AAAA,IACD;AAEA,UAAM,MAAM,iBAAiB,IAAI,IAAI,eAAe;AACpD,UAAM,SAAS,KAAK,IAAK,GAAG,KAAK,MAAO;AAExC,eAAW,IAAK,KAAK,KAAK;AAAA,MACzB,KAAK,KAAK;AAAA,MACV,MAAM;AAAA,MACN;AAAA,MACA;AAAA,IACD,CAAE;AAEF,UAAM,YAAY,MAAM;AACxB,aAAU,IAAI,UAAU,IAAI,WAAW,MAAM,KAAM;AAClD,kBAAa,CAAE,IAAI;AAAA,IACpB;AAAA,EACD;AAEA,MAAI,cAAc;AAClB,aAAY,UAAU,aAAc;AACnC,QAAK,SAAS,aAAc;AAC3B,oBAAc;AAAA,IACf;AAAA,EACD;AAEA,SAAO,EAAE,YAAY,YAAY;AAClC;",
+  "names": []
+}

package/build/dashboard-lanes/lanes-item.cjs

@@ -0,0 +1,295 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/grid/src/dashboard-lanes/lanes-item.tsx
+var lanes_item_exports = {};
+__export(lanes_item_exports, {
+  LanesItem: () => LanesItem
+});
+module.exports = __toCommonJS(lanes_item_exports);
+var import_sortable = require("@dnd-kit/sortable");
+var import_clsx = __toESM(require("clsx"));
+var import_element = require("@wordpress/element");
+var import_compose = require("@wordpress/compose");
+
+// packages/style-runtime/src/index.ts
+var STYLE_HASH_ATTRIBUTE = "data-wp-hash";
+function getRuntime() {
+  const globalScope = globalThis;
+  if (globalScope.__wpStyleRuntime) {
+    return globalScope.__wpStyleRuntime;
+  }
+  globalScope.__wpStyleRuntime = {
+    documents: /* @__PURE__ */ new Map(),
+    styles: /* @__PURE__ */ new Map(),
+    injectedStyles: /* @__PURE__ */ new WeakMap()
+  };
+  if (typeof document !== "undefined") {
+    registerDocument(document);
+  }
+  return globalScope.__wpStyleRuntime;
+}
+function documentContainsStyleHash(targetDocument, hash) {
+  if (!targetDocument.head) {
+    return false;
+  }
+  for (const style of targetDocument.head.querySelectorAll(
+    `style[${STYLE_HASH_ATTRIBUTE}]`
+  )) {
+    if (style.getAttribute(STYLE_HASH_ATTRIBUTE) === hash) {
+      return true;
+    }
+  }
+  return false;
+}
+function injectStyle(targetDocument, hash, css) {
+  if (!targetDocument.head) {
+    return;
+  }
+  const runtime = getRuntime();
+  let injectedStyles = runtime.injectedStyles.get(targetDocument);
+  if (!injectedStyles) {
+    injectedStyles = /* @__PURE__ */ new Set();
+    runtime.injectedStyles.set(targetDocument, injectedStyles);
+  }
+  if (injectedStyles.has(hash)) {
+    return;
+  }
+  if (documentContainsStyleHash(targetDocument, hash)) {
+    injectedStyles.add(hash);
+    return;
+  }
+  const style = targetDocument.createElement("style");
+  style.setAttribute(STYLE_HASH_ATTRIBUTE, hash);
+  style.appendChild(targetDocument.createTextNode(css));
+  targetDocument.head.appendChild(style);
+  injectedStyles.add(hash);
+}
+function registerDocument(targetDocument) {
+  const runtime = getRuntime();
+  runtime.documents.set(
+    targetDocument,
+    (runtime.documents.get(targetDocument) ?? 0) + 1
+  );
+  for (const [hash, css] of runtime.styles) {
+    injectStyle(targetDocument, hash, css);
+  }
+  return () => {
+    const count = runtime.documents.get(targetDocument);
+    if (count === void 0) {
+      return;
+    }
+    if (count <= 1) {
+      runtime.documents.delete(targetDocument);
+      return;
+    }
+    runtime.documents.set(targetDocument, count - 1);
+  };
+}
+function registerStyle(hash, css) {
+  const runtime = getRuntime();
+  runtime.styles.set(hash, css);
+  for (const targetDocument of runtime.documents.keys()) {
+    injectStyle(targetDocument, hash, css);
+  }
+}
+
+// packages/grid/src/shared/actionable-area-slot.module.css
+if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
+  registerStyle("ac1094954c", "._1c54fe8165d3023e__actionable-area-slot{opacity:1}@media (prefers-reduced-motion:no-preference){._1c54fe8165d3023e__actionable-area-slot{transition:opacity var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-subtle,cubic-bezier(.15,0,.15,1))}}[data-wp-grid-resizing] ._1c54fe8165d3023e__actionable-area-slot{opacity:0;pointer-events:none}");
+}
+var actionable_area_slot_default = { "actionable-area-slot": "_1c54fe8165d3023e__actionable-area-slot" };
+
+// packages/grid/src/dashboard-lanes/lanes-item.tsx
+var import_resize_handle = __toESM(require("../shared/resize-handle.cjs"));
+var import_resize_snap = require("../shared/resize-snap.cjs");
+var import_grid_item_key = require("../shared/grid-item-key.cjs");
+
+// packages/grid/src/dashboard-lanes/lanes-item.module.css
+if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
+  registerStyle("97a2a51c0b", "._0a62d9f1dff8c7d8__item{position:relative}._20c43fcd930d828a__item-content{height:100%;position:relative}._11928ee35f1a9519__is-resizing{overflow:visible;z-index:1}._11928ee35f1a9519__is-resizing ._20c43fcd930d828a__item-content{overflow:visible;position:relative;z-index:2}.b7fc83c8b16e9ee5__is-dragging{pointer-events:none}[data-wp-grid-dragging] .b7fc83c8b16e9ee5__is-dragging{border-radius:var(--wp-grid-placeholder-radius,0)}@media not (prefers-reduced-motion:reduce){[data-wp-grid-dragging] .b7fc83c8b16e9ee5__is-dragging{animation:b026dda570d0eea0__wp-grid-item-placeholder-in 0ms linear var(--wpds-motion-duration-sm,.1s) forwards;opacity:1;outline-color:transparent;outline-style:var(--wp-grid-placeholder-outline-style,dashed);outline-width:0}@keyframes b026dda570d0eea0__wp-grid-item-placeholder-in{to{opacity:var(--wp-grid-placeholder-opacity,.4);outline-color:var(--wp-grid-placeholder-outline-color,var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9)));outline-width:var(--wpds-border-width-sm,2px)}}}@media (prefers-reduced-motion:reduce){[data-wp-grid-dragging] .b7fc83c8b16e9ee5__is-dragging{opacity:var(--wp-grid-placeholder-opacity,.4);outline:var(--wpds-border-width-sm,2px) var(--wp-grid-placeholder-outline-style,dashed) var(--wp-grid-placeholder-outline-color,var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9)))}}@media (forced-colors:active){[data-wp-grid-dragging] .b7fc83c8b16e9ee5__is-dragging{--wp-grid-placeholder-outline-color:Highlight}}.cd44faab32c27168__preview-overlay{background:transparent;border:var(--wpds-border-width-sm,2px) var(--wp-grid-resize-preview-outline-style,solid) var(--wp-grid-placeholder-outline-color,var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9)));box-sizing:border-box;inset-inline-start:0;pointer-events:none;position:absolute;top:0;z-index:0}@media (forced-colors:active){.cd44faab32c27168__preview-overlay{border-color:Highlight}}");
+}
+var lanes_item_default = { "item": "_0a62d9f1dff8c7d8__item", "item-content": "_20c43fcd930d828a__item-content", "is-resizing": "_11928ee35f1a9519__is-resizing", "is-dragging": "b7fc83c8b16e9ee5__is-dragging", "wp-grid-item-placeholder-in": "b026dda570d0eea0__wp-grid-item-placeholder-in", "preview-overlay": "cd44faab32c27168__preview-overlay" };
+
+// packages/grid/src/dashboard-lanes/lanes-item.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function getItemCursor(disabled, interacting) {
+  if (disabled) {
+    return "default";
+  }
+  if (interacting) {
+    return void 0;
+  }
+  return "grab";
+}
+function LanesItem({
+  itemKey,
+  placementStyle,
+  disabled = false,
+  interacting = false,
+  children,
+  actionableArea = null,
+  onResize,
+  onResizeEnd,
+  resizeSnapPreview = null,
+  minResizeWidthPx,
+  renderResizeHandle,
+  dragging = false
+}) {
+  const [resizeDelta, setResizeDelta] = (0, import_element.useState)(
+    null
+  );
+  const [initialContentSize, setInitialContentSize] = (0, import_element.useState)(null);
+  const itemRef = (0, import_element.useRef)(null);
+  const contentRef = (0, import_element.useRef)(null);
+  const {
+    attributes,
+    listeners,
+    setNodeRef,
+    setActivatorNodeRef,
+    isDragging
+  } = (0, import_sortable.useSortable)({
+    id: itemKey,
+    disabled
+  });
+  const mergedRef = (0, import_compose.useMergeRefs)([itemRef, setNodeRef]);
+  const contentMergedRef = (0, import_compose.useMergeRefs)([contentRef]);
+  const style = {
+    ...placementStyle,
+    alignSelf: "start"
+  };
+  const isResizing = resizeDelta !== null;
+  const itemClassName = (0, import_clsx.default)(
+    lanes_item_default.item,
+    isDragging && lanes_item_default["is-dragging"],
+    isResizing && lanes_item_default["is-resizing"]
+  );
+  const handleResize = (delta) => {
+    const contentNode = contentRef.current;
+    let baselineSize = initialContentSize;
+    if (contentNode && !baselineSize) {
+      const { width, height } = contentNode.getBoundingClientRect();
+      baselineSize = { width, height };
+      setInitialContentSize(baselineSize);
+    }
+    let clamped = { width: delta.width, height: 0 };
+    if (baselineSize) {
+      clamped = (0, import_resize_snap.clampResizeDelta)(clamped, baselineSize, {
+        width: minResizeWidthPx
+      });
+    }
+    setResizeDelta(clamped);
+    onResize(itemKey, clamped);
+  };
+  const handleResizeEnd = () => {
+    setResizeDelta(null);
+    setInitialContentSize(null);
+    onResizeEnd();
+  };
+  const continuousContentStyle = resizeDelta && initialContentSize ? {
+    width: initialContentSize.width + resizeDelta.width
+  } : void 0;
+  const previewOverlay = resizeSnapPreview ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: lanes_item_default["preview-overlay"],
+      style: {
+        width: resizeSnapPreview.widthPx,
+        height: resizeSnapPreview.heightPx ?? "100%"
+      }
+    }
+  ) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      ref: mergedRef,
+      className: itemClassName,
+      style,
+      ...{ [import_grid_item_key.GRID_ITEM_DATA_KEY]: itemKey },
+      "data-wp-grid-item-resizing": isResizing || void 0,
+      children: [
+        actionableArea ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "div",
+          {
+            className: actionable_area_slot_default["actionable-area-slot"],
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "div",
+              {
+                style: { display: "contents" },
+                ...dragging ? { inert: "" } : {},
+                children: actionableArea
+              }
+            )
+          }
+        ) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "div",
+          {
+            ref: setActivatorNodeRef,
+            ...attributes,
+            ...listeners,
+            style: {
+              height: "100%",
+              cursor: getItemCursor(disabled, interacting)
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+                "div",
+                {
+                  ref: contentMergedRef,
+                  className: lanes_item_default["item-content"],
+                  style: continuousContentStyle,
+                  children: [
+                    children,
+                    !disabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_resize_handle.default,
+                      {
+                        itemId: itemKey,
+                        verticalResizable: false,
+                        onResize: handleResize,
+                        onResizeEnd: handleResizeEnd,
+                        renderResizeHandle
+                      }
+                    )
+                  ]
+                }
+              ),
+              previewOverlay
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  LanesItem
+});
+//# sourceMappingURL=lanes-item.cjs.map

package/build/dashboard-lanes/lanes-item.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/dashboard-lanes/lanes-item.tsx", "../../../style-runtime/src/index.ts", "../../src/shared/actionable-area-slot.module.css", "../../src/dashboard-lanes/lanes-item.module.css"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport { useSortable } from '@dnd-kit/sortable';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport actionableAreaStyles from '../shared/actionable-area-slot.module.css';\nimport ResizeHandle from '../shared/resize-handle';\nimport { clampResizeDelta, type ResizeSnapSize } from '../shared/resize-snap';\nimport { GRID_ITEM_DATA_KEY } from '../shared/grid-item-key';\nimport type { ResizeDelta, ResizeHandleRenderProps } from '../shared/types';\nimport styles from './lanes-item.module.css';\n\nfunction getItemCursor(\n\tdisabled: boolean,\n\tinteracting: boolean\n): React.CSSProperties[ 'cursor' ] {\n\tif ( disabled ) {\n\t\treturn 'default';\n\t}\n\tif ( interacting ) {\n\t\treturn undefined;\n\t}\n\treturn 'grab';\n}\n\n/**\n * Props for the internal `<LanesItem />` wrapper.\n */\nexport type LanesItemProps = {\n\t/**\n\t * Item key. Forwarded to dnd-kit and emitted as the\n\t * `data-wp-grid-item-key` attribute the hook reads to map measured DOM\n\t * nodes back to logical items.\n\t */\n\titemKey: string;\n\n\t/**\n\t * Inline placement style produced by `useLanePlacement`. On native\n\t * (`display: grid-lanes`), only `gridColumn: span N`. While\n\t * polyfilling, also `gridColumnStart` / `gridRowStart` /\n\t * `gridRowEnd: span N`.\n\t */\n\tplacementStyle: React.CSSProperties;\n\n\t/**\n\t * Whether drag and resize interactions are disabled.\n\t */\n\tdisabled?: boolean;\n\n\t/**\n\t * Whether any tile in the surface is currently being dragged or\n\t * resized. Drives the drag activator cursor.\n\t */\n\tinteracting?: boolean;\n\n\t/**\n\t * Whether a tile drag is in progress. Mutes each tile's\n\t * `actionableArea` with `inert` so hovers on other tiles' controls\n\t * do not steal the gesture.\n\t *\n\t * @default false\n\t */\n\tdragging?: boolean;\n\n\tchildren: React.ReactNode;\n\n\tactionableArea?: React.ReactNode;\n\n\tonResize: ( id: string, delta: ResizeDelta ) => void;\n\n\t/**\n\t * Snapped column span in pixels for the resize-preview outline.\n\t */\n\tresizeSnapPreview?: ResizeSnapSize | null;\n\n\t/**\n\t * Minimum tile width while resizing, in pixels (one column track).\n\t */\n\tminResizeWidthPx: number;\n\n\tonResizeEnd: () => void;\n\n\trenderResizeHandle?: React.ComponentType< ResizeHandleRenderProps >;\n};\n\nexport function LanesItem( {\n\titemKey,\n\tplacementStyle,\n\tdisabled = false,\n\tinteracting = false,\n\tchildren,\n\tactionableArea = null,\n\tonResize,\n\tonResizeEnd,\n\tresizeSnapPreview = null,\n\tminResizeWidthPx,\n\trenderResizeHandle,\n\tdragging = false,\n}: LanesItemProps ) {\n\tconst [ resizeDelta, setResizeDelta ] = useState< ResizeDelta | null >(\n\t\tnull\n\t);\n\tconst [ initialContentSize, setInitialContentSize ] = useState< {\n\t\twidth: number;\n\t\theight: number;\n\t} | null >( null );\n\tconst itemRef = useRef< HTMLDivElement >( null );\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\n\tconst {\n\t\tattributes,\n\t\tlisteners,\n\t\tsetNodeRef,\n\t\tsetActivatorNodeRef,\n\t\tisDragging,\n\t} = useSortable( {\n\t\tid: itemKey,\n\t\tdisabled,\n\t} );\n\tconst mergedRef = useMergeRefs( [ itemRef, setNodeRef ] );\n\tconst contentMergedRef = useMergeRefs( [ contentRef ] );\n\n\tconst style: React.CSSProperties = {\n\t\t...placementStyle,\n\t\talignSelf: 'start',\n\t};\n\n\tconst isResizing = resizeDelta !== null;\n\tconst itemClassName = clsx(\n\t\tstyles.item,\n\t\tisDragging && styles[ 'is-dragging' ],\n\t\tisResizing && styles[ 'is-resizing' ]\n\t);\n\n\tconst handleResize = ( delta: ResizeDelta ) => {\n\t\tconst contentNode = contentRef.current;\n\t\tlet baselineSize = initialContentSize;\n\t\tif ( contentNode && ! baselineSize ) {\n\t\t\tconst { width, height } = contentNode.getBoundingClientRect();\n\t\t\tbaselineSize = { width, height };\n\t\t\tsetInitialContentSize( baselineSize );\n\t\t}\n\t\tlet clamped: ResizeDelta = { width: delta.width, height: 0 };\n\t\tif ( baselineSize ) {\n\t\t\tclamped = clampResizeDelta( clamped, baselineSize, {\n\t\t\t\twidth: minResizeWidthPx,\n\t\t\t} );\n\t\t}\n\t\tsetResizeDelta( clamped );\n\t\tonResize( itemKey, clamped );\n\t};\n\n\tconst handleResizeEnd = () => {\n\t\tsetResizeDelta( null );\n\t\tsetInitialContentSize( null );\n\t\tonResizeEnd();\n\t};\n\n\tconst continuousContentStyle: React.CSSProperties | undefined =\n\t\tresizeDelta && initialContentSize\n\t\t\t? {\n\t\t\t\t\twidth: initialContentSize.width + resizeDelta.width,\n\t\t\t  }\n\t\t\t: undefined;\n\n\tconst previewOverlay = resizeSnapPreview ? (\n\t\t<div\n\t\t\tclassName={ styles[ 'preview-overlay' ] }\n\t\t\tstyle={ {\n\t\t\t\twidth: resizeSnapPreview.widthPx,\n\t\t\t\theight: resizeSnapPreview.heightPx ?? '100%',\n\t\t\t} }\n\t\t/>\n\t) : null;\n\n\treturn (\n\t\t<div\n\t\t\tref={ mergedRef }\n\t\t\tclassName={ itemClassName }\n\t\t\tstyle={ style }\n\t\t\t{ ...{ [ GRID_ITEM_DATA_KEY ]: itemKey } }\n\t\t\tdata-wp-grid-item-resizing={ isResizing || undefined }\n\t\t>\n\t\t\t{ actionableArea ? (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ actionableAreaStyles[ 'actionable-area-slot' ] }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={ { display: 'contents' } }\n\t\t\t\t\t\t{ ...( dragging ? { inert: '' } : {} ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ actionableArea }\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t) : null }\n\n\t\t\t<div\n\t\t\t\tref={ setActivatorNodeRef }\n\t\t\t\t{ ...attributes }\n\t\t\t\t{ ...listeners }\n\t\t\t\tstyle={ {\n\t\t\t\t\theight: '100%',\n\t\t\t\t\tcursor: getItemCursor( disabled, interacting ),\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tref={ contentMergedRef }\n\t\t\t\t\tclassName={ styles[ 'item-content' ] }\n\t\t\t\t\tstyle={ continuousContentStyle }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t\t{ ! disabled && (\n\t\t\t\t\t\t<ResizeHandle\n\t\t\t\t\t\t\titemId={ itemKey }\n\t\t\t\t\t\t\tverticalResizable={ false }\n\t\t\t\t\t\t\tonResize={ handleResize }\n\t\t\t\t\t\t\tonResizeEnd={ handleResizeEnd }\n\t\t\t\t\t\t\trenderResizeHandle={ renderResizeHandle }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t\t{ previewOverlay }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash           Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash           Stable hash for the transformed CSS.\n * @param css            CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css  CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"ac1094954c\", \"._1c54fe8165d3023e__actionable-area-slot{opacity:1}@media (prefers-reduced-motion:no-preference){._1c54fe8165d3023e__actionable-area-slot{transition:opacity var(--wpds-motion-duration-md,.2s) var(--wpds-motion-easing-subtle,cubic-bezier(.15,0,.15,1))}}[data-wp-grid-resizing] ._1c54fe8165d3023e__actionable-area-slot{opacity:0;pointer-events:none}\");\n}\nexport default {\"actionable-area-slot\":\"_1c54fe8165d3023e__actionable-area-slot\"};\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"97a2a51c0b\", \"._0a62d9f1dff8c7d8__item{position:relative}._20c43fcd930d828a__item-content{height:100%;position:relative}._11928ee35f1a9519__is-resizing{overflow:visible;z-index:1}._11928ee35f1a9519__is-resizing ._20c43fcd930d828a__item-content{overflow:visible;position:relative;z-index:2}.b7fc83c8b16e9ee5__is-dragging{pointer-events:none}[data-wp-grid-dragging] .b7fc83c8b16e9ee5__is-dragging{border-radius:var(--wp-grid-placeholder-radius,0)}@media not (prefers-reduced-motion:reduce){[data-wp-grid-dragging] .b7fc83c8b16e9ee5__is-dragging{animation:b026dda570d0eea0__wp-grid-item-placeholder-in 0ms linear var(--wpds-motion-duration-sm,.1s) forwards;opacity:1;outline-color:transparent;outline-style:var(--wp-grid-placeholder-outline-style,dashed);outline-width:0}@keyframes b026dda570d0eea0__wp-grid-item-placeholder-in{to{opacity:var(--wp-grid-placeholder-opacity,.4);outline-color:var(--wp-grid-placeholder-outline-color,var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9)));outline-width:var(--wpds-border-width-sm,2px)}}}@media (prefers-reduced-motion:reduce){[data-wp-grid-dragging] .b7fc83c8b16e9ee5__is-dragging{opacity:var(--wp-grid-placeholder-opacity,.4);outline:var(--wpds-border-width-sm,2px) var(--wp-grid-placeholder-outline-style,dashed) var(--wp-grid-placeholder-outline-color,var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9)))}}@media (forced-colors:active){[data-wp-grid-dragging] .b7fc83c8b16e9ee5__is-dragging{--wp-grid-placeholder-outline-color:Highlight}}.cd44faab32c27168__preview-overlay{background:transparent;border:var(--wpds-border-width-sm,2px) var(--wp-grid-resize-preview-outline-style,solid) var(--wp-grid-placeholder-outline-color,var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9)));box-sizing:border-box;inset-inline-start:0;pointer-events:none;position:absolute;top:0;z-index:0}@media (forced-colors:active){.cd44faab32c27168__preview-overlay{border-color:Highlight}}\");\n}\nexport default {\"item\":\"_0a62d9f1dff8c7d8__item\",\"item-content\":\"_20c43fcd930d828a__item-content\",\"is-resizing\":\"_11928ee35f1a9519__is-resizing\",\"is-dragging\":\"b7fc83c8b16e9ee5__is-dragging\",\"wp-grid-item-placeholder-in\":\"b026dda570d0eea0__wp-grid-item-placeholder-in\",\"preview-overlay\":\"cd44faab32c27168__preview-overlay\"};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,sBAA4B;AAC5B,kBAAiB;AAKjB,qBAAiC;AACjC,qBAA6B;;;ACA7B,IAAM,uBAAuB;AAU7B,SAAS,aAAa;AACrB,QAAM,cAAc;AAEpB,MAAK,YAAY,kBAAmB;AACnC,WAAO,YAAY;AAAA,EACpB;AAEA,cAAY,mBAAmB;AAAA,IAC9B,WAAW,oBAAI,IAAI;AAAA,IACnB,QAAQ,oBAAI,IAAI;AAAA,IAChB,gBAAgB,oBAAI,QAAQ;AAAA,EAC7B;AAEA,MAAK,OAAO,aAAa,aAAc;AACtC,qBAAkB,QAAS;AAAA,EAC5B;AAEA,SAAO,YAAY;AACpB;AAUA,SAAS,0BACR,gBACA,MACU;AACV,MAAK,CAAE,eAAe,MAAO;AAC5B,WAAO;AAAA,EACR;AAEA,aAAY,SAAS,eAAe,KAAK;AAAA,IACxC,SAAU,oBAAqB;AAAA,EAChC,GAAI;AACH,QAAK,MAAM,aAAc,oBAAqB,MAAM,MAAO;AAC1D,aAAO;AAAA,IACR;AAAA,EACD;AAEA,SAAO;AACR;AAUA,SAAS,YAAa,gBAA0B,MAAc,KAAc;AAC3E,MAAK,CAAE,eAAe,MAAO;AAC5B;AAAA,EACD;AAEA,QAAM,UAAU,WAAW;AAC3B,MAAI,iBAAiB,QAAQ,eAAe,IAAK,cAAe;AAEhE,MAAK,CAAE,gBAAiB;AACvB,qBAAiB,oBAAI,IAAI;AACzB,YAAQ,eAAe,IAAK,gBAAgB,cAAe;AAAA,EAC5D;AAEA,MAAK,eAAe,IAAK,IAAK,GAAI;AACjC;AAAA,EACD;AAKA,MAAK,0BAA2B,gBAAgB,IAAK,GAAI;AACxD,mBAAe,IAAK,IAAK;AACzB;AAAA,EACD;AAEA,QAAM,QAAQ,eAAe,cAAe,OAAQ;AACpD,QAAM,aAAc,sBAAsB,IAAK;AAC/C,QAAM,YAAa,eAAe,eAAgB,GAAI,CAAE;AACxD,iBAAe,KAAK,YAAa,KAAM;AACvC,iBAAe,IAAK,IAAK;AAC1B;AAaO,SAAS,iBAAkB,gBAA2B;AAC5D,QAAM,UAAU,WAAW;AAE3B,UAAQ,UAAU;AAAA,IACjB;AAAA,KACE,QAAQ,UAAU,IAAK,cAAe,KAAK,KAAM;AAAA,EACpD;AAEA,aAAY,CAAE,MAAM,GAAI,KAAK,QAAQ,QAAS;AAC7C,gBAAa,gBAAgB,MAAM,GAAI;AAAA,EACxC;AAEA,SAAO,MAAM;AACZ,UAAM,QAAQ,QAAQ,UAAU,IAAK,cAAe;AAEpD,QAAK,UAAU,QAAY;AAC1B;AAAA,IACD;AAEA,QAAK,SAAS,GAAI;AACjB,cAAQ,UAAU,OAAQ,cAAe;AACzC;AAAA,IACD;AAEA,YAAQ,UAAU,IAAK,gBAAgB,QAAQ,CAAE;AAAA,EAClD;AACD;AAaO,SAAS,cAAe,MAAc,KAAc;AAC1D,QAAM,UAAU,WAAW;AAE3B,UAAQ,OAAO,IAAK,MAAM,GAAI;AAE9B,aAAY,kBAAkB,QAAQ,UAAU,KAAK,GAAI;AACxD,gBAAa,gBAAgB,MAAM,GAAI;AAAA,EACxC;AACD;;;ACpKA,IAAI,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa,QAAQ;AACtE,gBAAc,cAAc,6VAA6V;AAC1X;AACA,IAAO,+BAAQ,EAAC,wBAAuB,0CAAyC;;;AFYhF,2BAAyB;AACzB,yBAAsD;AACtD,2BAAmC;;;AGjBnC,IAAI,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa,QAAQ;AACtE,gBAAc,cAAc,07DAA07D;AACv9D;AACA,IAAO,qBAAQ,EAAC,QAAO,2BAA0B,gBAAe,mCAAkC,eAAc,kCAAiC,eAAc,iCAAgC,+BAA8B,iDAAgD,mBAAkB,oCAAmC;;;AH4KhU;AA1JF,SAAS,cACR,UACA,aACkC;AAClC,MAAK,UAAW;AACf,WAAO;AAAA,EACR;AACA,MAAK,aAAc;AAClB,WAAO;AAAA,EACR;AACA,SAAO;AACR;AA8DO,SAAS,UAAW;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB;AAAA,EACA;AAAA,EACA,WAAW;AACZ,GAAoB;AACnB,QAAM,CAAE,aAAa,cAAe,QAAI;AAAA,IACvC;AAAA,EACD;AACA,QAAM,CAAE,oBAAoB,qBAAsB,QAAI,yBAG1C,IAAK;AACjB,QAAM,cAAU,uBAA0B,IAAK;AAC/C,QAAM,iBAAa,uBAA0B,IAAK;AAElD,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,QAAI,6BAAa;AAAA,IAChB,IAAI;AAAA,IACJ;AAAA,EACD,CAAE;AACF,QAAM,gBAAY,6BAAc,CAAE,SAAS,UAAW,CAAE;AACxD,QAAM,uBAAmB,6BAAc,CAAE,UAAW,CAAE;AAEtD,QAAM,QAA6B;AAAA,IAClC,GAAG;AAAA,IACH,WAAW;AAAA,EACZ;AAEA,QAAM,aAAa,gBAAgB;AACnC,QAAM,oBAAgB,YAAAA;AAAA,IACrB,mBAAO;AAAA,IACP,cAAc,mBAAQ,aAAc;AAAA,IACpC,cAAc,mBAAQ,aAAc;AAAA,EACrC;AAEA,QAAM,eAAe,CAAE,UAAwB;AAC9C,UAAM,cAAc,WAAW;AAC/B,QAAI,eAAe;AACnB,QAAK,eAAe,CAAE,cAAe;AACpC,YAAM,EAAE,OAAO,OAAO,IAAI,YAAY,sBAAsB;AAC5D,qBAAe,EAAE,OAAO,OAAO;AAC/B,4BAAuB,YAAa;AAAA,IACrC;AACA,QAAI,UAAuB,EAAE,OAAO,MAAM,OAAO,QAAQ,EAAE;AAC3D,QAAK,cAAe;AACnB,oBAAU,qCAAkB,SAAS,cAAc;AAAA,QAClD,OAAO;AAAA,MACR,CAAE;AAAA,IACH;AACA,mBAAgB,OAAQ;AACxB,aAAU,SAAS,OAAQ;AAAA,EAC5B;AAEA,QAAM,kBAAkB,MAAM;AAC7B,mBAAgB,IAAK;AACrB,0BAAuB,IAAK;AAC5B,gBAAY;AAAA,EACb;AAEA,QAAM,yBACL,eAAe,qBACZ;AAAA,IACA,OAAO,mBAAmB,QAAQ,YAAY;AAAA,EAC9C,IACA;AAEJ,QAAM,iBAAiB,oBACtB;AAAA,IAAC;AAAA;AAAA,MACA,WAAY,mBAAQ,iBAAkB;AAAA,MACtC,OAAQ;AAAA,QACP,OAAO,kBAAkB;AAAA,QACzB,QAAQ,kBAAkB,YAAY;AAAA,MACvC;AAAA;AAAA,EACD,IACG;AAEJ,SACC;AAAA,IAAC;AAAA;AAAA,MACA,KAAM;AAAA,MACN,WAAY;AAAA,MACZ;AAAA,MACE,GAAG,EAAE,CAAE,uCAAmB,GAAG,QAAQ;AAAA,MACvC,8BAA6B,cAAc;AAAA,MAEzC;AAAA,yBACD;AAAA,UAAC;AAAA;AAAA,YACA,WAAY,6BAAsB,sBAAuB;AAAA,YAEzD;AAAA,cAAC;AAAA;AAAA,gBACA,OAAQ,EAAE,SAAS,WAAW;AAAA,gBAC5B,GAAK,WAAW,EAAE,OAAO,GAAG,IAAI,CAAC;AAAA,gBAEjC;AAAA;AAAA,YACH;AAAA;AAAA,QACD,IACG;AAAA,QAEJ;AAAA,UAAC;AAAA;AAAA,YACA,KAAM;AAAA,YACJ,GAAG;AAAA,YACH,GAAG;AAAA,YACL,OAAQ;AAAA,cACP,QAAQ;AAAA,cACR,QAAQ,cAAe,UAAU,WAAY;AAAA,YAC9C;AAAA,YAEA;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACA,KAAM;AAAA,kBACN,WAAY,mBAAQ,cAAe;AAAA,kBACnC,OAAQ;AAAA,kBAEN;AAAA;AAAA,oBACA,CAAE,YACH;AAAA,sBAAC,qBAAAC;AAAA,sBAAA;AAAA,wBACA,QAAS;AAAA,wBACT,mBAAoB;AAAA,wBACpB,UAAW;AAAA,wBACX,aAAc;AAAA,wBACd;AAAA;AAAA,oBACD;AAAA;AAAA;AAAA,cAEF;AAAA,cACE;AAAA;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACD;AAEF;",
+  "names": ["clsx", "ResizeHandle"]
+}

package/build/dashboard-lanes/types.cjs

@@ -0,0 +1,19 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/grid/src/dashboard-lanes/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);
+//# sourceMappingURL=types.cjs.map

package/build/dashboard-lanes/types.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/dashboard-lanes/types.ts"],
+  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport type {\n\tDragPreviewRenderProps,\n\tGridOverlayRenderProps,\n\tResizeHandleRenderProps,\n} from '../shared/types';\n\n/**\n * Lanes layout item definition.\n *\n * Mirrors the public surface of `display: grid-lanes`: column span,\n * an optional pinned lane, and an optional source order. Heights are\n * content-driven; there is no `height` field. There is no `'fill'`\n * (lanes pack their items by skyline; nothing is \"left over\").\n * `'full'` is expressed by setting `width` to the lane count.\n */\nexport type DashboardLanesLayoutItem = {\n\t/**\n\t * Unique key that matches a child component key.\n\t */\n\tkey: string;\n\n\t/**\n\t * Number of lanes this item spans (`grid-column: span N`). Clamped\n\t * to the surface's lane count.\n\t *\n\t * @default 1\n\t */\n\twidth?: number;\n\n\t/**\n\t * Pin the item to a specific 0-indexed lane. Pinned items are\n\t * placed before auto items, so the auto flow runs around them.\n\t * Out-of-range values (negative, or beyond `columns - width`) are\n\t * clamped to the available range.\n\t */\n\tlane?: number;\n\n\t/**\n\t * Display order. Lower values render first. When omitted, the\n\t * item falls back to its index in the `layout` array.\n\t */\n\torder?: number;\n};\n\n/**\n * Props for `DashboardLanes`.\n *\n * `columns` and `minColumnWidth` compose as a layered model:\n * - `columns` alone: fixed N lanes; tiles scale with the container.\n * - `minColumnWidth` alone: lane count derives from container width,\n *   floored by the per-tile minimum, down to 1.\n * - Both together: `columns` caps the count, `minColumnWidth` enforces\n *   a per-tile width floor that can reduce the count below the cap.\n */\nexport interface DashboardLanesProps\n\textends Omit<\n\t\tReact.ComponentPropsWithoutRef< 'div' >,\n\t\t'children' | 'className' | 'style'\n\t> {\n\t/**\n\t * Array of layout items.\n\t */\n\tlayout: DashboardLanesLayoutItem[];\n\n\t/**\n\t * Surface children. Each child must carry a `key` matching an\n\t * entry in `layout`; children without a match render at the end\n\t * of the surface without explicit placement and fall through the\n\t * lanes auto-flow.\n\t */\n\tchildren: React.ReactNode;\n\n\t/**\n\t * Additional CSS class on the surface root.\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Inline styles on the surface root. Merged underneath the\n\t * surface's own layout styles, so `display` and\n\t * `gridTemplateColumns` always win. The gap between tiles is\n\t * owned by the design-system gap token and is not configurable\n\t * per instance; override it via a theme or density change.\n\t */\n\tstyle?: React.CSSProperties;\n\n\t/**\n\t * `flow-tolerance` value in pixels. When two candidate lanes\n\t * differ in baseline by no more than this, the earlier lane wins\n\t * to preserve source order. Larger values keep tiles closer to\n\t * reading order at the cost of bigger empty regions.\n\t *\n\t * @default 16\n\t */\n\tflowTolerance?: number;\n\n\t/**\n\t * Snap unit for the polyfill's `grid-row-start` / `grid-row-end:\n\t * span N` math. Smaller values produce sharper placement at the\n\t * cost of a larger implicit row count. Ignored on browsers with\n\t * native `display: grid-lanes` support.\n\t *\n\t * @default 4\n\t */\n\trowUnit?: number;\n\n\t/**\n\t * Whether the surface is in edit mode (drag-to-reorder, resize).\n\t *\n\t * @default false\n\t */\n\teditMode?: boolean;\n\n\t/**\n\t * Fired when the user commits a drag or resize.\n\t */\n\tonChangeLayout?: ( newLayout: DashboardLanesLayoutItem[] ) => void;\n\n\t/**\n\t * Fired continuously during a gesture with the in-progress\n\t * layout. The committed result still emits via `onChangeLayout`.\n\t */\n\tonPreviewLayout?: ( previewLayout: DashboardLanesLayoutItem[] ) => void;\n\n\t/**\n\t * Override the default corner resize handle. See `DashboardGrid`\n\t * for the full contract; on lanes the handle is horizontal-only\n\t * because heights are content-driven.\n\t */\n\trenderResizeHandle?: React.ComponentType< ResizeHandleRenderProps >;\n\n\t/**\n\t * Custom wrapper for the dragged-clone visual mounted inside\n\t * `<DragOverlay>`. The surface always wraps the clone with a thin\n\t * functional frame (lift scale, grabbing cursor, pointer pass-\n\t * through) and mounts this component inside it; the consumer\n\t * owns the visual chrome (shadow, radius, padding).\n\t *\n\t * When omitted, the cloned children render directly inside the\n\t * functional frame so any chrome the consumer applied to the\n\t * persistent tile carries through unchanged.\n\t *\n\t * Token-only adjustments (lift scale, placeholder opacity,\n\t * outline color, placeholder radius) flow through CSS custom\n\t * properties documented in the README.\n\t */\n\trenderDragPreview?: React.ComponentType< DragPreviewRenderProps >;\n\n\t/**\n\t * Override the default edit-mode overlay (empty column tracks) with\n\t * a custom component. Lanes are content-driven vertically, so no\n\t * `rowHeight` or `rows` is supplied and the default visual paints\n\t * columns only.\n\t *\n\t * The overlay only renders when `editMode` is true. When omitted,\n\t * the package's default visual is used.\n\t */\n\trenderGridOverlay?: React.ComponentType< GridOverlayRenderProps >;\n\n\t/**\n\t * Target lane count, used as a cap. Defaults to six when neither\n\t * `columns` nor `minColumnWidth` is set; with `minColumnWidth` set\n\t * it can resolve lower on narrow containers.\n\t */\n\tcolumns?: number;\n\n\t/**\n\t * Per-tile minimum width in pixels. Enables responsive mode: the\n\t * lane count derives from container width, floored by this value,\n\t * down to 1.\n\t */\n\tminColumnWidth?: number;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;",
+  "names": []
+}