UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 9.39 kB
var i=(...o)=>o.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?i(...e):typeof e=="object"?Object.keys(e).map((n,s)=>e[s]||e[n]&&n||null).filter(n=>n!==null).join(" "):e).filter(e=>!!e).join(" ");var C=(o,e)=>i({[`${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"}),S=(o,e)=>{let{valid:n,invalid:s,hover:l,focus:m,checked:r,active:d,selected:c,disabled:u,indeterminate:O,loading:E,empty:G,readonly:P,highlighted:y,...L}=e;return i({"k-valid":n,"k-invalid":s,"k-hover":l,"k-focus":m,"k-checked":r,"k-active":d,"k-selected":c,"k-disabled":u,"k-indeterminate":O&&!r,"k-loading":E,"k-empty":G,"k-readonly":P,"k-highlighted":y},Object.keys(L).reduce((R,k)=>(k.startsWith("k-")?R[k]=L[k]:R[`k-${k}`]=L[k],R),{}))};function oe(o,e){if(!e)return{};let n=Array.isArray(e)?e:[e];return Object.fromEntries(n.map(s=>[`k-${s}`,!0]))}var a={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},B={small:"small",medium:"medium",large:"large",full:"full"},v={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},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"},f={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 he,jsx as te}from"react/jsx-runtime";var V="k-font-icon",ue=[],fe={size:[a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},ge={},I=o=>{let{size:e,themeColor:n,icon:s,rotate:l,flip:m,...r}=o;return s?te("span",{...r,className:i(o.className,V,C(V,{size:e}),{[`k-i-${s}`]:s,[`k-color-${n}`]:n,[`k-rotate-${l}`]:l,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"})}):te(he,{})};I.states=ue;I.options=fe;I.className=V;I.defaultOptions=ge;var se=I;import{Fragment as ke,jsx as $}from"react/jsx-runtime";var q="k-svg-icon",xe=[],Ne={size:[a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},ne={viewBox:"0 0 24 24"},T=o=>{let{size:e,themeColor:n,rotate:s,flip:l,viewBox:m=ne.viewBox,icon:r,...d}=o;if(!r)return $(ke,{});r==="none"&&{...d,className:i(o.className,q,"k-none")};let c=typeof r=="object"&&r.name&&r.name;return $("span",{...d,className:i(o.className,q,C("k-icon",{size:e}),{[`k-svg-i-${c}`]:c,[`k-color-${n}`]:n,[`k-rotate-${s}`]:s,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"}),children:$("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:o.children})})};T.states=xe;T.options=Ne;T.className=q;T.defaultOptions=ne;var W=T;import*as J from"@progress/kendo-svg-icons";var re="icon",ae="icons";import{Fragment as ie,jsx as z}from"react/jsx-runtime";var F="k-icon",ve=o=>o.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),be=[],Me={size:[a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},Q={viewBox:"0 0 24 24",type:"svg"},h=o=>{let{size:e,themeColor:n,icon:s,type:l=Q.type,rotate:m,flip:r,viewBox:d=Q.viewBox,...c}=o;if(!s)return z(ie,{});if(l==="svg"){if(s==="none")return z(W,{...c,className:i(o.className,F),icon:s,size:e});let u=J[s]?s:ve(`${s}-icon`);return J[u]?z(W,{...c,className:i(o.className,F),icon:J[u],size:e,themeColor:n,rotate:m,flip:r,viewBox:d}):z(ie,{})}return z(se,{...c,className:i(o.className,F),icon:s,size:e,themeColor:n,rotate:m,flip:r})};h.states=be;h.options=Me;h.defaultOptions=Q;h.className=F;h.moduleName=re;h.folderName=ae;var X="button",le=X;import{Fragment as Be,jsx as _,jsxs as me}from"react/jsx-runtime";var w="k-button",ye=["icon-button"],Ce=[f.hover,f.focus,f.active,f.selected,f.disabled,f.generating],Se={size:[a.small,a.medium,a.large],rounded:[B.small,B.medium,B.large,B.full],fillMode:[v.solid,v.flat,v.outline,v.clear,v.link],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark,t.inverse]},b={size:a.medium,rounded:B.medium,fillMode:v.solid,themeColor:t.base,showArrow:!1,arrowIconName:"caret-alt-down"},p=o=>{let{size:e=b.size,rounded:n=b.rounded,fillMode:s=b.fillMode,themeColor:l=b.themeColor,showArrow:m=b.showArrow,arrowIconName:r=b.arrowIconName,variant:d,hover:c,focus:u,active:O,selected:E,disabled:G,icon:P,text:y,iconClassName:L,...R}=o,k=P!==void 0,pe=o.children!==void 0;return me("button",{...R,className:i(o.className,w,oe(w,d),C(w,{size:e,rounded:n,fillMode:s,themeColor:l}),S(w,{hover:c,focus:u,active:O,disabled:G,selected:E}),{"k-icon-button":!y&&!pe&&k}),children:[P&&_(h,{className:i(L,"k-button-icon"),icon:P}),y?me(Be,{children:[y&&_("span",{className:"k-button-text",children:y}),o.children]}):o.children&&_("span",{className:"k-button-text",children:o.children}),m&&_("span",{className:"k-menu-button-arrow k-button-arrow",children:_(h,{icon:r})})]})};p.states=Ce;p.options=Se;p.variants=ye;p.className=w;p.defaultOptions=b;p.moduleName=X;p.folderName=le;import{jsx as ho}from"react/jsx-runtime";import{jsx as vo}from"react/jsx-runtime";import{jsx as Co}from"react/jsx-runtime";var K="progressbar",H=K;import{jsx as Z,jsxs as Y}from"react/jsx-runtime";var g="k-progressbar",Ae=[f.disabled,f.indeterminate],Oe={},M={indeterminate:!1,label:!0,labelPosition:"start",orientation:"horizontal",reverse:!1,value:"0"},N=o=>{let{disabled:e,height:n,indeterminate:s=M.indeterminate,label:l=M.label,labelPosition:m=M.labelPosition,orientation:r=M.orientation,reverse:d=M.reverse,value:c=M.value,width:u,style:O,...E}=o;return Y("div",{...E,className:i(o.className,g,S(g,{disabled:e}),{[`${g}-${r}`]:r,[`${g}-indeterminate`]:s,[`${g}-reverse`]:d}),style:{...O,"--kendo-progressbar-value":c,[r==="horizontal"?"height":"width"]:r==="horizontal"?n:u},children:[Z("span",{className:i("k-progress-status-wrap",{[`k-progress-${m}`]:m&&!s}),children:l&&Y("span",{className:"k-progress-status",children:[c,"%"]})}),!s&&Z("div",{className:"k-progressbar-value k-selected",children:Z("span",{className:i("k-progress-status-wrap",{[`k-progress-${m}`]:m}),children:l&&Y("span",{className:"k-progress-status",children:[o.value,"%"]})})})]})};N.states=Ae;N.options=Oe;N.className=g;N.defaultOptions=M;N.moduleName=K;N.folderName=H;import{jsx as j}from"react/jsx-runtime";var ce="k-chunk-progressbar",Ee=(o,e)=>e<=o-1,Pe=[f.disabled,f.indeterminate],Le={},U={chunkCount:5,orientation:"horizontal",progress:0},A=o=>{let{disabled:e,chunkCount:n=U.chunkCount,indeterminate:s,orientation:l=U.orientation,progress:m=U.progress,reverse:r,...d}=o;return j("div",{...d,className:i(o.className,g,ce,S(g,{disabled:e}),{[`${g}-${l}`]:l,[`${g}-indeterminate`]:s,[`${g}-reverse`]:r}),children:j("ul",{className:"k-progressbar-chunks k-reset",children:[...Array(n)].map((c,u)=>j("li",{className:i("k-progressbar-chunk",{"k-first":u===0,"k-last":u===[...Array(n)].length-1,"k-selected":Ee(m,u)})},u))})})};A.states=Pe;A.options=Le;A.className=ce;A.defaultOptions=U;A.moduleName=K;A.folderName=H;import{jsx as Go}from"react/jsx-runtime";import{jsx as Qo}from"react/jsx-runtime";import{jsx as ee,jsxs as Ie}from"react/jsx-runtime";var Re="k-file-info",de=o=>{let{name:e,size:n,validationMsg:s,...l}=o;return Ie("div",{...l,className:i(o.className,Re),children:[e&&ee("span",{className:"k-file-name",children:e}),n&&ee("span",{className:"k-file-size",children:n}),s&&ee("span",{className:"k-file-validation-message",children:s})]})};import{Fragment as ze,jsx as x,jsxs as D}from"react/jsx-runtime";var Te="k-file",ct=o=>{let{status:e,progress:n,name:s,icon:l,size:m,state:r,validationMsg:d,...c}=o;return x("li",{...c,className:i(o.className,Te,{[`k-file-${e}`]:e}),children:D("div",{className:"k-file-single",children:[x(N,{className:i({"k-hidden":e!=="progress"}),value:n,label:!1}),D("span",{className:"k-file-icon-wrapper",children:[x(h,{className:"k-file-icon",icon:l,size:"xxlarge"}),r&&x("span",{className:"k-file-state",children:r})]}),x(de,{name:s,size:m,validationMsg:d}),x("div",{className:"k-upload-actions",children:e==="progress"?D(ze,{children:[D("span",{className:"k-upload-pct",children:[n,"%"]}),x(p,{icon:"pause-sm",fillMode:"flat",className:"k-upload-action"}),x(p,{icon:"cancel",fillMode:"flat",className:"k-upload-action"})]}):x(p,{icon:"x",fillMode:"flat",className:"k-upload-action"})})]})})};export{Te as UPLOADFILE_CLASSNAME,ct as UploadFile};