list
list copied to clipboard
How to make unordered list as default?
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
?
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.
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: https://github.com/editor-js/list/blob/2f67e1200ab45789780e2ffb3f45ca128f426883/src/index.js#L77 and point the npm package to your fork
A quick workaround until the pull request is merged https://github.com/editor-js/list/pull/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
}
});