@bedrock-layout/solid 0.12.1 → 1.1.2

package/lib/index.m.js

@@ -1,61 +1,17 @@
-import { splitProps, createMemo, sharedConfig, untrack, createRenderEffect, createComponent, mergeProps, createContext, useContext, createSignal, onMount, createEffect, onCleanup, children, Switch, Match } from "solid-js";
-import { init, registerCallback } from "@bedrock-layout/register-resize-callback";
-function checkIsCSSLength(str) {
-  if (typeof str !== "string")
-    return false;
-  return [
-    /^[0-9]{0,10000}\.?[0-9]{1,10000}(vmin|vmax|vh|vw|%|ch|ex|em|rem|in|cm|mm|pt|pc|px)$/,
-    /^var\(--\D{1,100}\)$/
-  ].some((regex) => regex.test(str));
-}
-const spacing = {
-  none: "0px",
-  xxs: "0.0625rem",
-  xs: "0.125rem",
-  sm: "0.25rem",
-  md: "0.5rem",
-  mdLg: "0.75rem",
-  lg: "1rem",
-  lgXl: "1.5rem",
-  xl: "2rem",
-  xlXXl: "3rem",
-  xxl: "4rem"
-};
-function fromEntries(entries) {
-  return entries.reduce((acc, [key, value]) => {
-    return { ...acc, [key]: value };
-  }, {});
-}
-const getSpacingValue = (spacingKey, theme) => {
-  var _a, _b;
-  const maybeSpaceingOrDefault = (_b = (_a = theme == null ? void 0 : theme.space) != null ? _a : theme == null ? void 0 : theme.spacing) != null ? _b : spacing;
-  const safeSpacings = fromEntries(
-    Object.entries(maybeSpaceingOrDefault).map(([spaceKey, value]) => [
-      spaceKey,
-      typeof value === "number" ? `${value}px` : value
-    ])
-  );
-  const spacingVal = safeSpacings[spacingKey];
-  const isCSSLength = checkIsCSSLength(spacingVal);
-  return isCSSLength ? spacingVal : void 0;
-};
-const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"];
-const Properties = /* @__PURE__ */ new Set(["className", "value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
-const ChildProperties = /* @__PURE__ */ new Set(["innerHTML", "textContent", "innerText", "children"]);
-const Aliases = {
+import re from "open-props";
+import { createRenderEffect as S, sharedConfig as d, splitProps as V, createMemo as I, untrack as X, createComponent as E, mergeProps as u, createContext as ce, useContext as le, createSignal as z, onMount as q, createEffect as U, onCleanup as Q, children as fe } from "solid-js";
+import { init as J, registerCallback as Y } from "@bedrock-layout/register-resize-callback";
+const ae = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"], ue = /* @__PURE__ */ new Set(["className", "value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...ae]), de = /* @__PURE__ */ new Set(["innerHTML", "textContent", "innerText", "children"]), ye = /* @__PURE__ */ Object.assign(/* @__PURE__ */ Object.create(null), {
   className: "class",
   htmlFor: "for"
-};
-const PropAliases = {
+}), B = /* @__PURE__ */ Object.assign(/* @__PURE__ */ Object.create(null), {
   class: "className",
   formnovalidate: "formNoValidate",
   ismap: "isMap",
   nomodule: "noModule",
   playsinline: "playsInline",
   readonly: "readOnly"
-};
-const DelegatedEvents = /* @__PURE__ */ new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]);
-const SVGElements = /* @__PURE__ */ new Set([
+}), me = /* @__PURE__ */ new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]), he = /* @__PURE__ */ new Set([
   "altGlyph",
   "altGlyphDef",
   "altGlyphItem",
@@ -132,1216 +88,805 @@ const SVGElements = /* @__PURE__ */ new Set([
   "use",
   "view",
   "vkern"
-]);
-const SVGNamespace = {
+]), ge = {
   xlink: "http://www.w3.org/1999/xlink",
   xml: "http://www.w3.org/XML/1998/namespace"
 };
-function reconcileArrays(parentNode, a, b) {
-  let bLength = b.length, aEnd = a.length, bEnd = bLength, aStart = 0, bStart = 0, after = a[aEnd - 1].nextSibling, map = null;
-  while (aStart < aEnd || bStart < bEnd) {
-    if (a[aStart] === b[bStart]) {
-      aStart++;
-      bStart++;
+function be(e, t, n) {
+  let i = n.length, s = t.length, r = i, c = 0, o = 0, l = t[s - 1].nextSibling, f = null;
+  for (; c < s || o < r; ) {
+    if (t[c] === n[o]) {
+      c++, o++;
       continue;
     }
-    while (a[aEnd - 1] === b[bEnd - 1]) {
-      aEnd--;
-      bEnd--;
-    }
-    if (aEnd === aStart) {
-      const node = bEnd < bLength ? bStart ? b[bStart - 1].nextSibling : b[bEnd - bStart] : after;
-      while (bStart < bEnd)
-        parentNode.insertBefore(b[bStart++], node);
-    } else if (bEnd === bStart) {
-      while (aStart < aEnd) {
-        if (!map || !map.has(a[aStart]))
-          a[aStart].remove();
-        aStart++;
-      }
-    } else if (a[aStart] === b[bEnd - 1] && b[bStart] === a[aEnd - 1]) {
-      const node = a[--aEnd].nextSibling;
-      parentNode.insertBefore(b[bStart++], a[aStart++].nextSibling);
-      parentNode.insertBefore(b[--bEnd], node);
-      a[aEnd] = b[bEnd];
+    for (; t[s - 1] === n[r - 1]; )
+      s--, r--;
+    if (s === c) {
+      const a = r < i ? o ? n[o - 1].nextSibling : n[r - o] : l;
+      for (; o < r; )
+        e.insertBefore(n[o++], a);
+    } else if (r === o)
+      for (; c < s; )
+        (!f || !f.has(t[c])) && t[c].remove(), c++;
+    else if (t[c] === n[r - 1] && n[o] === t[s - 1]) {
+      const a = t[--s].nextSibling;
+      e.insertBefore(n[o++], t[c++].nextSibling), e.insertBefore(n[--r], a), t[s] = n[r];
     } else {
-      if (!map) {
-        map = /* @__PURE__ */ new Map();
-        let i = bStart;
-        while (i < bEnd)
-          map.set(b[i], i++);
+      if (!f) {
+        f = /* @__PURE__ */ new Map();
+        let y = o;
+        for (; y < r; )
+          f.set(n[y], y++);
       }
-      const index = map.get(a[aStart]);
-      if (index != null) {
-        if (bStart < index && index < bEnd) {
-          let i = aStart, sequence = 1, t;
-          while (++i < aEnd && i < bEnd) {
-            if ((t = map.get(a[i])) == null || t !== index + sequence)
-              break;
-            sequence++;
-          }
-          if (sequence > index - bStart) {
-            const node = a[aStart];
-            while (bStart < index)
-              parentNode.insertBefore(b[bStart++], node);
+      const a = f.get(t[c]);
+      if (a != null)
+        if (o < a && a < r) {
+          let y = c, x = 1, A;
+          for (; ++y < s && y < r && !((A = f.get(t[y])) == null || A !== a + x); )
+            x++;
+          if (x > a - o) {
+            const P = t[c];
+            for (; o < a; )
+              e.insertBefore(n[o++], P);
           } else
-            parentNode.replaceChild(b[bStart++], a[aStart++]);
+            e.replaceChild(n[o++], t[c++]);
         } else
-          aStart++;
-      } else
-        a[aStart++].remove();
+          c++;
+      else
+        t[c++].remove();
     }
   }
 }
-const $$EVENTS = "_$DX_DELEGATE";
-function delegateEvents(eventNames, document2 = window.document) {
-  const e = document2[$$EVENTS] || (document2[$$EVENTS] = /* @__PURE__ */ new Set());
-  for (let i = 0, l = eventNames.length; i < l; i++) {
-    const name = eventNames[i];
-    if (!e.has(name)) {
-      e.add(name);
-      document2.addEventListener(name, eventHandler);
-    }
+const D = "_$DX_DELEGATE";
+function Z(e, t, n) {
+  const i = document.createElement("template");
+  i.innerHTML = e;
+  let s = i.content.firstChild;
+  return n && (s = s.firstChild), s;
+}
+function $e(e, t = window.document) {
+  const n = t[D] || (t[D] = /* @__PURE__ */ new Set());
+  for (let i = 0, s = e.length; i < s; i++) {
+    const r = e[i];
+    n.has(r) || (n.add(r), t.addEventListener(r, Me));
   }
 }
-function setAttribute(node, name, value) {
-  if (value == null)
-    node.removeAttribute(name);
-  else
-    node.setAttribute(name, value);
-}
-function setAttributeNS(node, namespace, name, value) {
-  if (value == null)
-    node.removeAttributeNS(namespace, name);
-  else
-    node.setAttributeNS(namespace, name, value);
-}
-function className(node, value) {
-  if (value == null)
-    node.removeAttribute("class");
-  else
-    node.className = value;
-}
-function addEventListener(node, name, handler, delegate) {
-  if (delegate) {
-    if (Array.isArray(handler)) {
-      node[`$$${name}`] = handler[0];
-      node[`$$${name}Data`] = handler[1];
-    } else
-      node[`$$${name}`] = handler;
-  } else if (Array.isArray(handler)) {
-    const handlerFn = handler[0];
-    node.addEventListener(name, handler[0] = (e) => handlerFn.call(node, handler[1], e));
+function K(e, t, n) {
+  n == null ? e.removeAttribute(t) : e.setAttribute(t, n);
+}
+function xe(e, t, n, i) {
+  i == null ? e.removeAttributeNS(t, n) : e.setAttributeNS(t, n, i);
+}
+function Se(e, t) {
+  t == null ? e.removeAttribute("class") : e.className = t;
+}
+function Ae(e, t, n, i) {
+  if (i)
+    Array.isArray(n) ? (e[`$$${t}`] = n[0], e[`$$${t}Data`] = n[1]) : e[`$$${t}`] = n;
+  else if (Array.isArray(n)) {
+    const s = n[0];
+    e.addEventListener(t, n[0] = (r) => s.call(e, n[1], r));
   } else
-    node.addEventListener(name, handler);
-}
-function classList(node, value, prev = {}) {
-  const classKeys = Object.keys(value || {}), prevKeys = Object.keys(prev);
-  let i, len;
-  for (i = 0, len = prevKeys.length; i < len; i++) {
-    const key = prevKeys[i];
-    if (!key || key === "undefined" || value[key])
-      continue;
-    toggleClassKey(node, key, false);
-    delete prev[key];
+    e.addEventListener(t, n);
+}
+function we(e, t, n = {}) {
+  const i = Object.keys(t || {}), s = Object.keys(n);
+  let r, c;
+  for (r = 0, c = s.length; r < c; r++) {
+    const o = s[r];
+    !o || o === "undefined" || t[o] || (R(e, o, !1), delete n[o]);
   }
-  for (i = 0, len = classKeys.length; i < len; i++) {
-    const key = classKeys[i], classValue = !!value[key];
-    if (!key || key === "undefined" || prev[key] === classValue || !classValue)
-      continue;
-    toggleClassKey(node, key, true);
-    prev[key] = classValue;
+  for (r = 0, c = i.length; r < c; r++) {
+    const o = i[r], l = !!t[o];
+    !o || o === "undefined" || n[o] === l || !l || (R(e, o, !0), n[o] = l);
   }
-  return prev;
-}
-function style(node, value, prev = {}) {
-  const nodeStyle = node.style;
-  const prevString = typeof prev === "string";
-  if (value == null && prevString || typeof value === "string")
-    return nodeStyle.cssText = value;
-  prevString && (nodeStyle.cssText = void 0, prev = {});
-  value || (value = {});
-  let v, s;
-  for (s in prev) {
-    value[s] == null && nodeStyle.removeProperty(s);
-    delete prev[s];
-  }
-  for (s in value) {
-    v = value[s];
-    if (v !== prev[s]) {
-      nodeStyle.setProperty(s, v);
-      prev[s] = v;
-    }
-  }
-  return prev;
-}
-function spread(node, accessor, isSVG, skipChildren) {
-  if (typeof accessor === "function") {
-    createRenderEffect((current) => spreadExpression(node, accessor(), current, isSVG, skipChildren));
-  } else
-    spreadExpression(node, accessor, void 0, isSVG, skipChildren);
-}
-function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = false) {
-  props || (props = {});
-  for (const prop in prevProps) {
-    if (!(prop in props)) {
-      if (prop === "children")
+  return n;
+}
+function p(e, t, n) {
+  if (!t)
+    return n ? K(e, "style") : t;
+  const i = e.style;
+  if (typeof t == "string")
+    return i.cssText = t;
+  typeof n == "string" && (i.cssText = n = void 0), n || (n = {}), t || (t = {});
+  let s, r;
+  for (r in n)
+    t[r] == null && i.removeProperty(r), delete n[r];
+  for (r in t)
+    s = t[r], s !== n[r] && (i.setProperty(r, s), n[r] = s);
+  return n;
+}
+function je(e, t = {}, n, i) {
+  const s = {};
+  return i || S(() => s.children = j(e, t.children, s.children)), S(() => t.ref && t.ref(e)), S(() => Ee(e, t, n, !0, s, !0)), s;
+}
+function Ce(e, t, n) {
+  return X(() => e(t, n));
+}
+function ee(e, t, n, i) {
+  if (n !== void 0 && !i && (i = []), typeof t != "function")
+    return j(e, t, i, n);
+  S((s) => j(e, t(), s, n), i);
+}
+function Ee(e, t, n, i, s = {}, r = !1) {
+  t || (t = {});
+  for (const c in s)
+    if (!(c in t)) {
+      if (c === "children")
         continue;
-      assignProp(node, prop, null, prevProps[prop], isSVG, skipRef);
+      s[c] = G(e, c, null, s[c], n, r);
     }
-  }
-  for (const prop in props) {
-    if (prop === "children") {
-      if (!skipChildren)
-        insertExpression(node, props.children);
+  for (const c in t) {
+    if (c === "children") {
+      i || j(e, t.children);
       continue;
     }
-    const value = props[prop];
-    prevProps[prop] = assignProp(node, prop, value, prevProps[prop], isSVG, skipRef);
+    const o = t[c];
+    s[c] = G(e, c, o, s[c], n, r);
   }
 }
-function getNextElement(template) {
-  let node, key;
-  if (!sharedConfig.context || !(node = sharedConfig.registry.get(key = getHydrationKey()))) {
-    return template.cloneNode(true);
-  }
-  if (sharedConfig.completed)
-    sharedConfig.completed.add(node);
-  sharedConfig.registry.delete(key);
-  return node;
-}
-function toPropertyName(name) {
-  return name.toLowerCase().replace(/-([a-z])/g, (_, w) => w.toUpperCase());
-}
-function toggleClassKey(node, key, value) {
-  const classNames = key.trim().split(/\s+/);
-  for (let i = 0, nameLen = classNames.length; i < nameLen; i++)
-    node.classList.toggle(classNames[i], value);
-}
-function assignProp(node, prop, value, prev, isSVG, skipRef) {
-  let isCE, isProp, isChildProp;
-  if (prop === "style")
-    return style(node, value, prev);
-  if (prop === "classList")
-    return classList(node, value, prev);
-  if (value === prev)
-    return prev;
-  if (prop === "ref") {
-    if (!skipRef) {
-      value(node);
+function Ie(e) {
+  let t, n;
+  return !d.context || !(t = d.registry.get(n = Oe())) ? e.cloneNode(!0) : (d.completed && d.completed.add(t), d.registry.delete(n), t);
+}
+function ze(e) {
+  return e.toLowerCase().replace(/-([a-z])/g, (t, n) => n.toUpperCase());
+}
+function R(e, t, n) {
+  const i = t.trim().split(/\s+/);
+  for (let s = 0, r = i.length; s < r; s++)
+    e.classList.toggle(i[s], n);
+}
+function G(e, t, n, i, s, r) {
+  let c, o, l;
+  if (t === "style")
+    return p(e, n, i);
+  if (t === "classList")
+    return we(e, n, i);
+  if (n === i)
+    return i;
+  if (t === "ref")
+    r || n(e);
+  else if (t.slice(0, 3) === "on:") {
+    const f = t.slice(3);
+    i && e.removeEventListener(f, i), n && e.addEventListener(f, n);
+  } else if (t.slice(0, 10) === "oncapture:") {
+    const f = t.slice(10);
+    i && e.removeEventListener(f, i, !0), n && e.addEventListener(f, n, !0);
+  } else if (t.slice(0, 2) === "on") {
+    const f = t.slice(2).toLowerCase(), a = me.has(f);
+    if (!a && i) {
+      const y = Array.isArray(i) ? i[0] : i;
+      e.removeEventListener(f, y);
     }
-  } else if (prop.slice(0, 3) === "on:") {
-    const e = prop.slice(3);
-    prev && node.removeEventListener(e, prev);
-    value && node.addEventListener(e, value);
-  } else if (prop.slice(0, 10) === "oncapture:") {
-    const e = prop.slice(10);
-    prev && node.removeEventListener(e, prev, true);
-    value && node.addEventListener(e, value, true);
-  } else if (prop.slice(0, 2) === "on") {
-    const name = prop.slice(2).toLowerCase();
-    const delegate = DelegatedEvents.has(name);
-    if (!delegate && prev) {
-      const h = Array.isArray(prev) ? prev[0] : prev;
-      node.removeEventListener(name, h);
-    }
-    if (delegate || value) {
-      addEventListener(node, name, value, delegate);
-      delegate && delegateEvents([name]);
-    }
-  } else if ((isChildProp = ChildProperties.has(prop)) || !isSVG && (PropAliases[prop] || (isProp = Properties.has(prop))) || (isCE = node.nodeName.includes("-"))) {
-    if (prop === "class" || prop === "className")
-      className(node, value);
-    else if (isCE && !isProp && !isChildProp)
-      node[toPropertyName(prop)] = value;
-    else
-      node[PropAliases[prop] || prop] = value;
-  } else {
-    const ns = isSVG && prop.indexOf(":") > -1 && SVGNamespace[prop.split(":")[0]];
-    if (ns)
-      setAttributeNS(node, ns, prop, value);
-    else
-      setAttribute(node, Aliases[prop] || prop, value);
+    (a || n) && (Ae(e, f, n, a), a && $e([f]));
+  } else if ((l = de.has(t)) || !s && (B[t] || (o = ue.has(t))) || (c = e.nodeName.includes("-")))
+    t === "class" || t === "className" ? Se(e, n) : c && !o && !l ? e[ze(t)] = n : e[B[t] || t] = n;
+  else {
+    const f = s && t.indexOf(":") > -1 && ge[t.split(":")[0]];
+    f ? xe(e, f, t, n) : K(e, ye[t] || t, n);
   }
-  return value;
-}
-function eventHandler(e) {
-  const key = `$$${e.type}`;
-  let node = e.composedPath && e.composedPath()[0] || e.target;
-  if (e.target !== node) {
-    Object.defineProperty(e, "target", {
-      configurable: true,
-      value: node
-    });
-  }
-  Object.defineProperty(e, "currentTarget", {
-    configurable: true,
+  return n;
+}
+function Me(e) {
+  const t = `$$${e.type}`;
+  let n = e.composedPath && e.composedPath()[0] || e.target;
+  for (e.target !== n && Object.defineProperty(e, "target", {
+    configurable: !0,
+    value: n
+  }), Object.defineProperty(e, "currentTarget", {
+    configurable: !0,
     get() {
-      return node || document;
+      return n || document;
     }
-  });
-  if (sharedConfig.registry && !sharedConfig.done) {
-    sharedConfig.done = true;
-    document.querySelectorAll("[id^=pl-]").forEach((elem) => elem.remove());
-  }
-  while (node !== null) {
-    const handler = node[key];
-    if (handler && !node.disabled) {
-      const data = node[`${key}Data`];
-      data !== void 0 ? handler.call(node, data, e) : handler.call(node, e);
-      if (e.cancelBubble)
+  }), d.registry && !d.done && (d.done = !0, document.querySelectorAll("[id^=pl-]").forEach((i) => {
+    for (; i && i.nodeType !== 8 && i.nodeValue !== "pl-" + e; ) {
+      let s = i.nextSibling;
+      i.remove(), i = s;
+    }
+    i && i.remove();
+  })); n; ) {
+    const i = n[t];
+    if (i && !n.disabled) {
+      const s = n[`${t}Data`];
+      if (s !== void 0 ? i.call(n, s, e) : i.call(n, e), e.cancelBubble)
         return;
     }
-    node = node.host && node.host !== node && node.host instanceof Node ? node.host : node.parentNode;
+    n = n._$host || n.parentNode || n.host;
   }
 }
-function spreadExpression(node, props, prevProps = {}, isSVG, skipChildren) {
-  props || (props = {});
-  if (!skipChildren && "children" in props) {
-    createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
-  }
-  props.ref && props.ref(node);
-  createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
-  return prevProps;
-}
-function insertExpression(parent, value, current, marker, unwrapArray) {
-  if (sharedConfig.context && !current)
-    current = [...parent.childNodes];
-  while (typeof current === "function")
-    current = current();
-  if (value === current)
-    return current;
-  const t = typeof value, multi = marker !== void 0;
-  parent = multi && current[0] && current[0].parentNode || parent;
-  if (t === "string" || t === "number") {
-    if (sharedConfig.context)
-      return current;
-    if (t === "number")
-      value = value.toString();
-    if (multi) {
-      let node = current[0];
-      if (node && node.nodeType === 3) {
-        node.data = value;
-      } else
-        node = document.createTextNode(value);
-      current = cleanChildren(parent, current, marker, node);
-    } else {
-      if (current !== "" && typeof current === "string") {
-        current = parent.firstChild.data = value;
-      } else
-        current = parent.textContent = value;
-    }
-  } else if (value == null || t === "boolean") {
-    if (sharedConfig.context)
-      return current;
-    current = cleanChildren(parent, current, marker);
-  } else if (t === "function") {
-    createRenderEffect(() => {
-      let v = value();
-      while (typeof v === "function")
-        v = v();
-      current = insertExpression(parent, v, current, marker);
-    });
-    return () => current;
-  } else if (Array.isArray(value)) {
-    const array = [];
-    const currentArray = current && Array.isArray(current);
-    if (normalizeIncomingArray(array, value, current, unwrapArray)) {
-      createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
-      return () => current;
-    }
-    if (sharedConfig.context) {
-      if (!array.length)
-        return current;
-      for (let i = 0; i < array.length; i++) {
-        if (array[i].parentNode)
-          return current = array;
-      }
-    }
-    if (array.length === 0) {
-      current = cleanChildren(parent, current, marker);
-      if (multi)
-        return current;
-    } else if (currentArray) {
-      if (current.length === 0) {
-        appendNodes(parent, array, marker);
-      } else
-        reconcileArrays(parent, current, array);
-    } else {
-      current && cleanChildren(parent);
-      appendNodes(parent, array);
-    }
-    current = array;
-  } else if (value instanceof Node) {
-    if (sharedConfig.context && value.parentNode)
-      return current = multi ? [value] : value;
-    if (Array.isArray(current)) {
-      if (multi)
-        return current = cleanChildren(parent, current, marker, value);
-      cleanChildren(parent, current, null, value);
-    } else if (current == null || current === "" || !parent.firstChild) {
-      parent.appendChild(value);
+function j(e, t, n, i, s) {
+  for (d.context && !n && (n = [...e.childNodes]); typeof n == "function"; )
+    n = n();
+  if (t === n)
+    return n;
+  const r = typeof t, c = i !== void 0;
+  if (e = c && n[0] && n[0].parentNode || e, r === "string" || r === "number") {
+    if (d.context)
+      return n;
+    if (r === "number" && (t = t.toString()), c) {
+      let o = n[0];
+      o && o.nodeType === 3 ? o.data = t : o = document.createTextNode(t), n = w(e, n, i, o);
     } else
-      parent.replaceChild(value, parent.firstChild);
-    current = value;
-  } else
-    ;
-  return current;
-}
-function normalizeIncomingArray(normalized, array, current, unwrap) {
-  let dynamic = false;
-  for (let i = 0, len = array.length; i < len; i++) {
-    let item = array[i], prev = current && current[i];
-    if (item instanceof Node) {
-      normalized.push(item);
-    } else if (item == null || item === true || item === false)
-      ;
-    else if (Array.isArray(item)) {
-      dynamic = normalizeIncomingArray(normalized, item, prev) || dynamic;
-    } else if (typeof item === "function") {
-      if (unwrap) {
-        while (typeof item === "function")
-          item = item();
-        dynamic = normalizeIncomingArray(normalized, Array.isArray(item) ? item : [item], Array.isArray(prev) ? prev : [prev]) || dynamic;
-      } else {
-        normalized.push(item);
-        dynamic = true;
+      n !== "" && typeof n == "string" ? n = e.firstChild.data = t : n = e.textContent = t;
+  } else if (t == null || r === "boolean") {
+    if (d.context)
+      return n;
+    n = w(e, n, i);
+  } else {
+    if (r === "function")
+      return S(() => {
+        let o = t();
+        for (; typeof o == "function"; )
+          o = o();
+        n = j(e, o, n, i);
+      }), () => n;
+    if (Array.isArray(t)) {
+      const o = [], l = n && Array.isArray(n);
+      if (N(o, t, n, s))
+        return S(() => n = j(e, o, n, i, !0)), () => n;
+      if (d.context) {
+        if (!o.length)
+          return n;
+        for (let f = 0; f < o.length; f++)
+          if (o[f].parentNode)
+            return n = o;
       }
-    } else {
-      const value = String(item);
-      if (prev && prev.nodeType === 3 && prev.data === value) {
-        normalized.push(prev);
+      if (o.length === 0) {
+        if (n = w(e, n, i), c)
+          return n;
+      } else
+        l ? n.length === 0 ? H(e, o, i) : be(e, n, o) : (n && w(e), H(e, o));
+      n = o;
+    } else if (t instanceof Node) {
+      if (d.context && t.parentNode)
+        return n = c ? [t] : t;
+      if (Array.isArray(n)) {
+        if (c)
+          return n = w(e, n, i, t);
+        w(e, n, null, t);
       } else
-        normalized.push(document.createTextNode(value));
+        n == null || n === "" || !e.firstChild ? e.appendChild(t) : e.replaceChild(t, e.firstChild);
+      n = t;
     }
   }
-  return dynamic;
-}
-function appendNodes(parent, array, marker) {
-  for (let i = 0, len = array.length; i < len; i++)
-    parent.insertBefore(array[i], marker);
-}
-function cleanChildren(parent, current, marker, replacement) {
-  if (marker === void 0)
-    return parent.textContent = "";
-  const node = replacement || document.createTextNode("");
-  if (current.length) {
-    let inserted = false;
-    for (let i = current.length - 1; i >= 0; i--) {
-      const el = current[i];
-      if (node !== el) {
-        const isParent = el.parentNode === parent;
-        if (!inserted && !i)
-          isParent ? parent.replaceChild(node, el) : parent.insertBefore(node, marker);
-        else
-          isParent && el.remove();
+  return n;
+}
+function N(e, t, n, i) {
+  let s = !1;
+  for (let r = 0, c = t.length; r < c; r++) {
+    let o = t[r], l = n && n[r];
+    if (o instanceof Node)
+      e.push(o);
+    else if (!(o == null || o === !0 || o === !1))
+      if (Array.isArray(o))
+        s = N(e, o, l) || s;
+      else if (typeof o == "function")
+        if (i) {
+          for (; typeof o == "function"; )
+            o = o();
+          s = N(e, Array.isArray(o) ? o : [o], Array.isArray(l) ? l : [l]) || s;
+        } else
+          e.push(o), s = !0;
+      else {
+        const f = String(o);
+        l && l.nodeType === 3 && l.data === f ? e.push(l) : e.push(document.createTextNode(f));
+      }
+  }
+  return s;
+}
+function H(e, t, n = null) {
+  for (let i = 0, s = t.length; i < s; i++)
+    e.insertBefore(t[i], n);
+}
+function w(e, t, n, i) {
+  if (n === void 0)
+    return e.textContent = "";
+  const s = i || document.createTextNode("");
+  if (t.length) {
+    let r = !1;
+    for (let c = t.length - 1; c >= 0; c--) {
+      const o = t[c];
+      if (s !== o) {
+        const l = o.parentNode === e;
+        !r && !c ? l ? e.replaceChild(s, o) : e.insertBefore(s, n) : l && o.remove();
       } else
-        inserted = true;
+        r = !0;
     }
   } else
-    parent.insertBefore(node, marker);
-  return [node];
-}
-function getHydrationKey() {
-  const hydrate = sharedConfig.context;
-  return `${hydrate.id}${hydrate.count++}`;
-}
-const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
-function createElement(tagName, isSVG = false) {
-  return isSVG ? document.createElementNS(SVG_NAMESPACE, tagName) : document.createElement(tagName);
-}
-function Dynamic(props) {
-  const [p, others] = splitProps(props, ["component"]);
-  const cached = createMemo(() => p.component);
-  return createMemo(() => {
-    const component = cached();
-    switch (typeof component) {
+    e.insertBefore(s, n);
+  return [s];
+}
+function Oe() {
+  const e = d.context;
+  return `${e.id}${e.count++}`;
+}
+const Pe = "http://www.w3.org/2000/svg";
+function Te(e, t = !1) {
+  return t ? document.createElementNS(Pe, e) : document.createElement(e);
+}
+function ke(e) {
+  const [t, n] = V(e, ["component"]), i = I(() => t.component);
+  return I(() => {
+    const s = i();
+    switch (typeof s) {
       case "function":
-        return untrack(() => component(others));
+        return X(() => s(n));
       case "string":
-        const isSvg = SVGElements.has(component);
-        const el = sharedConfig.context ? getNextElement() : createElement(component, isSvg);
-        spread(el, others, isSvg);
-        return el;
+        const r = he.has(s), c = d.context ? Ie() : Te(s, r);
+        return je(c, n, r), c;
     }
   });
 }
-function convertToMaybe(value) {
-  return value != null ? value : void 0;
-}
-function omitProps(value, keys) {
-  return Object.keys(value).filter((k) => !keys.includes(k)).reduce((newObject, k) => {
-    Object.defineProperty(newObject, k, {
-      get() {
-        return value[k];
-      },
-      configurable: true,
-      enumerable: true
-    });
-    return newObject;
-  }, {});
+function M(e) {
+  return e ?? void 0;
 }
-function createDynamic(source, props) {
-  return createComponent(
-    Dynamic,
-    mergeProps(
-      {
-        get component() {
-          return source();
-        }
-      },
-      props
-    )
-  );
+function m(e, t) {
+  return Object.keys(e).filter((n) => !t.includes(n)).reduce((n, i) => (Object.defineProperty(n, i, {
+    get() {
+      return e[i];
+    },
+    configurable: !0,
+    enumerable: !0
+  }), n), {});
+}
+function h(e, t) {
+  return E(ke, u({
+    get component() {
+      return e();
+    }
+  }, t));
 }
-function createPropsFromAccessors(props) {
-  if (!Object.values(props).every((x) => typeof x === "function"))
+function g(e) {
+  if (!Object.values(e).every((t) => typeof t == "function"))
     throw new Error("Please provide an object with accessor values only.");
-  return Object.keys(props).reduce((getterObj, key) => {
-    const accessor = props[key];
-    Object.defineProperty(getterObj, key, {
+  return Object.keys(e).reduce((t, n) => {
+    const i = e[n];
+    return Object.defineProperty(t, n, {
       get() {
-        return accessor();
+        return i();
       },
-      configurable: true,
-      enumerable: true
-    });
-    return getterObj;
+      configurable: !0,
+      enumerable: !0
+    }), t;
   }, {});
 }
-function getSafeMaxWidth(maxWidth) {
-  if (maxWidth === void 0)
-    return "100%";
-  if (typeof maxWidth === "number")
-    return `${maxWidth}px`;
-  return maxWidth;
-}
-function Center(props) {
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const maxWidth = () => `--maxWidth: ${getSafeMaxWidth(props.maxWidth)};`;
-  const centerText = () => props.centerText ? "center-text" : "";
-  const centerChildren = () => props.centerChildren ? "center-children" : "";
-  const attrString = () => [centerText(), centerChildren()].filter(Boolean).join(" ");
-  const style2 = () => [propsStyle(), maxWidth()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "maxWidth", "centerText", "centerChildren"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-center": attrString
-      })
-    )
-  );
+const te = /^--\D{1}.{0,100}$/;
+function ne(e) {
+  return te.test(e);
+}
+function W(e) {
+  return typeof e != "string" ? !1 : [/^[0-9]{0,10000}\.?[0-9]{1,10000}(vmin|vmax|vh|vw|%|ch|ex|em|rem|in|cm|mm|pt|pc|px)$/, /^var\(--\D{1}.{0,100}\)$/, te].some((t) => t.test(e));
+}
+const {
+  sizeXxs: Ne,
+  sizeXs: Le,
+  sizeSm: We,
+  sizeMd: ve,
+  sizeLg: Be,
+  sizeXl: De,
+  sizeXxl: Re,
+  sizeContent1: Ge,
+  sizeContent2: He,
+  sizeContent3: _e,
+  sizeHeader1: Fe,
+  sizeHeader2: Ve,
+  sizeHeader3: Xe,
+  size000: qe,
+  size00: Ue,
+  size1: Qe,
+  size2: Je,
+  size3: Ye,
+  size4: Ze,
+  size5: Ke,
+  size6: pe,
+  size7: et,
+  size8: tt,
+  size9: nt,
+  size10: it,
+  size11: st,
+  size12: ot,
+  size13: rt,
+  size14: ct,
+  size15: lt
+} = re, ft = {
+  size000: qe,
+  size00: Ue,
+  size1: Qe,
+  size2: Je,
+  size3: Ye,
+  size4: Ze,
+  size5: Ke,
+  size6: pe,
+  size7: et,
+  size8: tt,
+  size9: nt,
+  size10: it,
+  size11: st,
+  size12: ot,
+  size13: rt,
+  size14: ct,
+  size15: lt
+}, at = {
+  sizeXxs: Ne,
+  sizeXs: Le,
+  sizeSm: We,
+  sizeMd: ve,
+  sizeLg: Be,
+  sizeXl: De,
+  sizeXxl: Re,
+  sizeContent1: Ge,
+  sizeContent2: He,
+  sizeContent3: _e,
+  sizeHeader1: Fe,
+  sizeHeader2: Ve,
+  sizeHeader3: Xe
+}, ut = ft, dt = at;
+function ie(e) {
+  return e.reduce((t, [n, i]) => ({
+    ...t,
+    [n]: i
+  }), {});
+}
+function _(e, t) {
+  if (t !== void 0)
+    return typeof t == "number" && t >= 0 ? `${t}px` : typeof t == "string" && W(t) ? ne(t) ? `var(${t})` : t : M(b(e, t));
+}
+function b(e, t) {
+  const n = e.space ?? ut, i = ie(Object.entries(n).map(([s, r]) => [s, typeof r == "number" ? `${r}px` : r]));
+  return M(i[t]);
+}
+function O(e, t) {
+  if (t === void 0)
+    return;
+  if (typeof t == "number" && t >= 0)
+    return `${t}px`;
+  if (typeof t == "string" && W(t))
+    return ne(t) ? `var(${t})` : t;
+  const n = e.sizes ?? dt, i = ie(Object.entries(n).map(([s, r]) => [s, typeof r == "number" ? `${r}px` : r]));
+  return M(i[t]);
+}
+function yt(e) {
+  return e === void 0 ? "100%" : typeof e == "number" ? `${e}px` : e;
+}
+function Bt(e) {
+  const t = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((o, [l, f]) => o + `${l}:${f};`, ""), n = () => `--maxWidth: ${yt(e.maxWidth)};`, i = () => e.centerText ? "center-text" : "", s = () => e.centerChildren ? "center-children" : "", r = () => [i(), s()].filter(Boolean).join(" "), c = () => [t(), n()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "maxWidth", "centerText", "centerChildren"]), g({
+    style: c,
+    "data-bedrock-center": r
+  })));
 }
-const ThemeContext = createContext({});
-function ThemeProvider(props) {
-  return /* @__PURE__ */ React.createElement(ThemeContext.Provider, {
-    value: props.theme
-  }, props.children);
+const se = ce({});
+function Dt(e) {
+  return E(se.Provider, {
+    get value() {
+      return e.theme;
+    },
+    get children() {
+      return e.children;
+    }
+  });
 }
-function useTheme() {
+function $() {
   try {
-    return useContext(ThemeContext);
-  } catch (e) {
+    return le(se);
+  } catch {
     return {};
   }
 }
-function getSafeMinItemWidth(minItemWidth) {
-  if (minItemWidth === void 0)
-    return "159px";
-  if (typeof minItemWidth === "number")
-    return `${minItemWidth}px`;
-  return minItemWidth;
-}
-function ColumnDrop(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"}`;
-  };
-  const minItemWidth = () => `--minItemWidth: ${getSafeMinItemWidth(props.minItemWidth)}`;
-  const noStretchedColumns = () => props.noStretchedColumns === true ? "no-stretched-columns" : "";
-  const style2 = () => [propsStyle(), gutter(), minItemWidth()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "gutter", "minItemWidth", "noStretchedColumns"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-column-drop": noStretchedColumns
-      })
-    )
-  );
+function mt(e, t) {
+  return O(e, t);
 }
-function fail(msg) {
-  throw new Error(msg);
+function Rt(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((o, [l, f]) => o + `${l}:${f};`, ""), i = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"}`, s = () => `--minItemWidth: ${mt(t, e.minItemWidth)}`, r = () => e.noStretchedColumns === !0 ? "no-stretched-columns" : "", c = () => [n(), i(), s()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "gutter", "minItemWidth", "noStretchedColumns"]), g({
+    style: c,
+    "data-bedrock-column-drop": r
+  })));
 }
-function assertIsValidWidth(width) {
-  if (typeof width !== "number" && !Array.isArray(width)) {
-    fail("width must be a number or an array of two numbers");
-  }
-  if (Array().concat(width).some((w) => w < 0)) {
-    fail("width value(s) must be 0 or greater");
-  }
-  const isInvalidArray = Array.isArray(width) && (width.length !== 2 || width[0] > width[1]);
-  if (isInvalidArray) {
-    fail(
-      `The second width value, ${width[1]}, is not larger than ${width[0]}. Please provide a value greater than first width value`
-    );
-  }
+function T(e) {
+  throw new Error(e);
 }
-function createContainerQuery(width, maybeRef) {
-  assertIsValidWidth(width);
-  const [matches, setMatch] = createSignal(false);
-  const [node, nodeRef] = createSignal();
-  onMount(() => {
-    init();
-  });
-  createEffect(() => {
-    if (node() === void 0 || node() === null)
+function ht(e) {
+  typeof e != "number" && !Array.isArray(e) && T("width must be a number or an array of two numbers"), Array().concat(e).some((n) => n < 0) && T("width value(s) must be 0 or greater"), Array.isArray(e) && (e.length !== 2 || e[0] > e[1]) && T(`The second width value, ${e[1]}, is not larger than ${e[0]}. Please provide a value greater than first width value`);
+}
+function Gt(e, t) {
+  ht(e);
+  const [n, i] = z(!1), [s, r] = z();
+  return q(() => {
+    J();
+  }), U(() => {
+    if (s() === void 0 || s() === null)
       return;
-    if (maybeRef) {
-      maybeRef(node());
-    }
-    const cleanup = registerCallback(node(), (entry) => {
-      var _a, _b;
-      const nodeWidth = (_b = (_a = entry.borderBoxSize) == null ? void 0 : _a.inlineSize) != null ? _b : entry.contentRect.width;
-      if (nodeWidth > 0) {
-        const newMatch = Array.isArray(width) ? nodeWidth >= width[0] && nodeWidth <= width[1] : nodeWidth <= width;
-        setMatch(newMatch);
+    t && t(s());
+    const c = Y(s(), (o) => {
+      var f;
+      const l = ((f = o.borderBoxSize) == null ? void 0 : f.inlineSize) ?? o.contentRect.width;
+      if (l > 0) {
+        const a = Array.isArray(e) ? l >= e[0] && l <= e[1] : l <= e;
+        i(a);
       }
     });
-    onCleanup(cleanup);
-  });
-  return [matches, nodeRef];
-}
-function checkIsRatio(ratio) {
-  const isCorrectArray = Array.isArray(ratio) && ratio.length === 2 && ratio.every(Number.isFinite);
-  return isCorrectArray || typeof ratio === "string" && /^\d{1,1000} {0,1}\/ {0,1}\d{1,1000}$/.test(ratio);
-}
-function getRatioString(ratio) {
-  return Array.isArray(ratio) ? ratio.join("/") : ratio;
-}
-function getSafeRatio(ratio) {
-  const isRatio = checkIsRatio(ratio);
-  return isRatio ? getRatioString(ratio) : void 0;
-}
-function Frame(props) {
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const maybeRatioAssesor = () => getSafeRatio(props.ratio);
-  const ratio = () => maybeRatioAssesor() ? `--ratio: ${maybeRatioAssesor()}` : "";
-  const position = () => typeof props.position === "string" ? `--position: ${props.position}` : "50%";
-  const style2 = () => [propsStyle(), ratio(), position()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "ratio", "position"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-frame": () => ""
-      })
-    )
-  );
+    Q(c);
+  }), [n, r];
 }
-function Grid(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"};`;
-  };
-  const minItemWidth = () => {
-    var _a;
-    return `--minItemWidth: ${typeof props.minItemWidth === "string" ? props.minItemWidth : `${(_a = props.minItemWidth) != null ? _a : 0}px`};`;
-  };
-  const style2 = () => [propsStyle(), gutter(), minItemWidth()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "gutter", "minItemWidth"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-grid": () => ""
-      })
-    )
-  );
+function gt(e) {
+  return Array.isArray(e) && e.length === 2 && e.every(Number.isFinite) || typeof e == "string" && /^\d{1,1000} {0,1}\/ {0,1}\d{1,1000}$/.test(e);
 }
-const PIXELS_PER_INCH = 96;
-function parseUnit(str) {
-  var _a;
-  str = String(str);
-  const num = parseFloat(str);
-  const [, unit] = (_a = str.match(/[\d.\-+]*\s*(.*)/)) != null ? _a : ["", ""];
-  return [num, unit];
-}
-function toPX(str, element) {
-  if (!str)
-    return void 0;
-  const elementOrBody = element != null ? element : document.body;
-  const safeStr = (str != null ? str : "px").trim().toLowerCase();
-  switch (safeStr) {
+function bt(e) {
+  return Array.isArray(e) ? e.join("/") : e;
+}
+function $t(e) {
+  return gt(e) ? bt(e) : void 0;
+}
+function Ht(e) {
+  const t = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((c, [o, l]) => c + `${o}:${l};`, ""), n = () => $t(e.ratio), i = () => n() ? `--ratio: ${n()}` : "", s = () => typeof e.position == "string" ? `--position: ${e.position}` : "50%", r = () => [t(), i(), s()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "ratio", "position"]), g({
+    style: r,
+    "data-bedrock-frame": () => ""
+  })));
+}
+function xt(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((c, [o, l]) => c + `${o}:${l};`, ""), i = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"};`, s = () => `--minItemWidth: ${typeof e.minItemWidth == "string" ? e.minItemWidth : `${e.minItemWidth ?? 0}px`};`, r = () => [n(), i(), s()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "gutter", "minItemWidth"]), g({
+    style: r,
+    "data-bedrock-grid": () => ""
+  })));
+}
+const C = 96;
+function oe(e) {
+  e = String(e);
+  const t = parseFloat(e), [, n] = e.match(/[\d.\-+]*\s*(.*)/) ?? ["", ""];
+  return [t, n];
+}
+function v(e, t) {
+  if (!e)
+    return;
+  const n = t ?? document.body, i = (e ?? "px").trim().toLowerCase();
+  switch (i) {
     case "vmin":
     case "vmax":
     case "vh":
     case "vw":
     case "%":
-      return void 0;
+      return;
     case "ch":
     case "ex":
-      return getSizeBrutal(safeStr, elementOrBody);
+      return St(i, n);
     case "em":
-      return getPropertyInPX(elementOrBody, "font-size");
+      return L(n, "font-size");
     case "rem":
-      return getPropertyInPX(document.body, "font-size");
+      return L(document.body, "font-size");
     case "in":
-      return PIXELS_PER_INCH;
+      return C;
     case "cm":
-      return PIXELS_PER_INCH / 2.54;
+      return C / 2.54;
     case "mm":
-      return PIXELS_PER_INCH / 25.4;
+      return C / 25.4;
     case "pt":
-      return PIXELS_PER_INCH / 72;
+      return C / 72;
     case "pc":
-      return PIXELS_PER_INCH / 6;
+      return C / 6;
     case "px":
       return 1;
     default: {
-      const [value, units] = parseUnit(safeStr);
-      if (isNaN(value))
-        return void 0;
-      if (!units)
-        return value;
-      const px = toPX(units, element);
-      return typeof px === "number" ? value * px : void 0;
+      const [s, r] = oe(i);
+      if (isNaN(s))
+        return;
+      if (!r)
+        return s;
+      const c = v(r, t);
+      return typeof c == "number" ? s * c : void 0;
     }
   }
 }
-function getPropertyInPX(element, prop) {
-  var _a;
-  const [value, units] = parseUnit(
-    getComputedStyle(element).getPropertyValue(prop)
+function L(e, t) {
+  const [n, i] = oe(
+    getComputedStyle(e).getPropertyValue(t)
   );
-  return value * ((_a = toPX(units, element)) != null ? _a : 1);
-}
-function getSizeBrutal(unit, element) {
-  const testDIV = document.createElement("div");
-  testDIV.style["height"] = "128" + unit;
-  element.appendChild(testDIV);
-  const size = getPropertyInPX(testDIV, "height") / 128;
-  element.removeChild(testDIV);
-  return size;
-}
-const MIN_HEIGHT = 1;
-const isBrowser = typeof window === "object" && typeof document === "object" && document.nodeType === 9;
-const Resizer = (props) => {
-  const [rowSpan, setRowSpan] = createSignal(1);
-  const [node, nodeRef] = createSignal();
-  const theme = useTheme();
-  onMount(() => {
-    init();
-  });
-  createEffect(() => {
-    const ref = convertToMaybe(node());
-    if (ref === void 0)
+  return n * (v(i, e) ?? 1);
+}
+function St(e, t) {
+  const n = document.createElement("div");
+  n.style.height = "128" + e, t.appendChild(n);
+  const i = L(n, "height") / 128;
+  return t.removeChild(n), i;
+}
+const At = /* @__PURE__ */ Z("<div></div>"), k = 1, wt = typeof window == "object" && typeof document == "object" && document.nodeType === 9, jt = (e) => {
+  const [t, n] = z(1), [i, s] = z(), r = $();
+  return q(() => {
+    J();
+  }), U(() => {
+    const c = M(i());
+    if (c === void 0)
       return;
-    const cleanup = registerCallback(ref, ({ target }) => {
-      var _a;
-      setRowSpan(1);
-      const gapString = props.gutter ? (_a = getSpacingValue(props.gutter, theme)) != null ? _a : "1px" : "1px";
-      const maybeGap = isBrowser ? toPX(gapString, target) : void 0;
-      const gap = Math.max(maybeGap != null ? maybeGap : MIN_HEIGHT, MIN_HEIGHT);
-      const [child] = Array.from(target.children);
-      const height = 1 + Math.min(target.scrollHeight, child.scrollHeight);
-      const rowHeight = Math.max(Math.ceil(height / gap), MIN_HEIGHT);
-      setRowSpan(rowHeight);
+    const o = Y(c, ({
+      target: l
+    }) => {
+      n(1);
+      const f = e.gutter ? b(r, e.gutter) ?? "1px" : "1px", a = wt ? v(f, l) : void 0, y = Math.max(a ?? k, k), [x] = Array.from(l.children), A = 1 + Math.min(l.scrollHeight, x.scrollHeight), P = Math.max(Math.ceil(A / y), k);
+      n(P);
     });
-    onCleanup(cleanup);
-  });
-  return /* @__PURE__ */ React.createElement("div", {
-    style: `grid-row: span ${rowSpan()};`,
-    ref: nodeRef
-  }, props.children);
-};
-const MasonryGrid = (props) => {
-  const childrenMemo = children(() => props.children);
-  const emptyResolvedChildren = [];
-  const wrappedChildren = emptyResolvedChildren.concat(childrenMemo()).filter(Boolean).map((child) => /* @__PURE__ */ React.createElement(Resizer, {
-    gutter: props.gutter
-  }, child));
-  return /* @__PURE__ */ React.createElement(Grid, {
-    style: "grid-template-rows: 1px;",
-    ...props
-  }, wrappedChildren);
-};
-const justifyMap$1 = {
+    Q(o);
+  }), (() => {
+    const c = At.cloneNode(!0);
+    return Ce(s, c), ee(c, () => e.children), S((o) => p(c, `grid-row: span ${t()};`, o)), c;
+  })();
+}, _t = (e) => {
+  const t = fe(() => e.children), i = [].concat(t()).filter(Boolean).map((s) => E(jt, {
+    get gutter() {
+      return e.gutter;
+    },
+    children: s
+  }));
+  return E(xt, u({
+    style: "grid-template-rows: 1px;"
+  }, e, {
+    children: i
+  }));
+}, Ct = {
   start: "justify:start",
   end: "justify:end",
   center: "justify:center"
-};
-const alignMap$1 = {
+}, Et = {
   start: "align:start",
   end: "align:end",
   center: "align:center",
   stretch: "align:stretch"
 };
-function InlineCluster(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"};`;
-  };
-  const justify = () => props.justify !== void 0 ? justifyMap$1[props.justify] : void 0;
-  const align = () => props.align !== void 0 ? alignMap$1[props.align] : void 0;
-  const style2 = () => [propsStyle(), gutter()].join("; ");
-  const attrAssesor = () => [justify(), align()].filter(Boolean).join(" ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "gutter", "justify", "align"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-inline-cluster": attrAssesor
-      })
-    )
-  );
+function Ft(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((l, [f, a]) => l + `${f}:${a};`, ""), i = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"};`, s = () => e.justify !== void 0 ? Ct[e.justify] : void 0, r = () => e.align !== void 0 ? Et[e.align] : void 0, c = () => [n(), i()].join("; "), o = () => [s(), r()].filter(Boolean).join(" ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "gutter", "justify", "align"]), g({
+    style: c,
+    "data-bedrock-inline-cluster": o
+  })));
 }
-const justifyMap = {
+const It = {
   start: "justify:start",
   end: "justify:end",
   center: "justify:center"
-};
-const alignMap = {
+}, zt = {
   start: "align:start",
   end: "align:end",
   center: "align:center",
   stretch: "align:stretch"
 };
-function shouldUseSwitch(switchAt) {
-  if (typeof switchAt === "number" && switchAt > -1) {
-    return true;
-  }
-  if (typeof switchAt === "string" && typeof CSS !== void 0) {
-    return CSS.supports(`height: ${switchAt}`);
-  }
-  return false;
-}
-function Inline(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"};`;
-  };
-  const minItemWidth = () => props.minItemWidth ? `--minItemWidth: ${typeof props.minItemWidth === "string" ? props.minItemWidth : `${props.minItemWidth}px`};` : void 0;
-  const switchAt = () => shouldUseSwitch(props.switchAt) ? `--switchAt: ${typeof props.switchAt === "string" ? props.switchAt : `${props.switchAt}px`};` : void 0;
-  const justify = () => props.justify !== void 0 ? justifyMap[props.justify] : void 0;
-  const align = () => props.align !== void 0 ? alignMap[props.align] : void 0;
-  const stretch = () => props.stretch ? `stretch:${props.stretch}` : void 0;
-  const style2 = () => [propsStyle(), gutter(), switchAt(), minItemWidth()].join("; ");
-  const attrAssesor = () => [justify(), align(), stretch()].filter(Boolean).join(" ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, [
-        "as",
-        "gutter",
-        "justify",
-        "align",
-        "stretch",
-        "switchAt"
-      ]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-inline": attrAssesor
-      })
-    )
-  );
-}
-const validKeys = /* @__PURE__ */ new Set([
-  "left",
-  "right",
-  "top",
-  "bottom",
-  "inlineStart",
-  "inlineEnd",
-  "blockStart",
-  "blockEnd"
-]);
-const keyToProperty = (key, val) => {
-  const modernMap = {
-    left: `padding-inline-start:${val};`,
-    right: `padding-inline-end:${val};`,
-    top: `padding-block-start:${val};`,
-    bottom: `padding-block-end:${val};`,
-    inlineStart: `padding-inline-start:${val};`,
-    inlineEnd: `padding-inline-end:${val};`,
-    blockStart: `padding-block-start:${val};`,
-    blockEnd: `padding-block-end:${val};`
-  };
-  return modernMap[key];
-};
-function paddingOrDefault(theme) {
-  return (key) => {
-    const maybePadding = getSpacingValue(key, theme);
-    return maybePadding != null ? maybePadding : "0px";
-  };
+function Vt(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((y, [x, A]) => y + `${x}:${A};`, ""), i = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"};`, s = () => e.minItemWidth ? `--minItemWidth: ${typeof e.minItemWidth == "string" ? e.minItemWidth : `${e.minItemWidth}px`};` : void 0, r = () => e.switchAt ? `--switchAt: ${O(t, e.switchAt) ?? "0px"};` : "", c = () => e.justify !== void 0 ? It[e.justify] : void 0, o = () => e.align !== void 0 ? zt[e.align] : void 0, l = () => e.stretch ? `stretch:${e.stretch}` : void 0, f = () => [n(), i(), r(), s()].join("; "), a = () => [c(), o(), l()].filter(Boolean).join(" ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "gutter", "justify", "align", "stretch", "switchAt"]), g({
+    style: f,
+    "data-bedrock-inline": a
+  })));
 }
-function paddingToString(theme, padding) {
-  var _a;
-  if (Array.isArray(padding) && padding.length > 4) {
+const Mt = (e) => ({
+  left: "padding-inline-start",
+  right: "padding-inline-end",
+  top: "padding-block-start",
+  bottom: "padding-block-end",
+  inlineStart: "padding-inline-start",
+  inlineEnd: "padding-inline-end",
+  blockStart: "padding-block-start",
+  blockEnd: "padding-block-end"
+})[e], Ot = (e, t) => {
+  if (!t)
+    return "";
+  if (Array.isArray(t) && t.length > 4)
     throw new Error("padding arrays can only be 4 or less in length");
-  }
-  const validSpacings = new Set(Object.keys((_a = theme == null ? void 0 : theme.spacing) != null ? _a : spacing));
-  const isValidPadding = () => {
-    if (typeof padding === "string")
-      return true;
-    if (Array.isArray(padding)) {
-      return padding.every((val) => validSpacings.has(val));
-    }
-    return padding && Object.keys(padding).every((key) => validKeys.has(key)) && Object.values(padding).every((val) => validSpacings.has(val));
+  const n = typeof t == "object" && !Array.isArray(t) ? Object.entries(t).reduce((i, [s, r]) => ({
+    ...i,
+    [Mt(s)]: _(e, r) ?? "0px"
+  }), {}) : {
+    padding: Array.from(Array.isArray(t) ? t : [t]).map((i) => _(e, i) ?? "0px").join(" ")
   };
-  if (!isValidPadding()) {
-    console.error("Invalid padding Type");
-  }
-  const getPadding = paddingOrDefault(theme);
-  return typeof padding === "object" && !Array.isArray(padding) ? Object.entries(padding).reduce(
-    (acc, [key, val]) => validKeys.has(key) ? acc + keyToProperty(key, getPadding(val)) : acc,
-    ""
-  ) : padding !== void 0 ? `padding: ${Array.from(Array.isArray(padding) ? padding : [padding]).map((pad) => getPadding(pad)).join(" ")};` : "";
-}
-function PadBox(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const padding = () => paddingToString(theme, props.padding);
-  const style2 = () => [propsStyle(), padding()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "padding"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-padbox": () => ""
-      })
-    )
-  );
+  return Object.entries(n).reduce((i, [s, r]) => i + `${s}:${r};`, "");
+};
+function Xt(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((r, [c, o]) => r + `${c}:${o};`, ""), i = () => Ot(t, e.padding), s = () => [n(), i()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "padding"]), g({
+    style: s,
+    "data-bedrock-padbox": () => ""
+  })));
 }
-function Reel(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"};`;
-  };
-  const snapType = () => {
-    switch (props.snapType) {
-      case "none": {
+function qt(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((c, [o, l]) => c + `${o}:${l};`, ""), i = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"};`, s = () => {
+    switch (e.snapType) {
+      case "none":
         return "snapType:none";
-      }
-      case "proximity": {
+      case "proximity":
         return "snapType:proximity";
-      }
-      case "mandatory": {
+      case "mandatory":
         return "snapType:mandatory";
-      }
-      default: {
+      default:
         return "snapType:none";
-      }
     }
-  };
-  const style2 = () => [propsStyle(), gutter()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "gutter"]),
-      createPropsFromAccessors({ style: style2, "data-bedrock-reel": snapType })
-    )
-  );
-}
-function Stack(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"};`;
-  };
-  const style2 = () => [propsStyle(), gutter()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "gutter"]),
-      createPropsFromAccessors({ style: style2, "data-bedrock-stack": () => "" })
-    )
-  );
+  }, r = () => [n(), i()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "gutter"]), g({
+    style: r,
+    "data-bedrock-reel": s
+  })));
 }
