@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 16.2 kB
JavaScript
var o=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?o(...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 b=(e,t)=>o({[`${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=(e,t)=>{let{valid:n,invalid:a,hover:s,focus:u,checked:l,active:T,selected:f,disabled:y,indeterminate:Ce,loading:Me,empty:Le,readonly:X,highlighted:H,...q}=t;return o({"k-valid":n,"k-invalid":a,"k-hover":s,"k-focus":u,"k-checked":l,"k-active":T,"k-selected":f,"k-disabled":y,"k-indeterminate":Ce&&!l,"k-loading":Me,"k-empty":Le,"k-readonly":X,"k-highlighted":H},Object.keys(q).reduce((Y,I)=>(I.startsWith("k-")?Y[I]=q[I]:Y[`k-${I}`]=q[I],Y),{}))};function Be(e,t){if(!t)return{};let n=Array.isArray(t)?t:[t];return Object.fromEntries(n.map(a=>[`k-${a}`,!0]))}var i={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},B={small:"small",medium:"medium",large:"large",full:"full"},S={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},r={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},m={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"},we={calloutMap:{top:"n",bottom:"s",left:"w",right:"e"},orientationMap:{vertical:"vstack",horizontal:"hstack"}};import{jsx as Mt}from"react/jsx-runtime";var Ct="k-card-callout",me=e=>{let{callout:t,...n}=e;return Mt("span",{...n,className:o(e.className,Ct,{[`k-callout-${we.calloutMap[t]||t}`]:t})})};var N="card",C=N;import{Fragment as ht,jsx as Pe,jsxs as vt}from"react/jsx-runtime";var ce="k-card",Lt=[m.hover,m.focus,m.selected,m.disabled],At={themeColor:[r.primary,r.success,r.warning,r.error,r.info]},xt={},L=e=>{let{orientation:t,themeColor:n,callout:a,hover:s,focus:u,selected:l,disabled:T,...f}=e;return vt("div",{...f,className:o(e.className,ce,b(ce,{themeColor:n}),E(ce,{hover:s,focus:u,disabled:T,selected:l}),{[`k-card-${t}`]:t,"k-card-with-callout":a}),children:[a&&a!=="true"&&Pe(me,{callout:a}),Pe(ht,{children:e.children})]})};L.states=Lt;L.options=At;L.className=ce;L.defaultOptions=xt;L.moduleName=N;L.folderName=C;import{Fragment as It,jsx as Fe}from"react/jsx-runtime";var Ae="k-card-list",bt=[],kt={},Ot={},w=e=>{let{...t}=e;return Fe("div",{...t,className:o(e.className,Ae,E(Ae,{})),children:Fe(It,{children:e.children})})};w.states=bt;w.options=kt;w.className=Ae;w.defaultOptions=Ot;w.moduleName=N;w.folderName=C;import{jsx as Kt}from"react/jsx-runtime";var ze="k-card-group",St=[],_t={},gt={},P=e=>{let{...t}=e;return Kt("div",{...t,className:o(e.className,ze),children:e.children})};P.states=St;P.options=_t;P.className=ze;P.defaultOptions=gt;P.moduleName=N;P.folderName=C;import{jsx as Ht}from"react/jsx-runtime";var xe="k-card-wrap",Dt=[m.focus,m.selected],Rt={},yt={},F=e=>{let{focus:t,selected:n,...a}=e;return Ht("div",{...a,className:o(e.className,xe,E(xe,{focus:t,selected:n})),children:e.children})};F.states=Dt;F.options=Rt;F.className=xe;F.defaultOptions=yt;F.moduleName=N;F.folderName=C;import{jsx as wt}from"react/jsx-runtime";var he="k-card-title",Bt=[m.hover,m.focus],z=e=>{let{hover:t,focus:n,...a}=e;return wt("div",{...a,className:o(e.className,he,E(he,{hover:t,focus:n})),children:e.children})};z.states=Bt;z.className=he;import{jsx as Ft}from"react/jsx-runtime";var Pt="k-card-subtitle",k=e=>{let{...t}=e;return Ft("div",{...t,className:o(e.className,Pt),children:e.children})};import{Fragment as Kn,jsx as gn}from"react/jsx-runtime";import{Fragment as $t,jsx as Ue}from"react/jsx-runtime";var ve="k-font-icon",zt=[],Ut={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[r.base,r.primary,r.secondary,r.tertiary,r.success,r.warning,r.error,r.info,r.light,r.dark]},Wt={},Z=e=>{let{size:t,themeColor:n,icon:a,rotate:s,flip:u,...l}=e;return a?Ue("span",{...l,className:o(e.className,ve,b(ve,{size:t}),{[`k-i-${a}`]:a,[`k-color-${n}`]:n,[`k-rotate-${s}`]:s,"k-flip-h":u==="h"||u==="both","k-flip-v":u==="v"||u==="both"})}):Ue($t,{})};Z.states=zt;Z.options=Ut;Z.className=ve;Z.defaultOptions=Wt;var We=Z;import{Fragment as Jt,jsx as de}from"react/jsx-runtime";var be="k-svg-icon",Vt=[],Gt={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[r.base,r.primary,r.secondary,r.tertiary,r.success,r.warning,r.error,r.info,r.light,r.dark]},$e={viewBox:"0 0 24 24"},Q=e=>{let{size:t,themeColor:n,rotate:a,flip:s,viewBox:u=$e.viewBox,icon:l,...T}=e;if(!l)return de(Jt,{});l==="none"&&{...T,className:o(e.className,be,"k-none")};let f=typeof l=="object"&&l.name&&l.name;return de("span",{...T,className:o(e.className,be,b("k-icon",{size:t}),{[`k-svg-i-${f}`]:f,[`k-color-${n}`]:n,[`k-rotate-${a}`]:a,"k-flip-h":s==="h"||s==="both","k-flip-v":s==="v"||s==="both"}),children:de("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof l=="object"?l.viewBox:u,dangerouslySetInnerHTML:typeof l=="object"?{__html:l.content}:void 0,children:l?void 0:e.children})})};Q.states=Vt;Q.options=Gt;Q.className=be;Q.defaultOptions=$e;var ke=Q;import*as Oe from"@progress/kendo-svg-icons";var Ve="icon",Ge="icons";import{Fragment as Je,jsx as j}from"react/jsx-runtime";var pe="k-icon",Xt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),qt=[],Yt={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[r.base,r.primary,r.secondary,r.tertiary,r.success,r.warning,r.error,r.info,r.light,r.dark]},Ie={viewBox:"0 0 24 24",type:"svg"},M=e=>{let{size:t,themeColor:n,icon:a,type:s=Ie.type,rotate:u,flip:l,viewBox:T=Ie.viewBox,...f}=e;if(!a)return j(Je,{});if(s==="svg"){if(a==="none")return j(ke,{...f,className:o(e.className,pe),icon:a,size:t});let y=Oe[a]?a:Xt(`${a}-icon`);return Oe[y]?j(ke,{...f,className:o(e.className,pe),icon:Oe[y],size:t,themeColor:n,rotate:u,flip:l,viewBox:T}):j(Je,{})}return j(We,{...f,className:o(e.className,pe),icon:a,size:t,themeColor:n,rotate:u,flip:l})};M.states=qt;M.options=Yt;M.defaultOptions=Ie;M.className=pe;M.moduleName=Ve;M.folderName=Ge;var Se="button",Xe=Se;import{Fragment as eo,jsx as ee,jsxs as qe}from"react/jsx-runtime";var te="k-button",Zt=["icon-button"],Qt=[m.hover,m.focus,m.active,m.selected,m.disabled,m.generating],jt={size:[i.small,i.medium,i.large],rounded:[B.small,B.medium,B.large,B.full],fillMode:[S.solid,S.flat,S.outline,S.clear,S.link],themeColor:[r.base,r.primary,r.secondary,r.tertiary,r.success,r.warning,r.error,r.info,r.light,r.dark,r.inverse]},_={size:i.medium,rounded:B.medium,fillMode:S.solid,themeColor:r.base,showArrow:!1,arrowIconName:"caret-alt-down"},p=e=>{let{size:t=_.size,rounded:n=_.rounded,fillMode:a=_.fillMode,themeColor:s=_.themeColor,showArrow:u=_.showArrow,arrowIconName:l=_.arrowIconName,variant:T,hover:f,focus:y,active:Ce,selected:Me,disabled:Le,icon:X,text:H,iconClassName:q,...Y}=e,I=X!==void 0,Et=e.children!==void 0;return qe("button",{...Y,className:o(e.className,te,Be(te,T),b(te,{size:t,rounded:n,fillMode:a,themeColor:s}),E(te,{hover:f,focus:y,active:Ce,disabled:Le,selected:Me}),{"k-icon-button":!H&&!Et&&I}),children:[X&&ee(M,{className:o(q,"k-button-icon"),icon:X}),H?qe(eo,{children:[H&&ee("span",{className:"k-button-text",children:H}),e.children]}):e.children&&ee("span",{className:"k-button-text",children:e.children}),u&&ee("span",{className:"k-menu-button-arrow k-button-arrow",children:ee(M,{icon:l})})]})};p.states=Qt;p.options=jt;p.variants=Zt;p.className=te;p.defaultOptions=_;p.moduleName=Se;p.folderName=Xe;import{jsx as ar}from"react/jsx-runtime";import{jsx as mr}from"react/jsx-runtime";import{jsx as ur}from"react/jsx-runtime";import{Fragment as oo,jsx as oe,jsxs as no}from"react/jsx-runtime";var to="k-card-header",ne=e=>{let{title:t,subtitle:n,details:a,...s}=e;return no("div",{...s,className:o(e.className,to),children:[t&&oe(z,{children:t}),n&&oe(k,{children:n}),oe(oo,{children:e.children}),a&&oe("span",{className:"k-card-header-actions",children:oe(p,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as Ir}from"react/jsx-runtime";import{Fragment as ao,jsx as re,jsxs as io}from"react/jsx-runtime";var ro="k-card-body",U=e=>{let{title:t,subtitle:n,details:a,...s}=e;return io("div",{...s,className:o(e.className,ro),children:[t&&re(z,{children:t}),n&&re(k,{children:n}),re(ao,{children:e.children}),a&&re("span",{className:"k-card-header-actions",children:re(p,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as co}from"react/jsx-runtime";var Ye="k-card-deck",so=[],lo={},mo={},W=e=>{let{...t}=e;return co("div",{...t,className:o(e.className,Ye),children:e.children})};W.states=so;W.options=lo;W.className=Ye;W.defaultOptions=mo;W.moduleName=N;W.folderName=C;import{jsx as No}from"react/jsx-runtime";var Ze="k-card-deck-scrollwrap",po=[],uo={},fo={},$=e=>{let{...t}=e;return No("div",{...t,className:o(e.className,Ze),children:e.children})};$.states=po;$.options=uo;$.className=Ze;$.defaultOptions=fo;$.moduleName=N;$.folderName=C;var _e="action-buttons",Qe=_e;import{jsx as Co}from"react/jsx-runtime";var ue="k-actions",To=[],Eo={},ge={alignment:"start",orientation:"horizontal"},O=e=>{let{alignment:t=ge.alignment,orientation:n=ge.orientation,...a}=e;return Co("div",{...a,className:o(ue,{[`${ue}-${t}`]:t,[`${ue}-${n}`]:n},e.className),children:e.children})};O.states=To;O.options=Eo;O.className=ue;O.defaultOptions=ge;O.moduleName=_e;O.folderName=Qe;import{Fragment as na,jsx as ta,jsxs as oa}from"react/jsx-runtime";import{Fragment as da,jsx as ma,jsxs as ca}from"react/jsx-runtime";var c="timeline",d=c;import{Fragment as Ao,jsx as je}from"react/jsx-runtime";var ae="k-timeline",Mo=[],Lo={},et={orientation:"vertical"},A=e=>{let{orientation:t=et.orientation,collapsibleEvents:n,alternatingMode:a,...s}=e;return je("div",{...s,className:o(e.className,ae,{[`${ae}-${t}`]:t,[`${ae}-alternating`]:a,[`${ae}-collapsible`]:n}),children:je(Ao,{children:e.children})})};A.states=Mo;A.options=Lo;A.className=ae;A.defaultOptions=et;A.moduleName=c;A.folderName=d;import{jsx as x,jsxs as Ke}from"react/jsx-runtime";var tt="k-timeline-event",xo=[],ho={},V={collapsed:!1,reverse:!1,title:"Event title",subtitle:"Event subtitle",content:"Event content"},h=e=>{let{date:t,content:n=V.content,collapsed:a=V.collapsed,reverse:s=V.reverse,title:u=V.title,subtitle:l=V.subtitle,showCollapseButton:T,...f}=e;return Ke("li",{...f,className:o(e.className,tt,{"k-reverse":s}),children:[t&&x("div",{className:"k-timeline-date-wrap",children:x("span",{className:"k-timeline-date",children:t})}),x(G,{}),n&&x("div",{className:o("k-timeline-card",{"k-collapsed":a}),children:x(K,{...s?{callout:"right"}:{callout:"left"},children:Ke("div",{className:"k-card-inner",children:[Ke(ne,{children:[x(g,{collapsible:T,children:u}),x(k,{children:l})]}),x(U,{children:x("div",{className:"k-card-description",children:n})})]})})}),e.children]})};h.states=xo;h.options=ho;h.className=tt;h.defaultOptions=V;h.moduleName=c;h.folderName=d;import{jsx as J,jsxs as De}from"react/jsx-runtime";var ot="k-timeline-event",vo=[],bo={},fe={title:"Event title",subtitle:"Event subtitle",content:"Event content"},D=e=>{let{content:t=fe.content,title:n=fe.title,subtitle:a=fe.subtitle,...s}=e;return De("li",{...s,className:o(e.className,ot),children:[t&&J("div",{className:o("k-timeline-card"),children:J(K,{orientation:"vertical",callout:"top",children:De("div",{className:"k-card-inner",children:[De(ne,{children:[J(g,{children:n}),J(k,{children:a})]}),J(U,{children:J("div",{className:"k-card-description",children:t})})]})})}),e.children]})};D.states=vo;D.options=bo;D.className=ot;D.defaultOptions=fe;D.moduleName=c;D.folderName=d;import{jsx as nt}from"react/jsx-runtime";var rt="k-timeline-events-list",Ne=e=>{let{...t}=e;return nt("div",{...t,className:o(e.className,rt),children:nt("ul",{className:"k-timeline-scrollable-wrap",children:e.children})})};Ne.className=rt;Ne.moduleName=c;Ne.folderName=d;import{jsx as Io,jsxs as So}from"react/jsx-runtime";var at="k-timeline-flag-wrap",ko=[m.focus,m.selected],Oo={},it={year:"2020"},v=e=>{let{year:t=it.year,...n}=e;return So("li",{...n,className:o(e.className,at),children:[Io("span",{className:"k-timeline-flag",children:t}),e.children]})};v.states=ko;v.options=Oo;v.className=at;v.defaultOptions=it;v.moduleName=c;v.folderName=d;import{jsx as _o}from"react/jsx-runtime";var st="k-timeline-circle",G=e=>{let{...t}=e;return _o("span",{...t,className:o(e.className,st)})};G.className=st;G.moduleName=c;G.folderName=d;import{jsx as go}from"react/jsx-runtime";var lt="k-timeline-flag",Te=e=>{let{content:t,...n}=e;return go("span",{...n,className:o(e.className,lt),children:t})};Te.className=lt;Te.moduleName=c;Te.folderName=d;import{jsx as Re,jsxs as Ro}from"react/jsx-runtime";var mt="k-card-title",Ko=[],Do={},g=e=>{let{collapsible:t,children:n,...a}=e;return Ro("div",{className:o(e.className,mt),...a,children:[Re("span",{className:"k-event-title",children:n}),t&&Re("span",{className:"k-event-collapse k-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-icon-button",children:Re(M,{icon:"chevron-right",className:"k-button-icon"})})]})};g.states=Ko;g.className=mt;g.defaultOptions=Do;import{jsx as Bo}from"react/jsx-runtime";var ct="k-timeline-card-callout",yo=[],Ho={},ie=e=>{let{...t}=e;return Bo(me,{className:o(e.className,ct),...t})};ie.states=yo;ie.className=ct;ie.defaultOptions=Ho;import{jsx as dt}from"react/jsx-runtime";var pt="k-timeline-date-wrap",wo=[],Po={},ut={date:"May 25, 2008"},R=e=>{let{date:t=ut.date,...n}=e;return dt("div",{...n,className:o(e.className,pt),children:dt("span",{className:"k-timeline-date",children:t})})};R.states=wo;R.options=Po;R.className=pt;R.defaultOptions=ut;R.moduleName=c;R.folderName=d;import{jsx as ye,jsxs as Fo}from"react/jsx-runtime";var ft="k-timeline-track-wrap",Ee=e=>{let{...t}=e;return Fo("div",{...t,className:o(e.className,ft),children:[ye(p,{className:"k-timeline-arrow k-timeline-arrow-left",rounded:"full",icon:"caret-alt-left",disabled:!0}),ye(p,{className:"k-timeline-arrow k-timeline-arrow-right",rounded:"full",icon:"caret-alt-right"}),ye(se,{children:e.children})]})};Ee.className=ft;Ee.moduleName=c;Ee.folderName=d;import{jsx as Nt}from"react/jsx-runtime";var Tt="k-timeline-track",se=e=>{let{...t}=e;return Nt("div",{...t,className:o(e.className,Tt),children:Nt("ul",{className:"k-timeline-scrollable-wrap",children:e.children})})};se.className=Tt;se.moduleName=c;se.folderName=d;import{jsxs as Uo}from"react/jsx-runtime";var He="k-timeline-track-item",zo=[m.focus],le=e=>{let{content:t,focus:n,...a}=e;return Uo("li",{...a,className:o(e.className,He,E(He,{focus:n})),children:[t,e.children]})};le.states=zo;le.className=He;le.moduleName=c;le.folderName=d;import{jsx as Bi,jsxs as wi}from"react/jsx-runtime";import{jsx as Ui,jsxs as Wi}from"react/jsx-runtime";import{jsx as Ji,jsxs as Xi}from"react/jsx-runtime";import{Fragment as es,jsx as Qi,jsxs as ji}from"react/jsx-runtime";import{jsx as Vo,jsxs as Go}from"react/jsx-runtime";var Wo=[],$o={},K=e=>{let{callout:t,children:n,...a}=e;return Go(L,{className:o(e.className),orientation:"vertical",callout:"true",...a,children:[t&&Vo(ie,{callout:t}),n]})};K.states=Wo;K.defaultOptions=$o;var bs=K;export{K as TimelineCard,bs as default};