UNPKG

@progress/kendo-ui

Version:

This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.

3 lines 13.6 kB
/* @license */ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`kendo.core.min.js`),require(`kendo.progressbar.min.js`),require(`kendo.icons.min.js`)):typeof define==`function`&&define.amd?define([`exports`,`kendo.core.min`,`kendo.progressbar.min`,`kendo.icons.min`],t):(e=typeof globalThis<`u`?globalThis:e||self,t((e.kendo=e.kendo||{},e.kendo._globals=e.kendo._globals||{},e.kendo._globals.Stepper={}),e.kendo._globals.Core,e.kendo._globals.Progressbar,e.kendo._globals.Icons))})(this,function(e,t,n,r){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});let i={id:`stepper`,name:`Stepper`,category:`web`,description:`The Stepper widget displays navigation steps.`,depends:[`core`,`progressbar`,`icons`]};(function(e,t){var n=window.kendo,r=n.ui.Widget,i=n.keys,a=e.extend,o=n.htmlEncode,s=`.kendoStepper`,c=`click`,l=`activate`,u=`select`,d=`keydown`,f=`focusout`,p=`.`,m=` `,h=`vertical`,g=`tabindex`,_=`aria-current`,v=`aria-disabled`,y=`aria-invalid`,b=`aria-hidden`,x={step:`k-step`,firstStep:`k-step-first`,lastStep:`k-step-last`,doneStep:`k-step-done`,successStep:`k-step-success`,errorStep:`k-step-error`,currentStep:`k-step-current`,focusStep:`k-focus`,disabledStep:`k-disabled`,stepLink:`k-step-link`,stepIndicator:`k-step-indicator`,stepLabel:`k-step-label`},S={widget:`k-stepper`,stepperLinear:`k-stepper-linear`,stepList:`k-step-list`,stepListHorizontal:`k-step-list-horizontal`,stepListVertical:`k-step-list-vertical`},C=n.Class.extend({init:function(e){this.options=a({},this.options,e),this._render()},options:{label:``,icon:``,successIcon:``,iconTemplate:null,enabled:!0,error:!1,selected:!1,isFirstStep:!1,isLastStep:!1,indicatorVisible:!0,labelVisible:!0,index:0,previous:!1,selectable:!0},_indicatorTemplate:({successIcon:e,index:t,icon:r,previous:i,error:a})=>{let s;return s=e&&i&&!a?n.ui.icon({icon:o(e),iconClass:`k-step-indicator-icon`}):r?n.ui.icon({icon:o(r),iconClass:`k-step-indicator-icon`}):i&&!a?n.ui.icon({icon:`check`,iconClass:`k-step-indicator-icon`}):`<span class="k-step-indicator-text">${o(t+1)}</span>`,`<span class="k-step-indicator" aria-hidden="true">`+s+`</span>`},_labelTemplate:({label:t,indicatorVisible:r,previous:i,error:a})=>`<span class="k-step-label"><span class="k-step-text">`+o(t)+`</span> `+(a||!r&&!a&&i?n.ui.icon(e(`<span aria-hidden="true"></span>`),{icon:a?`warning-circle`:`check-circle`}):``)+`</span>`,deselect:function(){this.options.selected=!1,this._link(),this._stepClasses()},enable:function(e){this.options.enabled!==e&&(this.options.enabled=e,this.options.selectable=e,this._link(),this._stepClasses())},select:function(){this.options.selected=!0,this._link(),this._stepClasses()},getEnabled:function(){return this.options.enabled},getIndex:function(){return this.options.index},setPrevious:function(e){this.options.previous=e,this._link(),this._stepClasses()},getSelectable:function(){return this.options.selectable},getSelected:function(){return this.options.selected},setValid:function(e){this.options.error===e&&(this.options.error=!e,this._link(),this._stepClasses())},_indicator:function(){var t=this.options,r;t.iconTemplate?(r=e(`<span>`).addClass(x.stepIndicator).attr(b,`true`),r.append(n.template(t.iconTemplate)(t))):r=n.template(this._indicatorTemplate)(t),this.element.find(p+x.stepLink).append(r)},_label:function(){var e=n.template(this._labelTemplate)(this.options);this.element.find(p+x.stepLink).append(e)},_link:function(){var e=this.options;this.element.find(p+x.stepLink).empty(),this._linkAttributes(),e.indicatorVisible&&this._indicator(),e.labelVisible&&this._label()},_linkAttributes:function(){var e=this.options,t=this.element.find(p+x.stepLink);t.removeAttr(v+m+y+m+_+m+g),e.selected?t.attr(_,`step`):t.attr(g,`-1`),(!e.enabled||!e.selectable)&&t.attr(v,`true`),e.error&&t.attr(y,`true`)},_render:function(){var t=e(`<a href='#'>`).addClass(x.stepLink).attr(`title`,this.options.label);this.element=e(`<li>`).append(t),this._link(),this._stepClasses()},_stepClasses:function(){var e=this.options,t=x.step;e.isFirstStep&&(t+=m+x.firstStep),e.isLastStep&&(t+=m+x.lastStep),e.enabled||(t+=m+x.disabledStep),e.error&&(t+=m+x.errorStep),e.previous?(t+=m+x.doneStep,e.error||(t+=m+x.successStep)):e.selected&&(t+=m+x.currentStep,t+=m+x.focusStep),this.element.removeClass().addClass(t)}}),w=r.extend({init:function(e,t){var i=this;t||={},r.fn.init.call(i,e,t),i._indicatorAndLabel(),i._wrapper(),t.steps&&t.steps.length&&(i._processSteps(t.steps),i._progressBar()),i._attachEvents(),i._resizeHandler=n.onResize(function(){i.resize()})},options:{orientation:`horizontal`,linear:!0,indicator:!0,label:!0,selectOnFocus:!1,steps:null,name:`Stepper`},events:[l,u,`kendoKeydown`],destroy:function(){var e=this;e.progressBar&&r.fn.destroy.call(e.progressBar),r.fn.destroy.call(e),n.unbindResize(e._resizeHandler),e.wrapper.off(s)},setOptions:function(e){var t=this;r.fn.setOptions.call(t,e),t.progressBar&&r.fn.destroy.call(t.progressBar),t._indicatorAndLabel(),t._addStepList(),t.options.steps&&t.options.steps.length&&(t._processSteps(t.options.steps),t._progressBar())},enable:function(e){var t=this.steps(),n=this.options.steps;e?this.wrapper.removeAttr(v):this.wrapper.attr(v,`true`),this.progressBar.enable(e),t.forEach(function(t,r){t.enable(e),n[r]=t.options})},insertAt:function(e,t){var n=this.options.steps,r;!t||isNaN(e)||(e<0&&(e=n.length+e),!(e<0)&&(n||=[],(n.length===0||e>=n.length)&&(e=n.length),n.forEach(function(e){e.selected&&(r=e)}),t.selected===!0&&(r.selected=!1),n.splice(e,0,t),this._createSteps(),this._renderSteps(),this._resetProgressBar(),this._calculateDimensions()))},next:function(){if(!(!this._steps||this._steps.length<=1)){var e=this.selectedStep.getIndex();e+1!==this._steps.length&&this._select(e+1)}},previous:function(){if(!(!this._steps||this._steps.length<=1)){var e=this.selectedStep.getIndex();e!==0&&this._select(e-1)}},removeAt:function(e){var t=this.options.steps,n,r,i;isNaN(e)||!t||t.length<2||e>=t.length||(e<0&&(e=t.length+e),!(e<0)&&(n=t.splice(e,1)[0],n.selected===!0&&t.length>0&&(i=e>0?e-1:0,r=t[i],typeof r==`string`&&(r={label:r},t[i]=r),r.selected=!0,r.previous=!1),this._createSteps(),this._renderSteps(),this._resetProgressBar(),this._calculateDimensions()))},resize:function(){this._calculateDimensions()},select:function(e){var n=this;if(e===t||e===null||isNaN(e))return n.selectedStep;e>=n._steps.length||e<0||(e=Number(e),n._select(e))},steps:function(e){if(e===t)return this._steps;this._processSteps(e),this._resetProgressBar(),this._calculateDimensions()},_processSteps:function(e){var t=this,n;e.forEach(function(e){e.selected&&(n=e)}),n||(typeof e[0]==`string`&&(e[0]={label:e[0]}),e[0].selected=!0),t.options.steps=e,t._createSteps(),t._renderSteps()},_addStepList:function(){var t=this;t.wrapper.empty().append(e(`<ol />`).addClass(S.stepList)),t._stepList=t.wrapper.find(p+S.stepList),t.options.orientation===h?t._stepList.addClass(S.stepListVertical):t._stepList.addClass(S.stepListHorizontal)},_attachEvents:function(){var e=this;e.wrapper.on(c+s,p+x.step,e._selectClickHandler.bind(e)).on(c+s,e._wrapperClickHandler.bind(e)).on(f+s,e._focusout.bind(e)).on(d+s,e,e._keydown.bind(e))},_calculateDimensions:function(){if(this._steps){var e=this.options.orientation,t=this._steps.length,r=this._stepList,i=r.find(p+x.step),a=r.width()/t,o=r.height()/t,s=this.progressBar.element,c=`margin-left`,l={};e===h?(i.css(`max-height`,100/t+`%`),s.css({"margin-top":-1*(r.height()-16),height:o*(t-1)})):(i.css(`max-width`,100/t+`%`),n.support.isRtl(this.wrapper)&&(c=`margin-right`),l[c]=a/2,l.width=a*(t-1),s.css(l))}},_createStep:function(e,t,n){var r=this,i=t===0,o=r.options,s=o.indicator,c=o.label;return e=a({},e,{enabled:e.enabled!==!1}),e=a({},e,{isFirstStep:i,isLastStep:n,indicatorVisible:s,labelVisible:c,index:t}),new C(e)},_createSteps:function(){var e=this,n=e.options.steps,r=!1,i,a,o,s;for(e._steps=[],a=0;a<n.length;a++)s=n[a],typeof s==`string`&&(s={label:s}),s!==t&&(o=a===n.length-1,s.selected?r=!0:s=e._selectablePreviousState(s,r,a),i=e._createStep(s,a,o),e._steps.push(i),i.getSelected()&&(e.selectedStep=i))},_indicatorAndLabel:function(){!this.options.indicator&&!this.options.label&&(this.options.indicator=!0,this.options.label=!0)},_focusout:function(e){var t=this;t.wrapper.get(0).contains(e.relatedTarget)||setTimeout(function(){t._leaveStepper()})},_focusStep:function(e){var t=this.wrapper.find(p+x.focusStep),n=this.wrapper.find(p+x.stepLink);e.length>0&&(t.removeClass(x.focusStep),n.attr(g,`-1`),e.find(p+x.stepLink).removeAttr(g)[0].focus())},_focusNextStep:function(){var t=e(document.activeElement).closest(p+x.step).next();this._focusStep(t)},_focusPreviousStep:function(){var t=e(document.activeElement).closest(p+x.step).prev();this._focusStep(t)},_focusFirstStep:function(){var e=this.wrapper.find(p+x.firstStep);this._focusStep(e)},_focusLastStep:function(){var e=this.wrapper.find(p+x.lastStep);this._focusStep(e)},_keydown:function(t){var n=this,r=t.keyCode,a=e(document.activeElement).closest(p+x.step).index(),o=n.steps().length;r===i.TAB?t.shiftKey&&a>0?(t.preventDefault(),n._tabKey(t,-1)):!t.shiftKey&&a<o-1&&(t.preventDefault(),n._tabKey(t,1)):r>34&&r<41?(t.preventDefault(),n._navKeys(t)):r===i.ENTER||r===i.SPACEBAR?(t.preventDefault(),n._selectHandler(t,e(document.activeElement).closest(p+x.step))):t.preventDefault()},_leaveStepper:function(){var e=this.wrapper.find(p+x.currentStep);this.wrapper.find(p+x.stepLink).removeClass(x.focusStep).attr(g,`-1`),e.addClass(x.focusStep),e.find(p+x.stepLink).removeAttr(g)},_navKeys:function(e){this.options.selectOnFocus?this._navKeysSelect(e):this._navKeysFocus(e)},_navKeysFocus:function(e){var t=e.keyCode,r=n.support.isRtl(this.wrapper),a=this.options.orientation;switch(t){case i.DOWN:r&&a!==h?this._focusPreviousStep():this._focusNextStep();break;case i.RIGHT:r?this._focusPreviousStep():this._focusNextStep();break;case i.UP:r&&a!==h?this._focusNextStep():this._focusPreviousStep();break;case i.LEFT:r?this._focusNextStep():this._focusPreviousStep();break;case i.HOME:this._focusFirstStep();break;case i.END:this._focusLastStep();break}},_navKeysSelect:function(t){var r=t.keyCode,a=e(document.activeElement).closest(p+x.step).index(),o=n.support.isRtl(this.wrapper),s=this.steps(),c=this.options.orientation,l;switch(r){case i.DOWN:l=o&&c!==h?s[a-1]:s[a+1];break;case i.RIGHT:l=o?s[a-1]:s[a+1];break;case i.UP:l=o&&c!==h?s[a+1]:s[a-1];break;case i.LEFT:l=o?s[a+1]:s[a-1];break;case i.HOME:l=s[0];break;case i.END:l=s[s.length-1];break}l&&(this._focusStep(l.element),this._selectHandlerOnKey(t,l.element))},_progressBar:function(){var t=this.wrapper,n=this._progressOptions();this.progressBar=e(`<div>`).kendoProgressBar(n).getKendoProgressBar(),this.progressBar.element.css(`position`,`absolute`),this._calculateDimensions(),t.append(this.progressBar.element)},_progressOptions:function(){var e=this.options,t=e.orientation,n=e.steps,r,i;if(!(!n||n.length===0))return r=n.length,i={max:r-1,value:this.select().getIndex(),orientation:t,showStatus:!1},t===h&&(i.reverse=!0),i},_resetProgressBar:function(){var e=this.progressBar,t;e&&(t=this._progressOptions(),e.setOptions(t))},_renderSteps:function(){var e=this._steps,t=this._stepList,n,r;for(t.empty(),r=0;r<e.length;r++)n=e[r],t.append(n.element)},_resetStep:function(e,t,n){var r=this._steps[e];e===t?(r.options.previous=!1,r.options.selected=!0):(n||e>t)&&(!n||e<t)&&(r.options.selected=!1,r.options.previous=n),this.options.linear&&(e<t-1||e>t+1)?r.options.selectable=!1:r.options.selectable=!0,r._link(),r._stepClasses(),this.options.steps[e]=r.options},_select:function(e){var t=this.options,n=t.linear,r=this.select().getIndex(),i=t.steps,a=this._steps[e],o,s,c,l;if(!(!a||!a.getEnabled())){for(e>r?(o=!0,n?(c=Math.max(r-1,0),l=Math.min(e+1,i.length-1)):(c=r,l=e)):(o=!1,n?(c=Math.max(e-1,0),l=Math.min(r+1,i.length-1)):(c=e,l=r)),s=c;s<=l;s++)this._resetStep(s,e,o);this.selectedStep=a,this.progressBar.value(e)}},_selectablePreviousState:function(e,t,n){var r=this.options.steps,i=this.options.linear;return t?i&&!r[n-1].selected?e.selectable=!1:e.selectable=!0:(e.previous=!0,i&&!r[n+1].selected?e.selectable=!1:e.selectable=!0),e},_selectClickHandler:function(t){var n=e(t.target).closest(p+x.step);t.preventDefault(),this._preventWrapperClick=!0,this._selectHandler(t,n)},_selectHandler:function(e,t){var n=this,r=n._steps[t.index()],i=this.select();if(!r||r.getIndex()===i.getIndex()||!r.getEnabled()||!r.getSelectable()){n._focusStep(i.element);return}n.trigger(u,{sender:n,originalEvent:e,step:r})||(n._select(r.getIndex()),t.find(p+x.stepLink)[0].focus(),n.trigger(l,{sender:n,originalEvent:e,step:r}))},_selectHandlerOnKey:function(e,t){var n=this,r=n._steps[t.index()];!r.getEnabled()||!r.getSelectable()||n.trigger(u,{sender:n,originalEvent:e,step:r})||(n._select(r.getIndex()),t.find(p+x.stepLink)[0].focus(),n.trigger(l,{sender:n,originalEvent:e,step:r}))},_tabKey:function(t,n){var r=this.options.selectOnFocus,i=e(document.activeElement).closest(p+x.step),a=i.index(),o=e(i.parent().find(p+x.step)[a+n]);this._focusStep(o),r&&this._selectHandlerOnKey(t,o)},_wrapper:function(){var e=this;e.wrapper=e.element,e.wrapper.addClass(S.widget),e.options.linear&&e.wrapper.addClass(S.stepperLinear),this._addStepList()},_wrapperClickHandler:function(e){var t=this.select();this._preventWrapperClick?this._preventWrapperClick=!1:(e.preventDefault(),this._focusStep(t.element))}});n.stepper={Step:C},n.ui.plugin(w)})(window.kendo.jQuery);var a=kendo;e.__meta__=i,e.default=a}); //# sourceMappingURL=kendo.stepper.min.js.map