UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 7.59 kB
var a=(...o)=>o.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?a(...e):typeof e=="object"?Object.keys(e).map((s,n)=>e[n]||e[s]&&s||null).filter(s=>s!==null).join(" "):e).filter(e=>!!e).join(" ");var k=(o,e)=>a({[`${o}-xs`]:e.size==="xsmall",[`${o}-sm`]:e.size==="small",[`${o}-md`]:e.size==="medium",[`${o}-lg`]:e.size==="large",[`${o}-xl`]:e.size==="xlarge",[`${o}-xxl`]:e.size==="xxlarge",[`${o}-xxxl`]:e.size==="xxxlarge"},{[`${o}-${e.fillMode}`]:e.fillMode},{[`${o}-${e.fillMode}-${e.themeColor}`]:e.fillMode&&e.themeColor},{[`${o}-${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"}),x=(o,e)=>a({"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 r={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},b={small:"small",medium:"medium",large:"large",full:"full"};var t={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"};import{jsx as U}from"react/jsx-runtime";var L="k-checkbox",me=[c.hover,c.focus,c.valid,c.invalid,c.required,c.disabled,c.checked,c.indeterminate],de={size:[r.small,r.medium,r.large],rounded:[b.small,b.medium,b.large,b.full]},R={size:r.medium,rounded:b.medium},h=o=>{let{id:e,checked:s,indeterminate:n,hover:l,focus:m,disabled:i,invalid:d,valid:p,required:u,size:E=R.size,rounded:A=R.rounded,...O}=o;return U("span",{className:"k-checkbox-wrap",children:U("input",{...O,id:e,type:"checkbox",defaultChecked:s,required:u,className:a(o.className,L,k(L,{size:E,rounded:A}),x(L,{hover:l,focus:m,disabled:i,invalid:d,valid:p,indeterminate:n,checked:s}))})})};h.states=me;h.options=de;h.className=L;h.defaultOptions=R;import{jsx as xe}from"react/jsx-runtime";var D="k-checkbox-list",pe=[],he={},Q={layout:"vertical"},v=o=>{let{layout:e=Q.layout,...s}=o;return xe("ul",{...s,className:a(o.className,D,{[`k-list-${e}`]:e}),children:o.children})};v.states=pe;v.options=he;v.className=D;v.defaultOptions=Q;import{jsx as be}from"react/jsx-runtime";var Y="k-checkbox-list-item",fe=[],ue={},ke={},y=o=>{let{...e}=o;return be("li",{...e,className:a(o.className,Y),children:o.children})};y.states=fe;y.options=ue;y.className=Y;y.defaultOptions=ke;import{Fragment as no,jsx as ro,jsxs as ao}from"react/jsx-runtime";import{Fragment as po,jsx as mo,jsxs as ho}from"react/jsx-runtime";import{Fragment as bo,jsx as ko,jsxs as vo}from"react/jsx-runtime";import{Fragment as Io,jsx as wo,jsxs as No}from"react/jsx-runtime";import{jsx as zo}from"react/jsx-runtime";import{jsx as Oo}from"react/jsx-runtime";import{Fragment as Ce,jsx as Z}from"react/jsx-runtime";var P="k-icon k-font-icon",ve=[],ye={size:[r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},ge={},C=o=>{let{size:e,themeColor:s,icon:n,rotate:l,flip:m,...i}=o;return n?Z("span",{...i,className:a(o.className,P,k(P,{size:e}),{[`k-i-${n}`]:n,[`k-color-${s}`]:s,[`k-rotate-${l}`]:l,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"})}):Z(Ce,{})};C.states=ve;C.options=ye;C.className=P;C.defaultOptions=ge;var j=C;import{Fragment as Ne,jsx as z}from"react/jsx-runtime";var _="k-icon k-svg-icon",we=[],Ie={size:[r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},ee={viewBox:"0 0 24 24"},w=o=>{let{size:e,themeColor:s,rotate:n,flip:l,viewBox:m=ee.viewBox,icon:i,...d}=o;if(!i)return z(Ne,{});i==="none"&&{...d,className:a(o.className,_,"k-none")};let p=typeof i=="object"&&i.name&&i.name;return z("span",{...d,className:a(o.className,_,k("k-icon",{size:e}),{[`k-svg-i-${p}`]:p,[`k-color-${s}`]:s,[`k-rotate-${n}`]:n,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"}),children:z("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof i=="object"?i.viewBox:m,dangerouslySetInnerHTML:typeof i=="object"?{__html:i.content}:void 0,children:i?void 0:o.children})})};w.states=we;w.options=Ie;w.className=_;w.defaultOptions=ee;var F=w;import*as oe from"@progress/kendo-svg-icons";import{Fragment as te,jsx as I}from"react/jsx-runtime";var Se=o=>o.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Te=[],Le={size:[r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},X={viewBox:"0 0 24 24",type:"svg"},f=o=>{let{size:e,themeColor:s,icon:n,type:l=X.type,rotate:m,flip:i,viewBox:d=X.viewBox,...p}=o;if(!n)return I(te,{});if(l==="svg"){if(n==="none")return I(F,{...p,icon:n,size:e});let u=Se(`${n}-icon`);return oe[u]?I(F,{...p,icon:oe[u],size:e,themeColor:s,rotate:m,flip:i,viewBox:d}):I(te,{})}return I(j,{...p,icon:n,size:e,themeColor:s,rotate:m,flip:i})};f.states=Te;f.options=Le;f.defaultOptions=X;import{jsx as se}from"react/jsx-runtime";import{createElement as Me}from"react";var ze="k-treeview-group",S=o=>{let{children:e,dir:s}=o,n=[];return e&&(Array.isArray(e)?e.map((l,m)=>{l.type===N&&n.push(Me(N,{...l.props,dir:s,key:m}))}):e.type===N&&n.push(se(N,{...e.props,dir:s}))),se("ul",{className:a(o.className,ze),children:n})};import{jsx as re,jsxs as Oe}from"react/jsx-runtime";var V="k-treeview-leaf",Ee=[c.hover,c.focus,c.selected],Ae={},M=o=>{let{text:e,showIcon:s,icon:n,hover:l,focus:m,selected:i,...d}=o;return Oe("span",{...d,className:a(o.className,V,x(V,{hover:l,focus:m,selected:i})),children:[s&&re(f,{icon:n}),re("span",{className:"k-treeview-leaf-text",children:e})]})};M.states=Ee;M.options=Ae;M.className=V;var ne=M;import{Fragment as Re,jsx as g,jsxs as ae}from"react/jsx-runtime";import{createElement as Ge}from"react";var ie="k-treeview-item",He=[c.hover,c.focus,c.selected,c.disabled],Ke={},$e={},T=o=>{let{leafClassName:e,children:s,hasChildren:n,expanded:l,text:m,showIcon:i,icon:d,showCheckbox:p,checked:u,hover:E,focus:A,selected:O,disabled:H,top:J,bottom:q,dir:K,...le}=o,W=n||s,$=[];return s&&(Array.isArray(s)?s.map((G,ce)=>{G.type===S&&$.push(Ge(S,{...G.props,dir:K,key:ce},G.props.children))}):s.type===S&&$.push(g(S,{...s.props,dir:K,children:s.props.children}))),ae("li",{...le,className:a(o.className,ie),children:[ae("span",{className:a({"k-treeview-top":J,"k-treeview-bot":q,"k-treeview-mid":!J&&!q}),children:[W&&g("span",{className:a("k-treeview-toggle",x("k-treeview-toggle",{disabled:H})),children:g(f,{icon:l?"caret-alt-down":K==="rtl"?"caret-alt-left":"caret-alt-right"})}),p&&g(h,{checked:u,disabled:H}),g(ne,{className:a(e,x(e,{disabled:H})),text:m,showIcon:i,icon:d,hover:E,focus:A,selected:O})]}),l&&W&&g(Re,{children:$})]})};T.states=He;T.options=Ke;T.className=ie;T.defaultOptions=$e;var N=T;export{ie as TREEVIEWITEM_CLASSNAME,T as TreeviewItem,N as default};