UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

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