@bettercms-ai/astro 0.26.0 → 0.27.0

package/components/BcmsBlocks.astro

@@ -352,6 +352,20 @@ const pass = { forms, components, turnstileSiteKey, nested: true, fieldAddresses
         );
       }
       case "button":
+        // The site's script owns the click: a `<button type="button">`, never an anchor with an invented href.
+        if (p.action === "code") return (
+          <button
+            type="button"
+            class={`bcms-btn bcms-btn-${buttonVariantOf(p.variant)}${p.size === "sm" || p.size === "lg" ? ` bcms-btn-${p.size}` : ""}${p.fullWidth === true ? " bcms-btn-full" : ""}`}
+            style={buttonPaintAttr(block)}
+            {...bind(block.id, "text", "text", bctx)}
+            {...blockAttrs}
+          >
+            {buttonIconOf(p.icon) && <Fragment set:html={buttonIconSvg(buttonIconOf(p.icon)!, "bcms-btn-icon")} />}
+            {p.text}
+            {p.arrow === true && <Fragment set:html={buttonIconSvg("arrow-right", "bcms-btn-arrow")} />}
+          </button>
+        );
         return (
           <a
             class={`bcms-btn bcms-btn-${buttonVariantOf(p.variant)}${p.size === "sm" || p.size === "lg" ? ` bcms-btn-${p.size}` : ""}${p.fullWidth === true ? " bcms-btn-full" : ""}`}

package/components/BcmsButton.astro

@@ -1,17 +1,21 @@
 ---
 /**
  * <BcmsButton> — render a `button` field ({ label, href, variant?, size?, arrow?, icon?,
- * newTab? }) as one editable button, the way the BetterCMS visual editor and in-place publishing
+ * newTab?, fullWidth? }) as one editable button, the way the BetterCMS visual editor and in-place publishing
  * expect to find it:
  *
- *   <a data-bcms-button="<path>" data-variant data-size href [target rel] data-bcms-props="<path>.href|url|href">
+ *   <a data-bcms-button="<path>" data-variant data-size [data-full-width] href [target rel] data-bcms-props="<path>.href|url|href">
  *     [<svg class="bcms-btn-icon">]<span data-bcms-field="<path>.label">Label</span>[<svg class="bcms-btn-arrow">]
  *   </a>
  *
+ * A value with `action: "code"` (no href: the site's script handles the click) renders the same
+ * children in `<button type="button" data-bcms-button="<path>" data-variant data-size>`.
+ *
  * Style it by `data-variant` (primary · secondary · tertiary · brand · dark · light · outline ·
  * link) and `data-size` (sm · md · lg) in your own CSS: the editor repaints those attributes as the
  * author picks, and publishing writes them into the live page, so your stylesheet decides what a
- * look looks like. `class` is passed through untouched.
+ * look looks like. A full-width button also carries `display:flex;width:100%;justify-content:center`
+ * inline, so it stretches across its column with no rule of yours. `class` is passed through untouched.
  *
  *   <BcmsButton path="hero.cta" value={page.hero.cta} class="btn" />
  */
@@ -27,13 +31,21 @@ interface Props {
 const { path, value, class: className } = Astro.props;
 const b = readButtonValue(value);
 ---
-{b.label && (
+{b.label && b.action === "code" && (
+  <button type="button" class={className} data-bcms-button={path} data-variant={b.variant} data-size={b.size} {...(b.fullWidth ? { "data-full-width": "", style: "display:flex;width:100%;justify-content:center" } : {})}>
+    {b.icon && <Fragment set:html={buttonIconSvg(b.icon, "bcms-btn-icon")} />}
+    <span data-bcms-field={`${path}.label`} data-bcms-kind="text">{b.label}</span>
+    {b.arrow && <Fragment set:html={buttonIconSvg("arrow-right", "bcms-btn-arrow")} />}
+  </button>
+)}
+{b.label && b.action !== "code" && (
   <a
     class={className}
     href={b.href || "#"}
     data-bcms-button={path}
     data-variant={b.variant}
     data-size={b.size}
+    {...(b.fullWidth ? { "data-full-width": "", style: "display:flex;width:100%;justify-content:center" } : {})}
     data-bcms-props={formatPropsAttribute([{ address: `${path}.href`, kind: "url", attr: "href" }])}
     {...(b.newTab ? { target: "_blank", rel: "noopener noreferrer" } : {})}
   >

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bettercms-ai/astro",
-  "version": "0.26.0",
+  "version": "0.27.0",
   "type": "module",
   "description": "The BetterCMS adapter for Astro — a `bettercms()` integration, a `bettercms:client` virtual module, typed content loaders, draft preview, and native .astro rendering components.",
   "main": "./dist/index.js",
@@ -61,11 +61,11 @@
   },
   "dependencies": {
     "@bettercms-ai/image-url": "^0.4.0",
-    "@bettercms-ai/next": "^0.25.0",
+    "@bettercms-ai/next": "^0.26.0",
     "@bettercms-ai/richtext": "^0.8.2",
     "@bettercms-ai/sdk": "^1.29.0",
-    "@bettercms-ai/types": "^1.42.0",
-    "@bettercms-ai/ui": "^0.15.1",
+    "@bettercms-ai/types": "^1.43.0",
+    "@bettercms-ai/ui": "^0.16.0",
     "libphonenumber-js": "^1.13.13"
   },
   "peerDependencies": {