Live preview edit fixes

docs/API-Reference/command/CommandManager.md

@@ -14,6 +14,7 @@ const CommandManager = brackets.getModule("command/CommandManager")
     * [.execute()](#Command+execute) ⇒ <code>$.Promise</code>
     * [.getEnabled()](#Command+getEnabled) ⇒ <code>boolean</code>
     * [.getOptions()](#Command+getOptions) ⇒ <code>object</code>
+    * [.isSupportedInDesignMode()](#Command+isSupportedInDesignMode) ⇒ <code>boolean</code>
     * [.setEnabled(enabled)](#Command+setEnabled)
     * [.setChecked(checked)](#Command+setChecked)
     * [.getChecked()](#Command+getChecked) ⇒ <code>boolean</code>
@@ -61,6 +62,15 @@ Is command enabled?
 ### command.getOptions() ⇒ <code>object</code>
 get the command options
 
+**Kind**: instance method of [<code>Command</code>](#Command)  
+<a name="Command+isSupportedInDesignMode"></a>
+
+### command.isSupportedInDesignMode() ⇒ <code>boolean</code>
+Returns true if the command opted in to running while the workspace is in
+design mode (editor collapsed). KeyBindingManager uses this to decide
+whether a keyboard shortcut should fire; commands that don't opt in are
+swallowed in design mode.
+
 **Kind**: instance method of [<code>Command</code>](#Command)  
 <a name="Command+setEnabled"></a>
 
@@ -165,6 +175,7 @@ Registers a global command.
 | [options] | <code>Object</code> |  |
 | options.eventSource | <code>boolean</code> | If set to true, the commandFn will be called with the first argument `event` with details about the source(invoker) as event.eventSource(one of the `CommandManager.SOURCE_*`) and event.sourceType(Eg. Ctrl-K) parameter. |
 | options.htmlName | <code>string</code> | If set, this will be displayed in ui menus instead of the name given.      Example: `"Phoenix menu<i class='fa fa-car' style='margin-left: 4px;'></i>"` |
+| options.supportsDesignMode | <code>boolean</code> | If true, this command's keyboard shortcut will still fire when      the workspace is in design mode. Commands that don't opt in are swallowed in design mode because the      editor area is collapsed and most shortcuts are nonsensical there. Reserve this flag for commands that      remain useful with no editor visible (file open/save/close, Quick Open, Find in Files, etc.). |
 
 <a name="registerInternal"></a>
 

src/LiveDevelopment/BrowserScripts/RemoteFunctions.js

@@ -113,6 +113,10 @@
      * check if an element is inspectable.
      * inspectable elements are those which doesn't have GLOBALS.DATA_BRACKETS_ID_ATTR ('data-brackets-id'),
      * this normally happens when content is DOM content is inserted by some scripting language
+     *
+     * Elements opted out via `phcode-no-lp-edit` (cascades to descendants) or
+     * `phcode-no-lp-edit-this` (this element only) are also non-inspectable so
+     * every downstream tool inherits the opt-out automatically.
      */
     function isElementInspectable(element, onlyHighlight = false) {
         if(config.mode !== 'edit' && !onlyHighlight) {
@@ -124,7 +128,9 @@
             element.tagName.toLowerCase() !== "html" && // shouldn't be the HTML tag
             // this attribute is used by phoenix internal elements
             !element.closest(`[${GLOBALS.PHCODE_INTERNAL_ATTR}]`) &&
-            !_isInsideHeadTag(element)) { // shouldn't be inside the head tag like meta tags and all
+            !_isInsideHeadTag(element) && // shouldn't be inside the head tag like meta tags and all
+            !element.closest('.phcode-no-lp-edit') &&
+            !(element.classList && element.classList.contains('phcode-no-lp-edit-this'))) {
             return true;
         }
         return false;
@@ -592,9 +598,6 @@
         if(!LivePreviewView.isElementInspectable(element) || element.nodeType !== Node.ELEMENT_NODE) {
             return;
         }
-        if(element && (element.closest('.phcode-no-lp-edit') || element.classList.contains('phcode-no-lp-edit-this'))) {
-            return;
-        }
 
         // Same element as last hover — nothing changed, skip entirely
         if (element === _lastHoverTarget) {
@@ -764,6 +767,8 @@
             event.stopPropagation();
             return;
         }
+        // Opted-out elements: silent no-op so the user's existing selection isn't dismissed.
+        // (isElementInspectable would also reject them, but that path runs dismissUIAndCleanupState.)
         if(element && (element.closest('.phcode-no-lp-edit') || element.classList.contains('phcode-no-lp-edit-this'))) {
             return;
         }

src/assets/default-project/en/Newly_added_features.md

@@ -7,6 +7,72 @@ We are continuously adding features every week to improve the life of web develo
 
 Here's a list of top features recently added to Phoenix:
 
+## [AI Chat — Built-in Coding Assistant](https://docs.phcode.dev/app-links/ai-chat)
+
+`Added in 2026`
+
+Phoenix Code now ships with a built-in AI assistant powered by Claude Code. Chat about your code, edit files, run terminal commands, and restore to any point with a single click.  
+You can also attach files or take a screenshot to show the AI exactly what you mean.
+
+> This feature is available only in desktop apps.
+
+![Image](https://docs-images.phcode.dev/in-app/pro-aiChat.png)
+
+<h2><a target="_blank" href="https://docs.phcode.dev/app-links/edit-mode-live-preview">Live Preview Edit Mode 2.0</a></h2>
+
+`Added in 2026`
+
+The Live Preview Edit experience just got a massive upgrade.  
+Now, along with editing text content, you can also apply different formats like Bold, Italic, Underline, and many more.  
+You can also insert new elements right in the Live Preview and change an existing element's tag name, class, ID, and attributes!
+
+![Image](https://docs-images.phcode.dev/in-app/pro-controlBox.png)
+
+<h2><a target="_blank" href="https://docs.phcode.dev/app-links/markdown-editor">Rich Markdown Editor</a></h2>
+
+`Added in 2026`
+
+Edit Markdown files visually right inside the Live Preview.  
+Format with toolbar buttons, build tables, drop in images from your device, and add Mermaid diagrams. Every change syncs to your source in real time.
+
+![Image](https://docs-images.phcode.dev/in-app/pro-markdownEditor.png)
+
+<h2><a target="_blank" href="https://docs.phcode.dev/app-links/live-preview">Design Mode</a></h2>
+
+`Added in 2026`
+
+Design Mode hides the code editor so the AI chat and Live Preview can sit side by side, taking over the whole window.  
+Prompt the AI on one side, watch your page change on the other, and tweak anything visually with the Edit Mode tools.
+
+![Image](https://docs-images.phcode.dev/in-app/pro-designMode.png)
+
+<h2><a target="_blank" href="https://docs.phcode.dev/app-links/resize-ruler">Resize Ruler</a></h2>
+
+`Added in 2026`
+
+Switch between popular phones, tablets, and desktops with a single click to see how your page looks at that size.  
+Phoenix Code also picks up your CSS `@media` breakpoints so you can jump straight to where your layout switches.
+
+![Image](https://docs-images.phcode.dev/in-app/pro-resizeRuler.png)
+
+<h2><a target="_blank" href="https://docs.phcode.dev/app-links/terminal">Built-in Terminal</a></h2>
+
+`Added in 2026`
+
+Run commands right next to your code in the new built-in terminal.  
+Phoenix Code allows you to open multiple terminal tabs with your preferred shell.
+
+> This feature is available only in desktop apps.
+
+![Image](https://docs-images.phcode.dev/in-app/terminal.png)
+
+## Polish & Layout
+
+`Added in 2026`
+
+You'll notice small refinements everywhere: better colors, cleaner buttons, smoother styling, and an overall more polished feel.  
+The bottom panel has also been rebuilt with a new tabbed architecture, so you can keep Problems, Search, Git, Terminal, and more open at the same time.
+
 <h2><a target="_blank" href="https://docs.phcode.dev/app-links/live-preview-edit">Live Preview Edit</a></h2>
 
 `Added in 2025`

src/extensionsIntegrated/Phoenix-live-preview/main.js

@@ -343,12 +343,8 @@ define(function (require, exports, module) {
      * Does not hide in custom server mode (handled by _isMdviewrActive being false).
      */
     function _updateLPControlsForMdviewer() {
-        const inDesignMode = WorkspaceManager.isInDesignMode && WorkspaceManager.isInDesignMode();
         const showPen = !_isMdviewrActive;
-        // Dropdown is also hidden in design mode (see $designModeBtn wiring in
-        // _createExtensionPanel) because the preview-mode options are moot
-        // when the editor is fully collapsed.
-        const showChevron = !_isMdviewrActive && !inDesignMode;
+        const showChevron = !_isMdviewrActive;
         if ($previewBtn) {
             $previewBtn.toggle(showPen);
         }
@@ -893,9 +889,7 @@ define(function (require, exports, module) {
 
         // Design-mode toggle: mirrors the CCB's pen-nib button so the user can
         // enter/exit design mode without moving focus to the sidebar strip.
-        // Icon swaps between fa-expand (enter) and fa-compress (exit); while
-        // design mode is on, hide #livePreviewModeBtn (the preview-mode dropdown)
-        // since its options are moot when the editor is fully collapsed.
+        // Icon swaps between fa-expand (enter) and fa-compress (exit).
         function _updateDesignModeButton() {
             const on = WorkspaceManager.isInDesignMode && WorkspaceManager.isInDesignMode();
             const $icon = $designModeBtn.find("i");
@@ -904,7 +898,7 @@ define(function (require, exports, module) {
             $designModeBtn.attr("title",
                 on ? Strings.CCB_SWITCH_TO_CODE_EDITOR : Strings.CCB_SWITCH_TO_DESIGN_MODE);
             if ($modeBtn) {
-                $modeBtn.toggle(!on && !_isMdviewrActive);
+                $modeBtn.toggle(!_isMdviewrActive);
             }
         }
         $designModeBtn.click(()=>{

tracking-repos.json

@@ -1,5 +1,5 @@
 {
   "phoenixPro": {
-    "commitID": "f1efe02545e90721e29b7c3acd409c5e7cce8df1"
+    "commitID": "468fd0d0a1ae514613e3ddddf1df964681af3721"
   }
 }