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