@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 9.17 kB
JavaScript
var n=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?n(...e):typeof e=="object"?Object.keys(e).map((o,r)=>e[r]||e[o]&&o||null).filter(o=>o!==null).join(" "):e).filter(e=>!!e).join(" ");var b=(t,e)=>n({[`${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"}),E=(t,e)=>{let{valid:o,invalid:r,hover:m,focus:a,checked:l,active:d,selected:h,disabled:C,indeterminate:O,loading:S,empty:A,readonly:R,highlighted:B,...I}=e;return n({"k-valid":o,"k-invalid":r,"k-hover":m,"k-focus":a,"k-checked":l,"k-active":d,"k-selected":h,"k-disabled":C,"k-indeterminate":O&&!l,"k-loading":S,"k-empty":A,"k-readonly":R,"k-highlighted":B},Object.keys(I).reduce((T,y)=>(y.startsWith("k-")?T[y]=I[y]:T[`k-${y}`]=I[y],T),{}))};var i={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},g={small:"small",medium:"medium",large:"large",full:"full"};var s={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},p={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"};var K="treeview",P=K;import{jsx as $}from"react/jsx-runtime";import{createElement as se}from"react";var q="k-treeview",ye=[],Ee={size:[i.small,i.medium,i.large]},ne={size:i.medium},f=t=>{let{size:e=ne.size,children:o,dir:r,...m}=t,a=[];return o&&(Array.isArray(o)?o.map((l,d)=>{l.type===c&&a.push(se(c,{...l.props,dir:r,key:d})),l.type===x&&a.push(se(x,{...l.props,dir:r,key:d}))}):(o.type===c&&a.push($(c,{...o.props,dir:r})),o.type===x&&a.push($(x,{...o.props,dir:r})))),$("div",{...m,dir:r,className:n(t.className,q,b(q,{size:e})),children:$(x,{className:"k-treeview-lines",dir:r,children:a})})};f.states=ye;f.options=Ee;f.className=q;f.defaultOptions=ne;f.moduleName=K;f.folderName=P;var N="checkbox",M=N;import{jsx as le}from"react/jsx-runtime";var D="k-checkbox",Ne=[p.hover,p.focus,p.valid,p.invalid,p.required,p.disabled,p.checked,p.indeterminate],Ie={size:[i.small,i.medium,i.large],rounded:[g.small,g.medium,g.large,g.full]},Q={size:i.medium,rounded:g.medium},u=t=>{let{id:e,checked:o,indeterminate:r,hover:m,focus:a,disabled:l,invalid:d,valid:h,required:C,size:O=Q.size,rounded:S=Q.rounded,...A}=t;return le("span",{className:"k-checkbox-wrap",children:le("input",{...A,id:e,type:"checkbox",defaultChecked:o,required:C,className:n(t.className,D,b(D,{size:O,rounded:S}),E(D,{hover:m,focus:a,disabled:l,invalid:d,valid:h,indeterminate:r,checked:o}))})})};u.states=Ne;u.options=Ie;u.className=D;u.defaultOptions=Q;u.moduleName=N;u.folderName=M;import{jsx as Le}from"react/jsx-runtime";var ae="k-checkbox-list",ge=[],Me={},me={layout:"vertical"},w=t=>{let{layout:e=me.layout,...o}=t;return Le("ul",{...o,className:n(t.className,ae,{[`k-list-${e}`]:e}),children:t.children})};w.states=ge;w.options=Me;w.className=ae;w.defaultOptions=me;w.moduleName=N;w.folderName=M;import{jsx as Re}from"react/jsx-runtime";var ce="k-checkbox-list-item",Oe=[],Se={},Ae={},k=t=>{let{...e}=t;return Re("li",{...e,className:n(t.className,ce),children:t.children})};k.states=Oe;k.options=Se;k.className=ce;k.defaultOptions=Ae;k.moduleName=N;k.folderName=M;import{Fragment as St,jsx as Ot,jsxs as At}from"react/jsx-runtime";import{Fragment as zt,jsx as Ht,jsxs as Gt}from"react/jsx-runtime";import{Fragment as Ft,jsx as Dt,jsxs as Xt}from"react/jsx-runtime";import{Fragment as qt,jsx as Jt,jsxs as Qt}from"react/jsx-runtime";import{jsx as eo}from"react/jsx-runtime";import{jsx as io}from"react/jsx-runtime";import{Fragment as ze,jsx as pe}from"react/jsx-runtime";var Z="k-font-icon",Ke=[],_e={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[s.base,s.primary,s.secondary,s.tertiary,s.success,s.warning,s.error,s.info,s.light,s.dark]},He={},_=t=>{let{size:e,themeColor:o,icon:r,rotate:m,flip:a,...l}=t;return r?pe("span",{...l,className:n(t.className,Z,b(Z,{size:e}),{[`k-i-${r}`]:r,[`k-color-${o}`]:o,[`k-rotate-${m}`]:m,"k-flip-h":a==="h"||a==="both","k-flip-v":a==="v"||a==="both"})}):pe(ze,{})};_.states=Ke;_.options=_e;_.className=Z;_.defaultOptions=He;var de=_;import{Fragment as Pe,jsx as F}from"react/jsx-runtime";var j="k-svg-icon",Ge=[],Be={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[s.base,s.primary,s.secondary,s.tertiary,s.success,s.warning,s.error,s.info,s.light,s.dark]},xe={viewBox:"0 0 24 24"},H=t=>{let{size:e,themeColor:o,rotate:r,flip:m,viewBox:a=xe.viewBox,icon:l,...d}=t;if(!l)return F(Pe,{});l==="none"&&{...d,className:n(t.className,j,"k-none")};let h=typeof l=="object"&&l.name&&l.name;return F("span",{...d,className:n(t.className,j,b("k-icon",{size:e}),{[`k-svg-i-${h}`]:h,[`k-color-${o}`]:o,[`k-rotate-${r}`]:r,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"}),children:F("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof l=="object"?l.viewBox:a,dangerouslySetInnerHTML:typeof l=="object"?{__html:l.content}:void 0,children:l?void 0:t.children})})};H.states=Ge;H.options=Be;H.className=j;H.defaultOptions=xe;var ee=H;import*as te from"@progress/kendo-svg-icons";var he="icon",fe="icons";import{Fragment as ue,jsx as z}from"react/jsx-runtime";var X="k-icon",$e=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),De=[],Fe={size:[i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[s.base,s.primary,s.secondary,s.tertiary,s.success,s.warning,s.error,s.info,s.light,s.dark]},oe={viewBox:"0 0 24 24",type:"svg"},v=t=>{let{size:e,themeColor:o,icon:r,type:m=oe.type,rotate:a,flip:l,viewBox:d=oe.viewBox,...h}=t;if(!r)return z(ue,{});if(m==="svg"){if(r==="none")return z(ee,{...h,className:n(t.className,X),icon:r,size:e});let C=te[r]?r:$e(`${r}-icon`);return te[C]?z(ee,{...h,className:n(t.className,X),icon:te[C],size:e,themeColor:o,rotate:a,flip:l,viewBox:d}):z(ue,{})}return z(de,{...h,className:n(t.className,X),icon:r,size:e,themeColor:o,rotate:a,flip:l})};v.states=De;v.options=Fe;v.defaultOptions=oe;v.className=X;v.moduleName=he;v.folderName=fe;import{jsx as ve}from"react/jsx-runtime";import{createElement as Ve}from"react";var Xe="k-treeview-group",x=t=>{let{children:e,dir:o}=t,r=[];return e&&(Array.isArray(e)?e.map((m,a)=>{m.type===G&&r.push(Ve(G,{...m.props,dir:o,key:a}))}):e.type===G&&r.push(ve(G,{...e.props,dir:o}))),ve("ul",{className:n(t.className,Xe),children:r})};import{jsx as Ce,jsxs as Je}from"react/jsx-runtime";var re="k-treeview-leaf",Ue=[p.hover,p.focus,p.selected],We={},V=t=>{let{text:e,showIcon:o,icon:r,hover:m,focus:a,selected:l,...d}=t;return Je("span",{...d,className:n(t.className,re,E(re,{hover:m,focus:a,selected:l})),children:[o&&Ce(v,{icon:r}),Ce("span",{className:"k-treeview-leaf-text",children:e})]})};V.states=Ue;V.options=We;V.className=re;var be=V;import{Fragment as je,jsx as L,jsxs as we}from"react/jsx-runtime";import{createElement as Ze}from"react";var ke="k-treeview-item",qe=[p.hover,p.focus,p.selected,p.disabled],Qe={},Ye={},c=t=>{let{leafClassName:e,children:o,hasChildren:r,expanded:m,text:a,showIcon:l,icon:d,showCheckbox:h,checked:C,hover:O,focus:S,selected:A,disabled:R,top:B,bottom:I,dir:T,...y}=t,ie=r||o,W=[];return o&&(Array.isArray(o)?o.map((J,Te)=>{J.type===x&&W.push(Ze(x,{...J.props,dir:T,key:Te},J.props.children))}):o.type===x&&W.push(L(x,{...o.props,dir:T,children:o.props.children}))),we("li",{...y,className:n(t.className,ke),children:[we("span",{className:n({"k-treeview-top":B,"k-treeview-bot":I,"k-treeview-mid":!B&&!I}),children:[ie&&L("span",{className:n("k-treeview-toggle",E("k-treeview-toggle",{disabled:R})),children:L(v,{icon:m?"caret-alt-down":T==="rtl"?"caret-alt-left":"caret-alt-right"})}),h&&L(u,{checked:C,disabled:R}),L(be,{className:n(e,E(e,{disabled:R})),text:a,showIcon:l,icon:d,hover:O,focus:S,selected:A})]}),m&&ie&&L(je,{children:W})]})};c.states=qe;c.options=Qe;c.className=ke;c.defaultOptions=Ye;c.moduleName=K;c.folderName=P;var G=c;import{jsx as er,jsxs as tr}from"react/jsx-runtime";import{jsx as sr,jsxs as nr}from"react/jsx-runtime";import{jsx as cr,jsxs as pr}from"react/jsx-runtime";import{jsx as fr,jsxs as ur}from"react/jsx-runtime";import{jsx as U}from"react/jsx-runtime";var Lr=t=>U(f,{children:[U(c,{top:!0,text:"Treeview item"},"treeview-item-1"),U(c,{text:"Treeview item"},"treeview-item-2"),U(c,{bottom:!0,text:"Treeview item"},"treeview-item-3")],...t});export{Lr as TreeviewNormal};