comfy_middle_seat 4.1.0 → 4.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4d22803345977cfaec60811a1301ce6ad6ada6ab242d41c5c390b4c5aa6da645
-  data.tar.gz: 537cd86f6e7685b7a771dcd80e5c0c1bc01544f92e88fc3939bc956bc2a08db2
+  metadata.gz: 9433cede5d17f15d7c30a4a6bb30e9951ddb944129c317dc8b9a008f8e8d69f0
+  data.tar.gz: 6f30614dae87dfc9735ee436c640f5431ef66e58a084483549fb105ab43bffa2
 SHA512:
-  metadata.gz: d0785ac0b03f9f9ce49112a9b8ce41332d077e3535afd1fd46f6baab5ced8316cd95a6daef480c2e67c254d4bedcf1707f2b11ee1df980907a546443ce4a2958
-  data.tar.gz: e36f136f038d6bbdd043c306306c4d2c9fa8fc4cac7a5b0ad7021c717858eaa354c529516d0642a4d09c501fc892b7c871d0749e4388bad4d22b474a5a581302
+  metadata.gz: fba6ed160d2930727df376eb665f184df898ad3bf732b45a734abbee4f4edbe0f063f056db66c8f95adcba9111b9fd43a0640f8f5aebb1860c36b451ddcc09d5
+  data.tar.gz: f0801cb516d4d98bd8adc25c8e51bf73c2fc13b25f8930a6597c854abd216dd7a98ba5b08dd214cd45f85f73139844a7e5a6a3bb7771e8bd6c66954dd026c187

data/CHANGELOG.md

@@ -12,15 +12,57 @@ This changelog follows the project's lineage: **Comfortable Mexican Sofa → Com
 
 ## [Unreleased]
 
+### Added
+
+- Add CMS comment blocks and short notes to hide content without processing enclosed tags.
+- Expand CMS tags with editor shortcuts and searchable completion.
+- Open the shortcut selector with `;;` + Tab and filter with fuzzy search.
+
+## [v4.2.0] - 2026-10-13
+
+### Changed
+
+- Keep Page editing actions together in a sticky top toolbar.
+- Save edits and publish or unpublish a page with one button.
+- Show unpublished status below the heading and save hints as button tooltips.
+- Simplify the save confirmation to “Page updated.”
+- Fade success and informational notices after five seconds; pause on hover or focus.
+- Keep warnings and errors visible and respect reduced-motion preferences.
+
+### Fixed
+
+- Keep editing buttons aligned with the page heading above publication status.
+- Keep editing controls usable after Preview.
+- Restore dismissal of admin flash notices.
+- Keep Add Child Layout on one line when space allows.
+
+## [v4.1.0] - 2026-10-12
+
 ### Changed
 
+- Refresh the admin with the Harbor navy and teal theme.
 - Hide pages beneath unpublished ancestors without changing their publication settings.
-- Show inherited page visibility and clarify descendant publishing actions.
+- Show when a page is hidden by an unpublished ancestor.
+- Group descendant publishing actions in the Child pages menu.
 - Gray out descendant publishing actions when no changes are needed.
 
 ### Fixed
 
-- Refresh page and translation navigation when branch visibility changes.
+- Refresh page and translation navigation when publication changes.
+
+## [v4.0.4] - 2026-10-10
+
+No functional changes from v4.0.3.
+
+## [v4.0.3] - 2026-10-10
+
+### Added
+
+- Publish or unpublish pages directly from the Page index.
+
+### Fixed
+
+- Keep Add Child Page buttons on one line.
 
 ## [v4.0.2] - 2026-09-21
 
