UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 15.3 kB
var Ee=Object.create;var W=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var Le=Object.getOwnPropertyNames;var ze=Object.getPrototypeOf,_e=Object.prototype.hasOwnProperty;var Ke=(t,e)=>{for(var o in e)W(t,o,{get:e[o],enumerable:!0})},le=(t,e,o,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of Le(e))!_e.call(t,r)&&r!==o&&W(t,r,{get:()=>e[r],enumerable:!(a=Ie(e,r))||a.enumerable});return t};var $e=(t,e,o)=>(o=t!=null?Ee(ze(t)):{},le(e||!t||!t.__esModule?W(o,"default",{value:t,enumerable:!0}):o,t)),De=t=>le(W({},"__esModule",{value:!0}),t);var ft={};Ke(ft,{UPLOADFILEMULTIPLE_CLASSNAME:()=>Pe,UploadFileMultiple:()=>pt});module.exports=De(ft);var l=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?l(...e):typeof e=="object"?Object.keys(e).map((o,a)=>e[a]||e[o]&&o||null).filter(o=>o!==null).join(" "):e).filter(e=>!!e).join(" ");var A=(t,e)=>l({[`${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.themeColor}`]:e.themeColor},{"k-rounded-sm":e.rounded==="small","k-rounded-md":e.rounded==="medium","k-rounded-lg":e.rounded==="large","k-rounded-full":e.rounded==="full","k-rounded-none":e.rounded==="none"}),z=(t,e)=>{let{valid:o,invalid:a,hover:r,focus:i,checked:c,active:d,selected:g,disabled:h,indeterminate:p,loading:C,empty:x,readonly:V,highlighted:ee,...L}=e;return l({"k-valid":o,"k-invalid":a,"k-hover":r,"k-focus":i,"k-checked":c,"k-active":d,"k-selected":g,"k-disabled":h,"k-indeterminate":p&&!c,"k-loading":C,"k-empty":x,"k-readonly":V,"k-highlighted":ee},Object.keys(L).reduce((k,O)=>(O.startsWith("k-")?k[O]=L[O]:k[`k-${O}`]=L[O],k),{}))};function ce(t,e){if(!e)return{};let o=Array.isArray(e)?e:[e];return Object.fromEntries(o.map(a=>[`k-${a}`,!0]))}var s={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},T={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"},R={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},B={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},n={undefined:void 0,inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",inverse:"inverse"},b={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 $=require("react/jsx-runtime"),te="k-font-icon",He=[],Fe={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},Ue={},D=t=>{let{size:e,themeColor:o,icon:a,rotate:r,flip:i,...c}=t;return a?(0,$.jsx)("span",{...c,className:l(t.className,te,A(te,{size:e}),{[`k-i-${a}`]:a,[`k-color-${o}`]:o,[`k-rotate-${r}`]:r,"k-flip-h":i==="h"||i==="both","k-flip-v":i==="v"||i==="both"}),"aria-hidden":"true"}):(0,$.jsx)($.Fragment,{})};D.states=He;D.options=Fe;D.className=te;D.defaultOptions=Ue;var de=D;var w=require("react/jsx-runtime"),oe="k-svg-icon",Ge=[],Ve={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[B.outline,B.solid,B.duotone]},re={viewBox:"0 0 24 24",variant:B.outline},H=t=>{var C,x;let{size:e,themeColor:o,rotate:a,flip:r,viewBox:i=re.viewBox,variant:c=re.variant,icon:d,...g}=t;if(!d)return(0,w.jsx)(w.Fragment,{});if(d==="none")return(0,w.jsx)("span",{...g,className:l(t.className,oe,A("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let h=typeof d=="object"&&d.name&&d.name,p=typeof d=="object"?c&&((C=d.variants)==null?void 0:C[c])||((x=d.variants)==null?void 0:x.outline)||d.content:void 0;return(0,w.jsx)("span",{...g,className:l(t.className,oe,A("k-icon",{size:e}),{[`k-svg-i-${h}`]:h,[`k-color-${o}`]:o,[`k-rotate-${a}`]:a,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),"aria-hidden":"true",children:(0,w.jsx)("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof d=="object"?d.viewBox:i,dangerouslySetInnerHTML:p!==void 0?{__html:p}:void 0,children:d?void 0:t.children})})};H.states=Ge;H.options=Ve;H.className=oe;H.defaultOptions=re;var ne=H;var ae=$e(require("@progress/kendo-svg-icons"));var ue="icon",me="icons";var ge=require("react");var pe=require("react"),fe=(0,pe.createContext)({iconsType:"svg"});var S=require("react/jsx-runtime"),J="k-icon",qe=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),We=[],Je={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[B.outline,B.solid,B.duotone]},Q={viewBox:"0 0 24 24",type:"svg",variant:B.outline},N=t=>{let{iconsType:e}=(0,ge.useContext)(fe),{size:o,themeColor:a,icon:r,type:i=e||Q.type,rotate:c,flip:d,viewBox:g=Q.viewBox,variant:h=Q.variant,...p}=t;if(!r)return(0,S.jsx)(S.Fragment,{});if((e||i)==="svg"){if(r==="none")return(0,S.jsx)(ne,{...p,className:l(t.className,J),icon:r,size:o,variant:h});let x=ae[r]?r:qe(`${r}-icon`);return ae[x]?(0,S.jsx)(ne,{...p,className:l(t.className,J),icon:ae[x],size:o,themeColor:a,rotate:c,flip:d,viewBox:g,variant:h}):(0,S.jsx)(S.Fragment,{})}return(0,S.jsx)(de,{...p,className:l(t.className,J),icon:r,size:o,themeColor:a,rotate:c,flip:d})};N.states=We;N.options=Je;N.defaultOptions=Q;N.className=J;N.moduleName=ue;N.folderName=me;N.ariaSpec={selector:".k-icon, .k-svg-icon",rules:[{selector:".k-icon, .k-svg-icon",attribute:"aria-hidden=true",usage:"Hides the icon element and all its children from assistive technologies."}]};var se="button",be=se;var v=require("react/jsx-runtime"),F="k-button",Qe=["icon-button"],Xe=[b.hover,b.focus,b.active,b.selected,b.disabled,b.generating],Ye={size:[s.undefined,s.xsmall,s.small,s.medium,s.large],rounded:[T.undefined,T.none,T.small,T.medium,T.large,T.full],fillMode:[R.undefined,R.solid,R.flat,R.outline,R.clear,R.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},ie={showArrow:!1,arrowIconName:"chevron-down"},u=t=>{let{as:e="button",size:o,rounded:a,fillMode:r,themeColor:i,showArrow:c=ie.showArrow,arrowIconName:d=ie.arrowIconName,variant:g,hover:h,focus:p,active:C,selected:x,disabled:V,togglable:ee,ariaDisabled:L,icon:k,iconSize:O,text:q,iconClassName:Oe,className:Ae,...Te}=t,Re=k!=null,we=t.children!==void 0;return(0,v.jsxs)(e,{className:l(Ae,F,ce(F,g),A(F,{size:o,rounded:a,fillMode:r,themeColor:i}),z(F,{hover:h,focus:p,active:C,disabled:V||L,selected:x}),{"k-icon-button":!q&&!we&&Re}),"aria-pressed":ee?x?"true":"false":void 0,...Te,"aria-disabled":L?"true":void 0,disabled:V||void 0,children:[typeof k=="string"&&k&&(0,v.jsx)(N,{className:l(Oe,"k-button-icon"),icon:k,size:O}),k&&typeof k!="string"&&(0,v.jsx)(v.Fragment,{children:k}),q?(0,v.jsxs)(v.Fragment,{children:[q&&(0,v.jsx)("span",{className:"k-button-text",children:q}),t.children]}):t.children&&(0,v.jsx)("span",{className:"k-button-text",children:t.children}),c&&(0,v.jsx)("span",{className:"k-menu-button-arrow k-button-arrow",children:(0,v.jsx)(N,{icon:d})})]})};u.states=Xe;u.options=Ye;u.variants=Qe;u.className=F;u.defaultOptions=ie;u.moduleName=se;u.folderName=be;u.ariaSpec={selector:".k-button",rules:[{selector:".k-button",attribute:"role=button or nodeName=button",usage:"The button role is implicit from the native <button> element."},{selector:".k-button",attribute:"aria-label (when icon-only)",usage:"Required for icon-only buttons that have no visible text."},{selector:".k-button",attribute:"aria-pressed (when togglable)",usage:"Indicates the pressed state of a toggle button."},{selector:".k-button",attribute:"disabled (when disabled)",usage:"Rendered when the button is disabled."}]};var he=require("react/jsx-runtime"),ve=t=>(0,he.jsx)(u,{icon:"folder",...t,"aria-label":t["aria-label"]||"Folder",children:void 0});var ke=require("react/jsx-runtime"),xe=t=>(0,ke.jsx)(u,{icon:"folder",children:"Button",...t});var ye=require("react/jsx-runtime"),Ne=t=>(0,ye.jsx)(u,{children:"Button",...t});var X=require("react/jsx-runtime"),Ze=u.options,je=u.states,et={...u.defaultOptions,variant:"text"},tt=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],ot=[],_=t=>{let{variant:e,...o}=t;switch(e){case"icon-only":return(0,X.jsx)(ve,{...o,icon:"star"});case"icon-and-text":return(0,X.jsx)(xe,{...o,icon:"star",children:"Button"});default:return(0,X.jsx)(Ne,{...o,children:"Button"})}};_.options=Ze;_.states=je;_.variants=tt;_.defaultOptions=et;_.modifiers=ot;_.className=u.className;var U="progressbar",Y=U;var P=require("react/jsx-runtime"),y="k-progressbar",rt=[b.disabled,b.indeterminate],nt={orientation:["horizontal","vertical"]},E={indeterminate:!1,label:!0,labelPosition:"start",orientation:"horizontal",reverse:!1,value:"0"},f=t=>{let{disabled:e,height:o,indeterminate:a=E.indeterminate,label:r=E.label,labelPosition:i=E.labelPosition,orientation:c=E.orientation,reverse:d=E.reverse,value:g=E.value,width:h,style:p,ariaLabel:C,...x}=t;return(0,P.jsxs)("div",{...x,className:l(t.className,y,z(y,{disabled:e}),{[`${y}-${c}`]:c,[`${y}-indeterminate`]:a,[`${y}-reverse`]:d}),style:{...p,"--kendo-progressbar-value":g,[c==="horizontal"?"height":"width"]:c==="horizontal"?o:h},role:"progressbar","aria-label":C||"progress","aria-valuenow":a?void 0:Number(g),"aria-valuemin":0,"aria-valuemax":100,children:[(0,P.jsx)("span",{className:l("k-progress-status-wrap",{[`k-progress-${i}`]:i&&!a}),children:r&&(0,P.jsxs)("span",{className:"k-progress-status",children:[g,"%"]})}),!a&&(0,P.jsx)("div",{className:"k-progressbar-value k-selected",children:(0,P.jsx)("span",{className:l("k-progress-status-wrap",{[`k-progress-${i}`]:i}),children:r&&(0,P.jsxs)("span",{className:"k-progress-status",children:[t.value,"%"]})})})]})};f.states=rt;f.options=nt;f.className=y;f.defaultOptions=E;f.moduleName=U;f.folderName=Y;f.ariaSpec={selector:".k-progressbar",implicitRole:"progressbar",rules:[{selector:".k-progressbar",attribute:"role=progressbar",usage:"Sets the proper role for ProgressBar."},{selector:".k-progressbar",attribute:"aria-label or aria-labelledby",usage:"The ProgressBar needs an accessible name to be assigned to it."},{selector:".k-progressbar:not(.k-progressbar-indeterminate)",attribute:"aria-valuenow",usage:"Required if the value is not indeterminate. Decimal value between aria-valuemin and aria-valuemax."},{selector:".k-progressbar",attribute:"aria-valuemin",usage:"Minimum value. Defaults to 0."},{selector:".k-progressbar",attribute:"aria-valuemax",usage:"Maximum value. Defaults to 100."}]};var Be=f;var j=require("react/jsx-runtime"),Ce="k-chunk-progressbar",at=(t,e)=>e<=t-1,st=[b.disabled,b.indeterminate],it={},Z={chunkCount:5,orientation:"horizontal",progress:0},I=t=>{let{disabled:e,chunkCount:o=Z.chunkCount,indeterminate:a,orientation:r=Z.orientation,progress:i=Z.progress,reverse:c,ariaLabel:d,...g}=t;return(0,j.jsx)("div",{...g,className:l(t.className,y,Ce,z(y,{disabled:e}),{[`${y}-${r}`]:r,[`${y}-indeterminate`]:a,[`${y}-reverse`]:c}),role:"progressbar","aria-label":d||"progress","aria-valuenow":a?void 0:i,"aria-valuemin":0,"aria-valuemax":o,children:(0,j.jsx)("ul",{className:"k-progressbar-chunks k-reset",children:[...Array(o)].map((h,p)=>(0,j.jsx)("li",{className:l("k-progressbar-chunk",{"k-first":p===0,"k-last":p===[...Array(o)].length-1,"k-selected":at(i,p)})},p))})})};I.states=st;I.options=it;I.className=Ce;I.defaultOptions=Z;I.moduleName=U;I.folderName=Y;I.ariaSpec={selector:".k-chunk-progressbar",implicitRole:"progressbar",rules:[{selector:".k-chunk-progressbar",attribute:"role=progressbar",usage:"Sets the proper role for ChunkProgressBar."},{selector:".k-chunk-progressbar",attribute:"aria-label or aria-labelledby",usage:"The ChunkProgressBar needs an accessible name to be assigned to it."},{selector:".k-chunk-progressbar:not(.k-progressbar-indeterminate)",attribute:"aria-valuenow",usage:"Required if the value is not indeterminate. Value between aria-valuemin and aria-valuemax."},{selector:".k-chunk-progressbar",attribute:"aria-valuemin",usage:"Minimum value. Defaults to 0."},{selector:".k-chunk-progressbar",attribute:"aria-valuemax",usage:"Maximum value. Defaults to chunk count."}]};var Se=require("react/jsx-runtime"),G=t=>(0,Se.jsx)(Be,{...t});var lt=require("react/jsx-runtime");var M=require("react/jsx-runtime"),ct=f.options,dt=f.states,Me={...f.defaultOptions,variant:"start"},ut=[{name:"start",title:"Label start"},{name:"center",title:"Label center"},{name:"end",title:"Label end"},{name:"empty",title:"No label"}],mt=[],K=t=>{let{variant:e,modifiers:o,...a}={...Me,...t},r={},i={style:{width:"324px"}};switch(Object.keys(o||{}).forEach(c=>{switch(c){case"reverse":r.reverse=!!(o!=null&&o[c]);break;case"vertical":r.orientation=o!=null&&o[c]?"vertical":void 0,i.style=o!=null&&o[c]?void 0:{width:"324px"};break}}),e){case"end":return(0,M.jsx)("div",{...i,children:(0,M.jsx)(G,{...a,...r,labelPosition:"end",value:"50"})});case"center":return(0,M.jsx)("div",{...i,children:(0,M.jsx)(G,{...a,...r,labelPosition:"center",value:"50"})});case"empty":return(0,M.jsx)("div",{...i,children:(0,M.jsx)(G,{...a,...r,label:!1,value:"50"})});default:return(0,M.jsx)("div",{...i,children:(0,M.jsx)(G,{...a,...r,labelPosition:"start",value:"50"})})}};K.options=ct;K.states=dt;K.variants=ut;K.defaultOptions=Me;K.modifiers=mt;K.className=f.className;var m=require("react/jsx-runtime"),Pe="k-file",pt=t=>{let{status:e,progress:o,validationMsg:a,fileSummary:r,...i}=t;return(0,m.jsx)("li",{...i,className:l(t.className,Pe,{[`k-file-${e}`]:e}),role:"listitem",tabIndex:0,children:(0,m.jsxs)("div",{className:"k-file-multiple",children:[(0,m.jsx)(f,{className:l({"k-hidden":e!=="progress"}),value:o,label:!1}),(0,m.jsx)("span",{className:"k-file-icon-wrapper",children:(0,m.jsx)(N,{className:"k-file-icon",icon:"copy",size:"xxlarge"})}),(0,m.jsxs)("div",{className:"k-multiple-files-wrapper",children:[t.children,r&&(0,m.jsx)("span",{className:l("k-file-summary",{"k-hidden":e!=="progress"}),children:r}),a&&(0,m.jsx)("span",{className:"k-file-validation-message","aria-live":"polite",children:a})]}),(0,m.jsx)("div",{className:"k-upload-actions",children:e==="progress"?(0,m.jsxs)(m.Fragment,{children:[(0,m.jsxs)("span",{className:"k-upload-pct",children:[o,"%"]}),(0,m.jsx)(u,{icon:"pause-sm",fillMode:"flat",size:"xsmall",className:"k-upload-action","aria-label":"Pause upload",tabIndex:-1}),(0,m.jsx)(u,{icon:"cancel",fillMode:"flat",size:"xsmall",className:"k-upload-action","aria-label":"Cancel upload",tabIndex:-1})]}):(0,m.jsx)(u,{icon:"x",fillMode:"flat",size:"xsmall",className:"k-upload-action","aria-label":"Remove file",tabIndex:-1})})]})})};