-const fractions = {
+const F = {
   "1/4": "fraction:1/4",
   "1/3": "fraction:1/3",
   "1/2": "fraction:1/2",
   "2/3": "fraction:2/3",
   "3/4": "fraction:3/4",
-  "auto-start": `fraction:auto-start`,
-  "auto-end": `fraction:auto-end`
+  "auto-start": "fraction:auto-start",
+  "auto-end": "fraction:auto-end"
 };
-function SplitBase(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"};`;
-  };
-  const fraction = () => {
-    var _a, _b;
-    return (_b = fractions[(_a = props.fraction) != null ? _a : "1/2"]) != null ? _b : fractions["1/2"];
-  };
-  const style2 = () => [propsStyle(), gutter()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "gutter", "fraction"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-split": fraction
-      })
-    )
-  );
+function Ut(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((l, [f, a]) => l + `${f}:${a};`, ""), i = () => e.switchAt ? `--switchAt: ${O(t, e.switchAt) ?? "0px"};` : "", s = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"};`, r = () => F[e.fraction ?? "1/2"] ?? F["1/2"], c = () => e.minItemWidth ? `--minItemWidth: ${typeof e.minItemWidth == "string" ? e.minItemWidth : `${e.minItemWidth}px`};` : void 0, o = () => [n(), s(), i(), c()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "gutter", "fraction"]), g({
+    style: o,
+    "data-bedrock-split": r
+  })));
 }
