wunderbaum 0.0.8 → 0.0.9

package/dist/wunderbaum.css

@@ -1,5 +1,5 @@
 /*!
  * Wunderbaum style sheet (generated from wunderbaum.scss)
  * Copyright (c) 2021-2022, Martin Wendt. Released under the MIT license.
- * v0.0.8, Fri, 23 Sep 2022 20:47:29 GMT (https://github.com/mar10/wunderbaum)
- */div.wunderbaum{box-sizing:border-box;height:100%;min-height:4px;background-color:#fff;margin:0;padding:0;font-family:Helvetica,sans-serif;font-size:14px;color:#56534c;border:2px solid #56534c;border-radius:4px;background-clip:content-box;overflow-x:auto;overflow-y:scroll}div.wunderbaum:focus,div.wunderbaum:focus-within{border-color:#275dc5}div.wunderbaum.wb-disabled{opacity:0.7;pointer-events:none}div.wunderbaum div.wb-scroll-container{position:relative;min-height:4px}div.wunderbaum div.wb-header{position:sticky;top:0;z-index:2}div.wunderbaum div.wb-header,div.wunderbaum div.wb-scroll-container{overflow:unset}div.wunderbaum.wb-fixed-col div.wb-header span.wb-col:first-of-type{background-color:#dedede}div.wunderbaum.wb-fixed-col span.wb-col:first-of-type{position:sticky;left:0;z-index:1;background-color:#fff}div.wunderbaum div.wb-row{position:absolute;width:100%;height:22px;line-height:22px;border:1px solid transparent}div.wunderbaum:not(:focus-within) div.wb-node-list div.wb-row.wb-active,div.wunderbaum:not(:focus-within) div.wb-node-list div.wb-row.wb-selected,div.wunderbaum:not(:focus) div.wb-node-list div.wb-row.wb-active,div.wunderbaum:not(:focus) div.wb-node-list div.wb-row.wb-selected{background-color:#f0f0f0;border-color:#acacac}div.wunderbaum:not(:focus-within) div.wb-node-list div.wb-row.wb-active:hover,div.wunderbaum:not(:focus-within) div.wb-node-list div.wb-row.wb-selected:hover,div.wunderbaum:not(:focus) div.wb-node-list div.wb-row.wb-active:hover,div.wunderbaum:not(:focus) div.wb-node-list div.wb-row.wb-selected:hover{background-color:#eaeaea}div.wunderbaum.wb-alternate div.wb-node-list div.wb-row:nth-of-type(even):not(.wb-active):not(.wb-selected){background-color:#f7f7f7}div.wunderbaum.wb-alternate div.wb-node-list div.wb-row:nth-of-type(even):not(.wb-active):not(.wb-selected):hover{background-color:#f3f3f3}div.wunderbaum div.wb-node-list div.wb-row:hover{background-color:#f7fcfe}div.wunderbaum div.wb-node-list div.wb-row.wb-active,div.wunderbaum div.wb-node-list div.wb-row.wb-selected{background-color:#e5f3fb}div.wunderbaum div.wb-node-list div.wb-row.wb-active:hover,div.wunderbaum div.wb-node-list div.wb-row.wb-selected:hover{background-color:#dceff8}div.wunderbaum div.wb-node-list div.wb-row.wb-focus:not(.wb-active){border-style:dotted;border-color:#70c0e7}div.wunderbaum div.wb-node-list div.wb-row.wb-active{border-style:solid;border-color:#70c0e7}div.wunderbaum div.wb-node-list div.wb-row.wb-active:hover{border-color:#26a0da}div.wunderbaum div.wb-node-list div.wb-row.wb-loading{font-style:italic}div.wunderbaum div.wb-node-list div.wb-row.wb-busy,div.wunderbaum div.wb-node-list div.wb-row i.wb-busy,div.wunderbaum div.wb-node-list div.wb-row .wb-col.wb-busy{font-style:italic;background:repeating-linear-gradient(45deg, transparent, transparent 3.88px, #dedede 3.88px, #dedede 7.78px);animation:wb-busy-animation 2s linear infinite}div.wunderbaum div.wb-node-list div.wb-row.wb-error,div.wunderbaum div.wb-node-list div.wb-row.wb-status-error{color:#b5373b}div.wunderbaum div.wb-header{position:sticky;height:22px;border-bottom:1px solid #56534c;padding:0;background-color:#dedede}div.wunderbaum div.wb-header span.wb-col{font-weight:bold;overflow:visible}div.wunderbaum div.wb-header span.wb-col-title{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}div.wunderbaum div.wb-header span.wb-col-resizer{position:absolute;top:0;right:-1px;width:3px;border:none;border-right:2px solid #56534c;height:100%;cursor:col-resize}div.wunderbaum span.wb-col{position:absolute;display:inline-block;height:20px;line-height:20px;padding:0 2px;border-right:1px solid #dedede;white-space:nowrap}div.wunderbaum span.wb-col:last-of-type{border-right:none}div.wunderbaum span.wb-node{user-select:none}div.wunderbaum span.wb-node i.wb-checkbox,div.wunderbaum span.wb-node i.wb-expander,div.wunderbaum span.wb-node i.wb-icon,div.wunderbaum span.wb-node i.wb-indent{height:20px;width:20px;padding:2px 2px;display:inline-block}div.wunderbaum span.wb-node i.bi::before{vertical-align:baseline}div.wunderbaum span.wb-node img.wb-icon{width:16px;height:16px;padding:2px 2px}div.wunderbaum span.wb-node i.wb-indent::before{content:"\00a0"}div.wunderbaum span.wb-node i.wb-expander.wb-spin,div.wunderbaum span.wb-node i.wb-icon.wb-spin{height:unset;width:unset;padding:0 3px;animation:wb-spin-animation 2s linear infinite}div.wunderbaum span.wb-node span.wb-title{min-width:1em;vertical-align:top;overflow-x:hidden;display:inline-block;white-space:nowrap;text-overflow:ellipsis}div.wunderbaum.wb-grid div.wb-header div.wb-row span.wb-col:hover{background-color:#c5c5c5}div.wunderbaum.wb-grid.wb-cell-mode div.wb-header div.wb-row span.wb-col.wb-active{background-color:#dceff8}div.wunderbaum.wb-grid div.wb-node-list div.wb-row{border-bottom-color:#dedede}div.wunderbaum.wb-grid div.wb-node-list div.wb-row:hover:not(.wb-active):not(.wb-selected){background-color:#f7fcfe}div.wunderbaum.wb-grid div.wb-node-list div.wb-row.wb-active{border-bottom-color:#70c0e7}div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col{border-right:1px solid #dedede}div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col input.wb-input-edit,div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="color"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="date"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="datetime"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="datetime-local"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="email"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="month"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="number"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="password"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="search"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="tel"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="text"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="time"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="url"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="week"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>select{width:100%;max-height:20px;border:none}div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input:focus,div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>select:focus{border:1px dashed #70c0e7}div.wunderbaum.wb-grid.wb-cell-mode div.wb-row:not(.wb-colspan) span.wb-col.wb-active{background-color:#f7fcfe}div.wunderbaum.wb-grid.wb-cell-mode div.wb-row:not(.wb-colspan).wb-active{background-color:#f7fcfe}div.wunderbaum.wb-grid.wb-cell-mode div.wb-row:not(.wb-colspan).wb-active span.wb-col.wb-active{background-color:#26a0da}div.wunderbaum.wb-grid.wb-alternate div.wb-node-list div.wb-row:nth-of-type(even):not(.wb-active):not(.wb-selected){background-color:#f7f7f7}div.wunderbaum.wb-grid.wb-alternate div.wb-node-list div.wb-row:nth-of-type(even):not(.wb-active):not(.wb-selected):hover{background-color:#f3f3f3}div.wunderbaum.wb-grid:not(:focus-within) div.wb-node-list div.wb-row,div.wunderbaum.wb-grid:not(:focus) div.wb-node-list div.wb-row{border-bottom-color:#dedede}div.wunderbaum.wb-ext-filter-dim div.wb-node-list div.wb-row,div.wunderbaum.wb-ext-filter-hide div.wb-node-list div.wb-row{color:#dedede}div.wunderbaum.wb-ext-filter-dim div.wb-node-list div.wb-row.wb-submatch,div.wunderbaum.wb-ext-filter-hide div.wb-node-list div.wb-row.wb-submatch{color:#868581}div.wunderbaum.wb-ext-filter-dim div.wb-node-list div.wb-row.wb-match,div.wunderbaum.wb-ext-filter-hide div.wb-node-list div.wb-row.wb-match{color:#56534c}div.wunderbaum div.wb-row.wb-drag-source{opacity:0.5}div.wunderbaum div.wb-row.wb-drag-source .wb-node{background-color:#d3d2ce}div.wunderbaum div.wb-row.wb-drop-target{overflow:visible}div.wunderbaum div.wb-row.wb-drop-target .wb-node{background-color:#d4ecf8;overflow:visible}div.wunderbaum div.wb-row.wb-drop-target .wb-node .wb-icon{position:relative;overflow:visible}div.wunderbaum div.wb-row.wb-drop-target .wb-node .wb-icon::after{position:absolute;z-index:1000;content:url(../docs/assets/drop_marker_16x32.png);left:0;top:3px}div.wunderbaum div.wb-row.wb-drop-target.wb-drop-before .wb-node .wb-icon::after{content:url(../docs/assets/drop_marker_insert_16x64.png);left:0;top:-8px}div.wunderbaum div.wb-row.wb-drop-target.wb-drop-after .wb-node .wb-icon::after{content:url(../docs/assets/drop_marker_insert_16x64.png);left:0;top:14px}div.wunderbaum.wb-rainbow i.wb-expander:nth-child(4n+1),div.wunderbaum.wb-rainbow i.wb-indent:nth-child(4n+1){background:#ffffe8}div.wunderbaum.wb-rainbow i.wb-expander:nth-child(4n+2),div.wunderbaum.wb-rainbow i.wb-indent:nth-child(4n+2){background:#f0fff0}div.wunderbaum.wb-rainbow i.wb-expander:nth-child(4n+3),div.wunderbaum.wb-rainbow i.wb-indent:nth-child(4n+3){background:#fff0ff}div.wunderbaum.wb-rainbow i.wb-expander:nth-child(4n+4),div.wunderbaum.wb-rainbow i.wb-indent:nth-child(4n+4){background:#eafdfd}div.wunderbaum.wb-fade-expander i.wb-expander{transition:color 1.5s;color:rgba(86,83,76,0)}div.wunderbaum.wb-fade-expander div.wb-row.wb-loading i.wb-expander,div.wunderbaum.wb-fade-expander:hover i.wb-expander,div.wunderbaum.wb-fade-expander:focus i.wb-expander,div.wunderbaum.wb-fade-expander:focus-within i.wb-expander,div.wunderbaum.wb-fade-expander [class*="wb-statusnode-"] i.wb-expander{transition:color 0.6s;color:#56534c}div.wunderbaum div.wb-row.wb-skeleton span.wb-title,div.wunderbaum div.wb-row.wb-skeleton i.wb-icon{animation:wb-skeleton-animation 1s linear infinite alternate;border-radius:0.25em;color:transparent;opacity:0.7}div.wunderbaum.wb-checkbox-auto-hide i.wb-checkbox{visibility:hidden}div.wunderbaum.wb-checkbox-auto-hide .wb-row:hover i.wb-checkbox,div.wunderbaum.wb-checkbox-auto-hide .wb-row.wb-selected i.wb-checkbox{visibility:unset}div.wunderbaum.wb-checkbox-auto-hide:focus .wb-row.wb-active i.wb-checkbox,div.wunderbaum.wb-checkbox-auto-hide:focus-within .wb-row.wb-active i.wb-checkbox{visibility:unset}.wb-helper-center{text-align:center}.wb-helper-disabled{color:#8c877c}.wb-helper-hidden{display:none}.wb-helper-invalid{color:#b5373b}.wb-helper-lazy-expander{color:#26a0da}.wb-helper-link{cursor:pointer}.wb-helper-start,.wb-helper-start>input{text-align:left}.wb-helper-end,.wb-helper-end>input{text-align:right}.wb-rtl .wb-helper-start,.wb-rtl .wb-helper-start>input{text-align:right}.wb-rtl .wb-helper-end,.wb-rtl .wb-helper-end>input{text-align:left}.wb-col input[type="checkbox"]:indeterminate{color:#8c877c;background-color:red}.wb-col input:invalid{color:#b5373b;background-color:#f5ddde}@keyframes wb-spin-animation{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes wb-skeleton-animation{0%{background-color:#a3b8c2}100%{background-color:#f0f3f5}}@keyframes wb-busy-animation{0%{background-position:0 0}100%{background-position:0 22px}}
+ * v0.0.9, Mon, 31 Oct 2022 17:06:10 GMT (https://github.com/mar10/wunderbaum)
+ */div.wunderbaum{box-sizing:border-box;height:100%;min-height:4px;background-color:#fff;margin:0;padding:0;font-family:Helvetica,sans-serif;font-size:14px;color:#56534c;border:2px solid #56534c;border-radius:4px;background-clip:content-box;overflow-x:auto;overflow-y:scroll}div.wunderbaum:focus,div.wunderbaum:focus-within{border-color:#275dc5}div.wunderbaum.wb-disabled{opacity:0.7;pointer-events:none}div.wunderbaum div.wb-scroll-container{position:relative;min-height:4px}div.wunderbaum div.wb-header{position:sticky;top:0;z-index:2}div.wunderbaum div.wb-header,div.wunderbaum div.wb-scroll-container{overflow:unset}div.wunderbaum.wb-fixed-col div.wb-header span.wb-col:first-of-type{background-color:#dedede}div.wunderbaum.wb-fixed-col span.wb-col:first-of-type{position:sticky;left:0;z-index:1;background-color:#fff}div.wunderbaum div.wb-row{position:absolute;width:100%;height:22px;line-height:22px;border:1px solid transparent}div.wunderbaum:not(:focus-within) div.wb-node-list div.wb-row.wb-active,div.wunderbaum:not(:focus-within) div.wb-node-list div.wb-row.wb-selected,div.wunderbaum:not(:focus) div.wb-node-list div.wb-row.wb-active,div.wunderbaum:not(:focus) div.wb-node-list div.wb-row.wb-selected{background-color:#f0f0f0;border-color:#acacac}div.wunderbaum:not(:focus-within) div.wb-node-list div.wb-row.wb-active:hover,div.wunderbaum:not(:focus-within) div.wb-node-list div.wb-row.wb-selected:hover,div.wunderbaum:not(:focus) div.wb-node-list div.wb-row.wb-active:hover,div.wunderbaum:not(:focus) div.wb-node-list div.wb-row.wb-selected:hover{background-color:#eaeaea}div.wunderbaum.wb-alternate div.wb-node-list div.wb-row:nth-of-type(even):not(.wb-active):not(.wb-selected){background-color:#f7f7f7}div.wunderbaum.wb-alternate div.wb-node-list div.wb-row:nth-of-type(even):not(.wb-active):not(.wb-selected):hover{background-color:#f3f3f3}div.wunderbaum div.wb-node-list div.wb-row:hover{background-color:#f7fcfe}div.wunderbaum div.wb-node-list div.wb-row.wb-active,div.wunderbaum div.wb-node-list div.wb-row.wb-selected{background-color:#e5f3fb}div.wunderbaum div.wb-node-list div.wb-row.wb-active:hover,div.wunderbaum div.wb-node-list div.wb-row.wb-selected:hover{background-color:#dceff8}div.wunderbaum div.wb-node-list div.wb-row.wb-focus:not(.wb-active){border-style:dotted;border-color:#70c0e7}div.wunderbaum div.wb-node-list div.wb-row.wb-active{border-style:solid;border-color:#70c0e7}div.wunderbaum div.wb-node-list div.wb-row.wb-active:hover{border-color:#26a0da}div.wunderbaum div.wb-node-list div.wb-row.wb-loading{font-style:italic}div.wunderbaum div.wb-node-list div.wb-row.wb-busy,div.wunderbaum div.wb-node-list div.wb-row i.wb-busy,div.wunderbaum div.wb-node-list div.wb-row .wb-col.wb-busy{font-style:italic;background:repeating-linear-gradient(45deg, transparent, transparent 3.88px, #dedede 3.88px, #dedede 7.78px);animation:wb-busy-animation 2s linear infinite}div.wunderbaum div.wb-node-list div.wb-row.wb-error,div.wunderbaum div.wb-node-list div.wb-row.wb-status-error{color:#b5373b}div.wunderbaum div.wb-header{position:sticky;height:22px;border-bottom:1px solid #56534c;padding:0;background-color:#dedede}div.wunderbaum div.wb-header span.wb-col{font-weight:bold;overflow:visible}div.wunderbaum div.wb-header span.wb-col-title{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}div.wunderbaum div.wb-header span.wb-col-resizer{position:absolute;top:0;right:-1px;width:3px;border:none;border-right:2px solid #56534c;height:100%;cursor:col-resize}div.wunderbaum span.wb-col{position:absolute;display:inline-block;overflow:hidden;height:20px;line-height:20px;padding:0 2px;border-right:1px solid #dedede;white-space:nowrap}div.wunderbaum span.wb-col:last-of-type{border-right:none}div.wunderbaum span.wb-node{user-select:none}div.wunderbaum span.wb-node i.wb-checkbox,div.wunderbaum span.wb-node i.wb-expander,div.wunderbaum span.wb-node i.wb-icon,div.wunderbaum span.wb-node i.wb-indent{height:20px;width:20px;padding:2px 2px;display:inline-block}div.wunderbaum span.wb-node i.bi::before{vertical-align:baseline}div.wunderbaum span.wb-node img.wb-icon{width:16px;height:16px;padding:2px 2px}div.wunderbaum span.wb-node i.wb-indent::before{content:"\00a0"}div.wunderbaum span.wb-node i.wb-expander.wb-spin,div.wunderbaum span.wb-node i.wb-icon.wb-spin{height:unset;width:unset;padding:0 3px;animation:wb-spin-animation 2s linear infinite}div.wunderbaum span.wb-node span.wb-title{min-width:1em;vertical-align:top;overflow-x:hidden;display:inline-block;white-space:nowrap;text-overflow:ellipsis}div.wunderbaum.wb-grid div.wb-header div.wb-row span.wb-col:hover{background-color:#c5c5c5}div.wunderbaum.wb-grid.wb-cell-mode div.wb-header div.wb-row span.wb-col.wb-active{background-color:#dceff8}div.wunderbaum.wb-grid div.wb-node-list div.wb-row{border-bottom-color:#dedede}div.wunderbaum.wb-grid div.wb-node-list div.wb-row:hover:not(.wb-active):not(.wb-selected){background-color:#f7fcfe}div.wunderbaum.wb-grid div.wb-node-list div.wb-row.wb-active{border-bottom-color:#70c0e7}div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col{border-right:1px solid #dedede}div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col input.wb-input-edit,div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="color"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="date"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="datetime"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="datetime-local"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="email"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="month"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="number"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="password"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="search"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="tel"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="text"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="time"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="url"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input[type="week"],div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>select{width:100%;max-height:20px;border:none}div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>input:focus,div.wunderbaum.wb-grid div.wb-node-list div.wb-row span.wb-col>select:focus{border:1px dashed #70c0e7}div.wunderbaum.wb-grid.wb-cell-mode div.wb-row:not(.wb-colspan) span.wb-col.wb-active{background-color:#f7fcfe}div.wunderbaum.wb-grid.wb-cell-mode div.wb-row:not(.wb-colspan).wb-active{background-color:#f7fcfe}div.wunderbaum.wb-grid.wb-cell-mode div.wb-row:not(.wb-colspan).wb-active span.wb-col.wb-active{background-color:#26a0da}div.wunderbaum.wb-grid.wb-alternate div.wb-node-list div.wb-row:nth-of-type(even):not(.wb-active):not(.wb-selected){background-color:#f7f7f7}div.wunderbaum.wb-grid.wb-alternate div.wb-node-list div.wb-row:nth-of-type(even):not(.wb-active):not(.wb-selected):hover{background-color:#f3f3f3}div.wunderbaum.wb-grid:not(:focus-within) div.wb-node-list div.wb-row,div.wunderbaum.wb-grid:not(:focus) div.wb-node-list div.wb-row{border-bottom-color:#dedede}div.wunderbaum.wb-ext-filter-dim div.wb-node-list div.wb-row,div.wunderbaum.wb-ext-filter-hide div.wb-node-list div.wb-row{color:#dedede}div.wunderbaum.wb-ext-filter-dim div.wb-node-list div.wb-row.wb-submatch,div.wunderbaum.wb-ext-filter-hide div.wb-node-list div.wb-row.wb-submatch{color:#868581}div.wunderbaum.wb-ext-filter-dim div.wb-node-list div.wb-row.wb-match,div.wunderbaum.wb-ext-filter-hide div.wb-node-list div.wb-row.wb-match{color:#56534c}div.wunderbaum div.wb-row.wb-drag-source{opacity:0.5}div.wunderbaum div.wb-row.wb-drag-source .wb-node{background-color:#d3d2ce}div.wunderbaum div.wb-row.wb-drop-target{overflow:visible}div.wunderbaum div.wb-row.wb-drop-target .wb-node{background-color:#d4ecf8;overflow:visible}div.wunderbaum div.wb-row.wb-drop-target .wb-node .wb-icon{position:relative;overflow:visible}div.wunderbaum div.wb-row.wb-drop-target .wb-node .wb-icon::after{position:absolute;z-index:1000;content:url(../docs/assets/drop_marker_16x32.png);left:0;top:3px}div.wunderbaum div.wb-row.wb-drop-target.wb-drop-before .wb-node .wb-icon::after{content:url(../docs/assets/drop_marker_insert_16x64.png);left:0;top:-8px}div.wunderbaum div.wb-row.wb-drop-target.wb-drop-after .wb-node .wb-icon::after{content:url(../docs/assets/drop_marker_insert_16x64.png);left:0;top:14px}div.wunderbaum.wb-rainbow i.wb-expander:nth-child(4n+1),div.wunderbaum.wb-rainbow i.wb-indent:nth-child(4n+1){background:#ffffe8}div.wunderbaum.wb-rainbow i.wb-expander:nth-child(4n+2),div.wunderbaum.wb-rainbow i.wb-indent:nth-child(4n+2){background:#f0fff0}div.wunderbaum.wb-rainbow i.wb-expander:nth-child(4n+3),div.wunderbaum.wb-rainbow i.wb-indent:nth-child(4n+3){background:#fff0ff}div.wunderbaum.wb-rainbow i.wb-expander:nth-child(4n+4),div.wunderbaum.wb-rainbow i.wb-indent:nth-child(4n+4){background:#eafdfd}div.wunderbaum.wb-fade-expander i.wb-expander{transition:color 1.5s;color:rgba(86,83,76,0)}div.wunderbaum.wb-fade-expander div.wb-row.wb-loading i.wb-expander,div.wunderbaum.wb-fade-expander:hover i.wb-expander,div.wunderbaum.wb-fade-expander:focus i.wb-expander,div.wunderbaum.wb-fade-expander:focus-within i.wb-expander,div.wunderbaum.wb-fade-expander [class*="wb-statusnode-"] i.wb-expander{transition:color 0.6s;color:#56534c}div.wunderbaum div.wb-row.wb-skeleton span.wb-title,div.wunderbaum div.wb-row.wb-skeleton i.wb-icon{animation:wb-skeleton-animation 1s linear infinite alternate;border-radius:0.25em;color:transparent;opacity:0.7}div.wunderbaum.wb-checkbox-auto-hide i.wb-checkbox{visibility:hidden}div.wunderbaum.wb-checkbox-auto-hide .wb-row:hover i.wb-checkbox,div.wunderbaum.wb-checkbox-auto-hide .wb-row.wb-selected i.wb-checkbox{visibility:unset}div.wunderbaum.wb-checkbox-auto-hide:focus .wb-row.wb-active i.wb-checkbox,div.wunderbaum.wb-checkbox-auto-hide:focus-within .wb-row.wb-active i.wb-checkbox{visibility:unset}.wb-helper-center{text-align:center}.wb-helper-disabled{color:#8c877c}.wb-helper-hidden{display:none}.wb-helper-invalid{color:#b5373b}.wb-helper-lazy-expander{color:#26a0da}.wb-helper-link{cursor:pointer}.wb-no-select{user-select:none;-webkit-user-select:none}.wb-no-select span.wb-title{user-select:contain;-webkit-user-select:contain}.wb-helper-start,.wb-helper-start>input{text-align:left}.wb-helper-end,.wb-helper-end>input{text-align:right}.wb-rtl .wb-helper-start,.wb-rtl .wb-helper-start>input{text-align:right}.wb-rtl .wb-helper-end,.wb-rtl .wb-helper-end>input{text-align:left}.wb-col input[type="checkbox"]:indeterminate{color:#8c877c;background-color:red}.wb-col input:invalid{color:#b5373b;background-color:#f5ddde}@keyframes wb-spin-animation{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes wb-skeleton-animation{0%{background-color:#a3b8c2}100%{background-color:#f0f3f5}}@keyframes wb-busy-animation{0%{background-position:0 0}100%{background-position:0 22px}}

package/dist/wunderbaum.d.ts

@@ -615,7 +615,7 @@ declare module "wb_node" {
      */
     import "./wunderbaum.scss";
     import { Wunderbaum } from "wunderbaum";
-    import { AddChildrenOptions, AddNodeType, ApplyCommandType, ChangeType, ExpandAllOptions, MakeVisibleOptions, MatcherCallback, NodeAnyCallback, NodeStatusType, NodeVisitCallback, NodeVisitResponse, ScrollIntoViewOptions, SetActiveOptions, SetExpandedOptions, SetSelectedOptions, SetStatusOptions } from "types";
+    import { AddChildrenOptions, AddNodeType, ApplyCommandType, ChangeType, ExpandAllOptions, MakeVisibleOptions, MatcherCallback, NodeAnyCallback, NodeStatusType, NodeStringCallback, NodeVisitCallback, NodeVisitResponse, ScrollIntoViewOptions, SetActiveOptions, SetExpandedOptions, SetSelectedOptions, SetStatusOptions } from "types";
     import { WbNodeData } from "wb_options";
     /**
      * A single tree node.
@@ -680,6 +680,18 @@ declare module "wb_node" {
          * @internal
          */
         toString(): string;
+        /**
+         * Iterate all descendant nodes depth-first, pre-order using `for ... of ...` syntax.
+         * More concise, but slightly slower than {@link WunderbaumNode.visit}.
+         *
+         * Example:
+         * ```js
+         * for(const n of node) {
+         *   ...
+         * }
+         * ```
+         */
+        [Symbol.iterator](): IterableIterator<WunderbaumNode>;
         /** Call event handler if defined in tree.options.
          * Example:
          * ```js
@@ -760,6 +772,28 @@ declare module "wb_node" {
          * @see {@link Wunderbaum.findRelatedNode|tree.findRelatedNode()}
          */
         findRelatedNode(where: string, includeHidden?: boolean): any;
+        /**
+         * Iterator version of {@link WunderbaumNode.format}.
+         */
+        format_iter(name_cb?: NodeStringCallback, connectors?: string[]): IterableIterator<string>;
+        /**
+         * Return multiline string representation of a node/subnode hierarchy.
+         * Mostly useful for debugging.
+         *
+         * Example:
+         * ```js
+         * console.info(tree.getActiveNode().format((n)=>n.title));
+         * ```
+         * logs
+         * ```
+         * Books
+         *  ├─ Art of War
+         *  ╰─ Don Quixote
+         * ...
+         * ```
+         * @see {@link WunderbaumNode.format_iter}
+         */
+        format(name_cb?: NodeStringCallback, connectors?: string[]): string;
         /** Return the `<span class='wb-col'>` element with a given index or id.
          * @returns {WunderbaumNode | null}
          */
@@ -897,7 +931,7 @@ declare module "wb_node" {
         /** Remove all HTML markup from the DOM. */
         removeMarkup(): void;
         protected _getRenderInfo(): any;
-        protected _createIcon(parentElem: HTMLElement, replaceChild?: HTMLElement): HTMLElement | null;
+        protected _createIcon(parentElem: HTMLElement, replaceChild: HTMLElement | null, showLoading: boolean): HTMLElement | null;
         /**
          * Create a whole new `<div class="wb-row">` element.
          * @see {@link WunderbaumNode.render}
@@ -919,11 +953,14 @@ declare module "wb_node" {
          *
          * `options.change` defaults to ChangeType.data, which updates the title,
          * icon, and status. It also triggers the `render` event, that lets the user
-         * create or update the content of embeded cell elements.<br>
+         * create or update the content of embeded cell elements.
          *
          * If only the status or other class-only modifications have changed,
          * `options.change` should be set to ChangeType.status instead for best
          * efficiency.
+         *
+         * Calling `setModified` instead may be a better alternative.
+         * @see {@link WunderbaumNode.setModified}
          */
         render(options?: any): void;
         /**
@@ -1006,7 +1043,7 @@ declare module "wb_node" {
          */
         triggerModify(operation: string, extra?: any): void;
         /**
-         * Call fn(node) for all child nodes in hierarchical order (depth-first).
+         * Call `callback(node)` for all child nodes in hierarchical order (depth-first, pre-order).
          *
          * Stop iteration, if fn() returns false. Skip current branch, if fn()
          * returns "skip".<br>
@@ -1015,6 +1052,7 @@ declare module "wb_node" {
          * @param {function} callback the callback function.
          *     Return false to stop iteration, return "skip" to skip this node and
          *     its children only.
+         * @see {@link WunderbaumNode.*[Symbol.iterator]}, {@link Wunderbaum.visit}.
          */
         visit(callback: NodeVisitCallback, includeSelf?: boolean): NodeVisitResponse;
         /** Call fn(node) for all parent nodes, bottom-up, including invisible system root.<br>
@@ -1054,6 +1092,7 @@ declare module "types" {
     /** When set as option, called when the value is needed (e.g. `icon` type definition). */
     export type BoolOrStringOptionResolver = (node: WunderbaumNode) => boolean | string;
     export type NodeAnyCallback = (node: WunderbaumNode) => any;
+    export type NodeStringCallback = (node: WunderbaumNode) => string;
     export type NodeVisitResponse = "skip" | boolean | void;
     export type NodeVisitCallback = (node: WunderbaumNode) => NodeVisitResponse;
     export interface WbTreeEventType {
@@ -1660,6 +1699,11 @@ declare module "wb_ext_dnd" {
     }
 }
 declare module "drag_observer" {
+    /*!
+     * Wunderbaum - drag_observer
+     * Copyright (c) 2021-2022, Martin Wendt. Released under the MIT license.
+     * @VERSION, @DATE (https://github.com/mar10/wunderbaum)
+     */
     export type DragCallbackArgType = {
         /** "dragstart", "drag", or "dragstop". */
         type: string;
@@ -1783,7 +1827,7 @@ declare module "wunderbaum" {
     import "./wunderbaum.scss";
     import * as util from "util";
     import { ExtensionsDict, WunderbaumExtension } from "wb_extension_base";
-    import { ApplyCommandType, ChangeType, ColumnDefinitionList, ExpandAllOptions, FilterModeType, MatcherCallback, NavigationOptions, NodeStatusType, NodeTypeDefinitions, ScrollToOptions, SetActiveOptions, SetStatusOptions, TargetType as NodeRegion } from "types";
+    import { ApplyCommandType, ChangeType, ColumnDefinitionList, ExpandAllOptions, FilterModeType, MatcherCallback, NavigationOptions, NodeStatusType, NodeStringCallback, NodeTypeDefinitions, ScrollToOptions, SetActiveOptions, SetStatusOptions, TargetType as NodeRegion } from "types";
     import { WunderbaumNode } from "wb_node";
     import { WunderbaumOptions } from "wb_options";
     /**
@@ -1868,6 +1912,18 @@ declare module "wunderbaum" {
          * Return a WunderbaumNode instance from element or event.
          */
         static getNode(el: Element | Event): WunderbaumNode | null;
+        /**
+         * Iterate all descendant nodes depth-first, pre-order using `for ... of ...` syntax.
+         * More concise, but slightly slower than {@link Wunderbaum.visit}.
+         *
+         * Example:
+         * ```js
+         * for(const node of tree) {
+         *   ...
+         * }
+         * ```
+         */
+        [Symbol.iterator](): IterableIterator<WunderbaumNode>;
         /** @internal */
         protected _registerExtension(extension: WunderbaumExtension): void;
         /** Called on tree (re)init after markup is created, before loading. */
@@ -2000,6 +2056,31 @@ declare module "wunderbaum" {
          * @param includeHidden Not yet implemented
          */
         findRelatedNode(node: WunderbaumNode, where: string, includeHidden?: boolean): any;
+        /**
+         * Iterator version of {@link Wunderbaum.format}.
+         */
+        format_iter(name_cb?: NodeStringCallback, connectors?: string[]): IterableIterator<string>;
+        /**
+         * Return multiline string representation of the node hierarchy.
+         * Mostly useful for debugging.
+         *
+         * Example:
+         * ```js
+         * console.info(tree.format((n)=>n.title));
+         * ```
+         * logs
+         * ```
+         * Playground
+         * ├─ Books
+         * |   ├─ Art of War
+         * |   ╰─ Don Quixote
+         * ├─ Music
+         * ...
+         * ```
+         *
+         * @see {@link Wunderbaum.format_iter} and {@link WunderbaumNode.format}.
+         */
+        format(name_cb?: NodeStringCallback, connectors?: string[]): string;
         /**
          * Return the active cell (`span.wb-col`) of the currently active node or null.
          */
@@ -2083,7 +2164,9 @@ declare module "wunderbaum" {
         setFocus(flag?: boolean): void;
         /** Schedule an update request to reflect a tree change. */
         setModified(change: ChangeType, options?: any): void;
-        /** Schedule an update request to reflect a single node modification. */
+        /** Schedule an update request to reflect a single node modification.
+         * @see {@link WunderbaumNode.setModified}
+         */
         setModified(change: ChangeType, node: WunderbaumNode, options?: any): void;
         /** Disable mouse and keyboard interaction (return prev. state). */
         setEnabled(flag?: boolean): boolean;
@@ -2132,7 +2215,8 @@ declare module "wunderbaum" {
         protected _updateViewportImmediately(): void;
         protected _updateRows(options?: any): boolean;
         /**
-         * Call callback(node) for all nodes in hierarchical order (depth-first).
+         * Call `callback(node)` for all nodes in hierarchical order (depth-first, pre-order).
+         * @see {@link Wunderbaum.*[Symbol.iterator]}, {@link WunderbaumNode.visit}.
          *
          * @param {function} callback the callback function.
          *     Return false to stop iteration, return "skip" to skip this node and