{"id":13535647,"url":"https://github.com/soccerloway/quill-better-table","last_synced_at":"2025-12-29T23:41:11.662Z","repository":{"id":41132263,"uuid":"177814263","full_name":"soccerloway/quill-better-table","owner":"soccerloway","description":"Module for better table in Quill, more useful features are supported.","archived":false,"fork":false,"pushed_at":"2024-07-09T03:40:43.000Z","size":309,"stargazers_count":331,"open_issues_count":60,"forks_count":122,"subscribers_count":10,"default_branch":"master","last_synced_at":"2025-03-29T15:05:41.240Z","etag":null,"topics":["javascript","quill","quill-better-table","quill-table","quilljs","quilljs-table","table"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/soccerloway.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-03-26T15:14:35.000Z","updated_at":"2025-03-14T19:14:33.000Z","dependencies_parsed_at":"2024-11-03T00:31:23.415Z","dependency_job_id":"3788e5e0-42e4-4c43-8c00-0b274d334d93","html_url":"https://github.com/soccerloway/quill-better-table","commit_stats":{"total_commits":128,"total_committers":7,"mean_commits":"18.285714285714285","dds":0.40625,"last_synced_commit":"4e2d47d35c376169321bad7ab5d648616f1c8053"},"previous_names":[],"tags_count":27,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/soccerloway%2Fquill-better-table","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/soccerloway%2Fquill-better-table/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/soccerloway%2Fquill-better-table/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/soccerloway%2Fquill-better-table/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/soccerloway","download_url":"https://codeload.github.com/soccerloway/quill-better-table/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246743545,"owners_count":20826551,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","quill","quill-better-table","quill-table","quilljs","quilljs-table","table"],"created_at":"2024-08-01T09:00:20.088Z","updated_at":"2025-12-29T23:41:11.621Z","avatar_url":"https://github.com/soccerloway.png","language":"JavaScript","funding_links":[],"categories":["Uncategorized"],"sub_categories":["Uncategorized"],"readme":"# quill-better-table\nA module for better table in Quill, more useful features are supported. There is a list of features below. Thanks [quilljs](https://quilljs.com/) for its awesome extensibility. Hope that quill-better-table could help you.\n\n# Online Demo\n[quill-better-table Codepen Demo](https://codepen.io/soccerloway/pen/WWJowj)\n\n# Updated v1.2.10\n\u003cul\u003e\n  \u003cli\u003e\n    \u003cp\u003eReplace TableCellLine.tagName from `DIV` to `P`. Using `DIV` to implement TableCellLine led a copy/paste issue: \u003ca href=\"https://github.com/soccerloway/quill-better-table/issues/50\"\u003ePasting plain text also changes to table format\u003c/a\u003e. There are many more similar situations. When the user pastes the DIV tag into the editor, the DIV will be treated as a TableCellLine. Using `P` is more appropriate and fixes the mentioned issue. If this update caused any other new issues, tell me as soon as possible please, thanks！ Best wishes.\u003c/p\u003e\n  \u003c/li\u003e\n\u003c/ul\u003e\n\n# Features\nClicking on tables in quill editor will initialize the tools for table, all features are based on it.\n\n\u003cul\u003e\n  \u003cli\u003e\n    \u003ch3\u003eMultiple lines in table cell\u003c/h3\u003e\n    \u003cp\u003ePress Enter to add new lines in the table cell now.\u003c/p\u003e\n  \u003c/li\u003e\n  \u003cli\u003e\n    \u003ch3\u003eAdd table column left/right\u003c/h3\u003e\n    \u003cp\u003eRight-click on table to open context menu, you can see the button.\u003c/p\u003e\n  \u003c/li\u003e\n  \u003cli\u003e\n    \u003ch3\u003eAdd table row top/bottom\u003c/h3\u003e\n    \u003cp\u003eRight-click on table to open context menu, you can see the button.\u003c/p\u003e\n  \u003c/li\u003e\n  \u003cli\u003e\n    \u003ch3\u003eRemove selected table columns\u003c/h3\u003e\n    \u003cp\u003eRight-click on table to open context menu, you can see the button.\u003c/p\u003e\n  \u003c/li\u003e\n  \u003cli\u003e\n    \u003ch3\u003eRemove selected table rows\u003c/h3\u003e\n    \u003cp\u003eRight-click on table to open context menu, you can see the button.\u003c/p\u003e\n  \u003c/li\u003e\n  \u003cli\u003e\n    \u003ch3\u003eSelects multiple table cells\u003c/h3\u003e\n    \u003cp\u003eDragging over the table cells could select the tableCells surrounded by the highlight borders.\u003c/p\u003e\n  \u003c/li\u003e\n  \u003cli\u003e\n    \u003ch3\u003eMerge/Unmerge table cells\u003c/h3\u003e\n    \u003cp\u003eRight-click on table to open context menu, you can see the button.\u003c/p\u003e\n  \u003c/li\u003e\n  \u003cli\u003e\n    \u003ch3\u003eResize the width of column\u003c/h3\u003e\n    \u003cp\u003eDragging lines between the top tool for columns could resize width of columns.\u003c/p\u003e\n  \u003c/li\u003e\n  \u003cli\u003e\n    \u003ch3\u003eDelete table\u003c/h3\u003e\n    \u003cp\u003eRight-click on table to open context menu, you can see the button.\u003c/p\u003e\n  \u003c/li\u003e\n\u003c/ul\u003e\n\n# Requirements\n[quilljs](https://github.com/quilljs/quill) v2.0.0-dev.3\n\nSince I use webpack externals to bundle, you must expose `Quill` to window object, like load quill.js by script tag globally. Or you may need to fork this repo and build what you need.\n\n# Installation\n```\nnpm install quill-better-table\n```\n\n# Usage\nLoad quill and style dependencies\n```\n\u003cscript src=\"https://cdnjs.cloudflare.com/ajax/libs/quill/2.0.0-dev.3/quill.min.js\" type=\"text/javascript\"\u003e\u003c/script\u003e\n```\n```\n\u003clink href=\"https://cdnjs.cloudflare.com/ajax/libs/quill/2.0.0-dev.3/quill.snow.min.css\" rel=\"stylesheet\"\u003e\n\u003clink href=\"https://unpkg.com/quill-better-table@1.2.8/dist/quill-better-table.css\" rel=\"stylesheet\"\u003e\n```\n\nES6\n```\nimport QuillBetterTable from 'quill-better-table'\n\nQuill.register({\n  'modules/better-table': QuillBetterTable\n}, true)\n\nwindow.onload = () =\u003e {\n  const quill = new Quill('#editor-wrapper', {\n    theme: 'snow',\n    modules: {\n      table: false,  // disable table module\n      'better-table': {\n        operationMenu: {\n          items: {\n            unmergeCells: {\n              text: 'Another unmerge cells name'\n            }\n          }\n        }\n      },\n      keyboard: {\n        bindings: QuillBetterTable.keyboardBindings\n      }\n    }\n  })\n\n  document.body.querySelector('#insert-table')\n    .onclick = () =\u003e {\n      let tableModule = quill.getModule('better-table')\n      tableModule.insertTable(3, 3)\n    }\n}\n```\n\n# Module methods\nfirst, you can get quill-better-table module by `quill.getModule`\n```\nlet module = quill.getModule('better-table')\n```\n## module.getTable(range = quill.getSelection())\nget an array with TableContainer, TableRow, TableCell, offset through the given range.\n```\nmodule.getTable()  // current selection\nmodule.getTable(range)\n// [TableContainer, TableRow, TableCell, 0]\n```\n\n## module.insertTable(rows: Number, columns: Number)\ninsert table at current position\n```\nmodule.insertTable(3, 3)\n```\n\n# Module Options\nquill-better-table only provide operation options now.\n```\nconst quill = new Quill('#editor', {\n  theme: 'snow',\n  modules: {\n    table: false,  // disable table module\n    'better-table': {\n      operationMenu: {\n        items: {\n          unmergeCells: {\n            text: 'Another unmerge cells name'\n          }\n        },\n        color: {\n          colors: ['#fff', 'red', 'rgb(0, 0, 0)'],  // colors in operationMenu\n          text: 'Background Colors'  // subtitle\n        } \n      }\n    },\n    keyboard: {\n      bindings: QuillBetterTable.keyboardBindings\n    }\n  }\n})\n```\n## operationMenu\nOperationMenu configures the operation list in right-click menu.\n\n## operationMenu.items\noperationMenu show all operations as default. `false` will remove the operation.\n```\n{\n  operationKey: {\n    text: 'foo'\n  },\n\n  operationKey: false\n}\n```\n`operationKey` is the name of operation, there is a list below:\n\u003cul\u003e\n  \u003cli\u003einsertColumnRight\u003c/li\u003e\n  \u003cli\u003einsertColumnLeft\u003c/li\u003e\n  \u003cli\u003einsertRowUp\u003c/li\u003e\n  \u003cli\u003einsertRowDown\u003c/li\u003e\n  \u003cli\u003emergeCells\u003c/li\u003e\n  \u003cli\u003eunmergeCells\u003c/li\u003e\n  \u003cli\u003edeleteColumn\u003c/li\u003e\n  \u003cli\u003edeleteRow\u003c/li\u003e\n  \u003cli\u003edeleteTable\u003c/li\u003e\n\u003c/ul\u003e\n\nYou may need to modify the menu text, `operationKey.text` will do that.\n\n## operationMenu.color\nBackground colors is optional, the default is hidden. If you need this feature, use this configure.\n```\n{\n  colors: ['#fff', 'red', 'rgb(0, 0, 0)'],  // colors you need in operationMenu, ['white', 'red', 'yellow', 'blue'] as default\n  text: 'Background Colors'  // subtitle, 'Background Colors' as default\n} \n```\n\n# Community\nSend me an email(\u003ca href=\"mailto: lw54760187@hotmail.com\"\u003elw54760187@hotmail.com\u003c/a\u003e) or Contribute on [Issues](https://github.com/soccerloway/quill-better-table/issues), I glad to hear your suggestion.\n\n# License\n[MIT License](https://rmm5t.mit-license.org/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsoccerloway%2Fquill-better-table","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsoccerloway%2Fquill-better-table","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsoccerloway%2Fquill-better-table/lists"}