Feat/media blocks theming rtl - #4
Merged
Merged
Conversation
…ark theme, and live RTL - New `audio` and `file` block types across core, Vue, and React: upload / library / URL insertion, file metadata (name, size, MIME), download card, DocRenderer support, and HTML export/import round-trip. - Media import overhaul: works with zero config (object-URL fallback when no `upload` prop), paste files from clipboard, drop OS files onto the editor at a precise position, and a paste-URL tab for images. - Slash menu now measures itself and anchors to the caret: flips above near the viewport bottom, clamps to edges, aligns correctly in RTL, and shows a "No results" state instead of closing abruptly. - Theming: minimal token set (--xpe-surface, --xpe-primary-muted, --xpe-ring, --xpe-radius, --xpe-shadow, ...) with a built-in dark theme via `xpe-dark` class or `data-xpe-theme="dark"`; slash menu and media blocks fully token-driven for easy custom themes. - RTL: text direction now resolves live from content instead of locking on first keystroke, and remaining physical CSS converted to logical properties. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- Site restyled to the Bento reference: monochrome soft-neumorphic palette (no accent color), soft gray gradient canvas, pill surfaces with large radii and layered shadows, and a light/dark toggle with a diagonal View-Transitions sweep between themes. - Live demo gains an editor theme switcher (Bento / Default) proving the editor restyles with a handful of --xpe-* variables, and follows the site's dark mode via the packages' built-in xpe-dark scope. - All remaining hardcoded editor colors converted to theme tokens across both adapters: text blocks, headings, toolbars (fixed + bubble), popovers, dropdown menus, inputs, tabs, color/emoji pickers, table controls, gutter buttons, drop indicators, and callout defaults — the dark theme and custom themes now cover the entire editor surface. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…lash menu/theming/checkmark bugs - New `button` block type: editable label, link URL, open-in-new-tab, primary/outline/ghost style, alignment — settings popover in both adapters, read-only rendering in DocRenderer, core model + tests. - Standalone emoji picker (search, 7 categories, recents), used by the callout icon button and by a new ':' inline trigger (Slack/Discord-style) that searches and inserts an emoji directly into text. - Fix: slash-menu ArrowUp/ArrowDown/Enter never worked — the root keydown handler bailed out for any key typed inside the contenteditable block the menu lives in, which is the only place slash state exists. Same fix applied to the new ':' trigger. - Fix: floating UI (slash menu, bubble toolbar, popovers, dropdowns) is portaled to document.body, silently escaping any theme class scoped to an ancestor of the editor. These now resync --xpe-* variables onto the portaled node so scoped custom themes apply everywhere. - Fix: to-do checkbox checkmark and toggle chevron were sized via Tailwind classes that weren't reliably taking effect on raw SVGs — both now use explicit width/height so the checkmark is always visible. - Fix: Vue's button-block label lost all styling because it reused ui/Button.vue's scoped .xpe-btn classes on a plain div — Vue scoped CSS only applies to elements a component itself renders. Replaced with locally-scoped styles. - Slash menu now groups items into Basic/Lists/Media/Advanced sections, locks page scroll while open (Notion-style), and flips above the caret when there's no room below. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…lor popover bug - New right-click context menu on blocks: Duplicate, Delete, and — for callout blocks — a Color flyout reusing the existing background presets. Clean two-level menu, no extra clutter. - Custom slim scrollbars (token-driven via --xpe-*, `.xpe-scroll` class for custom containers) replace the browser default across popovers, dropdowns, slash/emoji menus, tables, code blocks, the editor root, the doc renderer, and the site itself. - Popover/dropdown/button/input/callout/table/code corners now scale off --xpe-radius instead of hardcoded pixel values, so one token change reshapes the whole editor consistently. - Fix: the bubble toolbar's color popover could never actually be used — clicking a swatch closed the panel instantly. Root cause: the panel's "stay open" effect compared toolbar position by object reference, and a same-range selectionchange fired by clicking inside the toolbar always produces a fresh position object, closing the panel before a color could register. - Fix: a malformed Tailwind class left the "active color" checkmark badge invisible in the color/table-style panels; replaced along with a few remaining hardcoded indigo accents with theme tokens. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.