@progress/kendo-themes-html/dist/esm/otp/templates/otp-groups-no-space.mjs

A collection of HTML helpers used for developing Kendo UI themes

var i=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?i(...e):typeof e=="object"?Object.keys(e).map((n,a)=>e[a]||e[n]&&n||null).filter(n=>n!==null).join(" "):e).filter(e=>!!e).join(" ");var m=(t,e)=>i({[`${t}-xs`]:e.size==="xsmall",[`${t}-sm`]:e.size==="small",[`${t}-md`]:e.size==="medium",[`${t}-lg`]:e.size==="large",[`${t}-xl`]:e.size==="xlarge",[`${t}-xxl`]:e.size==="xxlarge",[`${t}-xxxl`]:e.size==="xxxlarge"},{[`${t}-${e.fillMode}`]:e.fillMode},{[`${t}-${e.fillMode}-${e.themeColor}`]:e.fillMode&&e.themeColor},{[`${t}-${e.themeColor}`]:e.themeColor&&e.fillMode===void 0},{"k-rounded-sm":e.rounded==="small","k-rounded-md":e.rounded==="medium","k-rounded-lg":e.rounded==="large","k-rounded-full":e.rounded==="full"}),v=(t,e)=>i({"k-valid":e.valid,"k-invalid":e.invalid,"k-hover":e.hover,"k-focus":e.focus,"k-checked":e.checked,"k-active":e.active,"k-selected":e.selected,"k-disabled":e.disabled,"k-indeterminate":e.indeterminate&&!e.checked,"k-loading":e.loading,"k-empty":e.empty,"k-readonly":e.readonly,"k-highlighted":e.highlighted});var s={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},c={small:"small",medium:"medium",large:"large",full:"full"},p={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},l={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},o={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"};import{jsx as Ue}from"react/jsx-runtime";var D="k-otp",qe=[o.invalid],De={size:[s.small,s.medium,s.large]},be={size:s.medium},y=t=>{let{size:e=be.size,invalid:n,...a}=t;return Ue("div",{...a,className:i(t.className,D,m(D,{size:e}),v(D,{invalid:n})),children:t.children})};y.states=qe;y.options=De;y.className=D;y.defaultOptions=be;import{jsx as Je}from"react/jsx-runtime";var U="k-input",Xe=[o.hover,o.focus,o.valid,o.invalid,o.required,o.disabled,o.loading,o.readonly],We={size:[s.small,s.medium,s.large],rounded:[c.small,c.medium,c.large,c.full],fillMode:[p.solid,p.flat,p.outline]},X={size:s.medium,rounded:s.medium,fillMode:p.solid},g=t=>{let{hover:e,focus:n,disabled:a,invalid:r,valid:d,loading:u,readonly:x,size:f=X.size,rounded:b=X.rounded,fillMode:N=X.fillMode,...T}=t;return Je("span",{...T,className:i(t.className,U,m(U,{size:f,rounded:b,fillMode:N}),v(U,{hover:e,focus:n,disabled:a,invalid:r,valid:d,loading:u,readonly:x}))})};g.states=Xe;g.options=We;g.className=U;g.defaultOptions=X;import{jsx as Ze}from"react/jsx-runtime";var W="k-picker",Qe=[o.hover,o.focus,o.valid,o.invalid,o.required,o.disabled,o.loading,o.readonly],Ye={size:[s.small,s.medium,s.large],rounded:[c.small,c.medium,c.large,c.full],fillMode:[p.solid,p.flat,p.outline]},J={size:s.medium,rounded:c.medium,fillMode:p.solid},Q=t=>{let{hover:e,focus:n,disabled:a,invalid:r,valid:d,loading:u,readonly:x,size:f=J.size,rounded:b=J.rounded,fillMode:N=J.fillMode,...T}=t;return Ze("span",{...T,className:i(t.className,W,m(W,{size:f,rounded:b,fillMode:N}),v(W,{hover:e,focus:n,disabled:a,invalid:r,valid:d,loading:u,readonly:x})),children:t.children})};Q.states=Qe;Q.options=Ye;Q.className=W;Q.defaultOptions=J;import{Fragment as ot,jsx as Ne}from"react/jsx-runtime";var se="k-icon k-font-icon",je=[],et={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[l.base,l.primary,l.secondary,l.tertiary,l.success,l.warning,l.error,l.info,l.light,l.dark]},tt={},K=t=>{let{size:e,themeColor:n,icon:a,rotate:r,flip:d,...u}=t;return a?Ne("span",{...u,className:i(t.className,se,m(se,{size:e}),{[`k-i-${a}`]:a,[`k-color-${n}`]:n,[`k-rotate-${r}`]:r,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"})}):Ne(ot,{})};K.states=je;K.options=et;K.className=se;K.defaultOptions=tt;var ve=K;import{Fragment as at,jsx as Y}from"react/jsx-runtime";var ae="k-icon k-svg-icon",nt=[],st={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[l.base,l.primary,l.secondary,l.tertiary,l.success,l.warning,l.error,l.info,l.light,l.dark]},Te={viewBox:"0 0 24 24"},B=t=>{let{size:e,themeColor:n,rotate:a,flip:r,viewBox:d=Te.viewBox,icon:u,...x}=t;if(!u)return Y(at,{});u==="none"&&{...x,className:i(t.className,ae,"k-none")};let f=typeof u=="object"&&u.name&&u.name;return Y("span",{...x,className:i(t.className,ae,m("k-icon",{size:e}),{[`k-svg-i-${f}`]:f,[`k-color-${n}`]:n,[`k-rotate-${a}`]:a,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),children:Y("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof u=="object"?u.viewBox:d,dangerouslySetInnerHTML:typeof u=="object"?{__html:u.content}:void 0,children:u?void 0:t.children})})};B.states=nt;B.options=st;B.className=ae;B.defaultOptions=Te;var ie=B;import*as ye from"@progress/kendo-svg-icons";import{Fragment as ge,jsx as R}from"react/jsx-runtime";var it=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),lt=[],rt={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[l.base,l.primary,l.secondary,l.tertiary,l.success,l.warning,l.error,l.info,l.light,l.dark]},le={viewBox:"0 0 24 24",type:"svg"},I=t=>{let{size:e,themeColor:n,icon:a,type:r=le.type,rotate:d,flip:u,viewBox:x=le.viewBox,...f}=t;if(!a)return R(ge,{});if(r==="svg"){if(a==="none")return R(ie,{...f,icon:a,size:e});let b=it(`${a}-icon`);return ye[b]?R(ie,{...f,icon:ye[b],size:e,themeColor:n,rotate:d,flip:u,viewBox:x}):R(ge,{})}return R(ve,{...f,icon:a,size:e,themeColor:n,rotate:d,flip:u})};I.states=lt;I.options=rt;I.defaultOptions=le;import{Fragment as ut,jsx as re}from"react/jsx-runtime";var Oe="k-clear-value",dt=[o.disabled,o.loading,o.readonly],pt={},V=t=>{let{disabled:e,loading:n,readonly:a,value:r}=t;return e||a||n||!r?re(ut,{}):re("span",{className:i(t.className,Oe),children:re(I,{icon:"x"})})};V.states=dt;V.options=pt;V.className=Oe;import{jsx as ft}from"react/jsx-runtime";var de="k-input-inner",ct=[],mt={},Z={type:"text",autocomplete:"off",value:"",placeholder:""},$=t=>{let{value:e=Z.value,type:n=Z.type,placeholder:a=Z.placeholder,autocomplete:r=Z.autocomplete,...d}=t;return ft("input",{...d,type:n,className:i(t.className,de,m(de,t)),placeholder:a,autoComplete:r,defaultValue:e})};$.states=ct;$.options=mt;$.className=de;import{jsx as Se,jsxs as It}from"react/jsx-runtime";var pe="k-input-inner",xt=[],ht={},ue=t=>{let{value:e,placeholder:n,showValue:a,valueIcon:r,valueIconName:d,...u}=t;return It("span",{...u,className:i(t.className,pe,m(pe,t)),children:[r,!r&&d&&Se(I,{className:"k-input-value-icon",icon:d}),a&&!e&&n,a&&e&&Se("span",{className:"k-input-value-text",children:e})]})};ue.states=xt;ue.options=ht;ue.className=pe;import{jsx as vt}from"react/jsx-runtime";var ce="k-input-inner",bt=[],Nt={},Me={value:"",placeholder:""},me=t=>{let{value:e=Me.value,placeholder:n=Me.placeholder,rows:a,...r}=t;return vt("textarea",{...r,className:i(t.className,ce,m(ce,t)),placeholder:n,rows:a,defaultValue:e})};me.states=bt;me.options=Nt;me.className=ce;import{Fragment as yt,jsx as we}from"react/jsx-runtime";var Pe="k-input-loading-icon",Tt=[o.disabled,o.loading],j=t=>{let{disabled:e,loading:n}=t;return e||!n?we(yt,{}):we("span",{className:i(t.className,Pe,"k-icon k-i-loading")})};j.states=Tt;j.className=Pe;import{Fragment as St,jsx as ke}from"react/jsx-runtime";var ze="k-input-validation-icon",gt=[o.valid,o.invalid,o.disabled,o.loading],Ot={},G=t=>{let{valid:e,invalid:n,disabled:a,loading:r}=t,d=n?"warning-circle":"check-circle";return a||r||!!!(e||n)?ke(St,{}):ke(I,{className:i(ze),icon:d})};G.states=gt;G.options=Ot;G.className=ze;import{Fragment as Pt,jsx as Ce}from"react/jsx-runtime";var Mt="k-input-prefix",wt={direction:"horizontal"},Le=t=>{let{direction:e=wt.direction,...n}=t;return t.children?Ce("span",{...n,className:i(Mt,t.className,{[`k-input-prefix-${e}`]:e}),children:t.children}):Ce(Pt,{})};import{Fragment as Ct,jsx as Ae}from"react/jsx-runtime";var kt="k-input-suffix",zt={direction:"horizontal"},He=t=>{let{direction:e=zt.direction,...n}=t;return t.children?Ae("span",{...n,className:i(kt,t.className,{[`k-input-suffix-${e}`]:e}),children:t.children}):Ae(Ct,{})};import{jsx as sn}from"react/jsx-runtime";import{jsx as dn}from"react/jsx-runtime";import{jsx as At}from"react/jsx-runtime";var Ee="k-input-separator",Lt={direction:"vertical"},fe=t=>{let{direction:e=Lt.direction,...n}=t;return At("span",{...n,className:i(Ee,t.className,{[`${Ee}-${e}`]:e})})};import{Fragment as Ke,jsx as M,jsxs as xe}from"react/jsx-runtime";var Be="k-textbox",Ht=[o.hover,o.focus,o.valid,o.invalid,o.required,o.disabled,o.loading,o.readonly],Et={size:[s.small,s.medium,s.large],rounded:[c.small,c.medium,c.large,c.full],fillMode:[p.solid,p.flat,p.outline]},z={showClearButton:!0,showValidationIcon:!0,size:g.defaultOptions.size,rounded:g.defaultOptions.rounded,fillMode:g.defaultOptions.fillMode,separators:!0},O=t=>{let{size:e=z.size,rounded:n=z.rounded,fillMode:a=z.fillMode,separators:r=z.separators,showClearButton:d=z.showClearButton,showValidationIcon:u=z.showValidationIcon,prefix:x,suffix:f,type:b,value:N,placeholder:T,hover:k,focus:S,valid:H,invalid:F,required:ne,loading:E,disabled:q,readonly:Ie,...Fe}=t;return xe(g,{...Fe,size:e,rounded:n,fillMode:a,hover:k,focus:S,valid:H,invalid:F,required:ne,loading:E,disabled:q,readonly:Ie,className:i(t.className,Be),children:[x&&xe(Ke,{children:[M(Le,{children:x}),r&&M(fe,{})]}),M($,{placeholder:T,value:N,type:b}),u&&M(G,{valid:H,invalid:F,loading:E,disabled:q}),M(j,{loading:E,disabled:q}),d&&M(V,{loading:E,disabled:q,readonly:Ie,value:N}),f&&xe(Ke,{children:[r&&M(fe,{}),M(He,{children:f})]})]})};O.states=Ht;O.options=Et;O.className=Be;O.defaultOptions=z;import{jsx as Hn}from"react/jsx-runtime";import{Fragment as $n,jsx as Vn}from"react/jsx-runtime";import{Fragment as Rt,jsx as _,jsxs as Ve}from"react/jsx-runtime";var ee="k-button",Kt=[o.hover,o.focus,o.active,o.selected,o.disabled],Bt={size:[s.small,s.medium,s.large],rounded:[c.small,c.medium,c.large,c.full],fillMode:[p.solid,p.flat,p.outline,p.clear,p.link],themeColor:[l.base,l.primary,l.secondary,l.tertiary,l.success,l.warning,l.error,l.info,l.light,l.dark,l.inverse]},C={size:s.medium,rounded:c.medium,fillMode:p.solid,themeColor:l.base,showArrow:!1,arrowIconName:"caret-alt-down"},L=t=>{let{size:e=C.size,rounded:n=C.rounded,fillMode:a=C.fillMode,themeColor:r=C.themeColor,showArrow:d=C.showArrow,arrowIconName:u=C.arrowIconName,hover:x,focus:f,active:b,selected:N,disabled:T,icon:k,text:S,iconClassName:H,...F}=t,ne=k!==void 0,E=t.children!==void 0;return Ve("button",{...F,className:i(t.className,ee,m(ee,{size:e,rounded:n,fillMode:a,themeColor:r}),v(ee,{hover:x,focus:f,active:b,disabled:T,selected:N}),{"k-icon-button":!S&&!E&&ne}),children:[k&&_(I,{className:i(H,"k-button-icon"),icon:k}),S?Ve(Rt,{children:[S&&_("span",{className:"k-button-text",children:S}),t.children]}):t.children&&_("span",{className:"k-button-text",children:t.children}),d&&_("span",{className:"k-menu-button-arrow k-button-arrow",children:_(I,{icon:u})})]})};L.states=Kt;L.options=Bt;L.className=ee;L.defaultOptions=C;import{jsx as Wn}from"react/jsx-runtime";import{jsx as Zn}from"react/jsx-runtime";import{jsx as os}from"react/jsx-runtime";import{Fragment as fs,jsx as ms}from"react/jsx-runtime";import{jsx as Gt}from"react/jsx-runtime";var $e="k-otp-input",Vt=[o.hover,o.focus,o.valid,o.invalid,o.required,o.disabled,o.readonly],$t={size:[s.small,s.medium,s.large],rounded:[c.small,c.medium,c.large,c.full],fillMode:[p.solid,p.flat,p.outline]},te={size:O.defaultOptions.size,rounded:O.defaultOptions.rounded,fillMode:O.defaultOptions.fillMode},h=t=>{let{size:e=te.size,rounded:n=te.rounded,fillMode:a=te.fillMode,type:r,value:d,placeholder:u,hover:x,focus:f,valid:b,invalid:N,required:T,disabled:k,readonly:S,...H}=t;return Gt(O,{...H,size:e,rounded:n,fillMode:a,type:r,value:d,placeholder:u,hover:x,focus:f,valid:b,invalid:N,required:T,disabled:k,readonly:S,showClearButton:!1,showValidationIcon:!1,className:i(t.className,$e)})};h.states=Vt;h.options=$t;h.className=$e;h.defaultOptions=te;import{jsx as Dt}from"react/jsx-runtime";var Ge="k-otp-separator",_t=[],Ft={},qt={},A=t=>{let{children:e,...n}=t;return Dt("div",{...n,className:i(t.className,Ge),children:e})};A.states=_t;A.options=Ft;A.className=Ge;A.defaultOptions=qt;import{Fragment as Cs,jsx as zs,jsxs as Ls}from"react/jsx-runtime";import{jsx as Wt}from"react/jsx-runtime";var oe="k-input-group",Ut=[o.disabled],Xt={fillMode:[p.solid,p.flat,p.outline,p.clear,p.link]},_e={fillMode:p.solid},w=t=>{let{fillMode:e=_e.fillMode,disabled:n,...a}=t;return Wt("div",{...a,className:i(t.className,oe,m(oe,{fillMode:e}),v(oe,{disabled:n})),children:t.children})};w.states=Ut;w.options=Xt;w.className=oe;w.defaultOptions=_e;import{Fragment as qs,jsx as _s,jsxs as Fs}from"react/jsx-runtime";import{Fragment as Js,jsx as Ws,jsxs as Qs}from"react/jsx-runtime";import{Fragment as Jt,jsx as P,jsxs as he}from"react/jsx-runtime";var ra=({hover:t,focus:e,invalid:n,fillMode:a,size:r,...d})=>P(y,{invalid:n,size:r,children:he(Jt,{children:[he(w,{fillMode:a,children:[P(h,{size:r,fillMode:a,invalid:n,focus:e,hover:t,...d}),P(h,{size:r,fillMode:a,invalid:n,...d}),P(h,{size:r,fillMode:a,invalid:n,...d})]}),P(A,{children:"-"}),he(w,{fillMode:a,children:[P(h,{size:r,fillMode:a,invalid:n,...d}),P(h,{size:r,fillMode:a,invalid:n,...d}),P(h,{size:r,fillMode:a,invalid:n,...d})]})]})});export{ra as OneTimePasswordGroupsNoSpace};