quill-table-up 3.3.0 → 3.3.2

package/dist/table-creator.css

@@ -1 +1 @@
-.table-up-input__item{--input-height:2rem;--input-inner-height:calc(var(--input-height) - 0.125rem);--input-color-text:#606266;--input-color-boxshaow:#dcdfe6;--input-color-focus:#409eff;--input-color-error:#f56c6c;--input-boxshaow:0 0 0 0.0625rem var(--input-color-boxshaow) inset;--input-boxshaow-focus:0 0 0 0.0625rem var(--input-color-focus) inset;--input-boxshaow-error:0 0 0 0.0625rem var(--input-color-error) inset;display:flex;align-items:center}.table-up-input__item+.table-up-input__item{margin-top:1.125rem}.table-up-input__label{width:5rem;flex-shrink:0}.table-up-input__input{box-sizing:border-box;position:relative;display:flex;flex-wrap:wrap;width:100%;height:var(--input-height);line-height:var(--input-height);padding:.0625rem .5rem;border-radius:.25rem;box-shadow:var(--input-boxshaow);transition:box-shadow .2s linear}.table-up-input__input.focus{box-shadow:var(--input-boxshaow-focus)}.table-up-input__input input{width:100%;height:var(--input-inner-height);line-height:var(--input-inner-height);flex-grow:1;font-size:.875rem;color:var(--input-color-text);outline:0;border:0;padding:0}.table-up-input__input.error{box-shadow:var(--input-boxshaow-error)}.table-up-input__error-tip{position:absolute;top:100%;left:0;font-size:.75rem;color:var(--input-color-error);line-height:1rem}.ql-snow .table-up-select-box{--select-box-color-bg-hover:#f5f5f5;--select-box-color-bg-active:#e0f2fe;--select-box-custom-color-text:#0d0d0d;--select-box-custom-color-bg:transparent;--select-box-custom-color-bg-hover:#ebebeb}.table-up-select-box{--select-box-color-border:#e5e7eb;--select-box-border:0.0625rem solid var(--select-box-color-border);--select-box-color-active:#0ea5e9;--select-box-color-bg-hover:#f5f5f5;--select-box-color-bg-active:transparent;--select-box-custom-color-text:#f5f5f5;--select-box-custom-color-bg:transparent;--select-box-custom-color-bg-hover:#2c2c2c}.table-up-select-box__block{display:flex;width:10rem;flex-wrap:wrap;align-items:center;justify-content:center}.table-up-select-box__item{margin:.125rem;height:1rem;width:1rem;border:var(--select-box-border);cursor:pointer}.table-up-select-box__item.active{border-color:var(--select-box-color-active);background-color:var(--select-box-color-bg-active)}.table-up-select-box__custom{padding:.5rem;color:var(--select-box-custom-color-text);background-color:var(--select-box-custom-color-bg);font-size:1rem;text-align:center;cursor:pointer}.table-up-select-box__custom:hover{background-color:var(--select-box-custom-color-bg-hover)}.table-up-creator{padding:1.5rem}.table-up-creator__input{display:flex;flex-direction:column;width:100%}.table-up-creator__control{margin-top:1rem;text-align:right}.table-up-creator__checkbox{--check-color:#212121;--checked-color:#506eec;display:flex;align-items:center;margin-top:.25rem;cursor:pointer;font-size:.75rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.table-up-creator__checkbox input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1.125rem;height:1.125rem;border:.0625rem solid var(--check-color);border-radius:.3125rem;background-color:transparent;display:inline-block;position:relative;margin-right:.625rem;cursor:pointer}.table-up-creator__checkbox input:before{content:'';background-color:var(--checked-color);display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:.625rem;height:.625rem;border-radius:.1875rem;transition:all .2s ease-in-out}.table-up-creator__checkbox input:checked:before{transform:translate(-50%,-50%) scale(1)}
+.table-up-input__item{--input-height:2rem;--input-inner-height:calc(var(--input-height) - 0.125rem);--input-color-text:#606266;--input-color-boxshaow:#dcdfe6;--input-color-focus:#409eff;--input-color-error:#f56c6c;--input-boxshaow:0 0 0 0.0625rem var(--input-color-boxshaow) inset;--input-boxshaow-focus:0 0 0 0.0625rem var(--input-color-focus) inset;--input-boxshaow-error:0 0 0 0.0625rem var(--input-color-error) inset;display:flex;align-items:center}.table-up-input__item+.table-up-input__item{margin-top:1.125rem}.table-up-input__label{width:5rem;flex-shrink:0}.table-up-input__input{box-sizing:border-box;position:relative;display:flex;flex-wrap:wrap;width:100%;height:var(--input-height);line-height:var(--input-height);padding:.0625rem .5rem;border-radius:.25rem;box-shadow:var(--input-boxshaow);transition:box-shadow .2s linear}.table-up-input__input.focus{box-shadow:var(--input-boxshaow-focus)}.table-up-input__input input{width:100%;height:var(--input-inner-height);line-height:var(--input-inner-height);flex-grow:1;font-size:.875rem;color:var(--input-color-text);outline:0;border:0;padding:0}.table-up-input__input.error{box-shadow:var(--input-boxshaow-error)}.table-up-input__error-tip{position:absolute;top:100%;left:0;font-size:.75rem;color:var(--input-color-error);line-height:1rem}.ql-snow .table-up-select-box{--select-box-color-bg-hover:#f5f5f5;--select-box-color-bg-active:#e0f2fe;--select-box-custom-color-text:#0d0d0d;--select-box-custom-color-bg:transparent;--select-box-custom-color-bg-hover:#ebebeb}.table-up-select-box{--select-box-color-border:#e5e7eb;--select-box-border:0.0625rem solid var(--select-box-color-border);--select-box-color-active:#0ea5e9;--select-box-color-bg-hover:#f5f5f5;--select-box-color-bg-active:transparent;--select-box-custom-color-text:#f5f5f5;--select-box-custom-color-bg:transparent;--select-box-custom-color-bg-hover:#2c2c2c;display:block}.table-up-select-box__block{display:inline-flex;width:10rem;flex-wrap:wrap;align-items:center;justify-content:center}.table-up-select-box__item{display:inline-block;margin:.125rem;height:1rem;width:1rem;border:var(--select-box-border);cursor:pointer}.table-up-select-box__item.active{border-color:var(--select-box-color-active);background-color:var(--select-box-color-bg-active)}.table-up-select-box__custom{display:block;padding:.5rem;color:var(--select-box-custom-color-text);background-color:var(--select-box-custom-color-bg);font-size:1rem;text-align:center;cursor:pointer}.table-up-select-box__custom:hover{background-color:var(--select-box-custom-color-bg-hover)}.table-up-creator{padding:1.5rem}.table-up-creator__input{display:flex;flex-direction:column;width:100%}.table-up-creator__control{margin-top:1rem;text-align:right}.table-up-creator__checkbox{--check-color:#212121;--checked-color:#506eec;display:flex;align-items:center;margin-top:.25rem;cursor:pointer;font-size:.75rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.table-up-creator__checkbox input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1.125rem;height:1.125rem;border:.0625rem solid var(--check-color);border-radius:.3125rem;background-color:transparent;display:inline-block;position:relative;margin-right:.625rem;cursor:pointer}.table-up-creator__checkbox input:before{content:'';background-color:var(--checked-color);display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:.625rem;height:.625rem;border-radius:.1875rem;transition:all .2s ease-in-out}.table-up-creator__checkbox input:checked:before{transform:translate(-50%,-50%) scale(1)}

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "quill-table-up",
   "type": "module",
-  "version": "3.3.0",
-  "packageManager": "pnpm@10.28.1",
+  "version": "3.3.2",
+  "packageManager": "pnpm@10.28.2",
   "description": "A table module for quill2.x",
   "author": "zzxming",
   "license": "MIT",
@@ -41,12 +41,12 @@
     "quill": "^2.0.3"
   },
   "dependencies": {
-    "@floating-ui/dom": "^1.7.4"
+    "@floating-ui/dom": "^1.7.5"
   },
   "devDependencies": {
-    "@babel/preset-env": "^7.28.6",
-    "@oxc-project/runtime": "^0.110.0",
-    "@playwright/test": "^1.58.0",
+    "@babel/preset-env": "^7.29.0",
+    "@oxc-project/runtime": "^0.112.0",
+    "@playwright/test": "^1.58.2",
     "@prettier/plugin-xml": "^3.4.2",
     "@rollup/plugin-babel": "^6.1.0",
     "@rollup/plugin-typescript": "^12.3.0",
@@ -54,26 +54,26 @@
     "@types/gulp-clean-css": "^4.3.4",
     "@types/gulp-less": "^0.0.36",
     "@types/gulp-postcss": "^8.0.6",
-    "@types/node": "^25.0.10",
+    "@types/node": "^25.2.1",
     "@types/postcss-pxtorem": "^6.1.0",
     "@types/ws": "^8.18.1",
-    "@typescript-eslint/eslint-plugin": "^8.53.1",
-    "@typescript-eslint/parser": "^8.53.1",
+    "@typescript-eslint/eslint-plugin": "^8.54.0",
+    "@typescript-eslint/parser": "^8.54.0",
     "@vitest/coverage-v8": "^4.0.18",
     "@vitest/ui": "^4.0.18",
-    "@zzxming/eslint-config": "0.6.2",
-    "autoprefixer": "^10.4.23",
-    "eslint": "^9.39.2",
+    "@zzxming/eslint-config": "0.6.3",
+    "autoprefixer": "^10.4.24",
+    "eslint": "^10.0.0",
     "gulp": "^5.0.1",
     "gulp-clean-css": "^4.3.0",
     "gulp-less": "^5.0.0",
     "gulp-postcss": "^10.0.0",
-    "jsdom": "^27.4.0",
+    "jsdom": "^28.0.0",
     "open": "^11.0.0",
     "parchment": "^3.0.0",
     "postcss-pxtorem": "^6.1.0",
     "resize-observer-polyfill": "^1.5.1",
-    "tsdown": "^0.19.0",
+    "tsdown": "^0.20.3",
     "tslib": "^2.8.1",
     "tsx": "^4.21.0",
     "typescript": "~5.9.3",

package/src/__tests__/e2e/table-resize.test.ts

@@ -166,7 +166,7 @@ extendTest('TableResize on full width should not outer 100%', async ({ page, edi
   for (let i = 0; i < colCount; i++) {
     width += Number.parseFloat((await cols.nth(i).getAttribute('width'))!);
   }
-  expect(width).toBeCloseTo(100, 3);
+  expect(width).toBeCloseTo(100, 2);
 });
 
 extendTest.describe('TableResizeScale functional', () => {

package/src/__tests__/unit/table-cell-merge.test.ts

@@ -28,7 +28,7 @@ describe('merge and split cell', () => {
         <div>
           <table cellpadding="0" cellspacing="0" data-full="true">
             <colgroup data-full="true">
-              ${new Array(3).fill(0).map(() => `<col width="${1 / 3 * 100}%" data-full="true" />`).join('\n')}
+              ${new Array(3).fill(0).map(() => `<col width="33.3333%" data-full="true" />`).join('\n')}
             </colgroup>
             <tbody>
               <tr>
@@ -113,9 +113,9 @@ describe('merge and split cell', () => {
         <div>
           <table cellpadding="0" cellspacing="0" data-full="true">
             <colgroup data-full="true">
-              ${new Array(4).fill(0).map(() => `<col width="${1 / 7 * 100}%" data-full="true" />`).join('\n')}
-              <col width="${2 / 7 * 100}%" data-full="true" />
-              <col width="${1 / 7 * 100}%" data-full="true" />
+              ${new Array(4).fill(0).map(() => `<col width="14.2857%" data-full="true" />`).join('\n')}
+              <col width="28.5714%" data-full="true" />
+              <col width="14.2857%" data-full="true" />
             </colgroup>
             <tbody>
               <tr>
@@ -178,7 +178,7 @@ describe('merge and split cell', () => {
         <div>
           <table cellpadding="0" cellspacing="0" data-full="true">
             <colgroup data-full="true">
-              ${new Array(3).fill(0).map(() => `<col width="${1 / 3 * 100}%" data-full="true" />`).join('\n')}
+              ${new Array(3).fill(0).map(() => `<col width="33.3333%" data-full="true" />`).join('\n')}
             </colgroup>
             <tbody>
               <tr>

package/src/__tests__/unit/table-redo-undo.test.ts

@@ -122,7 +122,7 @@ describe('table undo', () => {
         <div>
           <table cellpadding="0" cellspacing="0" data-full="true">
             <colgroup data-full="true">
-              ${new Array(3).fill(0).map((_, i) => `<col width="${1 / 3 * 100}%" data-col-id="${i + 1}" data-full="true" />`).join('\n')}
+              ${new Array(3).fill(0).map((_, i) => `<col width="33.3333%" data-col-id="${i + 1}" data-full="true" />`).join('\n')}
             </colgroup>
             <tbody>
               <tr data-row-id="1">

package/src/__tests__/unit/table-remove.test.ts

@@ -25,7 +25,7 @@ describe('remove column from table', () => {
         <div>
           <table cellpadding="0" cellspacing="0" data-full="true">
             <colgroup data-full="true">
-              <col width="${1 / 3 * 100 * 3}%" data-full="true" />
+              <col width="99.9999%" data-full="true" />
             </colgroup>
             <tbody>
               ${
@@ -144,7 +144,7 @@ describe('remove row from table', () => {
         <div>
           <table cellpadding="0" cellspacing="0" data-full="true">
             <colgroup data-full="true">
-              ${new Array(3).fill(0).map(() => `<col width="${1 / 3 * 100}%" data-full="true" />`).join('\n')}
+              ${new Array(3).fill(0).map(() => `<col width="33.3333%" data-full="true" />`).join('\n')}
             </colgroup>
             <tbody>
               <tr>
@@ -175,7 +175,7 @@ describe('remove row from table', () => {
         <div>
           <table cellpadding="0" cellspacing="0" data-full="true">
             <colgroup data-full="true">
-              ${new Array(3).fill(0).map(() => `<col width="${1 / 3 * 100}%" data-full="true" />`).join('\n')}
+              ${new Array(3).fill(0).map(() => `<col width="33.3333%" data-full="true" />`).join('\n')}
             </colgroup>
             <tbody>
               <tr>

package/src/__tests__/unit/utils.ts

@@ -168,7 +168,7 @@ export function getColWidthStyle(options: Required<Omit<ColOptions, 'align' | 't
   const { full, width, colNum } = options;
   let colWidth = `${width}px`;
   if (full) {
-    colWidth = `${1 / colNum * 100}%`;
+    colWidth = `${Math.trunc(1 / colNum * 100 * 10_000) / 10_000}%`;
   }
   return `width="${colWidth}"`;
 }
@@ -187,7 +187,7 @@ export function createTableDeltaOps(row: number, col: number, colOptions?: ColOp
     );
   }
   for (const [i, _] of new Array(col).fill(0).entries()) {
-    const value: TableColDeltaValue = { tableId, colId: `${i + 1}`, width: 1 / col * 100, full };
+    const value: TableColDeltaValue = { tableId, colId: `${i + 1}`, width: Math.trunc(1 / col * 100 * 10_000) / 10_000, full };
     if (!full) {
       value.width = width;
     }

package/src/formats/table-col-format.ts

@@ -15,6 +15,9 @@ export class TableColFormat extends BlockEmbed {
     if (Number.isNaN(widthNumber)) {
       widthNumber = tableUpSize[full ? 'colMinWidthPre' : 'colMinWidthPx'];
     }
+    if (full) {
+      widthNumber = Math.trunc(widthNumber * 10_000) / 10_000;
+    }
     return `${widthNumber}${full ? '%' : 'px'}`;
   }
 

package/src/node_modules/.vite/vitest/da39a3ee5e6b4b0d3255bfef95601890afd80709/results.json

@@ -0,0 +1 @@
+{"version":"4.0.18","results":[[":__tests__/unit/utils.test-d.ts",{"duration":0,"failed":false}],[":__tests__/unit/table-insert.test.ts",{"duration":18173.0784,"failed":false}],[":__tests__/unit/table-clipboard.test.ts",{"duration":22002.459899999998,"failed":false}],[":__tests__/unit/table-blots.test.ts",{"duration":10285.912399999997,"failed":false}],[":__tests__/unit/table-cell-merge.test.ts",{"duration":12967.189000000002,"failed":false}],[":__tests__/unit/utils.test.ts",{"duration":3874.055199999999,"failed":false}],[":__tests__/unit/table-hack.test.ts",{"duration":9750.4833,"failed":false}],[":__tests__/unit/table-redo-undo.test.ts",{"duration":32718.328999999998,"failed":false}],[":__tests__/unit/table-caption.test.ts",{"duration":3572.148699999998,"failed":false}],[":__tests__/unit/table-remove.test.ts",{"duration":6382.709699999998,"failed":false}],[":__tests__/unit/table-contenteditable.test.ts",{"duration":1995.755299999999,"failed":false}]]}

package/src/style/select-box.less

@@ -20,14 +20,17 @@
   .setCssVar(select-box-custom-color-bg, transparent);
   .setCssVar(select-box-custom-color-bg-hover, rgb(44, 44, 44));
 
+  display: block;
+
   &__block {
-    display: flex;
+    display: inline-flex;
     width: 160px;
     flex-wrap: wrap;
     align-items: center;
     justify-content: center;
   }
   &__item {
+    display: inline-block;
     margin: 2px;
     height: 16px;
     width: 16px;
@@ -39,6 +42,7 @@
     }
   }
   &__custom {
+    display: block;
     padding: 8px;
     color: .getCssVar(select-box-custom-color-text) [];
     background-color: .getCssVar(select-box-custom-color-bg) [];

package/src/table-up.ts

@@ -655,7 +655,7 @@ export class TableUp {
 
   async buildCustomSelect(customSelect: ((module: TableUp, picker: QuillThemePicker) => HTMLElement | Promise<HTMLElement>) | undefined, picker: QuillThemePicker) {
     if (!customSelect || !isFunction(customSelect)) return;
-    const dom = document.createElement('div');
+    const dom = document.createElement('span');
     dom.classList.add('ql-custom-select');
     this.selector = await customSelect(this, picker);
     dom.appendChild(this.selector);

package/src/utils/components/table/select-box.ts

@@ -11,14 +11,14 @@ interface TableSelectOptions {
 }
 export function createSelectBox(options: Partial<TableSelectOptions> = {}) {
   const bem = createBEM('select-box');
-  const selectDom = document.createElement('div');
+  const selectDom = document.createElement('span');
   selectDom.classList.add(bem.b());
 
-  const selectBlock = document.createElement('div');
+  const selectBlock = document.createElement('span');
   selectBlock.classList.add(bem.be('block'));
   for (let r = 0; r < (options.row || 8); r++) {
     for (let c = 0; c < (options.col || 8); c++) {
-      const selectItem = document.createElement('div');
+      const selectItem = document.createElement('span');
       selectItem.classList.add(bem.be('item'));
       selectItem.dataset.row = String(r + 1);
       selectItem.dataset.col = String(c + 1);
@@ -62,7 +62,7 @@ export function createSelectBox(options: Partial<TableSelectOptions> = {}) {
 
   if (options.customBtn) {
     const texts = options.texts || {};
-    const selectCustom = document.createElement('div');
+    const selectCustom = document.createElement('span');
     selectCustom.classList.add(bem.be('custom'));
     selectCustom.textContent = texts.customBtnText || 'Custom';
     selectCustom.addEventListener('click', async () => {