@@ -220,7 +262,11 @@ First release of `comfortable_media_surfer`. This new gem is a revival of [Comfo
 
 - Rebranded **ComfortableMexicanSofa** as **ComfortableMediaSurfer** in order to publish new gem (database table names and schema have not changed).
 
-[Unreleased]: https://github.com/avonderluft/comfy-middle-seat/compare/v4.0.2...master
+[Unreleased]: https://github.com/avonderluft/comfy-middle-seat/compare/v4.2.0...master
+[v4.2.0]: https://github.com/avonderluft/comfy-middle-seat/compare/v4.1.0...v4.2.0
+[v4.1.0]: https://github.com/avonderluft/comfy-middle-seat/compare/v4.0.4...v4.1.0
+[v4.0.4]: https://github.com/avonderluft/comfy-middle-seat/compare/ea2bb99c0398e1f4d6e850a25e0c13afc577c3ad...v4.0.4
+[v4.0.3]: https://github.com/avonderluft/comfy-middle-seat/compare/v4.0.2...ea2bb99c0398e1f4d6e850a25e0c13afc577c3ad
 [v4.0.2]: https://github.com/avonderluft/comfy-middle-seat/compare/v4.0.1...v4.0.2
 [v4.0.1]: https://github.com/avonderluft/comfy-middle-seat/compare/v4.0.0...v4.0.1
 [v4.0.0]: https://github.com/avonderluft/comfy-middle-seat/compare/v3.2.1...v4.0.0

data/README.md

@@ -114,6 +114,70 @@ A Site defines a hostname, path, and language. Layouts define page structure and
 
 When an editor creates a Page using this Layout, the admin automatically presents fields for `title` and `content`. Content tags can also provide Markdown, files, images, dates, numbers, checkboxes, snippets, partials, helpers, navigation, and other reusable content.
 
+### Editor shortcuts
+
+In HTML and Markdown code editors, type a shortcut and press **Tab** to insert a CMS tag. The parameter placeholder is selected so you can replace it immediately. For example, `;md` inserts `{{ cms:markdown content }}` with `content` selected.
+
+Type **`;;` then Tab**, or press **Ctrl+Space**, for a searchable shortcut list. Search by shortcut or tag name: `c` prioritizes comment, children, and other `c` shortcuts; `p fl` finds `page_file_link`. Exact and prefix matches appear before fuzzy matches.
+
+Use the arrow keys and **Enter** or **Tab** to choose. The tag replaces the entire trigger and search text. **Escape** closes the list without changing your text. Full names such as `;markdown` also work for direct expansion. One **Undo** reverses the expansion without removing what you typed.
+
+| Shortcut | Inserts | Selected placeholder |
+| --- | --- | --- |
+| `;md` | `markdown` | `content` |
+| `;tx` | `text` | `field` |
+| `;ta` | `textarea` | `content` |
+| `;wys` | `wysiwyg` | `content` |
+| `;da` | `date` | `field` |
+| `;dt` | `datetime` | `field` |
+| `;num` | `number` | `field` |
+| `;cb` | `checkbox` | `field` |
+| `;fi` | `file`, as a link | `attachment` |
+| `;fs` | `files`, as links | `attachments` |
+| `;im` | `image` | `image label` |
+| `;au` | `audio` | `path/to/audio` |
+| `;fl` | `file_link`, as a link | `file_id` |
+| `;pfl` | `page_file_link`, as a link | `attachment` |
+| `;sn` | `snippet` | `identifier` |
+| `;as`, `;css` | CSS `asset` tag | `layout_identifier` |
+| `;js` | JavaScript `asset` tag | `layout_identifier` |
+| `;hlp` | `helper` | `method_name` |
+| `;par` | `partial` | `path/to/partial` |
+| `;tpl` | `template` | `path/to/template` |
+| `;cr` | `breadcrumbs` | — |
+| `;ch` | `children` | — |
+| `;si` | `siblings` | — |
+| `;com` | Complete multiline comment block | `Comment here` |
+| `;nt` | `comment "Note"` (also `;note`) | `Note` |
+| `;ec` | `endcomment` | — |
+| `;end` | `end` | — |
+
+Placeholders are examples: replace them with your field names, identifiers, paths, or IDs. `;asset` inserts the CSS version; `;comment` inserts a full comment block.
+
+Shortcuts work at the start of a line, after whitespace, or after `>`, outside an existing CMS tag. Unrecognized shortcuts retain normal Tab behavior. CSS, JavaScript, ordinary text fields, and visual editors are unchanged. Saved content uses the standard `{{ cms:... }}` syntax.
+
+### CMS comments
+
+Use a quoted note for a short comment:
+
+```html
+{{cms:comment "Replace this banner in December"}}
+```
+
+Use a block to hide a section, including any CMS tags inside it:
+
+```html
+{{cms:comment}}
+Internal note: this section is not ready.
+{{cms:markdown old_content}}
+{{cms:snippet seasonal_banner}}
+{{cms:endcomment}}
+```
+
+Comments produce no rendered output and do not create editor fields. Unlike HTML comments, enclosed CMS tags are not processed. Source text and existing field values remain stored; removing a comment restores normal processing.
+
+Blocks may be nested and must end with `{{cms:endcomment}}`, not `{{cms:end}}`. Short notes accept single or double quotes, with backslash-escaped quotes. Unclosed blocks and malformed comment tags raise a clear syntax error. Comments work in layouts, snippets, and rendered fragment content, including Markdown. They are not a place for secrets: original source remains available to editors and may be exposed by APIs that include raw content.
+
 ### Publishing pages
 
 A page is publicly visible only when it and all its ancestors are published. Unpublishing a parent hides its branch without changing descendants’ individual publication settings. Republishing the parent restores only descendants whose full ancestor chain is published; drafts stay unpublished. Translations must also satisfy their own publication settings.

data/app/assets/javascripts/comfy/admin/cms/application.js

@@ -4,6 +4,7 @@ import ujs from "@rails/ujs";
 window.jQuery = window.$ = jQuery;
 ujs.start();
 
+import "bootstrap/js/src/alert";
 import "bootstrap/js/src/tab";
 import "bootstrap/js/src/collapse";
 import "bootstrap/js/src/dropdown";
@@ -20,6 +21,7 @@ import "./draft_forms";
 import "./file_link";
 import "./file_upload";
 import "./files_modal";
+import "./flash_notices";
 import "./page_fragments";
 import "./sortable_list";
 import "./slugify";

data/app/assets/javascripts/comfy/admin/cms/base.js

@@ -32,9 +32,11 @@
     CMS.fileUpload.init();
     CMS.diff();
     CMS.draftForms.init();
+    CMS.flashNotices.init();
   };
 
   CMS.dispose = () => {
+    CMS.flashNotices.dispose();
     CMS.pageFragments.dispose();
     CMS.draftForms.dispose();
     CMS.codemirror.dispose();

data/app/assets/javascripts/comfy/admin/cms/cms_tag_completions.js

@@ -0,0 +1,177 @@
+import CodeMirror from "codemirror";
+import "codemirror/addon/hint/show-hint";
+
+const tag = (shortcut, name, params = "", placeholder = null, aliases = []) => ({
+  shortcut,
+  name,
+  aliases: [shortcut, name, ...aliases],
+  text: `{{ cms:${name}${params ? ` ${params}` : ""} }}`,
+  placeholder,
+});
+
+const completions = [
+  tag("md", "markdown", "content", "content"),
+  tag("tx", "text", "field", "field"),
+  tag("ta", "textarea", "content", "content"),
+  tag("wys", "wysiwyg", "content", "content"),
+  tag("da", "date", "field", "field"),
+  tag("dt", "datetime", "field", "field"),
+  tag("num", "number", "field", "field"),
+  tag("cb", "checkbox", "field", "field"),
+  tag("fi", "file", "attachment, as: link", "attachment"),
+  tag("fs", "files", "attachments, as: link", "attachments"),
+  tag("im", "image", '"image label"', "image label"),
+  tag("au", "audio", '"path/to/audio"', "path/to/audio"),
+  tag("fl", "file_link", "file_id, as: link", "file_id"),
+  tag("pfl", "page_file_link", "attachment, as: link", "attachment"),
+  tag("sn", "snippet", "identifier", "identifier"),
+  tag("as", "asset", "layout_identifier, type: css, as: tag", "layout_identifier"),
+  tag("css", "asset", "layout_identifier, type: css, as: tag", "layout_identifier"),
+  tag("js", "asset", "layout_identifier, type: js, as: tag", "layout_identifier"),
+  tag("hlp", "helper", "method_name", "method_name"),
+  tag("par", "partial", '"path/to/partial"', "path/to/partial"),
+  tag("tpl", "template", '"path/to/template"', "path/to/template"),
+  tag("cr", "breadcrumbs"),
+  tag("ch", "children"),
+  tag("si", "siblings"),
+  {
+    ...tag("com", "comment", "", "Comment here"),
+    text: "{{ cms:comment }}\nComment here\n{{ cms:endcomment }}",
+  },
+  tag("nt", "comment", '"Note"', "Note", ["note"]),
+  tag("ec", "endcomment"),
+  tag("end", "end"),
+];
+
+const byAlias = new Map();
+for (const completion of completions) {
+  for (const alias of completion.aliases) {
+    // Shared full names use the primary entry: asset => ;as, comment => ;com.
+    if (!byAlias.has(alias)) byAlias.set(alias, completion);
+  }
+}
+
+const completionContext = (editor, requireSemicolon = false, start = null) => {
+  if (editor.getOption("readOnly") || editor.somethingSelected() ||
+      editor.listSelections().length !== 1) return null;
+
+  const to = editor.getCursor();
+  const line = editor.getLine(to.line);
+  if (/\w/.test(line.charAt(to.ch))) return null;
+
+  if (start && (start.line !== to.line || start.ch > to.ch)) return null;
+  // Keep the menu's original start so spaces in a fuzzy query are not lost.
+  const match = start
+    ? /^(;{0,2}[\w ]*)$/.exec(line.slice(start.ch, to.ch))
+    : /(?:^|[\s>])(;;[\w ]*|;?\w*)$/.exec(line.slice(0, to.ch));
+  if (!match || (requireSemicolon && !match[1].startsWith(";"))) return null;
+
+  const from = start || CodeMirror.Pos(to.line, to.ch - match[1].length);
+  const before = editor.getRange(CodeMirror.Pos(0, 0), from);
+  if (before.lastIndexOf("{{") > before.lastIndexOf("}}")) return null;
+
+  return {
+    from,
+    to,
+    selector: match[1].startsWith(";;"),
+    query: match[1].replace(/^;{1,2}/, "").toLowerCase().replace(/ /g, ""),
+  };
+};
+
+const insertCompletion = (editor, completion, from, to) => {
+  const indent = editor.getLine(from.line).match(/^\s*/)[0];
+  const text = completion.text.replace(/\n/g, `\n${indent}`);
+  const start = editor.indexFromPos(from);
+
+  editor.operation(() => {
+    // A distinct history origin keeps the expansion separate from preceding typing.
+    editor.replaceRange(text, from, to, "cms-completion");
+    if (completion.placeholder) {
+      const offset = text.indexOf(completion.placeholder);
+      editor.setSelection(
+        editor.posFromIndex(start + offset),
+        editor.posFromIndex(start + offset + completion.placeholder.length)
+      );
+    } else {
+      editor.setCursor(editor.posFromIndex(start + text.length));
+    }
+  });
+};
+
+const matchRank = (alias, query) => {
+  if (alias === query) return 0;
+  if (alias.startsWith(query)) return 1;
+  if (alias.includes(query)) return 2;
+
+  let position = 0;
+  for (const character of query) {
+    position = alias.indexOf(character, position);
+    if (position === -1) return Infinity;
+    position += 1;
+  }
+  return 3;
+};
+
+const displayNames = {
+  as: "asset (CSS)",
+  css: "asset (CSS)",
+  js: "asset (JavaScript)",
+  com: "comment (block)",
+  nt: "comment (note)",
+};
+
+const hints = (editor, start) => {
+  const context = completionContext(editor, false, start);
+  if (!context) return null;
+
+  return {
+    from: context.from,
+    to: context.to,
+    list: completions
+      .map((completion) => ({
+        completion,
+        rank: Math.min(...completion.aliases.map((alias) => matchRank(alias, context.query))),
+      }))
+      .filter(({ rank }) => Number.isFinite(rank))
+      .sort((a, b) => a.rank - b.rank)
+      .map(({ completion }) => ({
+        text: completion.text,
+        displayText: `;${completion.shortcut} ${displayNames[completion.shortcut] || completion.name}`,
+        hint(cm, data) {
+          insertCompletion(cm, completion, data.from, data.to);
+        },
+      })),
+  };
+};
+
+const showCompletions = (editor, context) => {
+  editor.showHint({
+    hint: (cm) => hints(cm, context.from),
+    completeSingle: false,
+    closeCharacters: /[\t\r\n()[\]{}:>,]/,
+  });
+};
+
+export const cmsTagCompletionKeys = (mode) => {
+  if (!["text/html", "htmlmixed", "text/x-markdown", "markdown"].includes(mode)) return {};
+
+  return {
+    Tab(editor) {
+      const context = completionContext(editor, true);
+      if (context?.selector) {
+        showCompletions(editor, context);
+        return;
+      }
+      const completion = context && byAlias.get(context.query);
+      if (!completion) return CodeMirror.Pass;
+
+      insertCompletion(editor, completion, context.from, context.to);
+    },
+    "Ctrl-Space"(editor) {
+      const context = completionContext(editor);
+      if (!context) return CodeMirror.Pass;
+
+      showCompletions(editor, context);
+    },
+  };
+};

data/app/assets/javascripts/comfy/admin/cms/codemirror.js

@@ -1,5 +1,6 @@
 import jQuery from "jquery";
 import CodeMirror from "codemirror";
+import { cmsTagCompletionKeys } from "./cms_tag_completions";
 import "codemirror/mode/markdown/markdown";
 import "codemirror/mode/htmlmixed/htmlmixed";
 
@@ -12,6 +13,7 @@ import "codemirror/mode/htmlmixed/htmlmixed";
       )) {
         const codemirror = CodeMirror.fromTextArea(textarea, {
           mode: textarea.dataset.cmsCmMode,
+          extraKeys: cmsTagCompletionKeys(textarea.dataset.cmsCmMode),
           tabSize: 2,
           lineWrapping: true,
           autoCloseTags: true,
@@ -52,6 +54,7 @@ import "codemirror/mode/htmlmixed/htmlmixed";
     },
     dispose() {
       for (const codemirror of codeMirrorInstances) {
+        codemirror.closeHint();
         codemirror.toTextArea();
       }
       codeMirrorInstances.length = 0;

data/app/assets/javascripts/comfy/admin/cms/flash_notices.js

@@ -0,0 +1,73 @@
+import $ from "jquery";
+import Alert from "bootstrap/js/src/alert";
+
+(() => {
+  const DELAY = 5000;
+  let cleanups = [];
+
+  const watch = (notice) => {
+    let remaining = DELAY;
+    let startedAt;
+    let timer = null;
+    let hovered = notice.matches(":hover");
+    let focused = notice.contains(document.activeElement);
+
+    const pause = () => {
+      if (timer === null) return;
+      window.clearTimeout(timer);
+      timer = null;
+      remaining = Math.max(0, remaining - (performance.now() - startedAt));
+    };
+
+    const resume = () => {
+      if (timer !== null || hovered || focused || !notice.isConnected) return;
+      startedAt = performance.now();
+      timer = window.setTimeout(() => {
+        timer = null;
+        cleanup();
+        if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
+          notice.classList.remove("fade");
+        }
+        new Alert(notice).close();
+      }, remaining);
+    };
+
+    const onMouseEnter = () => { hovered = true; pause(); };
+    const onMouseLeave = () => { hovered = false; resume(); };
+    const onFocusIn = () => { focused = true; pause(); };
+    const onFocusOut = (event) => {
+      focused = notice.contains(event.relatedTarget);
+      if (!focused) resume();
+    };
+    const cleanup = () => {
+      pause();
+      notice.removeEventListener("mouseenter", onMouseEnter);
+      notice.removeEventListener("mouseleave", onMouseLeave);
+      notice.removeEventListener("focusin", onFocusIn);
+      notice.removeEventListener("focusout", onFocusOut);
+      $(notice).off("close.bs.alert", cleanup);
+    };
+
+    notice.addEventListener("mouseenter", onMouseEnter);
+    notice.addEventListener("mouseleave", onMouseLeave);
+    notice.addEventListener("focusin", onFocusIn);
+    notice.addEventListener("focusout", onFocusOut);
+    $(notice).on("close.bs.alert", cleanup);
+    cleanups.push(cleanup);
+    resume();
+  };
+
+  CMS.flashNotices = {
+    init() {
+      this.dispose();
+      document.querySelectorAll(
+        "[data-cms-flash].alert-success, [data-cms-flash].alert-info"
+      ).forEach(watch);
+    },
+
+    dispose() {
+      cleanups.forEach((cleanup) => cleanup());
+      cleanups = [];
+    },
+  };
+})();

data/app/assets/stylesheets/comfy/admin/cms/application.sass

@@ -2,6 +2,7 @@
 @import "comfy/vendor/bootstrap/bootstrap"
 
 @import "codemirror/lib/codemirror"
+@import "codemirror/addon/hint/show-hint"
 @import "comfy/vendor/fontawesome"
 @import "comfy/vendor/redactor"
 @import "flatpickr/dist/flatpickr.min"

data/app/assets/stylesheets/comfy/admin/cms/codemirror_overrides.sass

@@ -12,6 +12,17 @@ body#comfy
     .CodeMirror-scroll
       min-height: 160px
 
+  .CodeMirror-hints
+    z-index: 1060
+    max-width: calc(100vw - 1rem)
+    border-color: $gray-400
+    background-color: $white
+    .CodeMirror-hint
+      color: $body-color
+    .CodeMirror-hint-active
+      background-color: $primary
+      color: $white
+
   .CodeMirror-focused
     border-color: rgba(82, 168, 236, 0.8)
     outline: 0

data/app/assets/stylesheets/comfy/admin/cms/harbor.sass

@@ -42,6 +42,36 @@ body#comfy
   #cms-main
     .page-header
       color: $harbor-navy
+    .page-editor-toolbar
+      position: sticky
+      top: 0
+      z-index: 1000
+      display: grid
+      grid-template-columns: max-content minmax(0, 1fr)
+      align-items: center
+      gap: .5rem 1rem
+      padding: .75rem 0
+      background-color: $body-bg
+      .page-editor-heading h2
+        margin-bottom: 0
+      .page-publication-state
+        grid-column: 1 / -1
+      .page-editor-actions
+        display: flex
+        flex-wrap: wrap
+        align-items: center
+        justify-content: flex-end
+        gap: .5rem
+        min-width: 0
+
+      @media (max-width: map-get($grid-breakpoints, lg))
+        top: 3rem
+      @include media-breakpoint-down(sm)
+        grid-template-columns: minmax(0, 1fr)
+        .page-editor-actions
+          justify-content: flex-start
+    .layout-actions .btn-group
+      max-width: 100%
     ul.list
       li .row
         @include transition(background-color .15s ease-in-out)

data/app/controllers/comfy/admin/cms/pages_controller.rb

@@ -64,12 +64,28 @@ class Comfy::Admin::Cms::PagesController < Comfy::Admin::Cms::BaseController
   end
 
   def update
-    @page.save!
-    update_family
+    publication_action = params[:publication_action].presence_in(%w[publish unpublish])
+    original_publication = @page.is_published_in_database
+    @page.is_published = publication_action == 'publish' if publication_action
+
+    @page.class.transaction do
+      @page.save!
+      update_family
+    end
     acknowledge_draft_save
-    flash[:success] = I18n.t('comfy.admin.cms.pages.updated')
+    flash[:success] = case publication_action
+                      when 'publish'
+                        I18n.t('comfy.admin.cms.pages.saved_and_published', default: 'Page saved and published')
+                      when 'unpublish'
+                        I18n.t('comfy.admin.cms.pages.saved_and_unpublished', default: 'Page saved and unpublished')
+                      else
+                        I18n.t('comfy.admin.cms.pages.updated')
+                      end
     redirect_to action: :edit, id: @page
-  rescue ActiveRecord::RecordInvalid
+  rescue ActiveRecord::RecordInvalid => e
+    # Keep submitted edits and errors, but show the publication state that was actually saved.
+    @page.is_published = original_publication if publication_action
+    @page.errors.add(:base, e.message) unless e.record == @page
     flash.now[:danger] = I18n.t('comfy.admin.cms.pages.update_failure')
     render action: :edit
   end

data/app/views/comfy/admin/cms/layouts/_index_branch.html.haml

@@ -3,7 +3,7 @@
 
 %li{data: {id: layout.id}}
   .row
-    .col-md-8.item
+    .col-12.col-md.item
       .item-controls.d-none.d-md-block
         - if has_siblings
           .dragger
@@ -15,7 +15,7 @@
         .item-meta
           = layout.identifier
 
-    .col-md-4.d-flex.align-items-center.justify-content-md-end
+    .col-12.col-md-auto.layout-actions.d-flex.align-items-center.justify-content-md-end
       .btn-group.btn-group-sm
         = link_to t('.add_child_layout'), new_comfy_admin_cms_site_layout_path(@site, parent_id: layout.id), class: "btn btn-outline-secondary"
         = link_to t('.edit'), edit_comfy_admin_cms_site_layout_path(@site, layout), class: "btn btn-outline-secondary"

data/app/views/comfy/admin/cms/pages/_form.html.haml

@@ -22,11 +22,13 @@
 - if (options = ::Comfy::Cms::Page.options_for_select(site: @site, current_page: @page)).present?
   = form.select :target_page_id, [["---- #{t('.select_target_page')} ----", nil]] + options, bootstrap: {custom_control: true}
 
-= form.check_box :is_published
+- if @page.new_record?
+  = form.check_box :is_published
 
 = comfy_admin_partial "comfy/admin/cms/partials/page_form_after", form: form
 
-= form.form_actions do
-  = submit_tag t(".preview"), name: "preview", formtarget: "comfy-cms-preview", id: nil, class: "btn btn-secondary"
-  = submit_tag t(@page.new_record?? ".create" : ".update"), class: "btn btn-primary ml-sm-1"
-  = link_to t(".cancel"), comfy_admin_cms_site_pages_path, class: "btn btn-link"
+- if @page.new_record?
+  = form.form_actions do
+    = submit_tag t(".preview"), name: "preview", formtarget: "comfy-cms-preview", id: nil, class: "btn btn-secondary"
+    = submit_tag t(".create"), class: "btn btn-primary ml-sm-1"
+    = link_to t(".cancel"), comfy_admin_cms_site_pages_path, class: "btn btn-link"

data/app/views/comfy/admin/cms/pages/edit.html.haml

@@ -3,32 +3,50 @@
   = render "comfy/admin/cms/revisions/sidebar", record: @page, link: link
   = render "comfy/admin/cms/translations/sidebar"
 
-.page-header.d-flex.justify-content-between.align-items-center
-  %h2= t('.title')
-  - if @page.children.exists?
-    - publication_states = descendant_publication_states(@page)
-    .dropdown
-      %button#child-pages-menu.btn.btn-sm.btn-outline-secondary.dropdown-toggle.text-nowrap{type: 'button', data: {toggle: 'dropdown'}, aria: {haspopup: 'true', expanded: 'false', controls: 'child-pages-actions'}}
-        = t('.child_pages', default: 'Child pages')
-      #child-pages-actions.dropdown-menu.dropdown-menu-right{aria: {labelledby: 'child-pages-menu'}}
-        - if publication_states.include?(false)
-          = link_to t('.publish_descendants', default: 'Publish descendants'), publish_children_comfy_admin_cms_site_page_path(@site, @page), method: :patch, data: {confirm: t('.publish_descendants_confirmation', default: 'Publish all descendant pages?')}, class: 'dropdown-item'
-        - else
-          %button.dropdown-item.disabled{type: 'button', disabled: true, aria: {disabled: 'true'}}= t('.publish_descendants', default: 'Publish descendants')
-        - if publication_states.include?(true)
-          = link_to t('.unpublish_descendants', default: 'Unpublish descendants'), unpublish_children_comfy_admin_cms_site_page_path(@site, @page), method: :patch, data: {confirm: t('.unpublish_descendants_confirmation', default: 'Unpublish all descendant pages?')}, class: 'dropdown-item'
-        - else
-          %button.dropdown-item.disabled{type: 'button', disabled: true, aria: {disabled: 'true'}}= t('.unpublish_descendants', default: 'Unpublish descendants')
-
-- unless @page.published_with_ancestors?
-  .alert.alert-info.publication-status{role: 'status'}
-    - if @page.is_published?
-      = t('.hidden_by_ancestor', default: 'Hidden by unpublished ancestor. Publish its ancestors to make this page visible.')
-    - else
-      = t('.unpublished_notice', default: 'This page is unpublished.')
-    = t('.branch_visibility_notice', default: 'Descendants are visible only when they and all their ancestors are published. Their publication settings are preserved when an ancestor is unpublished.')
-
 - draft_data = cms_draft_form_data('site', @site.id, 'page', @page.id, record: @page)
 = comfy_form_with model: @page, scope: :page, url: {action: :update}, html: {multipart: true, data: draft_data} do |form|
   = hidden_field_tag :cms_draft_key, draft_data[:cms_draft_key]
+  .page-header.page-editor-toolbar
+    .page-editor-heading
+      %h2= t('.title')
+
+    .page-editor-actions
+      = submit_tag t('comfy.admin.cms.pages.form.preview'), name: 'preview', formtarget: 'comfy-cms-preview', id: nil, class: 'btn btn-sm btn-outline-secondary text-nowrap', data: {disable_with: false}
+      = submit_tag t('comfy.admin.cms.pages.form.update'), class: 'btn btn-sm btn-primary text-nowrap', data: {disable_with: false}
+      - publication_action = @page.is_published? ? 'unpublish' : 'publish'
+      - publication_label = @page.is_published? ? t('.unpublish', default: 'Unpublish') : t('.publish', default: 'Publish')
+      - publication_hint = @page.is_published? ? t('.save_and_unpublish_hint', default: 'Save and unpublish page') : t('.save_and_publish_hint', default: 'Save and publish page')
+      = button_tag publication_label, name: 'publication_action', value: publication_action, class: 'btn btn-sm btn-outline-secondary text-nowrap', title: publication_hint, aria: {describedby: 'page-publication-hint'}
+      - if @page.children.exists?
+        - publication_states = descendant_publication_states(@page)
+        .dropdown
+          %button#child-pages-menu.btn.btn-sm.btn-outline-secondary.dropdown-toggle.text-nowrap{type: 'button', data: {toggle: 'dropdown'}, aria: {haspopup: 'true', expanded: 'false', controls: 'child-pages-actions'}}
+            = t('.child_pages', default: 'Child pages')
+          #child-pages-actions.dropdown-menu.dropdown-menu-right{aria: {labelledby: 'child-pages-menu'}}
+            - if publication_states.include?(false)
+              = link_to t('.publish_descendants', default: 'Publish descendants'), publish_children_comfy_admin_cms_site_page_path(@site, @page), method: :patch, data: {confirm: t('.publish_descendants_confirmation', default: 'Publish all descendant pages?')}, class: 'dropdown-item'
+            - else
+              %button.dropdown-item.disabled{type: 'button', disabled: true, aria: {disabled: 'true'}}= t('.publish_descendants', default: 'Publish descendants')
+            - if publication_states.include?(true)
+              = link_to t('.unpublish_descendants', default: 'Unpublish descendants'), unpublish_children_comfy_admin_cms_site_page_path(@site, @page), method: :patch, data: {confirm: t('.unpublish_descendants_confirmation', default: 'Unpublish all descendant pages?')}, class: 'dropdown-item'
+            - else
+              %button.dropdown-item.disabled{type: 'button', disabled: true, aria: {disabled: 'true'}}= t('.unpublish_descendants', default: 'Unpublish descendants')
+            .dropdown-divider
+            .px-4.py-1.small.text-muted= t('.descendants_hint', default: 'Changes descendants only; does not save this page’s edits.')
+      = link_to t('comfy.admin.cms.pages.form.cancel'), comfy_admin_cms_site_pages_path(@site), class: 'btn btn-sm btn-link text-nowrap'
+    .page-publication-state.small.text-muted{role: 'status'}
+      - if !@page.is_published?
+        = t('.unpublished_notice', default: 'Unpublished.')
+        = t('.branch_visibility_notice', default: 'Descendants hidden, with their publication settings unchanged.')
+      - elsif !@page.published_with_ancestors?
+        = t('.hidden_status', default: 'Hidden by unpublished ancestor')
+      - else
+        = t('.published', default: 'Published')
+    %span#page-publication-hint{hidden: true}= publication_hint
+
+  - if @page.is_published? && !@page.published_with_ancestors?
+    .alert.alert-info.publication-status{role: 'status'}
+      = t('.hidden_by_ancestor', default: 'Hidden by unpublished ancestor.')
+      = t('.branch_visibility_notice', default: 'Descendants hidden, with their publication settings unchanged.')
+
   = render form

data/app/views/layouts/comfy/admin/cms/_flash.html.haml

@@ -1,4 +1,4 @@
 - flash.to_hash.except('cms_saved_draft_key').each do |type, message|
-  .alert{:class => "alert-#{type}"}
+  .alert.fade.show{class: "alert-#{type}", data: {cms_flash: true}, role: %w[success info].include?(type) ? 'status' : 'alert'}
     %button.close{:type => 'button', :class => "close", :data => {:dismiss => 'alert'}} ×
     = message

data/config/locales/en.yml

@@ -123,7 +123,7 @@ en:
         pages:
           created: Page created, siblings, and parent updated
           creation_failure: Failed to create page
-          updated: Page, siblings, and parent updated
+          updated: Page updated
           update_failure: Failed to update page
           children_published: Descendant pages published
           children_unpublished: Descendant pages unpublished

data/lib/comfy_middle_seat/content/renderer.rb

@@ -22,6 +22,9 @@ class ComfyMiddleSeat::Content::Renderer
 
   # tags are in this format: {{ cms:tag_class params }}
   TAG_REGEX = %r{\{\{\s*?cms:(?<class>\w+)(?<params>.*?)\}\}}
+  COMMENT_START_REGEX = %r{\{\{\s*cms:(?<comment>comment|endcomment)(?=\s|\}\}|\z)}
+  TOKEN_REGEX = %r{#{COMMENT_START_REGEX}|#{TAG_REGEX}}
+  COMMENT_NOTE_REGEX = %r{(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|“(?:\\.|[^”\\])*”|‘(?:\\.|[^’\\])*’)\s*\}\}}m
 
   class << self
     # @return [Hash<String, Class<ComfyMiddleSeat::Content::Tag>>]
@@ -73,23 +76,35 @@ class ComfyMiddleSeat::Content::Renderer
 
   # Splitting text with tags into tokens we can process down the line
   # @return [Array<String, {Symbol => String}>]
-  def tokenize(string)
+  def tokenize(string, preserve_whitespace: false)
     tokens = []
     ss = StringScanner.new(string.to_s)
-    while (string = ss.scan_until(TAG_REGEX))
+    while (string = ss.scan_until(TOKEN_REGEX))
       text = string.sub(ss[0], '')
       tokens << text unless text.empty?
-      tokens << {
-        tag_class: ss[:class],
-        tag_params: ss[:params].strip,
-        source: ss[0]
-      }
+      case ss[:comment]
+      when 'comment'
+        skip_comment(ss)
+      when 'endcomment'
+        raise SyntaxError, 'Unexpected {{cms:endcomment}} without {{cms:comment}}'
+      else
+        tokens << {
+          tag_class: ss[:class],
+          tag_params: ss[:params].strip,
+          source: ss[0]
+        }
+      end
     end
     text = ss.rest
-    tokens << text if text.present?
+    tokens << text if text.present? || (preserve_whitespace && !text.empty?)
     tokens
   end
 
+  # Remove comments before formatters such as Markdown can transform their contents.
+  def strip_comments(string)
+    tokenize(string, preserve_whitespace: true).map { |token| token.is_a?(Hash) ? token[:source] : token }.join
+  end
+
   # Constructing node tree for content. It's a list of strings and tags with
   # their own `nodes` method that has array of strings and tags with their own
   # `nodes` method that... you get the idea.
@@ -143,4 +158,34 @@ class ComfyMiddleSeat::Content::Renderer
 
     nodes.flatten
   end
+
+private
+
+  # Comments are lexical: their contents must never become tag instances or form fields.
+  def skip_comment(scanner)
+    return unless comment_block?(scanner)
+
+    depth = 1
+    while scanner.scan_until(COMMENT_START_REGEX)
+      if scanner[:comment] == 'comment'
+        depth += 1 if comment_block?(scanner)
+      else
+        unless scanner.skip(%r{\s*\}\}})
+          raise SyntaxError, 'Invalid CMS comment closing tag: use {{cms:endcomment}} without parameters'
+        end
+
+        depth -= 1
+        return if depth.zero?
+      end
+    end
+    raise SyntaxError, 'Unclosed CMS comment: expected {{cms:endcomment}}'
+  end
+
+  def comment_block?(scanner)
+    scanner.skip(%r{\s*})
+    return true if scanner.skip(%r{\}\}})
+    return false if scanner.skip(COMMENT_NOTE_REGEX)
+
+    raise SyntaxError, 'Invalid CMS comment: use {{cms:comment "note"}} or {{cms:comment}}...{{cms:endcomment}}'
+  end
 end

