@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 14 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,r)=>t[r]||t[n]&&n||null).filter(n=>n!==null).join(" "):t).filter(t=>!!t).join(" ");var x=(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"}),N=(e,t)=>o({"k-valid":t.valid,"k-invalid":t.invalid,"k-hover":t.hover,"k-focus":t.focus,"k-checked":t.checked,"k-active":t.active,"k-selected":t.selected,"k-disabled":t.disabled,"k-indeterminate":t.indeterminate&&!t.checked,"k-loading":t.loading,"k-empty":t.empty,"k-readonly":t.readonly});var l={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},S={small:"small",medium:"medium",large:"large",full:"full"},M={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"},c={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"},Te={calloutMap:{top:"n",bottom:"s",left:"w",right:"e"},orientationMap:{vertical:"vstack",horizontal:"hstack"}};import{Fragment as Ue,jsx as Ce}from"react/jsx-runtime";var D="k-timeline",Ge=[],Je={},xe={orientation:"vertical"},T=e=>{let{orientation:t=xe.orientation,collapsibleEvents:n,alternatingMode:r,...i}=e;return Ce("div",{...i,className:o(e.className,D,{[`${D}-${t}`]:t,[`${D}-alternating`]:r,[`${D}-collapsible`]:n}),children:Ce(Ue,{children:e.children})})};T.states=Ge;T.options=Je;T.className=D;T.defaultOptions=xe;import{jsx as qe}from"react/jsx-runtime";var Xe="k-card-callout",Y=e=>{let{callout:t,...n}=e;return qe("span",{...n,className:o(e.className,Xe,{[`k-callout-${Te.calloutMap[t]||t}`]:t})})};import{Fragment as je,jsx as Ne,jsxs as et}from"react/jsx-runtime";var Z="k-card",Ye=[c.hover,c.focus,c.selected,c.disabled],Ze={themeColor:[a.primary,a.success,a.warning,a.error,a.info]},Qe={},h=e=>{let{orientation:t,themeColor:n,callout:r,hover:i,focus:d,selected:s,disabled:f,...u}=e;return et("div",{...u,className:o(e.className,Z,x(Z,{themeColor:n}),N(Z,{hover:i,focus:d,disabled:f,selected:s}),{[`k-card-${t}`]:t,"k-card-with-callout":r}),children:[r&&r!=="true"&&Ne(Y,{callout:r}),Ne(je,{children:e.children})]})};h.states=Ye;h.options=Ze;h.className=Z;h.defaultOptions=Qe;import{jsx as ot}from"react/jsx-runtime";var ae="k-card-title",tt=[c.hover,c.focus],I=e=>{let{hover:t,focus:n,...r}=e;return ot("div",{...r,className:o(e.className,ae,N(ae,{hover:t,focus:n})),children:e.children})};I.states=tt;I.className=ae;import{jsx as nt}from"react/jsx-runtime";var at="k-card-subtitle",v=e=>{let{...t}=e;return nt("div",{...t,className:o(e.className,at),children:e.children})};import{Fragment as Bo,jsx as Ho}from"react/jsx-runtime";import{Fragment as st,jsx as he}from"react/jsx-runtime";var ne="k-icon k-font-icon",rt=[],lt={size:[l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[a.base,a.primary,a.secondary,a.tertiary,a.success,a.warning,a.error,a.info,a.light,a.dark]},it={},P=e=>{let{size:t,themeColor:n,icon:r,rotate:i,flip:d,...s}=e;return r?he("span",{...s,className:o(e.className,ne,x(ne,{size:t}),{[`k-i-${r}`]:r,[`k-color-${n}`]:n,[`k-rotate-${i}`]:i,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"})}):he(st,{})};P.states=rt;P.options=lt;P.className=ne;P.defaultOptions=it;var ve=P;import{Fragment as dt,jsx as Q}from"react/jsx-runtime";var re="k-icon k-svg-icon",ct=[],mt={size:[l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[a.base,a.primary,a.secondary,a.tertiary,a.success,a.warning,a.error,a.info,a.light,a.dark]},be={viewBox:"0 0 24 24"},_=e=>{let{size:t,themeColor:n,rotate:r,flip:i,viewBox:d=be.viewBox,icon:s,...f}=e;if(!s)return Q(dt,{});s==="none"&&{...f,className:o(e.className,re,"k-none")};let u=typeof s=="object"&&s.name&&s.name;return Q("span",{...f,className:o(e.className,re,x("k-icon",{size:t}),{[`k-svg-i-${u}`]:u,[`k-color-${n}`]:n,[`k-rotate-${r}`]:r,"k-flip-h":i==="h"||i==="both","k-flip-v":i==="v"||i==="both"}),children:Q("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof s=="object"?s.viewBox:d,dangerouslySetInnerHTML:typeof s=="object"?{__html:s.content}:void 0,children:s?void 0:e.children})})};_.states=ct;_.options=mt;_.className=re;_.defaultOptions=be;var le=_;import*as ke from"@progress/kendo-svg-icons";import{Fragment as Ee,jsx as $}from"react/jsx-runtime";var pt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),ut=[],ft={size:[l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[a.base,a.primary,a.secondary,a.tertiary,a.success,a.warning,a.error,a.info,a.light,a.dark]},ie={viewBox:"0 0 24 24",type:"svg"},b=e=>{let{size:t,themeColor:n,icon:r,type:i=ie.type,rotate:d,flip:s,viewBox:f=ie.viewBox,...u}=e;if(!r)return $(Ee,{});if(i==="svg"){if(r==="none")return $(le,{...u,icon:r,size:t});let X=pt(`${r}-icon`);return ke[X]?$(le,{...u,icon:ke[X],size:t,themeColor:n,rotate:d,flip:s,viewBox:f}):$(Ee,{})}return $(ve,{...u,icon:r,size:t,themeColor:n,rotate:d,flip:s})};b.states=ut;b.options=ft;b.defaultOptions=ie;import{Fragment as xt,jsx as F,jsxs as Me}from"react/jsx-runtime";var j="k-button",Tt=[c.hover,c.focus,c.active,c.selected,c.disabled],Ct={size:[l.small,l.medium,l.large],rounded:[S.small,S.medium,S.large,S.full],fillMode:[M.solid,M.flat,M.outline,M.clear,M.link],themeColor:[a.base,a.primary,a.secondary,a.tertiary,a.success,a.warning,a.error,a.info,a.light,a.dark,a.inverse]},A={size:l.medium,rounded:S.medium,fillMode:M.solid,themeColor:a.base,showArrow:!1,arrowIconName:"caret-alt-down"},m=e=>{let{size:t=A.size,rounded:n=A.rounded,fillMode:r=A.fillMode,themeColor:i=A.themeColor,showArrow:d=A.showArrow,arrowIconName:s=A.arrowIconName,hover:f,focus:u,active:X,selected:Pe,disabled:_e,icon:oe,text:q,iconClassName:$e,...Fe}=e,Ve=oe!==void 0,We=e.children!==void 0;return Me("button",{...Fe,className:o(e.className,j,x(j,{size:t,rounded:n,fillMode:r,themeColor:i}),N(j,{hover:f,focus:u,active:X,disabled:_e,selected:Pe}),{"k-icon-button":!q&&!We&&Ve}),children:[oe&&F(b,{className:o($e,"k-button-icon"),icon:oe}),q?Me(xt,{children:[q&&F("span",{className:"k-button-text",children:q}),e.children]}):e.children&&F("span",{className:"k-button-text",children:e.children}),d&&F("span",{className:"k-menu-button-arrow k-button-arrow",children:F(b,{icon:s})})]})};m.states=Tt;m.options=Ct;m.className=j;m.defaultOptions=A;import{jsx as ta}from"react/jsx-runtime";import{jsx as ra}from"react/jsx-runtime";import{jsx as ca}from"react/jsx-runtime";import{Fragment as ht,jsx as V,jsxs as vt}from"react/jsx-runtime";var Nt="k-card-header",W=e=>{let{title:t,subtitle:n,details:r,...i}=e;return vt("div",{...i,className:o(e.className,Nt),children:[t&&V(I,{children:t}),n&&V(v,{children:n}),V(ht,{children:e.children}),r&&V("span",{className:"k-card-header-actions",children:V(m,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as Ma}from"react/jsx-runtime";import{Fragment as kt,jsx as G,jsxs as Et}from"react/jsx-runtime";var bt="k-card-body",H=e=>{let{title:t,subtitle:n,details:r,...i}=e;return Et("div",{...i,className:o(e.className,bt),children:[t&&G(I,{children:t}),n&&G(v,{children:n}),G(kt,{children:e.children}),r&&G("span",{className:"k-card-header-actions",children:G(m,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as Ra}from"react/jsx-runtime";import{jsx as gt}from"react/jsx-runtime";var ee="k-actions",Mt=[],At={},se={alignment:"start",orientation:"horizontal"},B=e=>{let{alignment:t=se.alignment,orientation:n=se.orientation,...r}=e;return gt("div",{...r,className:o(ee,{[`${ee}-${t}`]:t,[`${ee}-${n}`]:n},e.className),children:e.children})};B.states=Mt;B.options=At;B.className=ee;B.defaultOptions=se;import{Fragment as Ua,jsx as Ga,jsxs as Ja}from"react/jsx-runtime";import{Fragment as tn,jsx as ja,jsxs as en}from"react/jsx-runtime";import{jsx as C,jsxs as ce}from"react/jsx-runtime";var Ae="k-timeline-event",yt=[],Lt={},O={collapsed:!1,reverse:!1,title:"Event title",subtitle:"Event subtitle",content:"Event content"},g=e=>{let{date:t,content:n=O.content,collapsed:r=O.collapsed,reverse:i=O.reverse,title:d=O.title,subtitle:s=O.subtitle,showCollapseButton:f,...u}=e;return ce("li",{...u,className:o(e.className,Ae,{"k-reverse":i}),children:[t&&C("div",{className:"k-timeline-date-wrap",children:C("span",{className:"k-timeline-date",children:t})}),C(R,{}),n&&C("div",{className:o("k-timeline-card",{"k-collapsed":r}),children:C(w,{...i?{callout:"right"}:{callout:"left"},children:ce("div",{className:"k-card-inner",children:[ce(W,{children:[C(y,{collapsible:f,children:d}),C(v,{children:s})]}),C(H,{children:C("div",{className:"k-card-description",children:n})})]})})}),e.children]})};g.states=yt;g.options=Lt;g.className=Ae;g.defaultOptions=O;import{jsx as K,jsxs as me}from"react/jsx-runtime";var ge="k-timeline-event",St=[],It={},te={title:"Event title",subtitle:"Event subtitle",content:"Event content"},z=e=>{let{content:t=te.content,title:n=te.title,subtitle:r=te.subtitle,...i}=e;return me("li",{...i,className:o(e.className,ge),children:[t&&K("div",{className:o("k-timeline-card"),children:K(w,{orientation:"vertical",callout:"top",children:me("div",{className:"k-card-inner",children:[me(W,{children:[K(y,{children:n}),K(v,{children:r})]}),K(H,{children:K("div",{className:"k-card-description",children:t})})]})})}),e.children]})};z.states=St;z.options=It;z.className=ge;z.defaultOptions=te;import{jsx as ye}from"react/jsx-runtime";var Ht="k-timeline-events-list",Le=e=>{let{...t}=e;return ye("div",{...t,className:o(e.className,Ht),children:ye("ul",{className:"k-timeline-scrollable-wrap",children:e.children})})};import{jsx as Rt,jsxs as wt}from"react/jsx-runtime";var Se="k-timeline-flag-wrap",Bt=[c.focus,c.selected],Ot={},Ie={year:"2020"},L=e=>{let{year:t=Ie.year,...n}=e;return wt("li",{...n,className:o(e.className,Se),children:[Rt("span",{className:"k-timeline-flag",children:t}),e.children]})};L.states=Bt;L.options=Ot;L.className=Se;L.defaultOptions=Ie;import{jsx as zt}from"react/jsx-runtime";var Kt="k-timeline-circle",R=e=>{let{...t}=e;return zt("span",{...t,className:o(e.className,Kt)})};import{jsx as Pt}from"react/jsx-runtime";var Dt="k-timeline-flag",de=e=>{let{content:t,...n}=e;return Pt("span",{...n,className:o(e.className,Dt),children:t})};import{jsx as Ft,jsxs as Vt}from"react/jsx-runtime";var _t=[],$t={},w=e=>{let{callout:t,children:n,...r}=e;return Vt(h,{className:o(e.className),orientation:"vertical",callout:"true",...r,children:[t&&Ft(J,{callout:t}),n]})};w.states=_t;w.defaultOptions=$t;import{jsx as pe,jsxs as Jt}from"react/jsx-runtime";var He="k-card-title",Wt=[],Gt={},y=e=>{let{collapsible:t,children:n,...r}=e;return Jt("div",{className:o(e.className,He),...r,children:[pe("span",{className:"k-event-title",children:n}),t&&pe("span",{className:"k-event-collapse k-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-icon-button",children:pe(b,{icon:"chevron-right",className:"k-button-icon"})})]})};y.states=Wt;y.className=He;y.defaultOptions=Gt;import{jsx as qt}from"react/jsx-runtime";var Be="k-timeline-card-callout",Ut=[],Xt={},J=e=>{let{...t}=e;return qt(Y,{className:o(e.className,Be),...t})};J.states=Ut;J.className=Be;J.defaultOptions=Xt;import{jsx as Oe}from"react/jsx-runtime";var Re="k-timeline-date-wrap",Yt=[],Zt={},we={date:"May 25, 2008"},k=e=>{let{date:t=we.date,...n}=e;return Oe("div",{...n,className:o(e.className,Re),children:Oe("span",{className:"k-timeline-date",children:t})})};k.states=Yt;k.options=Zt;k.className=Re;k.defaultOptions=we;import{jsx as ue,jsxs as jt}from"react/jsx-runtime";var Qt="k-timeline-track-wrap",Ke=e=>{let{...t}=e;return jt("div",{...t,className:o(e.className,Qt),children:[ue(m,{className:"k-timeline-arrow k-timeline-arrow-left",rounded:"full",icon:"caret-alt-left",disabled:!0}),ue(m,{className:"k-timeline-arrow k-timeline-arrow-right",rounded:"full",icon:"caret-alt-right"}),ue(ze,{children:e.children})]})};import{jsx as De}from"react/jsx-runtime";var eo="k-timeline-track",ze=e=>{let{...t}=e;return De("div",{...t,className:o(e.className,eo),children:De("ul",{className:"k-timeline-scrollable-wrap",children:e.children})})};import{jsxs as oo}from"react/jsx-runtime";var fe="k-timeline-track-item",to=[c.focus],E=e=>{let{content:t,focus:n,...r}=e;return oo("li",{...r,className:o(e.className,fe,N(fe,{focus:n})),children:[t,e.children]})};E.states=to;E.className=fe;import{jsx as Tr,jsxs as Cr}from"react/jsx-runtime";import{jsx as vr,jsxs as br}from"react/jsx-runtime";import{jsx as Ar,jsxs as gr}from"react/jsx-runtime";import{Fragment as ao,jsx as p,jsxs as U}from"react/jsx-runtime";var Xr=e=>p(T,{orientation:"horizontal",children:U(ao,{children:[U(Ke,{children:[p(E,{className:"k-timeline-flag-wrap",children:p(de,{content:"2015"})}),U(E,{children:[p(k,{date:"Jan 14, 2015"}),p(R,{})]}),U(E,{focus:!0,children:[p(k,{date:"Jun 1, 2015"}),p(R,{})]}),U(E,{children:[p(k,{date:"Sep 29, 2015"}),p(R,{})]}),p(E,{className:"k-timeline-flag-wrap",children:p(de,{content:"2016"})})]}),p(Le,{children:p(z,{})})]}),...e});export{Xr as TimelineHorizontal};