UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 12.9 kB
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 N=(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"}),h=(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});var l={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},g={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"},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 O="k-timeline",ze=[],De={},fe={orientation:"vertical"},f=t=>{let{orientation:e=fe.orientation,collapsibleEvents:n,alternatingMode:r,...i}=t;return ue("div",{...i,className:o(t.className,O,{[`${O}-${e}`]:e,[`${O}-alternating`]:r,[`${O}-collapsible`]:n}),children:ue(Pe,{children:t.children})})};f.states=ze;f.options=De;f.className=O;f.defaultOptions=fe;import{jsx as $e}from"react/jsx-runtime";var _e="k-card-callout",U=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 Ge,jsx as Te,jsxs as Je}from"react/jsx-runtime";var X="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:i,focus:m,selected:s,disabled:u,...p}=t;return Je("div",{...p,className:o(t.className,X,N(X,{themeColor:n}),h(X,{hover:i,focus:m,disabled:u,selected:s}),{[`k-card-${e}`]:e,"k-card-with-callout":r}),children:[r&&r!=="true"&&Te(U,{callout:r}),Te(Ge,{children:t.children})]})};v.states=Fe;v.options=Ve;v.className=X;v.defaultOptions=We;import{jsx as Xe}from"react/jsx-runtime";var ee="k-card-title",Ue=[c.hover,c.focus],y=t=>{let{hover:e,focus:n,...r}=t;return Xe("div",{...r,className:o(t.className,ee,h(ee,{hover:e,focus:n})),children:t.children})};y.states=Ue;y.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 No,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:[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]},je={},R=t=>{let{size:e,themeColor:n,icon:r,rotate:i,flip:m,...s}=t;return r?Ce("span",{...s,className:o(t.className,te,N(te,{size:e}),{[`k-i-${r}`]:r,[`k-color-${n}`]:n,[`k-rotate-${i}`]:i,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"})}):Ce(et,{})};R.states=Ze;R.options=Qe;R.className=te;R.defaultOptions=je;var xe=R;import{Fragment as at,jsx as q}from"react/jsx-runtime";var oe="k-icon k-svg-icon",tt=[],ot={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]},Ne={viewBox:"0 0 24 24"},w=t=>{let{size:e,themeColor:n,rotate:r,flip:i,viewBox:m=Ne.viewBox,icon:s,...u}=t;if(!s)return q(at,{});s==="none"&&{...u,className:o(t.className,oe,"k-none")};let p=typeof s=="object"&&s.name&&s.name;return q("span",{...u,className:o(t.className,oe,N("k-icon",{size:e}),{[`k-svg-i-${p}`]:p,[`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:m,dangerouslySetInnerHTML:typeof s=="object"?{__html:s.content}:void 0,children:s?void 0:t.children})})};w.states=tt;w.options=ot;w.className=oe;w.defaultOptions=Ne;var ae=w;import*as he from"@progress/kendo-svg-icons";import{Fragment as ve,jsx as K}from"react/jsx-runtime";var nt=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),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]},ne={viewBox:"0 0 24 24",type:"svg"},k=t=>{let{size:e,themeColor:n,icon:r,type:i=ne.type,rotate:m,flip:s,viewBox:u=ne.viewBox,...p}=t;if(!r)return K(ve,{});if(i==="svg"){if(r==="none")return K(ae,{...p,icon:r,size:e});let G=nt(`${r}-icon`);return he[G]?K(ae,{...p,icon:he[G],size:e,themeColor:n,rotate:m,flip:s,viewBox:u}):K(ve,{})}return K(xe,{...p,icon:r,size:e,themeColor:n,rotate:m,flip:s})};k.states=rt;k.options=lt;k.defaultOptions=ne;import{Fragment as ct,jsx as z,jsxs as be}from"react/jsx-runtime";var Y="k-button",it=[c.hover,c.focus,c.active,c.selected,c.disabled],st={size:[l.small,l.medium,l.large],rounded:[g.small,g.medium,g.large,g.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:l.medium,rounded:g.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:i=M.themeColor,showArrow:m=M.showArrow,arrowIconName:s=M.arrowIconName,hover:u,focus:p,active:G,selected:He,disabled:Be,icon:j,text:J,iconClassName:Oe,...Re}=t,we=j!==void 0,Ke=t.children!==void 0;return be("button",{...Re,className:o(t.className,Y,N(Y,{size:e,rounded:n,fillMode:r,themeColor:i}),h(Y,{hover:u,focus:p,active:G,disabled:Be,selected:He}),{"k-icon-button":!J&&!Ke&&we}),children:[j&&z(k,{className:o(Oe,"k-button-icon"),icon:j}),J?be(ct,{children:[J&&z("span",{className:"k-button-text",children:J}),t.children]}):t.children&&z("span",{className:"k-button-text",children:t.children}),m&&z("span",{className:"k-menu-button-arrow k-button-arrow",children:z(k,{icon:s})})]})};d.states=it;d.options=st;d.className=Y;d.defaultOptions=M;import{jsx as $o}from"react/jsx-runtime";import{jsx as Go}from"react/jsx-runtime";import{jsx as qo}from"react/jsx-runtime";import{Fragment as dt,jsx as D,jsxs as pt}from"react/jsx-runtime";var mt="k-card-header",P=t=>{let{title:e,subtitle:n,details:r,...i}=t;return pt("div",{...i,className:o(t.className,mt),children:[e&&D(y,{children:e}),n&&D(b,{children:n}),D(dt,{children:t.children}),r&&D("span",{className:"k-card-header-actions",children:D(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",L=t=>{let{title:e,subtitle:n,details:r,...i}=t;return Tt("div",{...i,className:o(t.className,ut),children:[e&&_(y,{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 Nt}from"react/jsx-runtime";var Z="k-actions",Ct=[],xt={},re={alignment:"start",orientation:"horizontal"},S=t=>{let{alignment:e=re.alignment,orientation:n=re.orientation,...r}=t;return Nt("div",{...r,className:o(Z,{[`${Z}-${e}`]:e,[`${Z}-${n}`]:n},t.className),children:t.children})};S.states=Ct;S.options=xt;S.className=Z;S.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 T,jsxs as le}from"react/jsx-runtime";var ke="k-timeline-event",ht=[],vt={},I={collapsed:!1,reverse:!1,title:"Event title",subtitle:"Event subtitle",content:"Event content"},C=t=>{let{date:e,content:n=I.content,collapsed:r=I.collapsed,reverse:i=I.reverse,title:m=I.title,subtitle:s=I.subtitle,showCollapseButton:u,...p}=t;return le("li",{...p,className:o(t.className,ke,{"k-reverse":i}),children:[e&&T("div",{className:"k-timeline-date-wrap",children:T("span",{className:"k-timeline-date",children:e})}),T(ie,{}),n&&T("div",{className:o("k-timeline-card",{"k-collapsed":r}),children:T(H,{...i?{callout:"right"}:{callout:"left"},children:le("div",{className:"k-card-inner",children:[le(P,{children:[T(A,{collapsible:u,children:m}),T(b,{children:s})]}),T(L,{children:T("div",{className:"k-card-description",children:n})})]})})}),t.children]})};C.states=ht;C.options=vt;C.className=ke;C.defaultOptions=I;import{jsx as B,jsxs as se}from"react/jsx-runtime";var Ee="k-timeline-event",bt=[],kt={},Q={title:"Event title",subtitle:"Event subtitle",content:"Event content"},$=t=>{let{content:e=Q.content,title:n=Q.title,subtitle:r=Q.subtitle,...i}=t;return se("li",{...i,className:o(t.className,Ee),children:[e&&B("div",{className:o("k-timeline-card"),children:B(H,{orientation:"vertical",callout:"top",children:se("div",{className:"k-card-inner",children:[se(P,{children:[B(A,{children:n}),B(b,{children:r})]}),B(L,{children:B("div",{className:"k-card-description",children:e})})]})})}),t.children]})};$.states=bt;$.options=kt;$.className=Ee;$.defaultOptions=Q;import{jsx as fn}from"react/jsx-runtime";import{jsx as At,jsxs as gt}from"react/jsx-runtime";var Me="k-timeline-flag-wrap",Et=[c.focus,c.selected],Mt={},Ae={year:"2020"},x=t=>{let{year:e=Ae.year,...n}=t;return gt("li",{...n,className:o(t.className,Me),children:[At("span",{className:"k-timeline-flag",children:e}),t.children]})};x.states=Et;x.options=Mt;x.className=Me;x.defaultOptions=Ae;import{jsx as Lt}from"react/jsx-runtime";var yt="k-timeline-circle",ie=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={},H=t=>{let{callout:e,children:n,...r}=t;return Bt(v,{className:o(t.className),orientation:"vertical",callout:"true",...r,children:[e&&Ht(F,{callout:e}),n]})};H.states=St;H.defaultOptions=It;import{jsx as ce,jsxs as wt}from"react/jsx-runtime";var ge="k-card-title",Ot=[],Rt={},A=t=>{let{collapsible:e,children:n,...r}=t;return wt("div",{className:o(t.className,ge),...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"})})]})};A.states=Ot;A.className=ge;A.defaultOptions=Rt;import{jsx as Dt}from"react/jsx-runtime";var ye="k-timeline-card-callout",Kt=[],zt={},F=t=>{let{...e}=t;return Dt(U,{className:o(t.className,ye),...e})};F.states=Kt;F.className=ye;F.defaultOptions=zt;import{jsx as Le}from"react/jsx-runtime";var Se="k-timeline-date-wrap",Pt=[],_t={},Ie={date:"May 25, 2008"},V=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})})};V.states=Pt;V.options=_t;V.className=Se;V.defaultOptions=Ie;import{jsx as Xn,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,h(me,{focus:n})),children:[e,t.children]})};de.states=$t;de.className=me;import{jsx as ir,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 W,jsxs as Vt}from"react/jsx-runtime";var Wr=t=>W(f,{children:Vt("ul",{children:[W(x,{year:"2010"}),W(C,{date:"May 11, 2010"}),W(x,{year:"2011"}),W(C,{date:"Oct 11, 2011"})]}),...t});export{Wr as TimelineNormal};