@cas-smartdesign/tree 4.0.3
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/LICENSE +8 -0
- package/dist/docs/3_lazy_loading.js +1 -0
- package/dist/docs/doc.css +1 -0
- package/dist/docs/doc.mjs +755 -0
- package/dist/docs/index.html +25 -0
- package/dist/src/checkbox-node.d.ts +9 -0
- package/dist/src/constants.d.ts +2 -0
- package/dist/src/loading-indicator.d.ts +14 -0
- package/dist/src/node.d.ts +43 -0
- package/dist/src/radio-button-node.d.ts +13 -0
- package/dist/src/tree-node.d.ts +44 -0
- package/dist/src/tree.d.ts +98 -0
- package/dist/src/types.d.ts +21 -0
- package/dist/src/utils.d.ts +9 -0
- package/dist/src/utils.spec.d.ts +1 -0
- package/dist/tree-with-externals.js +203 -0
- package/dist/tree-with-externals.js.map +7 -0
- package/dist/tree.d.ts +1 -0
- package/dist/tree.mjs +737 -0
- package/dist/tree.mjs.map +1 -0
- package/dist/vitest.config.d.mts +2 -0
- package/npm-third-party-licenses.json +192 -0
- package/package.json +44 -0
- package/readme.md +111 -0
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
|
7
|
+
<title>Tree</title>
|
|
8
|
+
<style>
|
|
9
|
+
.markdown-body {
|
|
10
|
+
box-sizing: border-box;
|
|
11
|
+
min-width: 200px;
|
|
12
|
+
max-width: 980px;
|
|
13
|
+
margin: 0 auto !important;
|
|
14
|
+
padding-bottom: 45px;
|
|
15
|
+
}
|
|
16
|
+
</style>
|
|
17
|
+
<script type="module" crossorigin src="./doc.mjs"></script>
|
|
18
|
+
<link rel="stylesheet" crossorigin href="./doc.css">
|
|
19
|
+
</head>
|
|
20
|
+
<body>
|
|
21
|
+
<div class="markdown-body">
|
|
22
|
+
<div id="markdown-container"></div>
|
|
23
|
+
</div>
|
|
24
|
+
</body>
|
|
25
|
+
</html>
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Node } from "./node";
|
|
2
|
+
declare class CheckboxNode extends Node {
|
|
3
|
+
constructor(id: string, text: string, path: string[], nodes: Node[]);
|
|
4
|
+
toggle(): void;
|
|
5
|
+
updateBranch(): void;
|
|
6
|
+
updateSelectionStateByChildren(): void;
|
|
7
|
+
private getFlattenedSubtree;
|
|
8
|
+
}
|
|
9
|
+
export { CheckboxNode };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { LitElement, TemplateResult } from "lit";
|
|
2
|
+
declare global {
|
|
3
|
+
interface HTMLElementTagNameMap {
|
|
4
|
+
[LoadingIndicator.ID]: LoadingIndicator;
|
|
5
|
+
}
|
|
6
|
+
}
|
|
7
|
+
export default class LoadingIndicator extends LitElement {
|
|
8
|
+
static readonly ID = "sd-tree-loading-indicator";
|
|
9
|
+
readonly: boolean;
|
|
10
|
+
depth: number;
|
|
11
|
+
static get styles(): import("lit").CSSResult[];
|
|
12
|
+
static ensureDefined: () => void;
|
|
13
|
+
render(): TemplateResult;
|
|
14
|
+
}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { NodeType, NodeSelectionState } from "./types";
|
|
2
|
+
import { CheckboxNode } from "./checkbox-node";
|
|
3
|
+
import { RadioButtonNode } from "./radio-button-node";
|
|
4
|
+
type NodeGetter = (path: string[]) => Node;
|
|
5
|
+
interface IParent {
|
|
6
|
+
nodes: Node[];
|
|
7
|
+
childCount: number;
|
|
8
|
+
expanded: boolean;
|
|
9
|
+
childrenType: NodeType;
|
|
10
|
+
}
|
|
11
|
+
declare abstract class Node implements IParent {
|
|
12
|
+
id: string;
|
|
13
|
+
text: string;
|
|
14
|
+
path: string[];
|
|
15
|
+
nodes: Node[];
|
|
16
|
+
type: NodeType;
|
|
17
|
+
depth: number;
|
|
18
|
+
selectionState: NodeSelectionState;
|
|
19
|
+
childCount: number;
|
|
20
|
+
expanded: boolean;
|
|
21
|
+
childrenType: NodeType;
|
|
22
|
+
parentSelectionAllowed: boolean;
|
|
23
|
+
lastLoadingChild: boolean;
|
|
24
|
+
loading: boolean;
|
|
25
|
+
disabled: boolean;
|
|
26
|
+
nodeGetter: NodeGetter;
|
|
27
|
+
getSiblings: () => Node[];
|
|
28
|
+
private parent;
|
|
29
|
+
constructor(id: string, text: string, path: string[], nodes: Node[]);
|
|
30
|
+
abstract toggle(): void;
|
|
31
|
+
abstract updateBranch(): void;
|
|
32
|
+
abstract updateSelectionStateByChildren(): void;
|
|
33
|
+
updateSelectionStateOfChildren(): void;
|
|
34
|
+
updateParent(): Node;
|
|
35
|
+
get parentNode(): Node | null;
|
|
36
|
+
check(): void;
|
|
37
|
+
uncheck(): void;
|
|
38
|
+
hasRadioButtonDescendant(): boolean;
|
|
39
|
+
}
|
|
40
|
+
declare const isCheckboxNode: (node: Node) => node is CheckboxNode;
|
|
41
|
+
declare const isRadioButtonNode: (node: Node) => node is RadioButtonNode;
|
|
42
|
+
export { Node, isCheckboxNode, isRadioButtonNode };
|
|
43
|
+
export type { NodeGetter, IParent };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Node } from "./node";
|
|
2
|
+
type RadioButtonNodeSelectionState = "unchecked" | "checked";
|
|
3
|
+
declare class RadioButtonNode extends Node {
|
|
4
|
+
constructor(id: string, text: string, path: string[], nodes: Node[]);
|
|
5
|
+
toggle(): void;
|
|
6
|
+
check(): void;
|
|
7
|
+
updateBranch(): void;
|
|
8
|
+
updateParent(): Node;
|
|
9
|
+
updateSelectionStateByChildren(): void;
|
|
10
|
+
private clearSiblings;
|
|
11
|
+
}
|
|
12
|
+
export { RadioButtonNode };
|
|
13
|
+
export type { RadioButtonNodeSelectionState };
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { LitElement } from "lit";
|
|
2
|
+
import type { IExpansion, ISelection, NodeType } from "./types";
|
|
3
|
+
import { Node } from "./node";
|
|
4
|
+
import type { NodeSelectionState } from "./types";
|
|
5
|
+
declare global {
|
|
6
|
+
interface HTMLElementTagNameMap {
|
|
7
|
+
[TreeNode.ID]: TreeNode;
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
export interface CustomEventMap extends HTMLElementEventMap {
|
|
11
|
+
selection: CustomEvent<ISelection>;
|
|
12
|
+
expansion: CustomEvent<IExpansion>;
|
|
13
|
+
}
|
|
14
|
+
export default interface TreeNode {
|
|
15
|
+
addEventListener<K extends keyof CustomEventMap>(event: K, listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null, options?: AddEventListenerOptions | boolean): void;
|
|
16
|
+
addEventListener(type: string, callback: EventListenerOrEventListenerObject | null, options?: AddEventListenerOptions | boolean): void;
|
|
17
|
+
removeEventListener<K extends keyof CustomEventMap>(type: K, listener: (this: this, ev: CustomEventMap[K]) => unknown, options?: boolean | EventListenerOptions): void;
|
|
18
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
19
|
+
dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;
|
|
20
|
+
}
|
|
21
|
+
export default class TreeNode extends LitElement {
|
|
22
|
+
static readonly ID = "sd-tree-node";
|
|
23
|
+
text: string;
|
|
24
|
+
expanded: boolean;
|
|
25
|
+
nodeId: string;
|
|
26
|
+
childCount: number;
|
|
27
|
+
focused: boolean;
|
|
28
|
+
readonly: boolean;
|
|
29
|
+
depth: number;
|
|
30
|
+
path: string[];
|
|
31
|
+
type: NodeType;
|
|
32
|
+
selectionState: NodeSelectionState;
|
|
33
|
+
disabled: boolean;
|
|
34
|
+
loading: boolean;
|
|
35
|
+
static get styles(): import("lit").CSSResult[];
|
|
36
|
+
static ensureDefined: () => void;
|
|
37
|
+
render(): import("lit").TemplateResult<1>;
|
|
38
|
+
toggle(): void;
|
|
39
|
+
expand(): void;
|
|
40
|
+
collapse(): void;
|
|
41
|
+
getState(parentPath?: string[]): Node;
|
|
42
|
+
private dispatchExpansionEvent;
|
|
43
|
+
private onSelectionChange;
|
|
44
|
+
}
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import { LitElement, PropertyValues, TemplateResult } from "lit";
|
|
2
|
+
import { IDataRequest, ScrollToAlignment, IExpansion, ISelection } from "./types";
|
|
3
|
+
import { Node } from "./node";
|
|
4
|
+
declare global {
|
|
5
|
+
interface HTMLElementTagNameMap {
|
|
6
|
+
[Tree.ID]: Tree;
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
export interface CustomEventMap extends HTMLElementEventMap {
|
|
10
|
+
"data-request": CustomEvent<IDataRequest>;
|
|
11
|
+
selection: CustomEvent<ISelection>;
|
|
12
|
+
expansion: CustomEvent<IExpansion>;
|
|
13
|
+
}
|
|
14
|
+
interface Tree {
|
|
15
|
+
addEventListener<K extends keyof CustomEventMap>(event: K, listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null, options?: AddEventListenerOptions | boolean): void;
|
|
16
|
+
addEventListener(type: string, callback: EventListenerOrEventListenerObject | null, options?: AddEventListenerOptions | boolean): void;
|
|
17
|
+
removeEventListener<K extends keyof CustomEventMap>(type: K, listener: (this: this, ev: CustomEventMap[K]) => unknown, options?: boolean | EventListenerOptions): void;
|
|
18
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
19
|
+
dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;
|
|
20
|
+
}
|
|
21
|
+
declare class Tree extends LitElement {
|
|
22
|
+
static readonly ID = "sd-tree";
|
|
23
|
+
static ensureDefined: () => void;
|
|
24
|
+
pageSize: number;
|
|
25
|
+
loadingText: string;
|
|
26
|
+
parentSelectionAllowed: boolean;
|
|
27
|
+
readonly: boolean;
|
|
28
|
+
private _resizeObserver;
|
|
29
|
+
private _lastKnownHeight;
|
|
30
|
+
private _lastKnownScrollTop;
|
|
31
|
+
private _lastRenderedScrollTop;
|
|
32
|
+
private _visibleItemsNum;
|
|
33
|
+
private _firstVisibleIndex;
|
|
34
|
+
private _lastVisibleIndex;
|
|
35
|
+
private _firstRenderedIndex;
|
|
36
|
+
private _lastRenderedIndex;
|
|
37
|
+
private _focusIndex;
|
|
38
|
+
private _flattenedNodes;
|
|
39
|
+
private _rootItemsLoading;
|
|
40
|
+
private _rootNodeCount;
|
|
41
|
+
private _loadedRootNodeCount;
|
|
42
|
+
private _allNodeCount;
|
|
43
|
+
private _nodeStates;
|
|
44
|
+
private _reusePreviousRenderData;
|
|
45
|
+
get rootNodeCount(): number;
|
|
46
|
+
set rootNodeCount(count: number);
|
|
47
|
+
get focusIndex(): number;
|
|
48
|
+
set focusIndex(index: number);
|
|
49
|
+
constructor();
|
|
50
|
+
setNodes(nodes: Node[]): void;
|
|
51
|
+
addNodes(nodes: Node[], parentPath?: string[]): void;
|
|
52
|
+
connectedCallback(): void;
|
|
53
|
+
disconnectedCallback(): void;
|
|
54
|
+
static get styles(): import("lit").CSSResult[];
|
|
55
|
+
firstUpdated(changedProperties: PropertyValues): void;
|
|
56
|
+
updated(changedProperties: PropertyValues): void;
|
|
57
|
+
render(): TemplateResult;
|
|
58
|
+
scrollToNode(index: number, alignment?: ScrollToAlignment): void;
|
|
59
|
+
private updateNodeMap;
|
|
60
|
+
private updateParentSelectionAllowed;
|
|
61
|
+
private updateNodes;
|
|
62
|
+
private getTopPosition;
|
|
63
|
+
private updateRenderData;
|
|
64
|
+
private needsFurtherData;
|
|
65
|
+
private nodeIndex;
|
|
66
|
+
private normalizeIndex;
|
|
67
|
+
private get height();
|
|
68
|
+
private requestData;
|
|
69
|
+
private onScroll;
|
|
70
|
+
private handleNodeExpansion;
|
|
71
|
+
private updateAfterExpansion;
|
|
72
|
+
private addSubtree;
|
|
73
|
+
private getFlattenedSubtree;
|
|
74
|
+
private removeSubtree;
|
|
75
|
+
private getNextNonDescendantIndex;
|
|
76
|
+
private handleKeyDown;
|
|
77
|
+
private handleNodeSelection;
|
|
78
|
+
private get focusedNode();
|
|
79
|
+
private toggleSelection;
|
|
80
|
+
private updateFlattenedNodes;
|
|
81
|
+
private getFlattenedNodeId;
|
|
82
|
+
private updateLastLoadingChild;
|
|
83
|
+
private setLastLoadingChildren;
|
|
84
|
+
private startLoadingIndicator;
|
|
85
|
+
private addPlaceholders;
|
|
86
|
+
private stopLoadingIndicator;
|
|
87
|
+
private removePlaceHolders;
|
|
88
|
+
private syncState;
|
|
89
|
+
private updateCount;
|
|
90
|
+
private getNodeCount;
|
|
91
|
+
private nodeGetter;
|
|
92
|
+
}
|
|
93
|
+
export { Tree };
|
|
94
|
+
export * from "./node";
|
|
95
|
+
export * from "./checkbox-node";
|
|
96
|
+
export * from "./radio-button-node";
|
|
97
|
+
export * from "./types";
|
|
98
|
+
export * from "./utils";
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export interface IFlattenedNode {
|
|
2
|
+
id: string;
|
|
3
|
+
}
|
|
4
|
+
export interface ILoadingNode {
|
|
5
|
+
depth: number;
|
|
6
|
+
}
|
|
7
|
+
export interface IDataRequest {
|
|
8
|
+
path: string[];
|
|
9
|
+
}
|
|
10
|
+
export interface IExpansion {
|
|
11
|
+
path: string[];
|
|
12
|
+
expanded: boolean;
|
|
13
|
+
}
|
|
14
|
+
export interface ISelection {
|
|
15
|
+
path: string[];
|
|
16
|
+
checked: boolean;
|
|
17
|
+
indeterminate?: boolean;
|
|
18
|
+
}
|
|
19
|
+
export type ScrollToAlignment = "auto" | "center" | "start" | "end";
|
|
20
|
+
export type NodeType = "checkbox" | "radio";
|
|
21
|
+
export type NodeSelectionState = "checked" | "unchecked" | "indeterminate";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { ScrollToAlignment, ILoadingNode } from "./types";
|
|
2
|
+
import { Node } from "./node";
|
|
3
|
+
export declare const flattenNodes: (arr: Node[], d?: number, depth?: number) => Node[];
|
|
4
|
+
export declare const findNodeByPath: (nodes: Node[], path: string[], depth?: number) => Node;
|
|
5
|
+
export declare const getOffsetForIndexAndAlignment: (index: number, alignment: ScrollToAlignment, scrollOffset: number, itemHeight: number, height: number, itemCount: number) => number;
|
|
6
|
+
export declare const isNode: (node: Node | ILoadingNode) => node is Node;
|
|
7
|
+
export declare const findNode: (nodes: (Node | ILoadingNode)[], path: string[]) => Node;
|
|
8
|
+
export declare const findNodeIndex: (nodes: (string | ILoadingNode)[], path: string[]) => number;
|
|
9
|
+
export declare const isFlattenedNode: (node: string | ILoadingNode) => node is string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
var window;(window||={})["@cas-smartdesign/tree"]=(()=>{var ge=Object.defineProperty;var ht=Object.getOwnPropertyDescriptor;var ct=Object.getOwnPropertyNames;var ut=Object.prototype.hasOwnProperty;var pt=(t,e)=>{for(var s in e)ge(t,s,{get:e[s],enumerable:!0})},ft=(t,e,s,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of ct(e))!ut.call(t,o)&&o!==s&&ge(t,o,{get:()=>e[o],enumerable:!(i=ht(e,o))||i.enumerable});return t};var gt=t=>ft(ge({},"__esModule",{value:!0}),t);var Xt={};pt(Xt,{CheckboxNode:()=>pe,Node:()=>se,RadioButtonNode:()=>fe,Tree:()=>dt,findNode:()=>Wt,findNodeByPath:()=>rt,findNodeIndex:()=>q,flattenNodes:()=>te,getOffsetForIndexAndAlignment:()=>at,isCheckboxNode:()=>it,isFlattenedNode:()=>$,isNode:()=>Ue,isRadioButtonNode:()=>ot});var ne=window,re=ne.ShadowRoot&&(ne.ShadyCSS===void 0||ne.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,ve=Symbol(),Te=new WeakMap,J=class{constructor(e,s,i){if(this._$cssResult$=!0,i!==ve)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=e,this.t=s}get styleSheet(){let e=this.o,s=this.t;if(re&&e===void 0){let i=s!==void 0&&s.length===1;i&&(e=Te.get(s)),e===void 0&&((this.o=e=new CSSStyleSheet).replaceSync(this.cssText),i&&Te.set(s,e))}return e}toString(){return this.cssText}},b=t=>new J(typeof t=="string"?t:t+"",void 0,ve),x=(t,...e)=>{let s=t.length===1?t[0]:e.reduce((i,o,n)=>i+(r=>{if(r._$cssResult$===!0)return r.cssText;if(typeof r=="number")return r;throw Error("Value passed to 'css' function must be a 'css' function result: "+r+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(o)+t[n+1],t[0]);return new J(s,t,ve)},be=(t,e)=>{re?t.adoptedStyleSheets=e.map(s=>s instanceof CSSStyleSheet?s:s.styleSheet):e.forEach(s=>{let i=document.createElement("style"),o=ne.litNonce;o!==void 0&&i.setAttribute("nonce",o),i.textContent=s.cssText,t.appendChild(i)})},ae=re?t=>t:t=>t instanceof CSSStyleSheet?(e=>{let s="";for(let i of e.cssRules)s+=i.cssText;return b(s)})(t):t;var me,de=window,ze=de.trustedTypes,vt=ze?ze.emptyScript:"",He=de.reactiveElementPolyfillSupport,ye={toAttribute(t,e){switch(e){case Boolean:t=t?vt:null;break;case Object:case Array:t=t==null?t:JSON.stringify(t)}return t},fromAttribute(t,e){let s=t;switch(e){case Boolean:s=t!==null;break;case Number:s=t===null?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t)}catch{s=null}}return s}},Ve=(t,e)=>e!==t&&(e==e||t==t),xe={attribute:!0,type:String,converter:ye,reflect:!1,hasChanged:Ve},_e="finalized",k=class extends HTMLElement{constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this._$Eu()}static addInitializer(e){var s;this.finalize(),((s=this.h)!==null&&s!==void 0?s:this.h=[]).push(e)}static get observedAttributes(){this.finalize();let e=[];return this.elementProperties.forEach((s,i)=>{let o=this._$Ep(i,s);o!==void 0&&(this._$Ev.set(o,i),e.push(o))}),e}static createProperty(e,s=xe){if(s.state&&(s.attribute=!1),this.finalize(),this.elementProperties.set(e,s),!s.noAccessor&&!this.prototype.hasOwnProperty(e)){let i=typeof e=="symbol"?Symbol():"__"+e,o=this.getPropertyDescriptor(e,i,s);o!==void 0&&Object.defineProperty(this.prototype,e,o)}}static getPropertyDescriptor(e,s,i){return{get(){return this[s]},set(o){let n=this[e];this[s]=o,this.requestUpdate(e,n,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)||xe}static finalize(){if(this.hasOwnProperty(_e))return!1;this[_e]=!0;let e=Object.getPrototypeOf(this);if(e.finalize(),e.h!==void 0&&(this.h=[...e.h]),this.elementProperties=new Map(e.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){let s=this.properties,i=[...Object.getOwnPropertyNames(s),...Object.getOwnPropertySymbols(s)];for(let o of i)this.createProperty(o,s[o])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(e){let s=[];if(Array.isArray(e)){let i=new Set(e.flat(1/0).reverse());for(let o of i)s.unshift(ae(o))}else e!==void 0&&s.push(ae(e));return s}static _$Ep(e,s){let i=s.attribute;return i===!1?void 0:typeof i=="string"?i:typeof e=="string"?e.toLowerCase():void 0}_$Eu(){var e;this._$E_=new Promise(s=>this.enableUpdating=s),this._$AL=new Map,this._$Eg(),this.requestUpdate(),(e=this.constructor.h)===null||e===void 0||e.forEach(s=>s(this))}addController(e){var s,i;((s=this._$ES)!==null&&s!==void 0?s:this._$ES=[]).push(e),this.renderRoot!==void 0&&this.isConnected&&((i=e.hostConnected)===null||i===void 0||i.call(e))}removeController(e){var s;(s=this._$ES)===null||s===void 0||s.splice(this._$ES.indexOf(e)>>>0,1)}_$Eg(){this.constructor.elementProperties.forEach((e,s)=>{this.hasOwnProperty(s)&&(this._$Ei.set(s,this[s]),delete this[s])})}createRenderRoot(){var e;let s=(e=this.shadowRoot)!==null&&e!==void 0?e:this.attachShadow(this.constructor.shadowRootOptions);return be(s,this.constructor.elementStyles),s}connectedCallback(){var e;this.renderRoot===void 0&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(e=this._$ES)===null||e===void 0||e.forEach(s=>{var i;return(i=s.hostConnected)===null||i===void 0?void 0:i.call(s)})}enableUpdating(e){}disconnectedCallback(){var e;(e=this._$ES)===null||e===void 0||e.forEach(s=>{var i;return(i=s.hostDisconnected)===null||i===void 0?void 0:i.call(s)})}attributeChangedCallback(e,s,i){this._$AK(e,i)}_$EO(e,s,i=xe){var o;let n=this.constructor._$Ep(e,i);if(n!==void 0&&i.reflect===!0){let r=(((o=i.converter)===null||o===void 0?void 0:o.toAttribute)!==void 0?i.converter:ye).toAttribute(s,i.type);this._$El=e,r==null?this.removeAttribute(n):this.setAttribute(n,r),this._$El=null}}_$AK(e,s){var i;let o=this.constructor,n=o._$Ev.get(e);if(n!==void 0&&this._$El!==n){let r=o.getPropertyOptions(n),l=typeof r.converter=="function"?{fromAttribute:r.converter}:((i=r.converter)===null||i===void 0?void 0:i.fromAttribute)!==void 0?r.converter:ye;this._$El=n,this[n]=l.fromAttribute(s,r.type),this._$El=null}}requestUpdate(e,s,i){let o=!0;e!==void 0&&(((i=i||this.constructor.getPropertyOptions(e)).hasChanged||Ve)(this[e],s)?(this._$AL.has(e)||this._$AL.set(e,s),i.reflect===!0&&this._$El!==e&&(this._$EC===void 0&&(this._$EC=new Map),this._$EC.set(e,i))):o=!1),!this.isUpdatePending&&o&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(s){Promise.reject(s)}let e=this.scheduleUpdate();return e!=null&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var e;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach((o,n)=>this[n]=o),this._$Ei=void 0);let s=!1,i=this._$AL;try{s=this.shouldUpdate(i),s?(this.willUpdate(i),(e=this._$ES)===null||e===void 0||e.forEach(o=>{var n;return(n=o.hostUpdate)===null||n===void 0?void 0:n.call(o)}),this.update(i)):this._$Ek()}catch(o){throw s=!1,this._$Ek(),o}s&&this._$AE(i)}willUpdate(e){}_$AE(e){var s;(s=this._$ES)===null||s===void 0||s.forEach(i=>{var o;return(o=i.hostUpdated)===null||o===void 0?void 0:o.call(i)}),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(e){return!0}update(e){this._$EC!==void 0&&(this._$EC.forEach((s,i)=>this._$EO(i,this[i],s)),this._$EC=void 0),this._$Ek()}updated(e){}firstUpdated(e){}};k[_e]=!0,k.elementProperties=new Map,k.elementStyles=[],k.shadowRootOptions={mode:"open"},He?.({ReactiveElement:k}),((me=de.reactiveElementVersions)!==null&&me!==void 0?me:de.reactiveElementVersions=[]).push("1.6.3");var Se,le=window,z=le.trustedTypes,Fe=z?z.createPolicy("lit-html",{createHTML:t=>t}):void 0,ke="$lit$",C=`lit$${(Math.random()+"").slice(9)}$`,Ye="?"+C,bt=`<${Ye}>`,L=document,W=()=>L.createComment(""),Y=t=>t===null||typeof t!="object"&&typeof t!="function",Qe=Array.isArray,mt=t=>Qe(t)||typeof t?.[Symbol.iterator]=="function",$e=`[
|
|
2
|
+
\f\r]`,G=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,je=/-->/g,qe=/>/g,N=RegExp(`>|${$e}(?:([^\\s"'>=/]+)(${$e}*=${$e}*(?:[^
|
|
3
|
+
\f\r"'\`<>=]|("|')|))|$)`,"g"),Ke=/'/g,Je=/"/g,Ze=/^(?:script|style|textarea|title)$/i,Xe=t=>(e,...s)=>({_$litType$:t,strings:e,values:s}),c=Xe(1),ns=Xe(2),B=Symbol.for("lit-noChange"),f=Symbol.for("lit-nothing"),Ge=new WeakMap,D=L.createTreeWalker(L,129,null,!1);function et(t,e){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return Fe!==void 0?Fe.createHTML(e):e}var xt=(t,e)=>{let s=t.length-1,i=[],o,n=e===2?"<svg>":"",r=G;for(let l=0;l<s;l++){let a=t[l],h,u,p=-1,v=0;for(;v<a.length&&(r.lastIndex=v,u=r.exec(a),u!==null);)v=r.lastIndex,r===G?u[1]==="!--"?r=je:u[1]!==void 0?r=qe:u[2]!==void 0?(Ze.test(u[2])&&(o=RegExp("</"+u[2],"g")),r=N):u[3]!==void 0&&(r=N):r===N?u[0]===">"?(r=o??G,p=-1):u[1]===void 0?p=-2:(p=r.lastIndex-u[2].length,h=u[1],r=u[3]===void 0?N:u[3]==='"'?Je:Ke):r===Je||r===Ke?r=N:r===je||r===qe?r=G:(r=N,o=void 0);let _=r===N&&t[l+1].startsWith("/>")?" ":"";n+=r===G?a+bt:p>=0?(i.push(h),a.slice(0,p)+ke+a.slice(p)+C+_):a+C+(p===-2?(i.push(void 0),l):_)}return[et(t,n+(t[s]||"<?>")+(e===2?"</svg>":"")),i]},Q=class t{constructor({strings:e,_$litType$:s},i){let o;this.parts=[];let n=0,r=0,l=e.length-1,a=this.parts,[h,u]=xt(e,s);if(this.el=t.createElement(h,i),D.currentNode=this.el.content,s===2){let p=this.el.content,v=p.firstChild;v.remove(),p.append(...v.childNodes)}for(;(o=D.nextNode())!==null&&a.length<l;){if(o.nodeType===1){if(o.hasAttributes()){let p=[];for(let v of o.getAttributeNames())if(v.endsWith(ke)||v.startsWith(C)){let _=u[r++];if(p.push(v),_!==void 0){let lt=o.getAttribute(_.toLowerCase()+ke).split(C),oe=/([.?@])?(.*)/.exec(_);a.push({type:1,index:n,name:oe[2],strings:lt,ctor:oe[1]==="."?Ce:oe[1]==="?"?Ae:oe[1]==="@"?Ie:V})}else a.push({type:6,index:n})}for(let v of p)o.removeAttribute(v)}if(Ze.test(o.tagName)){let p=o.textContent.split(C),v=p.length-1;if(v>0){o.textContent=z?z.emptyScript:"";for(let _=0;_<v;_++)o.append(p[_],W()),D.nextNode(),a.push({type:2,index:++n});o.append(p[v],W())}}}else if(o.nodeType===8)if(o.data===Ye)a.push({type:2,index:n});else{let p=-1;for(;(p=o.data.indexOf(C,p+1))!==-1;)a.push({type:7,index:n}),p+=C.length-1}n++}}static createElement(e,s){let i=L.createElement("template");return i.innerHTML=e,i}};function H(t,e,s=t,i){var o,n,r,l;if(e===B)return e;let a=i!==void 0?(o=s._$Co)===null||o===void 0?void 0:o[i]:s._$Cl,h=Y(e)?void 0:e._$litDirective$;return a?.constructor!==h&&((n=a?._$AO)===null||n===void 0||n.call(a,!1),h===void 0?a=void 0:(a=new h(t),a._$AT(t,s,i)),i!==void 0?((r=(l=s)._$Co)!==null&&r!==void 0?r:l._$Co=[])[i]=a:s._$Cl=a),a!==void 0&&(e=H(t,a._$AS(t,e.values),a,i)),e}var we=class{constructor(e,s){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=s}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){var s;let{el:{content:i},parts:o}=this._$AD,n=((s=e?.creationScope)!==null&&s!==void 0?s:L).importNode(i,!0);D.currentNode=n;let r=D.nextNode(),l=0,a=0,h=o[0];for(;h!==void 0;){if(l===h.index){let u;h.type===2?u=new Z(r,r.nextSibling,this,e):h.type===1?u=new h.ctor(r,h.name,h.strings,this,e):h.type===6&&(u=new Ee(r,this,e)),this._$AV.push(u),h=o[++a]}l!==h?.index&&(r=D.nextNode(),l++)}return D.currentNode=L,n}v(e){let s=0;for(let i of this._$AV)i!==void 0&&(i.strings!==void 0?(i._$AI(e,i,s),s+=i.strings.length-2):i._$AI(e[s])),s++}},Z=class t{constructor(e,s,i,o){var n;this.type=2,this._$AH=f,this._$AN=void 0,this._$AA=e,this._$AB=s,this._$AM=i,this.options=o,this._$Cp=(n=o?.isConnected)===null||n===void 0||n}get _$AU(){var e,s;return(s=(e=this._$AM)===null||e===void 0?void 0:e._$AU)!==null&&s!==void 0?s:this._$Cp}get parentNode(){let e=this._$AA.parentNode,s=this._$AM;return s!==void 0&&e?.nodeType===11&&(e=s.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,s=this){e=H(this,e,s),Y(e)?e===f||e==null||e===""?(this._$AH!==f&&this._$AR(),this._$AH=f):e!==this._$AH&&e!==B&&this._(e):e._$litType$!==void 0?this.g(e):e.nodeType!==void 0?this.$(e):mt(e)?this.T(e):this._(e)}k(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}$(e){this._$AH!==e&&(this._$AR(),this._$AH=this.k(e))}_(e){this._$AH!==f&&Y(this._$AH)?this._$AA.nextSibling.data=e:this.$(L.createTextNode(e)),this._$AH=e}g(e){var s;let{values:i,_$litType$:o}=e,n=typeof o=="number"?this._$AC(e):(o.el===void 0&&(o.el=Q.createElement(et(o.h,o.h[0]),this.options)),o);if(((s=this._$AH)===null||s===void 0?void 0:s._$AD)===n)this._$AH.v(i);else{let r=new we(n,this),l=r.u(this.options);r.v(i),this.$(l),this._$AH=r}}_$AC(e){let s=Ge.get(e.strings);return s===void 0&&Ge.set(e.strings,s=new Q(e)),s}T(e){Qe(this._$AH)||(this._$AH=[],this._$AR());let s=this._$AH,i,o=0;for(let n of e)o===s.length?s.push(i=new t(this.k(W()),this.k(W()),this,this.options)):i=s[o],i._$AI(n),o++;o<s.length&&(this._$AR(i&&i._$AB.nextSibling,o),s.length=o)}_$AR(e=this._$AA.nextSibling,s){var i;for((i=this._$AP)===null||i===void 0||i.call(this,!1,!0,s);e&&e!==this._$AB;){let o=e.nextSibling;e.remove(),e=o}}setConnected(e){var s;this._$AM===void 0&&(this._$Cp=e,(s=this._$AP)===null||s===void 0||s.call(this,e))}},V=class{constructor(e,s,i,o,n){this.type=1,this._$AH=f,this._$AN=void 0,this.element=e,this.name=s,this._$AM=o,this.options=n,i.length>2||i[0]!==""||i[1]!==""?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=f}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(e,s=this,i,o){let n=this.strings,r=!1;if(n===void 0)e=H(this,e,s,0),r=!Y(e)||e!==this._$AH&&e!==B,r&&(this._$AH=e);else{let l=e,a,h;for(e=n[0],a=0;a<n.length-1;a++)h=H(this,l[i+a],s,a),h===B&&(h=this._$AH[a]),r||(r=!Y(h)||h!==this._$AH[a]),h===f?e=f:e!==f&&(e+=(h??"")+n[a+1]),this._$AH[a]=h}r&&!o&&this.j(e)}j(e){e===f?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??"")}},Ce=class extends V{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===f?void 0:e}},yt=z?z.emptyScript:"",Ae=class extends V{constructor(){super(...arguments),this.type=4}j(e){e&&e!==f?this.element.setAttribute(this.name,yt):this.element.removeAttribute(this.name)}},Ie=class extends V{constructor(e,s,i,o,n){super(e,s,i,o,n),this.type=5}_$AI(e,s=this){var i;if((e=(i=H(this,e,s,0))!==null&&i!==void 0?i:f)===B)return;let o=this._$AH,n=e===f&&o!==f||e.capture!==o.capture||e.once!==o.once||e.passive!==o.passive,r=e!==f&&(o===f||n);n&&this.element.removeEventListener(this.name,this,o),r&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){var s,i;typeof this._$AH=="function"?this._$AH.call((i=(s=this.options)===null||s===void 0?void 0:s.host)!==null&&i!==void 0?i:this.element,e):this._$AH.handleEvent(e)}},Ee=class{constructor(e,s,i){this.element=e,this.type=6,this._$AN=void 0,this._$AM=s,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(e){H(this,e)}};var We=le.litHtmlPolyfillSupport;We?.(Q,Z),((Se=le.litHtmlVersions)!==null&&Se!==void 0?Se:le.litHtmlVersions=[]).push("2.8.0");var he=(t,e,s)=>{var i,o;let n=(i=s?.renderBefore)!==null&&i!==void 0?i:e,r=n._$litPart$;if(r===void 0){let l=(o=s?.renderBefore)!==null&&o!==void 0?o:null;n._$litPart$=r=new Z(e.insertBefore(W(),l),l,void 0,s??{})}return r._$AI(t),r};var Ne,De;var g=class extends k{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var e,s;let i=super.createRenderRoot();return(e=(s=this.renderOptions).renderBefore)!==null&&e!==void 0||(s.renderBefore=i.firstChild),i}update(e){let s=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=he(s,this.renderRoot,this.renderOptions)}connectedCallback(){var e;super.connectedCallback(),(e=this._$Do)===null||e===void 0||e.setConnected(!0)}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this._$Do)===null||e===void 0||e.setConnected(!1)}render(){return B}};g.finalized=!0,g._$litElement$=!0,(Ne=globalThis.litElementHydrateSupport)===null||Ne===void 0||Ne.call(globalThis,{LitElement:g});var tt=globalThis.litElementPolyfillSupport;tt?.({LitElement:g});((De=globalThis.litElementVersions)!==null&&De!==void 0?De:globalThis.litElementVersions=[]).push("3.3.3");var _t=(t,e)=>e.kind==="method"&&e.descriptor&&!("value"in e.descriptor)?{...e,finisher(s){s.createProperty(e.key,t)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:e.key,initializer(){typeof e.initializer=="function"&&(this[e.key]=e.initializer.call(this))},finisher(s){s.createProperty(e.key,t)}},St=(t,e,s)=>{e.constructor.createProperty(s,t)};function d(t){return(e,s)=>s!==void 0?St(t,e,s):_t(t,e)}var ce=t=>t??f;var $t=":host{display:inline-block;font-size:13px;line-height:20px;font-family:Segoe UI,Lucida Sans,Arial,sans-serif;color:#111;contain:content}:host([hidden]){display:none!important}:host([level=warn i]){color:#555}:host([level=suggest i]){color:#bf8800}:host([level=error i]){color:#cc0017}:host([level=warn]){color:#555}:host([level=suggest]){color:#bf8800}:host([level=error]){color:#cc0017}.icon{height:12px;width:12px;padding-right:4px;margin-bottom:-1px}",kt="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2012'%3e%3cstyle%20id='style3'%3e%20.st0{fill:%23fff}.st1{fill:%23c00}%20%3c/style%3e%3cg%20id='g5'%3e%3cpath%20class='st1'%20d='M6%20.9c2.8%200%205.1%202.3%205.1%205.1S8.8%2011.1%206%2011.1.9%208.8.9%206%203.2.9%206%20.9m0-1C2.7-.1-.1%202.7-.1%206s2.7%206.1%206.1%206.1%206.1-2.7%206.1-6.1S9.3-.1%206-.1z'%20id='path9'/%3e%3c/g%3e%3cg%20id='g11'%3e%3cpath%20class='st0'%20id='rect13'%20d='M5.5%202.5h1v4h-1z'/%3e%3cpath%20class='st1'%20d='M6%203v3-3m1-1H5v5h2V2z'%20id='path15'/%3e%3c/g%3e%3cg%20id='g17'%3e%3cpath%20class='st0'%20id='rect19'%20d='M5.5%208.5h1v1h-1z'/%3e%3cpath%20class='st1'%20id='polygon21'%20d='M7%208H5v2h2V8z'/%3e%3c/g%3e%3c/svg%3e",wt="data:image/svg+xml,%3csvg%20id='Ebene_1'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cstyle%3e%20.st0{fill:%23bf8800}%20%3c/style%3e%3cpath%20class='st0'%20d='M12%20.8l11%2019.8v1.3H1v-1.3L12%20.8zm.8-.6h-1.6L0%2020v3h24v-3L12.8.2z'/%3e%3cpath%20class='st0'%20d='M11%208h2v8h-2zm0%2010h2v2h-2z'/%3e%3c/svg%3e",Ct="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2012'%3e%3cpath%20class='st1'%20d='M6%20.9c2.8%200%205.1%202.3%205.1%205.1S8.8%2011.1%206%2011.1.9%208.8.9%206%203.2.9%206%20.9m0-1C2.7-.1-.1%202.7-.1%206s2.7%206.1%206.1%206.1%206.1-2.7%206.1-6.1S9.3-.1%206-.1z'%20fill='%23555'/%3e%3cpath%20d='M6%209V6v3m-1%201h2V5H5v5zm2-8H5v2h2z'%20class='st1'%20fill='%23555'/%3e%3c/svg%3e",At=Object.defineProperty,It=Object.getOwnPropertyDescriptor,Be=(t,e,s,i)=>{for(var o=i>1?void 0:i?It(e,s):e,n=t.length-1,r;n>=0;n--)(r=t[n])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&At(e,s,o),o},F,X=(F=class extends g{static parseLevel(t){if(t){let e=Object.keys(P).find(s=>s.toLowerCase()===t.toLowerCase());return e&&P[e]}}static get styles(){return[x`
|
|
4
|
+
${b($t)}
|
|
5
|
+
`]}render(){return c`${this.iconToUse&&c`<img class="icon" src="${this.iconToUse}">`}${this.message}`}get iconToUse(){return this.icon||this._defaultIconPath}shouldUpdate(t){return t.has("level")&&(this._defaultIconPath=this.iconForLevel,!this.icon)?!0:super.shouldUpdate(t)}get iconForLevel(){switch(F.parseLevel(this.level)){case"warn":return Ct;case"suggest":return wt;case"error":return kt;default:return null}}},F.ID="sd-field-validation-message",F.levelConverter={fromAttribute(t){return F.parseLevel(t)},toAttribute(t){return t&&t.toLowerCase()}},F);Be([d({type:String,attribute:!0})],X.prototype,"message",2);Be([d({type:String,attribute:!0})],X.prototype,"icon",2);Be([d({converter:X.levelConverter,reflect:!0})],X.prototype,"level",2);var Le=X,P=(t=>(t.Warn="warn",t.Suggest="suggest",t.Error="error",t))(P||{});customElements.get(Le.ID)||customElements.define(Le.ID,Le);var Et=`:host{display:block}:host,.label,.checkbox{outline:none}.checkbox-container{display:flex;flex-direction:row;align-items:flex-start}.checkbox{appearance:none;-moz-appearance:none;-webkit-appearance:none;display:block;margin:0;width:20px;height:20px;border:2px solid #767676;cursor:pointer;background-color:#fff}:host(:not([disabled]):focus) .highlight,:host(:not([disabled])[focused]) .highlight{background-color:#1467ba4d;border-radius:4px}:host(:not([disabled]):focus) .highlight .checkbox,:host(:not([disabled])[focused]) .highlight .checkbox{border-color:#1467ba}:host([checked]) .checkbox{background:#1467ba url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='15'%20height='15'%20viewBox='0%200%2020%2020'%3e%3cpath%20d='M15.9%204.6L17.4%206l-9.5%209.5-5.2-5.2%201.4-1.4%203.8%203.8%208-8.1z'%20fill='%23fff'/%3e%3c/svg%3e") no-repeat center center;border-color:#1467ba}.checkbox.indeterminate{background:#1467ba url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='32'%3e%3cpath%20fill='%23fff'%20d='M8%2014h16v4H8z'/%3e%3c/svg%3e") no-repeat center center;background-size:20px;border-color:#1467ba}.highlight{border:4px solid transparent;margin-right:6px}:host([disabled]) .checkbox-container{opacity:.6;cursor:default;filter:grayscale(100%);pointer-events:none}.validation-message{margin-left:4px}.label{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;margin-top:4px;line-height:20px}:host([oneline]) .label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}`,Nt=Object.defineProperty,Dt=Object.getOwnPropertyDescriptor,w=(t,e,s,i)=>{for(var o=i>1?void 0:i?Dt(e,s):e,n=t.length-1,r;n>=0;n--)(r=t[n])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Nt(e,s,o),o},Lt="indeterminate",Pe="delegatesFocus"in window.ShadowRoot.prototype,A,S=(A=class extends g{constructor(){super(...arguments),this._checked=!1,this._indeterminate=!1}get checked(){return this._checked}set checked(t){let e=this._checked;this._checked=t,this._checked&&(this.indeterminate=!1),this.requestUpdate("checked",e)}get indeterminate(){return this._indeterminate}set indeterminate(t){let e=this._indeterminate;this._indeterminate=t,this._indeterminate&&(this.checked=!1),this.requestUpdate("indeterminate",e)}firstUpdated(t){super.firstUpdated(t),Pe||(this.checkboxElement.onfocus=()=>this.setAttribute("focused",""),this.checkboxElement.onblur=()=>this.removeAttribute("focused"),this.addEventListener("focus",e=>{e.target===this&&this.checkboxElement.focus()}))}focus(){this.checkboxElement?this.checkboxElement.focus():super.focus()}attributeChangedCallback(t,e,s){super.attributeChangedCallback(t,e,s),!Pe&&t==="tabindex"&&e!==s&&s==="0"&&this.removeAttribute("tabindex")}render(){return c`
|
|
6
|
+
<div class="checkbox-container">
|
|
7
|
+
<div class="highlight">
|
|
8
|
+
<input
|
|
9
|
+
type="checkbox"
|
|
10
|
+
id="input"
|
|
11
|
+
?disabled=${this.disabled}
|
|
12
|
+
tabindex=${ce(this.tabIndex==null?void 0:this.tabIndex)}
|
|
13
|
+
.checked=${this.checked}
|
|
14
|
+
.indeterminate=${this.indeterminate}
|
|
15
|
+
class="checkbox${this.indeterminate?" "+Lt:""}"
|
|
16
|
+
@change="${this.onInputValueChange}"
|
|
17
|
+
/>
|
|
18
|
+
</div>
|
|
19
|
+
<label class="label" for="input">${this.label}</label>
|
|
20
|
+
</div>
|
|
21
|
+
${this.validationMessage&&c`
|
|
22
|
+
<sd-field-validation-message
|
|
23
|
+
class="validation-message"
|
|
24
|
+
.message=${this.validationMessage}
|
|
25
|
+
.icon=${this.validationIconSrc}
|
|
26
|
+
.level=${this.validationLevel}
|
|
27
|
+
>
|
|
28
|
+
</sd-field-validation-message>
|
|
29
|
+
`}
|
|
30
|
+
`}onInputValueChange(t){t.preventDefault(),t.stopPropagation(),this.checked=t.target.checked,this.fireValueChange()}fireValueChange(){this.dispatchEvent(new CustomEvent("value-change",{detail:{value:this.checked}}))}get checkboxElement(){return this.shadowRoot.querySelector(".checkbox")}static get styles(){return[x`
|
|
31
|
+
${b(Et)}
|
|
32
|
+
`]}},A.ID="sd-checkbox",A.ensureDefined=()=>{customElements.get(A.ID)||customElements.define(A.ID,A)},A.shadowRootOptions={...g.shadowRootOptions,delegatesFocus:Pe},A);w([d({type:Boolean,reflect:!0})],S.prototype,"disabled",2);w([d({type:String,reflect:!0})],S.prototype,"label",2);w([d({type:String})],S.prototype,"validationMessage",2);w([d({type:String})],S.prototype,"validationIconSrc",2);w([d({type:P,reflect:!0})],S.prototype,"validationLevel",2);w([d({type:Number})],S.prototype,"tabIndex",2);w([d({type:Boolean,reflect:!0})],S.prototype,"oneLine",2);w([d({type:Boolean,reflect:!0})],S.prototype,"checked",1);w([d({type:Boolean,reflect:!1,attribute:!1})],S.prototype,"indeterminate",1);var Re=S;Re.ensureDefined();var Bt=":host{display:block}:host,.label,.checkbox{outline:none}:host([disabled]){pointer-events:none}:host([disabled]) .root{opacity:.6;cursor:default;filter:grayscale(100%)}:host(:not([disabled])[focused]) .highlight{display:block!important}:host([checked]) circle.inner{display:block!important}:host([checked]) circle.outer{stroke:var(--sd-radio-button-checked-color, #1467ba)!important}.root{display:inline-flex;align-items:center;vertical-align:middle;width:100%;padding-top:6px;padding-bottom:6px}.root .radio-button-container{position:relative;display:inline-block;width:28px;height:28px;box-sizing:border-box;cursor:pointer;margin-right:5px;flex-shrink:0}.root .radio-button-container input{position:absolute;top:0;left:0;opacity:0}.root .radio-button-container circle.highlight{stroke:var(--sd-radio-button-highlight-color, rgba(20, 103, 186, .3))}.root .radio-button-container circle.inner{fill:var(--sd-radio-button-checked-color, #1467ba)}.root .radio-button-container circle.outer{stroke:var(--sd-radio-button-unchecked-color, #767676)}.root .label{font-family:Segoe UI,Lucida Sans,Arial,sans-serif;text-overflow:ellipsis;overflow-x:hidden;-webkit-user-select:none;user-select:none;cursor:pointer;padding-top:2px;padding-bottom:2px}",Pt=Object.defineProperty,Rt=Object.getOwnPropertyDescriptor,ue=(t,e,s,i)=>{for(var o=i>1?void 0:i?Rt(e,s):e,n=t.length-1,r;n>=0;n--)(r=t[n])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Pt(e,s,o),o},Ot=0,I,ee=(I=class extends g{constructor(){super(),this.checked=!1,this.value="",this.disabled=!1,this.label="",this.handleClick=t=>{t.preventDefault()},this.a11yID=I.ID+"_"+Ot++}static get styles(){return[x`
|
|
33
|
+
${b(Bt)}
|
|
34
|
+
`]}render(){return c`
|
|
35
|
+
<div class="root">
|
|
36
|
+
<div class="radio-button-container">
|
|
37
|
+
<input
|
|
38
|
+
type="radio"
|
|
39
|
+
id="${this.a11yID}"
|
|
40
|
+
.checked="${this.checked}"
|
|
41
|
+
?disabled="${this.disabled}"
|
|
42
|
+
@click="${this.handleClick}"
|
|
43
|
+
class="radio-button"
|
|
44
|
+
/>
|
|
45
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-14 -14 28 28">
|
|
46
|
+
<circle
|
|
47
|
+
class="highlight"
|
|
48
|
+
style="display:none"
|
|
49
|
+
r="11px"
|
|
50
|
+
fill="transparent"
|
|
51
|
+
stroke-width="6px"
|
|
52
|
+
></circle>
|
|
53
|
+
<circle class="inner" r="6px" style="display:none" stroke="none"></circle>
|
|
54
|
+
<circle class="outer" r="9px" fill="transparent" stroke-width="2px"></circle>
|
|
55
|
+
</svg>
|
|
56
|
+
</div>
|
|
57
|
+
<label class="label" for="${this.a11yID}" @click="${this.handleClick}">${this.label}</label>
|
|
58
|
+
</div>
|
|
59
|
+
`}},I.ID="sd-radio-button",I.ensureDefined=()=>{customElements.get(I.ID)||customElements.define(I.ID,I)},I);ue([d({type:Boolean,reflect:!0,attribute:!0})],ee.prototype,"checked",2);ue([d({type:String,reflect:!0,attribute:!0})],ee.prototype,"value",2);ue([d({type:Boolean,reflect:!0,attribute:!0})],ee.prototype,"disabled",2);ue([d({type:String,reflect:!0,attribute:!0})],ee.prototype,"label",2);var Oe=ee,Ut=":host(:focus){outline:none}.buttons-container{display:flex}.buttons-container.vertical{flex-direction:column}.validation-message{margin-left:5px}",Mt=Object.defineProperty,Tt=Object.getOwnPropertyDescriptor,O=(t,e,s,i)=>{for(var o=i>1?void 0:i?Tt(e,s):e,n=t.length-1,r;n>=0;n--)(r=t[n])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Mt(e,s,o),o},R,E=(R=class extends g{constructor(){super(...arguments),this.layout="horizontal",this.value="",this.uncheckAllowed=!1,this.disabled=!1,this._focusIndex=-1,this._checkedButton=null,this.handleSlotChange=()=>{this._buttons=this.buttonsSlot.assignedElements(),this._buttons.forEach(t=>{!t.hasAttribute("disabled")&&this.disabled&&t.setAttribute("disabled",""),t.setAttribute("tabIndex","-1"),this.updateCheckedButton(t)})},this.handleFocusIn=t=>{let e=t.target,s=this._buttons.findIndex(i=>i==e);this.focusIndex=this.focusIndex>=0?this.focusIndex:this.getNextFocusIndex(s!==-1?s:0),this.updateFocused(null,this._buttons[this.focusIndex])},this.handleFocusOut=()=>{this.updateFocused(this._buttons[this.focusIndex])},this.handleButtonClick=t=>{this.focus();let e=this._buttons.find(i=>i.contains(t.target)),s=this._buttons.findIndex(i=>i==e);s>=0&&(this.focusIndex=s,this.updateChecked())},this.handleKeyDown=t=>{let e=!0;switch(t.key){case"Down":case"ArrowDown":{let s=this.getNextFocusIndex(this.focusIndex+1);this.focusIndex=s!==-1?s:this.getNextFocusIndex(0),this.uncheckAllowed||this.updateChecked();break}case"Up":case"ArrowUp":{let s=this.getPreviousFocusIndex(this.focusIndex-1);this.focusIndex=s!==-1?s:this.getPreviousFocusIndex(this.childElementCount-1),this.uncheckAllowed||this.updateChecked();break}case"Enter":{this.updateChecked();break}default:e=!1}e&&(t.preventDefault(),t.stopPropagation())}}get focusIndex(){return this._focusIndex}set focusIndex(t){if(t>=-1&&t<this.childElementCount){let e=this._focusIndex;if(this._focusIndex=t,e!==t){let s=this._buttons[e],i=this._buttons[this.focusIndex];this.updateFocused(s,i)}}}firstUpdated(t){super.firstUpdated(t),this.buttonsSlot.addEventListener("slotchange",this.handleSlotChange),this.addEventListener("focusin",this.handleFocusIn),this.addEventListener("focusout",this.handleFocusOut),this.addEventListener("keydown",this.handleKeyDown)}updated(t){super.updated(t),t.has("disabled")&&(this.disabled?this.disableButtons():this.enableButtons())}static get styles(){return[x`
|
|
60
|
+
${b(Ut)}
|
|
61
|
+
`]}render(){return c`
|
|
62
|
+
<div
|
|
63
|
+
class="buttons-container ${this.layout==="vertical"?"vertical":"horizontal"}"
|
|
64
|
+
@click="${ce(this.disabled?void 0:this.handleButtonClick)}"
|
|
65
|
+
>
|
|
66
|
+
<slot></slot>
|
|
67
|
+
</div>
|
|
68
|
+
${this.validationMessage&&c`
|
|
69
|
+
<sd-field-validation-message
|
|
70
|
+
class="validation-message"
|
|
71
|
+
.message=${this.validationMessage}
|
|
72
|
+
.icon=${this.validationIconSrc}
|
|
73
|
+
.level=${this.validationLevel}
|
|
74
|
+
>
|
|
75
|
+
</sd-field-validation-message>
|
|
76
|
+
`}
|
|
77
|
+
`}updateCheckedButton(t){if(this._checkedButton&&this._checkedButton!==t)this.uncheckButton(t);else if(t.hasAttribute("checked")){this._checkedButton=t;let e=t.getAttribute("value");this.updateValue(e)}}disableButtons(){var t;(t=this._buttons)==null||t.forEach(e=>{e.setAttribute("disabled","")})}enableButtons(){var t;(t=this._buttons)==null||t.forEach(e=>{e.removeAttribute("disabled")})}fireValueChangeEvent(){this.dispatchEvent(new CustomEvent("value-change",{detail:{value:this.value,selectedIndex:this.selectedIndex}}))}getNextFocusIndex(t){for(let e=t;e<this.childElementCount;e++){let s=this._buttons[e];if(this.isFocusable(s))return e}return-1}getPreviousFocusIndex(t){for(let e=t;e>=0;e--){let s=this._buttons[e];if(this.isFocusable(s))return e}return-1}isFocusable(t){return!t.hasAttribute("disabled")}updateChecked(){let t=this._checkedButton,e=this._buttons[this.focusIndex];this._checkedButton=e,t&&t!==e&&this.uncheckButton(t),e&&this.toggleButton(e)}toggleButton(t){t.hasAttribute("checked")?this.uncheckAllowed&&(this.uncheckButton(t),this._checkedButton=null,this.updateValue("")):(this.checkButton(t),this.updateValue(t.getAttribute("value")))}updateValue(t){this.value=t,this.fireValueChangeEvent()}updateFocused(t,e){var s,i;(s=t?.removeAttribute)==null||s.call(t,"focused"),(i=e?.setAttribute)==null||i.call(e,"focused","")}checkButton(t){t.setAttribute("checked","")}uncheckButton(t){t.removeAttribute("checked")}get buttonsSlot(){return this.shadowRoot&&!this._buttonsSlot&&(this._buttonsSlot=this.shadowRoot.querySelector("slot")),this._buttonsSlot}get selectedIndex(){return this._buttons.indexOf(this._checkedButton)}},R.ID="sd-radio-button-group",R.ensureDefined=()=>{Oe.ensureDefined(),customElements.get(R.ID)||customElements.define(R.ID,R)},R);O([d({type:String,reflect:!0,attribute:!0})],E.prototype,"layout",2);O([d({type:String})],E.prototype,"value",2);O([d({type:Boolean,reflect:!0,attribute:"uncheck-allowed"})],E.prototype,"uncheckAllowed",2);O([d({type:Boolean,reflect:!0,attribute:!0})],E.prototype,"disabled",2);O([d({type:String})],E.prototype,"validationMessage",2);O([d({type:String})],E.prototype,"validationIconSrc",2);O([d({type:{fromAttribute(t){return t&&P[t.toLowerCase()]},toAttribute(t){return t&&t.toLowerCase()}},reflect:!0})],E.prototype,"validationLevel",2);var zt=E;zt.ensureDefined();var st=16,j=35,se=class{constructor(e,s,i,o){this.id=e,this.text=s,this.path=i,this.nodes=o,this.depth=0,this.selectionState="unchecked",this.expanded=!1,this.parentSelectionAllowed=!1,this.lastLoadingChild=!1,this.loading=!1,this.disabled=!1,this.parent=[],i?(this.depth=i.length-1,this.parent=i.slice(0,-1)):this.path=[e],this.childCount=o?o.length:0}updateSelectionStateOfChildren(){this.nodes.forEach(e=>{if(this.selectionState==="checked"){if(e.childrenType==="radio"||ot(e))return;e.selectionState="checked"}else this.selectionState==="unchecked"&&(e.selectionState="unchecked");e.updateSelectionStateOfChildren()})}updateParent(){let e=this.parentNode;return e&&(!this.parentSelectionAllowed||this.selectionState!=="unchecked"||e.disabled)&&(e.updateSelectionStateByChildren(),e.updateParent()),e}get parentNode(){return this.parent.length?this.nodeGetter(this.parent):null}check(){this.selectionState!=="checked"&&(this.selectionState="checked",this.updateBranch())}uncheck(){this.selectionState!=="unchecked"&&(this.selectionState="unchecked",this.updateBranch())}hasRadioButtonDescendant(){if(this.childrenType==="radio")return!0;for(let e of this.nodes)if(e.hasRadioButtonDescendant())return!0}},it=t=>t?.type==="checkbox",ot=t=>t?.type==="radio",pe=class extends se{constructor(e,s,i,o){super(e,s,i,o),this.type="checkbox"}toggle(){this.selectionState==="checked"?this.selectionState="unchecked":this.selectionState="checked",this.updateBranch()}updateBranch(){(!this.parentSelectionAllowed||this.selectionState==="unchecked")&&(this.updateSelectionStateOfChildren(),this.updateSelectionStateByChildren()),this.updateParent()}updateSelectionStateByChildren(){if(this.nodes.length===0)return;let e=this.nodes.map(i=>i.selectionState==="checked"||i.selectionState==="indeterminate"),s=e.some(Boolean);if(this.parentSelectionAllowed)this.selectionState=s?"checked":"unchecked";else{let i=e.every(Boolean),o=this.nodes.map(n=>n.selectionState).some(n=>n==="indeterminate");this.childrenType==="radio"?this.selectionState=s?"checked":"unchecked":o?this.selectionState="indeterminate":i?this.selectionState="checked":s?this.selectionState="indeterminate":this.selectionState="unchecked"}}getFlattenedSubtree(e){return e.reduce((s,i)=>s.concat(it(i)&&i.childCount>0&&i.expanded?[i,...this.getFlattenedSubtree(i.nodes)]:i),[])}},fe=class t extends se{constructor(e,s,i,o){super(e,s,i,o),this.type="radio"}toggle(){this.selectionState==="checked"?this.selectionState="unchecked":(this.selectionState="checked",this.clearSiblings()),this.updateBranch()}check(){this.selectionState!=="checked"&&(this.selectionState="checked",this.clearSiblings(),this.updateBranch())}updateBranch(){this.selectionState==="unchecked"&&this.updateSelectionStateOfChildren(),this.updateParent()}updateParent(){let e=super.updateParent();return e instanceof t&&e.clearSiblings(),e}updateSelectionStateByChildren(){this.nodes.length!==0&&(this.nodes.map(e=>e.selectionState==="checked").some(Boolean)?this.selectionState="checked":this.selectionState="unchecked")}clearSiblings(){this.getSiblings().forEach(e=>{e.uncheck()})}},Ht=`:host{width:100%;display:block;contain:layout;position:absolute}:host([readonly][focused]){background-color:#1467ba4d}.node{height:35px;display:flex;align-items:center}.node .expander,.node .placeholder{height:28px;width:30px;flex-shrink:0}.node .expander{cursor:pointer;background-position:center;background-size:24px;flex:0 0 auto}.node .expander.more{background-image:url("data:image/svg+xml,%3csvg%20height='32'%20viewBox='0%200%2032%2032'%20width='32'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='m15%2021%209.5-9.5%209.5%209.5'%20fill='none'%20stroke='%23999'%20stroke-linecap='square'%20stroke-width='2'%20transform='matrix(0%201%20-1%200%2032.25%20-8.25)'/%3e%3c/svg%3e")}.node .expander.less{background-image:url("data:image/svg+xml,%3csvg%20height='32'%20viewBox='0%200%2032%2032'%20width='32'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='m19.75%206.75%209.5%209.5-9.5%209.5'%20fill='none'%20stroke='%23999'%20stroke-linecap='square'%20stroke-width='2'%20transform='matrix(0%201%20-1%200%2032.25%20-8.25)'/%3e%3c/svg%3e")}.node .label{outline:none}.node .input{overflow:hidden}.node ul{list-style-type:none;margin:0;padding:0}`,Vt=Object.defineProperty,Ft=Object.getOwnPropertyDescriptor,y=(t,e,s,i)=>{for(var o=i>1?void 0:i?Ft(e,s):e,n=t.length-1,r;n>=0;n--)(r=t[n])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Vt(e,s,o),o},U,m=(U=class extends g{constructor(){super(...arguments),this.text="",this.expanded=!1,this.childCount=0,this.focused=!1,this.readonly=!1,this.depth=0,this.path=[],this.type="checkbox",this.selectionState="unchecked",this.disabled=!1,this.loading=!1,this.onSelectionChange=()=>{if(!this.readonly){if(this.type=="checkbox"){let t=this.shadowRoot.querySelector(".input");this.selectionState=t.checked?"checked":t.indeterminate?"indeterminate":"unchecked"}else{let t=this.shadowRoot.querySelector(".input");this.selectionState=t.checked?"checked":"unchecked"}this.updateComplete.then(()=>{this.dispatchEvent(new CustomEvent("selection",{detail:{path:this.path,checked:this.selectionState==="checked",indeterminate:this.selectionState==="indeterminate"},bubbles:!0,composed:!0}))})}}}static get styles(){return[x`
|
|
78
|
+
${b(Ht)}
|
|
79
|
+
`]}render(){let t=this.childCount>0||this.children.length>0;return c`
|
|
80
|
+
<li class="node" style="margin-left: ${this.depth*st}px">
|
|
81
|
+
${t?c` <div class="expander ${this.expanded?"less":"more"}" @click="${this.toggle}"></div> `:c` <div class="placeholder"></div> `}
|
|
82
|
+
${this.readonly?c` <div class="label">${this.text}</div> `:c`
|
|
83
|
+
${this.type==="checkbox"?c`
|
|
84
|
+
<sd-checkbox
|
|
85
|
+
class="input"
|
|
86
|
+
tabIndex="-1"
|
|
87
|
+
label="${this.text}"
|
|
88
|
+
?checked="${this.selectionState==="checked"}"
|
|
89
|
+
?focused="${this.focused}"
|
|
90
|
+
?disabled="${this.disabled}"
|
|
91
|
+
.indeterminate="${this.selectionState==="indeterminate"}"
|
|
92
|
+
@value-change="${this.onSelectionChange}"
|
|
93
|
+
oneline
|
|
94
|
+
></sd-checkbox>
|
|
95
|
+
`:c`
|
|
96
|
+
<sd-radio-button
|
|
97
|
+
class="input"
|
|
98
|
+
tabIndex="-1"
|
|
99
|
+
label="${this.text}"
|
|
100
|
+
?checked="${this.selectionState==="checked"}"
|
|
101
|
+
?focused="${this.focused}"
|
|
102
|
+
?disabled="${this.disabled}"
|
|
103
|
+
@click="${this.onSelectionChange}"
|
|
104
|
+
></sd-radio-button>
|
|
105
|
+
`}
|
|
106
|
+
`}
|
|
107
|
+
${t&&this.expanded?c`
|
|
108
|
+
<ul>
|
|
109
|
+
<slot></slot>
|
|
110
|
+
</ul>
|
|
111
|
+
`:""}
|
|
112
|
+
</li>
|
|
113
|
+
`}toggle(){this.loading||(this.expanded=!this.expanded,this.dispatchExpansionEvent())}expand(){if(!this.loading){let t=!this.expanded;this.expanded=!0,t&&this.dispatchExpansionEvent()}}collapse(){if(!this.loading){let t=this.expanded;this.expanded=!1,t&&this.dispatchExpansionEvent()}}getState(t){var e;let s=Array.isArray(t)?[...t,this.nodeId]:[this.nodeId],i=[...this.children].map(n=>n.getState(s)),o;return this.type==="checkbox"?o=new pe(this.nodeId,this.text,s,i):o=new fe(this.nodeId,this.text,s,i),o.selectionState=this.selectionState,o.childrenType=(e=i[0])==null?void 0:e.type,o.expanded=this.expanded,o.disabled=this.disabled,o}dispatchExpansionEvent(){this.dispatchEvent(new CustomEvent("expansion",{detail:{path:this.path,expanded:this.expanded},bubbles:!0,composed:!0}))}},U.ID="sd-tree-node",U.ensureDefined=()=>{Oe.ensureDefined(),Re.ensureDefined(),customElements.get(U.ID)||customElements.define(U.ID,U)},U);y([d({type:String,reflect:!0,attribute:!0})],m.prototype,"text",2);y([d({type:Boolean,reflect:!0,attribute:!0})],m.prototype,"expanded",2);y([d({type:String,reflect:!0,attribute:"node-id"})],m.prototype,"nodeId",2);y([d({type:Number,reflect:!0,attribute:"child-count"})],m.prototype,"childCount",2);y([d({type:Boolean,reflect:!0,attribute:!0})],m.prototype,"focused",2);y([d({type:Boolean,reflect:!0,attribute:!0})],m.prototype,"readonly",2);y([d({type:Number})],m.prototype,"depth",2);y([d({type:Array,attribute:!1})],m.prototype,"path",2);y([d({type:String,reflect:!0,attribute:!0})],m.prototype,"type",2);y([d({type:String,reflect:!0,attribute:"selection-state"})],m.prototype,"selectionState",2);y([d({type:Boolean,reflect:!0,attribute:!0})],m.prototype,"disabled",2);y([d({type:Boolean,reflect:!0,attribute:!0})],m.prototype,"loading",2);var jt=m,qt=":host{position:absolute;width:100%}:host([readonly]) li{padding-left:30px}li{height:35px;padding-left:34px}.text{vertical-align:middle;line-height:35px;font-family:Segoe UI,Lucida Sans,Arial,sans-serif;color:#111;font-size:16px}",Kt=Object.defineProperty,Jt=Object.getOwnPropertyDescriptor,nt=(t,e,s,i)=>{for(var o=i>1?void 0:i?Jt(e,s):e,n=t.length-1,r;n>=0;n--)(r=t[n])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Kt(e,s,o),o},M,Me=(M=class extends g{constructor(){super(...arguments),this.readonly=!1,this.depth=0}static get styles(){return[x`
|
|
114
|
+
${b(qt)}
|
|
115
|
+
`]}render(){return c`
|
|
116
|
+
<li class="root" style="margin-left: ${this.depth*st}px;">
|
|
117
|
+
<div class="text">
|
|
118
|
+
<slot>Loading...</slot>
|
|
119
|
+
</div>
|
|
120
|
+
</li>
|
|
121
|
+
`}},M.ID="sd-tree-loading-indicator",M.ensureDefined=()=>{customElements.get(M.ID)||customElements.define(M.ID,M)},M);nt([d({type:Boolean,reflect:!0,attribute:!0})],Me.prototype,"readonly",2);nt([d({type:Number})],Me.prototype,"depth",2);var Gt=Me,te=(t,e=1,s=0)=>e>0?t.reduce((i,o)=>i.concat(o.childCount>0&&o.expanded?[o,...te(o.nodes,e-1,s+1)]:o),[]):t.slice(),rt=(t,e,s=0)=>{if(!e)return null;let i=e[s],o=t.find(n=>n.id===i);return e.length-1===s?o:o?.nodes.length>0?rt(o.nodes,e,s+1):null},at=(t,e,s,i,o,n)=>{let r=Math.max(0,n*i),l=Math.min(r,t*i),a=Math.max(0,t*i-o+i);switch(e){case"start":return l;case"end":return a;case"center":{let h=Math.round(a+(l-a)/2);return h<Math.ceil(o/2)?0:h>r+Math.floor(o/2)?r:h}case"auto":default:return s>=a&&s<=l?s:s<a?a:l}},Ue=t=>t&&typeof t!="string",Wt=(t,e)=>{let s=t.find(i=>Ue(i)&&JSON.stringify(i.path)===JSON.stringify(e));return Ue(s)?s:null},q=(t,e)=>t.findIndex(s=>typeof s=="string"&&s===JSON.stringify(e)),$=t=>typeof t=="string",Yt=":host{display:block;position:relative;contain:layout;overflow:auto}:host(:focus){outline:none}ul{list-style-type:none;margin:0;padding:0}.root{width:100%}",Qt=Object.defineProperty,Zt=Object.getOwnPropertyDescriptor,ie=(t,e,s,i)=>{for(var o=i>1?void 0:i?Zt(e,s):e,n=t.length-1,r;n>=0;n--)(r=t[n])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Qt(e,s,o),o},T,K=(T=class extends g{constructor(){super(),this.pageSize=50,this.loadingText="Loading...",this.parentSelectionAllowed=!1,this.readonly=!1,this._lastKnownHeight=0,this._lastKnownScrollTop=0,this._lastRenderedScrollTop=0,this._visibleItemsNum=0,this._firstVisibleIndex=0,this._lastVisibleIndex=0,this._firstRenderedIndex=0,this._lastRenderedIndex=0,this._focusIndex=-1,this._flattenedNodes=[],this._rootItemsLoading=!1,this._rootNodeCount=0,this._loadedRootNodeCount=0,this._allNodeCount=0,this._nodeStates=new Map,this.onScroll=()=>{this._lastKnownScrollTop=this.scrollTop;let t=this._lastRenderedScrollTop-this._lastKnownScrollTop;Math.abs(t)>=j&&(this._lastRenderedScrollTop=this._lastKnownScrollTop,this.requestUpdate())},this.handleNodeExpansion=t=>{let{path:e,expanded:s}=t.detail;this.updateAfterExpansion(e,s)},this.handleKeyDown=t=>{let e=!0;switch(t.key){case"ArrowDown":{this.focusIndex=this.normalizeIndex(this.focusIndex+1);break}case"ArrowUp":{this.focusIndex=this.normalizeIndex(this.focusIndex-1);break}case"ArrowRight":{let s=this.focusedNode;if(s)if(s.childCount>0&&!s.expanded){let i=this.querySelector(`[node-id='${s.id}']`);i&&i.expand()}else this.focusIndex=this.normalizeIndex(this.focusIndex+1);break}case"ArrowLeft":{let s=this.focusedNode;if(s)if(s.childCount>0&&s.expanded){let i=this.querySelector(`[node-id='${s.id}']`);i&&i.collapse()}else this.focusIndex=this.normalizeIndex(this.focusIndex-1);break}case"Enter":{let s=this.focusedNode;s&&(this.toggleSelection(s.path),this.updateComplete.then(()=>{this.dispatchEvent(new CustomEvent("selection",{detail:{path:s.path,checked:s.selectionState==="checked",indeterminate:s.selectionState==="indeterminate"},bubbles:!0,composed:!0}))}));break}default:{e=!1;break}}e&&(t.preventDefault(),t.stopPropagation())},this.handleNodeSelection=t=>{if(t.target==this)return;this._reusePreviousRenderData=!0;let{path:e}=t.detail;this.focusIndex=q(this._flattenedNodes,e),this.focus(),this.toggleSelection(e),this.updateComplete.then(()=>{this._reusePreviousRenderData=!1})},this.getFlattenedNodeId=t=>JSON.stringify(t.path),this.nodeGetter=t=>t?this._nodeStates.get(JSON.stringify(t)):null,this._resizeObserver=new ResizeObserver(()=>{this._lastKnownHeight!==this.offsetHeight&&(this._lastKnownHeight=this.offsetHeight,this.requestUpdate())})}get rootNodeCount(){return this._rootNodeCount}set rootNodeCount(t){t===0?this._allNodeCount=0:t>0&&(this._allNodeCount+=t-this.rootNodeCount),this._rootNodeCount=t,this.requestUpdate()}get focusIndex(){return this._focusIndex}set focusIndex(t){if(t>=-1&&t<this._allNodeCount){let e=this._focusIndex;this._focusIndex=t,(t<=this._firstVisibleIndex||this._lastVisibleIndex<=t)&&this.scrollToNode(t),e!=t&&this.requestUpdate("focusIndex",e)}}setNodes(t){this.stopLoadingIndicator(),this.setLastLoadingChildren(t,this.rootNodeCount,t.length),t.forEach((e,s)=>{let i=[...t];i.splice(s,1),this.updateNodeMap(e,i)}),this.updateCount(t),this._loadedRootNodeCount=t.length,this._flattenedNodes=te(t,1/0).map(this.getFlattenedNodeId),this.requestUpdate()}addNodes(t,e){this.stopLoadingIndicator(e),t.forEach((i,o)=>{let n=[...t];n.splice(o,1),this.updateNodeMap(i,n)});let s=this.nodeGetter(e);s?s.expanded&&(this._allNodeCount+=t.length+this.getNodeCount(t)):this._loadedRootNodeCount+=t.length,this.updateFlattenedNodes(t,e),this.requestUpdate()}connectedCallback(){super.connectedCallback(),this._resizeObserver.observe(this)}disconnectedCallback(){super.disconnectedCallback(),this._resizeObserver.disconnect()}static get styles(){return[x`
|
|
122
|
+
${b(Yt)}
|
|
123
|
+
`]}firstUpdated(t){super.firstUpdated(t),this.addEventListener("scroll",this.onScroll),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("expansion",this.handleNodeExpansion),this.addEventListener("selection",this.handleNodeSelection),this.addEventListener("focus",()=>{this.focusIndex==-1&&(this.focusIndex=this.normalizeIndex(0))}),this._nodeStates.size===0&&(this.children.length>0?this.syncState():this.requestData())}updated(t){super.updated(t),this.updateNodes(),t.has("parentSelectionAllowed")&&this.updateParentSelectionAllowed()}render(){return this.updateRenderData(),c`
|
|
124
|
+
<div class="root" style="height: ${this._allNodeCount*j}px">
|
|
125
|
+
<ul>
|
|
126
|
+
<slot></slot>
|
|
127
|
+
</ul>
|
|
128
|
+
</div>
|
|
129
|
+
`}scrollToNode(t,e="auto"){this.scrollTop=at(this.normalizeIndex(t),e,this.scrollTop,j,this.height,this._allNodeCount)}updateNodeMap(t,e){t&&(t.nodeGetter=this.nodeGetter,t.getSiblings=()=>e,this._nodeStates.set(JSON.stringify(t.path),t),t.nodes.forEach((s,i)=>{let o=[...t.nodes];o.splice(i,1),this.updateNodeMap(s,o)}))}updateParentSelectionAllowed(){this._nodeStates.forEach(t=>{t.parentSelectionAllowed=this.parentSelectionAllowed})}updateNodes(){let t=this._flattenedNodes.slice(this._firstRenderedIndex,this._lastRenderedIndex+1);he(c`
|
|
130
|
+
${t.map((e,s)=>{let i=s+this._firstRenderedIndex,o=this.getTopPosition(i);if(!$(e))return c`
|
|
131
|
+
<sd-tree-loading-indicator .depth="${e.depth}" style="transform: translateY(${o}px)"
|
|
132
|
+
>${this.loadingText}</sd-tree-loading-indicator
|
|
133
|
+
>
|
|
134
|
+
`;let n=this._nodeStates.get(e),r=i===this.focusIndex,l=n.disabled;return this.parentSelectionAllowed||(l=l||n.hasRadioButtonDescendant()),c`
|
|
135
|
+
<sd-tree-node
|
|
136
|
+
text="${n.text}"
|
|
137
|
+
selection-state="${n.selectionState}"
|
|
138
|
+
.nodeId="${n.id}"
|
|
139
|
+
.depth="${n.depth}"
|
|
140
|
+
style="transform: translateY(${o}px);"
|
|
141
|
+
.path="${n.path}"
|
|
142
|
+
?focused="${r}"
|
|
143
|
+
?readonly="${this.readonly}"
|
|
144
|
+
type="${n.type}"
|
|
145
|
+
?expanded="${n.expanded}"
|
|
146
|
+
child-count="${n.childCount}"
|
|
147
|
+
?disabled="${l}"
|
|
148
|
+
.loading="${n.loading}"
|
|
149
|
+
></sd-tree-node>
|
|
150
|
+
`})}
|
|
151
|
+
`,this)}getTopPosition(t){return t*j}updateRenderData(){if(!this._reusePreviousRenderData)if(this._lastRenderedScrollTop=this.scrollTop,this._visibleItemsNum=Math.min(Math.ceil(this.height/j),this._allNodeCount),this._visibleItemsNum>0){this._firstVisibleIndex=this.normalizeIndex(Math.floor(this._lastRenderedScrollTop/j)),this._lastVisibleIndex=this.normalizeIndex(this._firstVisibleIndex+this._visibleItemsNum),this._firstRenderedIndex=this.normalizeIndex(this._firstVisibleIndex-2),this._lastRenderedIndex=this.normalizeIndex(this._lastVisibleIndex+2);for(let t of this._flattenedNodes.slice(this._firstRenderedIndex,this._lastRenderedIndex+1)){let e=$(t)&&this._nodeStates.get(t);if(e){if(e.lastLoadingChild){let s=e.parentNode;if(s){if(this.needsFurtherData(s)){this.requestData(s);break}}else if(this._loadedRootNodeCount<this.rootNodeCount&&!this._rootItemsLoading){this.requestData();break}}else if(this.needsFurtherData(e)){this.requestData(e);break}}}}else this._firstVisibleIndex=0,this._lastVisibleIndex=0,this._firstRenderedIndex=0,this._lastRenderedIndex=0}needsFurtherData(t){return t.expanded&&t.childCount>t.nodes.length&&this.nodeIndex(t.id)+t.nodes.length<this._lastRenderedIndex}nodeIndex(t){return this._flattenedNodes.findIndex(e=>e===t)}normalizeIndex(t){return Math.max(0,Math.min(t,this._allNodeCount-1))}get height(){return this.offsetHeight}requestData(t){if(!(t!=null&&t.loading)){let e=t?.path;this.startLoadingIndicator(e),this.dispatchEvent(new CustomEvent("data-request",{detail:{path:e}}))}}updateAfterExpansion(t,e){let s=this._nodeStates.get(JSON.stringify(t));if(s){s.expanded=e;let i=q(this._flattenedNodes,t),o=this._flattenedNodes[this.focusIndex];if(e){let n=this.addSubtree(s,i+1),r=s.childCount>s.nodes.length,l=i+s.nodes.length<this._lastRenderedIndex;r&&l&&this.requestData(s),this._allNodeCount+=n}else{let n=this.removeSubtree(i);this._allNodeCount-=n}if(o){let n=this._flattenedNodes.findIndex(r=>r==o);n!==this.focusIndex&&(this._focusIndex=n)}}this.requestUpdate()}addSubtree(t,e){let s=this.getFlattenedSubtree(t.nodes);return this._flattenedNodes.splice(e,0,...s),s.length}getFlattenedSubtree(t){return t.reduce((e,s)=>e.concat(s&&s.childCount>0&&s.expanded?[JSON.stringify(s.path),...this.getFlattenedSubtree(s.nodes)]:JSON.stringify(s.path)),[])}removeSubtree(t){let e=this.getNextNonDescendantIndex(t),s=0;return e!==-1?(s=e-t-1,this._flattenedNodes.splice(t+1,s)):(s=this._flattenedNodes.length-t-1,this._flattenedNodes.splice(t+1)),s}getNextNonDescendantIndex(t){let e=this._flattenedNodes[t],s=$(e)&&this._nodeStates.get(e);if(s)for(let i=t+1;i<this._flattenedNodes.length;i++){let o=this._flattenedNodes[i],n=$(o)&&this._nodeStates.get(o);if(n&&n.path.length<=s.path.length)return i}return-1}get focusedNode(){let t=this._flattenedNodes[this.focusIndex];return $(t)&&this._nodeStates.get(t)}toggleSelection(t){this.nodeGetter(t).toggle(),this.requestUpdate()}updateFlattenedNodes(t,e){if(e){let s=q(this._flattenedNodes,e),i=this._flattenedNodes[s];if($(i)){let o=this._nodeStates.get(i);if(o){let n=s+o.nodes.length+1,r=o.depth,l=te(t,1/0,r+1).map(this.getFlattenedNodeId);o.expanded&&this._flattenedNodes.splice(n,0,...l),o.nodes=[...o.nodes,...t],o.loading=!1,this.updateLastLoadingChild(o.nodes,l)}}}else{let s=te(t,1/0).map(this.getFlattenedNodeId);this.updateLastLoadingChild(this._flattenedNodes,s),this._flattenedNodes=[...this._flattenedNodes,...s]}}updateLastLoadingChild(t,e){let s=t[t.length-1],i=$(s)&&this._nodeStates.get(s),o=e[e.length-1],n=$(o)&&this._nodeStates.get(o);if(i&&(i.lastLoadingChild=!1),n){let r=n.parentNode;(r&&r.childCount>r.nodes.length||!r&&this.rootNodeCount>this._loadedRootNodeCount)&&(n.lastLoadingChild=!0)}}setLastLoadingChildren(t,e,s){if(s<e){let i=t[t.length-1];i&&(i.lastLoadingChild=!0)}t.forEach(i=>{this.setLastLoadingChildren(i.nodes,i.childCount,i.nodes.length)})}startLoadingIndicator(t){if(t){let e=this._nodeStates.get(JSON.stringify(t));if(e){let s=q(this._flattenedNodes,t);e.loading=!0,this.addPlaceholders(s,e)}}else this._rootItemsLoading=!0,this._flattenedNodes=[...this._flattenedNodes,...new Array(this.rootNodeCount-this._loadedRootNodeCount).fill({depth:0})];this.updateNodes()}addPlaceholders(t,e){let s=t+e.nodes.length+1,i=e.childCount-e.nodes.length;this._flattenedNodes.splice(s,0,...new Array(i).fill({depth:e.depth+1}))}stopLoadingIndicator(t){if(t){let e=this._nodeStates.get(JSON.stringify(t));if(e&&(e.loading=!1,e.expanded)){let s=q(this._flattenedNodes,t);this.removePlaceHolders(s,e)}}else{this._rootItemsLoading=!1;let e=this._flattenedNodes.findIndex(s=>!$(s));this._flattenedNodes.splice(e)}}removePlaceHolders(t,e){let s=t+e.nodes.length+1,i=e.childCount-e.nodes.length;this._flattenedNodes.splice(s,i)}syncState(){let t=[...this.children].map(e=>e.getState());this.addNodes(t),this.rootNodeCount=t.length,this.innerHTML=""}updateCount(t){this._allNodeCount=t.length+this.getNodeCount(t)}getNodeCount(t){let e=0;return t.forEach(s=>{s.expanded&&(e+=s.childCount+this.getNodeCount(s.nodes))}),e}},T.ID="sd-tree",T.ensureDefined=()=>{jt.ensureDefined(),Gt.ensureDefined(),customElements.get(T.ID)||customElements.define(T.ID,T)},T);ie([d({type:String})],K.prototype,"loadingText",2);ie([d({type:Boolean,reflect:!0,attribute:"parent-selection-allowed"})],K.prototype,"parentSelectionAllowed",2);ie([d({type:Boolean,reflect:!0,attribute:!0})],K.prototype,"readonly",2);ie([d({type:Number})],K.prototype,"rootNodeCount",1);ie([d({type:Number,attribute:"focus-index",reflect:!0})],K.prototype,"focusIndex",1);var dt=K;dt.ensureDefined();return gt(Xt);})();
|
|
152
|
+
/*! Bundled license information:
|
|
153
|
+
|
|
154
|
+
@lit/reactive-element/css-tag.js:
|
|
155
|
+
(**
|
|
156
|
+
* @license
|
|
157
|
+
* Copyright 2019 Google LLC
|
|
158
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
159
|
+
*)
|
|
160
|
+
|
|
161
|
+
@lit/reactive-element/reactive-element.js:
|
|
162
|
+
(**
|
|
163
|
+
* @license
|
|
164
|
+
* Copyright 2017 Google LLC
|
|
165
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
166
|
+
*)
|
|
167
|
+
|
|
168
|
+
lit-html/lit-html.js:
|
|
169
|
+
(**
|
|
170
|
+
* @license
|
|
171
|
+
* Copyright 2017 Google LLC
|
|
172
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
173
|
+
*)
|
|
174
|
+
|
|
175
|
+
lit-element/lit-element.js:
|
|
176
|
+
(**
|
|
177
|
+
* @license
|
|
178
|
+
* Copyright 2017 Google LLC
|
|
179
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
180
|
+
*)
|
|
181
|
+
|
|
182
|
+
lit-html/is-server.js:
|
|
183
|
+
(**
|
|
184
|
+
* @license
|
|
185
|
+
* Copyright 2022 Google LLC
|
|
186
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
187
|
+
*)
|
|
188
|
+
|
|
189
|
+
@lit/reactive-element/decorators/property.js:
|
|
190
|
+
(**
|
|
191
|
+
* @license
|
|
192
|
+
* Copyright 2017 Google LLC
|
|
193
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
194
|
+
*)
|
|
195
|
+
|
|
196
|
+
lit-html/directives/if-defined.js:
|
|
197
|
+
(**
|
|
198
|
+
* @license
|
|
199
|
+
* Copyright 2018 Google LLC
|
|
200
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
201
|
+
*)
|
|
202
|
+
*/
|
|
203
|
+
//# sourceMappingURL=tree-with-externals.js.map
|