material-steppers/dist/material-steppers-tpl.js

Angular Steppers directive for Angular Material

angular.module("mdSteppers").run(["$templateCache", function($templateCache) {$templateCache.put("mdSteppers/mdStep.tpl.html","<div class=\"md-stepper\" ng-class=\"{ \'md-active\': $ctrl.isActive() }\">\r\n    <md-steppers-header class=\"md-steppers-header md-steppers-vertical\">\r\n        <button class=\"md-stepper-indicator\" ng-class=\"{\r\n                    \'md-active\': $ctrl.stepNumber === $ctrl.$stepper.currentStep,\r\n                    \'md-completed\': $ctrl.$stepper.isCompleted($ctrl.stepNumber),\r\n                    \'md-error\': $ctrl.hasError,\r\n                    \'md-stepper-optional\': $ctrl.optional || $ctrl.hasError\r\n                }\" ng-click=\"$ctrl.$stepper.goto($ctrl.stepNumber)\" ng-disabled=\"$ctrl.$stepper.linear || $ctrl.stepNumber === $ctrl.$stepper.currentStep\">\r\n                <div class=\"md-stepper-indicator-wrapper\">\r\n                    <div class=\"md-stepper-number\" ng-hide=\"$ctrl.hasError\">\r\n                    <span ng-if=\"!$ctrl.$stepper.isCompleted($ctrl.stepNumber)\">{{ ::$ctrl.stepNumber+1 }}</span>\r\n                        <md-icon md-svg-icon=\"steppers-check\" class=\"md-stepper-icon\" ng-if=\"$ctrl.$stepper.isCompleted($ctrl.stepNumber)\"></md-icon>\r\n                    </div>\r\n                    <div class=\"md-stepper-error-indicator\" ng-show=\"$ctrl.hasError\">\r\n                        <md-icon md-svg-icon=\"steppers-warning\"></md-icon>\r\n                    </div>\r\n\r\n                    <div class=\"md-stepper-title\">\r\n                        <span>{{ $ctrl.label }}</span>\r\n                        <small ng-if=\"$ctrl.optional && !$ctrl.hasError\">{{ $ctrl.optional }}</small>\r\n                        <small class=\"md-stepper-error-message\" ng-show=\"$ctrl.hasError\">\r\n                            {{ $ctrl.message }}\r\n                        </small>\r\n                    </div>\r\n                </div>\r\n                </button>\r\n        <div class=\"md-stepper-feedback-message\" ng-show=\"stepper.hasFeedback\">\r\n            {{stepper.feedbackMessage}}\r\n        </div>\r\n    </md-steppers-header>\r\n    <md-steppers-scope layout=\"column\" class=\"md-steppers-scope\" ng-if=\"$ctrl.isActive()\" ng-transclude></md-steppers-scope>\r\n</div>");
$templateCache.put("mdSteppers/mdStepper.tpl.html","<div flex class=\"md-steppers\" ng-class=\"{ \r\n    \'md-steppers-linear\': stepper.linear, \r\n    \'md-steppers-alternative\': stepper.alternative,\r\n    \'md-steppers-vertical\': stepper.vertical,\r\n    \'md-steppers-mobile-step-text\': stepper.mobileStepText,\r\n    \'md-steppers-has-feedback\': stepper.hasFeedback\r\n    }\">\r\n    <div class=\"md-steppers-header-region\">\r\n        <md-steppers-header class=\"md-steppers-header md-steppers-horizontal md-whiteframe-1dp\">\r\n            <button class=\"md-stepper-indicator\" ng-repeat=\"(stepNumber, $step) in stepper.steps track by $index\" ng-class=\"{\r\n                \'md-active\': stepNumber === stepper.currentStep,\r\n                \'md-completed\': stepper.isCompleted(stepNumber),\r\n                \'md-error\': $step.hasError,\r\n                \'md-stepper-optional\': $step.optional || $step.hasError\r\n            }\" ng-click=\"stepper.goto(stepNumber)\" ng-disabled=\"stepper.linear || stepNumber === stepper.currentStep\">\r\n            <div class=\"md-stepper-indicator-wrapper\">\r\n                <div class=\"md-stepper-number\" ng-hide=\"$step.hasError\">\r\n                    <span ng-if=\"!stepper.isCompleted(stepNumber)\">{{ ::stepNumber+1 }}</span>\r\n                    <md-icon md-svg-icon=\"steppers-check\" class=\"md-stepper-icon\" ng-if=\"stepper.isCompleted(stepNumber)\"></md-icon>\r\n                </div>\r\n\r\n                <div class=\"md-stepper-error-indicator\" ng-show=\"$step.hasError\">\r\n                <md-icon md-svg-icon=\"steppers-warning\"></md-icon>\r\n                </div>\r\n                <div class=\"md-stepper-title\">\r\n                    <span>{{ $step.label }}</span>\r\n                    <small ng-if=\"$step.optional && !$step.hasError\">{{ $step.optional }}</small>\r\n                    <small class=\"md-stepper-error-message\" ng-show=\"$step.hasError\">\r\n                        {{ $step.message }}\r\n                    </small>\r\n                </div>\r\n            </div>\r\n            </button>\r\n           \r\n        </md-steppers-header>\r\n        <md-steppers-mobile-header class=\"md-steppers-mobile-header\">\r\n            <md-toolbar flex=\"none\" class=\"md-whiteframe-1dp\" style=\"background: #f6f6f6 !important; color: #202020 !important;\">\r\n                <div class=\"md-toolbar-tools\">\r\n                    <h3>\r\n                        <span>{{stepper.labelStep}} {{stepper.currentStep+1}} {{stepper.labelOf}} {{stepper.steps.length}}</span>\r\n                    </h3>\r\n                </div>\r\n            </md-toolbar>\r\n        </md-steppers-mobile-header>\r\n        <div class=\"md-stepper-feedback-message\" ng-show=\"stepper.hasFeedback\">\r\n            {{stepper.feedbackMessage}}\r\n        </div>\r\n    </div>\r\n    <md-steppers-content class=\"md-steppers-content\" ng-transclude></md-steppers-content>\r\n    <div class=\"md-steppers-overlay\"></div>\r\n</div>");}]);