-const Split = (props) => {
-  const [local, rest] = splitProps(props, ["switchAt", "fraction"]);
-  const maybePx = typeof local.switchAt === "string" ? toPX(local.switchAt) : local.switchAt;
-  const widthToSwitchAt = Math.max(maybePx != null ? maybePx : 0, 0);
-  const [shouldSwitch, nodeRef] = createContainerQuery(
-    widthToSwitchAt,
-    props.ref
-  );
-  return /* @__PURE__ */ React.createElement(Switch, null, /* @__PURE__ */ React.createElement(Match, {
-    when: shouldSwitch() === false
-  }, /* @__PURE__ */ React.createElement(SplitBase, {
-    fraction: local.fraction,
-    ...rest,
-    ref: nodeRef
-  })), /* @__PURE__ */ React.createElement(Match, {
-    when: shouldSwitch() === true
-  }, /* @__PURE__ */ React.createElement(Stack, {
-    ...rest,
-    ref: nodeRef
+function Qt(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((r, [c, o]) => r + `${c}:${o};`, ""), i = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"};`, s = () => [n(), i()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "gutter"]), g({
+    style: s,
+    "data-bedrock-stack": () => ""
   })));
-};
-function getSafeMinHeight(minHeight) {
-  if (typeof minHeight === "number")
-    return `${minHeight}px`;
-  return minHeight && checkIsCSSLength(minHeight) ? minHeight : "100vh";
-}
-function CoverWrapper(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"};`;
-  };
-  const minHeight = () => `--minHeight: ${getSafeMinHeight(props.minHeight)};`;
-  const stretchContent = () => props.stretchContent === true ? "stretch-content" : "";
-  const style2 = () => [propsStyle(), gutter(), minHeight()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "minHeight", "stretchContent"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-cover": stretchContent
-      })
-    )
-  );
 }
