markmap-toolbar 0.15.4 → 0.15.5-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +2 -2
- package/dist/index.mjs +145 -5
- package/dist/style.css +20 -57
- package/package.json +4 -4
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! markmap-toolbar v0.15.
|
|
1
|
+
/*! markmap-toolbar v0.15.5-alpha.1+013bf59 | MIT License */
|
|
2
2
|
(function (global, factory) {
|
|
3
3
|
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
|
|
4
4
|
typeof define === 'function' && define.amd ? define(['exports'], factory) :
|
|
@@ -255,7 +255,7 @@ class Toolbar {
|
|
|
255
255
|
var _this$markmap;
|
|
256
256
|
const button = e.target.closest(`.${clsToolbarItem}`);
|
|
257
257
|
const active = button == null ? void 0 : button.classList.toggle(clsActive);
|
|
258
|
-
(_this$markmap = this.markmap) == null
|
|
258
|
+
(_this$markmap = this.markmap) == null || _this$markmap.setOptions({
|
|
259
259
|
toggleRecursively: active
|
|
260
260
|
});
|
|
261
261
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
/*! markmap-toolbar v0.15.
|
|
2
|
-
import { mountDom } from '@gera2ld/jsx-dom';
|
|
3
|
-
import { jsx, jsxs, Fragment } from '@gera2ld/jsx-dom/jsx-runtime';
|
|
4
|
-
|
|
1
|
+
/*! markmap-toolbar v0.15.5-alpha.1+013bf59 | MIT License */
|
|
5
2
|
function _extends() {
|
|
6
3
|
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
7
4
|
for (var i = 1; i < arguments.length; i++) {
|
|
@@ -17,6 +14,149 @@ function _extends() {
|
|
|
17
14
|
return _extends.apply(this, arguments);
|
|
18
15
|
}
|
|
19
16
|
|
|
17
|
+
/*! @gera2ld/jsx-dom v2.2.2 | ISC License */
|
|
18
|
+
const VTYPE_ELEMENT = 1;
|
|
19
|
+
const VTYPE_FUNCTION = 2;
|
|
20
|
+
const SVG_NS = 'http://www.w3.org/2000/svg';
|
|
21
|
+
const XLINK_NS = 'http://www.w3.org/1999/xlink';
|
|
22
|
+
const NS_ATTRS = {
|
|
23
|
+
show: XLINK_NS,
|
|
24
|
+
actuate: XLINK_NS,
|
|
25
|
+
href: XLINK_NS
|
|
26
|
+
};
|
|
27
|
+
const isLeaf = c => typeof c === 'string' || typeof c === 'number';
|
|
28
|
+
const isElement = c => (c == null ? void 0 : c.vtype) === VTYPE_ELEMENT;
|
|
29
|
+
const isRenderFunction = c => (c == null ? void 0 : c.vtype) === VTYPE_FUNCTION;
|
|
30
|
+
function jsx(type, props) {
|
|
31
|
+
let vtype;
|
|
32
|
+
if (typeof type === 'string') vtype = VTYPE_ELEMENT;else if (typeof type === 'function') vtype = VTYPE_FUNCTION;else throw new Error('Invalid VNode type');
|
|
33
|
+
return {
|
|
34
|
+
vtype,
|
|
35
|
+
type,
|
|
36
|
+
props
|
|
37
|
+
};
|
|
38
|
+
}
|
|
39
|
+
const jsxs = jsx;
|
|
40
|
+
function Fragment(props) {
|
|
41
|
+
return props.children;
|
|
42
|
+
}
|
|
43
|
+
const DEFAULT_ENV = {
|
|
44
|
+
isSvg: false
|
|
45
|
+
};
|
|
46
|
+
function insertDom(parent, nodes) {
|
|
47
|
+
if (!Array.isArray(nodes)) nodes = [nodes];
|
|
48
|
+
nodes = nodes.filter(Boolean);
|
|
49
|
+
if (nodes.length) parent.append(...nodes);
|
|
50
|
+
}
|
|
51
|
+
function mountAttributes(domElement, props, env) {
|
|
52
|
+
for (const key in props) {
|
|
53
|
+
if (key === 'key' || key === 'children' || key === 'ref') continue;
|
|
54
|
+
if (key === 'dangerouslySetInnerHTML') {
|
|
55
|
+
domElement.innerHTML = props[key].__html;
|
|
56
|
+
} else if (key === 'innerHTML' || key === 'textContent' || key === 'innerText' || key === 'value' && ['textarea', 'select'].includes(domElement.tagName)) {
|
|
57
|
+
const value = props[key];
|
|
58
|
+
if (value != null) domElement[key] = value;
|
|
59
|
+
} else if (key.startsWith('on')) {
|
|
60
|
+
domElement[key.toLowerCase()] = props[key];
|
|
61
|
+
} else {
|
|
62
|
+
setDOMAttribute(domElement, key, props[key], env.isSvg);
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
const attrMap = {
|
|
67
|
+
className: 'class',
|
|
68
|
+
labelFor: 'for'
|
|
69
|
+
};
|
|
70
|
+
function setDOMAttribute(el, attr, value, isSVG) {
|
|
71
|
+
attr = attrMap[attr] || attr;
|
|
72
|
+
if (value === true) {
|
|
73
|
+
el.setAttribute(attr, '');
|
|
74
|
+
} else if (value === false) {
|
|
75
|
+
el.removeAttribute(attr);
|
|
76
|
+
} else {
|
|
77
|
+
const namespace = isSVG ? NS_ATTRS[attr] : undefined;
|
|
78
|
+
if (namespace !== undefined) {
|
|
79
|
+
el.setAttributeNS(namespace, attr, value);
|
|
80
|
+
} else {
|
|
81
|
+
el.setAttribute(attr, value);
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
function flatten(arr) {
|
|
86
|
+
return arr.reduce((prev, item) => prev.concat(item), []);
|
|
87
|
+
}
|
|
88
|
+
function mountChildren(children, env) {
|
|
89
|
+
return Array.isArray(children) ? flatten(children.map(child => mountChildren(child, env))) : mount(children, env);
|
|
90
|
+
}
|
|
91
|
+
function mount(vnode, env = DEFAULT_ENV) {
|
|
92
|
+
if (vnode == null || typeof vnode === 'boolean') {
|
|
93
|
+
return null;
|
|
94
|
+
}
|
|
95
|
+
if (vnode instanceof Node) {
|
|
96
|
+
return vnode;
|
|
97
|
+
}
|
|
98
|
+
if (isRenderFunction(vnode)) {
|
|
99
|
+
const {
|
|
100
|
+
type,
|
|
101
|
+
props
|
|
102
|
+
} = vnode;
|
|
103
|
+
if (type === Fragment) {
|
|
104
|
+
const node = document.createDocumentFragment();
|
|
105
|
+
if (props.children) {
|
|
106
|
+
const children = mountChildren(props.children, env);
|
|
107
|
+
insertDom(node, children);
|
|
108
|
+
}
|
|
109
|
+
return node;
|
|
110
|
+
}
|
|
111
|
+
const childVNode = type(props);
|
|
112
|
+
return mount(childVNode, env);
|
|
113
|
+
}
|
|
114
|
+
if (isLeaf(vnode)) {
|
|
115
|
+
return document.createTextNode(`${vnode}`);
|
|
116
|
+
}
|
|
117
|
+
if (isElement(vnode)) {
|
|
118
|
+
let node;
|
|
119
|
+
const {
|
|
120
|
+
type,
|
|
121
|
+
props
|
|
122
|
+
} = vnode;
|
|
123
|
+
if (!env.isSvg && type === 'svg') {
|
|
124
|
+
env = Object.assign({}, env, {
|
|
125
|
+
isSvg: true
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
if (!env.isSvg) {
|
|
129
|
+
node = document.createElement(type);
|
|
130
|
+
} else {
|
|
131
|
+
node = document.createElementNS(SVG_NS, type);
|
|
132
|
+
}
|
|
133
|
+
mountAttributes(node, props, env);
|
|
134
|
+
if (props.children) {
|
|
135
|
+
let childEnv = env;
|
|
136
|
+
if (env.isSvg && type === 'foreignObject') {
|
|
137
|
+
childEnv = Object.assign({}, childEnv, {
|
|
138
|
+
isSvg: false
|
|
139
|
+
});
|
|
140
|
+
}
|
|
141
|
+
const children = mountChildren(props.children, childEnv);
|
|
142
|
+
if (children != null) insertDom(node, children);
|
|
143
|
+
}
|
|
144
|
+
const {
|
|
145
|
+
ref
|
|
146
|
+
} = props;
|
|
147
|
+
if (typeof ref === 'function') ref(node);
|
|
148
|
+
return node;
|
|
149
|
+
}
|
|
150
|
+
throw new Error('mount: Invalid Vnode!');
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
/**
|
|
154
|
+
* Mount vdom as real DOM nodes.
|
|
155
|
+
*/
|
|
156
|
+
function mountDom(vnode) {
|
|
157
|
+
return mount(vnode);
|
|
158
|
+
}
|
|
159
|
+
|
|
20
160
|
const clsToolbarItem = 'mm-toolbar-item';
|
|
21
161
|
const clsActive = 'active';
|
|
22
162
|
function renderBrand() {
|
|
@@ -109,7 +249,7 @@ class Toolbar {
|
|
|
109
249
|
var _this$markmap;
|
|
110
250
|
const button = e.target.closest(`.${clsToolbarItem}`);
|
|
111
251
|
const active = button == null ? void 0 : button.classList.toggle(clsActive);
|
|
112
|
-
(_this$markmap = this.markmap) == null
|
|
252
|
+
(_this$markmap = this.markmap) == null || _this$markmap.setOptions({
|
|
113
253
|
toggleRecursively: active
|
|
114
254
|
});
|
|
115
255
|
}
|
package/dist/style.css
CHANGED
|
@@ -1,65 +1,28 @@
|
|
|
1
|
-
.mm-toolbar {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
padding: 0.25rem;
|
|
14
|
-
line-height: 1
|
|
15
|
-
}
|
|
16
|
-
.mm-toolbar:hover {
|
|
17
|
-
--tw-border-opacity: 1;
|
|
18
|
-
border-color: rgb(156 163 175 / var(--tw-border-opacity))
|
|
19
|
-
}
|
|
20
|
-
.mm-toolbar svg {
|
|
21
|
-
display: block
|
|
22
|
-
}
|
|
23
|
-
.mm-toolbar a {
|
|
24
|
-
display: inline-block;
|
|
25
|
-
text-decoration-line: none
|
|
26
|
-
}
|
|
27
|
-
.mm-toolbar-brand > img {
|
|
28
|
-
height: 1rem;
|
|
29
|
-
width: 1rem;
|
|
30
|
-
vertical-align: middle
|
|
31
|
-
}
|
|
32
|
-
.mm-toolbar-brand > span {
|
|
33
|
-
padding-left: 0.25rem;
|
|
34
|
-
padding-right: 0.25rem
|
|
35
|
-
}
|
|
36
|
-
.mm-toolbar-brand:not(:first-child), .mm-toolbar-item:not(:first-child) {
|
|
37
|
-
margin-left: 0.25rem
|
|
38
|
-
}
|
|
1
|
+
.mm-toolbar:hover {--un-border-opacity:1;border-color:rgba(156,163,175,var(--un-border-opacity));
|
|
2
|
+
}
|
|
3
|
+
.mm-toolbar svg {display:block;
|
|
4
|
+
}
|
|
5
|
+
.mm-toolbar a {display:inline-block;text-decoration:none;
|
|
6
|
+
}
|
|
7
|
+
.mm-toolbar-brand > img {width:1rem;height:1rem;vertical-align:middle;
|
|
8
|
+
}
|
|
9
|
+
.mm-toolbar-brand > span {padding-left:0.25rem;padding-right:0.25rem;
|
|
10
|
+
}
|
|
11
|
+
.mm-toolbar-brand:not(:first-child), .mm-toolbar-item:not(:first-child) {margin-left:0.25rem;
|
|
12
|
+
}
|
|
39
13
|
.mm-toolbar-brand > *, .mm-toolbar-item > * {
|
|
40
|
-
cursor: pointer;
|
|
41
|
-
text-align: center;
|
|
42
|
-
font-size: 0.75rem;
|
|
43
|
-
line-height: 1rem;
|
|
44
|
-
--tw-text-opacity: 1;
|
|
45
|
-
color: rgb(156 163 175 / var(--tw-text-opacity));
|
|
46
14
|
min-width: 20px;
|
|
47
15
|
height: 20px;
|
|
48
|
-
line-height: 20px
|
|
49
|
-
}
|
|
16
|
+
line-height: 20px;cursor:pointer;text-align:center;font-size:0.75rem;line-height:1rem;--un-text-opacity:1;color:rgba(156,163,175,var(--un-text-opacity));
|
|
17
|
+
}
|
|
18
|
+
.mm-toolbar-brand.active > *, .mm-toolbar-brand:hover > *, .mm-toolbar-item.active > *, .mm-toolbar-item:hover > * {--un-text-opacity:1;color:rgba(31,41,55,var(--un-text-opacity));
|
|
19
|
+
}
|
|
50
20
|
.mm-toolbar-brand.active,
|
|
51
21
|
.mm-toolbar-brand:hover,
|
|
52
22
|
.mm-toolbar-item.active,
|
|
53
|
-
.mm-toolbar-item:hover {
|
|
54
|
-
border-radius: 0.25rem;
|
|
55
|
-
--tw-bg-opacity: 1;
|
|
56
|
-
background-color: rgb(229 231 235 / var(--tw-bg-opacity))
|
|
57
|
-
}
|
|
58
|
-
.mm-toolbar-brand.active > *, .mm-toolbar-brand:hover > *, .mm-toolbar-item.active > *, .mm-toolbar-item:hover > * {
|
|
59
|
-
--tw-text-opacity: 1;
|
|
60
|
-
color: rgb(31 41 55 / var(--tw-text-opacity))
|
|
23
|
+
.mm-toolbar-item:hover {border-radius:0.25rem;--un-bg-opacity:1;background-color:rgba(229,231,235,var(--un-bg-opacity));
|
|
61
24
|
}
|
|
62
|
-
.mm-toolbar-brand.active, .mm-toolbar-item.active {
|
|
63
|
-
|
|
64
|
-
|
|
25
|
+
.mm-toolbar-brand.active, .mm-toolbar-item.active {--un-bg-opacity:1;background-color:rgba(209,213,219,var(--un-bg-opacity));
|
|
26
|
+
}
|
|
27
|
+
.mm-toolbar {display:flex;-moz-user-select:none;user-select:none;align-items:center;border-width:1px;--un-border-opacity:1;border-color:rgba(209,213,219,var(--un-border-opacity));border-radius:0.25rem;border-style:solid;--un-bg-opacity:1;background-color:rgba(255,255,255,var(--un-bg-opacity));padding:0.25rem;line-height:1;
|
|
65
28
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "markmap-toolbar",
|
|
3
|
-
"version": "0.15.
|
|
3
|
+
"version": "0.15.5-alpha.1+013bf59",
|
|
4
4
|
"description": "Extensible toolbar for markmap",
|
|
5
5
|
"author": "Gerald <gera2ld@live.com>",
|
|
6
6
|
"license": "MIT",
|
|
@@ -35,12 +35,12 @@
|
|
|
35
35
|
"markmap-common": "*"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
|
-
"markmap-common": "0.15.
|
|
39
|
-
"markmap-view": "0.15.
|
|
38
|
+
"markmap-common": "0.15.5-alpha.1+013bf59",
|
|
39
|
+
"markmap-view": "0.15.5-alpha.1+013bf59"
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
42
|
"@babel/runtime": "^7.22.6",
|
|
43
43
|
"@gera2ld/jsx-dom": "^2.2.2"
|
|
44
44
|
},
|
|
45
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "013bf59b71f2253dc54249c4a5a3097bf686494f"
|
|
46
46
|
}
|