@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 14.2 kB
JavaScript
var i=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?i(...e):typeof e=="object"?Object.keys(e).map((s,a)=>e[a]||e[s]&&s||null).filter(s=>s!==null).join(" "):e).filter(e=>!!e).join(" ");var h=(t,e)=>i({[`${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"}),C=(t,e)=>{let{valid:s,invalid:a,hover:p,focus:m,checked:r,active:L,selected:d,disabled:u,indeterminate:N,loading:b,empty:f,readonly:x,highlighted:K,...O}=e;return i({"k-valid":s,"k-invalid":a,"k-hover":p,"k-focus":m,"k-checked":r,"k-active":L,"k-selected":d,"k-disabled":u,"k-indeterminate":N&&!r,"k-loading":b,"k-empty":f,"k-readonly":x,"k-highlighted":K},Object.keys(O).reduce((M,v)=>(v.startsWith("k-")?M[v]=O[v]:M[`k-${v}`]=O[v],M),{}))};function gt(t,e){if(!e)return{};let s=Array.isArray(e)?e:[e];return Object.fromEntries(s.map(a=>[`k-${a}`,!0]))}var o={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},k={small:"small",medium:"medium",large:"large",full:"full"},R={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},n={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},l={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"};import{Fragment as qt,jsx as It}from"react/jsx-runtime";var rt="k-font-icon",Vt=[],Jt={size:[o.xsmall,o.small,o.medium,o.large,o.xlarge,o.xxlarge,o.xxxlarge],themeColor:[n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.light,n.dark]},Wt={},V=t=>{let{size:e,themeColor:s,icon:a,rotate:p,flip:m,...r}=t;return a?It("span",{...r,className:i(t.className,rt,h(rt,{size:e}),{[`k-i-${a}`]:a,[`k-color-${s}`]:s,[`k-rotate-${p}`]:p,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"})}):It(qt,{})};V.states=Vt;V.options=Jt;V.className=rt;V.defaultOptions=Wt;var Mt=V;import{Fragment as Zt,jsx as Z}from"react/jsx-runtime";var at="k-svg-icon",Qt=[],Yt={size:[o.xsmall,o.small,o.medium,o.large,o.xlarge,o.xxlarge,o.xxxlarge],themeColor:[n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.light,n.dark]},yt={viewBox:"0 0 24 24"},J=t=>{let{size:e,themeColor:s,rotate:a,flip:p,viewBox:m=yt.viewBox,icon:r,...L}=t;if(!r)return Z(Zt,{});r==="none"&&{...L,className:i(t.className,at,"k-none")};let d=typeof r=="object"&&r.name&&r.name;return Z("span",{...L,className:i(t.className,at,h("k-icon",{size:e}),{[`k-svg-i-${d}`]:d,[`k-color-${s}`]:s,[`k-rotate-${a}`]:a,"k-flip-h":p==="h"||p==="both","k-flip-v":p==="v"||p==="both"}),children:Z("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof r=="object"?r.viewBox:m,dangerouslySetInnerHTML:typeof r=="object"?{__html:r.content}:void 0,children:r?void 0:t.children})})};J.states=Qt;J.options=Yt;J.className=at;J.defaultOptions=yt;var lt=J;import*as mt from"@progress/kendo-svg-icons";var vt="icon",Et="icons";import{Fragment as At,jsx as W}from"react/jsx-runtime";var j="k-icon",jt=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),te=[],ee={size:[o.xsmall,o.small,o.medium,o.large,o.xlarge,o.xxlarge,o.xxxlarge],themeColor:[n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.light,n.dark]},pt={viewBox:"0 0 24 24",type:"svg"},y=t=>{let{size:e,themeColor:s,icon:a,type:p=pt.type,rotate:m,flip:r,viewBox:L=pt.viewBox,...d}=t;if(!a)return W(At,{});if(p==="svg"){if(a==="none")return W(lt,{...d,className:i(t.className,j),icon:a,size:e});let u=mt[a]?a:jt(`${a}-icon`);return mt[u]?W(lt,{...d,className:i(t.className,j),icon:mt[u],size:e,themeColor:s,rotate:m,flip:r,viewBox:L}):W(At,{})}return W(Mt,{...d,className:i(t.className,j),icon:a,size:e,themeColor:s,rotate:m,flip:r})};y.states=te;y.options=ee;y.defaultOptions=pt;y.className=j;y.moduleName=vt;y.folderName=Et;var ct="button",Ot=ct;import{Fragment as ne,jsx as q,jsxs as St}from"react/jsx-runtime";var Q="k-button",oe=["icon-button"],se=[l.hover,l.focus,l.active,l.selected,l.disabled,l.generating],ie={size:[o.small,o.medium,o.large],rounded:[k.small,k.medium,k.large,k.full],fillMode:[R.solid,R.flat,R.outline,R.clear,R.link],themeColor:[n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.light,n.dark,n.inverse]},D={size:o.medium,rounded:k.medium,fillMode:R.solid,themeColor:n.base,showArrow:!1,arrowIconName:"caret-alt-down"},g=t=>{let{size:e=D.size,rounded:s=D.rounded,fillMode:a=D.fillMode,themeColor:p=D.themeColor,showArrow:m=D.showArrow,arrowIconName:r=D.arrowIconName,variant:L,hover:d,focus:u,active:N,selected:b,disabled:f,icon:x,text:K,iconClassName:O,...M}=t,v=x!==void 0,Ft=t.children!==void 0;return St("button",{...M,className:i(t.className,Q,gt(Q,L),h(Q,{size:e,rounded:s,fillMode:a,themeColor:p}),C(Q,{hover:d,focus:u,active:N,disabled:f,selected:b}),{"k-icon-button":!K&&!Ft&&v}),children:[x&&q(y,{className:i(O,"k-button-icon"),icon:x}),K?St(ne,{children:[K&&q("span",{className:"k-button-text",children:K}),t.children]}):t.children&&q("span",{className:"k-button-text",children:t.children}),m&&q("span",{className:"k-menu-button-arrow k-button-arrow",children:q(y,{icon:r})})]})};g.states=se;g.options=ie;g.variants=oe;g.className=Q;g.defaultOptions=D;g.moduleName=ct;g.folderName=Ot;import{jsx as Eo}from"react/jsx-runtime";import{jsx as To}from"react/jsx-runtime";import{jsx as Ho}from"react/jsx-runtime";import{jsx as ae}from"react/jsx-runtime";var re="k-no-data",Y=t=>ae("span",{className:i(re,t.className),children:t.children});var S="list",z=S;import{jsx as $,jsxs as Tt}from"react/jsx-runtime";var dt="k-list",le=[],me={size:[o.small,o.medium,o.large]},Kt={size:o.medium},I=t=>{let{size:e=Kt.size,virtualization:s,children:a,optionLabel:p,customValue:m,screenReaders:r,...L}=t,d,u,N,b,f=[];return a?a.map((x,K)=>{x.type===E?(x.props.root===!0?(d=x.props.label,x.props.children.map((O,M)=>{f.push($(c,{...O.props},`optChild-${M}-${new Date().getTime()}`))})):x.props.children.forEach((O,M)=>{let v="";M===0&&(v=x.props.label),f.push($(c,{className:M===0?"k-first":"",...O.props,groupLabel:v},`groupLabel-${M}-${new Date().getTime()}`))}),u=$(E,{label:d,virtualization:s,children:f})):x.type===c&&(f.push($(c,{...x.props},`${x.type}-${K}`)),N=$(U,{virtualization:s,children:f}),r&&(b=Tt(Y,{className:"k-sr-only",children:[f.length," items found."]})))}):b=$(Y,{children:"No data found."}),Tt("div",{...L,className:i(t.className,dt,h(dt,{size:e}),{"k-virtual-list":s}),children:[p,m,u,N,b]})};I.states=le;I.options=me;I.className=dt;I.defaultOptions=Kt;I.moduleName=S;I.folderName=z;import{jsx as ue}from"react/jsx-runtime";var zt="k-list-container",pe=[],ce={},de={},X=t=>{let{...e}=t;return ue("div",{...e,className:i(t.className,zt),children:t.children})};X.states=pe;X.options=ce;X.className=zt;X.defaultOptions=de;X.moduleName=S;X.folderName=z;import{jsx as G,jsxs as xe}from"react/jsx-runtime";var ut="k-list",Le=[],fe={size:[o.small,o.medium,o.large]},_t={size:o.medium},T=t=>{let{size:e=_t.size,virtualization:s,children:a,...p}=t,m,r,L,d=[];return a?a.map((u,N)=>{u.type===E?(u.props.root===!0?(m=u.props.label,u.props.children.map((b,f)=>{d.push(G(c,{...b.props},`optChild-${f}-${new Date().getTime()}`))})):(d.push(G(Ht,{...u.props,children:u.props.label},`listChild-${N}`)),u.props.children.map((b,f)=>{d.push(G(c,{...b.props},`fwOptChild-${f}-${new Date().getTime()}`))})),r=G(E,{label:m,virtualization:s,children:d})):u.type===c&&(d.push(G(c,{...u.props},`${u.type}-${N}`)),L=G(U,{virtualization:s,children:d}))}):L=G(Y,{children:"No data found."}),xe("div",{...p,className:i(t.className,ut,h(ut,{size:e}),{"k-virtual-list":s}),children:[r,L]})};T.states=Le;T.options=fe;T.className=ut;T.defaultOptions=_t;T.moduleName=S;T.folderName=z;var w="checkbox",F=w;import{jsx as Bt}from"react/jsx-runtime";var tt="k-checkbox",be=[l.hover,l.focus,l.valid,l.invalid,l.required,l.disabled,l.checked,l.indeterminate],he={size:[o.small,o.medium,o.large],rounded:[k.small,k.medium,k.large,k.full]},Lt={size:o.medium,rounded:k.medium},A=t=>{let{id:e,checked:s,indeterminate:a,hover:p,focus:m,disabled:r,invalid:L,valid:d,required:u,size:N=Lt.size,rounded:b=Lt.rounded,...f}=t;return Bt("span",{className:"k-checkbox-wrap",children:Bt("input",{...f,id:e,type:"checkbox",defaultChecked:s,required:u,className:i(t.className,tt,h(tt,{size:N,rounded:b}),C(tt,{hover:p,focus:m,disabled:r,invalid:L,valid:d,indeterminate:a,checked:s}))})})};A.states=be;A.options=he;A.className=tt;A.defaultOptions=Lt;A.moduleName=w;A.folderName=F;import{jsx as ke}from"react/jsx-runtime";var Rt="k-checkbox-list",Ne=[],Ce={},Dt={layout:"vertical"},_=t=>{let{layout:e=Dt.layout,...s}=t;return ke("ul",{...s,className:i(t.className,Rt,{[`k-list-${e}`]:e}),children:t.children})};_.states=Ne;_.options=Ce;_.className=Rt;_.defaultOptions=Dt;_.moduleName=w;_.folderName=F;import{jsx as ye}from"react/jsx-runtime";var Gt="k-checkbox-list-item",ge=[],Ie={},Me={},H=t=>{let{...e}=t;return ye("li",{...e,className:i(t.className,Gt),children:t.children})};H.states=ge;H.options=Ie;H.className=Gt;H.defaultOptions=Me;H.moduleName=w;H.folderName=F;import{Fragment as vs,jsx as ys,jsxs as Es}from"react/jsx-runtime";import{Fragment as Ks,jsx as Ts,jsxs as zs}from"react/jsx-runtime";import{Fragment as Ds,jsx as Rs,jsxs as Gs}from"react/jsx-runtime";import{Fragment as Xs,jsx as Us,jsxs as Fs}from"react/jsx-runtime";import{jsx as qs}from"react/jsx-runtime";import{jsx as js}from"react/jsx-runtime";import{jsx as et,jsxs as Oe}from"react/jsx-runtime";var xt="k-list-item",ve=[l.hover,l.focus,l.selected,l.disabled],Ee={},Ae={},c=t=>{let{text:e,groupLabel:s,group:a,showIcon:p,iconName:m,showCheckbox:r,checked:L,hover:d,focus:u,selected:N,disabled:b,...f}=t,x=e||t.children;return Oe("li",{...f,className:i(t.className,a?"k-list-group-item":xt,C(xt,{hover:d,focus:u,disabled:b,selected:N})),children:[r&&et(A,{checked:L}),p&&et(y,{icon:m}),et("span",{className:"k-list-item-text",children:x}),s&&s!==""&&et("div",{className:"k-list-item-group-label",children:s})]})};c.states=ve;c.options=Ee;c.className=xt;c.defaultOptions=Ae;c.moduleName=S;c.folderName=z;import{jsx as bt,jsxs as Te}from"react/jsx-runtime";var Se="k-list-content",U=t=>{let{virtualization:e,...s}=t;return Te("div",{...s,className:i(Se,t.className),children:[bt("ul",{className:i("k-list-ul"),children:t.children}),e&&bt("div",{className:"k-height-container",children:bt("div",{})})]})};import{jsx as wt}from"react/jsx-runtime";var Ke="k-list-group-sticky-header",Pt=t=>wt("div",{className:i(Ke,t.className),children:wt("div",{className:"k-list-header-text",children:t.children})});import{Fragment as ze,jsx as $t,jsxs as _e}from"react/jsx-runtime";var E=t=>{let{virtualization:e,label:s}=t;return _e(ze,{children:[s&&$t(Pt,{children:s}),t.children&&$t(U,{virtualization:e,children:t.children})]})};import{jsx as Ut}from"react/jsx-runtime";var He="k-list-group-item",Ht=t=>Ut("li",{className:i(He,t.className),children:Ut("span",{className:"k-list-item-text",children:t.children})});import{jsx as Ge}from"react/jsx-runtime";var ht="k-list-optionlabel",Be=[l.hover,l.focus,l.selected,l.disabled],Re={},De={},ot=t=>{let{text:e,hover:s,focus:a,selected:p,disabled:m,...r}=t;return Ge("div",{...r,className:i(ht,C(ht,{hover:s,focus:a,selected:p,disabled:m})),children:e})};ot.states=Be;ot.options=Re;ot.className=ht;ot.defaultOptions=De;import{jsx as Ue}from"react/jsx-runtime";var Nt="k-list-custom-value",we=[l.hover,l.focus,l.selected,l.disabled],Pe={},$e={},st=t=>{let{text:e,hover:s,focus:a,selected:p,disabled:m,...r}=t;return Ue("div",{...r,className:i(Nt,C(Nt,{hover:s,focus:a,selected:p,disabled:m})),children:e})};st.states=we;st.options=Pe;st.className=Nt;st.defaultOptions=$e;import{jsx as Ri}from"react/jsx-runtime";import{jsx as Pi}from"react/jsx-runtime";import{jsx as Fi,jsxs as Vi}from"react/jsx-runtime";import{jsx as Qi,jsxs as Yi}from"react/jsx-runtime";import{jsx as en}from"react/jsx-runtime";import{jsx as rn,jsxs as an}from"react/jsx-runtime";import{jsx as cn,jsxs as dn}from"react/jsx-runtime";var Ct="listbox",Xt=Ct;import{jsx as it,jsxs as Ve}from"react/jsx-runtime";var nt="k-listbox",Xe=[l.disabled],Fe={size:[o.small,o.medium,o.large]},kt={size:o.medium,actionsPosition:"left"},B=t=>{let{size:e=kt.size,disabled:s,children:a,actionsPosition:p=kt.actionsPosition,actions:m,dir:r,...L}=t;return Ve("div",{...L,dir:r,className:i(t.className,nt,h(nt,{size:e}),C(nt,{disabled:s}),{[`k-listbox-actions-${p}`]:p}),children:[m&&it("div",{className:"k-listbox-actions",children:m.map(d=>it(g,{icon:{left:r!=="rtl"?"caret-alt-left":"caret-alt-right",right:r!=="rtl"?"caret-alt-right":"caret-alt-left",to:r!=="rtl"?"caret-double-alt-right":"caret-double-alt-left",from:r!=="rtl"?"caret-double-alt-left":"caret-double-alt-right",up:"caret-alt-up",down:"caret-alt-down",x:"x"}[d],size:e},d))}),it("div",{className:i("k-list-scroller","k-selectable"),children:it(I,{size:e,children:a})})]})};B.states=Xe;B.options=Fe;B.className=nt;B.defaultOptions=kt;B.moduleName=Ct;B.folderName=Xt;import{jsx as P}from"react/jsx-runtime";var Xn=t=>P(B,{actions:["up","down","left","right","to","from","x"],children:[P(c,{children:"List item 1"},"ListItem1"),P(c,{children:"List item 2"},"ListItem2"),P(c,{children:"List item 3"},"ListItem3"),P(c,{children:"List item 4"},"ListItem4"),P(c,{children:"List item 5"},"ListItem5"),P(c,{children:"List item 6"},"ListItem6")],...t});export{Xn as ListBoxNormal};