@kelvininc/ui-components
Version:
Kelvin UI Components
1 lines • 5.78 kB
JavaScript
import{r as e,c as t,h as a,H as i}from"./p-D-JVwta2.js";import{b as r}from"./p-DzZLIMy0.js";import"./p-DwRzddFC.js";import{E as o}from"./p-DVds6a5Z.js";import"./p-CojoW2Y2.js";import{E as n}from"./p-SVedE_O8.js";import"./p-BcMhjKoS.js";import"./p-Do0EyoO8.js";import"./p-CBuzk8fR.js";import"./p-DHk26cGe.js";import"./p-7ioMFMb5.js";const s={"--container-max-width":"350px"},c=class{constructor(a){e(this,a),this.stepClick=t(this,"stepClick",7),this.cancelClick=t(this,"cancelClick",7),this.prevClick=t(this,"prevClick",7),this.nextClick=t(this,"nextClick",7),this.completeClick=t(this,"completeClick",7),this.showStepBar=!0,this.completeBtnLabel="Submit",this.cancelEnabled=!0,this.prevEnabled=!0,this.nextEnabled=!0,this.onPrevClick=()=>{this.prevClick.emit()},this.onNextClick=()=>{this.nextClick.emit()},this.onCancelClick=()=>{this.cancelClick.emit()},this.onCompleteClick=()=>{this.completeClick.emit()},this.onStepClick=({detail:e})=>{this.stepClick.emit(e)}}render(){return a(i,{key:"a41503ba15623276d6f01aaeb103e973572ef30c"},a("div",{key:"7ccc7ab3b345bff5b0d5ee6fb2efc043853e2e7c",class:"wizard-footer-container"},a("div",{key:"4769d4ac7a6a15d78cbe838da9700ef4f5884b32",class:"actions-container",part:"footer-actions-container"},this.showStepBar&&a("div",{key:"04ec24e3eda2279807e9e30a973c141db94539f5",class:"wizard-stepper"},a("kv-step-bar",{key:"389f981f38e663a24135f12b8b4fe8d439a0240f",label:this.label,steps:this.steps,currentStep:this.currentStep,progressPercentage:this.progressPercentage,hasError:this.hasError,onStepClicked:this.onStepClick})),a("slot",{key:"7e24293cb3c87f46a8addaf3493e506e9831c522",name:"additional-actions"})),a("div",{key:"fa33e0d777568447a22fcf1184a8d7ebaa13407e",class:"buttons-container"},this.showCancelBtn&&a("kv-action-button-text",{key:"4fee4ca5c38ae878c6f6eb2c760c4821fa18e0e2",type:o.Ghost,text:"Cancel",disabled:!this.cancelEnabled,onClickButton:this.onCancelClick}),this.showPrevBtn&&a("kv-action-button-text",{key:"07123b81e5e265244a0238d5cbfe6d8a70e73925",type:o.Tertiary,text:"Previous",disabled:!this.prevEnabled,onClickButton:this.onPrevClick}),this.showNextBtn&&a("kv-tooltip",{key:"5b71ad8a2a40302c278e8ac28f606af3d302e73f",position:r.TopEnd,text:this.nextTooltip,customStyle:s},a("kv-action-button-text",{key:"4136953cfe3b5036fe4d234b70dbce45b0978124",type:o.Primary,text:"Next",disabled:!this.nextEnabled,onClickButton:this.onNextClick})),this.showCompleteBtn&&a("kv-tooltip",{key:"d9e53ea95c276c22c26021d27a9226490b235c9f",position:r.TopEnd,text:this.completeTooltip,customStyle:s},a("kv-action-button-text",{key:"b1c50f16cfb75300be073500d28cb9c68ce0bee1",type:o.Primary,text:this.completeBtnLabel,disabled:!this.completeEnabled,onClickButton:this.onCompleteClick})))))}};c.style='@property --rotation{syntax:"<angle>";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}:host{--stepper-width:100%}.wizard-footer-container{display:flex;align-items:center;justify-content:space-between;padding:var(--kv-spacing-4x, 16px)}.wizard-footer-container .actions-container{display:flex;flex:1}.wizard-footer-container .actions-container .wizard-stepper{width:var(--stepper-width);padding-right:var(--kv-spacing-4x, 16px)}.wizard-footer-container .buttons-container{display:flex;gap:var(--kv-spacing-3x, 12px)}';const d=class{constructor(t){e(this,t)}render(){var e;return a(i,{key:"2e9d5797f3f1871cfaf220d409101686e31ef534"},a("div",{key:"5914e6c5456216c14727a955b3e7b840585c372e",class:"wizard-header-container"},a("div",{key:"c95e9b08c31c456cb478bc6ff78f1cc63fcae710",class:"left-container"},a("span",{key:"1a69f83a660350cd0bd0569c406ed08e4a44fae2",class:"label"},this.label),a("span",{key:"1e0ffb180b7e68b75c9c3595f32927d34d94b650",class:"separator"}),a("span",{key:"18679e998932493d2ac40ae6e057b78a0f634778",class:"description"},this.description),(null===(e=this.tip)||void 0===e?void 0:e.length)>0&&a("kv-toggle-tip",{key:"8e03dfb2887f5c5d9d4d329a9cc66d17bbc67110",text:this.tip,position:r.Bottom,customClass:"wizard-header-tip"},a("kv-icon",{key:"e938f09434a38cb13a79ee8d6fcdc7f8039b033d",name:n.Info,slot:"open-element-slot"}))),a("slot",{key:"3c60f6589c4a28582b450fd42620a4cfcf4a2854",name:"additional-header-actions"})))}};d.style='@property --rotation{syntax:"<angle>";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}:host{--text-color:var(--kv-neutral-1, #f2f2f6);--separator-color:var(--kv-neutral-2, #e5e5e5);--container-padding:var(--kv-spacing-4x, 16px)}.wizard-header-container{display:flex;padding:var(--container-padding);justify-content:space-between}.wizard-header-container .left-container{display:flex;align-items:center;flex:1}.wizard-header-container .left-container .label,.wizard-header-container .left-container .description{color:var(--text-color)}.wizard-header-container .left-container .label{font-family:var(--kv-primary-font, "proxima-nova", sans-serif, "Arial");font-size:12px;font-weight:600;font-stretch:normal;font-style:normal;line-height:18px;letter-spacing:normal;letter-spacing:1.5px;text-transform:uppercase}.wizard-header-container .left-container .description{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--kv-primary-font, "proxima-nova", sans-serif, "Arial");font-size:14px;font-weight:300;font-stretch:normal;font-style:normal;line-height:21px;letter-spacing:normal;text-transform:none}.wizard-header-container .left-container .separator{width:4px;height:4px;border-radius:50%;margin:0 var(--kv-spacing-2x, 8px);background-color:var(--separator-color)}.wizard-header-container .left-container kv-toggle-tip .toggle-tip-open-element-container{cursor:pointer;user-select:none;pointer-events:all;margin-left:var(--kv-spacing-2x, 8px)}';export{c as kv_wizard_footer,d as kv_wizard_header}