oasis-editor 0.0.128 → 0.0.130

package/dist/{index-Ceyv5JS5.js → index-CX5iCo8O.js}

@@ -1681,6 +1681,16 @@ const en = {
   "table.alignLeft": "Align Left",
   "table.alignCenter": "Align Center",
   "table.alignRight": "Align Right",
+  "table.headerRow": "Header Row",
+  "table.totalRow": "Total Row",
+  "table.bandedRows": "Banded Rows",
+  "table.firstColumn": "First Column",
+  "table.lastColumn": "Last Column",
+  "table.bandedColumns": "Banded Columns",
+  "table.tableStyle": "Table Style",
+  "table.autoFit": "AutoFit",
+  "table.distributeRows": "Distribute Rows",
+  "table.distributeColumns": "Distribute Columns",
   "table.cellWidth": "Cell Width",
   "table.cellBgColorPrompt": "Cell Background Color:",
   "table.cellWidthPrompt": "Cell Width (e.g. 50% or 200pt):",
@@ -1803,6 +1813,8 @@ const en = {
   "ribbon.tab.collaboration": "Collaboration",
   "ribbon.tab.protection": "Protection",
   "ribbon.tab.view": "View",
+  "ribbon.tab.tableDesign": "Table Design",
+  "ribbon.tab.tableLayout": "Table Layout",
   "ribbon.tab.plugins": "Plugins",
   "ribbon.tab.ai": "AI",
   // Ribbon groups
@@ -1819,6 +1831,13 @@ const en = {
   "ribbon.group.table": "Table",
   "ribbon.group.section": "Section",
   "ribbon.group.general": "General",
+  "ribbon.group.tableStyleOptions": "Table Style Options",
+  "ribbon.group.tableStyles": "Table Styles",
+  "ribbon.group.borders": "Borders",
+  "ribbon.group.rowsColumns": "Rows & Columns",
+  "ribbon.group.merge": "Merge",
+  "ribbon.group.cellSize": "Cell Size",
+  "ribbon.group.alignment": "Alignment",
   // Export
   "toolbar.exportDocx": "Export DOCX",
   "toolbar.exportPdf": "Export PDF",
@@ -2209,6 +2228,16 @@ const ptBR = {
   "table.alignLeft": "Alinhar à Esquerda",
   "table.alignCenter": "Centralizar",
   "table.alignRight": "Alinhar à Direita",
+  "table.headerRow": "Linha de Cabeçalho",
+  "table.totalRow": "Linha de Totais",
+  "table.bandedRows": "Linhas em Tiras",
+  "table.firstColumn": "Primeira Coluna",
+  "table.lastColumn": "Última Coluna",
+  "table.bandedColumns": "Colunas em Tiras",
+  "table.tableStyle": "Estilo de Tabela",
+  "table.autoFit": "AutoAjuste",
+  "table.distributeRows": "Distribuir Linhas",
+  "table.distributeColumns": "Distribuir Colunas",
   "table.cellWidth": "Largura da Célula",
   "table.cellBgColorPrompt": "Cor de Fundo da Célula:",
   "table.cellWidthPrompt": "Largura da Célula (ex: 50% ou 200pt):",
@@ -2331,6 +2360,8 @@ const ptBR = {
   "ribbon.tab.collaboration": "Colaboração",
   "ribbon.tab.protection": "Proteção",
   "ribbon.tab.view": "Exibir",
+  "ribbon.tab.tableDesign": "Design da Tabela",
+  "ribbon.tab.tableLayout": "Layout da Tabela",
   "ribbon.tab.plugins": "Plugins",
   "ribbon.tab.ai": "IA",
   // Ribbon groups
@@ -2347,6 +2378,13 @@ const ptBR = {
   "ribbon.group.table": "Tabela",
   "ribbon.group.section": "Seção",
   "ribbon.group.general": "Geral",
+  "ribbon.group.tableStyleOptions": "Opções de Estilo de Tabela",
+  "ribbon.group.tableStyles": "Estilos de Tabela",
+  "ribbon.group.borders": "Bordas",
+  "ribbon.group.rowsColumns": "Linhas e Colunas",
+  "ribbon.group.merge": "Mesclar",
+  "ribbon.group.cellSize": "Tamanho da Célula",
+  "ribbon.group.alignment": "Alinhamento",
   // Export
   "toolbar.exportDocx": "Exportar DOCX",
   "toolbar.exportPdf": "Exportar PDF",
@@ -2548,7 +2586,7 @@ function OasisBrandMark(props) {
     return _el$;
   })();
 }
-var _tmpl$$10 = /* @__PURE__ */ template(`<div class=oasis-editor-import-progress-label>`), _tmpl$2$D = /* @__PURE__ */ template(`<div role=status aria-live=polite><div class=oasis-editor-import-card><div class=oasis-editor-import-title></div><div class=oasis-editor-import-progress-track><div>`), _tmpl$3$q = /* @__PURE__ */ template(`<span class=oasis-editor-import-done-icon>Done`);
+var _tmpl$$10 = /* @__PURE__ */ template(`<div class=oasis-editor-import-progress-label>`), _tmpl$2$C = /* @__PURE__ */ template(`<div role=status aria-live=polite><div class=oasis-editor-import-card><div class=oasis-editor-import-title></div><div class=oasis-editor-import-progress-track><div>`), _tmpl$3$q = /* @__PURE__ */ template(`<span class=oasis-editor-import-done-icon>Done`);
 function OasisEditorLoading(props) {
   const t = useI18n();
   const variant = () => props.variant ?? "overlay";
@@ -2558,7 +2596,7 @@ function OasisEditorLoading(props) {
   };
   const isDone = () => (pct() ?? 0) >= 100;
   return (() => {
-    var _el$ = _tmpl$2$D(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling, _el$5 = _el$4.firstChild;
+    var _el$ = _tmpl$2$C(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling, _el$5 = _el$4.firstChild;
     insert(_el$2, createComponent(OasisBrandMark, {
       height: 40,
       "class": "oasis-editor-loading-mark"
@@ -2623,7 +2661,7 @@ function OasisEditorAppLazy(props = {}) {
     onCleanup(() => {
       cancelled = true;
     });
-    import("./OasisEditorApp-3vvH6KOz.js").then((m) => {
+    import("./OasisEditorApp-BQvsqccA.js").then((m) => {
       cancelled = true;
       setProgress(1);
       setTimeout(() => setApp(() => m.OasisEditorApp), 180);
@@ -5210,9 +5248,9 @@ function mount(target, props = {}) {
     unmount: () => client.dispose()
   });
 }
-var _tmpl$$$ = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none aria-hidden=true><text x=2 y=18 font-family="'Segoe UI', Arial, sans-serif"font-size=14 font-weight=700 fill=currentColor>ab</text><text x=15.5 y=11 font-family="'Segoe UI', Arial, sans-serif"font-size=10 font-weight=700 fill=#c00000>1`), _tmpl$2$C = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"aria-hidden=true><g fill=currentColor><path d="M3.375 4.875 L7.125 8.625 L3.375 12.375 L2.25 11.25 L4.875 8.625 L2.25 6 Z"></path><rect x=10.125 y=6 width=9 height=1.6875 rx=0.25></rect><rect x=5.625 y=10.875 width=13.5 height=1.6875 rx=0.25></rect><rect x=5.625 y=15.75 width=13.5 height=1.6875 rx=0.25>`), _tmpl$3$p = /* @__PURE__ */ template(`<i>`);
+var _tmpl$$$ = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none aria-hidden=true><text x=2 y=18 font-family="'Segoe UI', Arial, sans-serif"font-size=14 font-weight=700 fill=currentColor>ab</text><text x=15.5 y=11 font-family="'Segoe UI', Arial, sans-serif"font-size=10 font-weight=700 fill=#c00000>1`), _tmpl$2$B = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"aria-hidden=true><g fill=currentColor><path d="M3.375 4.875 L7.125 8.625 L3.375 12.375 L2.25 11.25 L4.875 8.625 L2.25 6 Z"></path><rect x=10.125 y=6 width=9 height=1.6875 rx=0.25></rect><rect x=5.625 y=10.875 width=13.5 height=1.6875 rx=0.25></rect><rect x=5.625 y=15.75 width=13.5 height=1.6875 rx=0.25>`), _tmpl$3$p = /* @__PURE__ */ template(`<i>`);
 const FootnoteIcon = () => _tmpl$$$();
-const SpecialIndentFirstLineIcon = () => _tmpl$2$C();
+const SpecialIndentFirstLineIcon = () => _tmpl$2$B();
 const CUSTOM_ICONS = {
   footnote: FootnoteIcon,
   specialIndentFirstLine: SpecialIndentFirstLineIcon
@@ -5300,7 +5338,7 @@ function Text$1(props) {
     }
   }));
 }
-var _tmpl$$Z = /* @__PURE__ */ template(`<div class=oasis-menubar role=menubar>`), _tmpl$2$B = /* @__PURE__ */ template(`<div class=oasis-menubar-dropdown role=menu>`), _tmpl$3$o = /* @__PURE__ */ template(`<div class=oasis-menubar-menu>`), _tmpl$4$j = /* @__PURE__ */ template(`<div class=oasis-menubar-separator role=separator>`), _tmpl$5$d = /* @__PURE__ */ template(`<i class=oasis-menubar-submenu-icon data-lucide=chevron-right>`), _tmpl$6$8 = /* @__PURE__ */ template(`<div class=oasis-menubar-submenu role=menu>`);
+var _tmpl$$Z = /* @__PURE__ */ template(`<div class=oasis-menubar role=menubar>`), _tmpl$2$A = /* @__PURE__ */ template(`<div class=oasis-menubar-dropdown role=menu>`), _tmpl$3$o = /* @__PURE__ */ template(`<div class=oasis-menubar-menu>`), _tmpl$4$j = /* @__PURE__ */ template(`<div class=oasis-menubar-separator role=separator>`), _tmpl$5$d = /* @__PURE__ */ template(`<i class=oasis-menubar-submenu-icon data-lucide=chevron-right>`), _tmpl$6$8 = /* @__PURE__ */ template(`<div class=oasis-menubar-submenu role=menu>`);
 function Menubar(props) {
   const t = useI18n();
   const [activeMenu, setActiveMenu] = createSignal(null);
@@ -5409,7 +5447,7 @@ function Menubar(props) {
             return activeMenu() === topLevel.id;
           },
           get children() {
-            var _el$3 = _tmpl$2$B();
+            var _el$3 = _tmpl$2$A();
             insert(_el$3, createComponent(For, {
               get each() {
                 return topLevel.children;
@@ -5640,7 +5678,7 @@ function getCaretRectFromSnapshot(snapshot, position2, paragraphOffset) {
   );
   return rectFromBox(slot.left, slot.top, 1, slot.height || line.height);
 }
-var _tmpl$$X = /* @__PURE__ */ template(`<span class=oasis-outline-title>`), _tmpl$2$A = /* @__PURE__ */ template(`<div class=oasis-outline-list>`), _tmpl$3$n = /* @__PURE__ */ template(`<div class=oasis-outline-panel><div class=oasis-outline-header><button class=oasis-outline-toggle><i>`), _tmpl$4$i = /* @__PURE__ */ template(`<div class=oasis-outline-empty>`), _tmpl$5$c = /* @__PURE__ */ template(`<div class=oasis-outline-item>`);
+var _tmpl$$X = /* @__PURE__ */ template(`<span class=oasis-outline-title>`), _tmpl$2$z = /* @__PURE__ */ template(`<div class=oasis-outline-list>`), _tmpl$3$n = /* @__PURE__ */ template(`<div class=oasis-outline-panel><div class=oasis-outline-header><button class=oasis-outline-toggle><i>`), _tmpl$4$i = /* @__PURE__ */ template(`<div class=oasis-outline-empty>`), _tmpl$5$c = /* @__PURE__ */ template(`<div class=oasis-outline-item>`);
 function OutlinePanel(props) {
   const t = useI18n();
   const [collapsed, setCollapsed] = createSignal(props.defaultCollapsed ?? false);
@@ -5728,7 +5766,7 @@ function OutlinePanel(props) {
         return !collapsed();
       },
       get children() {
-        var _el$6 = _tmpl$2$A();
+        var _el$6 = _tmpl$2$z();
         insert(_el$6, createComponent(Show, {
           get when() {
             return items().length > 0;
@@ -5785,7 +5823,7 @@ function OutlinePanel(props) {
   })();
 }
 delegateEvents(["click"]);
-var _tmpl$$W = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-overflow-manager style="display:flex;align-items:center;flex:1 1 0%;min-width:0;position:relative;margin-right:8px"><button type=button class="oasis-editor-tool-button oasis-editor-tool-button-dropdown oasis-editor-toolbar-more-measure"aria-hidden=true tabindex=-1 style=position:absolute;visibility:hidden;pointer-events:none;right:0><i data-lucide=ellipsis></i></button><div style="display:flex;align-items:center;gap:8px;flex:1 1 0;min-width:0;overflow:hidden"></div><div style=flex-shrink:0;padding-left:8px;padding-right:16px;align-items:center><button type=button class="oasis-editor-tool-button oasis-editor-tool-button-dropdown"data-testid=editor-toolbar-overflow-dropdown><i data-lucide=ellipsis></i></button></div><div class="oasis-editor-toolbar-overflow-dropdown-menu oasis-editor-toolbar-overflow-menu"style="flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px;padding:8px;background:var(--oasis-paper);border:1px solid var(--oasis-toolbar-border);border-radius:var(--oasis-radius);box-shadow:0 4px 12px rgba(0, 0, 0, 0.15);max-width:calc(100vw - 16px);overflow-x:hidden;overflow-y:auto">`), _tmpl$2$z = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-item-wrapper style=display:flex;align-items:center;flex-shrink:0>`);
+var _tmpl$$W = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-overflow-manager style="display:flex;align-items:center;flex:1 1 0%;min-width:0;position:relative;margin-right:8px"><button type=button class="oasis-editor-tool-button oasis-editor-tool-button-dropdown oasis-editor-toolbar-more-measure"aria-hidden=true tabindex=-1 style=position:absolute;visibility:hidden;pointer-events:none;right:0><i data-lucide=ellipsis></i></button><div style="display:flex;align-items:center;gap:8px;flex:1 1 0;min-width:0;overflow:hidden"></div><div style=flex-shrink:0;padding-left:8px;padding-right:16px;align-items:center><button type=button class="oasis-editor-tool-button oasis-editor-tool-button-dropdown"data-testid=editor-toolbar-overflow-dropdown><i data-lucide=ellipsis></i></button></div><div class="oasis-editor-toolbar-overflow-dropdown-menu oasis-editor-toolbar-overflow-menu"style="flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px;padding:8px;background:var(--oasis-paper);border:1px solid var(--oasis-toolbar-border);border-radius:var(--oasis-radius);box-shadow:0 4px 12px rgba(0, 0, 0, 0.15);max-width:calc(100vw - 16px);overflow-x:hidden;overflow-y:auto">`), _tmpl$2$y = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-item-wrapper style=display:flex;align-items:center;flex-shrink:0>`);
 function ToolbarOverflowManager(props) {
   const t = useI18n();
   const [overflowCount, setOverflowCount] = createSignal(0);
@@ -5941,7 +5979,7 @@ function ToolbarOverflowManager(props) {
         return items();
       },
       children: (item) => (() => {
-        var _el$7 = _tmpl$2$z();
+        var _el$7 = _tmpl$2$y();
         insert(_el$7, item);
         return _el$7;
       })()
@@ -6017,12 +6055,12 @@ function resolveLabel(item, api) {
   if (item.labelKey) return api.t(item.labelKey);
   return void 0;
 }
-var _tmpl$$V = /* @__PURE__ */ template(`<span>`), _tmpl$2$y = /* @__PURE__ */ template(`<button type=button>`);
+var _tmpl$$V = /* @__PURE__ */ template(`<span>`), _tmpl$2$x = /* @__PURE__ */ template(`<button type=button>`);
 function Button$1(props) {
   const [local, others] = splitProps(props, ["icon", "label", "active", "tooltip", "wide", "ribbonSize", "aria-label", "class", "classList"]);
   const ariaLabel = () => local["aria-label"] || local.tooltip || local.label || "";
   return (() => {
-    var _el$ = _tmpl$2$y();
+    var _el$ = _tmpl$2$x();
     spread(_el$, mergeProps({
       get ["class"]() {
         return `oasis-editor-tool-button ${local.class || ""}`;
@@ -6210,12 +6248,12 @@ function Popover(props) {
     }
   })];
 }
-var _tmpl$$T = /* @__PURE__ */ template(`<div>`), _tmpl$2$x = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-dropdown>`), _tmpl$3$m = /* @__PURE__ */ template(`<i>`), _tmpl$4$h = /* @__PURE__ */ template(`<span class=oasis-editor-tool-button-label>`), _tmpl$5$b = /* @__PURE__ */ template(`<i data-lucide=chevron-down class=oasis-editor-dropdown-chevron>`), _tmpl$6$7 = /* @__PURE__ */ template(`<button type=button class="oasis-editor-tool-button oasis-editor-tool-button-dropdown"aria-haspopup=menu>`);
+var _tmpl$$T = /* @__PURE__ */ template(`<div>`), _tmpl$2$w = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-dropdown>`), _tmpl$3$m = /* @__PURE__ */ template(`<i>`), _tmpl$4$h = /* @__PURE__ */ template(`<span class=oasis-editor-tool-button-label>`), _tmpl$5$b = /* @__PURE__ */ template(`<i data-lucide=chevron-down class=oasis-editor-dropdown-chevron>`), _tmpl$6$7 = /* @__PURE__ */ template(`<button type=button class="oasis-editor-tool-button oasis-editor-tool-button-dropdown"aria-haspopup=menu>`);
 function Menu(props) {
   const [open, setOpen] = createSignal(false);
   const ariaLabel = () => props.tooltip || props.label || "";
   return (() => {
-    var _el$ = _tmpl$2$x();
+    var _el$ = _tmpl$2$w();
     insert(_el$, createComponent(Popover, {
       get open() {
         return open();
@@ -6406,7 +6444,7 @@ function SplitButton(props) {
   });
 }
 delegateEvents(["click"]);
-var _tmpl$$P = /* @__PURE__ */ template(`<i data-lucide=type>`), _tmpl$2$w = /* @__PURE__ */ template(`<button type=button class=oasis-editor-color-menu-action role=menuitem><span class=oasis-editor-color-menu-action-swatch></span><span>`), _tmpl$3$l = /* @__PURE__ */ template(`<div class=oasis-editor-color-menu-section><div class=oasis-editor-color-menu-heading></div><div class=oasis-editor-color-theme-grid>`), _tmpl$4$g = /* @__PURE__ */ template(`<div class=oasis-editor-color-menu-section><div class=oasis-editor-color-menu-heading></div><div class=oasis-editor-color-standard-grid>`), _tmpl$5$a = /* @__PURE__ */ template(`<button type=button class=oasis-editor-color-menu-action role=menuitem><span class="oasis-editor-color-menu-action-swatch oasis-editor-color-menu-more-swatch"></span><span>`), _tmpl$6$6 = /* @__PURE__ */ template(`<input type=color class=oasis-editor-color-custom-input>`), _tmpl$7$2 = /* @__PURE__ */ template(`<span class=oasis-editor-color-split-icon><i></i><span class=oasis-editor-color-split-indicator>`), _tmpl$8$1 = /* @__PURE__ */ template(`<i data-lucide=slash>`), _tmpl$9 = /* @__PURE__ */ template(`<div class=oasis-editor-color-theme-column>`), _tmpl$0 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-color-swatch>`);
+var _tmpl$$P = /* @__PURE__ */ template(`<i data-lucide=type>`), _tmpl$2$v = /* @__PURE__ */ template(`<button type=button class=oasis-editor-color-menu-action role=menuitem><span class=oasis-editor-color-menu-action-swatch></span><span>`), _tmpl$3$l = /* @__PURE__ */ template(`<div class=oasis-editor-color-menu-section><div class=oasis-editor-color-menu-heading></div><div class=oasis-editor-color-theme-grid>`), _tmpl$4$g = /* @__PURE__ */ template(`<div class=oasis-editor-color-menu-section><div class=oasis-editor-color-menu-heading></div><div class=oasis-editor-color-standard-grid>`), _tmpl$5$a = /* @__PURE__ */ template(`<button type=button class=oasis-editor-color-menu-action role=menuitem><span class="oasis-editor-color-menu-action-swatch oasis-editor-color-menu-more-swatch"></span><span>`), _tmpl$6$6 = /* @__PURE__ */ template(`<input type=color class=oasis-editor-color-custom-input>`), _tmpl$7$2 = /* @__PURE__ */ template(`<span class=oasis-editor-color-split-icon><i></i><span class=oasis-editor-color-split-indicator>`), _tmpl$8$1 = /* @__PURE__ */ template(`<i data-lucide=slash>`), _tmpl$9 = /* @__PURE__ */ template(`<div class=oasis-editor-color-theme-column>`), _tmpl$0 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-color-swatch>`);
 const normalizeColor = (value) => (value == null ? void 0 : value.trim().toLowerCase()) ?? "";
 function ColorPicker(props) {
   const [isOpen, setIsOpen] = createSignal(false);
@@ -6471,7 +6509,7 @@ function ColorPicker(props) {
           return clearLabel();
         },
         get children() {
-          var _el$ = _tmpl$2$w(), _el$2 = _el$.firstChild, _el$4 = _el$2.nextSibling;
+          var _el$ = _tmpl$2$v(), _el$2 = _el$.firstChild, _el$4 = _el$2.nextSibling;
           _el$.$$click = () => applyColor(null);
           insert(_el$2, createComponent(Show, {
             get when() {
@@ -6594,7 +6632,7 @@ function ColorPicker(props) {
   });
 }
 delegateEvents(["click", "input"]);
-var _tmpl$$O = /* @__PURE__ */ template(`<div class=oasis-editor-table-grid-picker-status>`), _tmpl$2$v = /* @__PURE__ */ template(`<div class=oasis-editor-table-grid-picker-grid>`), _tmpl$3$k = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-dropdown>`), _tmpl$4$f = /* @__PURE__ */ template(`<button type=button class=oasis-editor-tool-button><i>`), _tmpl$5$9 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-table-grid-picker-cell>`);
+var _tmpl$$O = /* @__PURE__ */ template(`<div class=oasis-editor-table-grid-picker-status>`), _tmpl$2$u = /* @__PURE__ */ template(`<div class=oasis-editor-table-grid-picker-grid>`), _tmpl$3$k = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-dropdown>`), _tmpl$4$f = /* @__PURE__ */ template(`<button type=button class=oasis-editor-tool-button><i>`), _tmpl$5$9 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-table-grid-picker-cell>`);
 function GridPicker(props) {
   const t = useI18n();
   const [isOpen, setIsOpen] = createSignal(false);
@@ -6707,7 +6745,7 @@ function GridPicker(props) {
           insert(_el$2, statusLabel);
           return _el$2;
         })(), (() => {
-          var _el$3 = _tmpl$2$v();
+          var _el$3 = _tmpl$2$u();
           insert(_el$3, createComponent(For, {
             get each() {
               return rows();
@@ -6807,7 +6845,7 @@ const DEFAULT_PALETTE = {
   standardColors: STANDARD_COLORS,
   allowCustom: true
 };
-var _tmpl$$N = /* @__PURE__ */ template(`<button type=button class=oasis-editor-style-gallery-card role=option><span>`), _tmpl$2$u = /* @__PURE__ */ template(`<div class=oasis-editor-style-gallery-grid>`), _tmpl$3$j = /* @__PURE__ */ template(`<div class=oasis-editor-style-gallery><div class=oasis-editor-style-gallery-ribbon><div class=oasis-editor-style-gallery-strip role=listbox></div><button type=button class=oasis-editor-style-gallery-expand aria-haspopup=listbox><i data-lucide=chevron-down>`), _tmpl$4$e = /* @__PURE__ */ template(`<option>`);
+var _tmpl$$N = /* @__PURE__ */ template(`<button type=button class=oasis-editor-style-gallery-card role=option><span>`), _tmpl$2$t = /* @__PURE__ */ template(`<div class=oasis-editor-style-gallery-grid>`), _tmpl$3$j = /* @__PURE__ */ template(`<div class=oasis-editor-style-gallery><div class=oasis-editor-style-gallery-ribbon><div class=oasis-editor-style-gallery-strip role=listbox></div><button type=button class=oasis-editor-style-gallery-expand aria-haspopup=listbox><i data-lucide=chevron-down>`), _tmpl$4$e = /* @__PURE__ */ template(`<option>`);
 function getQuickStyles(styles) {
   const applicable = styles.filter((style2) => style2.type !== "table" && (!style2.semiHidden || style2.unhideWhenUsed && style2.isUsed));
   const hasQuickStyles = applicable.some((style2) => style2.qFormat === true);
@@ -6967,7 +7005,7 @@ function StyleGallery(props) {
       return _el$4;
     })(),
     get children() {
-      var _el$3 = _tmpl$2$u();
+      var _el$3 = _tmpl$2$t();
       _el$3.$$keydown = onPanelKeyDown;
       insert(_el$3, cards);
       return _el$3;
@@ -6975,7 +7013,7 @@ function StyleGallery(props) {
   });
 }
 delegateEvents(["click", "keydown"]);
-var _tmpl$$M = /* @__PURE__ */ template(`<option value>`), _tmpl$2$t = /* @__PURE__ */ template(`<option>`), _tmpl$3$i = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-item style=align-items:center>`);
+var _tmpl$$M = /* @__PURE__ */ template(`<option value>`), _tmpl$2$s = /* @__PURE__ */ template(`<option>`), _tmpl$3$i = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-item style=align-items:center>`);
 function renderMenuContent(content, api) {
   if (content.kind === "custom") {
     return content.render(api);
@@ -7166,7 +7204,7 @@ function RenderSelect(props) {
           return props.item.options(props.api);
         },
         children: (option) => (() => {
-          var _el$2 = _tmpl$2$t();
+          var _el$2 = _tmpl$2$s();
           insert(_el$2, () => option.label);
           createRenderEffect(() => _el$2.value = option.value);
           return _el$2;
@@ -7350,9 +7388,15 @@ const RIBBON_TABS = [
   "collaboration",
   "protection",
   "view",
+  "tableDesign",
+  "tableLayout",
   "plugins",
   "ai"
 ];
+const CONTEXTUAL_TABS = {
+  tableDesign: "tableContext",
+  tableLayout: "tableContext"
+};
 const TAB_LABEL_KEYS = {
   file: "ribbon.tab.file",
   home: "ribbon.tab.home",
@@ -7363,6 +7407,8 @@ const TAB_LABEL_KEYS = {
   collaboration: "ribbon.tab.collaboration",
   protection: "ribbon.tab.protection",
   view: "ribbon.tab.view",
+  tableDesign: "ribbon.tab.tableDesign",
+  tableLayout: "ribbon.tab.tableLayout",
   plugins: "ribbon.tab.plugins",
   ai: "ribbon.tab.ai"
 };
@@ -7379,10 +7425,26 @@ const GROUP_LABEL_KEYS = {
   document: "ribbon.group.document",
   table: "ribbon.group.table",
   section: "ribbon.group.section",
-  general: "ribbon.group.general"
+  general: "ribbon.group.general",
+  tableStyleOptions: "ribbon.group.tableStyleOptions",
+  tableStyles: "ribbon.group.tableStyles",
+  borders: "ribbon.group.borders",
+  rowsColumns: "ribbon.group.rowsColumns",
+  merge: "ribbon.group.merge",
+  cellSize: "ribbon.group.cellSize",
+  alignment: "ribbon.group.alignment"
 };
-function buildRibbonTabDefinitions(t) {
-  return RIBBON_TABS.map((id) => ({ id, label: t(TAB_LABEL_KEYS[id]) }));
+function isRibbonTabVisible(id, api) {
+  const gatingCommand = CONTEXTUAL_TABS[id];
+  if (!gatingCommand) return true;
+  return api ? api.commands.state(gatingCommand).isActive : false;
+}
+function buildRibbonTabDefinitions(t, api) {
+  return RIBBON_TABS.filter((id) => isRibbonTabVisible(id, api)).map((id) => ({
+    id,
+    label: t(TAB_LABEL_KEYS[id]),
+    contextual: CONTEXTUAL_TABS[id] !== void 0
+  }));
 }
 const DEFAULT_RIBBON_TAB = "plugins";
 const DEFAULT_RIBBON_GROUP = "general";
@@ -7412,6 +7474,18 @@ const RIBBON_GROUP_ORDER = {
   references: {
     footnotes: 10
   },
+  tableDesign: {
+    tableStyleOptions: 10,
+    tableStyles: 20,
+    borders: 30
+  },
+  tableLayout: {
+    table: 10,
+    rowsColumns: 20,
+    merge: 30,
+    cellSize: 40,
+    alignment: 50
+  },
   plugins: {
     general: 10
   }
@@ -7476,6 +7550,18 @@ const RIBBON_GROUP_RESIZE_DEFAULTS = {
   references: {
     footnotes: { priority: 10, collapsedIcon: "footnote" }
   },
+  tableDesign: {
+    tableStyleOptions: { priority: 20, collapsedIcon: "list-checks" },
+    tableStyles: { priority: 10, collapsedIcon: "table" },
+    borders: { priority: 30, collapsedIcon: "frame" }
+  },
+  tableLayout: {
+    table: { priority: 15, collapsedIcon: "table-properties" },
+    rowsColumns: { priority: 20, collapsedIcon: "rows" },
+    merge: { priority: 30, collapsedIcon: "combine" },
+    cellSize: { priority: 40, collapsedIcon: "move-horizontal" },
+    alignment: { priority: 50, collapsedIcon: "align-left" }
+  },
   plugins: {
     general: { priority: 50, collapsedIcon: "plug" }
   }
@@ -7715,20 +7801,23 @@ function resolveResponsiveRibbonGroups(groups, availableWidth, measurements = {}
     allocatedWidth: allocatedWidths.get(group.id)
   }));
 }
-var _tmpl$$L = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-tabs role=tablist>`), _tmpl$2$s = /* @__PURE__ */ template(`<button type=button class=oasis-editor-ribbon-tab role=tab>`);
+var _tmpl$$L = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-tabs role=tablist>`), _tmpl$2$r = /* @__PURE__ */ template(`<button type=button class=oasis-editor-ribbon-tab role=tab>`);
 function RibbonTabs(props) {
-  const tabs = buildRibbonTabDefinitions(useI18n());
+  const tabs = createMemo(() => buildRibbonTabDefinitions(props.api.t, props.api));
   const moveTab = (current, delta) => {
-    const index = tabs.findIndex((tab) => tab.id === current);
-    const next = tabs[(index + delta + tabs.length) % tabs.length];
+    const list = tabs();
+    const index = list.findIndex((tab) => tab.id === current);
+    const next = list[(index + delta + list.length) % list.length];
     if (next) props.setActiveTab(next.id);
   };
   return (() => {
     var _el$ = _tmpl$$L();
     insert(_el$, createComponent(For, {
-      each: tabs,
+      get each() {
+        return tabs();
+      },
       children: (tab) => (() => {
-        var _el$2 = _tmpl$2$s();
+        var _el$2 = _tmpl$2$r();
         _el$2.$$keydown = (event) => {
           if (event.key === "ArrowRight") {
             event.preventDefault();
@@ -7738,22 +7827,24 @@ function RibbonTabs(props) {
             moveTab(tab.id, -1);
           } else if (event.key === "Home") {
             event.preventDefault();
-            props.setActiveTab(tabs[0].id);
+            props.setActiveTab(tabs()[0].id);
           } else if (event.key === "End") {
             event.preventDefault();
-            props.setActiveTab(tabs[tabs.length - 1].id);
+            const list = tabs();
+            props.setActiveTab(list[list.length - 1].id);
           }
         };
         _el$2.$$click = () => props.setActiveTab(tab.id);
         insert(_el$2, () => tab.label);
         createRenderEffect((_p$) => {
-          var _v$ = !!(props.activeTab() === tab.id), _v$2 = props.activeTab() === tab.id, _v$3 = `oasis-editor-ribbon-panel-${tab.id}`, _v$4 = `oasis-editor-ribbon-tab-${tab.id}`, _v$5 = `editor-ribbon-tab-${tab.id}`, _v$6 = props.activeTab() === tab.id ? 0 : -1;
+          var _v$ = !!(props.activeTab() === tab.id), _v$2 = !!(tab.contextual === true), _v$3 = props.activeTab() === tab.id, _v$4 = `oasis-editor-ribbon-panel-${tab.id}`, _v$5 = `oasis-editor-ribbon-tab-${tab.id}`, _v$6 = `editor-ribbon-tab-${tab.id}`, _v$7 = props.activeTab() === tab.id ? 0 : -1;
           _v$ !== _p$.e && _el$2.classList.toggle("oasis-editor-ribbon-tab-active", _p$.e = _v$);
-          _v$2 !== _p$.t && setAttribute(_el$2, "aria-selected", _p$.t = _v$2);
-          _v$3 !== _p$.a && setAttribute(_el$2, "aria-controls", _p$.a = _v$3);
-          _v$4 !== _p$.o && setAttribute(_el$2, "id", _p$.o = _v$4);
-          _v$5 !== _p$.i && setAttribute(_el$2, "data-testid", _p$.i = _v$5);
-          _v$6 !== _p$.n && setAttribute(_el$2, "tabindex", _p$.n = _v$6);
+          _v$2 !== _p$.t && _el$2.classList.toggle("oasis-editor-ribbon-tab-contextual", _p$.t = _v$2);
+          _v$3 !== _p$.a && setAttribute(_el$2, "aria-selected", _p$.a = _v$3);
+          _v$4 !== _p$.o && setAttribute(_el$2, "aria-controls", _p$.o = _v$4);
+          _v$5 !== _p$.i && setAttribute(_el$2, "id", _p$.i = _v$5);
+          _v$6 !== _p$.n && setAttribute(_el$2, "data-testid", _p$.n = _v$6);
+          _v$7 !== _p$.s && setAttribute(_el$2, "tabindex", _p$.s = _v$7);
           return _p$;
         }, {
           e: void 0,
@@ -7761,7 +7852,8 @@ function RibbonTabs(props) {
           a: void 0,
           o: void 0,
           i: void 0,
-          n: void 0
+          n: void 0,
+          s: void 0
         });
         return _el$2;
       })()
@@ -7788,7 +7880,7 @@ function RibbonRow(props) {
     return _el$;
   })();
 }
-var _tmpl$$J = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-large-items>`), _tmpl$2$r = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-group-rows><div class=oasis-editor-ribbon-normal-rows>`), _tmpl$3$h = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-group-label>`), _tmpl$4$d = /* @__PURE__ */ template(`<section class=oasis-editor-ribbon-group>`), _tmpl$5$8 = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-collapsed-items>`), _tmpl$6$5 = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-group-rows>`);
+var _tmpl$$J = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-large-items>`), _tmpl$2$q = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-group-rows><div class=oasis-editor-ribbon-normal-rows>`), _tmpl$3$h = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-group-label>`), _tmpl$4$d = /* @__PURE__ */ template(`<section class=oasis-editor-ribbon-group>`), _tmpl$5$8 = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-collapsed-items>`), _tmpl$6$5 = /* @__PURE__ */ template(`<div class=oasis-editor-ribbon-group-rows>`);
 function groupItems(group) {
   return [...group.largeItems, ...group.rows[1], ...group.rows[2]];
 }
@@ -7847,7 +7939,7 @@ function RibbonGroup(props) {
       },
       get children() {
         return [(() => {
-          var _el$2 = _tmpl$2$r(), _el$4 = _el$2.firstChild;
+          var _el$2 = _tmpl$2$q(), _el$4 = _el$2.firstChild;
           insert(_el$2, createComponent(Show, {
             get when() {
               return props.group.largeItems.length > 0;
@@ -7985,12 +8077,22 @@ function RibbonPanel(props) {
     return _el$;
   })();
 }
-var _tmpl$$H = /* @__PURE__ */ template(`<section class=oasis-editor-toolbar>`), _tmpl$2$q = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-wrap-strip>`);
+var _tmpl$$H = /* @__PURE__ */ template(`<section class=oasis-editor-toolbar>`), _tmpl$2$p = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-wrap-strip>`);
 const shouldAllowNativeMouseDown = (target) => target instanceof Element && target.closest("select, input, textarea, label") !== null;
 function Toolbar(props) {
   const api = createToolbarApi(props.host, useI18n());
   const [version2, setVersion2] = createSignal(0);
   const [activeTab, setActiveTab] = createSignal("home");
+  const CONTEXTUAL_TABLE_TABS = ["tableDesign", "tableLayout"];
+  createEffect((prevInside) => {
+    const inside = api.commands.state("tableContext").isActive;
+    if (inside && prevInside === false) {
+      setActiveTab("tableDesign");
+    } else if (!inside && CONTEXTUAL_TABLE_TABS.includes(activeTab())) {
+      setActiveTab("home");
+    }
+    return inside;
+  });
   onMount(() => {
     const unsubscribe = props.registry.onChange(() => setVersion2((v) => v + 1));
     onCleanup(unsubscribe);
@@ -8026,7 +8128,8 @@ function Toolbar(props) {
       var _c$ = memo(() => view() === "ribbon");
       return () => _c$() ? [createComponent(RibbonTabs, {
         activeTab,
-        setActiveTab
+        setActiveTab,
+        api
       }), createComponent(RibbonPanel, {
         activeTab,
         items,
@@ -8036,7 +8139,7 @@ function Toolbar(props) {
           return renderItems();
         }
       }) : (() => {
-        var _el$2 = _tmpl$2$q();
+        var _el$2 = _tmpl$2$p();
         insert(_el$2, renderItems);
         return _el$2;
       })();
@@ -22230,7 +22333,7 @@ function createCanvasPageRenderer(options) {
     }
   };
 }
-var _tmpl$$F = /* @__PURE__ */ template(`<div class="oasis-editor-paper-stack oasis-editor-canvas-stack"style=position:relative>`), _tmpl$2$p = /* @__PURE__ */ template(`<div class=oasis-editor-canvas-page-slot style=position:relative>`), _tmpl$3$g = /* @__PURE__ */ template(`<div class=oasis-editor-paper data-renderer=canvas data-testid=editor-page style=position:relative;z-index:1><canvas>`), _tmpl$4$c = /* @__PURE__ */ template(`<div class=oasis-editor-table-revision-hit style=position:absolute;pointer-events:auto;background:transparent>`);
+var _tmpl$$F = /* @__PURE__ */ template(`<div class="oasis-editor-paper-stack oasis-editor-canvas-stack"style=position:relative>`), _tmpl$2$o = /* @__PURE__ */ template(`<div class=oasis-editor-canvas-page-slot style=position:relative>`), _tmpl$3$g = /* @__PURE__ */ template(`<div class=oasis-editor-paper data-renderer=canvas data-testid=editor-page style=position:relative;z-index:1><canvas>`), _tmpl$4$c = /* @__PURE__ */ template(`<div class=oasis-editor-table-revision-hit style=position:absolute;pointer-events:auto;background:transparent>`);
 const surfaceLogger = createEditorLogger("canvas-surface");
 function checkBrowserFonts(families) {
   if (typeof document === "undefined" || !document.fonts) {
@@ -22302,7 +22405,7 @@ function CanvasEditorSurface(props) {
         // inserting an image that triggers re-pagination in a narrow viewport),
         // causing "Failed to execute 'insertBefore'" errors.
         (() => {
-          var _el$2 = _tmpl$2$p();
+          var _el$2 = _tmpl$2$o();
           insert(_el$2, createComponent(Show, {
             when: index > 0,
             get children() {
@@ -22824,7 +22927,7 @@ function computeRulerTicks(pageWidth, contentLeft, unit) {
   pushSide(-1);
   return ticks;
 }
-var _tmpl$$E = /* @__PURE__ */ template(`<div class=oasis-editor-horizontal-ruler data-testid=editor-horizontal-ruler role=presentation><div class=oasis-editor-horizontal-ruler-track><div class=oasis-editor-horizontal-ruler-page><div class=oasis-editor-horizontal-ruler-margin style=left:0px></div><div class=oasis-editor-horizontal-ruler-margin></div><div class=oasis-editor-horizontal-ruler-content></div><button type=button class=oasis-editor-horizontal-ruler-margin-handle></button><button type=button class=oasis-editor-horizontal-ruler-margin-handle></button><button type=button class="oasis-editor-ruler-marker oasis-editor-ruler-marker-first-line"></button><button type=button class="oasis-editor-ruler-marker oasis-editor-ruler-marker-hanging"></button><button type=button class="oasis-editor-ruler-marker oasis-editor-ruler-marker-left-box"></button><button type=button class="oasis-editor-ruler-marker oasis-editor-ruler-marker-right-indent">`), _tmpl$2$o = /* @__PURE__ */ template(`<div>`), _tmpl$3$f = /* @__PURE__ */ template(`<div class=oasis-editor-horizontal-ruler-label>`);
+var _tmpl$$E = /* @__PURE__ */ template(`<div class=oasis-editor-horizontal-ruler data-testid=editor-horizontal-ruler role=presentation><div class=oasis-editor-horizontal-ruler-track><div class=oasis-editor-horizontal-ruler-page><div class=oasis-editor-horizontal-ruler-margin style=left:0px></div><div class=oasis-editor-horizontal-ruler-margin></div><div class=oasis-editor-horizontal-ruler-content></div><button type=button class=oasis-editor-horizontal-ruler-margin-handle></button><button type=button class=oasis-editor-horizontal-ruler-margin-handle></button><button type=button class="oasis-editor-ruler-marker oasis-editor-ruler-marker-first-line"></button><button type=button class="oasis-editor-ruler-marker oasis-editor-ruler-marker-hanging"></button><button type=button class="oasis-editor-ruler-marker oasis-editor-ruler-marker-left-box"></button><button type=button class="oasis-editor-ruler-marker oasis-editor-ruler-marker-right-indent">`), _tmpl$2$n = /* @__PURE__ */ template(`<div>`), _tmpl$3$f = /* @__PURE__ */ template(`<div class=oasis-editor-horizontal-ruler-label>`);
 function getActivePageSettings(state) {
   var _a;
   const idx = getActiveSectionIndex(state);
@@ -23038,7 +23141,7 @@ function HorizontalRuler(props) {
         return ticks();
       },
       children: (tick) => [(() => {
-        var _el$11 = _tmpl$2$o();
+        var _el$11 = _tmpl$2$n();
         createRenderEffect((_p$) => {
           var _v$27 = `oasis-editor-horizontal-ruler-tick oasis-editor-horizontal-ruler-tick-${tick.kind}`, _v$28 = `${sx(tick.x)}px`;
           _v$27 !== _p$.e && className(_el$11, _p$.e = _v$27);
@@ -23151,7 +23254,7 @@ function CaretOverlay(props) {
     return _el$;
   })();
 }
-var _tmpl$$C = /* @__PURE__ */ template(`<div aria-hidden=true class=oasis-editor-selection-overlay-root>`), _tmpl$2$n = /* @__PURE__ */ template(`<span aria-hidden=true class=oasis-editor-selection-box data-testid=editor-selection-box>`);
+var _tmpl$$C = /* @__PURE__ */ template(`<div aria-hidden=true class=oasis-editor-selection-overlay-root>`), _tmpl$2$m = /* @__PURE__ */ template(`<span aria-hidden=true class=oasis-editor-selection-box data-testid=editor-selection-box>`);
 function SelectionOverlay(props) {
   return (() => {
     var _el$ = _tmpl$$C();
@@ -23160,7 +23263,7 @@ function SelectionOverlay(props) {
         return props.boxes;
       },
       children: (box) => (() => {
-        var _el$2 = _tmpl$2$n();
+        var _el$2 = _tmpl$2$m();
         createRenderEffect((_p$) => {
           var _v$ = `${box().left}px`, _v$2 = `${box().top}px`, _v$3 = `${box().width}px`, _v$4 = `${box().height}px`;
           _v$ !== _p$.e && setStyleProperty(_el$2, "left", _p$.e = _v$);
@@ -23213,7 +23316,7 @@ function RevisionOverlay(props) {
     return _el$;
   })();
 }
-var _tmpl$$A = /* @__PURE__ */ template(`<div aria-hidden=true class=oasis-editor-comment-overlay-root>`), _tmpl$2$m = /* @__PURE__ */ template(`<span class=oasis-editor-comment-highlight data-testid=editor-comment-highlight>`), _tmpl$3$e = /* @__PURE__ */ template(`<span class=oasis-editor-comment-popup-date>`), _tmpl$4$b = /* @__PURE__ */ template(`<span class=oasis-editor-comment-popup-resolved>✓`), _tmpl$5$7 = /* @__PURE__ */ template(`<div class=oasis-editor-comment-popup data-testid=editor-comment-popup><div class=oasis-editor-comment-popup-header><span class=oasis-editor-comment-popup-author></span></div><div class=oasis-editor-comment-popup-body>`);
+var _tmpl$$A = /* @__PURE__ */ template(`<div aria-hidden=true class=oasis-editor-comment-overlay-root>`), _tmpl$2$l = /* @__PURE__ */ template(`<span class=oasis-editor-comment-highlight data-testid=editor-comment-highlight>`), _tmpl$3$e = /* @__PURE__ */ template(`<span class=oasis-editor-comment-popup-date>`), _tmpl$4$b = /* @__PURE__ */ template(`<span class=oasis-editor-comment-popup-resolved>✓`), _tmpl$5$7 = /* @__PURE__ */ template(`<div class=oasis-editor-comment-popup data-testid=editor-comment-popup><div class=oasis-editor-comment-popup-header><span class=oasis-editor-comment-popup-author></span></div><div class=oasis-editor-comment-popup-body>`);
 function CommentHighlightOverlay(props) {
   const [activeCommentId, setActiveCommentId] = createSignal(null);
   const activeComment = createMemo(() => {
@@ -23246,7 +23349,7 @@ function CommentHighlightOverlay(props) {
         return props.boxes();
       },
       children: (box) => (() => {
-        var _el$2 = _tmpl$2$m();
+        var _el$2 = _tmpl$2$l();
         _el$2.$$click = () => setActiveCommentId(box.commentId);
         _el$2.addEventListener("mouseenter", () => setActiveCommentId(box.commentId));
         createRenderEffect((_p$) => {
@@ -23564,7 +23667,7 @@ function FloatingTableToolbar(props) {
   });
 }
 delegateEvents(["mousedown"]);
-var _tmpl$$y = /* @__PURE__ */ template(`<svg><rect height=2 rx=1 fill=#9aa0a6></svg>`, false, true, false), _tmpl$2$l = /* @__PURE__ */ template(`<svg><rect rx=1.5></svg>`, false, true, false), _tmpl$3$d = /* @__PURE__ */ template(`<svg><polygon points="29,4 37,12 29,20 21,12"fill=#1a73e8></svg>`, false, true, false), _tmpl$4$a = /* @__PURE__ */ template(`<svg><polygon points="20,8 26,14 20,20 14,14"fill=#1a73e8></svg>`, false, true, false), _tmpl$5$6 = /* @__PURE__ */ template(`<svg viewBox="0 0 40 32"fill=none aria-hidden=true>`), _tmpl$6$4 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-layout-options-anchor data-testid=editor-layout-options-anchor><svg viewBox="0 0 24 24"fill=none aria-hidden=true><rect x=3 y=4 width=10 height=10 rx=1.5 fill=#1a73e8></rect><rect x=3 y=17 width=18 height=2 rx=1 fill=#9aa0a6></rect><rect x=15 y=5 width=6 height=2 rx=1 fill=#9aa0a6></rect><rect x=15 y=9 width=6 height=2 rx=1 fill=#9aa0a6>`), _tmpl$7$1 = /* @__PURE__ */ template(`<div class=oasis-editor-layout-options-popup data-testid=editor-layout-options-popup><div class=oasis-editor-layout-options-popup-header><span class=oasis-editor-layout-options-title></span><button type=button class=oasis-editor-layout-options-close>×</button></div><div class=oasis-editor-layout-options-group-label></div><div class=oasis-editor-layout-options-grid><button type=button class=oasis-editor-layout-options-cell data-testid=editor-layout-options-inline><svg viewBox="0 0 40 32"fill=none aria-hidden=true><rect x=4 y=7 width=9 height=2 rx=1 fill=#9aa0a6></rect><rect x=15 y=4 width=11 height=11 rx=1.5 fill=#1a73e8></rect><rect x=28 y=7 width=8 height=2 rx=1 fill=#9aa0a6></rect><rect x=4 y=20 width=32 height=2 rx=1 fill=#9aa0a6></rect><rect x=4 y=26 width=32 height=2 rx=1 fill=#9aa0a6></rect></svg></button></div><div class=oasis-editor-layout-options-group-label></div><div class=oasis-editor-layout-options-grid></div><div class=oasis-editor-layout-options-radios><label class=oasis-editor-layout-options-radio><input type=radio name=oasis-layout-position></label><label class=oasis-editor-layout-options-radio><input type=radio name=oasis-layout-position>`), _tmpl$8 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-layout-options-cell>`);
+var _tmpl$$y = /* @__PURE__ */ template(`<svg><rect height=2 rx=1 fill=#9aa0a6></svg>`, false, true, false), _tmpl$2$k = /* @__PURE__ */ template(`<svg><rect rx=1.5></svg>`, false, true, false), _tmpl$3$d = /* @__PURE__ */ template(`<svg><polygon points="29,4 37,12 29,20 21,12"fill=#1a73e8></svg>`, false, true, false), _tmpl$4$a = /* @__PURE__ */ template(`<svg><polygon points="20,8 26,14 20,20 14,14"fill=#1a73e8></svg>`, false, true, false), _tmpl$5$6 = /* @__PURE__ */ template(`<svg viewBox="0 0 40 32"fill=none aria-hidden=true>`), _tmpl$6$4 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-layout-options-anchor data-testid=editor-layout-options-anchor><svg viewBox="0 0 24 24"fill=none aria-hidden=true><rect x=3 y=4 width=10 height=10 rx=1.5 fill=#1a73e8></rect><rect x=3 y=17 width=18 height=2 rx=1 fill=#9aa0a6></rect><rect x=15 y=5 width=6 height=2 rx=1 fill=#9aa0a6></rect><rect x=15 y=9 width=6 height=2 rx=1 fill=#9aa0a6>`), _tmpl$7$1 = /* @__PURE__ */ template(`<div class=oasis-editor-layout-options-popup data-testid=editor-layout-options-popup><div class=oasis-editor-layout-options-popup-header><span class=oasis-editor-layout-options-title></span><button type=button class=oasis-editor-layout-options-close>×</button></div><div class=oasis-editor-layout-options-group-label></div><div class=oasis-editor-layout-options-grid><button type=button class=oasis-editor-layout-options-cell data-testid=editor-layout-options-inline><svg viewBox="0 0 40 32"fill=none aria-hidden=true><rect x=4 y=7 width=9 height=2 rx=1 fill=#9aa0a6></rect><rect x=15 y=4 width=11 height=11 rx=1.5 fill=#1a73e8></rect><rect x=28 y=7 width=8 height=2 rx=1 fill=#9aa0a6></rect><rect x=4 y=20 width=32 height=2 rx=1 fill=#9aa0a6></rect><rect x=4 y=26 width=32 height=2 rx=1 fill=#9aa0a6></rect></svg></button></div><div class=oasis-editor-layout-options-group-label></div><div class=oasis-editor-layout-options-grid></div><div class=oasis-editor-layout-options-radios><label class=oasis-editor-layout-options-radio><input type=radio name=oasis-layout-position></label><label class=oasis-editor-layout-options-radio><input type=radio name=oasis-layout-position>`), _tmpl$8 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-layout-options-cell>`);
 const WRAP_OPTIONS = [{
   preset: "square",
   labelKey: "layoutOptions.square"
@@ -23593,7 +23696,7 @@ function WrapIcon(props) {
     return _el$;
   })();
   const box = (x, y, w, h, fill = "#1a73e8") => (() => {
-    var _el$2 = _tmpl$2$l();
+    var _el$2 = _tmpl$2$k();
     setAttribute(_el$2, "x", x);
     setAttribute(_el$2, "y", y);
     setAttribute(_el$2, "width", w);
@@ -38201,10 +38304,10 @@ function resolveResizedDimensions(geometry, deltaX, deltaY, preserveAspectRatio,
   nextHeight = clamp(nextWidth / aspectRatio, MIN_RESIZE_SIZE_PX);
   return { width: nextWidth, height: nextHeight };
 }
-var _tmpl$$x = /* @__PURE__ */ template(`<button aria-hidden=true class=oasis-editor-rotate-handle tabindex=-1 type=button>`), _tmpl$2$k = /* @__PURE__ */ template(`<div aria-hidden=true style=transform-origin:center>`), _tmpl$3$c = /* @__PURE__ */ template(`<button aria-hidden=true class=oasis-editor-resize-handle tabindex=-1 type=button>`);
+var _tmpl$$x = /* @__PURE__ */ template(`<button aria-hidden=true class=oasis-editor-rotate-handle tabindex=-1 type=button>`), _tmpl$2$j = /* @__PURE__ */ template(`<div aria-hidden=true style=transform-origin:center>`), _tmpl$3$c = /* @__PURE__ */ template(`<button aria-hidden=true class=oasis-editor-resize-handle tabindex=-1 type=button>`);
 function ResizeHandlesOverlay(props) {
   return (() => {
-    var _el$ = _tmpl$2$k();
+    var _el$ = _tmpl$2$j();
     _el$.$$mousedown = (event) => {
       if (props.readOnly || !props.box() || !props.onBodyMouseDown) {
         return;
@@ -38276,6 +38379,38 @@ function ResizeHandlesOverlay(props) {
   })();
 }
 delegateEvents(["mousedown"]);
+var _tmpl$$w = /* @__PURE__ */ template(`<div aria-hidden=true class=oasis-editor-table-handles-overlay><button aria-hidden=true class=oasis-editor-table-move-handle tabindex=-1 type=button></button><button aria-hidden=true class=oasis-editor-table-resize-corner tabindex=-1 type=button>`);
+function TableHandlesOverlay(props) {
+  return createComponent(Show, {
+    get when() {
+      return memo(() => !!!props.readOnly)() && props.box();
+    },
+    children: (box) => (() => {
+      var _el$ = _tmpl$$w(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
+      _el$2.$$mousedown = (event) => {
+        props.onMoveStart(event);
+      };
+      _el$3.$$mousedown = (event) => {
+        props.onResizeStart(event);
+      };
+      createRenderEffect((_p$) => {
+        var _v$ = `${box().left}px`, _v$2 = `${box().top}px`, _v$3 = `${box().width}px`, _v$4 = `${box().height}px`;
+        _v$ !== _p$.e && setStyleProperty(_el$, "left", _p$.e = _v$);
+        _v$2 !== _p$.t && setStyleProperty(_el$, "top", _p$.t = _v$2);
+        _v$3 !== _p$.a && setStyleProperty(_el$, "width", _p$.a = _v$3);
+        _v$4 !== _p$.o && setStyleProperty(_el$, "height", _p$.o = _v$4);
+        return _p$;
+      }, {
+        e: void 0,
+        t: void 0,
+        a: void 0,
+        o: void 0
+      });
+      return _el$;
+    })()
+  });
+}
+delegateEvents(["mousedown"]);
 const ZOOM_MIN = 50;
 const ZOOM_MAX = 200;
 const ZOOM_STEP = 10;
@@ -38291,7 +38426,7 @@ function createEditorZoom(initial = ZOOM_DEFAULT) {
   const zoomFactor = createMemo(() => zoomPercent() / 100);
   return { zoomPercent, setZoomPercent, adjustZoom, zoomFactor };
 }
-var _tmpl$$w = /* @__PURE__ */ template(`<div data-testid=editor-editor-shell><div class=oasis-editor-editor data-testid=editor-editor><div class=oasis-editor-editor-zoom-sizer><div class=oasis-editor-editor-scroll-content data-testid=editor-editor-scroll-content style="position:absolute;top:0px;transform-origin:top left"><textarea aria-label="Editor input"autocomplete=off autocapitalize=off class=oasis-editor-input data-testid=editor-input value style=pointer-events:none></textarea><input data-testid=editor-import-docx-input type=file style=display:none><input accept="image/png, image/jpeg, image/gif"data-testid=editor-insert-image-input type=file style=display:none></div></div></div><div class=oasis-editor-statusbar data-testid=editor-statusbar><div class="oasis-editor-statusbar-group oasis-editor-statusbar-start"><span class=oasis-editor-statusbar-item data-testid=editor-statusbar-word-count></span><span class=oasis-editor-statusbar-item data-testid=editor-statusbar-character-count></span><span class=oasis-editor-statusbar-item></span></div><div class="oasis-editor-statusbar-group oasis-editor-statusbar-end"><div class=oasis-editor-statusbar-zoom data-testid=editor-statusbar-zoom-control><button type=button class=oasis-editor-zoom-button>−</button><input class=oasis-editor-zoom-slider type=range><button type=button class=oasis-editor-zoom-button>+</button><span class="oasis-editor-statusbar-item oasis-editor-zoom-value"data-testid=editor-statusbar-zoom>%`), _tmpl$2$j = /* @__PURE__ */ template(`<div class=oasis-editor-import-overlay data-testid=editor-import-overlay role=status aria-live=polite><div class=oasis-editor-import-card><div class=oasis-editor-import-title></div><div class=oasis-editor-import-phase data-testid=editor-import-phase></div><div class=oasis-editor-import-progress-track><div class=oasis-editor-import-progress-bar data-testid=editor-import-progress-bar></div></div><div class=oasis-editor-import-progress-label>`), _tmpl$3$b = /* @__PURE__ */ template(`<span class=oasis-editor-import-done-icon>`), _tmpl$4$9 = /* @__PURE__ */ template(`<span class=oasis-editor-import-error-icon>`), _tmpl$5$5 = /* @__PURE__ */ template(`<span>`);
+var _tmpl$$v = /* @__PURE__ */ template(`<div data-testid=editor-editor-shell><div class=oasis-editor-editor data-testid=editor-editor><div class=oasis-editor-editor-zoom-sizer><div class=oasis-editor-editor-scroll-content data-testid=editor-editor-scroll-content style="position:absolute;top:0px;transform-origin:top left"><textarea aria-label="Editor input"autocomplete=off autocapitalize=off class=oasis-editor-input data-testid=editor-input value style=pointer-events:none></textarea><input data-testid=editor-import-docx-input type=file style=display:none><input accept="image/png, image/jpeg, image/gif"data-testid=editor-insert-image-input type=file style=display:none></div></div></div><div class=oasis-editor-statusbar data-testid=editor-statusbar><div class="oasis-editor-statusbar-group oasis-editor-statusbar-start"><span class=oasis-editor-statusbar-item data-testid=editor-statusbar-word-count></span><span class=oasis-editor-statusbar-item data-testid=editor-statusbar-character-count></span><span class=oasis-editor-statusbar-item></span></div><div class="oasis-editor-statusbar-group oasis-editor-statusbar-end"><div class=oasis-editor-statusbar-zoom data-testid=editor-statusbar-zoom-control><button type=button class=oasis-editor-zoom-button>−</button><input class=oasis-editor-zoom-slider type=range><button type=button class=oasis-editor-zoom-button>+</button><span class="oasis-editor-statusbar-item oasis-editor-zoom-value"data-testid=editor-statusbar-zoom>%`), _tmpl$2$i = /* @__PURE__ */ template(`<div class=oasis-editor-import-overlay data-testid=editor-import-overlay role=status aria-live=polite><div class=oasis-editor-import-card><div class=oasis-editor-import-title></div><div class=oasis-editor-import-phase data-testid=editor-import-phase></div><div class=oasis-editor-import-progress-track><div class=oasis-editor-import-progress-bar data-testid=editor-import-progress-bar></div></div><div class=oasis-editor-import-progress-label>`), _tmpl$3$b = /* @__PURE__ */ template(`<span class=oasis-editor-import-done-icon>`), _tmpl$4$9 = /* @__PURE__ */ template(`<span class=oasis-editor-import-error-icon>`), _tmpl$5$5 = /* @__PURE__ */ template(`<span>`);
 function OasisEditorEditor(props) {
   const t = useI18n();
   const layout = () => props.layout;
@@ -38410,6 +38545,7 @@ function OasisEditorEditor(props) {
   };
   const selectedImage = createMemo(() => overlays().selectedImageBox());
   const selectedTextBox = createMemo(() => overlays().selectedTextBoxBox());
+  const selectedTable = createMemo(() => overlays().selectedTableBox());
   const commentsById = createMemo(() => {
     var _a;
     return ((_a = props.state().document.comments) == null ? void 0 : _a.items) ?? {};
@@ -38419,7 +38555,7 @@ function OasisEditorEditor(props) {
     queueMicrotask(recomputeViewportPageIndex);
   });
   return (() => {
-    var _el$ = _tmpl$$w(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$5.nextSibling, _el$7 = _el$6.nextSibling, _el$8 = _el$2.nextSibling, _el$9 = _el$8.firstChild, _el$0 = _el$9.firstChild, _el$1 = _el$0.nextSibling, _el$10 = _el$1.nextSibling, _el$11 = _el$9.nextSibling, _el$12 = _el$11.firstChild, _el$13 = _el$12.firstChild, _el$14 = _el$13.nextSibling, _el$15 = _el$14.nextSibling, _el$16 = _el$15.nextSibling, _el$17 = _el$16.firstChild;
+    var _el$ = _tmpl$$v(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$5.nextSibling, _el$7 = _el$6.nextSibling, _el$8 = _el$2.nextSibling, _el$9 = _el$8.firstChild, _el$0 = _el$9.firstChild, _el$1 = _el$0.nextSibling, _el$10 = _el$1.nextSibling, _el$11 = _el$9.nextSibling, _el$12 = _el$11.firstChild, _el$13 = _el$12.firstChild, _el$14 = _el$13.nextSibling, _el$15 = _el$14.nextSibling, _el$16 = _el$15.nextSibling, _el$17 = _el$16.firstChild;
     insert(_el$, createComponent(Show, {
       get when() {
         return memo(() => !!layout().showHorizontalRuler)() && overlays().toolbarHost;
@@ -38528,6 +38664,9 @@ function OasisEditorEditor(props) {
       get onTableDragHandleMouseDown() {
         return surfaceHandlers().onTableDragHandleMouseDown;
       },
+      get onTableCornerResizeHandleMouseDown() {
+        return surfaceHandlers().onTableCornerResizeHandleMouseDown;
+      },
       get onRevisionMouseEnter() {
         return surfaceHandlers().onRevisionMouseEnter;
       },
@@ -38621,6 +38760,22 @@ function OasisEditorEditor(props) {
         surfaceHandlers().onTextBoxRotateHandleMouseDown(textBox.paragraphId, textBox.startOffset, event);
       }
     }), _el$5);
+    insert(_el$4, createComponent(TableHandlesOverlay, {
+      box: selectedTable,
+      get readOnly() {
+        return Boolean(layout().readOnly);
+      },
+      onMoveStart: (event) => {
+        const table = selectedTable();
+        if (!table) return;
+        surfaceHandlers().onTableDragHandleMouseDown(table.tableId, event);
+      },
+      onResizeStart: (event) => {
+        const table = selectedTable();
+        if (!table) return;
+        surfaceHandlers().onTableCornerResizeHandleMouseDown(table.tableId, event);
+      }
+    }), _el$5);
     insert(_el$4, createComponent(Show, {
       get when() {
         return memo(() => !!overlays().toolbarHost)() && overlays().showFloatingTableToolbar;
@@ -38703,7 +38858,7 @@ function OasisEditorEditor(props) {
         const isDone = progress().phase === "done";
         const isError = progress().phase === "error";
         return (() => {
-          var _el$18 = _tmpl$2$j(), _el$19 = _el$18.firstChild, _el$20 = _el$19.firstChild, _el$21 = _el$20.nextSibling, _el$22 = _el$21.nextSibling, _el$23 = _el$22.firstChild, _el$24 = _el$22.nextSibling;
+          var _el$18 = _tmpl$2$i(), _el$19 = _el$18.firstChild, _el$20 = _el$19.firstChild, _el$21 = _el$20.nextSibling, _el$22 = _el$21.nextSibling, _el$23 = _el$22.firstChild, _el$24 = _el$22.nextSibling;
           _el$18.classList.toggle("oasis-editor-import-overlay-done", !!isDone);
           _el$18.classList.toggle("oasis-editor-import-overlay-error", !!isError);
           setAttribute(_el$18, "aria-busy", !isDone && !isError);
@@ -39495,11 +39650,11 @@ function createCanvasLayoutSnapshotProvider() {
     }
   };
 }
-var _tmpl$$v = /* @__PURE__ */ template(`<button>`);
+var _tmpl$$u = /* @__PURE__ */ template(`<button>`);
 function FloatingActionButton(props) {
   const [local, others] = splitProps(props, ["type", "icon", "label", "active", "class", "classList"]);
   return (() => {
-    var _el$ = _tmpl$$v();
+    var _el$ = _tmpl$$u();
     spread(_el$, mergeProps({
       get type() {
         return local.type ?? "button";
@@ -39528,7 +39683,7 @@ function FloatingActionButton(props) {
     return _el$;
   })();
 }
-var _tmpl$$u = /* @__PURE__ */ template(`<aside>`), _tmpl$2$i = /* @__PURE__ */ template(`<div>`);
+var _tmpl$$t = /* @__PURE__ */ template(`<aside>`), _tmpl$2$h = /* @__PURE__ */ template(`<div>`);
 function SidePanel(props) {
   const [local, others] = splitProps(props, ["mode", "width", "class", "classList", "children", "style"]);
   const width = () => {
@@ -39538,7 +39693,7 @@ function SidePanel(props) {
     return local.width ?? "360px";
   };
   return (() => {
-    var _el$ = _tmpl$$u();
+    var _el$ = _tmpl$$t();
     spread(_el$, mergeProps({
       get ["class"]() {
         return `oasis-editor-plugin-side-panel ${local.class ?? ""}`;
@@ -39563,7 +39718,7 @@ function SidePanel(props) {
 function SidePanelHeader(props) {
   const [local, others] = splitProps(props, ["class", "children"]);
   return (() => {
-    var _el$2 = _tmpl$2$i();
+    var _el$2 = _tmpl$2$h();
     spread(_el$2, mergeProps({
       get ["class"]() {
         return `oasis-editor-plugin-side-panel-header ${local.class ?? ""}`;
@@ -39576,7 +39731,7 @@ function SidePanelHeader(props) {
 function SidePanelBody(props) {
   const [local, others] = splitProps(props, ["class", "children"]);
   return (() => {
-    var _el$3 = _tmpl$2$i();
+    var _el$3 = _tmpl$2$h();
     spread(_el$3, mergeProps({
       get ["class"]() {
         return `oasis-editor-plugin-side-panel-body ${local.class ?? ""}`;
@@ -39589,7 +39744,7 @@ function SidePanelBody(props) {
 function SidePanelFooter(props) {
   const [local, others] = splitProps(props, ["class", "children"]);
   return (() => {
-    var _el$4 = _tmpl$2$i();
+    var _el$4 = _tmpl$2$h();
     spread(_el$4, mergeProps({
       get ["class"]() {
         return `oasis-editor-plugin-side-panel-footer ${local.class ?? ""}`;
@@ -39599,11 +39754,11 @@ function SidePanelFooter(props) {
     return _el$4;
   })();
 }
-var _tmpl$$t = /* @__PURE__ */ template(`<button>`);
+var _tmpl$$s = /* @__PURE__ */ template(`<button>`);
 function IconButton(props) {
   const [local, others] = splitProps(props, ["type", "icon", "label", "active", "variant", "size", "class", "classList"]);
   return (() => {
-    var _el$ = _tmpl$$t();
+    var _el$ = _tmpl$$s();
     spread(_el$, mergeProps({
       get type() {
         return local.type ?? "button";
@@ -39634,7 +39789,7 @@ function IconButton(props) {
     return _el$;
   })();
 }
-var _tmpl$$s = /* @__PURE__ */ template(`<div class=oasis-editor-plugin-floating-actions>`), _tmpl$2$h = /* @__PURE__ */ template(`<div class=oasis-editor-plugin-ui-host><div class=oasis-editor-plugin-ui-main>`), _tmpl$3$a = /* @__PURE__ */ template(`<div class=oasis-editor-plugin-side-panel-overlay>`), _tmpl$4$8 = /* @__PURE__ */ template(`<div class=oasis-editor-plugin-side-panel-title>`);
+var _tmpl$$r = /* @__PURE__ */ template(`<div class=oasis-editor-plugin-floating-actions>`), _tmpl$2$g = /* @__PURE__ */ template(`<div class=oasis-editor-plugin-ui-host><div class=oasis-editor-plugin-ui-main>`), _tmpl$3$a = /* @__PURE__ */ template(`<div class=oasis-editor-plugin-side-panel-overlay>`), _tmpl$4$8 = /* @__PURE__ */ template(`<div class=oasis-editor-plugin-side-panel-title>`);
 const EMPTY_SNAPSHOT = {
   floatingActions: [],
   sidePanels: [],
@@ -39666,7 +39821,7 @@ function PluginUiHost(props) {
       return groupActionsByPlacement(actions());
     },
     children: (group) => (() => {
-      var _el$ = _tmpl$$s();
+      var _el$ = _tmpl$$r();
       insert(_el$, createComponent(For, {
         get each() {
           return group.actions;
@@ -39695,7 +39850,7 @@ function PluginUiHost(props) {
     })()
   });
   return (() => {
-    var _el$2 = _tmpl$2$h(), _el$3 = _el$2.firstChild;
+    var _el$2 = _tmpl$2$g(), _el$3 = _el$2.firstChild;
     insert(_el$3, resolvedChildren);
     insert(_el$2, createComponent(Show, {
       get when() {
@@ -39818,7 +39973,7 @@ function groupActionsByPlacement(actions) {
     actions: groupActions
   }));
 }
-var _tmpl$$r = /* @__PURE__ */ template(`<div class=oasis-editor-main-container><section class=oasis-editor-stage>`);
+var _tmpl$$q = /* @__PURE__ */ template(`<div class=oasis-editor-main-container><section class=oasis-editor-stage>`);
 function DocumentShell(props) {
   let surfaceEl;
   let viewportEl;
@@ -39945,7 +40100,7 @@ function DocumentShell(props) {
       return props.runtimeEditor;
     },
     get children() {
-      var _el$ = _tmpl$$r(), _el$2 = _el$.firstChild;
+      var _el$ = _tmpl$$q(), _el$2 = _el$.firstChild;
       insert(_el$, createComponent(Show, {
         get when() {
           return memo(() => !!props.showChrome)() && props.showOutline;
@@ -40010,10 +40165,10 @@ function DocumentShell(props) {
     }
   })];
 }
-var _tmpl$$q = /* @__PURE__ */ template(`<div class=oasis-editor-main-container><section class=oasis-editor-stage style=padding:0>`), _tmpl$2$g = /* @__PURE__ */ template(`<div class=oasis-inline-shell style="border:1px solid var(--oasis-toolbar-border);border-radius:var(--oasis-radius);overflow:hidden;display:flex;flex-direction:column">`);
+var _tmpl$$p = /* @__PURE__ */ template(`<div class=oasis-editor-main-container><section class=oasis-editor-stage style=padding:0>`), _tmpl$2$f = /* @__PURE__ */ template(`<div class=oasis-inline-shell style="border:1px solid var(--oasis-toolbar-border);border-radius:var(--oasis-radius);overflow:hidden;display:flex;flex-direction:column">`);
 function InlineShell(props) {
   return (() => {
-    var _el$ = _tmpl$2$g();
+    var _el$ = _tmpl$2$f();
     insert(_el$, createComponent(Show, {
       get when() {
         return memo(() => !!props.showChrome)() && props.showToolbar;
@@ -40040,7 +40195,7 @@ function InlineShell(props) {
         return props.runtimeEditor;
       },
       get children() {
-        var _el$2 = _tmpl$$q(), _el$3 = _el$2.firstChild;
+        var _el$2 = _tmpl$$p(), _el$3 = _el$2.firstChild;
         insert(_el$3, createComponent(OasisEditorEditor, {
           state: () => props.state,
           get layout() {
@@ -40080,16 +40235,16 @@ function InlineShell(props) {
     return _el$;
   })();
 }
-var _tmpl$$p = /* @__PURE__ */ template(`<div class=oasis-editor-main-container><section class=oasis-editor-stage style=padding:0>`), _tmpl$2$f = /* @__PURE__ */ template(`<div class=oasis-balloon-shell>`);
+var _tmpl$$o = /* @__PURE__ */ template(`<div class=oasis-editor-main-container><section class=oasis-editor-stage style=padding:0>`), _tmpl$2$e = /* @__PURE__ */ template(`<div class=oasis-balloon-shell>`);
 function BalloonShell(props) {
   return (() => {
-    var _el$ = _tmpl$2$f();
+    var _el$ = _tmpl$2$e();
     insert(_el$, createComponent(PluginUiHost, {
       get editor() {
         return props.runtimeEditor;
       },
       get children() {
-        var _el$2 = _tmpl$$p(), _el$3 = _el$2.firstChild;
+        var _el$2 = _tmpl$$o(), _el$3 = _el$2.firstChild;
         insert(_el$3, createComponent(OasisEditorEditor, {
           state: () => props.state,
           get layout() {
@@ -40129,7 +40284,7 @@ function BalloonShell(props) {
     return _el$;
   })();
 }
-var _tmpl$$o = /* @__PURE__ */ template(`<div class=oasis-editor-dialog-footer data-testid=editor-dialog-footer>`), _tmpl$2$e = /* @__PURE__ */ template(`<div class=oasis-editor-dialog-overlay><div role=dialog aria-modal=true data-testid=editor-dialog><div class=oasis-editor-dialog-header><h3 class=oasis-editor-dialog-title></h3><button class=oasis-editor-dialog-close data-testid=editor-dialog-close><i data-lucide=x></i></button></div><div data-testid=editor-dialog-body>`);
+var _tmpl$$n = /* @__PURE__ */ template(`<div class=oasis-editor-dialog-footer data-testid=editor-dialog-footer>`), _tmpl$2$d = /* @__PURE__ */ template(`<div class=oasis-editor-dialog-overlay><div role=dialog aria-modal=true data-testid=editor-dialog><div class=oasis-editor-dialog-header><h3 class=oasis-editor-dialog-title></h3><button class=oasis-editor-dialog-close data-testid=editor-dialog-close><i data-lucide=x></i></button></div><div data-testid=editor-dialog-body>`);
 function Dialog(props) {
   const t = useI18n();
   let dialogRef;
@@ -40154,7 +40309,7 @@ function Dialog(props) {
       return props.isOpen;
     },
     get children() {
-      var _el$ = _tmpl$2$e(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$3.nextSibling;
+      var _el$ = _tmpl$2$d(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$3.nextSibling;
       _el$.$$click = () => {
         if (props.closeOnOverlayClick ?? true) {
           props.onClose();
@@ -40171,7 +40326,7 @@ function Dialog(props) {
           return props.footer;
         },
         get children() {
-          var _el$7 = _tmpl$$o();
+          var _el$7 = _tmpl$$n();
           insert(_el$7, () => props.footer);
           return _el$7;
         }
@@ -40200,7 +40355,7 @@ function Dialog(props) {
   });
 }
 delegateEvents(["click"]);
-var _tmpl$$n = /* @__PURE__ */ template(`<div><div class=oasis-editor-tabs-list role=tablist>`), _tmpl$2$d = /* @__PURE__ */ template(`<button type=button role=tab class=oasis-editor-tabs-tab>`), _tmpl$3$9 = /* @__PURE__ */ template(`<div role=tabpanel class=oasis-editor-tabs-panel>`);
+var _tmpl$$m = /* @__PURE__ */ template(`<div><div class=oasis-editor-tabs-list role=tablist>`), _tmpl$2$c = /* @__PURE__ */ template(`<button type=button role=tab class=oasis-editor-tabs-tab>`), _tmpl$3$9 = /* @__PURE__ */ template(`<div role=tabpanel class=oasis-editor-tabs-panel>`);
 function findEnabledItem(items, startIndex, direction) {
   if (!items.length) return void 0;
   for (let step = 0; step < items.length; step += 1) {
@@ -40251,7 +40406,7 @@ function Tabs(props) {
     selectItem(findEnabledItem(items(), currentIndex + direction, direction), true);
   };
   return (() => {
-    var _el$ = _tmpl$$n(), _el$2 = _el$.firstChild;
+    var _el$ = _tmpl$$m(), _el$2 = _el$.firstChild;
     _el$2.$$keydown = handleKeyDown;
     insert(_el$2, createComponent(For, {
       get each() {
@@ -40261,7 +40416,7 @@ function Tabs(props) {
         const tabId = `${baseId}-${item.id}-tab`;
         const panelId = `${baseId}-${item.id}-panel`;
         return (() => {
-          var _el$3 = _tmpl$2$d();
+          var _el$3 = _tmpl$2$c();
           _el$3.$$click = () => selectItem(item);
           use((element) => {
             tabRefs[index()] = element;
@@ -40328,12 +40483,12 @@ function Tabs(props) {
   })();
 }
 delegateEvents(["keydown", "click"]);
-var _tmpl$$m = /* @__PURE__ */ template(`<button><span class=oasis-editor-ui-button-label>`);
+var _tmpl$$l = /* @__PURE__ */ template(`<button><span class=oasis-editor-ui-button-label>`);
 function Button(props) {
   const [local, others] = splitProps(props, ["type", "variant", "size", "icon", "iconPosition", "fullWidth", "class", "classList", "children"]);
   const iconPosition = () => local.iconPosition ?? "start";
   return (() => {
-    var _el$ = _tmpl$$m(), _el$2 = _el$.firstChild;
+    var _el$ = _tmpl$$l(), _el$2 = _el$.firstChild;
     spread(_el$, mergeProps({
       get type() {
         return local.type ?? "button";
@@ -40413,11 +40568,11 @@ function StatusText(props) {
     }
   }, others));
 }
-var _tmpl$$l = /* @__PURE__ */ template(`<div>`);
+var _tmpl$$k = /* @__PURE__ */ template(`<div>`);
 function ActionRow(props) {
   const [local, others] = splitProps(props, ["align", "wrap", "class", "classList", "children"]);
   return (() => {
-    var _el$ = _tmpl$$l();
+    var _el$ = _tmpl$$k();
     spread(_el$, mergeProps({
       get ["class"]() {
         return `oasis-editor-ui-action-row ${local.class ?? ""}`;
@@ -40473,7 +40628,7 @@ function mergeStyles(...styles) {
   }
   return Object.assign({}, ...objectStyles);
 }
-var _tmpl$$k = /* @__PURE__ */ template(`<span class=oasis-editor-ui-stack-divider-item aria-hidden=true>`);
+var _tmpl$$j = /* @__PURE__ */ template(`<span class=oasis-editor-ui-stack-divider-item aria-hidden=true>`);
 function childArray(value) {
   if (Array.isArray(value)) return value;
   if (value === null || value === void 0 || value === false) return [];
@@ -40513,7 +40668,7 @@ function Stack(props) {
             return memo(() => index() > 0)() && local.divider;
           },
           get children() {
-            var _el$ = _tmpl$$k();
+            var _el$ = _tmpl$$j();
             insert(_el$, () => renderDivider(index()));
             return _el$;
           }
@@ -40592,14 +40747,14 @@ function Grid(props) {
     }
   }));
 }
-var _tmpl$$j = /* @__PURE__ */ template(`<label>`), _tmpl$2$c = /* @__PURE__ */ template(`<div>`);
+var _tmpl$$i = /* @__PURE__ */ template(`<label>`), _tmpl$2$b = /* @__PURE__ */ template(`<div>`);
 function FormField(props) {
   const fallbackId = createUniqueId();
   const [local, others] = splitProps(props, ["label", "for", "description", "error", "labelClass", "class", "classList", "children"]);
   const descriptionId = () => local.for ?? `${fallbackId}-description`;
   const errorId = () => local.for ?? `${fallbackId}-error`;
   return (() => {
-    var _el$ = _tmpl$2$c();
+    var _el$ = _tmpl$2$b();
     spread(_el$, mergeProps({
       get ["class"]() {
         return `oasis-editor-ui-field ${local.class ?? ""}`;
@@ -40613,7 +40768,7 @@ function FormField(props) {
         return local.label;
       },
       get children() {
-        var _el$2 = _tmpl$$j();
+        var _el$2 = _tmpl$$i();
         insert(_el$2, () => local.label);
         createRenderEffect((_p$) => {
           var _v$ = `oasis-editor-ui-field-label ${local.labelClass ?? ""}`, _v$2 = local.for;
@@ -40664,7 +40819,7 @@ function FormField(props) {
     return _el$;
   })();
 }
-var _tmpl$$i = /* @__PURE__ */ template(`<span>`), _tmpl$2$b = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-description>`), _tmpl$3$8 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-error>`), _tmpl$4$7 = /* @__PURE__ */ template(`<label><input>`);
+var _tmpl$$h = /* @__PURE__ */ template(`<span>`), _tmpl$2$a = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-description>`), _tmpl$3$8 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-error>`), _tmpl$4$7 = /* @__PURE__ */ template(`<label><input>`);
 function TextField(props) {
   const fallbackId = createUniqueId();
   const [local, others] = splitProps(props, ["label", "description", "error", "labelClass", "controlClass", "onChange", "class", "classList", "id"]);
@@ -40678,7 +40833,7 @@ function TextField(props) {
         return local.label;
       },
       get children() {
-        var _el$2 = _tmpl$$i();
+        var _el$2 = _tmpl$$h();
         insert(_el$2, () => local.label);
         createRenderEffect(() => className(_el$2, `oasis-editor-ui-field-label ${local.labelClass ?? ""}`));
         return _el$2;
@@ -40707,7 +40862,7 @@ function TextField(props) {
         return local.description;
       },
       get children() {
-        var _el$4 = _tmpl$2$b();
+        var _el$4 = _tmpl$2$a();
         insert(_el$4, () => local.description);
         createRenderEffect(() => setAttribute(_el$4, "id", descriptionId()));
         return _el$4;
@@ -40739,7 +40894,7 @@ function TextField(props) {
   })();
 }
 delegateEvents(["input"]);
-var _tmpl$$h = /* @__PURE__ */ template(`<textarea>`);
+var _tmpl$$g = /* @__PURE__ */ template(`<textarea>`);
 function TextAreaField(props) {
   const fallbackId = createUniqueId();
   const [local, others] = splitProps(props, ["label", "description", "error", "labelClass", "controlClass", "onChange", "class", "id"]);
@@ -40765,7 +40920,7 @@ function TextAreaField(props) {
       return local.error;
     },
     get children() {
-      var _el$ = _tmpl$$h();
+      var _el$ = _tmpl$$g();
       _el$.$$input = (event) => {
         var _a;
         return (_a = local.onChange) == null ? void 0 : _a.call(local, event.currentTarget.value);
@@ -40801,7 +40956,7 @@ function ColorField(props) {
     }
   }, others));
 }
-var _tmpl$$g = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-description>`), _tmpl$2$a = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-error>`), _tmpl$3$7 = /* @__PURE__ */ template(`<label><input type=checkbox class=oasis-editor-ui-checkbox-input><span class=oasis-editor-ui-checkbox-copy><span class=oasis-editor-ui-field-label>`);
+var _tmpl$$f = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-description>`), _tmpl$2$9 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-error>`), _tmpl$3$7 = /* @__PURE__ */ template(`<label><input type=checkbox class=oasis-editor-ui-checkbox-input><span class=oasis-editor-ui-checkbox-copy><span class=oasis-editor-ui-field-label>`);
 function Checkbox(props) {
   const fallbackId = createUniqueId();
   const [local, others] = splitProps(props, ["label", "description", "error", "onChange", "class", "id"]);
@@ -40831,7 +40986,7 @@ function Checkbox(props) {
         return local.description;
       },
       get children() {
-        var _el$5 = _tmpl$$g();
+        var _el$5 = _tmpl$$f();
         insert(_el$5, () => local.description);
         createRenderEffect(() => setAttribute(_el$5, "id", descriptionId()));
         return _el$5;
@@ -40842,7 +40997,7 @@ function Checkbox(props) {
         return local.error;
       },
       get children() {
-        var _el$6 = _tmpl$2$a();
+        var _el$6 = _tmpl$2$9();
         insert(_el$6, () => local.error);
         createRenderEffect(() => setAttribute(_el$6, "id", errorId()));
         return _el$6;
@@ -40860,7 +41015,7 @@ function Checkbox(props) {
     return _el$;
   })();
 }
-var _tmpl$$f = /* @__PURE__ */ template(`<span>`), _tmpl$2$9 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-description>`), _tmpl$3$6 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-error>`), _tmpl$4$6 = /* @__PURE__ */ template(`<label><select>`), _tmpl$5$4 = /* @__PURE__ */ template(`<option>`);
+var _tmpl$$e = /* @__PURE__ */ template(`<span>`), _tmpl$2$8 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-description>`), _tmpl$3$6 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-error>`), _tmpl$4$6 = /* @__PURE__ */ template(`<label><select>`), _tmpl$5$4 = /* @__PURE__ */ template(`<option>`);
 function SelectField(props) {
   const fallbackId = createUniqueId();
   const [local, others] = splitProps(props, ["label", "description", "error", "labelClass", "controlClass", "options", "onChange", "class", "classList", "id", "value"]);
@@ -40875,7 +41030,7 @@ function SelectField(props) {
         return local.label;
       },
       get children() {
-        var _el$2 = _tmpl$$f();
+        var _el$2 = _tmpl$$e();
         insert(_el$2, () => local.label);
         createRenderEffect(() => className(_el$2, `oasis-editor-ui-field-label ${local.labelClass ?? ""}`));
         return _el$2;
@@ -40928,7 +41083,7 @@ function SelectField(props) {
         return local.description;
       },
       get children() {
-        var _el$4 = _tmpl$2$9();
+        var _el$4 = _tmpl$2$8();
         insert(_el$4, () => local.description);
         createRenderEffect(() => setAttribute(_el$4, "id", descriptionId()));
         return _el$4;
@@ -40974,7 +41129,7 @@ function NumberField(props) {
     }
   }, others));
 }
-var _tmpl$$e = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-description>`), _tmpl$2$8 = /* @__PURE__ */ template(`<label><input type=radio class=oasis-editor-ui-radio-input><span class=oasis-editor-ui-checkbox-copy><span class=oasis-editor-ui-field-label>`), _tmpl$3$5 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-label>`), _tmpl$4$5 = /* @__PURE__ */ template(`<div role=radiogroup>`);
+var _tmpl$$d = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-description>`), _tmpl$2$7 = /* @__PURE__ */ template(`<label><input type=radio class=oasis-editor-ui-radio-input><span class=oasis-editor-ui-checkbox-copy><span class=oasis-editor-ui-field-label>`), _tmpl$3$5 = /* @__PURE__ */ template(`<span class=oasis-editor-ui-field-label>`), _tmpl$4$5 = /* @__PURE__ */ template(`<div role=radiogroup>`);
 const RadioGroupCtx = createContext();
 function Radio(props) {
   const fallbackId = createUniqueId();
@@ -40985,7 +41140,7 @@ function Radio(props) {
   const checked = () => group ? group.value() === local.value : Boolean(local.checked);
   const disabled = () => Boolean(local.disabled) || (group ? group.disabled() : false);
   return (() => {
-    var _el$ = _tmpl$2$8(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.firstChild;
+    var _el$ = _tmpl$2$7(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.firstChild;
     _el$2.addEventListener("change", (event) => {
       var _a;
       if (group) group.onSelect(local.value);
@@ -41017,7 +41172,7 @@ function Radio(props) {
         return local.description;
       },
       get children() {
-        var _el$5 = _tmpl$$e();
+        var _el$5 = _tmpl$$d();
         insert(_el$5, () => local.description);
         createRenderEffect(() => setAttribute(_el$5, "id", descriptionId()));
         return _el$5;
@@ -41102,7 +41257,7 @@ function RadioGroup(props) {
     }
   });
 }
-var _tmpl$$d = /* @__PURE__ */ template(`<div>`);
+var _tmpl$$c = /* @__PURE__ */ template(`<div>`);
 const ALIGN_MAP = {
   start: "flex-start",
   center: "center",
@@ -41112,7 +41267,7 @@ const ALIGN_MAP = {
 function FieldRow(props) {
   const [local, others] = splitProps(props, ["align", "class", "style", "children"]);
   return (() => {
-    var _el$ = _tmpl$$d();
+    var _el$ = _tmpl$$c();
     spread(_el$, mergeProps({
       get ["class"]() {
         return `oasis-editor-ui-field-row ${local.class ?? ""}`;
@@ -41128,11 +41283,11 @@ function FieldRow(props) {
     return _el$;
   })();
 }
-var _tmpl$$c = /* @__PURE__ */ template(`<legend>`), _tmpl$2$7 = /* @__PURE__ */ template(`<fieldset>`);
+var _tmpl$$b = /* @__PURE__ */ template(`<legend>`), _tmpl$2$6 = /* @__PURE__ */ template(`<fieldset>`);
 function FieldGroup(props) {
   const [local, others] = splitProps(props, ["legend", "legendClass", "class", "children"]);
   return (() => {
-    var _el$ = _tmpl$2$7();
+    var _el$ = _tmpl$2$6();
     spread(_el$, mergeProps({
       get ["class"]() {
         return `oasis-editor-ui-field-group ${local.class ?? ""}`;
@@ -41143,7 +41298,7 @@ function FieldGroup(props) {
         return local.legend;
       },
       get children() {
-        var _el$2 = _tmpl$$c();
+        var _el$2 = _tmpl$$b();
         insert(_el$2, () => local.legend);
         createRenderEffect(() => className(_el$2, `oasis-editor-ui-field-group-legend ${local.legendClass ?? ""}`));
         return _el$2;
@@ -41153,11 +41308,11 @@ function FieldGroup(props) {
     return _el$;
   })();
 }
-var _tmpl$$b = /* @__PURE__ */ template(`<label><input type=checkbox class=oasis-editor-ui-toggle-chip-input><span class=oasis-editor-ui-toggle-chip-label>`);
+var _tmpl$$a = /* @__PURE__ */ template(`<label><input type=checkbox class=oasis-editor-ui-toggle-chip-input><span class=oasis-editor-ui-toggle-chip-label>`);
 function ToggleChip(props) {
   const [local, others] = splitProps(props, ["label", "labelStyle", "onChange", "class", "checked"]);
   return (() => {
-    var _el$ = _tmpl$$b(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
+    var _el$ = _tmpl$$a(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
     _el$2.addEventListener("change", (event) => {
       var _a;
       return (_a = local.onChange) == null ? void 0 : _a.call(local, event.currentTarget.checked);
@@ -41182,11 +41337,11 @@ function ToggleChip(props) {
     return _el$;
   })();
 }
-var _tmpl$$a = /* @__PURE__ */ template(`<div>`);
+var _tmpl$$9 = /* @__PURE__ */ template(`<div>`);
 function DialogFooter(props) {
   const [local, others] = splitProps(props, ["align", "class", "classList", "children"]);
   return (() => {
-    var _el$ = _tmpl$$a();
+    var _el$ = _tmpl$$9();
     spread(_el$, mergeProps({
       get ["class"]() {
         return `oasis-editor-ui-dialog-footer ${local.class ?? ""}`;
@@ -41512,7 +41667,7 @@ const UNDERLINE_STYLE_OPTIONS = [
     }
   }
 ];
-var _tmpl$$9 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-color-menu-action data-testid=editor-toolbar-underline-remove role=menuitem><span class=oasis-editor-color-menu-action-swatch><i data-lucide=slash></i></span><span>`), _tmpl$2$6 = /* @__PURE__ */ template(`<div class=oasis-editor-underline-menu-list>`), _tmpl$3$4 = /* @__PURE__ */ template(`<span class="oasis-editor-color-split-icon oasis-editor-underline-split-icon"><span class=oasis-editor-underline-split-glyph aria-hidden=true>U</span><span class=oasis-editor-underline-split-indicator>`), _tmpl$4$4 = /* @__PURE__ */ template(`<span class="oasis-editor-underline-menu-stroke oasis-editor-underline-menu-stroke-svg">`), _tmpl$5$3 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-underline-menu-item role=menuitemradio><span class=oasis-editor-underline-menu-preview></span><span class=oasis-editor-underline-menu-label>`), _tmpl$6$3 = /* @__PURE__ */ template(`<span class=oasis-editor-underline-menu-stroke>`);
+var _tmpl$$8 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-color-menu-action data-testid=editor-toolbar-underline-remove role=menuitem><span class=oasis-editor-color-menu-action-swatch><i data-lucide=slash></i></span><span>`), _tmpl$2$5 = /* @__PURE__ */ template(`<div class=oasis-editor-underline-menu-list>`), _tmpl$3$4 = /* @__PURE__ */ template(`<span class="oasis-editor-color-split-icon oasis-editor-underline-split-icon"><span class=oasis-editor-underline-split-glyph aria-hidden=true>U</span><span class=oasis-editor-underline-split-indicator>`), _tmpl$4$4 = /* @__PURE__ */ template(`<span class="oasis-editor-underline-menu-stroke oasis-editor-underline-menu-stroke-svg">`), _tmpl$5$3 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-underline-menu-item role=menuitemradio><span class=oasis-editor-underline-menu-preview></span><span class=oasis-editor-underline-menu-label>`), _tmpl$6$3 = /* @__PURE__ */ template(`<span class=oasis-editor-underline-menu-stroke>`);
 const mod$1 = /Mac/i.test(navigator.userAgent) ? "⌘" : "Ctrl";
 const TEST_ID = "editor-toolbar-underline";
 function UnderlineControl(props) {
@@ -41570,7 +41725,7 @@ function UnderlineControl(props) {
     },
     get children() {
       return [(() => {
-        var _el$ = _tmpl$$9(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
+        var _el$ = _tmpl$$8(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
         _el$.$$click = () => {
           removeUnderline();
           setOpen(false);
@@ -41578,7 +41733,7 @@ function UnderlineControl(props) {
         insert(_el$3, () => t("toolbar.underlineRemove"));
         return _el$;
       })(), (() => {
-        var _el$4 = _tmpl$2$6();
+        var _el$4 = _tmpl$2$5();
         insert(_el$4, createComponent(For, {
           each: UNDERLINE_STYLE_OPTIONS,
           children: (option) => {
@@ -41633,7 +41788,7 @@ function UnderlineControl(props) {
   });
 }
 delegateEvents(["click"]);
-var _tmpl$$8 = /* @__PURE__ */ template(`<option value=decimal>`), _tmpl$2$5 = /* @__PURE__ */ template(`<option value=lowerLetter>`), _tmpl$3$3 = /* @__PURE__ */ template(`<option value=upperLetter>`), _tmpl$4$3 = /* @__PURE__ */ template(`<option value=lowerRoman>`), _tmpl$5$2 = /* @__PURE__ */ template(`<option value=upperRoman>`), _tmpl$6$2 = /* @__PURE__ */ template(`<option value=bullet>`), _tmpl$7 = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-list-options><label class=oasis-editor-toolbar-field><span></span></label><label class=oasis-editor-toolbar-field><span></span><input type=number class=oasis-editor-tool-number data-testid=editor-toolbar-list-start-at min=1 step=1 placeholder=1>`);
+var _tmpl$$7 = /* @__PURE__ */ template(`<option value=decimal>`), _tmpl$2$4 = /* @__PURE__ */ template(`<option value=lowerLetter>`), _tmpl$3$3 = /* @__PURE__ */ template(`<option value=upperLetter>`), _tmpl$4$3 = /* @__PURE__ */ template(`<option value=lowerRoman>`), _tmpl$5$2 = /* @__PURE__ */ template(`<option value=upperRoman>`), _tmpl$6$2 = /* @__PURE__ */ template(`<option value=bullet>`), _tmpl$7 = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-list-options><label class=oasis-editor-toolbar-field><span></span></label><label class=oasis-editor-toolbar-field><span></span><input type=number class=oasis-editor-tool-number data-testid=editor-toolbar-list-start-at min=1 step=1 placeholder=1>`);
 function ListOptionsControl(props) {
   const t = useI18n();
   const api = props.api;
@@ -41655,11 +41810,11 @@ function ListOptionsControl(props) {
         },
         get children() {
           return [(() => {
-            var _el$4 = _tmpl$$8();
+            var _el$4 = _tmpl$$7();
             insert(_el$4, () => t("toolbar.formatDecimal"));
             return _el$4;
           })(), (() => {
-            var _el$5 = _tmpl$2$5();
+            var _el$5 = _tmpl$2$4();
             insert(_el$5, () => t("toolbar.formatLowerLetter"));
             return _el$5;
           })(), (() => {
@@ -41688,7 +41843,7 @@ function ListOptionsControl(props) {
     }
   });
 }
-var _tmpl$$7 = /* @__PURE__ */ template(`<div class=oasis-editor-dialog-preview data-testid=editor-line-spacing-dialog-preview><br>`);
+var _tmpl$$6 = /* @__PURE__ */ template(`<div class=oasis-editor-dialog-preview data-testid=editor-line-spacing-dialog-preview><br>`);
 function LineSpacingDialog(props) {
   const t = useI18n();
   const parseNumber = (value) => {
@@ -41824,7 +41979,7 @@ function LineSpacingDialog(props) {
           return t("lineSpacing.preview");
         },
         get children() {
-          var _el$ = _tmpl$$7(), _el$2 = _el$.firstChild;
+          var _el$ = _tmpl$$6(), _el$2 = _el$.firstChild;
           insert(_el$, () => t("lineSpacing.previewText"), _el$2);
           insert(_el$, () => t("lineSpacing.previewText"), null);
           createRenderEffect((_$p) => style(_el$, previewStyle2(), _$p));
@@ -41834,7 +41989,7 @@ function LineSpacingDialog(props) {
     }
   });
 }
-var _tmpl$$6 = /* @__PURE__ */ template(`<div class=oasis-editor-line-spacing-menu-separator role=separator>`), _tmpl$2$4 = /* @__PURE__ */ template(`<button type=button class="oasis-editor-line-spacing-item oasis-editor-line-spacing-item-more"role=menuitem data-testid=editor-toolbar-line-spacing-options><span class=oasis-editor-line-spacing-item-check aria-hidden=true></span><span class=oasis-editor-line-spacing-item-label>`), _tmpl$3$2 = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-dropdown>`), _tmpl$4$2 = /* @__PURE__ */ template(`<button type=button class="oasis-editor-tool-button oasis-editor-tool-button-dropdown oasis-editor-line-spacing-button"aria-haspopup=menu data-testid=editor-toolbar-line-spacing><span class=oasis-editor-line-spacing-icon aria-hidden=true><svg xmlns=http://www.w3.org/2000/svg width=18 height=18 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><polyline points="4 7 7 4 10 7"></polyline><line x1=7 y1=4 x2=7 y2=20></line><polyline points="4 17 7 20 10 17"></polyline><line x1=13 y1=6 x2=21 y2=6></line><line x1=13 y1=12 x2=21 y2=12></line><line x1=13 y1=18 x2=21 y2=18>`), _tmpl$5$1 = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg width=14 height=14 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2.5 stroke-linecap=round stroke-linejoin=round><polyline points="20 6 9 17 4 12">`), _tmpl$6$1 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-line-spacing-item role=menuitemradio><span class=oasis-editor-line-spacing-item-check aria-hidden=true></span><span class=oasis-editor-line-spacing-item-label>`);
+var _tmpl$$5 = /* @__PURE__ */ template(`<div class=oasis-editor-line-spacing-menu-separator role=separator>`), _tmpl$2$3 = /* @__PURE__ */ template(`<button type=button class="oasis-editor-line-spacing-item oasis-editor-line-spacing-item-more"role=menuitem data-testid=editor-toolbar-line-spacing-options><span class=oasis-editor-line-spacing-item-check aria-hidden=true></span><span class=oasis-editor-line-spacing-item-label>`), _tmpl$3$2 = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-dropdown>`), _tmpl$4$2 = /* @__PURE__ */ template(`<button type=button class="oasis-editor-tool-button oasis-editor-tool-button-dropdown oasis-editor-line-spacing-button"aria-haspopup=menu data-testid=editor-toolbar-line-spacing><span class=oasis-editor-line-spacing-icon aria-hidden=true><svg xmlns=http://www.w3.org/2000/svg width=18 height=18 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round><polyline points="4 7 7 4 10 7"></polyline><line x1=7 y1=4 x2=7 y2=20></line><polyline points="4 17 7 20 10 17"></polyline><line x1=13 y1=6 x2=21 y2=6></line><line x1=13 y1=12 x2=21 y2=12></line><line x1=13 y1=18 x2=21 y2=18>`), _tmpl$5$1 = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg width=14 height=14 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2.5 stroke-linecap=round stroke-linejoin=round><polyline points="20 6 9 17 4 12">`), _tmpl$6$1 = /* @__PURE__ */ template(`<button type=button class=oasis-editor-line-spacing-item role=menuitemradio><span class=oasis-editor-line-spacing-item-check aria-hidden=true></span><span class=oasis-editor-line-spacing-item-label>`);
 const PRESET_VALUES = [1, 1.15, 1.5, 2, 2.5, 3];
 function formatPreset(value) {
   return value.toFixed(value === Math.floor(value) ? 1 : 2);
@@ -41956,8 +42111,8 @@ function LineSpacingButton(props) {
               return _el$7;
             })();
           }
-        }), _tmpl$$6(), (() => {
-          var _el$3 = _tmpl$2$4(), _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling;
+        }), _tmpl$$5(), (() => {
+          var _el$3 = _tmpl$2$3(), _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling;
           _el$3.$$click = openDialog;
           insert(_el$5, () => t("metric.lineSpacingOptions"));
           return _el$3;
@@ -41989,7 +42144,7 @@ function LineSpacingButton(props) {
   })();
 }
 delegateEvents(["click"]);
-var _tmpl$$5 = /* @__PURE__ */ template(`<div class="oasis-editor-toolbar-panel-section oasis-editor-toolbar-panel-actions">`), _tmpl$2$3 = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-panel-grid>`);
+var _tmpl$$4 = /* @__PURE__ */ template(`<div class="oasis-editor-toolbar-panel-section oasis-editor-toolbar-panel-actions">`), _tmpl$2$2 = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-panel-grid>`);
 const numValue = (api, command) => {
   const value = api.commands.state(command).value;
   return value == null ? "" : String(value);
@@ -42008,7 +42163,7 @@ function MetricGroup(props) {
     keepMounted: true,
     get children() {
       return [(() => {
-        var _el$ = _tmpl$$5();
+        var _el$ = _tmpl$$4();
         insert(_el$, createComponent(Button$1, {
           icon: "file-up",
           get active() {
@@ -42033,7 +42188,7 @@ function MetricGroup(props) {
         }), null);
         return _el$;
       })(), (() => {
-        var _el$2 = _tmpl$2$3();
+        var _el$2 = _tmpl$2$2();
         insert(_el$2, createComponent(NumberField, {
           "class": "oasis-editor-tool-metric",
           labelClass: "oasis-editor-tool-metric-label",
@@ -42135,211 +42290,6 @@ function MetricGroup(props) {
     }
   });
 }
-var _tmpl$$4 = /* @__PURE__ */ template(`<div class="oasis-editor-toolbar-panel-section oasis-editor-toolbar-panel-actions">`), _tmpl$2$2 = /* @__PURE__ */ template(`<div class=oasis-editor-toolbar-badge data-testid=editor-table-selection-label>`);
-function TableGroup(props) {
-  const t = useI18n();
-  const api = props.api;
-  const disabled = (command) => !api.commands.state(command).isEnabled;
-  const selectionLabel = () => api.commands.state("tableContext").value;
-  return createComponent(Menu, {
-    icon: "table-properties",
-    testId: "editor-toolbar-table-dropdown",
-    get tooltip() {
-      return t("toolbar.table");
-    },
-    hideChevron: true,
-    panelClass: "oasis-editor-toolbar-panel oasis-editor-toolbar-table-panel",
-    keepMounted: true,
-    get children() {
-      return [(() => {
-        var _el$ = _tmpl$$4();
-        insert(_el$, createComponent(Button$1, {
-          icon: "combine",
-          "data-testid": "editor-toolbar-merge-table",
-          get disabled() {
-            return disabled("tableMerge");
-          },
-          onClick: () => api.commands.execute("tableMerge"),
-          get tooltip() {
-            return t("table.mergeTooltip");
-          }
-        }), null);
-        insert(_el$, createComponent(Button$1, {
-          icon: "split",
-          "data-testid": "editor-toolbar-split-table",
-          get disabled() {
-            return disabled("tableSplit");
-          },
-          onClick: () => api.commands.execute("tableSplit"),
-          get tooltip() {
-            return t("table.splitTooltip");
-          }
-        }), null);
-        return _el$;
-      })(), (() => {
-        var _el$2 = _tmpl$$4();
-        insert(_el$2, createComponent(Button$1, {
-          icon: "columns",
-          "data-testid": "editor-toolbar-insert-table-column-before",
-          get disabled() {
-            return disabled("tableInsertColumnBefore");
-          },
-          onClick: () => api.commands.execute("tableInsertColumnBefore"),
-          get tooltip() {
-            return t("table.insertColumnLeft");
-          }
-        }), null);
-        insert(_el$2, createComponent(Button$1, {
-          icon: "columns",
-          "data-testid": "editor-toolbar-insert-table-column-after",
-          get disabled() {
-            return disabled("tableInsertColumnAfter");
-          },
-          onClick: () => api.commands.execute("tableInsertColumnAfter"),
-          get tooltip() {
-            return t("table.insertColumnRight");
-          }
-        }), null);
-        insert(_el$2, createComponent(Button$1, {
-          icon: "trash-2",
-          "data-testid": "editor-toolbar-delete-table-column",
-          get disabled() {
-            return disabled("tableDeleteColumn");
-          },
-          onClick: () => api.commands.execute("tableDeleteColumn"),
-          get tooltip() {
-            return t("table.deleteColumn");
-          }
-        }), null);
-        return _el$2;
-      })(), (() => {
-        var _el$3 = _tmpl$$4();
-        insert(_el$3, createComponent(Button$1, {
-          icon: "rows",
-          "data-testid": "editor-toolbar-insert-table-row-before",
-          get disabled() {
-            return disabled("tableInsertRowBefore");
-          },
-          onClick: () => api.commands.execute("tableInsertRowBefore"),
-          get tooltip() {
-            return t("table.insertRowAbove");
-          }
-        }), null);
-        insert(_el$3, createComponent(Button$1, {
-          icon: "rows",
-          "data-testid": "editor-toolbar-insert-table-row-after",
-          get disabled() {
-            return disabled("tableInsertRowAfter");
-          },
-          onClick: () => api.commands.execute("tableInsertRowAfter"),
-          get tooltip() {
-            return t("table.insertRowBelow");
-          }
-        }), null);
-        insert(_el$3, createComponent(Button$1, {
-          icon: "trash-2",
-          "data-testid": "editor-toolbar-delete-table-row",
-          get disabled() {
-            return disabled("tableDeleteRow");
-          },
-          onClick: () => api.commands.execute("tableDeleteRow"),
-          get tooltip() {
-            return t("table.deleteRow");
-          }
-        }), null);
-        return _el$3;
-      })(), (() => {
-        var _el$4 = _tmpl$$4();
-        insert(_el$4, createComponent(Button$1, {
-          icon: "palette",
-          "data-testid": "editor-toolbar-table-shading",
-          onClick: () => {
-            const color = prompt(t("table.cellBgColorPrompt"), "#f1f5f9");
-            if (color !== null) api.commands.execute("tableCellShading", color);
-          },
-          get tooltip() {
-            return t("table.cellColor");
-          }
-        }), null);
-        insert(_el$4, createComponent(Button$1, {
-          icon: "frame",
-          "data-testid": "editor-toolbar-table-borders",
-          onClick: () => api.commands.execute("tableCellBorders"),
-          get tooltip() {
-            return t("table.applyBorders");
-          }
-        }), null);
-        insert(_el$4, createComponent(Button$1, {
-          icon: "square",
-          "data-testid": "editor-toolbar-table-no-borders",
-          onClick: () => api.commands.execute("tableCellNoBorders"),
-          get tooltip() {
-            return t("table.removeBorders");
-          }
-        }), null);
-        return _el$4;
-      })(), (() => {
-        var _el$5 = _tmpl$$4();
-        insert(_el$5, createComponent(Button$1, {
-          icon: "maximize",
-          "data-testid": "editor-toolbar-table-width-100",
-          onClick: () => api.commands.execute("tableWidth100"),
-          get tooltip() {
-            return t("table.width100Tooltip");
-          }
-        }));
-        return _el$5;
-      })(), (() => {
-        var _el$6 = _tmpl$$4();
-        insert(_el$6, createComponent(Button$1, {
-          icon: "align-left",
-          "data-testid": "editor-toolbar-table-align-left",
-          onClick: () => api.commands.execute("tableAlignLeft"),
-          get tooltip() {
-            return t("table.alignLeft");
-          }
-        }), null);
-        insert(_el$6, createComponent(Button$1, {
-          icon: "align-center",
-          "data-testid": "editor-toolbar-table-align-center",
-          onClick: () => api.commands.execute("tableAlignCenter"),
-          get tooltip() {
-            return t("table.alignCenter");
-          }
-        }), null);
-        insert(_el$6, createComponent(Button$1, {
-          icon: "align-right",
-          "data-testid": "editor-toolbar-table-align-right",
-          onClick: () => api.commands.execute("tableAlignRight"),
-          get tooltip() {
-            return t("table.alignRight");
-          }
-        }), null);
-        insert(_el$6, createComponent(Button$1, {
-          icon: "move-horizontal",
-          "data-testid": "editor-toolbar-table-cell-width",
-          onClick: () => {
-            const width = prompt(t("table.cellWidthPrompt"));
-            if (width) api.commands.execute("tableSetCellWidth", width);
-          },
-          get tooltip() {
-            return t("table.cellWidth");
-          }
-        }), null);
-        return _el$6;
-      })(), createComponent(Show, {
-        get when() {
-          return selectionLabel();
-        },
-        children: (label) => (() => {
-          var _el$7 = _tmpl$2$2();
-          insert(_el$7, label);
-          return _el$7;
-        })()
-      })];
-    }
-  });
-}
 var _tmpl$$3 = /* @__PURE__ */ template(`<div class="oasis-editor-toolbar-panel-section oasis-editor-toolbar-panel-actions">`);
 function SectionGroup(props) {
   const t = useI18n();
@@ -43253,6 +43203,7 @@ function ShapeGallery(props) {
 delegateEvents(["click"]);
 const mod = /Mac/i.test(navigator.userAgent) ? "⌘" : "Ctrl";
 const documentStyles = (api) => api.commands.state("documentStyles").value ?? [];
+const tableStyleOptions = (api) => documentStyles(api).filter((s) => s.type === "table").map((s) => ({ value: s.id, label: s.name }));
 const fontFamilyOptions = (api) => {
   const values = /* @__PURE__ */ new Set([
     "Arial",
@@ -43324,6 +43275,112 @@ const LIST_BUTTONS = [
     tooltipKey: "toolbar.numberedList"
   }
 ];
+const TABLE_LAYOUT_BUTTONS = [
+  {
+    id: "editor-toolbar-tbl-insert-row-above",
+    command: "tableInsertRowBefore",
+    icon: "rows",
+    tooltipKey: "table.insertRowAbove"
+  },
+  {
+    id: "editor-toolbar-tbl-insert-row-below",
+    command: "tableInsertRowAfter",
+    icon: "rows",
+    tooltipKey: "table.insertRowBelow"
+  },
+  {
+    id: "editor-toolbar-tbl-delete-row",
+    command: "tableDeleteRow",
+    icon: "trash-2",
+    tooltipKey: "table.deleteRow"
+  },
+  {
+    id: "editor-toolbar-tbl-insert-col-left",
+    command: "tableInsertColumnBefore",
+    icon: "columns",
+    tooltipKey: "table.insertColumnLeft"
+  },
+  {
+    id: "editor-toolbar-tbl-insert-col-right",
+    command: "tableInsertColumnAfter",
+    icon: "columns",
+    tooltipKey: "table.insertColumnRight"
+  },
+  {
+    id: "editor-toolbar-tbl-delete-col",
+    command: "tableDeleteColumn",
+    icon: "trash-2",
+    tooltipKey: "table.deleteColumn"
+  },
+  {
+    id: "editor-toolbar-tbl-merge",
+    command: "tableMerge",
+    icon: "combine",
+    tooltipKey: "table.mergeTooltip"
+  },
+  {
+    id: "editor-toolbar-tbl-split",
+    command: "tableSplit",
+    icon: "split",
+    tooltipKey: "table.splitTooltip"
+  },
+  {
+    id: "editor-toolbar-tbl-width-100",
+    command: "tableWidth100",
+    icon: "maximize",
+    tooltipKey: "table.width100Tooltip"
+  },
+  {
+    id: "editor-toolbar-tbl-align-left",
+    command: "tableAlignLeft",
+    icon: "align-left",
+    tooltipKey: "table.alignLeft"
+  },
+  {
+    id: "editor-toolbar-tbl-align-center",
+    command: "tableAlignCenter",
+    icon: "align-center",
+    tooltipKey: "table.alignCenter"
+  },
+  {
+    id: "editor-toolbar-tbl-align-right",
+    command: "tableAlignRight",
+    icon: "align-right",
+    tooltipKey: "table.alignRight"
+  }
+];
+const TABLE_DESIGN_TOGGLES = [
+  {
+    id: "editor-toolbar-tbl-header-row",
+    command: "tableToggleHeaderRow",
+    labelKey: "table.headerRow"
+  },
+  {
+    id: "editor-toolbar-tbl-total-row",
+    command: "tableToggleTotalRow",
+    labelKey: "table.totalRow"
+  },
+  {
+    id: "editor-toolbar-tbl-banded-rows",
+    command: "tableToggleBandedRows",
+    labelKey: "table.bandedRows"
+  },
+  {
+    id: "editor-toolbar-tbl-first-col",
+    command: "tableToggleFirstColumn",
+    labelKey: "table.firstColumn"
+  },
+  {
+    id: "editor-toolbar-tbl-last-col",
+    command: "tableToggleLastColumn",
+    labelKey: "table.lastColumn"
+  },
+  {
+    id: "editor-toolbar-tbl-banded-cols",
+    command: "tableToggleBandedColumns",
+    labelKey: "table.bandedColumns"
+  }
+];
 const RIBBON_PLACEMENTS = {
   "editor-toolbar-file-dropdown": { tab: "file", group: "document", row: 1 },
   "sep-file": { tab: "file", group: "document", row: 1 },
@@ -43391,8 +43448,123 @@ const RIBBON_PLACEMENTS = {
   "sep-paragraph": { tab: "home", group: "paragraph", row: 2 },
   "editor-toolbar-metrics": { tab: "layout", group: "paragraph", row: 1 },
   "sep-metrics": { tab: "layout", group: "paragraph", row: 2 },
-  "editor-toolbar-table": { tab: "layout", group: "table", row: 1 },
-  "sep-table": { tab: "layout", group: "table", row: 2 },
+  "editor-toolbar-tbl-insert-row-above": {
+    tab: "tableLayout",
+    group: "rowsColumns",
+    row: 1
+  },
+  "editor-toolbar-tbl-insert-row-below": {
+    tab: "tableLayout",
+    group: "rowsColumns",
+    row: 1
+  },
+  "editor-toolbar-tbl-delete-row": {
+    tab: "tableLayout",
+    group: "rowsColumns",
+    row: 1
+  },
+  "editor-toolbar-tbl-insert-col-left": {
+    tab: "tableLayout",
+    group: "rowsColumns",
+    row: 2
+  },
+  "editor-toolbar-tbl-insert-col-right": {
+    tab: "tableLayout",
+    group: "rowsColumns",
+    row: 2
+  },
+  "editor-toolbar-tbl-delete-col": {
+    tab: "tableLayout",
+    group: "rowsColumns",
+    row: 2
+  },
+  "editor-toolbar-tbl-merge": { tab: "tableLayout", group: "merge", row: 1 },
+  "editor-toolbar-tbl-split": { tab: "tableLayout", group: "merge", row: 2 },
+  "editor-toolbar-tbl-width-100": {
+    tab: "tableLayout",
+    group: "cellSize",
+    row: 1
+  },
+  "editor-toolbar-tbl-align-left": {
+    tab: "tableLayout",
+    group: "alignment",
+    row: 1
+  },
+  "editor-toolbar-tbl-align-center": {
+    tab: "tableLayout",
+    group: "alignment",
+    row: 1
+  },
+  "editor-toolbar-tbl-align-right": {
+    tab: "tableLayout",
+    group: "alignment",
+    row: 1
+  },
+  "editor-toolbar-tbl-header-row": {
+    tab: "tableDesign",
+    group: "tableStyleOptions",
+    row: 1
+  },
+  "editor-toolbar-tbl-total-row": {
+    tab: "tableDesign",
+    group: "tableStyleOptions",
+    row: 1
+  },
+  "editor-toolbar-tbl-banded-rows": {
+    tab: "tableDesign",
+    group: "tableStyleOptions",
+    row: 1
+  },
+  "editor-toolbar-tbl-first-col": {
+    tab: "tableDesign",
+    group: "tableStyleOptions",
+    row: 2
+  },
+  "editor-toolbar-tbl-last-col": {
+    tab: "tableDesign",
+    group: "tableStyleOptions",
+    row: 2
+  },
+  "editor-toolbar-tbl-banded-cols": {
+    tab: "tableDesign",
+    group: "tableStyleOptions",
+    row: 2
+  },
+  "editor-toolbar-tbl-shading": {
+    tab: "tableDesign",
+    group: "borders",
+    row: 1
+  },
+  "editor-toolbar-tbl-borders": {
+    tab: "tableDesign",
+    group: "borders",
+    row: 2
+  },
+  "editor-toolbar-tbl-no-borders": {
+    tab: "tableDesign",
+    group: "borders",
+    row: 2
+  },
+  "editor-toolbar-tbl-style": {
+    tab: "tableDesign",
+    group: "tableStyles",
+    row: 1
+  },
+  "editor-toolbar-tbl-distribute-rows": {
+    tab: "tableLayout",
+    group: "cellSize",
+    row: 1
+  },
+  "editor-toolbar-tbl-distribute-cols": {
+    tab: "tableLayout",
+    group: "cellSize",
+    row: 1
+  },
+  "editor-toolbar-tbl-autofit": {
+    tab: "tableLayout",
+    group: "cellSize",
+    row: 2
+  },
   "editor-toolbar-margins": { tab: "layout", group: "section", row: 1 },
   "editor-toolbar-section": { tab: "layout", group: "section", row: 1 }
 };
@@ -43832,16 +44004,85 @@ function createDefaultToolbarPreset(t) {
     render: (api) => MetricGroup({ api })
   });
   items.push({ type: "separator", id: "sep-metrics" });
+  for (const spec of TABLE_LAYOUT_BUTTONS) {
+    items.push({
+      type: "button",
+      id: spec.id,
+      testId: spec.id,
+      iconName: spec.icon,
+      command: spec.command,
+      tooltipKey: spec.tooltipKey
+    });
+  }
+  for (const spec of TABLE_DESIGN_TOGGLES) {
+    items.push({
+      type: "toggle",
+      id: spec.id,
+      testId: spec.id,
+      command: spec.command,
+      labelKey: spec.labelKey,
+      tooltipKey: spec.labelKey
+    });
+  }
   items.push({
-    type: "custom",
-    id: "editor-toolbar-table",
-    isVisible: (api) => api.commands.state("tableContext").isActive,
-    render: (api) => TableGroup({ api })
+    type: "colorPicker",
+    id: "editor-toolbar-tbl-shading",
+    testId: "editor-toolbar-tbl-shading",
+    kind: "shading",
+    command: "tableCellShading",
+    defaultValue: "#f1f5f9",
+    tooltipKey: "table.cellColor"
+  });
+  items.push({
+    type: "button",
+    id: "editor-toolbar-tbl-borders",
+    testId: "editor-toolbar-tbl-borders",
+    iconName: "frame",
+    command: "tableCellBorders",
+    tooltipKey: "table.applyBorders"
   });
   items.push({
-    type: "separator",
-    id: "sep-table",
-    isVisible: (api) => api.commands.state("tableContext").isActive
+    type: "button",
+    id: "editor-toolbar-tbl-no-borders",
+    testId: "editor-toolbar-tbl-no-borders",
+    iconName: "square",
+    command: "tableCellNoBorders",
+    tooltipKey: "table.removeBorders"
+  });
+  items.push({
+    type: "select",
+    id: "editor-toolbar-tbl-style",
+    testId: "editor-toolbar-tbl-style",
+    tooltipKey: "table.tableStyle",
+    placeholder: t("table.tableStyle"),
+    width: "wide",
+    command: "setTableStyle",
+    options: tableStyleOptions
+  });
+  items.push({
+    type: "button",
+    id: "editor-toolbar-tbl-distribute-rows",
+    testId: "editor-toolbar-tbl-distribute-rows",
+    iconName: "rows",
+    command: "tableDistributeRows",
+    tooltipKey: "table.distributeRows"
+  });
+  items.push({
+    type: "button",
+    id: "editor-toolbar-tbl-distribute-cols",
+    testId: "editor-toolbar-tbl-distribute-cols",
+    iconName: "columns",
+    command: "tableDistributeColumns",
+    tooltipKey: "table.distributeColumns"
+  });
+  items.push({
+    type: "toggle",
+    id: "editor-toolbar-tbl-autofit",
+    testId: "editor-toolbar-tbl-autofit",
+    iconName: "move-horizontal",
+    command: "tableToggleAutoFit",
+    labelKey: "table.autoFit",
+    tooltipKey: "table.autoFit"
   });
   items.push({
     type: "custom",
@@ -43895,7 +44136,6 @@ const OASIS_TOOLBAR_ITEMS = {
   specialIndent: "editor-toolbar-special-indent",
   lineSpacing: "editor-toolbar-line-spacing-control",
   metrics: "editor-toolbar-metrics",
-  table: "editor-toolbar-table",
   margins: "editor-toolbar-margins",
   section: "editor-toolbar-section"
 };
@@ -44008,8 +44248,8 @@ export {
   Show as ac,
   createRenderEffect as ad,
   style as ae,
-  setAttribute as af,
-  setStyleProperty as ag,
+  setStyleProperty as af,
+  setAttribute as ag,
   memo as ah,
   template as ai,
   Button as aj,