-const Cover = (props) => {
-  return /* @__PURE__ */ React.createElement(CoverWrapper, {
-    ...props
-  }, props.top, /* @__PURE__ */ React.createElement("div", {
-    "data-bedrock-cover-centered": true
-  }, props.children), props.bottom);
-};
-function ColumnsBase(props) {
-  const theme = useTheme();
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const gutter = () => {
-    var _a, _b;
-    return `--gutter: ${(_b = getSpacingValue((_a = props.gutter) != null ? _a : "none", theme)) != null ? _b : "0px"};`;
-  };
-  const columns = () => `--columns: ${props.columns && props.columns > 0 ? props.columns : 1};`;
-  const dense = () => props.dense ? "dense" : "";
-  const style2 = () => [propsStyle(), gutter(), columns()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "gutter", "columns", "dense"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-columns": dense
-      })
-    )
-  );
+const Pt = /* @__PURE__ */ Z("<div data-bedrock-cover-centered></div>");
+function Tt(e) {
+  return typeof e == "number" ? `${e}px` : e && W(e) ? e : "100vh";
 }
-const Columns = (props) => {
-  const [local, rest] = splitProps(props, ["switchAt", "columns", "dense"]);
-  const maybePx = typeof local.switchAt === "string" ? toPX(local.switchAt) : local.switchAt;
-  const widthToSwitchAt = Math.max(maybePx != null ? maybePx : 0, 0);
-  const [shouldSwitch, nodeRef] = createContainerQuery(widthToSwitchAt);
-  const combineRef = (ref) => {
-    var _a;
-    nodeRef(ref);
-    (_a = rest.ref) == null ? void 0 : _a.call(rest, ref);
-  };
-  return /* @__PURE__ */ React.createElement(Switch, null, /* @__PURE__ */ React.createElement(Match, {
-    when: shouldSwitch() === false
-  }, /* @__PURE__ */ React.createElement(ColumnsBase, {
-    columns: local.columns,
-    dense: local.dense,
-    ...rest,
-    ref: combineRef
-  })), /* @__PURE__ */ React.createElement(Match, {
-    when: shouldSwitch() === true
-  }, /* @__PURE__ */ React.createElement(Stack, {
-    ...rest,
-    ref: combineRef
+function kt(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((o, [l, f]) => o + `${l}:${f};`, ""), i = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"};`, s = () => `--minHeight: ${Tt(e.minHeight)};`, r = () => e.stretchContent === !0 ? "stretch-content" : "", c = () => [n(), i(), s()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "minHeight", "stretchContent"]), g({
+    style: c,
+    "data-bedrock-cover": r
   })));
-};
-const safeSpan = (span) => {
-  return typeof span === "number" ? span : 1;
-};
-function Column(props) {
-  const propsStyle = () => {
-    var _a;
-    return typeof props.style === "string" ? props.style : Object.entries((_a = props.style) != null ? _a : {}).reduce(
-      (str, [key, value]) => str + `${key}:${value};`,
-      ""
-    );
-  };
-  const span = () => `--span: ${safeSpan(props.span)};`;
-  const offsetStart = () => props.offsetStart && props.offsetStart > 0 ? `--offsetStart: ${props.offsetStart};` : "";
-  const offsetEnd = () => props.offsetEnd && props.offsetEnd > 0 ? `--offsetEnd: ${props.offsetEnd};` : "";
-  const style2 = () => [propsStyle(), span(), offsetStart(), offsetEnd()].join("; ");
-  return createDynamic(
-    () => {
-      var _a;
-      return (_a = props.as) != null ? _a : "div";
-    },
-    mergeProps(
-      omitProps(props, ["as", "span", "offsetStart", "offsetEnd"]),
-      createPropsFromAccessors({
-        style: style2,
-        "data-bedrock-column": () => ""
-      })
-    )
-  );
 }
-export { Center, Column, ColumnDrop, Columns, ColumnsBase, Cover, Frame, Grid, Inline, InlineCluster, MasonryGrid, PadBox, Reel, Split, SplitBase, Stack, ThemeProvider, checkIsCSSLength, createContainerQuery, getSpacingValue, spacing, useTheme };
+function Jt(e) {
+  const [t, n] = V(e, ["children", "top", "bottom"]);
+  return E(kt, u(n, {
+    get children() {
+      return [I(() => t.top), (() => {
+        const i = Pt.cloneNode(!0);
+        return ee(i, () => t.children), i;
+      })(), I(() => t.bottom)];
+    }
+  }));
+}
+function Yt(e) {
+  const t = $(), n = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((o, [l, f]) => o + `${l}:${f};`, ""), i = () => `--gutter: ${b(t, e.gutter ?? "size00") ?? "0px"};`, s = () => `--columns: ${e.columns && e.columns > 0 ? e.columns : 1};`, r = () => e.switchAt ? `--switchAt: ${O(t, e.switchAt) ?? "0px"};` : "", c = () => [n(), i(), s(), r()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "gutter", "columns", "switchAt"]), g({
+    style: c,
+    "data-bedrock-columns": () => ""
+  })));
+}
+const Nt = (e) => typeof e == "number" ? e : 1;
+function Zt(e) {
+  const t = () => typeof e.style == "string" ? e.style : Object.entries(e.style ?? {}).reduce((c, [o, l]) => c + `${o}:${l};`, ""), n = () => `--span: ${Nt(e.span)};`, i = () => e.offsetStart && e.offsetStart > 0 ? `--offsetStart: ${e.offsetStart};` : "", s = () => e.offsetEnd && e.offsetEnd > 0 ? `--offsetEnd: ${e.offsetEnd};` : "", r = () => [t(), n(), i(), s()].join("; ");
+  return h(() => e.as ?? "div", u(m(e, ["as", "span", "offsetStart", "offsetEnd"]), g({
+    style: r,
+    "data-bedrock-column": () => ""
+  })));
+}
+export {
+  Bt as Center,
+  Zt as Column,
+  Rt as ColumnDrop,
+  Yt as Columns,
+  Jt as Cover,
+  Ht as Frame,
+  xt as Grid,
+  Vt as Inline,
+  Ft as InlineCluster,
+  _t as MasonryGrid,
+  Xt as PadBox,
+  qt as Reel,
+  Ut as Split,
+  Qt as Stack,
+  Dt as ThemeProvider,
+  W as checkIsCSSLength,
+  Gt as createContainerQuery,
+  _ as getSafeGutter,
+  O as getSizeValue,
+  b as getSpacingValue,
+  dt as sizes,
+  ut as spacing,
+  $ as useTheme
+};