@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 14.4 kB
JavaScript
var r=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?r(...e):typeof e=="object"?Object.keys(e).map((a,n)=>e[n]||e[a]&&a||null).filter(a=>a!==null).join(" "):e).filter(e=>!!e).join(" ");var v=(t,e)=>r({[`${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)=>{let{valid:a,invalid:n,hover:c,focus:l,checked:i,active:m,selected:u,disabled:b,indeterminate:_,loading:$,empty:nt,readonly:U,highlighted:B,...F}=e;return r({"k-valid":a,"k-invalid":n,"k-hover":c,"k-focus":l,"k-checked":i,"k-active":m,"k-selected":u,"k-disabled":b,"k-indeterminate":_&&!i,"k-loading":$,"k-empty":nt,"k-readonly":U,"k-highlighted":B},Object.keys(F).reduce((V,S)=>(S.startsWith("k-")?V[S]=F[S]:V[`k-${S}`]=F[S],V),{}))};function Tt(t,e){if(!e)return{};let a=Array.isArray(e)?e:[e];return Object.fromEntries(a.map(n=>[`k-${n}`,!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"},d={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"},k={calloutMap:{top:"n",bottom:"s",left:"w",right:"e"},orientationMap:{vertical:"vstack",horizontal:"hstack"}};var st="orgchart",Ot=st;import{jsx as Mt}from"react/jsx-runtime";var yt="k-orgchart",Zt=[],jt={},it={width:"100%",height:"300px"},A=t=>{let{width:e=it.width,height:a=it.height,...n}=t;return Mt("div",{...n,className:r(t.className,yt),children:Mt("div",{className:"k-orgchart-container",style:{width:e,height:a},children:t.children})})};A.states=Zt;A.options=jt;A.className=yt;A.defaultOptions=it;A.moduleName=st;A.folderName=Ot;import{jsx as ee}from"react/jsx-runtime";var te="k-card-callout",Et=t=>{let{callout:e,...a}=t;return ee("span",{...a,className:r(t.className,te,{[`k-callout-${k.calloutMap[e]||e}`]:e})})};var f="card",x=f;import{Fragment as ne,jsx as St,jsxs as se}from"react/jsx-runtime";var tt="k-card",oe=[d.hover,d.focus,d.selected,d.disabled],re={themeColor:[o.primary,o.success,o.warning,o.error,o.info]},ae={},g=t=>{let{orientation:e,themeColor:a,callout:n,hover:c,focus:l,selected:i,disabled:m,...u}=t;return se("div",{...u,className:r(t.className,tt,v(tt,{themeColor:a}),h(tt,{hover:c,focus:l,disabled:m,selected:i}),{[`k-card-${e}`]:e,"k-card-with-callout":n}),children:[n&&n!=="true"&&St(Et,{callout:n}),St(ne,{children:t.children})]})};g.states=oe;g.options=re;g.className=tt;g.defaultOptions=ae;g.moduleName=f;g.folderName=x;import{Fragment as ce,jsx as kt}from"react/jsx-runtime";var lt="k-card-list",ie=[],le={},de={},H=t=>{let{...e}=t;return kt("div",{...e,className:r(t.className,lt,h(lt,{})),children:kt(ce,{children:t.children})})};H.states=ie;H.options=le;H.className=lt;H.defaultOptions=de;H.moduleName=f;H.folderName=x;import{jsx as fe}from"react/jsx-runtime";var Lt="k-card-group",me=[],pe={},ue={},I=t=>{let{...e}=t;return fe("div",{...e,className:r(t.className,Lt),children:t.children})};I.states=me;I.options=pe;I.className=Lt;I.defaultOptions=ue;I.moduleName=f;I.folderName=x;import{jsx as xe}from"react/jsx-runtime";var dt="k-card-wrap",he=[d.focus,d.selected],Ce={},Ne={},G=t=>{let{focus:e,selected:a,...n}=t;return xe("div",{...n,className:r(t.className,dt,h(dt,{focus:e,selected:a})),children:t.children})};G.states=he;G.options=Ce;G.className=dt;G.defaultOptions=Ne;G.moduleName=f;G.folderName=x;import{jsx as ve}from"react/jsx-runtime";var ct="k-card-title",be=[d.hover,d.focus],L=t=>{let{hover:e,focus:a,...n}=t;return ve("div",{...n,className:r(t.className,ct,h(ct,{hover:e,focus:a})),children:t.children})};L.states=be;L.className=ct;import{jsx as ge}from"react/jsx-runtime";var Ae="k-card-subtitle",W=t=>{let{...e}=t;return ge("div",{...e,className:r(t.className,Ae),children:t.children})};import{Fragment as qo,jsx as Jo}from"react/jsx-runtime";import{Fragment as ye,jsx as Kt}from"react/jsx-runtime";var mt="k-font-icon",Te=[],Oe={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]},Me={},X=t=>{let{size:e,themeColor:a,icon:n,rotate:c,flip:l,...i}=t;return n?Kt("span",{...i,className:r(t.className,mt,v(mt,{size:e}),{[`k-i-${n}`]:n,[`k-color-${a}`]:a,[`k-rotate-${c}`]:c,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"})}):Kt(ye,{})};X.states=Te;X.options=Oe;X.className=mt;X.defaultOptions=Me;var Rt=X;import{Fragment as ke,jsx as et}from"react/jsx-runtime";var pt="k-svg-icon",Ee=[],Se={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]},Dt={viewBox:"0 0 24 24"},J=t=>{let{size:e,themeColor:a,rotate:n,flip:c,viewBox:l=Dt.viewBox,icon:i,...m}=t;if(!i)return et(ke,{});i==="none"&&{...m,className:r(t.className,pt,"k-none")};let u=typeof i=="object"&&i.name&&i.name;return et("span",{...m,className:r(t.className,pt,v("k-icon",{size:e}),{[`k-svg-i-${u}`]:u,[`k-color-${a}`]:a,[`k-rotate-${n}`]:n,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"}),children:et("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof i=="object"?i.viewBox:l,dangerouslySetInnerHTML:typeof i=="object"?{__html:i.content}:void 0,children:i?void 0:t.children})})};J.states=Ee;J.options=Se;J.className=pt;J.defaultOptions=Dt;var ut=J;import*as ft from"@progress/kendo-svg-icons";var _t="icon",Bt="icons";import{Fragment as Ht,jsx as q}from"react/jsx-runtime";var ot="k-icon",Le=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Ke=[],Re={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]},ht={viewBox:"0 0 24 24",type:"svg"},O=t=>{let{size:e,themeColor:a,icon:n,type:c=ht.type,rotate:l,flip:i,viewBox:m=ht.viewBox,...u}=t;if(!n)return q(Ht,{});if(c==="svg"){if(n==="none")return q(ut,{...u,className:r(t.className,ot),icon:n,size:e});let b=ft[n]?n:Le(`${n}-icon`);return ft[b]?q(ut,{...u,className:r(t.className,ot),icon:ft[b],size:e,themeColor:a,rotate:l,flip:i,viewBox:m}):q(Ht,{})}return q(Rt,{...u,className:r(t.className,ot),icon:n,size:e,themeColor:a,rotate:l,flip:i})};O.states=Ke;O.options=Re;O.defaultOptions=ht;O.className=ot;O.moduleName=_t;O.folderName=Bt;var Ct="button",It=Ct;import{Fragment as He,jsx as Y,jsxs as Gt}from"react/jsx-runtime";var Q="k-button",De=["icon-button"],_e=[d.hover,d.focus,d.active,d.selected,d.disabled,d.generating],Be={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]},K={size:s.medium,rounded:C.medium,fillMode:N.solid,themeColor:o.base,showArrow:!1,arrowIconName:"caret-alt-down"},p=t=>{let{size:e=K.size,rounded:a=K.rounded,fillMode:n=K.fillMode,themeColor:c=K.themeColor,showArrow:l=K.showArrow,arrowIconName:i=K.arrowIconName,variant:m,hover:u,focus:b,active:_,selected:$,disabled:nt,icon:U,text:B,iconClassName:F,...V}=t,S=U!==void 0,Qt=t.children!==void 0;return Gt("button",{...V,className:r(t.className,Q,Tt(Q,m),v(Q,{size:e,rounded:a,fillMode:n,themeColor:c}),h(Q,{hover:u,focus:b,active:_,disabled:nt,selected:$}),{"k-icon-button":!B&&!Qt&&S}),children:[U&&Y(O,{className:r(F,"k-button-icon"),icon:U}),B?Gt(He,{children:[B&&Y("span",{className:"k-button-text",children:B}),t.children]}):t.children&&Y("span",{className:"k-button-text",children:t.children}),l&&Y("span",{className:"k-menu-button-arrow k-button-arrow",children:Y(O,{icon:i})})]})};p.states=_e;p.options=Be;p.variants=De;p.className=Q;p.defaultOptions=K;p.moduleName=Ct;p.folderName=It;import{jsx as gr}from"react/jsx-runtime";import{jsx as yr}from"react/jsx-runtime";import{jsx as Lr}from"react/jsx-runtime";import{Fragment as Ur,jsx as $r,jsxs as Fr}from"react/jsx-runtime";import{jsx as Jr}from"react/jsx-runtime";import{Fragment as Ge,jsx as Z,jsxs as we}from"react/jsx-runtime";var Ie="k-card-body",rt=t=>{let{title:e,subtitle:a,details:n,...c}=t;return we("div",{...c,className:r(t.className,Ie),children:[e&&Z(L,{children:e}),a&&Z(W,{children:a}),Z(Ge,{children:t.children}),n&&Z("span",{className:"k-card-header-actions",children:Z(p,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as Ue}from"react/jsx-runtime";var wt="k-card-deck",ze=[],Pe={},$e={},w=t=>{let{...e}=t;return Ue("div",{...e,className:r(t.className,wt),children:t.children})};w.states=ze;w.options=Pe;w.className=wt;w.defaultOptions=$e;w.moduleName=f;w.folderName=x;import{jsx as Xe}from"react/jsx-runtime";var zt="k-card-deck-scrollwrap",Fe=[],Ve={},We={},z=t=>{let{...e}=t;return Xe("div",{...e,className:r(t.className,zt),children:t.children})};z.states=Fe;z.options=Ve;z.className=zt;z.defaultOptions=We;z.moduleName=f;z.folderName=x;var Nt="action-buttons",Pt=Nt;import{jsx as Ye}from"react/jsx-runtime";var at="k-actions",Je=[],qe={},xt={alignment:"start",orientation:"horizontal"},y=t=>{let{alignment:e=xt.alignment,orientation:a=xt.orientation,...n}=t;return Ye("div",{...n,className:r(at,{[`${at}-${e}`]:e,[`${at}-${a}`]:a},t.className),children:t.children})};y.states=Je;y.options=qe;y.className=at;y.defaultOptions=xt;y.moduleName=Nt;y.folderName=Pt;import{Fragment as Oa,jsx as ga,jsxs as Ta}from"react/jsx-runtime";import{Fragment as Ra,jsx as La,jsxs as Ka}from"react/jsx-runtime";var bt="avatar",$t=bt;import{jsx as Ut}from"react/jsx-runtime";var j="k-avatar";var Qe=[d.hover,d.focus,d.active,d.selected,d.disabled],Ze={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]},R={type:"text",size:s.medium,rounded:C.full,fillMode:N.solid,themeColor:o.primary,border:!1},E=t=>{let{size:e=R.size,rounded:a=R.rounded,fillMode:n=R.fillMode,themeColor:c=R.themeColor,type:l=R.type,border:i=R.border,...m}=t;return Ut("div",{...m,className:r(t.className,j,v(j,{size:e,rounded:a,fillMode:n,themeColor:c}),{[`${j}-bordered`]:i}),children:Ut("span",{className:`${j}-${l}`,children:t.children})})};E.states=Qe;E.options=Ze;E.className=j;E.defaultOptions=R;E.moduleName=bt;E.folderName=$t;import{jsx as rn}from"react/jsx-runtime";import{jsx as ln}from"react/jsx-runtime";import{jsx as pn}from"react/jsx-runtime";import{jsx as T,jsxs as vt}from"react/jsx-runtime";var je="k-orgchart-node",Vt={buttonIcon:"plus",details:!0},D=t=>{let{title:e,subtitle:a,details:n=Vt.details,color:c,lineBottom:l,lineTop:i,button:m,buttonIcon:u=Vt.buttonIcon,avatar:b,avatarType:_,...$}=t;return vt("div",{...$,className:r(t.className,je,"k-vstack","k-align-items-center"),children:[i&&T("div",{className:"k-orgchart-line k-orgchart-line-v"}),T(g,{className:"k-orgchart-card",children:vt(rt,{className:"k-hstack",details:n,style:{borderTopColor:c},children:[T(E,{type:_,themeColor:"secondary",children:_==="image"?T("img",{src:b}):b}),vt("div",{className:"k-card-title-wrap k-vstack",children:[T(L,{className:"k-text-ellipsis",children:e}),T("span",{className:"k-spacer"}),T(W,{className:"k-text-ellipsis",children:a})]}),T("span",{className:"k-spacer"})]})}),l&&T("div",{className:"k-orgchart-line k-orgchart-line-v"}),m&&T(p,{className:"k-orgchart-button",icon:u})]})};import{jsx as P,jsxs as Xt}from"react/jsx-runtime";var to="k-orgchart-node-group",eo=[d.focus],Wt={orientation:"horizontal",buttonIcon:"plus"},At=t=>{let{title:e,subtitle:a,lineBottom:n,lineTop:c,button:l,buttonIcon:i=Wt.buttonIcon,focus:m,orientation:u=Wt.orientation,...b}=t;return Xt("div",{...b,className:r(t.className,to,"k-vstack","k-align-items-center"),children:[c&&P("div",{className:"k-orgchart-line k-orgchart-line-v"}),Xt("div",{className:r("k-orgchart-node-group-container","k-vstack",h("k-orgchart-node-group-container",{focus:m})),children:[e&&P("div",{className:"k-orgchart-node-group-title",children:e}),a&&P("div",{className:"k-orgchart-node-group-subtitle",children:a}),P("div",{className:r("k-orgchart-node-container",{[`k-${k.orientationMap[u]||u}`]:u}),children:t.children})]}),n&&P("div",{className:"k-orgchart-line k-orgchart-line-v"}),l&&P(p,{className:"k-orgchart-button",icon:i})]})};At.states=eo;import{jsx as Kn,jsxs as Rn}from"react/jsx-runtime";import{jsx as Hn,jsxs as In}from"react/jsx-runtime";import{jsx as Pn,jsxs as $n}from"react/jsx-runtime";import{jsx as Wn,jsxs as Xn}from"react/jsx-runtime";import{Fragment as Jt,jsx as gt,jsxs as ao}from"react/jsx-runtime";var qt="k-orgchart-group",oo=[],ro={},Yt={orientation:"horizontal"},M=t=>{let{children:e,orientation:a=Yt.orientation,justifyContent:n,...c}=t,l=[],i=[];return e&&(Array.isArray(e)?e.map(m=>{m.type===D?l.push(m):i.push(m)}):e.type===D?l.push(e):i.push(e)),ao("div",{...c,className:r(qt,"k-pos-absolute",{[`k-${k.orientationMap[a]||a}`]:a,[`k-justify-content-${n}`]:n}),style:{width:"100%"},children:[l.length>0&>("div",{className:r("k-orgchart-node-container","k-justify-content-around",{[`k-${k.orientationMap[a]||a}`]:a}),children:gt(Jt,{children:l})}),gt(Jt,{children:i})]})};M.states=oo;M.options=ro;M.className=qt;M.defaultOptions=Yt;var ss=M;export{qt as ORGCHARTGROUP_CLASSNAME,M as OrgchartGroup,ss as default};