@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 15.1 kB
JavaScript
var a=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?a(...t):typeof t=="object"?Object.keys(t).map((o,s)=>t[s]||t[o]&&o||null).filter(o=>o!==null).join(" "):t).filter(t=>!!t).join(" ");var b=(e,t)=>a({[`${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"}),w=(e,t)=>{let{valid:o,invalid:s,hover:l,focus:d,checked:c,active:f,selected:u,disabled:h,indeterminate:N,loading:S,empty:C,readonly:y,highlighted:M,...g}=t;return a({"k-valid":o,"k-invalid":s,"k-hover":l,"k-focus":d,"k-checked":c,"k-active":f,"k-selected":u,"k-disabled":h,"k-indeterminate":N&&!c,"k-loading":S,"k-empty":C,"k-readonly":y,"k-highlighted":M},Object.keys(g).reduce((_,I)=>(I.startsWith("k-")?_[I]=g[I]:_[`k-${I}`]=g[I],_),{}))};function Le(e,t){if(!t)return{};let o=Array.isArray(t)?t:[t];return Object.fromEntries(o.map(s=>[`k-${s}`,!0]))}var r={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},p={small:"small",medium:"medium",large:"large",full:"full"},m={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"},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 re="action-buttons",Ce=re;import{jsx as ct}from"react/jsx-runtime";var Y="k-actions",it=[],lt={},ie={alignment:"start",orientation:"horizontal"},A=e=>{let{alignment:t=ie.alignment,orientation:o=ie.orientation,...s}=e;return ct("div",{...s,className:a(Y,{[`${Y}-${t}`]:t,[`${Y}-${o}`]:o},e.className),children:e.children})};A.states=it;A.options=lt;A.className=Y;A.defaultOptions=ie;A.moduleName=re;A.folderName=Ce;import{jsx as pt}from"react/jsx-runtime";var dt="k-actionsheet-footer",_e={alignment:"stretched",orientation:"horizontal"},le=e=>{let{alignment:t=_e.alignment,orientation:o=_e.orientation,template:s,as:l=s?"div":A,...d}=e;return pt(l,{...d,...!s&&{alignment:t,orientation:o},className:a(e.className,dt),children:e.children})};var U="input",Z=U;import{jsx as ft}from"react/jsx-runtime";var j="k-input",mt=[n.hover,n.focus,n.valid,n.invalid,n.required,n.disabled,n.loading,n.readonly],ut={size:[r.small,r.medium,r.large],rounded:[p.small,p.medium,p.large,p.full],fillMode:[m.solid,m.flat,m.outline]},ee={size:r.medium,rounded:r.medium,fillMode:m.solid},v=e=>{let{hover:t,focus:o,disabled:s,invalid:l,valid:d,loading:c,readonly:f,size:u=ee.size,rounded:h=ee.rounded,fillMode:N=ee.fillMode,...S}=e;return ft("span",{...S,className:a(e.className,j,b(j,{size:u,rounded:h,fillMode:N}),w(j,{hover:t,focus:o,disabled:s,invalid:l,valid:d,loading:c,readonly:f}))})};v.states=mt;v.options=ut;v.className=j;v.defaultOptions=ee;v.moduleName=U;v.folderName=Z;import{jsx as Nt}from"react/jsx-runtime";var te="k-picker",xt=[n.hover,n.focus,n.valid,n.invalid,n.required,n.disabled,n.loading,n.readonly],ht={size:[r.small,r.medium,r.large],rounded:[p.small,p.medium,p.large,p.full],fillMode:[m.solid,m.flat,m.outline]},oe={size:r.medium,rounded:p.medium,fillMode:m.solid},V=e=>{let{hover:t,focus:o,disabled:s,invalid:l,valid:d,loading:c,readonly:f,size:u=oe.size,rounded:h=oe.rounded,fillMode:N=oe.fillMode,...S}=e;return Nt("span",{...S,className:a(e.className,te,b(te,{size:u,rounded:h,fillMode:N}),w(te,{hover:t,focus:o,disabled:s,invalid:l,valid:d,loading:c,readonly:f})),children:e.children})};V.states=xt;V.options=ht;V.className=te;V.defaultOptions=oe;V.moduleName=U;V.folderName=Z;import{Fragment as It,jsx as ze}from"react/jsx-runtime";var ce="k-font-icon",bt=[],vt={size:[r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info,i.light,i.dark]},St={},D=e=>{let{size:t,themeColor:o,icon:s,rotate:l,flip:d,...c}=e;return s?ze("span",{...c,className:a(e.className,ce,b(ce,{size:t}),{[`k-i-${s}`]:s,[`k-color-${o}`]:o,[`k-rotate-${l}`]:l,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"})}):ze(It,{})};D.states=bt;D.options=vt;D.className=ce;D.defaultOptions=St;var He=D;import{Fragment as Tt,jsx as ne}from"react/jsx-runtime";var de="k-svg-icon",Mt=[],gt={size:[r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info,i.light,i.dark]},Re={viewBox:"0 0 24 24"},$=e=>{let{size:t,themeColor:o,rotate:s,flip:l,viewBox:d=Re.viewBox,icon:c,...f}=e;if(!c)return ne(Tt,{});c==="none"&&{...f,className:a(e.className,de,"k-none")};let u=typeof c=="object"&&c.name&&c.name;return ne("span",{...f,className:a(e.className,de,b("k-icon",{size:t}),{[`k-svg-i-${u}`]:u,[`k-color-${o}`]:o,[`k-rotate-${s}`]:s,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"}),children:ne("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof c=="object"?c.viewBox:d,dangerouslySetInnerHTML:typeof c=="object"?{__html:c.content}:void 0,children:c?void 0:e.children})})};$.states=Mt;$.options=gt;$.className=de;$.defaultOptions=Re;var pe=$;import*as me from"@progress/kendo-svg-icons";var Be="icon",Pe="icons";import{Fragment as Ke,jsx as X}from"react/jsx-runtime";var ae="k-icon",yt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),At=[],Ot={size:[r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info,i.light,i.dark]},ue={viewBox:"0 0 24 24",type:"svg"},x=e=>{let{size:t,themeColor:o,icon:s,type:l=ue.type,rotate:d,flip:c,viewBox:f=ue.viewBox,...u}=e;if(!s)return X(Ke,{});if(l==="svg"){if(s==="none")return X(pe,{...u,className:a(e.className,ae),icon:s,size:t});let h=me[s]?s:yt(`${s}-icon`);return me[h]?X(pe,{...u,className:a(e.className,ae),icon:me[h],size:t,themeColor:o,rotate:d,flip:c,viewBox:f}):X(Ke,{})}return X(He,{...u,className:a(e.className,ae),icon:s,size:t,themeColor:o,rotate:d,flip:c})};x.states=At;x.options=Ot;x.defaultOptions=ue;x.className=ae;x.moduleName=Be;x.folderName=Pe;import{Fragment as Lt,jsx as fe}from"react/jsx-runtime";var we="k-clear-value",Et=[n.disabled,n.loading,n.readonly],kt={},z=e=>{let{disabled:t,loading:o,readonly:s,value:l}=e;return t||s||o||!l?fe(Lt,{}):fe("span",{className:a(e.className,we),children:fe(x,{icon:"x"})})};z.states=Et;z.options=kt;z.className=we;import{jsx as zt}from"react/jsx-runtime";var xe="k-input-inner",Ct=[],_t={},se={type:"text",autocomplete:"off",value:"",placeholder:""},H=e=>{let{value:t=se.value,type:o=se.type,placeholder:s=se.placeholder,autocomplete:l=se.autocomplete,...d}=e;return zt("input",{...d,type:o,className:a(e.className,xe,b(xe,e)),placeholder:s,autoComplete:l,defaultValue:t})};H.states=Ct;H.options=_t;H.className=xe;import{jsx as Ve,jsxs as Bt}from"react/jsx-runtime";var he="k-input-inner",Ht=[],Rt={},Ne=e=>{let{value:t,placeholder:o,showValue:s,valueIcon:l,valueIconName:d,...c}=e;return Bt("span",{...c,className:a(e.className,he,b(he,e)),children:[l,!l&&d&&Ve(x,{className:"k-input-value-icon",icon:d}),s&&!t&&o,s&&t&&Ve("span",{className:"k-input-value-text",children:t})]})};Ne.states=Ht;Ne.options=Rt;Ne.className=he;import{jsx as wt}from"react/jsx-runtime";var be="k-input-inner",Pt=[],Kt={},Fe={value:"",placeholder:""},ve=e=>{let{value:t=Fe.value,placeholder:o=Fe.placeholder,rows:s,...l}=e;return wt("textarea",{...l,className:a(e.className,be,b(be,e)),placeholder:o,rows:s,defaultValue:t})};ve.states=Pt;ve.options=Kt;ve.className=be;import{Fragment as Ft,jsx as Ue}from"react/jsx-runtime";var De="k-input-loading-icon",Vt=[n.disabled,n.loading],F=e=>{let{disabled:t,loading:o}=e;return t||!o?Ue(Ft,{}):Ue("span",{className:a(e.className,De,"k-icon k-i-loading")})};F.states=Vt;F.className=De;import{Fragment as $t,jsx as $e}from"react/jsx-runtime";var Xe="k-input-validation-icon",Ut=[n.valid,n.invalid,n.disabled,n.loading],Dt={},R=e=>{let{valid:t,invalid:o,disabled:s,loading:l}=e,d=o?"warning-circle":"check-circle";return s||l||!!!(t||o)?$e($t,{}):$e(x,{className:a(Xe),icon:d})};R.states=Ut;R.options=Dt;R.className=Xe;import{Fragment as Jt,jsx as qe}from"react/jsx-runtime";var Xt="k-input-prefix",qt={direction:"horizontal"},Je=e=>{let{direction:t=qt.direction,...o}=e;return e.children?qe("span",{...o,className:a(Xt,e.className,{[`k-input-prefix-${t}`]:t}),children:e.children}):qe(Jt,{})};import{Fragment as Qt,jsx as Ge}from"react/jsx-runtime";var Gt="k-input-suffix",Wt={direction:"horizontal"},We=e=>{let{direction:t=Wt.direction,...o}=e;return e.children?Ge("span",{...o,className:a(Gt,e.className,{[`k-input-suffix-${t}`]:t}),children:e.children}):Ge(Qt,{})};import{jsx as Rn}from"react/jsx-runtime";import{jsx as wn}from"react/jsx-runtime";import{jsx as Zt}from"react/jsx-runtime";var Qe="k-input-separator",Yt={direction:"vertical"},Se=e=>{let{direction:t=Yt.direction,...o}=e;return Zt("span",{...o,className:a(Qe,e.className,{[`${Qe}-${t}`]:t})})};var Ie="searchbox",Ye=Ie;import{jsx as q,jsxs as to}from"react/jsx-runtime";var Ze="k-searchbox",jt=[n.hover,n.focus,n.valid,n.invalid,n.required,n.disabled,n.loading],eo={size:[r.small,r.medium,r.large],rounded:[p.small,p.medium,p.large,p.full],fillMode:[m.solid,m.flat,m.outline]},Me={showIcon:!0,icon:"search",size:v.defaultOptions.size,rounded:v.defaultOptions.rounded,fillMode:v.defaultOptions.fillMode},O=e=>{let{value:t,placeholder:o,size:s,rounded:l,fillMode:d,hover:c,focus:f,valid:u,invalid:h,required:N,loading:S,disabled:C,showIcon:y=Me.showIcon,icon:M=Me.icon,...g}=e;return to(v,{...g,size:s,rounded:l,fillMode:d,hover:c,focus:f,valid:u,invalid:h,required:N,loading:S,disabled:C,className:a(e.className,Ze),children:[y&&q(x,{className:"k-input-icon",icon:M}),q(H,{placeholder:o,value:t}),q(F,{...e}),q(R,{...e}),q(z,{...e})]})};O.states=jt;O.options=eo;O.className=Ze;O.defaultOptions=Me;O.moduleName=Ie;O.folderName=Ye;import{jsx as fa}from"react/jsx-runtime";var ge="textbox",je=ge;import{Fragment as et,jsx as E,jsxs as Te}from"react/jsx-runtime";var tt="k-textbox",oo=[n.hover,n.focus,n.valid,n.invalid,n.required,n.disabled,n.loading,n.readonly],no={size:[r.small,r.medium,r.large],rounded:[p.small,p.medium,p.large,p.full],fillMode:[m.solid,m.flat,m.outline]},B={showClearButton:!0,showValidationIcon:!0,size:v.defaultOptions.size,rounded:v.defaultOptions.rounded,fillMode:v.defaultOptions.fillMode,separators:!0},k=e=>{let{size:t=B.size,rounded:o=B.rounded,fillMode:s=B.fillMode,separators:l=B.separators,showClearButton:d=B.showClearButton,showValidationIcon:c=B.showValidationIcon,prefix:f,suffix:u,type:h,value:N,placeholder:S,hover:C,focus:y,valid:M,invalid:g,required:_,loading:I,disabled:K,readonly:ke,...rt}=e;return Te(v,{...rt,size:t,rounded:o,fillMode:s,hover:C,focus:y,valid:M,invalid:g,required:_,loading:I,disabled:K,readonly:ke,className:a(e.className,tt),children:[f&&Te(et,{children:[E(Je,{children:f}),l&&E(Se,{})]}),E(H,{placeholder:S,value:N,type:h}),c&&E(R,{valid:M,invalid:g,loading:I,disabled:K}),E(F,{loading:I,disabled:K}),d&&E(z,{loading:I,disabled:K,readonly:ke,value:N}),u&&Te(et,{children:[l&&E(Se,{}),E(We,{children:u})]})]})};k.states=oo;k.options=no;k.className=tt;k.defaultOptions=B;k.moduleName=ge;k.folderName=je;import{jsx as Oa}from"react/jsx-runtime";import{Fragment as za,jsx as _a}from"react/jsx-runtime";var ye="button",nt=ye;import{Fragment as io,jsx as J,jsxs as at}from"react/jsx-runtime";var G="k-button",ao=["icon-button"],so=[n.hover,n.focus,n.active,n.selected,n.disabled,n.generating],ro={size:[r.small,r.medium,r.large],rounded:[p.small,p.medium,p.large,p.full],fillMode:[m.solid,m.flat,m.outline,m.clear,m.link],themeColor:[i.base,i.primary,i.secondary,i.tertiary,i.success,i.warning,i.error,i.info,i.light,i.dark,i.inverse]},P={size:r.medium,rounded:p.medium,fillMode:m.solid,themeColor:i.base,showArrow:!1,arrowIconName:"caret-alt-down"},T=e=>{let{size:t=P.size,rounded:o=P.rounded,fillMode:s=P.fillMode,themeColor:l=P.themeColor,showArrow:d=P.showArrow,arrowIconName:c=P.arrowIconName,variant:f,hover:u,focus:h,active:N,selected:S,disabled:C,icon:y,text:M,iconClassName:g,..._}=e,I=y!==void 0,K=e.children!==void 0;return at("button",{..._,className:a(e.className,G,Le(G,f),b(G,{size:t,rounded:o,fillMode:s,themeColor:l}),w(G,{hover:u,focus:h,active:N,disabled:C,selected:S}),{"k-icon-button":!M&&!K&&I}),children:[y&&J(x,{className:a(g,"k-button-icon"),icon:y}),M?at(io,{children:[M&&J("span",{className:"k-button-text",children:M}),e.children]}):e.children&&J("span",{className:"k-button-text",children:e.children}),d&&J("span",{className:"k-menu-button-arrow k-button-arrow",children:J(x,{icon:c})})]})};T.states=so;T.options=ro;T.variants=ao;T.className=G;T.defaultOptions=P;T.moduleName=ye;T.folderName=nt;import{jsx as Da}from"react/jsx-runtime";import{jsx as Ja}from"react/jsx-runtime";import{jsx as Ya}from"react/jsx-runtime";import{Fragment as cs,jsx as ls}from"react/jsx-runtime";import{jsx as L,jsxs as Ae}from"react/jsx-runtime";var st="k-actionsheet-titlebar",lo={},W=e=>{let{title:t,subtitle:o,actionsStart:s,actionsEnd:l,filter:d,input:c,inputValue:f,inputPlaceholder:u,adaptive:h,children:N,...S}=e;return Ae("div",{...S,className:a(e.className,st),children:[Ae("div",{className:"k-actionsheet-titlebar-group",children:[s&&L("div",{className:"k-actionsheet-actions",children:s}),!N&&Ae("div",{className:"k-actionsheet-title",children:[t&&L("div",{className:"k-text-center",children:t}),o&&L("div",{className:"k-actionsheet-subtitle k-text-center",children:o})]}),N&&L("div",{className:"k-actionsheet-title",children:N}),l&&L("div",{className:"k-actionsheet-actions",children:l})]}),(c||d)&&L("div",{className:"k-actionsheet-titlebar-group k-actionsheet-filter",children:c?L(k,{value:f,placeholder:u,size:h?"large":"medium"}):L(O,{placeholder:"Filter",size:h?"large":"medium"})})]})};W.className=st;W.defaultOptions=lo;import{jsx as Oe,jsxs as uo}from"react/jsx-runtime";var Ee="k-actionsheet-view",co=[],po={},mo={},Q=e=>{let{adaptive:t,animated:o,children:s,header:l,footer:d,...c}=e,f=l?.type===W&&Oe(W,{adaptive:t,...l?.props}),u=d?.type===le&&Oe(le,{...d?.props});return uo("div",{...c,className:a(e.className,Ee,{[`${Ee}-animated`]:o}),children:[f,Oe("div",{className:"k-actionsheet-content",children:s}),u]})};Q.states=co;Q.options=po;Q.className=Ee;Q.defaultOptions=mo;var Ts=Q;export{Ee as ACTIONSHEETVIEW_CLASSNAME,Q as ActionSheetView,Ts as default};