data/lib/comfy_middle_seat/content/tags/markdown.rb

@@ -5,7 +5,10 @@
 #
 class ComfyMiddleSeat::Content::Tags::Markdown < ComfyMiddleSeat::Content::Tags::Fragment
   def render
-    renderable ? Kramdown::Document.new(content.to_s).to_html : ''
+    return '' unless renderable
+
+    source = ComfyMiddleSeat::Content::Renderer.new(context).strip_comments(content)
+    Kramdown::Document.new(source).to_html
   end
 
   def form_field(object_name, view, index)

data/lib/comfy_middle_seat/content/tags/snippet.rb

@@ -18,7 +18,8 @@ class ComfyMiddleSeat::Content::Tags::Snippet < ComfyMiddleSeat::Content::Tag
 
   def content
     if snippet.markdown
-      Kramdown::Document.new(snippet.content.to_s).to_html
+      source = ComfyMiddleSeat::Content::Renderer.new(context).strip_comments(snippet.content)
+      Kramdown::Document.new(source).to_html
     else
       snippet.content
     end

data/lib/comfy_middle_seat/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module ComfyMiddleSeat
-  VERSION = '4.1.0'
+  VERSION = '4.3.0'
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: comfy_middle_seat
 version: !ruby/object:Gem::Version
-  version: 4.1.0
+  version: 4.3.0
 platform: ruby
 authors:
 - Oleg Khabarov
@@ -230,6 +230,7 @@ files:
 - app/assets/javascripts/comfy/admin/cms/application.js
 - app/assets/javascripts/comfy/admin/cms/base.js
 - app/assets/javascripts/comfy/admin/cms/categories.js
+- app/assets/javascripts/comfy/admin/cms/cms_tag_completions.js
 - app/assets/javascripts/comfy/admin/cms/codemirror.js
 - app/assets/javascripts/comfy/admin/cms/custom.js
 - app/assets/javascripts/comfy/admin/cms/diff.js
@@ -237,6 +238,7 @@ files:
 - app/assets/javascripts/comfy/admin/cms/file_link.js
 - app/assets/javascripts/comfy/admin/cms/file_upload.js
 - app/assets/javascripts/comfy/admin/cms/files_modal.js
+- app/assets/javascripts/comfy/admin/cms/flash_notices.js
 - app/assets/javascripts/comfy/admin/cms/page_fragments.js
 - app/assets/javascripts/comfy/admin/cms/slugify.js
 - app/assets/javascripts/comfy/admin/cms/sortable_list.js