@progress/kendo-themes-html/dist/cjs/otp/otp-input.js

A collection of HTML helpers used for developing Kendo UI themes

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