@progress/kendo-themes-html/dist/esm/wizard/templates/wizard-normal.mjs

A collection of HTML helpers used for developing Kendo UI themes

var n=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?n(...t):typeof t=="object"?Object.keys(t).map((s,r)=>t[r]||t[s]&&s||null).filter(s=>s!==null).join(" "):t).filter(t=>!!t).join(" ");var I=(e,t)=>n({[`${e}-xs`]:t.size==="xsmall",[`${e}-sm`]:t.size==="small",[`${e}-md`]:t.size==="medium",[`${e}-lg`]:t.size==="large",[`${e}-xl`]:t.size==="xlarge",[`${e}-xxl`]:t.size==="xxlarge",[`${e}-xxxl`]:t.size==="xxxlarge"},{[`${e}-${t.fillMode}`]:t.fillMode},{[`${e}-${t.fillMode}-${t.themeColor}`]:t.fillMode&&t.themeColor},{[`${e}-${t.themeColor}`]:t.themeColor&&t.fillMode===void 0},{"k-rounded-sm":t.rounded==="small","k-rounded-md":t.rounded==="medium","k-rounded-lg":t.rounded==="large","k-rounded-full":t.rounded==="full"}),h=(e,t)=>{let{valid:s,invalid:r,hover:c,focus:l,checked:a,active:d,selected:m,disabled:u,indeterminate:C,loading:O,empty:P,readonly:M,highlighted:S,...A}=t;return n({"k-valid":s,"k-invalid":r,"k-hover":c,"k-focus":l,"k-checked":a,"k-active":d,"k-selected":m,"k-disabled":u,"k-indeterminate":C&&!a,"k-loading":O,"k-empty":P,"k-readonly":M,"k-highlighted":S},Object.keys(A).reduce((z,v)=>(v.startsWith("k-")?z[v]=A[v]:z[`k-${v}`]=A[v],z),{}))};function ge(e,t){if(!t)return{};let s=Array.isArray(t)?t:[t];return Object.fromEntries(s.map(r=>[`k-${r}`,!0]))}var i={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},$={small:"small",medium:"medium",large:"large",full:"full"},L={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},o={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},p={open:"open",hover:"hover",focus:"focus",active:"active",selected:"selected",disabled:"disabled",valid:"valid",invalid:"invalid",loading:"loading",required:"required",empty:"empty",indeterminate:"indeterminate",checked:"checked",readonly:"readonly",highlighted:"highlighted",generating:"generating",expanded:"expanded"};var oe="wizard",be=oe;import{jsx as He}from"react/jsx-runtime";var W="k-wizard",Ie=[p.disabled],$e={},se={orientation:"horizontal",contentPosition:"right"},k=e=>{let{disabled:t,orientation:s=se.orientation,contentPosition:r=se.contentPosition,...c}=e;return He("div",{...c,className:n(e.className,W,h(W,{disabled:t}),{[`${W}-${s}`]:s,[`${W}-${r}`]:r&&s!=="horizontal"}),children:e.children})};k.states=Ie;k.options=$e;k.className=W;k.defaultOptions=se;k.moduleName=oe;k.folderName=be;import{Fragment as Ue,jsx as ve}from"react/jsx-runtime";var re="k-font-icon",De=[],We={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},Fe={},F=e=>{let{size:t,themeColor:s,icon:r,rotate:c,flip:l,...a}=e;return r?ve("span",{...a,className:n(e.className,re,I(re,{size:t}),{[`k-i-${r}`]:r,[`k-color-${s}`]:s,[`k-rotate-${c}`]:c,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"})}):ve(Ue,{})};F.states=De;F.options=We;F.className=re;F.defaultOptions=Fe;var ke=F;import{Fragment as Ze,jsx as X}from"react/jsx-runtime";var ne="k-svg-icon",Ge=[],Ve={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},ye={viewBox:"0 0 24 24"},U=e=>{let{size:t,themeColor:s,rotate:r,flip:c,viewBox:l=ye.viewBox,icon:a,...d}=e;if(!a)return X(Ze,{});a==="none"&&{...d,className:n(e.className,ne,"k-none")};let m=typeof a=="object"&&a.name&&a.name;return X("span",{...d,className:n(e.className,ne,I("k-icon",{size:t}),{[`k-svg-i-${m}`]:m,[`k-color-${s}`]:s,[`k-rotate-${r}`]:r,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"}),children:X("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof a=="object"?a.viewBox:l,dangerouslySetInnerHTML:typeof a=="object"?{__html:a.content}:void 0,children:a?void 0:e.children})})};U.states=Ge;U.options=Ve;U.className=ne;U.defaultOptions=ye;var ae=U;import*as ie from"@progress/kendo-svg-icons";var Ee="icon",Me="icons";import{Fragment as Ae,jsx as G}from"react/jsx-runtime";var Q="k-icon",qe=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),Je=[],Xe={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},le={viewBox:"0 0 24 24",type:"svg"},x=e=>{let{size:t,themeColor:s,icon:r,type:c=le.type,rotate:l,flip:a,viewBox:d=le.viewBox,...m}=e;if(!r)return G(Ae,{});if(c==="svg"){if(r==="none")return G(ae,{...m,className:n(e.className,Q),icon:r,size:t});let u=ie[r]?r:qe(`${r}-icon`);return ie[u]?G(ae,{...m,className:n(e.className,Q),icon:ie[u],size:t,themeColor:s,rotate:l,flip:a,viewBox:d}):G(Ae,{})}return G(ke,{...m,className:n(e.className,Q),icon:r,size:t,themeColor:s,rotate:l,flip:a})};x.states=Je;x.options=Xe;x.defaultOptions=le;x.className=Q;x.moduleName=Ee;x.folderName=Me;var ce="button",Ce=ce;import{Fragment as et,jsx as V,jsxs as Oe}from"react/jsx-runtime";var Z="k-button",Qe=["icon-button"],Ye=[p.hover,p.focus,p.active,p.selected,p.disabled,p.generating],je={size:[i.small,i.medium,i.large],rounded:[$.small,$.medium,$.large,$.full],fillMode:[L.solid,L.flat,L.outline,L.clear,L.link],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark,o.inverse]},R={size:i.medium,rounded:$.medium,fillMode:L.solid,themeColor:o.base,showArrow:!1,arrowIconName:"caret-alt-down"},f=e=>{let{size:t=R.size,rounded:s=R.rounded,fillMode:r=R.fillMode,themeColor:c=R.themeColor,showArrow:l=R.showArrow,arrowIconName:a=R.arrowIconName,variant:d,hover:m,focus:u,active:C,selected:O,disabled:P,icon:M,text:S,iconClassName:A,...z}=e,v=M!==void 0,te=e.children!==void 0;return Oe("button",{...z,className:n(e.className,Z,ge(Z,d),I(Z,{size:t,rounded:s,fillMode:r,themeColor:c}),h(Z,{hover:m,focus:u,active:C,disabled:P,selected:O}),{"k-icon-button":!S&&!te&&v}),children:[M&&V(x,{className:n(A,"k-button-icon"),icon:M}),S?Oe(et,{children:[S&&V("span",{className:"k-button-text",children:S}),e.children]}):e.children&&V("span",{className:"k-button-text",children:e.children}),l&&V("span",{className:"k-menu-button-arrow k-button-arrow",children:V(x,{icon:a})})]})};f.states=Ye;f.options=je;f.variants=Qe;f.className=Z;f.defaultOptions=R;f.moduleName=ce;f.folderName=Ce;import{jsx as uo}from"react/jsx-runtime";import{jsx as No}from"react/jsx-runtime";import{jsx as vo}from"react/jsx-runtime";import{Fragment as rt,jsx as H,jsxs as de}from"react/jsx-runtime";var pe="k-wizard-step",tt=[p.focus],ot={},st=de(rt,{children:[H("span",{className:"k-wizard-buttons-left",children:H("span",{className:"k-wizard-pager",children:"Step 2 of 3"})}),de("span",{className:"k-wizard-buttons-right",children:[H(f,{children:"Previous"}),H(f,{themeColor:"primary",children:"Next"})]})]}),Pe={buttons:st},B=e=>{let{focus:t,buttons:s=Pe.buttons,...r}=e;return de("div",{...r,className:n(e.className,pe,h(pe,{focus:t})),children:[H("div",{className:"k-wizard-content",children:e.children}),s&&H("div",{className:"k-wizard-buttons",children:s})]})};B.states=tt;B.options=ot;B.className=pe;B.defaultOptions=Pe;import{jsx as lt}from"react/jsx-runtime";var ze="k-wizard-steps",nt=[],at={},it={},T=e=>lt("div",{...e,className:n(e.className,ze),children:e.children});T.states=nt;T.options=at;T.className=ze;T.defaultOptions=it;var me="stepper",Le=me;import{jsx as mt}from"react/jsx-runtime";var Re="k-stepper",ct=[],pt={},dt={},y=e=>{let{style:t,...s}=e;return mt("nav",{...s,style:t,className:n(e.className,Re),children:e.children})};y.options=pt;y.states=ct;y.className=Re;y.defaultOptions=dt;y.moduleName=me;y.folderName=Le;import{jsx as ht}from"react/jsx-runtime";var ue="k-step-list",ut=[],ft={},Be={orientation:"horizontal"},_=e=>{let{style:t,orientation:s=Be.orientation,...r}=e;return ht("ol",{...r,style:t,className:n(e.className,ue,{[`${ue}-${s}`]:s}),children:e.children})};_.options=ft;_.states=ut;_.className=ue;_.defaultOptions=Be;import{jsx as g,jsxs as fe}from"react/jsx-runtime";var b="k-step",xt=[p.disabled,p.hover,p.focus,p.invalid,p.valid],Nt={},St={},E=e=>{let{style:t,disabled:s,hover:r,focus:c,invalid:l,valid:a,optional:d,first:m,done:u,current:C,last:O,label:P,text:M,icon:S,stepContent:A,...z}=e,v=l?"warning-circle":"check-circle",te=!!(a||l);return fe("li",{...z,style:t,className:n(e.className,b,{[`${b}-done`]:u,[`${b}-first`]:m,[`${b}-current`]:C,[`${b}-last`]:O,[`${b}-optional`]:d,[`${b}-success`]:a,[`${b}-error`]:l},h(b,{hover:r,focus:c,disabled:s})),children:[fe("a",{href:"#",className:"k-step-link",children:[M&&!S&&g("span",{className:"k-step-indicator",children:g("span",{className:"k-step-indicator-text",children:M})}),S&&g("span",{className:"k-step-indicator",children:g(x,{className:"k-step-indicator-icon",icon:S})}),d&&!P&&g("span",{className:"k-step-label",children:g("span",{className:"k-step-label-optional",children:"(Optional)"})}),P&&fe("span",{className:"k-step-label",children:[g("span",{className:"k-step-text",children:P}),te&&g(x,{icon:v}),d&&g("span",{className:"k-step-label-optional",children:"(Optional)"})]})]}),A&&g("div",{className:"k-step-content",style:{height:"140px"},children:A})]})};E.options=Nt;E.states=xt;E.className=b;E.defaultOptions=St;var q="progressbar",Y=q;import{jsx as xe,jsxs as he}from"react/jsx-runtime";var N="k-progressbar",gt=[p.disabled,p.indeterminate],bt={},w={indeterminate:!1,label:!0,labelPosition:"start",orientation:"horizontal",reverse:!1,value:"0"},K=e=>{let{disabled:t,height:s,indeterminate:r=w.indeterminate,label:c=w.label,labelPosition:l=w.labelPosition,orientation:a=w.orientation,reverse:d=w.reverse,value:m=w.value,width:u,style:C,...O}=e;return he("div",{...O,className:n(e.className,N,h(N,{disabled:t}),{[`${N}-${a}`]:a,[`${N}-indeterminate`]:r,[`${N}-reverse`]:d}),style:{...C,"--kendo-progressbar-value":m,[a==="horizontal"?"height":"width"]:a==="horizontal"?s:u},children:[xe("span",{className:n("k-progress-status-wrap",{[`k-progress-${l}`]:l&&!r}),children:c&&he("span",{className:"k-progress-status",children:[m,"%"]})}),!r&&xe("div",{className:"k-progressbar-value k-selected",children:xe("span",{className:n("k-progress-status-wrap",{[`k-progress-${l}`]:l}),children:c&&he("span",{className:"k-progress-status",children:[e.value,"%"]})})})]})};K.states=gt;K.options=bt;K.className=N;K.defaultOptions=w;K.moduleName=q;K.folderName=Y;var Te=K;import{jsx as Ne}from"react/jsx-runtime";var _e="k-chunk-progressbar",vt=(e,t)=>t<=e-1,kt=[p.disabled,p.indeterminate],yt={},j={chunkCount:5,orientation:"horizontal",progress:0},D=e=>{let{disabled:t,chunkCount:s=j.chunkCount,indeterminate:r,orientation:c=j.orientation,progress:l=j.progress,reverse:a,...d}=e;return Ne("div",{...d,className:n(e.className,N,_e,h(N,{disabled:t}),{[`${N}-${c}`]:c,[`${N}-indeterminate`]:r,[`${N}-reverse`]:a}),children:Ne("ul",{className:"k-progressbar-chunks k-reset",children:[...Array(s)].map((m,u)=>Ne("li",{className:n("k-progressbar-chunk",{"k-first":u===0,"k-last":u===[...Array(s)].length-1,"k-selected":vt(l,u)})},u))})})};D.states=kt;D.options=yt;D.className=_e;D.defaultOptions=j;D.moduleName=q;D.folderName=Y;import{jsx as Et}from"react/jsx-runtime";var Se=e=>Et(Te,{...e});import{jsx as cs}from"react/jsx-runtime";import{Fragment as Mt,jsx as J,jsxs as we}from"react/jsx-runtime";var Ke=({gridTemplateColumns:e="repeat(6, 1fr)",...t})=>J(y,{style:{display:"grid",gridTemplateColumns:e},children:we(Mt,{children:[we(_,{style:{gridColumnStart:"1",gridColumnEnd:"-1"},children:[J(E,{first:!0,done:!0,icon:"check",style:{maxWidth:"33.333%"}}),J(E,{current:!0,focus:!0,text:"2",style:{maxWidth:"33.333%"}}),J(E,{last:!0,optional:!0,text:"3",style:{maxWidth:"33.333%"}})]}),J(Se,{label:!1,value:"50"})]}),...t});import{Fragment as Ms,jsx as ys,jsxs as Es}from"react/jsx-runtime";import{Fragment as Is,jsx as Ks,jsxs as $s}from"react/jsx-runtime";import{Fragment as At,jsx as ee,jsxs as Ct}from"react/jsx-runtime";var Js=({...e})=>ee(k,{id:"wizard",children:Ct(At,{children:[ee(Ke,{}),ee(T,{children:ee(B,{children:"Short content"})})]}),...e});export{Js as WizardNormal};