RetroSearch Browse

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

Showing content from https://github.com/silexlabs/grapesjs-ui-suggest-classes below:

silexlabs/grapesjs-ui-suggest-classes: A grapesjs plugin to enable auto-complete of classes in the SelectorManager UI

Grapesjs Ui Suggest Classes

A grapesjs plugin to enable auto-complete of classes in the SelectorManager UI

This code is part of a bigger project: Silex v3 which aims to be a free/libre alternative to webflow

For bugs and support please start a discussion here

!! read this to avoid performance issues

Plugin name: grapesjs-ui-suggest-classes
UI: a tag list will appear when you click "+" in the class list of an element
Feature: suggest css classes as you type

Option Description Default containerStyle The css style of the tags container check the source code tagStyle The css style of the tags check the source code enablePerformance Display execution times false enableCount Compute and display the number of components using each CSS class, and order classes accordingly. The algorithm for this is not very efficient yet and impacts preformances true

CDN
- https://unpkg.com/grapesjs-ui-suggest-classes
NPM
- npm i @silexlabs/grapesjs-ui-suggest-classes
GIT
- git clone https://github.com/lexoyo/grapesjs-ui-suggest-classes.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-ui-suggest-classes.min.js"></script>

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

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

Modern javascript

import grapesjs from 'grapesjs';
import plugin from '@silexlabs/grapesjs-ui-suggest-classes';
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/lexoyo/grapesjs-ui-suggest-classes.git
$ cd grapesjs-ui-suggest-classes

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