@kelvininc/ui-components
Version:
Kelvin UI Components
1 lines • 5.49 kB
JavaScript
import{r as e,c as t,h as a,H as i}from"./p-WTwLUJcM.js";import{j as r,d as n,o as s}from"./p-COrzvkrr.js";const o={"--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=e=>{this.prevClick.emit(e)},this.onNextClick=e=>{this.nextClick.emit(e)},this.onCancelClick=e=>{this.cancelClick.emit(e)},this.onCompleteClick=e=>{this.completeClick.emit(e)},this.onStepClick=({detail:e})=>{this.stepClick.emit(e)}}render(){return a(i,{key:"1c72b48a085e1fde9d89507ac439de49ba326758"},a("div",{key:"941b5b1e93bfc47a026e2a4942bc19446540c195",class:"wizard-footer-container"},a("div",{key:"ad4384e06a633ad552dd16760d7c175bf0d0868e",class:"actions-container",part:"footer-actions-container"},this.showStepBar&&a("div",{key:"9c297a9ab1791fa02e567eb7fa93bce06e713ddc",class:"wizard-stepper"},a("kv-step-bar",{key:"4cfda7504734d659e3f4604de04623fdd4b3d3f1",label:this.label,steps:this.steps,currentStep:this.currentStep,progressPercentage:this.progressPercentage,hasError:this.hasError,onStepClicked:this.onStepClick})),a("slot",{key:"9a6da7fe005aa1bbee378067b8d73f527a876263",name:"additional-actions"})),a("div",{key:"eeb928d2812621d145f8048bed4695230b02a60e",class:"buttons-container"},this.showCancelBtn&&a("kv-action-button-text",{key:"8e8c33251445c004b6c660c399907c23a952f378",type:r.Tertiary,text:"Cancel",disabled:!this.cancelEnabled,onClickButton:({detail:e})=>this.onCancelClick(e)}),this.showPrevBtn&&a("kv-action-button-text",{key:"a8e79366aa9a139fd864ec4c4a22097f05e1fb88",type:r.Tertiary,text:"Previous",disabled:!this.prevEnabled,onClickButton:({detail:e})=>this.onPrevClick(e)}),this.showNextBtn&&a("kv-tooltip",{key:"4a33b37757bcf7ece8fdc11b731b91fbcde3abe3",position:n.TopEnd,text:this.nextTooltip,customStyle:o},a("kv-action-button-text",{key:"92d3abc54efab613dbc64be3b1cd9af05e0b5bcb",type:r.Primary,text:"Next",disabled:!this.nextEnabled,onClickButton:({detail:e})=>this.onNextClick(e)})),this.showCompleteBtn&&a("kv-tooltip",{key:"003e61445fd913a3fee53bbedbb43831efd8297d",position:n.TopEnd,text:this.completeTooltip,customStyle:o},a("kv-action-button-text",{key:"a62be7cc9a03a5ee7ca2dddda79c3f4ca0b74de9",type:r.Primary,text:this.completeBtnLabel,disabled:!this.completeEnabled,onClickButton:({detail:e})=>this.onCompleteClick(e)})))))}};c.style='@property --rotation{syntax:"<angle>";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}kv-dropdown-base:not(.hydrated)>[slot=list]{display:none}:host{--stepper-width:100%}.wizard-footer-container{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-2xl)}.wizard-footer-container .actions-container{display:flex;flex:1}.wizard-footer-container .actions-container .wizard-stepper{width:var(--stepper-width);padding-right:var(--spacing-2xl)}.wizard-footer-container .buttons-container{display:flex;gap:var(--spacing-xl)}';const d=class{constructor(t){e(this,t)}render(){var e;return a(i,{key:"755722aafe8c7c992d81936e1fd05bc970a49a8f"},a("div",{key:"ea3295bdc10841fcd2636f00dbe33db3965cc03e",class:"wizard-header-container"},a("div",{key:"2196bef1c7318b14a6096cc7a4fef74c864eab8a",class:"left-container"},a("span",{key:"0396db15a603d405e72af97cf00efbf5341d520a",class:"label"},this.label),a("span",{key:"421cba23aac898ce48870e7b3d7a44148ee23bac",class:"separator"}),a("span",{key:"ba0b7f662cbe4b0504d98e4fca5295dab09caabb",class:"description"},this.description),(null===(e=this.tip)||void 0===e?void 0:e.length)>0&&a("kv-toggle-tip",{key:"afc847b950a6c13e99f8b393fd18036bd9dba376",text:this.tip,position:n.Bottom,customClass:"wizard-header-tip"},a("kv-icon",{key:"082f1c4c12a0a8658cf373baa6108d5367a07881",name:s.Info,slot:"open-element-slot"}))),a("slot",{key:"7cea27cf9c27afeb6fc428498bef8b8358066fb4",name:"additional-header-actions"})))}};d.style='@property --rotation{syntax:"<angle>";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}kv-dropdown-base:not(.hydrated)>[slot=list]{display:none}:host{--text-color:var(--text-surface-neutral-secondary);--separator-color:var(--text-surface-neutral-secondary);--container-padding:var(--spacing-2xl)}.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:Proxima Nova;font-weight:600;font-size:12px;line-height:16px;letter-spacing:1.5px;text-transform:uppercase}.wizard-header-container .left-container .description{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Proxima Nova;font-weight:400;font-size:14px;line-height:20px;letter-spacing:0}.wizard-header-container .left-container .separator{width:4px;height:4px;border-radius:50%;margin:0 var(--spacing-md);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(--spacing-md)}';export{c as kv_wizard_footer,d as kv_wizard_header}