@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 14.6 kB
JavaScript
var o=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?o(...e):typeof e=="object"?Object.keys(e).map((n,r)=>e[r]||e[n]&&n||null).filter(n=>n!==null).join(" "):e).filter(e=>!!e).join(" ");var f=(t,e)=>o({[`${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"}),T=(t,e)=>o({"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"},d={small:"small",medium:"medium",large:"large",full:"full"},p={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},i={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},a={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 We}from"react/jsx-runtime";var F="k-input",Ye=[a.hover,a.focus,a.valid,a.invalid,a.required,a.disabled,a.loading,a.readonly],Qe={size:[s.small,s.medium,s.large],rounded:[d.small,d.medium,d.large,d.full],fillMode:[p.solid,p.flat,p.outline]},q={size:s.medium,rounded:s.medium,fillMode:p.solid},M=t=>{let{hover:e,focus:n,disabled:r,invalid:l,valid:c,loading:m,readonly:h,size:u=q.size,rounded:N=q.rounded,fillMode:k=q.fillMode,...v}=t;return We("span",{...v,className:o(t.className,F,f(F,{size:u,rounded:N,fillMode:k}),T(F,{hover:e,focus:n,disabled:r,invalid:l,valid:c,loading:m,readonly:h}))})};M.states=Ye;M.options=Qe;M.className=F;M.defaultOptions=q;import{jsx as et}from"react/jsx-runtime";var G="k-picker",Ze=[a.hover,a.focus,a.valid,a.invalid,a.required,a.disabled,a.loading,a.readonly],je={size:[s.small,s.medium,s.large],rounded:[d.small,d.medium,d.large,d.full],fillMode:[p.solid,p.flat,p.outline]},U={size:s.medium,rounded:d.medium,fillMode:p.solid},J=t=>{let{hover:e,focus:n,disabled:r,invalid:l,valid:c,loading:m,readonly:h,size:u=U.size,rounded:N=U.rounded,fillMode:k=U.fillMode,...v}=t;return et("span",{...v,className:o(t.className,G,f(G,{size:u,rounded:N,fillMode:k}),T(G,{hover:e,focus:n,disabled:r,invalid:l,valid:c,loading:m,readonly:h})),children:t.children})};J.states=Ze;J.options=je;J.className=G;J.defaultOptions=U;import{Fragment as st,jsx as ke}from"react/jsx-runtime";var ne="k-icon k-font-icon",tt=[],ot={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info,i.light,i.dark]},nt={},O=t=>{let{size:e,themeColor:n,icon:r,rotate:l,flip:c,...m}=t;return r?ke("span",{...m,className:o(t.className,ne,f(ne,{size:e}),{[`k-i-${r}`]:r,[`k-color-${n}`]:n,[`k-rotate-${l}`]:l,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"})}):ke(st,{})};O.states=tt;O.options=ot;O.className=ne;O.defaultOptions=nt;var ve=O;import{Fragment as rt,jsx as X}from"react/jsx-runtime";var se="k-icon k-svg-icon",at=[],it={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info,i.light,i.dark]},ye={viewBox:"0 0 24 24"},B=t=>{let{size:e,themeColor:n,rotate:r,flip:l,viewBox:c=ye.viewBox,icon:m,...h}=t;if(!m)return X(rt,{});m==="none"&&{...h,className:o(t.className,se,"k-none")};let u=typeof m=="object"&&m.name&&m.name;return X("span",{...h,className:o(t.className,se,f("k-icon",{size:e}),{[`k-svg-i-${u}`]:u,[`k-color-${n}`]:n,[`k-rotate-${r}`]:r,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"}),children:X("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof m=="object"?m.viewBox:c,dangerouslySetInnerHTML:typeof m=="object"?{__html:m.content}:void 0,children:m?void 0:t.children})})};B.states=at;B.options=it;B.className=se;B.defaultOptions=ye;var ae=B;import*as ge from"@progress/kendo-svg-icons";import{Fragment as be,jsx as w}from"react/jsx-runtime";var lt=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),ct=[],mt={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info,i.light,i.dark]},ie={viewBox:"0 0 24 24",type:"svg"},S=t=>{let{size:e,themeColor:n,icon:r,type:l=ie.type,rotate:c,flip:m,viewBox:h=ie.viewBox,...u}=t;if(!r)return w(be,{});if(l==="svg"){if(r==="none")return w(ae,{...u,icon:r,size:e});let N=lt(`${r}-icon`);return ge[N]?w(ae,{...u,icon:ge[N],size:e,themeColor:n,rotate:c,flip:m,viewBox:h}):w(be,{})}return w(ve,{...u,icon:r,size:e,themeColor:n,rotate:c,flip:m})};S.states=ct;S.options=mt;S.defaultOptions=ie;import{Fragment as ut,jsx as re}from"react/jsx-runtime";var Me="k-clear-value",dt=[a.disabled,a.loading,a.readonly],pt={},E=t=>{let{disabled:e,loading:n,readonly:r,value:l}=t;return e||r||n||!l?re(ut,{}):re("span",{className:o(t.className,Me),children:re(S,{icon:"x"})})};E.states=dt;E.options=pt;E.className=Me;import{jsx as ht}from"react/jsx-runtime";var le="k-input-inner",ft=[],xt={},Y={type:"text",autocomplete:"off",value:"",placeholder:""},R=t=>{let{value:e=Y.value,type:n=Y.type,placeholder:r=Y.placeholder,autocomplete:l=Y.autocomplete,...c}=t;return ht("input",{...c,type:n,className:o(t.className,le,f(le,t)),placeholder:r,autoComplete:l,defaultValue:e})};R.states=ft;R.options=xt;R.className=le;import{jsx as Ie,jsxs as kt}from"react/jsx-runtime";var ce="k-input-inner",Nt=[],St={},me=t=>{let{value:e,placeholder:n,showValue:r,valueIcon:l,valueIconName:c,...m}=t;return kt("span",{...m,className:o(t.className,ce,f(ce,t)),children:[l,!l&&c&&Ie(S,{className:"k-input-value-icon",icon:c}),r&&!e&&n,r&&e&&Ie("span",{className:"k-input-value-text",children:e})]})};me.states=Nt;me.options=St;me.className=ce;import{jsx as gt}from"react/jsx-runtime";var de="k-input-inner",vt=[],yt={},Te={value:"",placeholder:""},pe=t=>{let{value:e=Te.value,placeholder:n=Te.placeholder,rows:r,...l}=t;return gt("textarea",{...l,className:o(t.className,de,f(de,t)),placeholder:n,rows:r,defaultValue:e})};pe.states=vt;pe.options=yt;pe.className=de;import{Fragment as Mt,jsx as Ce}from"react/jsx-runtime";var Ae="k-input-loading-icon",bt=[a.disabled,a.loading],Q=t=>{let{disabled:e,loading:n}=t;return e||!n?Ce(Mt,{}):Ce("span",{className:o(t.className,Ae,"k-icon k-i-loading")})};Q.states=bt;Q.className=Ae;import{Fragment as Ct,jsx as He}from"react/jsx-runtime";var Pe="k-input-validation-icon",It=[a.valid,a.invalid,a.disabled,a.loading],Tt={},K=t=>{let{valid:e,invalid:n,disabled:r,loading:l}=t,c=n?"warning-circle":"check-circle";return r||l||!!!(e||n)?He(Ct,{}):He(S,{className:o(Pe),icon:c})};K.states=It;K.options=Tt;K.className=Pe;import{Fragment as Pt,jsx as ze}from"react/jsx-runtime";var At="k-input-prefix",Ht={direction:"horizontal"},Le=t=>{let{direction:e=Ht.direction,...n}=t;return t.children?ze("span",{...n,className:o(At,t.className,{[`k-input-prefix-${e}`]:e}),children:t.children}):ze(Pt,{})};import{Fragment as Ot,jsx as Oe}from"react/jsx-runtime";var zt="k-input-suffix",Lt={direction:"horizontal"},Be=t=>{let{direction:e=Lt.direction,...n}=t;return t.children?Oe("span",{...n,className:o(zt,t.className,{[`k-input-suffix-${e}`]:e}),children:t.children}):Oe(Ot,{})};import{jsx as nn}from"react/jsx-runtime";import{jsx as ln}from"react/jsx-runtime";import{jsx as pn}from"react/jsx-runtime";import{Fragment as Et,jsx as $,jsxs as we}from"react/jsx-runtime";var W="k-button",Bt=[a.hover,a.focus,a.active,a.selected,a.disabled],wt={size:[s.small,s.medium,s.large],rounded:[d.small,d.medium,d.large,d.full],fillMode:[p.solid,p.flat,p.outline,p.clear,p.link],themeColor:[i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info,i.light,i.dark,i.inverse]},A={size:s.medium,rounded:d.medium,fillMode:p.solid,themeColor:i.base,showArrow:!1,arrowIconName:"caret-alt-down"},x=t=>{let{size:e=A.size,rounded:n=A.rounded,fillMode:r=A.fillMode,themeColor:l=A.themeColor,showArrow:c=A.showArrow,arrowIconName:m=A.arrowIconName,hover:h,focus:u,active:N,selected:k,disabled:v,icon:L,text:b,iconClassName:H,..._}=t,te=L!==void 0,oe=t.children!==void 0;return we("button",{..._,className:o(t.className,W,f(W,{size:e,rounded:n,fillMode:r,themeColor:l}),T(W,{hover:h,focus:u,active:N,disabled:v,selected:k}),{"k-icon-button":!b&&!oe&&te}),children:[L&&$(S,{className:o(H,"k-button-icon"),icon:L}),b?we(Et,{children:[b&&$("span",{className:"k-button-text",children:b}),t.children]}):t.children&&$("span",{className:"k-button-text",children:t.children}),c&&$("span",{className:"k-menu-button-arrow k-button-arrow",children:$(S,{icon:m})})]})};x.states=Bt;x.options=wt;x.className=W;x.defaultOptions=A;import{jsx as Bn}from"react/jsx-runtime";import{jsx as Kn}from"react/jsx-runtime";import{jsx as _n}from"react/jsx-runtime";import{jsx as Ee}from"react/jsx-runtime";var Re="k-animation-container",Rt=[],Kt={},Ke={positionMode:"absolute"},P=t=>{let{positionMode:e=Ke.positionMode,animationStyle:n,offset:r,...l}=t;return Ee("div",{...l,style:{...r,...t.style},className:o(t.className,Re,"k-animation-container-shown",{"k-animation-container-fixed":e==="fixed"}),children:Ee("div",{className:"k-child-animation-container",style:n,children:t.children})})};P.states=Rt;P.options=Kt;P.className=Re;P.defaultOptions=Ke;import{jsx as $e}from"react/jsx-runtime";var Ve="k-popup",$t=[],Vt={},De={positionMode:"absolute"},I=t=>{let{offset:e,positionMode:n=De.positionMode,animationStyle:r,...l}=t;return $e(P,{positionMode:n,offset:e,animationStyle:r,children:$e("div",{...l,className:o(t.className,Ve),children:t.children})})};I.states=$t;I.options=Vt;I.className=Ve;I.defaultOptions=De;import{Fragment as ue,jsx as V,jsxs as _e}from"react/jsx-runtime";var fe="k-timeselector",Dt=[],_t={size:[s.small,s.medium,s.large]},Fe={size:s.medium},z=t=>{let{size:e=Fe.size,header:n,fastSelection:r,columns:l,focusedColumn:c,...m}=t,h=l.map(function(u,N){let k=!1,v=!0;return u===c&&(k=!0),(N===0||u==="tt")&&(v=!1),V(ue,{children:V(xe,{type:u,focus:k,separator:v})})});return _e("div",{...m,className:o(t.className,fe,f(fe,{size:e})),children:[V(ue,{children:n}),V(ue,{children:r}),_e("div",{className:"k-time-list-container",children:[V("span",{className:"k-time-highlight"}),h]})]})};z.states=Dt;z.options=_t;z.className=fe;z.defaultOptions=Fe;import{Fragment as qe,jsx as C,jsxs as he}from"react/jsx-runtime";var Ft=[a.focus],xe=t=>{let{type:e,focus:n,separator:r,...l}=t,c,m=["00","01","02","03","04","05","06","07","08","09"];switch(e){case"dd":c="Day";break;case"HH":c="Hour";break;case"mm":c="Minute";break;case"ss":c="Second";break;case"SSS":c="Millisecond",m=["000","001","002","003","004","005","006","007","008","009"];break;case"tt":c="AM/PM",m=["AM","PM"];break;default:c="Column Name";break}let h=m.map(u=>C(qe,{children:C("li",{className:"k-item",children:C("span",{children:u})})}));return he(qe,{children:[r&&C("div",{className:"k-time-separator",children:":"}),he("div",{...l,className:o(t.className,"k-time-list-wrapper",T("k-time-list-wrapper",{focus:n})),children:[C("span",{className:"k-title",children:c}),C("div",{className:"k-time-list",children:he("div",{className:"k-content k-scrollable k-time-container",children:[C("ul",{className:"k-reset",style:{transform:"translateY(97px)"},children:h}),C("div",{className:"k-scrollable-placeholder"})]})})]})]})};xe.states=Ft;import{jsx as xs,jsxs as hs}from"react/jsx-runtime";import{jsx as Ut}from"react/jsx-runtime";var Z="k-actions",qt=[],Gt={},Ne={alignment:"start",orientation:"horizontal"},y=t=>{let{alignment:e=Ne.alignment,orientation:n=Ne.orientation,...r}=t;return Ut("div",{...r,className:o(Z,{[`${Z}-${e}`]:e,[`${Z}-${n}`]:n},t.className),children:t.children})};y.states=qt;y.options=Gt;y.className=Z;y.defaultOptions=Ne;import{jsx as Se,jsxs as Xt}from"react/jsx-runtime";var Jt="k-time-fast-selection",Ge=t=>{let{...e}=t;return Xt(y,{...e,alignment:"start",className:o(t.className,Jt),children:[Se(x,{children:"1 d"}),Se(x,{children:"1 h"}),Se(x,{children:"15 m"})]})};import{Fragment as Es,jsx as Bs,jsxs as ws}from"react/jsx-runtime";import{Fragment as Us,jsx as qs,jsxs as Gs}from"react/jsx-runtime";import{Fragment as oa,jsx as ea,jsxs as ta}from"react/jsx-runtime";import{Fragment as Wt,jsx as g,jsxs as j}from"react/jsx-runtime";var Xe="k-timedurationpicker",Yt=[a.hover,a.focus,a.valid,a.invalid,a.required,a.disabled,a.loading,a.readonly],Qt={size:[s.small,s.medium,s.large],rounded:[d.small,d.medium,d.large,d.full],fillMode:[p.solid,p.flat,p.outline]},ee={size:M.defaultOptions.size,rounded:M.defaultOptions.rounded,fillMode:M.defaultOptions.fillMode},D=t=>{let{size:e=ee.size,rounded:n=ee.rounded,fillMode:r=ee.fillMode,prefix:l,suffix:c,value:m,placeholder:h,hover:u,focus:N,valid:k,invalid:v,required:L,loading:b,disabled:H,readonly:_,opened:te,...oe}=t;return j(Wt,{children:[j(M,{...oe,size:e,rounded:n,fillMode:r,hover:u,focus:N,valid:k,invalid:v,required:L,loading:b,disabled:H,readonly:_,className:o(t.className,Xe),children:[g(Le,{children:l}),g(R,{placeholder:h,value:m}),g(K,{valid:k,invalid:v,loading:b,disabled:H}),g(Q,{loading:b,disabled:H}),g(E,{loading:b,disabled:H,readonly:_,value:m}),g(Be,{children:c}),g(x,{className:"k-input-button",icon:"clock-arrow-rotate",rounded:null,size:e,fillMode:r})]}),te&&j(I,{className:"k-timedurationpicker-popup",children:[g(z,{columns:["dd","HH","mm"],focusedColumn:"HH",fastSelection:g(Ge,{})}),j(y,{alignment:"stretched",className:"k-timeduration-footer",children:[g(x,{className:"k-time-cancel",children:"Cancel"}),g(x,{themeColor:"primary",className:"k-time-accept",children:"Set"})]})]})]})};D.states=Yt;D.options=Qt;D.className=Xe;D.defaultOptions=ee;var Sa=D;export{Xe as TIMEDURATIONPICKER_CLASSNAME,D as TimeDurationPicker,Sa as default};