@farris/ui-vue/components/wizard/index.umd.cjs

Farris Vue, a Farris Design based Vue3 component library.

(function(i,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("../common/index.umd.js"),require("../step/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","vue","../common/index.umd.js","../step/index.umd.js"],e):(i=typeof globalThis<"u"?globalThis:i||self,e(i.wizard={},i.Vue,i.common,i.FStep))})(this,function(i,e,b,q){"use strict";const B={stepClickable:{type:Boolean,default:!1},stepCls:{type:String,default:""},direction:{type:String,default:"vertical"},stepPosition:{type:String,default:"None"},fill:{type:Boolean,default:!0},storedIndex:{type:Boolean,default:!1},storedIndexState:{type:Boolean,default:!1},currentPageId:{type:String,default:""},currentStepIndex:{type:Number,default:0},visible:{type:Boolean,default:!0},stepsData:{type:Array,default:()=>[]},customClass:{type:String,default:""},customStyle:{type:String,default:""}},x=Symbol("WizardContext"),j=Symbol("WizardPageContext");function k(t,a){const r=e.ref({}),l=e.computed(()=>{var n;return((n=t[a.value])==null?void 0:n.id)||""});function c(n){r.value=n}function z(){return r.value}function f(){a.value>0&&(a.value===t.length?a.value=a.value-2:a.value--)}function s(){a.value<t.length&&a.value++}function u(n){a.value=n}function I(n,o){r.value[n]=o}function g(n){return r.value[n]}function w(){return r.value[l.value]}function S(){const n=t.findIndex(o=>o.id===l.value);return n>0?t[n-1].id:l.value}function v(){const n=t.findIndex(o=>o.id===l.value);return n<t.length?t[n+1].id:l.value}function y(n){const o=t.findIndex(p=>p.id===n);return o>0?r.value[t[o-1].id]:r.value[n]}function N(n){const o=t.findIndex(p=>p.id===n);return o<t.length?r.value[t[o+1].id]:r.value[n]}return{currentPageId:l,currentStepIndex:a,wizardData:r,setWizardData:c,getWizardData:z,gotoPreviousStep:f,gotoNextStep:s,setCurrentStep:u,setDataByPageId:I,getDataByPageId:g,getCurrentPageData:w,getPreviousPageDataByPageId:y,getNextPageDataByPageId:N,getPreviousPageId:S,getNextPageId:v}}const C=e.defineComponent({name:"FWizard",props:B,emits:["stateChange","update:currentPageId"],setup(t,{slots:a,emit:r,expose:l}){const c=e.ref(null),z=e.ref(null),f=e.ref(null),s=e.ref(null),u=e.ref([]),I=e.ref(t.currentStepIndex),{currentStepIndex:g,currentPageId:w,wizardData:S,setDataByPageId:v,gotoNextStep:y,gotoPreviousStep:N,getDataByPageId:n,getPreviousPageDataByPageId:o,getNextPageDataByPageId:p,getPreviousPageId:m,getNextPageId:O,getCurrentPageData:H}=k(t.stepsData,I);e.computed(()=>{const d={"f-component-wizard-fill":t.fill,"f-component-wizard":!0};return b.getCustomClass(d,t.customClass)});function A(d){I.value=d}function R(d){}e.provide(x,{wizardPageList:u,wizardProps:t,activeIndex:g,activeId:w,updateCurrentPageId:R,gotoNextStep:y,gotoPreviousStep:N,setDataByPageId:v,getNextPageDataByPageId:p,getPreviousPageDataByPageId:o,getPreviousPageId:m,getNextPageId:O,getDataByPageId:n,getCurrentPageData:H});function K(){let d="";switch(t.stepPosition){case"Top":d="f-component-wizard-step-top";break;case"HeaderRight":d="f-component-wizard-step-headerright";break;case"PageLeft":d="f-component-wizard-step-pageleft";break;case"None":d="f-component-wizard-step-none";break;default:d=""}return{[d]:!!d,"f-wizard":!0}}function h(d){return t.stepPosition===d}e.watch(()=>t.currentPageId,(d,P)=>{}),e.watch(()=>t.currentStepIndex,(d,P)=>{d!==P&&A(d)}),e.onMounted(()=>{});function _(d){g.value=d.stepIndex}function E(d){return!!t.stepClickable}function V(){return e.createVNode("div",{class:"f-wizard-step"},[e.createVNode(q,{ref:s,activeIndex:g.value,steps:t.stepsData,direction:t.direction,beforeClickStep:E,onClick:_},{default:()=>[a.stepTemplate&&{stepTemplate:d=>{var M;const{step:P,index:D,length:J,activeIndex:Q,direction:U}=d;return(M=a.stepTemplate)==null?void 0:M.call(a,{step:P,index:D,length:J,activeIndex:Q,direction:U})}}]})])}l({setDataByPageId:v,updateCurrentPageId:R,gotoNextStep:y,gotoPreviousStep:N,getNextPageDataByPageId:p,getPreviousPageDataByPageId:o,getPreviousPageId:m,getNextPageId:O,getDataByPageId:n,getCurrentPageData:H,cancel:()=>{},finish:()=>{}});const G=e.computed(()=>{const d={"f-component-wizard-fill":t.fill,"f-component-wizard":!0};return b.getCustomClass(d,t.customClass)});return()=>{var d,P,D;return t.visible&&e.createVNode("div",{class:G.value},[e.createVNode("div",{ref:z,class:K()},[h("Top")&&((d=a.wizardStepTemplate)==null?void 0:d.call(a)),h("None")&&e.createVNode("div",{class:"d-none"},[V()]),(a.wizardHeader||h("HeaderRight"))&&e.createVNode("div",{class:"f-wizard-header",ref:c},[(P=a.wizardHeader)==null?void 0:P.call(a),h("HeaderRight")&&V()]),e.createVNode("div",{class:"f-wizard-content",ref:f},[h("PageLeft")&&V(),e.createVNode("div",{class:"f-wizard-pages"},[(D=a.default)==null?void 0:D.call(a)])])])])}}}),F={pageId:{type:String,default:""},active:{type:Boolean,default:!1}},T=e.defineComponent({name:"FWizardPage",props:F,emits:["pageSelected"],setup(t,{slots:a}){const{wizardPageList:r,activeId:l,wizardProps:c,activeIndex:z}=e.inject(x,{activeId:e.ref(""),activeIndex:e.ref(1),wizardPageList:e.ref([]),wizardProps:{}});e.provide(j,{pageId:t.pageId});const f=e.computed(()=>{var u;return((u=c.stepsData[z.value])==null?void 0:u.id)===t.pageId}),s=e.computed(()=>({"f-component-wizard-page":!0,active:f.value}));return e.onMounted(()=>{r.value.includes(t.pageId)||r.value.push(t.pageId)}),()=>{var u;return f.value&&e.createVNode("div",{class:s.value},[(u=a.default)==null?void 0:u.call(a)])}}}),L={headerTemplate:{type:Object},contentTemplate:{type:Object},footerTemplate:{type:Object}},W=e.defineComponent({name:"FWizardPageDetail",props:L,emits:["pagedetailSelected"],setup(t,{slots:a,expose:r,emit:l}){const c=e.inject(x,null),{wizardProps:z,gotoNextPage:f,gotoPreviousPage:s,gotoNextStep:u,gotoPreviousStep:I,setDataByPageId:g,activeId:w,getPreviousPageId:S,getNextPageId:v,getDataByPageId:y,getCurrentPageData:N}=c,{pageId:n}=e.inject(j,{}),o=e.computed(()=>c==null?void 0:c.wizardPageList.value.indexOf(n));function p(m){g(w.value,m)}return e.onMounted(()=>{l("pagedetailSelected",w.value)}),r({gotoNextPage:f,gotoPreviousPage:s,gotoNextStep:u,gotoPreviousStep:I,setDataByPageId:g,getPreviousPageId:S,getNextPageId:v,setPageData:p,getCurrentPageData:N,getDataByPageId:y}),()=>{var m;return e.createVNode("div",{class:"f-component-wizard-page-detail f-component-wizard-page-detail-fill"},[t.headerTemplate?e.createVNode("div",{class:"f-component-wizard-page-detail-header"},[t.headerTemplate()]):a.headerTemplate&&e.createVNode("div",{class:"f-component-wizard-page-detail-header"},[a.headerTemplate()]),t.contentTemplate?e.createVNode("div",{class:"f-component-wizard-page-detail-content"},[t.contentTemplate()]):a.contentTemplate?e.createVNode("div",{class:"f-component-wizard-page-detail-content"},[a.contentTemplate()]):(m=a.default)==null?void 0:m.call(a),t.footerTemplate?e.createVNode("div",{class:"f-component-wizard-page-detail-footer"},[t.footerTemplate({stepIndex:o.value,pageId:n,pageIdList:c==null?void 0:c.wizardPageList.value})]):a.footerTemplate&&e.createVNode("div",{class:"f-component-wizard-page-detail-footer"},[a.footerTemplate()])])}}});C.install=t=>{t.component(C.name,C).component(T.name,T).component(W.name,W)},i.FWizard=C,i.FWizardPage=T,i.FWizardPageDetail=W,i.default=C,i.pageDetailProps=L,i.useWizard=k,i.wizardPageProps=F,i.wizardProps=B,Object.defineProperties(i,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});