{"version":3,"sources":["webpack:///./widgets/stepByStepContainerBlock.js"],"names":["StepByStepContainerBlock","$el","_classCallCheck","this","key","value","setStepByStepContainerBlock","$wg","$","stepsBtns","find","steps","on","$btn","indx","index","removeClass","addClass","eq","window","trigger","each","el","imgHolder","length","append","newIndex","currentIndex","not","first","hasClass"],"mappings":"42BAIA,IASaA,EAAwB,WAInC,O,EAHD,SAAAA,EAAYC,I,4FAAKC,CAAA,KAAAF,GAEhBG,KAAKF,IAAMA,I,EACX,EAAAG,IAAA,OAAAC,MAED,WACCF,KAAKG,gCACL,CAAAF,IAAA,8BAAAC,MAED,WAEC,IAAME,EAAMC,EAAEL,KAAKF,KACfQ,EAAYF,EAAIG,KAAK,cACrBC,EAAQJ,EAAIG,KAAK,wBAErBD,EAAUG,GAAG,SAAS,WACrB,IAAIC,EAAOL,EAAEL,MACTW,EAAOD,EAAKE,QAChBN,EAAUO,YAAY,aACtBH,EAAKI,SAAS,aAEdN,EAAMM,SAAS,UACfN,EAAMO,GAAGJ,GAAME,YAAY,UAE3BR,EAAEW,QAAQC,QAAQ,aAGnBT,EAAMU,MAAK,SAASN,EAAOO,GAC1B,IAAIC,EAAYf,EAAEc,GAAIZ,KAAK,+BAGd,GAATK,GAAcJ,EAAMa,OAAS,GAChCD,EAAUE,OAAO,wDAGdV,EAAQ,GAAKA,EAASJ,EAAMa,OAAS,IACxCD,EAAUE,OAAO,wDACjBF,EAAUE,OAAO,wDAGdV,GAAUJ,EAAMa,OAAQ,GAAMb,EAAMa,OAAS,GAChDD,EAAUE,OAAO,0DAInBlB,EAAIK,GAAG,QAAS,0BAA0B,WACzC,IACIc,EADAC,EAAehB,EAAMiB,IAAI,WAAWC,QAAQd,QAGhDJ,EAAMM,SAAS,UAGdS,EADGlB,EAAEL,MAAM2B,SAAS,aACTH,EAAe,EAEfA,EAAe,EAG3BlB,EAAUS,GAAGQ,GAAUN,QAAQ,iB,0FA1DG,I","file":"76.js","sourcesContent":["/* eslint-disable no-invalid-this */\n/* eslint-disable max-len */\n/* eslint-disable no-unused-vars */\n// CONSTANTS are all caps.\nconst NS = 'StepByStepContainerBlock';\nconst CLS = 'stepByStepContainerBlock';\nconst WG = '.' + CLS + '-';\n\n// Import stuff here if you need to or even better to import them dynamically\n// for ex. of dynamic import check out src/scripts/loadWg/stepByStepContainerBlock.js using Webpack dynamic imports as chunks.\n// import $ from 'jquery'\n\n\nexport class StepByStepContainerBlock {\n\tconstructor($el) {\n\t\t// $el is the widget node return by the loadStepByStepContainerBlock function\n\t\tthis.$el = $el;\n\t}\n\n\tinit() {\n\t\tthis.setStepByStepContainerBlock();\n\t}\n\n\tsetStepByStepContainerBlock() {\n\t\t// Add Some logic here\n\t\tconst $wg = $(this.$el);\n\t\tlet stepsBtns = $wg.find('.step-item');\n\t\tlet steps = $wg.find('.stepByStepItemBlock');\n\n\t\tstepsBtns.on('click', function() {\n\t\t\tlet $btn = $(this);\n\t\t\tlet indx = $btn.index();\n\t\t\tstepsBtns.removeClass('is-active');\n\t\t\t$btn.addClass('is-active');\n\n\t\t\tsteps.addClass('d-none');\n\t\t\tsteps.eq(indx).removeClass('d-none');\n\n\t\t\t$(window).trigger('scroll');\n\t\t});\n\n\t\tsteps.each(function(index, el) {\n\t\t\tlet imgHolder = $(el).find('.stepByStepItemBlock-images');\n\n\t\t\t// first step and we have multiple steps\n\t\t\tif (index == 0 && steps.length > 1) {\n\t\t\t\timgHolder.append(`<span class=\"fas fa-chevron-right next-step\"></span>`);\n\t\t\t}\n\t\t\t// middle steps\n\t\t\tif (index > 0 && index < (steps.length - 1)) {\n\t\t\t\timgHolder.append(`<span class=\"fas fa-chevron-right next-step\"></span>`);\n\t\t\t\timgHolder.append(`<span class=\"fas fa-chevron-left prev-step\"></span>`);\n\t\t\t}\n\t\t\t// last step\n\t\t\tif (index == (steps.length -1) && steps.length > 1) {\n\t\t\t\timgHolder.append(`<span class=\"fas fa-chevron-left prev-step\"></span>`);\n\t\t\t}\n\t\t});\n\n\t\t$wg.on('click', '.prev-step, .next-step', function() {\n\t\t\tlet currentIndex = steps.not('.d-none').first().index();\n\t\t\tlet newIndex;\n\n\t\t\tsteps.addClass('d-none');\n\n\t\t\tif ($(this).hasClass('prev-step')) {\n\t\t\t\tnewIndex = currentIndex - 1;\n\t\t\t} else {\n\t\t\t\tnewIndex = currentIndex + 1;\n\t\t\t}\n\n\t\t\tstepsBtns.eq(newIndex).trigger('click');\n\t\t});\n\t}\n\n\t// Add more functions like on above here\n}\n"],"sourceRoot":""}