RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/Anubhavjain786/grapesjs-table below:

Anubhavjain786/grapesjs-table: Table Plugin for grapesjs.

- GrapesJS v0.13.8 or higher

<link
  href="https://unpkg.com/grapesjs/dist/css/grapes.min.css"
  rel="stylesheet"
/>
<script src="https://unpkg.com/grapesjs"></script>
<script src="https://unpkg.com/grapesjs-table"></script>

<div id="gjs"></div>

const editor = grapesjs.init({
  container: "#gjs",
  height: "100%",
  fromElement: true,
  storageManager: false,
  plugins: ["grapesjs-table"],
});

body,
html {
  margin: 0;
  height: 100%;
}

Plugin name: grapesjs-table
Components
- table - Main table component
- tablebody - Component which contains table body
- tableFooter - Component which contains table footer
- tableHead - Component which contains table header
Blocks
- table

Option Description Default tableBlock Object to extend the default table block, eg. { label: 'table', attributes: { ... } } tableProps Object to extend the default table properties, eg. { name: 'My table', droppable: false, ... } {} bodyProps Object to extend the default table body properties {} headProps Object to extend the default table head properties {} footerProps Object to extend the default table footer properties {} attrTable Table attribute identifier (main component) data-table attrTableBody Table body attribute identifier data-tbody attrTableFooter Table footer attribute identifier data-tfoot attrTableHeader Table Head attribute identifier data-thead classTable Default class to use on table table classTableBody Default class to use on table body table-body classTableFooter Default class to use on table body footer table-footer classTableHeader Default class to use on table body header table-header style Default style for table table { .... (check the source)

CDN
- https://unpkg.com/grapesjs-table
NPM
- npm i grapesjs-table
GIT
- git clone https://github.com/anubhavjain786/grapesjs-table.git

Directly in the browser

<link
  href="https://unpkg.com/grapesjs/dist/css/grapes.min.css"
  rel="stylesheet"
/>
<script src="https://unpkg.com/grapesjs"></script>
<script src="path/to/grapesjs-table.min.js"></script>

<div id="gjs"></div>

<script type="text/javascript">
  var editor = grapesjs.init({
    container: "#gjs",
    // ...
    plugins: ["grapesjs-table"],
    pluginsOpts: {
      "grapesjs-table": {
        /* options */
      },
    },
  });
</script>

Modern javascript

import grapesjs from 'grapesjs';
import plugin from 'grapesjs-table';
import 'grapesjs/dist/css/grapes.min.css';

const editor = grapesjs.init({
  container : '#gjs',
  // ...
  plugins: [plugin],
  pluginsOpts: {
    [plugin]: { /* options */ }
  }
  // or
  plugins: [
    editor => plugin(editor, { /* options */ }),
  ],
});

Clone the repository

$ git clone https://github.com/anubhavjain786/grapesjs-table.git
$ cd grapesjs-table

Install dependencies

Start the dev server

Build the source

MIT

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4