Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to make unordered list as default? #54

Open
brc-dd opened this issue Dec 11, 2020 · 3 comments
Open

How to make unordered list as default? #54

brc-dd opened this issue Dec 11, 2020 · 3 comments
Labels
good first issue Good for newcomers

Comments

@brc-dd
Copy link

brc-dd commented Dec 11, 2020

I am using the following editorjs config:

tools: {
     list: { 
          class: require('@editorjs/list'),
          shortcut: 'CMD+SHIFT+L' 
     }
},
inlineToolbar: true

Now when I use shortcut CMD+SHIFT+L on the app, it generates an ordered list block. The same behavior is when I add a list block.

But when I manually use "Convert To", it changes block to an unordered list. I want to default the behavior of previous two methods to generate an unordered list. Is is possible?

Maybe some parameter like defaultStyle: "unordered" similar to defaultLevel in @editorjs/header?

@horizon89
Copy link

I second this. It would be nice to configure the default list type: ordered/unordered.

90% of my lists are unordered, so this could be really useful.

@0xc00010ff
Copy link

Bump for this feature. Most editors I've ever used have unordered as the default.

For those who have to have it- you can always fork the repo and change this line:

default: false,

and point the npm package to your fork

@adam-riha
Copy link

A quick workaround until the pull request is merged #51.
Create a custom class that extends the base class.

import EditorJS from '@editorjs/editorjs';
const EditorJSList = require('@editorjs/list');

class MyList extends EditorJSList {
    constructor({ data, config, api, readOnly }) {
        super({ data, config, api, readOnly });

        this.settings = [
            {
                name: 'unordered',
                title: this.api.i18n.t('Unordered'),
                icon: '<svg width="17" height="13" viewBox="0 0 17 13" xmlns="http://www.w3.org/2000/svg"> <path d="M5.625 4.85h9.25a1.125 1.125 0 0 1 0 2.25h-9.25a1.125 1.125 0 0 1 0-2.25zm0-4.85h9.25a1.125 1.125 0 0 1 0 2.25h-9.25a1.125 1.125 0 0 1 0-2.25zm0 9.85h9.25a1.125 1.125 0 0 1 0 2.25h-9.25a1.125 1.125 0 0 1 0-2.25zm-4.5-5a1.125 1.125 0 1 1 0 2.25 1.125 1.125 0 0 1 0-2.25zm0-4.85a1.125 1.125 0 1 1 0 2.25 1.125 1.125 0 0 1 0-2.25zm0 9.85a1.125 1.125 0 1 1 0 2.25 1.125 1.125 0 0 1 0-2.25z"/></svg>',
                default: true,
            },
            {
                name: 'ordered',
                title: this.api.i18n.t('Ordered'),
                icon: '<svg width="17" height="13" viewBox="0 0 17 13" xmlns="http://www.w3.org/2000/svg"><path d="M5.819 4.607h9.362a1.069 1.069 0 0 1 0 2.138H5.82a1.069 1.069 0 1 1 0-2.138zm0-4.607h9.362a1.069 1.069 0 0 1 0 2.138H5.82a1.069 1.069 0 1 1 0-2.138zm0 9.357h9.362a1.069 1.069 0 0 1 0 2.138H5.82a1.069 1.069 0 0 1 0-2.137zM1.468 4.155V1.33c-.554.404-.926.606-1.118.606a.338.338 0 0 1-.244-.104A.327.327 0 0 1 0 1.59c0-.107.035-.184.105-.234.07-.05.192-.114.369-.192.264-.118.475-.243.633-.373.158-.13.298-.276.42-.438a3.94 3.94 0 0 1 .238-.298C1.802.019 1.872 0 1.975 0c.115 0 .208.042.277.127.07.085.105.202.105.351v3.556c0 .416-.15.624-.448.624a.421.421 0 0 1-.32-.127c-.08-.085-.121-.21-.121-.376zm-.283 6.664h1.572c.156 0 .275.03.358.091a.294.294 0 0 1 .123.25.323.323 0 0 1-.098.238c-.065.065-.164.097-.296.097H.629a.494.494 0 0 1-.353-.119.372.372 0 0 1-.126-.28c0-.068.027-.16.081-.273a.977.977 0 0 1 .178-.268c.267-.264.507-.49.722-.678.215-.188.368-.312.46-.371.165-.11.302-.222.412-.334.109-.112.192-.226.25-.344a.786.786 0 0 0 .085-.345.6.6 0 0 0-.341-.553.75.75 0 0 0-.345-.08c-.263 0-.47.11-.62.329-.02.029-.054.107-.101.235a.966.966 0 0 1-.16.295c-.059.069-.145.103-.26.103a.348.348 0 0 1-.25-.094.34.34 0 0 1-.099-.258c0-.132.031-.27.093-.413.063-.143.155-.273.279-.39.123-.116.28-.21.47-.282.189-.072.411-.107.666-.107.307 0 .569.045.786.137a1.182 1.182 0 0 1 .618.623 1.18 1.18 0 0 1-.096 1.083 2.03 2.03 0 0 1-.378.457c-.128.11-.344.282-.646.517-.302.235-.509.417-.621.547a1.637 1.637 0 0 0-.148.187z"/></svg>',
                default: false,
            },
        ];
        this._data = {
            style: this.settings.find((tune) => tune.default === true).name,
            items: [],
        };
        this.data = data;
    }
}

/**
 * Init editor
 */
const editor = new EditorJS({
    // ...
    tools: {
        list: MyList
    }
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
good first issue Good for newcomers
Projects
None yet
Development

No branches or pull requests

5 participants