@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 12.1 kB
JavaScript
var r=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?r(...t):typeof t=="object"?Object.keys(t).map((n,a)=>t[a]||t[n]&&n||null).filter(n=>n!==null).join(" "):t).filter(t=>!!t).join(" ");var x=(e,t)=>r({[`${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:n,invalid:a,hover:d,focus:c,checked:i,active:p,selected:u,disabled:b,indeterminate:S,loading:I,empty:ee,readonly:w,highlighted:_,...z}=t;return r({"k-valid":n,"k-invalid":a,"k-hover":d,"k-focus":c,"k-checked":i,"k-active":p,"k-selected":u,"k-disabled":b,"k-indeterminate":S&&!i,"k-loading":I,"k-empty":ee,"k-readonly":w,"k-highlighted":_},Object.keys(z).reduce((P,L)=>(L.startsWith("k-")?P[L]=z[L]:P[`k-${L}`]=z[L],P),{}))};function fe(e,t){if(!t)return{};let n=Array.isArray(t)?t:[t];return Object.fromEntries(n.map(a=>[`k-${a}`,!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"},N={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"},l={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"},Ce={calloutMap:{top:"n",bottom:"s",left:"w",right:"e"},orientationMap:{vertical:"vstack",horizontal:"hstack"}};import{jsx as Ie}from"react/jsx-runtime";var He="k-card-callout",Ne=e=>{let{callout:t,...n}=e;return Ie("span",{...n,className:r(e.className,He,{[`k-callout-${Ce.calloutMap[t]||t}`]:t})})};var f="card",A=f;import{Fragment as $e,jsx as Ae,jsxs as Ue}from"react/jsx-runtime";var J="k-card",we=[l.hover,l.focus,l.selected,l.disabled],ze={themeColor:[o.primary,o.success,o.warning,o.error,o.info]},Pe={},M=e=>{let{orientation:t,themeColor:n,callout:a,hover:d,focus:c,selected:i,disabled:p,...u}=e;return Ue("div",{...u,className:r(e.className,J,x(J,{themeColor:n}),h(J,{hover:d,focus:c,disabled:p,selected:i}),{[`k-card-${t}`]:t,"k-card-with-callout":a}),children:[a&&a!=="true"&&Ae(Ne,{callout:a}),Ae($e,{children:e.children})]})};M.states=we;M.options=ze;M.className=J;M.defaultOptions=Pe;M.moduleName=f;M.folderName=A;import{Fragment as We,jsx as xe}from"react/jsx-runtime";var te="k-card-list",Fe=[],Ge={},Ve={},K=e=>{let{...t}=e;return xe("div",{...t,className:r(e.className,te,h(te,{})),children:xe(We,{children:e.children})})};K.states=Fe;K.options=Ge;K.className=te;K.defaultOptions=Ve;K.moduleName=f;K.folderName=A;import{jsx as Ye}from"react/jsx-runtime";var he="k-card-group",qe=[],Xe={},Je={},D=e=>{let{...t}=e;return Ye("div",{...t,className:r(e.className,he),children:e.children})};D.states=qe;D.options=Xe;D.className=he;D.defaultOptions=Je;D.moduleName=f;D.folderName=A;import{jsx as et}from"react/jsx-runtime";var oe="k-card-wrap",Qe=[l.focus,l.selected],Ze={},je={},R=e=>{let{focus:t,selected:n,...a}=e;return et("div",{...a,className:r(e.className,oe,h(oe,{focus:t,selected:n})),children:e.children})};R.states=Qe;R.options=Ze;R.className=oe;R.defaultOptions=je;R.moduleName=f;R.folderName=A;import{jsx as ot}from"react/jsx-runtime";var re="k-card-title",tt=[l.hover,l.focus],E=e=>{let{hover:t,focus:n,...a}=e;return ot("div",{...a,className:r(e.className,re,h(re,{hover:t,focus:n})),children:e.children})};E.states=tt;E.className=re;import{jsx as at}from"react/jsx-runtime";var rt="k-card-subtitle",$=e=>{let{...t}=e;return at("div",{...t,className:r(e.className,rt),children:e.children})};import{Fragment as vo,jsx as Mo}from"react/jsx-runtime";import{Fragment as lt,jsx as Me}from"react/jsx-runtime";var ae="k-font-icon",nt=[],st={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},it={},U=e=>{let{size:t,themeColor:n,icon:a,rotate:d,flip:c,...i}=e;return a?Me("span",{...i,className:r(e.className,ae,x(ae,{size:t}),{[`k-i-${a}`]:a,[`k-color-${n}`]:n,[`k-rotate-${d}`]:d,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"})}):Me(lt,{})};U.states=nt;U.options=st;U.className=ae;U.defaultOptions=it;var ve=U;import{Fragment as mt,jsx as Y}from"react/jsx-runtime";var ne="k-svg-icon",dt=[],ct={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},be={viewBox:"0 0 24 24"},F=e=>{let{size:t,themeColor:n,rotate:a,flip:d,viewBox:c=be.viewBox,icon:i,...p}=e;if(!i)return Y(mt,{});i==="none"&&{...p,className:r(e.className,ne,"k-none")};let u=typeof i=="object"&&i.name&&i.name;return Y("span",{...p,className:r(e.className,ne,x("k-icon",{size:t}),{[`k-svg-i-${u}`]:u,[`k-color-${n}`]:n,[`k-rotate-${a}`]:a,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"}),children:Y("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof i=="object"?i.viewBox:c,dangerouslySetInnerHTML:typeof i=="object"?{__html:i.content}:void 0,children:i?void 0:e.children})})};F.states=dt;F.options=ct;F.className=ne;F.defaultOptions=be;var se=F;import*as ie from"@progress/kendo-svg-icons";var Te="icon",ye="icons";import{Fragment as ge,jsx as G}from"react/jsx-runtime";var Q="k-icon",pt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),ut=[],ft={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.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"},T=e=>{let{size:t,themeColor:n,icon:a,type:d=le.type,rotate:c,flip:i,viewBox:p=le.viewBox,...u}=e;if(!a)return G(ge,{});if(d==="svg"){if(a==="none")return G(se,{...u,className:r(e.className,Q),icon:a,size:t});let b=ie[a]?a:pt(`${a}-icon`);return ie[b]?G(se,{...u,className:r(e.className,Q),icon:ie[b],size:t,themeColor:n,rotate:c,flip:i,viewBox:p}):G(ge,{})}return G(ve,{...u,className:r(e.className,Q),icon:a,size:t,themeColor:n,rotate:c,flip:i})};T.states=ut;T.options=ft;T.defaultOptions=le;T.className=Q;T.moduleName=Te;T.folderName=ye;var de="button",Le=de;import{Fragment as xt,jsx as V,jsxs as Ee}from"react/jsx-runtime";var W="k-button",Ct=["icon-button"],Nt=[l.hover,l.focus,l.active,l.selected,l.disabled,l.generating],At={size:[s.small,s.medium,s.large],rounded:[C.small,C.medium,C.large,C.full],fillMode:[N.solid,N.flat,N.outline,N.clear,N.link],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark,o.inverse]},O={size:s.medium,rounded:C.medium,fillMode:N.solid,themeColor:o.base,showArrow:!1,arrowIconName:"caret-alt-down"},m=e=>{let{size:t=O.size,rounded:n=O.rounded,fillMode:a=O.fillMode,themeColor:d=O.themeColor,showArrow:c=O.showArrow,arrowIconName:i=O.arrowIconName,variant:p,hover:u,focus:b,active:S,selected:I,disabled:ee,icon:w,text:_,iconClassName:z,...P}=e,L=w!==void 0,Be=e.children!==void 0;return Ee("button",{...P,className:r(e.className,W,fe(W,p),x(W,{size:t,rounded:n,fillMode:a,themeColor:d}),h(W,{hover:u,focus:b,active:S,disabled:ee,selected:I}),{"k-icon-button":!_&&!Be&&L}),children:[w&&V(T,{className:r(z,"k-button-icon"),icon:w}),_?Ee(xt,{children:[_&&V("span",{className:"k-button-text",children:_}),e.children]}):e.children&&V("span",{className:"k-button-text",children:e.children}),c&&V("span",{className:"k-menu-button-arrow k-button-arrow",children:V(T,{icon:i})})]})};m.states=Nt;m.options=At;m.variants=Ct;m.className=W;m.defaultOptions=O;m.moduleName=de;m.folderName=Le;import{jsx as Xo}from"react/jsx-runtime";import{jsx as Zo}from"react/jsx-runtime";import{jsx as or}from"react/jsx-runtime";import{Fragment as Cr,jsx as fr,jsxs as Nr}from"react/jsx-runtime";import{jsx as Mr}from"react/jsx-runtime";import{Fragment as Mt,jsx as q,jsxs as vt}from"react/jsx-runtime";var ht="k-card-body",Z=e=>{let{title:t,subtitle:n,details:a,...d}=e;return vt("div",{...d,className:r(e.className,ht),children:[t&&q(E,{children:t}),n&&q($,{children:n}),q(Mt,{children:e.children}),a&&q("span",{className:"k-card-header-actions",children:q(m,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as gt}from"react/jsx-runtime";var Oe="k-card-deck",bt=[],Tt={},yt={},B=e=>{let{...t}=e;return gt("div",{...t,className:r(e.className,Oe),children:e.children})};B.states=bt;B.options=Tt;B.className=Oe;B.defaultOptions=yt;B.moduleName=f;B.folderName=A;import{jsx as kt}from"react/jsx-runtime";var ke="k-card-deck-scrollwrap",Lt=[],Et={},Ot={},H=e=>{let{...t}=e;return kt("div",{...t,className:r(e.className,ke),children:e.children})};H.states=Lt;H.options=Et;H.className=ke;H.defaultOptions=Ot;H.moduleName=f;H.folderName=A;var ce="action-buttons",Se=ce;import{jsx as Kt}from"react/jsx-runtime";var j="k-actions",St=[],_t={},me={alignment:"start",orientation:"horizontal"},y=e=>{let{alignment:t=me.alignment,orientation:n=me.orientation,...a}=e;return Kt("div",{...a,className:r(j,{[`${j}-${t}`]:t,[`${j}-${n}`]:n},e.className),children:e.children})};y.states=St;y.options=_t;y.className=j;y.defaultOptions=me;y.moduleName=ce;y.folderName=Se;import{Fragment as Yr,jsx as Xr,jsxs as Jr}from"react/jsx-runtime";import{Fragment as aa,jsx as oa,jsxs as ra}from"react/jsx-runtime";var pe="avatar",_e=pe;import{jsx as Ke}from"react/jsx-runtime";var X="k-avatar";var Dt=[l.hover,l.focus,l.active,l.selected,l.disabled],Rt={size:[s.small,s.medium,s.large],rounded:[C.small,C.medium,C.large,C.full],fillMode:[N.solid,N.flat,N.outline],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark,o.inverse]},k={type:"text",size:s.medium,rounded:C.full,fillMode:N.solid,themeColor:o.primary,border:!1},g=e=>{let{size:t=k.size,rounded:n=k.rounded,fillMode:a=k.fillMode,themeColor:d=k.themeColor,type:c=k.type,border:i=k.border,...p}=e;return Ke("div",{...p,className:r(e.className,X,x(X,{size:t,rounded:n,fillMode:a,themeColor:d}),{[`${X}-bordered`]:i}),children:Ke("span",{className:`${X}-${c}`,children:e.children})})};g.states=Dt;g.options=Rt;g.className=X;g.defaultOptions=k;g.moduleName=pe;g.folderName=_e;import{jsx as ka}from"react/jsx-runtime";import{jsx as Da}from"react/jsx-runtime";import{jsx as Ia}from"react/jsx-runtime";import{jsx as v,jsxs as ue}from"react/jsx-runtime";var Bt="k-orgchart-node",Re={buttonIcon:"plus",details:!0},Xa=e=>{let{title:t,subtitle:n,details:a=Re.details,color:d,lineBottom:c,lineTop:i,button:p,buttonIcon:u=Re.buttonIcon,avatar:b,avatarType:S,...I}=e;return ue("div",{...I,className:r(e.className,Bt,"k-vstack","k-align-items-center"),children:[i&&v("div",{className:"k-orgchart-line k-orgchart-line-v"}),v(M,{className:"k-orgchart-card",children:ue(Z,{className:"k-hstack",details:a,style:{borderTopColor:d},children:[v(g,{type:S,themeColor:"secondary",children:S==="image"?v("img",{src:b}):b}),ue("div",{className:"k-card-title-wrap k-vstack",children:[v(E,{className:"k-text-ellipsis",children:t}),v("span",{className:"k-spacer"}),v($,{className:"k-text-ellipsis",children:n})]}),v("span",{className:"k-spacer"})]})}),c&&v("div",{className:"k-orgchart-line k-orgchart-line-v"}),p&&v(m,{className:"k-orgchart-button",icon:u})]})};export{Bt as ORGCHARTNODE_CLASSNAME,Xa as OrgchartNode};