1.0.33 • Published 2 years ago
@creaditor/menu-editor-web-component v1.0.33
Menu editor widget
Usage
Install the component via npm: npm install @creaditor/menu-editor-web-component
.
const menuEditor = document.createElement("cdtr-menu-editor");
menuEditor.onLoad = () => {};
menuEditor.items = [
{
id: 0,
text: "Home",
onClick: {
url: "instagsssram.com",
},
style: {
fontSize: "1em",
},
},
{
id: 1,
text: "About",
onClick: {
url: "twitter.com",
},
style: {
color: "red",
fontFamily: "Arial",
fontSize: "12px",
},
},
];
menuEditor.translates = {
add: "Add new",
placeholder: "button text",
info: "Drag to Move, Click to options",
remove: "remove1",
};
menuEditor.spacing = "20px";
menuEditor.onChangeText = (text, index, item) => {
const cloned = JSON.parse(JSON.stringify(menuEditor.items));
cloned[index].text = text;
menuEditor.items = cloned;
};
menuEditor.onRemove = (item) => {
const cloned = menuEditor.items;
cloned.splice(cloned.indexOf(item), 1);
menuEditor.items = cloned;
};
menuEditor.onAdd = (newItem) => {
menuEditor.items.forEach((item) => (item.selected = false));
newItem.selected = true;
const cloned = menuEditor.items;
cloned.unshift(newItem);
menuEditor.items = cloned;
};
menuEditor.onSort = (sortable) => {
menuEditor.items = sortable;
};
menuEditor.onClickOutside = (event) => {
const cloned = menuEditor.items;
cloned.forEach((item) => (item.selected = false));
menuEditor.items = JSON.parse(JSON.stringify(cloned));
};
menuEditor.onSelect = (icon) => {
const coneArr = [...menuEditor.items];
coneArr.forEach((item) => (item.selected = false));
const selectedItem = coneArr.find((item) => item.id === icon.id);
selectedItem.selected = true;
menuEditor.items = coneArr;
};
menuEditor.onFocus = (item) => {
// some code
};
menuEditor.onBlur = (item) => {
// some code
};
Build
npm run build
Publish
update package.json version
npm run build
npm publish
1.0.33
2 years ago
1.0.32
2 years ago
1.0.31
2 years ago
1.0.30
2 years ago
1.0.29
2 years ago
1.0.28
2 years ago
1.0.22
2 years ago
1.0.21
2 years ago
1.0.26
2 years ago
1.0.25
2 years ago
1.0.24
2 years ago
1.0.23
2 years ago
1.0.27
2 years ago
1.0.20
2 years ago
1.0.19
2 years ago
1.0.18
2 years ago
1.0.17
2 years ago
1.0.16
2 years ago
1.0.9
2 years ago
1.0.8
2 years ago
1.0.7
2 years ago
1.0.6
2 years ago
1.0.11
2 years ago
1.0.10
2 years ago
1.0.15
2 years ago
1.0.14
2 years ago
1.0.13
2 years ago
1.0.12
2 years ago
1.0.5
2 years ago
1.0.4
2 years ago
1.0.3
2 years ago
1.0.2
2 years ago
1.0.1
2 years ago
1.0.0
2 years ago