Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@creately/ngx-treeview

Package Overview
Dependencies
Maintainers
7
Versions
11
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@creately/ngx-treeview - npm Package Compare versions

Comparing version 6.0.10 to 6.0.11

2

package.json
{
"name": "@creately/ngx-treeview",
"version": "6.0.10",
"version": "6.0.11",
"license": "MIT",

@@ -5,0 +5,0 @@ "description": "An Angular treeview component with checkbox",

@@ -235,3 +235,3 @@ var __extends = (this && this.__extends) || (function () {

selector: 'ngx-treeview',
template: "\n <ng-template #defaultItemTemplate let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\" let-onCheckedChange=\"onCheckedChange\">\n <div class=\"form-inline row-item\">\n <i *ngIf=\"item.children\" (click)=\"onCollapseExpand()\" aria-hidden=\"true\" class=\"fa\" [class.fa-caret-right]=\"item.collapsed\"\n [class.fa-caret-down]=\"!item.collapsed\"></i>\n <div class=\"form-check form-input-wrapper\">\n <input type=\"checkbox\" class=\"form-check-input\" [(ngModel)]=\"item.checked\" (ngModelChange)=\"onCheckedChange()\"\n [disabled]=\"item.disabled\" [indeterminate]=\"item.indeterminate\" />\n <span class=\"form-custom-checkbox\"></span>\n <label class=\"form-check-label\" (click)=\"!item.disableItemCheck && (item.checked = !item.checked); !item.disableChildrenCheck && onCheckedChange(); onCollapseExpand()\">\n {{item.text}}\n </label>\n </div>\n </div>\n </ng-template>\n <ng-template #defaultHeaderTemplate let-config=\"config\" let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\"\n let-onCheckedChange=\"onCheckedChange\" let-onFilterTextChange=\"onFilterTextChange\">\n <div *ngIf=\"config.hasFilter\" class=\"row row-filter\">\n <div class=\"col-12\">\n <input class=\"form-control\" type=\"text\" [placeholder]=\"i18n.getFilterPlaceholder()\" [(ngModel)]=\"filterText\"\n (ngModelChange)=\"onFilterTextChange($event)\" />\n </div>\n </div>\n <div *ngIf=\"hasFilterItems\">\n <div *ngIf=\"config.hasAllCheckBox || config.hasCollapseExpand\" class=\"row row-all\">\n <div class=\"col-12\">\n <div class=\"form-check form-check-inline\" *ngIf=\"config.hasAllCheckBox\">\n <input type=\"checkbox\" class=\"form-check-input\" [(ngModel)]=\"item.checked\" (ngModelChange)=\"onCheckedChange()\"\n [indeterminate]=\"item.indeterminate\" />\n <label class=\"form-check-label\" (click)=\"item.checked = !item.checked; onCheckedChange()\">\n {{i18n.getAllCheckboxText()}}\n </label>\n </div>\n <label *ngIf=\"config.hasCollapseExpand\" class=\"pull-right form-check-label\" (click)=\"onCollapseExpand()\">\n <i [title]=\"i18n.getTooltipCollapseExpandText(item.collapsed)\" aria-hidden=\"true\" class=\"fa treeview-arrow\"\n [class.fa-expand]=\"item.collapsed\" [class.fa-compress]=\"!item.collapsed\">\n <img src=\"./assets/images/decoratives/expand-arrow.svg\" width=\"18\">\n </i>\n </label>\n </div>\n </div>\n <div *ngIf=\"config.hasDivider\" class=\"dropdown-divider\"></div>\n </div>\n </ng-template>\n <div class=\"treeview-header\">\n <ng-template [ngTemplateOutlet]=\"headerTemplate || defaultHeaderTemplate\" [ngTemplateOutletContext]=\"headerTemplateContext\">\n </ng-template>\n </div>\n <div [ngSwitch]=\"hasFilterItems\">\n <div *ngSwitchCase=\"true\" class=\"treeview-container\" [style.max-height.px]=\"maxHeight\">\n <ngx-treeview-item *ngFor=\"let item of filterItems\" [config]=\"config\" [item]=\"item\" [template]=\"itemTemplate || defaultItemTemplate\"\n (checkedChange)=\"onItemCheckedChange(item, $event)\">\n </ngx-treeview-item>\n </div>\n <div *ngSwitchCase=\"false\" class=\"treeview-text\">\n {{i18n.getFilterNoItemsFoundText()}}\n </div>\n </div>\n ",
template: "\n <ng-template #defaultItemTemplate let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\" let-onCheckedChange=\"onCheckedChange\">\n <div class=\"form-inline row-item\">\n <i *ngIf=\"item.children\" (click)=\"onCollapseExpand()\" aria-hidden=\"true\" class=\"fa treeview-arrow\"\n [class.fa-caret-right]=\"item.collapsed\"\n [class.fa-caret-down]=\"!item.collapsed\">\n <img src=\"./assets/images/decoratives/expand-arrow.svg\" width=\"18\">\n </i>\n <div class=\"form-check form-input-wrapper\">\n <input type=\"checkbox\" class=\"form-check-input\" [(ngModel)]=\"item.checked\" (ngModelChange)=\"onCheckedChange()\"\n [disabled]=\"item.disabled\" [indeterminate]=\"item.indeterminate\" />\n <span class=\"form-custom-checkbox\"></span>\n <label class=\"form-check-label\" (click)=\"!item.disableItemCheck && (item.checked = !item.checked); !item.disableChildrenCheck && onCheckedChange(); onCollapseExpand()\">\n {{item.text}}\n </label>\n </div>\n </div>\n </ng-template>\n <ng-template #defaultHeaderTemplate let-config=\"config\" let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\"\n let-onCheckedChange=\"onCheckedChange\" let-onFilterTextChange=\"onFilterTextChange\">\n <div *ngIf=\"config.hasFilter\" class=\"row row-filter\">\n <div class=\"col-12\">\n <input class=\"form-control\" type=\"text\" [placeholder]=\"i18n.getFilterPlaceholder()\" [(ngModel)]=\"filterText\"\n (ngModelChange)=\"onFilterTextChange($event)\" />\n </div>\n </div>\n <div *ngIf=\"hasFilterItems\">\n <div *ngIf=\"config.hasAllCheckBox || config.hasCollapseExpand\" class=\"row row-all\">\n <div class=\"col-12\">\n <div class=\"form-check form-check-inline\" *ngIf=\"config.hasAllCheckBox\">\n <input type=\"checkbox\" class=\"form-check-input\" [(ngModel)]=\"item.checked\" (ngModelChange)=\"onCheckedChange()\"\n [indeterminate]=\"item.indeterminate\" />\n <label class=\"form-check-label\" (click)=\"item.checked = !item.checked; onCheckedChange()\">\n {{i18n.getAllCheckboxText()}}\n </label>\n </div>\n <label *ngIf=\"config.hasCollapseExpand\" class=\"pull-right form-check-label\" (click)=\"onCollapseExpand()\">\n <i [title]=\"i18n.getTooltipCollapseExpandText(item.collapsed)\" aria-hidden=\"true\" class=\"fa treeview-arrow\"\n [class.fa-expand]=\"item.collapsed\" [class.fa-compress]=\"!item.collapsed\">\n <img src=\"./assets/images/decoratives/expand-arrow.svg\" width=\"18\">\n </i>\n </label>\n </div>\n </div>\n <div *ngIf=\"config.hasDivider\" class=\"dropdown-divider\"></div>\n </div>\n </ng-template>\n <div class=\"treeview-header\">\n <ng-template [ngTemplateOutlet]=\"headerTemplate || defaultHeaderTemplate\" [ngTemplateOutletContext]=\"headerTemplateContext\">\n </ng-template>\n </div>\n <div [ngSwitch]=\"hasFilterItems\">\n <div *ngSwitchCase=\"true\" class=\"treeview-container\" [style.max-height.px]=\"maxHeight\">\n <ngx-treeview-item *ngFor=\"let item of filterItems\" [config]=\"config\" [item]=\"item\" [template]=\"itemTemplate || defaultItemTemplate\"\n (checkedChange)=\"onItemCheckedChange(item, $event)\">\n </ngx-treeview-item>\n </div>\n <div *ngSwitchCase=\"false\" class=\"treeview-text\">\n {{i18n.getFilterNoItemsFoundText()}}\n </div>\n </div>\n ",
styles: ["\n :host /deep/ .treeview-header .row-filter {\n margin-bottom: .5rem;\n }\n\n :host /deep/ .treeview-header .row-all .fa {\n cursor: pointer;\n }\n\n :host /deep/ .treeview-container .row-item {\n margin-bottom: .3rem;\n flex-wrap: nowrap;\n }\n\n :host /deep/ .treeview-container .row-item .fa {\n width: .8rem;\n cursor: pointer;\n margin-right: .3rem;\n }\n\n .treeview-container {\n overflow-y: auto;\n padding-right: .3rem;\n }\n\n .treeview-text {\n padding: .3rem 0;\n white-space: nowrap;\n }\n\n .treeview-arrow img {\n transition: transform 0.3s ease-in-out;\n transform: rotate(0deg);\n }\n\n .treeview-arrow.fa-caret-right img {\n transform: rotate(-90deg);\n }\n "]

@@ -238,0 +238,0 @@ },] },

