[{"__symbolic":"module","version":3,"metadata":{"SkyContribDraggableRepeaterItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sky-contrib-draggable-repeater-item","template":"<sky-contrib-draggable-repeater-renderer\n  class=\"sky-contrib-draggable-repeater-item-left\"\n  [item]=\"item\"\n  [template]=\"itemLeftTemplate || defaultItemLeftTemplate\"\n></sky-contrib-draggable-repeater-renderer>\n<div class=\"sky-contrib-draggable-repeater-item-content vertical-center\">\n  <div class=\"sky-contrib-draggable-repeater-item-title\">\n    <sky-contrib-draggable-repeater-renderer\n      class=\"sky-contrib-draggable-repeater-item-title\"\n      [item]=\"item\"\n      [template]=\"itemTitleTemplate || defaultItemTitleTemplate\"\n    ></sky-contrib-draggable-repeater-renderer>\n    <sky-chevron\n      [direction]=\"isExpanded ? 'up' : 'down'\"\n      (directionChange)=\"toggle($event)\"\n      *ngIf=\"isExpandable && !showContent\"\n    ></sky-chevron>\n  </div>\n  <sky-contrib-draggable-repeater-renderer\n    [item]=\"item\"\n    *ngIf=\"!isExpanded || showContent\"\n    [template]=\"itemContentTemplate || defaultItemContentTemplate\"\n  ></sky-contrib-draggable-repeater-renderer>\n</div>\n<div class=\"sky-contrib-draggable-repeater-item-right\">\n  <div class=\"sky-contrib-draggable-repeater-item-right-content vertical-center\">\n    <sky-contrib-draggable-repeater-renderer\n      class=\"sky-contrib-draggable-repeater-item-right\"\n      [item]=\"item\"\n      [template]=\"itemRightTemplate || defaultItemRightTemplate\"\n    ></sky-contrib-draggable-repeater-renderer>\n  </div>\n  <div class=\"sky-contrib-draggable-repeater-item-drag-handle vertical-center\">\n    <i class=\"fa fa-sort sky-contrib-draggable-repeater-item-drag-handle-icon\" aria-hidden=\"true\"></i>\n  </div>\n</div>\n\n<ng-template #defaultItemTitleTemplate></ng-template>\n<ng-template #defaultItemLeftTemplate></ng-template>\n<ng-template #defaultItemRightTemplate></ng-template>\n<ng-template #defaultItemContentTemplate></ng-template>\n","styles":[":host{display:flex;background:#fbfbfb;border:1px solid #e2e3e4;border-radius:10px;margin:0 0 8px;padding:10px 0 10px 10px}:host .sky-contrib-draggable-repeater-item-right{display:flex;flex-grow:0}:host .sky-contrib-draggable-repeater-item-left{display:flex;flex-grow:0}:host .vertical-center{margin-top:auto;margin-bottom:auto}:host .sky-contrib-draggable-repeater-item-content{flex-grow:1;padding:0 10px;word-wrap:break-word;overflow:hidden}:host .sky-contrib-draggable-repeater-item-content sky-chevron{float:right}:host .sky-contrib-draggable-repeater-item-title{color:#71bf43;font-weight:bold;word-wrap:break-word;overflow:hidden}:host .sky-contrib-draggable-repeater-item-right-content{flex-grow:0}:host .sky-contrib-draggable-repeater-item-drag-handle{cursor:pointer;flex-grow:0;padding:10px}\n"]}]}],"members":{"isExpandable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"showContent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"item":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemTitleTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemLeftTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemRightTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemContentTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemContentNode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./draggable-repeater-item-content.component","name":"SkyContribDraggableRepeaterItemContentComponent"}]}]}],"itemTitleNode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./draggable-repeater-item-title.component","name":"SkyContribDraggableRepeaterItemTitleComponent"}]}]}],"itemLeftNode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./draggable-repeater-item-left.component","name":"SkyContribDraggableRepeaterItemLeftComponent"}]}]}],"itemRightNode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./draggable-repeater-item-right.component","name":"SkyContribDraggableRepeaterItemRightComponent"}]}]}],"repeaterItemId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding"},"arguments":["attr.repeater-item-id"]}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"toggle":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"SkyContribDraggableRepeaterItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sky-contrib-draggable-repeater-item","template":"<sky-contrib-draggable-repeater-renderer\n  class=\"sky-contrib-draggable-repeater-item-left\"\n  [item]=\"item\"\n  [template]=\"itemLeftTemplate || defaultItemLeftTemplate\"\n></sky-contrib-draggable-repeater-renderer>\n<div class=\"sky-contrib-draggable-repeater-item-content vertical-center\">\n  <div class=\"sky-contrib-draggable-repeater-item-title\">\n    <sky-contrib-draggable-repeater-renderer\n      class=\"sky-contrib-draggable-repeater-item-title\"\n      [item]=\"item\"\n      [template]=\"itemTitleTemplate || defaultItemTitleTemplate\"\n    ></sky-contrib-draggable-repeater-renderer>\n    <sky-chevron\n      [direction]=\"isExpanded ? 'up' : 'down'\"\n      (directionChange)=\"toggle($event)\"\n      *ngIf=\"isExpandable && !showContent\"\n    ></sky-chevron>\n  </div>\n  <sky-contrib-draggable-repeater-renderer\n    [item]=\"item\"\n    *ngIf=\"!isExpanded || showContent\"\n    [template]=\"itemContentTemplate || defaultItemContentTemplate\"\n  ></sky-contrib-draggable-repeater-renderer>\n</div>\n<div class=\"sky-contrib-draggable-repeater-item-right\">\n  <div class=\"sky-contrib-draggable-repeater-item-right-content vertical-center\">\n    <sky-contrib-draggable-repeater-renderer\n      class=\"sky-contrib-draggable-repeater-item-right\"\n      [item]=\"item\"\n      [template]=\"itemRightTemplate || defaultItemRightTemplate\"\n    ></sky-contrib-draggable-repeater-renderer>\n  </div>\n  <div class=\"sky-contrib-draggable-repeater-item-drag-handle vertical-center\">\n    <i class=\"fa fa-sort sky-contrib-draggable-repeater-item-drag-handle-icon\" aria-hidden=\"true\"></i>\n  </div>\n</div>\n\n<ng-template #defaultItemTitleTemplate></ng-template>\n<ng-template #defaultItemLeftTemplate></ng-template>\n<ng-template #defaultItemRightTemplate></ng-template>\n<ng-template #defaultItemContentTemplate></ng-template>\n","styles":[":host{display:flex;background:#fbfbfb;border:1px solid #e2e3e4;border-radius:10px;margin:0 0 8px;padding:10px 0 10px 10px}:host .sky-contrib-draggable-repeater-item-right{display:flex;flex-grow:0}:host .sky-contrib-draggable-repeater-item-left{display:flex;flex-grow:0}:host .vertical-center{margin-top:auto;margin-bottom:auto}:host .sky-contrib-draggable-repeater-item-content{flex-grow:1;padding:0 10px;word-wrap:break-word;overflow:hidden}:host .sky-contrib-draggable-repeater-item-content sky-chevron{float:right}:host .sky-contrib-draggable-repeater-item-title{color:#71bf43;font-weight:bold;word-wrap:break-word;overflow:hidden}:host .sky-contrib-draggable-repeater-item-right-content{flex-grow:0}:host .sky-contrib-draggable-repeater-item-drag-handle{cursor:pointer;flex-grow:0;padding:10px}\n"]}]}],"members":{"isExpandable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"showContent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"item":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemTitleTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemLeftTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemRightTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemContentTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"itemContentNode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./draggable-repeater-item-content.component","name":"SkyContribDraggableRepeaterItemContentComponent"}]}]}],"itemTitleNode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./draggable-repeater-item-title.component","name":"SkyContribDraggableRepeaterItemTitleComponent"}]}]}],"itemLeftNode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./draggable-repeater-item-left.component","name":"SkyContribDraggableRepeaterItemLeftComponent"}]}]}],"itemRightNode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./draggable-repeater-item-right.component","name":"SkyContribDraggableRepeaterItemRightComponent"}]}]}],"repeaterItemId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding"},"arguments":["attr.repeater-item-id"]}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterContentInit":[{"__symbolic":"method"}],"toggle":[{"__symbolic":"method"}]}}}}]