{"__symbolic":"module","version":4,"exports":[{"export":[{"name":"SbbProcessflowStepDescriptor","as":"SbbProcessflowStepDescriptor"}],"from":"@sbb-esta/angular-core/base/processflow"}],"metadata":{"SbbProcessflowModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":7,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":12},{"__symbolic":"reference","module":"@sbb-esta/angular-core/icon","name":"SbbIconModule","line":8,"character":26}],"declarations":[{"__symbolic":"reference","name":"SbbProcessflow"},{"__symbolic":"reference","name":"SbbProcessflowStep"}],"exports":[{"__symbolic":"reference","name":"SbbProcessflowStep"},{"__symbolic":"reference","name":"SbbProcessflow"},{"__symbolic":"reference","module":"@sbb-esta/angular-core/icon","name":"SbbIconModule","line":10,"character":48}]}]}],"members":{}},"SbbProcessflow":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@sbb-esta/angular-core/base/processflow","name":"SbbProcessflowBase","line":27,"character":10},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":16,"character":1},"arguments":[{"selector":"sbb-processflow","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":20,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":21,"character":19},"member":"OnPush"},"host":{"class":"sbb-processflow"},"template":"<div class=\"sbb-processflow-header-wrapper\">\n  <ol class=\"sbb-processflow-header sbb-scrollbar\">\n    <li *ngFor=\"let step of steps; let i = index; let isLast = last\" class=\"sbb-processflow-step\">\n      <button\n        type=\"button\"\n        class=\"sbb-processflow-step-button\"\n        [class.sbb-active]=\"step.active\"\n        [class.sbb-disabled]=\"step.disabled\"\n        [disabled]=\"step.disabled\"\n        (click)=\"stepClick($event, i)\"\n      >\n        {{ step.title }}\n      </button>\n      <ng-container *ngIf=\"!isLast\">\n        <div\n          class=\"sbb-processflow-step-arrow\"\n          [class.sbb-processflow-step-arrow-active]=\"(!step.disabled && !step.active) || skippable\"\n        >\n          <sbb-icon svgIcon=\"kom:chevron-right-small\" class=\"sbb-icon-fit\"></sbb-icon>\n        </div>\n      </ng-container>\n    </li>\n  </ol>\n</div>\n\n<ng-content select=\"sbb-processflow-step\"></ng-content>\n","styles":[".sbb-processflow{list-style-type:none;margin:0;padding:0;display:block}.sbb-processflow-header-wrapper{overflow-x:hidden}.sbb-processflow-header{display:flex;align-items:center;list-style-type:none;overflow-x:auto;margin:0 0 1rem 0;padding:0}.sbb-processflow-step{display:flex;flex:0 0 auto;margin-top:0}.sbb-processflow-step::before{content:\"\";padding:0;margin:0}.sbb-processflow-step-arrow{color:#666;line-height:0;margin-bottom:auto;margin-top:.0666666667rem;width:.8rem;height:.8rem;margin-left:1.4666666667rem;margin-right:1.4666666667rem}.sbb-processflow-step-arrow-active{color:#000}.sbb-processflow-step-button{background:none;max-width:none;min-width:0;padding:0;margin:0;border:none;display:block;white-space:nowrap;font-family:\"SBBWeb Light\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;text-decoration:none;position:relative;font-size:1.0666666667rem;line-height:1.0666666667rem;padding-bottom:.3333333333rem}.sbb-processflow-step-button::after{content:\"\";display:block;position:absolute;bottom:0;width:0;left:50%;height:.0666666667rem;border-bottom:.0666666667rem solid currentColor;transition:width .3s,left .3s}.sbb-processflow-step-button.sbb-active::after,.sbb-processflow-step-button:not(.sbb-active):focus::after,.sbb-processflow-step-button:not(.sbb-active):hover::after{left:0;width:100%}.sbb-processflow-step-button:not(.sbb-active):focus,.sbb-processflow-step-button:not(.sbb-active):hover{color:#c60018}.sbb-processflow-step-button:not(.sbb-active):focus::after,.sbb-processflow-step-button:not(.sbb-active):hover::after{border-bottom-color:#c60018}.sbb-processflow-step-button[disabled]{color:#a8a8a8}.sbb-processflow-step-button[disabled]:hover,.sbb-processflow-step-button[disabled]:focus{color:#a8a8a8;cursor:default}.sbb-processflow-step-button[disabled]:hover::after,.sbb-processflow-step-button[disabled]:focus::after{width:0}.sbb-processflow-step-button.sbb-active:hover,.sbb-processflow-step-button.sbb-active:focus{color:currentColor;cursor:default}.sbb-processflow-step-button.sbb-active:hover::after,.sbb-processflow-step-button.sbb-active:focus::after{border-bottom-color:currentColor}\n"]}]}],"members":{"steps":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":31,"character":3},"arguments":[{"__symbolic":"reference","name":"SbbProcessflowStep"}]}]}],"skippable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":46,"character":53}]}],"ngAfterContentInit":[{"__symbolic":"method"}],"setSkippableSteps":[{"__symbolic":"method"}],"stepClick":[{"__symbolic":"method"}],"changeStep":[{"__symbolic":"method"}],"prevStep":[{"__symbolic":"method"}]}},"SbbProcessflowStep":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@sbb-esta/angular-core/base/processflow","name":"SbbProcessflowStepBase","line":9,"character":40},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"sbb-processflow-step","template":"<ng-content *ngIf=\"active && !disabled\"></ng-content>","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":7,"character":19},"member":"OnPush"}}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":10,"character":33}]}]}}},"origins":{"SbbProcessflowModule":"./processflow.module","SbbProcessflow":"./processflow/processflow.component","SbbProcessflowStep":"./processflow-step/processflow-step.component"},"importAs":"@sbb-esta/angular-business/processflow"}