@digital-realty/ix-dropdown-tree 1.0.2 → 1.0.4

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.
@@ -14,6 +14,13 @@ export class IxDropdownTree extends LitElement {
14
14
  const { node } = e.detail.message;
15
15
  node.expanded = !node.expanded;
16
16
  this.rootNode = newRootNode;
17
+ this.dispatchEvent(new CustomEvent('tree-node-toggle', {
18
+ detail: {
19
+ message: {
20
+ node,
21
+ },
22
+ },
23
+ }));
17
24
  this.requestUpdate();
18
25
  }
19
26
  onNodeButtonClick(e) {
@@ -31,7 +38,7 @@ export class IxDropdownTree extends LitElement {
31
38
  <ix-dropdown-tree-node
32
39
  .treeNode=${n}
33
40
  .level=${level}
34
- .expanded=${n.expanded ?? false}
41
+ .expanded=${n.expanded}
35
42
  .selected=${n.id === this.selectedId}
36
43
  @tree-node-select=${this.onSelect}
37
44
  @tree-node-toggle=${this.onToggle}
@@ -1 +1 @@
1
- {"version":3,"file":"IxDropdownTree.js","sourceRoot":"","sources":["../src/IxDropdownTree.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,4BAA4B,CAAC;AAEpC,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAEnE,MAAM,OAAO,cAAe,SAAQ,UAAU;IAA9C;;QAC8B,aAAQ,GAAa,EAAc,CAAC;QAInC,oBAAe,GAAY,KAAK,CAAC;IAoDhE,CAAC;IAlDS,QAAQ,CAAC,CAAc;QAC7B,MAAM,WAAW,GAAG,EAAE,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;QACzC,MAAM,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;QAClC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC;QAC5B,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAEO,iBAAiB,CAAC,CAAc;QACtC,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;YAC7B,MAAM,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE;SACjD,CAAC,CACH,CAAC;IACJ,CAAC;IAEO,QAAQ,CAAC,CAAc;QAC7B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,CAAC,CACxE,CAAC;IACJ,CAAC;IAED,WAAW,CAAC,QAAyB,EAAE,EAAE,QAAgB,CAAC;QACxD,MAAM,aAAa,GAA6B,EAAE,CAAC;QACnD,KAAK,MAAM,CAAC,IAAI,KAAK,EAAE,CAAC;YACtB,MAAM,YAAY,GAAG,IAAI,CAAA;;sBAET,CAAC;mBACJ,KAAK;sBACF,CAAC,CAAC,QAAQ,IAAI,KAAK;sBACnB,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC,UAAU;8BAChB,IAAI,CAAC,QAAQ;8BACb,IAAI,CAAC,QAAQ;8BACb,IAAI,CAAC,iBAAiB;6BACvB,IAAI,CAAC,eAAe;wBACzB,KAAK,KAAK,CAAC;gBACvB,CAAC,CAAC,qBAAqB,CAAC,WAAW;gBACnC,CAAC,CAAC,qBAAqB,CAAC,UAAU;;YAElC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO;;OAEnE,CAAC;YACF,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QACnC,CAAC;QACD,OAAO,aAAa,CAAC;IACvB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,SAAS,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC,SAAS,CAAC;IAC3E,CAAC;CACF;AAxD6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAqC;AAEpC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAgC;AAE9B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uDAAkC","sourcesContent":["import { LitElement, TemplateResult, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport './ix-dropdown-tree-node.js';\nimport { IxDropdownTreeNodeData as TreeNode } from './ix-dropdown-tree-types.js';\nimport { IxDropdownTreeTestIds } from './IxDropdownTreeTestIds.js';\n\nexport class IxDropdownTree extends LitElement {\n @property({ type: Object }) rootNode: TreeNode = {} as TreeNode;\n\n @property({ type: String }) selectedId: string | undefined;\n\n @property({ type: Boolean }) hasActionButton: boolean = false;\n\n private onToggle(e: CustomEvent) {\n const newRootNode = { ...this.rootNode };\n const { node } = e.detail.message;\n node.expanded = !node.expanded;\n this.rootNode = newRootNode;\n this.requestUpdate();\n }\n\n private onNodeButtonClick(e: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('node-action', {\n detail: { message: { id: e.detail.message.id } },\n }),\n );\n }\n\n private onSelect(e: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('select', { detail: { message: e.detail.message.id } }),\n );\n }\n\n renderNodes(nodes: Array<TreeNode> = [], level: number = 0) {\n const renderedNodes: Array<TemplateResult<1>> = [];\n for (const n of nodes) {\n const renderedNode = html`\n <ix-dropdown-tree-node\n .treeNode=${n}\n .level=${level}\n .expanded=${n.expanded ?? false}\n .selected=${n.id === this.selectedId}\n @tree-node-select=${this.onSelect}\n @tree-node-toggle=${this.onToggle}\n @tree-node-action=${this.onNodeButtonClick}\n ?hasActionButton=${this.hasActionButton}\n data-testid=${level === 0\n ? IxDropdownTreeTestIds.PARENT_NODE\n : IxDropdownTreeTestIds.CHILD_NODE}\n >\n ${n.expanded ? this.renderNodes(n.children, level + 1) : nothing}\n </ix-dropdown-tree-node>\n `;\n renderedNodes.push(renderedNode);\n }\n return renderedNodes;\n }\n\n render() {\n return html` <div>${this.renderNodes(this.rootNode.children, 0)}</div> `;\n }\n}\n"]}
1
+ {"version":3,"file":"IxDropdownTree.js","sourceRoot":"","sources":["../src/IxDropdownTree.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,4BAA4B,CAAC;AAEpC,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAEnE,MAAM,OAAO,cAAe,SAAQ,UAAU;IAA9C;;QAC8B,aAAQ,GAAa,EAAc,CAAC;QAInC,oBAAe,GAAY,KAAK,CAAC;IA6DhE,CAAC;IA3DS,QAAQ,CAAC,CAAc;QAC7B,MAAM,WAAW,GAAG,EAAE,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;QACzC,MAAM,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;QAClC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC;QAC5B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,kBAAkB,EAAE;YAClC,MAAM,EAAE;gBACN,OAAO,EAAE;oBACP,IAAI;iBACL;aACF;SACF,CAAC,CACH,CAAC;QACF,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAEO,iBAAiB,CAAC,CAAc;QACtC,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;YAC7B,MAAM,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE;SACjD,CAAC,CACH,CAAC;IACJ,CAAC;IAEO,QAAQ,CAAC,CAAc;QAC7B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,CAAC,CACxE,CAAC;IACJ,CAAC;IAED,WAAW,CAAC,QAAyB,EAAE,EAAE,QAAgB,CAAC;QACxD,MAAM,aAAa,GAA6B,EAAE,CAAC;QACnD,KAAK,MAAM,CAAC,IAAI,KAAK,EAAE,CAAC;YACtB,MAAM,YAAY,GAAG,IAAI,CAAA;;sBAET,CAAC;mBACJ,KAAK;sBACF,CAAC,CAAC,QAAQ;sBACV,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC,UAAU;8BAChB,IAAI,CAAC,QAAQ;8BACb,IAAI,CAAC,QAAQ;8BACb,IAAI,CAAC,iBAAiB;6BACvB,IAAI,CAAC,eAAe;wBACzB,KAAK,KAAK,CAAC;gBACvB,CAAC,CAAC,qBAAqB,CAAC,WAAW;gBACnC,CAAC,CAAC,qBAAqB,CAAC,UAAU;;YAElC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO;;OAEnE,CAAC;YACF,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QACnC,CAAC;QACD,OAAO,aAAa,CAAC;IACvB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,SAAS,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC,SAAS,CAAC;IAC3E,CAAC;CACF;AAjE6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAqC;AAEpC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAgC;AAE9B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uDAAkC","sourcesContent":["import { LitElement, TemplateResult, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport './ix-dropdown-tree-node.js';\nimport { IxDropdownTreeNodeData as TreeNode } from './ix-dropdown-tree-types.js';\nimport { IxDropdownTreeTestIds } from './IxDropdownTreeTestIds.js';\n\nexport class IxDropdownTree extends LitElement {\n @property({ type: Object }) rootNode: TreeNode = {} as TreeNode;\n\n @property({ type: String }) selectedId: string | undefined;\n\n @property({ type: Boolean }) hasActionButton: boolean = false;\n\n private onToggle(e: CustomEvent) {\n const newRootNode = { ...this.rootNode };\n const { node } = e.detail.message;\n node.expanded = !node.expanded;\n this.rootNode = newRootNode;\n this.dispatchEvent(\n new CustomEvent('tree-node-toggle', {\n detail: {\n message: {\n node,\n },\n },\n }),\n );\n this.requestUpdate();\n }\n\n private onNodeButtonClick(e: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('node-action', {\n detail: { message: { id: e.detail.message.id } },\n }),\n );\n }\n\n private onSelect(e: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('select', { detail: { message: e.detail.message.id } }),\n );\n }\n\n renderNodes(nodes: Array<TreeNode> = [], level: number = 0) {\n const renderedNodes: Array<TemplateResult<1>> = [];\n for (const n of nodes) {\n const renderedNode = html`\n <ix-dropdown-tree-node\n .treeNode=${n}\n .level=${level}\n .expanded=${n.expanded}\n .selected=${n.id === this.selectedId}\n @tree-node-select=${this.onSelect}\n @tree-node-toggle=${this.onToggle}\n @tree-node-action=${this.onNodeButtonClick}\n ?hasActionButton=${this.hasActionButton}\n data-testid=${level === 0\n ? IxDropdownTreeTestIds.PARENT_NODE\n : IxDropdownTreeTestIds.CHILD_NODE}\n >\n ${n.expanded ? this.renderNodes(n.children, level + 1) : nothing}\n </ix-dropdown-tree-node>\n `;\n renderedNodes.push(renderedNode);\n }\n return renderedNodes;\n }\n\n render() {\n return html` <div>${this.renderNodes(this.rootNode.children, 0)}</div> `;\n }\n}\n"]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Webcomponent ix-dropdown-tree following open-wc recommendations",
4
4
  "license": "MIT",
5
5
  "author": "ix-dropdown-tree",
6
- "version": "1.0.2",
6
+ "version": "1.0.4",
7
7
  "type": "module",
8
8
  "main": "dist/index.js",
9
9
  "module": "dist/index.js",
@@ -27,7 +27,7 @@
27
27
  "test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\""
28
28
  },
29
29
  "dependencies": {
30
- "@digital-realty/ix-icon-button": "^1.1.6",
30
+ "@digital-realty/ix-icon-button": "^1.1.8",
31
31
  "lit": "^3.1.4"
32
32
  },
33
33
  "devDependencies": {
@@ -38,7 +38,7 @@
38
38
  "@typescript-eslint/eslint-plugin": "^7.16.0",
39
39
  "@typescript-eslint/parser": "^7.16.0",
40
40
  "@web/dev-server": "^0.4.6",
41
- "@web/test-runner": "^0.18.2",
41
+ "@web/test-runner": "^0.20.2",
42
42
  "concurrently": "^8.2.2",
43
43
  "eslint": "^8.57.0",
44
44
  "eslint-config-prettier": "^9.1.0",
@@ -90,5 +90,5 @@
90
90
  "README.md",
91
91
  "LICENSE"
92
92
  ],
93
- "gitHead": "f19908b2ba8f2d9273559982f0417f724466ae5c"
93
+ "gitHead": "efb86e89e9bfdb5a9a797dd223331ad6455b692c"
94
94
  }