playbook_ui 18.0.0.pre.alpha.PLAY323219675 → 18.0.0.pre.alpha.PLAY323219729

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f530e565551c7c316ded9c86c29656af59b33d7dd81d1b14358738e7c50b5a34
-  data.tar.gz: 55086b020242981b11b7c69b60d84948f0a742299fbddfe4b63a9671d6ae9c84
+  metadata.gz: eab985fb5ceaa053047dc180cffe1a5f4675e5e496a0f58c61887c2c6a4e6253
+  data.tar.gz: 6c74de8d152d109eb6cfceab84e0b126b10b6958455b8429ec94d310168f4e9d
 SHA512:
-  metadata.gz: e526827f48a29fb2ac5525b02f58484f9f845f7194ca330f6358d5b22b62b4df79ae170290a552685bbd48e9b6278c8a2c2aaeb2d6f68b38978bdd85d93a01cc
-  data.tar.gz: 470eeebeafaab9eaa2c8b3baa420be05ddfa3f74235b95224ffc09c87e8ca1101636874021eeea4f1d7482be626423d632b02cca2d76bfa1ffd259222c2145bb
+  metadata.gz: 0b32321a1e03141678cb84f2c9ead765443fffca26e37304d5031fb96aa3aa0ded8e2dfb361e8d083e001749bcd9706ae8e783fee712558a9e7c7bbb5e5b5616
+  data.tar.gz: 44d006a1fd938ee9f8025a3d059217b1a9d5c40b903af65cb6d484e30107bf0bd2d1d349fcdb5e79de4d7b7cdf62511c174377c3cde0956b46d7685d9d57ce45

data/app/pb_kits/playbook/pb_rich_text_editor/_tiptap_styles.scss

@@ -123,27 +123,26 @@
   }
 
   .toolbar {
+    $history-gutter: $space_sm + (($space_lg + $space_xxs) * 2);
+
     border-radius: $border_rad_heaviest $border_rad_heaviest 0 0;
     border: 1px solid $input_border_default;
     container-name: rte-toolbar;
     container-type: inline-size;
     position: relative;
 
-    // Compact toolbar shell: controls wrap; undo/redo stay top-right.
+    // Prefer one row; undo/redo stay top-right. Stack tools only when they cannot share a line.
     &_inner {
       box-sizing: border-box;
       min-height: $space_lg + $space_xxs + $space_xxs * 2; // 36px button + vertical padding
       padding: $space_xxs $space_sm;
-      // Leave room for absolute undo/redo when everything shares one row
-      padding-right: $space_sm + (($space_lg + $space_xxs) * 2);
+      padding-right: $history-gutter;
       position: relative;
     }
 
-    // When the bar wraps, history stays on row 1 — drop the undo gutter for tools
-    @container rte-toolbar (max-width: 42rem) {
-      .toolbar_inner {
-        padding-right: $space_sm;
-      }
+    // Tools on their own row: drop undo gutter so the tools scrollport can go edge-to-edge.
+    &:has(.toolbar_group_more) .toolbar_inner {
+      padding-right: $space_sm;
     }
 
     &_controls {
@@ -163,7 +162,6 @@
       top: $space_xxs;
     }
 
-    // Groups: format | tools | more. With "more", narrow stacks tools under format|more.
     &_group {
       align-items: center;
       display: flex;
@@ -178,8 +176,12 @@
       }
 
       &_tools {
+        box-sizing: border-box;
         flex-wrap: nowrap;
+        max-width: 100%;
+        min-width: 0;
         order: 2;
+        overflow-x: auto;
       }
 
       &_more {
@@ -187,6 +189,7 @@
       }
     }
 
+    // With "more": stack tools under format|more until wide enough for one row
     &_controls:has(.toolbar_group_more) {
       .toolbar_group_more {
         order: 2;
@@ -196,7 +199,6 @@
         flex: 1 1 100%;
         order: 3;
 
-        // Tools on their own row — no leading pipe
         > .toolbar_separator:first-child {
           display: none;
         }
@@ -204,10 +206,15 @@
     }
 
     @container rte-toolbar (min-width: 42rem) {
+      &:has(.toolbar_group_more) .toolbar_inner {
+        padding-right: $history-gutter;
+      }
+
       .toolbar_controls:has(.toolbar_group_more) {
         .toolbar_group_tools {
           flex: 0 1 auto;
           order: 2;
+          overflow-x: visible;
 
           > .toolbar_separator:first-child {
             display: flex;
@@ -220,8 +227,12 @@
       }
     }
 
-    // No "more": when the bar is too narrow for format + tools, stack tools and drop the leading pipe
-    @container rte-toolbar (max-width: 36rem) {
+    // No "more": full-width tools row + no leading pipe + no undo gutter when stacked
+    @container rte-toolbar (max-width: 40rem) {
+      &:not(:has(.toolbar_group_more)) .toolbar_inner {
+        padding-right: $space_sm;
+      }
+
       .toolbar_controls:not(:has(.toolbar_group_more)) .toolbar_group_tools {
         flex: 1 1 100%;
 
@@ -292,15 +303,6 @@
       max-width: 100%;
       min-width: 0;
 
-      .toolbar_inner,
-      .rte-rails-toolbar-row {
-        box-sizing: border-box;
-        min-height: $space_lg + $space_xxs + $space_xxs * 2;
-        padding: $space_xxs $space_sm;
-        padding-right: $space_sm + (($space_lg + $space_xxs) * 2);
-        position: relative;
-      }
-
       .rte-toolbar-left,
       .toolbar_controls {
         align-items: center;
@@ -320,7 +322,6 @@
         top: $space_xxs;
       }
 
-      // Align dropdown trigger with icon row
       .pb_popover_reference_wrapper {
         align-items: center;
         display: inline-flex;

data/dist/ai/forms.json

@@ -1,6 +1,6 @@
 {
   "metadataVersion": 1,
-  "version": "18.0.0-alpha.PLAY323219675",
+  "version": "18.0.0-alpha.PLAY323219729",
   "builder": {
     "class": "Playbook::Forms::Builder",
     "helper": "pb_form_with",

data/dist/ai/index.json

@@ -1,8 +1,8 @@
 {
-  "version": "18.0.0-alpha.PLAY323219675",
+  "version": "18.0.0-alpha.PLAY323219729",
   "metadataVersion": 1,
   "forms": "forms.json",
-  "generated": "2026-09-30T17:47:39.401Z",
+  "generated": "2026-10-01T19:35:34.080Z",
   "schemas": {
     "globalProps": "global-props.schema.json",
     "globalEventProps": "global-event-props.schema.json",