@@ -1,1 +0,1 @@

[{"__symbolic":"module","version":4,"metadata":{"TreeviewComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":44,"character":1},"arguments":[{"selector":"ngx-treeview","template":"\n <ng-template #defaultItemTemplate let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\" let-onCheckedChange=\"onCheckedChange\">\n <div class=\"form-inline row-item\">\n <i *ngIf=\"item.children\" (click)=\"onCollapseExpand()\" aria-hidden=\"true\" class=\"fa\" [class.fa-caret-right]=\"item.collapsed\"\n [class.fa-caret-down]=\"!item.collapsed\"></i>\n <div class=\"form-check form-input-wrapper\">\n <input type=\"checkbox\" class=\"form-check-input\" [(ngModel)]=\"item.checked\" (ngModelChange)=\"onCheckedChange()\"\n [disabled]=\"item.disabled\" [indeterminate]=\"item.indeterminate\" />\n <span class=\"form-custom-checkbox\"></span>\n <label class=\"form-check-label\" (click)=\"!item.disableItemCheck && (item.checked = !item.checked); !item.disableChildrenCheck && onCheckedChange(); onCollapseExpand()\">\n {{item.text}}\n </label>\n </div>\n </div>\n </ng-template>\n <ng-template #defaultHeaderTemplate let-config=\"config\" let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\"\n let-onCheckedChange=\"onCheckedChange\" let-onFilterTextChange=\"onFilterTextChange\">\n <div *ngIf=\"config.hasFilter\" class=\"row row-filter\">\n <div class=\"col-12\">\n <input class=\"form-control\" type=\"text\" [placeholder]=\"i18n.getFilterPlaceholder()\" [(ngModel)]=\"filterText\"\n (ngModelChange)=\"onFilterTextChange($event)\" />\n </div>\n </div>\n <div *ngIf=\"hasFilterItems\">\n <div *ngIf=\"config.hasAllCheckBox || config.hasCollapseExpand\" class=\"row row-all\">\n <div class=\"col-12\">\n <div class=\"form-check form-check-inline\" *ngIf=\"config.hasAllCheckBox\">\n <input type=\"checkbox\" class=\"form-check-input\" [(ngModel)]=\"item.checked\" (ngModelChange)=\"onCheckedChange()\"\n [indeterminate]=\"item.indeterminate\" />\n <label class=\"form-check-label\" (click)=\"item.checked = !item.checked; onCheckedChange()\">\n {{i18n.getAllCheckboxText()}}\n </label>\n </div>\n <label *ngIf=\"config.hasCollapseExpand\" class=\"pull-right form-check-label\" (click)=\"onCollapseExpand()\">\n <i [title]=\"i18n.getTooltipCollapseExpandText(item.collapsed)\" aria-hidden=\"true\" class=\"fa treeview-arrow\"\n [class.fa-expand]=\"item.collapsed\" [class.fa-compress]=\"!item.collapsed\">\n <img src=\"./assets/images/decoratives/expand-arrow.svg\" width=\"18\">\n </i>\n </label>\n </div>\n </div>\n <div *ngIf=\"config.hasDivider\" class=\"dropdown-divider\"></div>\n </div>\n </ng-template>\n <div class=\"treeview-header\">\n <ng-template [ngTemplateOutlet]=\"headerTemplate || defaultHeaderTemplate\" [ngTemplateOutletContext]=\"headerTemplateContext\">\n </ng-template>\n </div>\n <div [ngSwitch]=\"hasFilterItems\">\n <div *ngSwitchCase=\"true\" class=\"treeview-container\" [style.max-height.px]=\"maxHeight\">\n <ngx-treeview-item *ngFor=\"let item of filterItems\" [config]=\"config\" [item]=\"item\" [template]=\"itemTemplate || defaultItemTemplate\"\n (checkedChange)=\"onItemCheckedChange(item, $event)\">\n </ngx-treeview-item>\n </div>\n <div *ngSwitchCase=\"false\" class=\"treeview-text\">\n {{i18n.getFilterNoItemsFoundText()}}\n </div>\n </div>\n ","styles":["\n :host /deep/ .treeview-header .row-filter {\n margin-bottom: .5rem;\n }\n\n :host /deep/ .treeview-header .row-all .fa {\n cursor: pointer;\n }\n\n :host /deep/ .treeview-container .row-item {\n margin-bottom: .3rem;\n flex-wrap: nowrap;\n }\n\n :host /deep/ .treeview-container .row-item .fa {\n width: .8rem;\n cursor: pointer;\n margin-right: .3rem;\n }\n\n .treeview-container {\n overflow-y: auto;\n padding-right: .3rem;\n }\n\n .treeview-text {\n padding: .3rem 0;\n white-space: nowrap;\n }\n\n .treeview-arrow img {\n transition: transform 0.3s ease-in-out;\n transform: rotate(0deg);\n }\n\n .treeview-arrow.fa-caret-right img {\n transform: rotate(-90deg);\n }\n "]}]}],"members":{"headerTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":146,"character":5}}]}],"itemTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":147,"character":5}}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":148,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":149,"character":5}}]}],"selectedChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":150,"character":5}}]}],"filterChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":151,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"./treeview-i18n","name":"TreeviewI18n","line":159,"character":21},{"__symbolic":"reference","module":"./treeview-config","name":"TreeviewConfig","line":160,"character":31},{"__symbolic":"reference","module":"./treeview-event-parser","name":"TreeviewEventParser","line":161,"character":29}]}],"ngOnChanges":[{"__symbolic":"method"}],"onAllCollapseExpand":[{"__symbolic":"method"}],"onFilterTextChange":[{"__symbolic":"method"}],"onAllCheckedChange":[{"__symbolic":"method"}],"onItemCheckedChange":[{"__symbolic":"method"}],"raiseSelectedChange":[{"__symbolic":"method"}],"recursiveCheckItems":[{"__symbolic":"method"}],"createHeaderTemplateContext":[{"__symbolic":"method"}],"generateSelection":[{"__symbolic":"method"}],"updateFilterItems":[{"__symbolic":"method"}],"filterItem":[{"__symbolic":"method"}],"updateCheckedOfAll":[{"__symbolic":"method"}],"updateCollapsedOfAll":[{"__symbolic":"method"}]}}}}]
[{"__symbolic":"module","version":4,"metadata":{"TreeviewComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":44,"character":1},"arguments":[{"selector":"ngx-treeview","template":"\n <ng-template #defaultItemTemplate let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\" let-onCheckedChange=\"onCheckedChange\">\n <div class=\"form-inline row-item\">\n <i *ngIf=\"item.children\" (click)=\"onCollapseExpand()\" aria-hidden=\"true\" class=\"fa treeview-arrow\"\n [class.fa-caret-right]=\"item.collapsed\"\n [class.fa-caret-down]=\"!item.collapsed\">\n <img src=\"./assets/images/decoratives/expand-arrow.svg\" width=\"18\">\n </i>\n <div class=\"form-check form-input-wrapper\">\n <input type=\"checkbox\" class=\"form-check-input\" [(ngModel)]=\"item.checked\" (ngModelChange)=\"onCheckedChange()\"\n [disabled]=\"item.disabled\" [indeterminate]=\"item.indeterminate\" />\n <span class=\"form-custom-checkbox\"></span>\n <label class=\"form-check-label\" (click)=\"!item.disableItemCheck && (item.checked = !item.checked); !item.disableChildrenCheck && onCheckedChange(); onCollapseExpand()\">\n {{item.text}}\n </label>\n </div>\n </div>\n </ng-template>\n <ng-template #defaultHeaderTemplate let-config=\"config\" let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\"\n let-onCheckedChange=\"onCheckedChange\" let-onFilterTextChange=\"onFilterTextChange\">\n <div *ngIf=\"config.hasFilter\" class=\"row row-filter\">\n <div class=\"col-12\">\n <input class=\"form-control\" type=\"text\" [placeholder]=\"i18n.getFilterPlaceholder()\" [(ngModel)]=\"filterText\"\n (ngModelChange)=\"onFilterTextChange($event)\" />\n </div>\n </div>\n <div *ngIf=\"hasFilterItems\">\n <div *ngIf=\"config.hasAllCheckBox || config.hasCollapseExpand\" class=\"row row-all\">\n <div class=\"col-12\">\n <div class=\"form-check form-check-inline\" *ngIf=\"config.hasAllCheckBox\">\n <input type=\"checkbox\" class=\"form-check-input\" [(ngModel)]=\"item.checked\" (ngModelChange)=\"onCheckedChange()\"\n [indeterminate]=\"item.indeterminate\" />\n <label class=\"form-check-label\" (click)=\"item.checked = !item.checked; onCheckedChange()\">\n {{i18n.getAllCheckboxText()}}\n </label>\n </div>\n <label *ngIf=\"config.hasCollapseExpand\" class=\"pull-right form-check-label\" (click)=\"onCollapseExpand()\">\n <i [title]=\"i18n.getTooltipCollapseExpandText(item.collapsed)\" aria-hidden=\"true\" class=\"fa treeview-arrow\"\n [class.fa-expand]=\"item.collapsed\" [class.fa-compress]=\"!item.collapsed\">\n <img src=\"./assets/images/decoratives/expand-arrow.svg\" width=\"18\">\n </i>\n </label>\n </div>\n </div>\n <div *ngIf=\"config.hasDivider\" class=\"dropdown-divider\"></div>\n </div>\n </ng-template>\n <div class=\"treeview-header\">\n <ng-template [ngTemplateOutlet]=\"headerTemplate || defaultHeaderTemplate\" [ngTemplateOutletContext]=\"headerTemplateContext\">\n </ng-template>\n </div>\n <div [ngSwitch]=\"hasFilterItems\">\n <div *ngSwitchCase=\"true\" class=\"treeview-container\" [style.max-height.px]=\"maxHeight\">\n <ngx-treeview-item *ngFor=\"let item of filterItems\" [config]=\"config\" [item]=\"item\" [template]=\"itemTemplate || defaultItemTemplate\"\n (checkedChange)=\"onItemCheckedChange(item, $event)\">\n </ngx-treeview-item>\n </div>\n <div *ngSwitchCase=\"false\" class=\"treeview-text\">\n {{i18n.getFilterNoItemsFoundText()}}\n </div>\n </div>\n ","styles":["\n :host /deep/ .treeview-header .row-filter {\n margin-bottom: .5rem;\n }\n\n :host /deep/ .treeview-header .row-all .fa {\n cursor: pointer;\n }\n\n :host /deep/ .treeview-container .row-item {\n margin-bottom: .3rem;\n flex-wrap: nowrap;\n }\n\n :host /deep/ .treeview-container .row-item .fa {\n width: .8rem;\n cursor: pointer;\n margin-right: .3rem;\n }\n\n .treeview-container {\n overflow-y: auto;\n padding-right: .3rem;\n }\n\n .treeview-text {\n padding: .3rem 0;\n white-space: nowrap;\n }\n\n .treeview-arrow img {\n transition: transform 0.3s ease-in-out;\n transform: rotate(0deg);\n }\n\n .treeview-arrow.fa-caret-right img {\n transform: rotate(-90deg);\n }\n "]}]}],"members":{"headerTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":149,"character":5}}]}],"itemTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":150,"character":5}}]}],"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":151,"character":5}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":152,"character":5}}]}],"selectedChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":153,"character":5}}]}],"filterChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":154,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"./treeview-i18n","name":"TreeviewI18n","line":162,"character":21},{"__symbolic":"reference","module":"./treeview-config","name":"TreeviewConfig","line":163,"character":31},{"__symbolic":"reference","module":"./treeview-event-parser","name":"TreeviewEventParser","line":164,"character":29}]}],"ngOnChanges":[{"__symbolic":"method"}],"onAllCollapseExpand":[{"__symbolic":"method"}],"onFilterTextChange":[{"__symbolic":"method"}],"onAllCheckedChange":[{"__symbolic":"method"}],"onItemCheckedChange":[{"__symbolic":"method"}],"raiseSelectedChange":[{"__symbolic":"method"}],"recursiveCheckItems":[{"__symbolic":"method"}],"createHeaderTemplateContext":[{"__symbolic":"method"}],"generateSelection":[{"__symbolic":"method"}],"updateFilterItems":[{"__symbolic":"method"}],"filterItem":[{"__symbolic":"method"}],"updateCheckedOfAll":[{"__symbolic":"method"}],"updateCollapsedOfAll":[{"__symbolic":"method"}]}}}}]

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc