@progress/kendo-themes-html/dist/esm/upload/templates/upload-batch.mjs

A collection of HTML helpers used for developing Kendo UI themes

var n=(...o)=>o.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?n(...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 M=(o,e)=>n({[`${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)=>n({"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 l={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},z={small:"small",medium:"medium",large:"large",full:"full"},y={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"},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"};import{jsx as be}from"react/jsx-runtime";var O="k-actions",Ne=[],ye={},Z={alignment:"start",orientation:"horizontal"},C=o=>{let{alignment:e=Z.alignment,orientation:s=Z.orientation,...a}=o;return be("div",{...a,className:n(O,{[`${O}-${e}`]:e,[`${O}-${s}`]:s},o.className),children:o.children})};C.states=Ne;C.options=ye;C.className=O;C.defaultOptions=Z;var ne=C;import{Fragment as ze,jsx as re}from"react/jsx-runtime";var J="k-icon k-font-icon",Be=[],Se={size:[l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},Me={},I=o=>{let{size:e,themeColor:s,icon:a,rotate:r,flip:c,...i}=o;return a?re("span",{...i,className:n(o.className,J,M(J,{size:e}),{[`k-i-${a}`]:a,[`k-color-${s}`]:s,[`k-rotate-${r}`]:r,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"})}):re(ze,{})};I.states=Be;I.options=Se;I.className=J;I.defaultOptions=Me;var le=I;import{Fragment as Ae,jsx as T}from"react/jsx-runtime";var Q="k-icon k-svg-icon",Ce=[],Ie={size:[l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},ie={viewBox:"0 0 24 24"},A=o=>{let{size:e,themeColor:s,rotate:a,flip:r,viewBox:c=ie.viewBox,icon:i,...f}=o;if(!i)return T(Ae,{});i==="none"&&{...f,className:n(o.className,Q,"k-none")};let m=typeof i=="object"&&i.name&&i.name;return T("span",{...f,className:n(o.className,Q,M("k-icon",{size:e}),{[`k-svg-i-${m}`]:m,[`k-color-${s}`]:s,[`k-rotate-${a}`]:a,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),children:T("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof i=="object"?i.viewBox:c,dangerouslySetInnerHTML:typeof i=="object"?{__html:i.content}:void 0,children:i?void 0:o.children})})};A.states=Ce;A.options=Ie;A.className=Q;A.defaultOptions=ie;var X=A;import*as ce from"@progress/kendo-svg-icons";import{Fragment as de,jsx as U}from"react/jsx-runtime";var Ue=o=>o.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Le=[],Pe={size:[l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.light,t.dark]},Y={viewBox:"0 0 24 24",type:"svg"},u=o=>{let{size:e,themeColor:s,icon:a,type:r=Y.type,rotate:c,flip:i,viewBox:f=Y.viewBox,...m}=o;if(!a)return U(de,{});if(r==="svg"){if(a==="none")return U(X,{...m,icon:a,size:e});let h=Ue(`${a}-icon`);return ce[h]?U(X,{...m,icon:ce[h],size:e,themeColor:s,rotate:c,flip:i,viewBox:f}):U(de,{})}return U(le,{...m,icon:a,size:e,themeColor:s,rotate:c,flip:i})};u.states=Le;u.options=Pe;u.defaultOptions=Y;import{Fragment as Oe,jsx as L,jsxs as pe}from"react/jsx-runtime";var _="k-button",we=[d.hover,d.focus,d.active,d.selected,d.disabled],Ke={size:[l.small,l.medium,l.large],rounded:[z.small,z.medium,z.large,z.full],fillMode:[y.solid,y.flat,y.outline,y.clear,y.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:l.medium,rounded:z.medium,fillMode:y.solid,themeColor:t.base,showArrow:!1,arrowIconName:"caret-alt-down"},p=o=>{let{size:e=b.size,rounded:s=b.rounded,fillMode:a=b.fillMode,themeColor:r=b.themeColor,showArrow:c=b.showArrow,arrowIconName:i=b.arrowIconName,hover:f,focus:m,active:h,selected:G,disabled:W,icon:q,text:K,iconClassName:he,...xe}=o,ke=q!==void 0,ve=o.children!==void 0;return pe("button",{...xe,className:n(o.className,_,M(_,{size:e,rounded:s,fillMode:a,themeColor:r}),x(_,{hover:f,focus:m,active:h,disabled:W,selected:G}),{"k-icon-button":!K&&!ve&&ke}),children:[q&&L(u,{className:n(he,"k-button-icon"),icon:q}),K?pe(Oe,{children:[K&&L("span",{className:"k-button-text",children:K}),o.children]}):o.children&&L("span",{className:"k-button-text",children:o.children}),c&&L("span",{className:"k-menu-button-arrow k-button-arrow",children:L(u,{icon:i})})]})};p.states=we;p.options=Ke;p.className=_;p.defaultOptions=b;import{jsx as Uo}from"react/jsx-runtime";import{jsx as Ko}from"react/jsx-runtime";import{jsx as $o}from"react/jsx-runtime";import{Fragment as P,jsx as v,jsxs as w}from"react/jsx-runtime";var j="k-upload-dropzone",Te=[d.hover],$=o=>{let{hover:e,status:s,...a}=o,r=v(P,{});switch(s){case"uploading":r=w(P,{children:[v(u,{icon:"upload"}),"Uploading..."]});break;case"done":r=w(P,{children:[v(u,{icon:"check"}),"Done"]});break;case"failed":r=w(P,{children:[v(u,{icon:"exclamation-circle"}),"Done"]});break;default:r=v(P,{});break}return w("div",{...a,className:n(o.className,j,"k-dropzone",x(j,{hover:e})),children:[w("div",{className:"k-upload-button-wrap",children:[v(p,{className:"k-upload-button",children:"Select files..."}),v("input",{id:"upload-input",className:"k-hidden"})]}),v("span",{className:n("k-dropzone-hint",{"k-hidden":s!=="upload"}),children:"Drop files here to upload"}),s!=="upload"&&v("span",{className:"k-upload-status",children:r})]})};$.states=Te;$.className=j;import{jsx as F,jsxs as me}from"react/jsx-runtime";var ee="k-upload",_e=[d.hover,d.disabled],$e={},ue={actionsLayout:"end"},N=o=>{let{async:e,empty:s,actions:a,actionsLayout:r=ue.actionsLayout,hover:c,status:i,disabled:f,...m}=o;return me("div",{...m,className:n(o.className,ee,x(ee,{disabled:f}),{"k-upload-async":e,"k-upload-empty":s}),children:[F($,{status:i,hover:c}),o.children&&F("ul",{className:"k-upload-files",children:o.children}),a&&o.children&&me(ne,{alignment:r,orientation:"horizontal",children:[F(p,{className:"k-clear-selected",children:"Clear"}),F(p,{themeColor:"primary",className:"k-upload-selected",children:"Upload"})]})]})};N.states=_e;N.options=$e;N.className=ee;N.defaultOptions=ue;import{jsx as te,jsxs as oe}from"react/jsx-runtime";var g="k-progressbar",Fe=[d.disabled,d.indeterminate],Ee={},B={indeterminate:!1,label:!0,labelPosition:"start",orientation:"horizontal",reverse:!1,value:"0"},S=o=>{let{disabled:e,height:s,indeterminate:a=B.indeterminate,label:r=B.label,labelPosition:c=B.labelPosition,orientation:i=B.orientation,reverse:f=B.reverse,value:m=B.value,width:h,style:G,...W}=o;return oe("div",{...W,className:n(o.className,g,x(g,{disabled:e}),{[`${g}-${i}`]:i,[`${g}-indeterminate`]:a,[`${g}-reverse`]:f}),style:{...G,"--kendo-progressbar-value":m,[i==="horizontal"?"height":"width"]:i==="horizontal"?s:h},children:[te("span",{className:n("k-progress-status-wrap",{[`k-progress-${c}`]:c&&!a}),children:r&&oe("span",{className:"k-progress-status",children:[m,"%"]})}),!a&&te("div",{className:"k-progressbar-value k-selected",children:te("span",{className:n("k-progress-status-wrap",{[`k-progress-${c}`]:c}),children:r&&oe("span",{className:"k-progress-status",children:[o.value,"%"]})})})]})};S.states=Fe;S.options=Ee;S.className=g;S.defaultOptions=B;import{jsx as se}from"react/jsx-runtime";var fe="k-chunk-progressbar",He=(o,e)=>e<=o-1,Re=[d.disabled,d.indeterminate],De={},E={chunkCount:5,orientation:"horizontal",progress:0},H=o=>{let{disabled:e,chunkCount:s=E.chunkCount,indeterminate:a,orientation:r=E.orientation,progress:c=E.progress,reverse:i,...f}=o;return se("div",{...f,className:n(o.className,g,fe,x(g,{disabled:e}),{[`${g}-${r}`]:r,[`${g}-indeterminate`]:a,[`${g}-reverse`]:i}),children:se("ul",{className:"k-progressbar-chunks k-reset",children:[...Array(s)].map((m,h)=>se("li",{className:n("k-progressbar-chunk",{"k-first":h===0,"k-last":h===[...Array(s)].length-1,"k-selected":He(c,h)})},h))})})};H.states=Re;H.options=De;H.className=fe;H.defaultOptions=E;import{jsx as mt}from"react/jsx-runtime";import{jsx as xt}from"react/jsx-runtime";import{jsx as ae,jsxs as Ge}from"react/jsx-runtime";var Ve="k-file-info",R=o=>{let{name:e,size:s,validationMsg:a,...r}=o;return Ge("div",{...r,className:n(o.className,Ve),children:[e&&ae("span",{className:"k-file-name",children:e}),s&&ae("span",{className:"k-file-size",children:s}),a&&ae("span",{className:"k-file-validation-message",children:a})]})};import{Fragment as Ot,jsx as wt,jsxs as Kt}from"react/jsx-runtime";import{Fragment as qe,jsx as k,jsxs as D}from"react/jsx-runtime";var We="k-file",ge=o=>{let{status:e,progress:s,validationMsg:a,fileSummary:r,...c}=o;return k("li",{...c,className:n(o.className,We,{[`k-file-${e}`]:e}),children:D("div",{className:"k-file-multiple",children:[k(S,{className:n({"k-hidden":e!=="progress"}),value:s,label:!1}),k("span",{className:"k-file-icon-wrapper",children:k(u,{className:"k-file-icon",icon:"copy",size:"xxlarge"})}),D("div",{className:"k-multiple-files-wrapper",children:[o.children,r&&k("span",{className:n("k-file-summary",{"k-hidden":e!=="progress"}),children:r}),a&&k("span",{className:"k-file-validation-message",children:a})]}),k("div",{className:"k-upload-actions",children:e==="progress"?D(qe,{children:[D("span",{className:"k-upload-pct",children:[s,"%"]}),k(p,{icon:"pause-sm",fillMode:"flat",className:"k-upload-action"}),k(p,{icon:"cancel",fillMode:"flat",className:"k-upload-action"})]}):k(p,{icon:"x",fillMode:"flat",className:"k-upload-action"})})]})})};import{Fragment as Wt,jsx as Gt,jsxs as qt}from"react/jsx-runtime";import{jsx as Xt}from"react/jsx-runtime";import{Fragment as ts,jsx as os,jsxs as ss}from"react/jsx-runtime";import{Fragment as Qe,jsx as V,jsxs as Je}from"react/jsx-runtime";var hs=o=>V(N,{async:!0,children:V(Qe,{children:Je(ge,{fileSummary:"Total: 2 files, 157.66 KB",children:[V(R,{name:"Video1_File_with_Very_Very_Very_Very_Long_Name.png",size:"51.23 KB"}),V(R,{name:"Image2.jpg",size:"106.43 KB"})]})}),...o});export{hs as UploadBatch};