@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 17 kB
JavaScript
var Me=Object.create;var Q=Object.defineProperty;var Ae=Object.getOwnPropertyDescriptor;var Be=Object.getOwnPropertyNames;var we=Object.getPrototypeOf,Te=Object.prototype.hasOwnProperty;var ze=(t,e)=>{for(var o in e)Q(t,o,{get:e[o],enumerable:!0})},pe=(t,e,o,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of Be(e))!Te.call(t,r)&&r!==o&&Q(t,r,{get:()=>e[r],enumerable:!(a=Ae(e,r))||a.enumerable});return t};var _e=(t,e,o)=>(o=t!=null?Me(we(t)):{},pe(e||!t||!t.__esModule?Q(o,"default",{value:t,enumerable:!0}):o,t)),$e=t=>pe(Q({},"__esModule",{value:!0}),t);var xt={};ze(xt,{Step:()=>d,StepList:()=>x,Stepper:()=>m,StepperDemo:()=>K,StepperDisabled:()=>mt,StepperNormal:()=>ct,StepperVertical:()=>dt});module.exports=$e(xt);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 W=(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"}),G=(t,e)=>{let{valid:o,invalid:a,hover:r,focus:s,checked:p,active:c,selected:g,disabled:y,indeterminate:u,loading:M,empty:b,readonly:H,highlighted:D,...F}=e;return l({"k-valid":o,"k-invalid":a,"k-hover":r,"k-focus":s,"k-checked":p,"k-active":c,"k-selected":g,"k-disabled":y,"k-indeterminate":u&&!p,"k-loading":M,"k-empty":b,"k-readonly":H,"k-highlighted":D},Object.keys(F).reduce((w,T)=>(T.startsWith("k-")?w[T]=F[T]:w[`k-${T}`]=F[T],w),{}))};var i={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"};var L={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"},S={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 oe="stepper",ce=oe;var me=require("react/jsx-runtime"),de="k-stepper",Ie=[],Ke={},He={},m=t=>{let{style:e,...o}=t;return(0,me.jsx)("nav",{...o,style:e,className:l(t.className,de),"aria-label":"Stepper",children:t.children})};m.options=Ke;m.states=Ie;m.className=de;m.defaultOptions=He;m.moduleName=oe;m.folderName=ce;m.ariaSpec={selector:".k-stepper",rules:[{selector:".k-stepper",attribute:"role=navigation or nodeName=nav",usage:"The landmark role navigation must be assigned to the component."},{selector:".k-step.k-disabled>.k-step-link",attribute:"aria-disabled=true",usage:"A disabled (inactive) link."},{selector:".k-step-current>.k-step-link",attribute:"aria-current=step",usage:"The currently selected link."},{selector:".k-step.k-focus .k-step-link",attribute:"tabindex=0",usage:"Focused step link is in the tab order."},{selector:".k-step:not(.k-focus) .k-step-link",attribute:"tabindex=-1",usage:"Non-focused step links are removed from tab order."}]};var fe=require("react/jsx-runtime"),re="k-step-list",De=[],Fe={},ue={orientation:"horizontal"},x=t=>{let{style:e,orientation:o=ue.orientation,wizardContext:a,...r}=t;return(0,fe.jsx)("ol",{...r,style:e,className:l(t.className,re,{[`${re}-${o}`]:o}),...a&&{role:"tablist"},children:t.children})};x.options=Fe;x.states=De;x.className=re;x.defaultOptions=ue;var U=require("react/jsx-runtime"),ae="k-font-icon",Ge=[],Ve={size:[i.undefined,i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},We={},q=t=>{let{size:e,themeColor:o,icon:a,rotate:r,flip:s,...p}=t;return a?(0,U.jsx)("span",{...p,className:l(t.className,ae,W(ae,{size:e}),{[`k-i-${a}`]:a,[`k-color-${o}`]:o,[`k-rotate-${r}`]:r,"k-flip-h":s==="h"||s==="both","k-flip-v":s==="v"||s==="both"}),"aria-hidden":"true"}):(0,U.jsx)(U.Fragment,{})};q.states=Ge;q.options=Ve;q.className=ae;q.defaultOptions=We;var ge=q;var _=require("react/jsx-runtime"),se="k-svg-icon",Ue=[],qe={size:[i.undefined,i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[L.outline,L.solid,L.duotone]},ne={viewBox:"0 0 24 24",variant:L.outline},J=t=>{var M,b;let{size:e,themeColor:o,rotate:a,flip:r,viewBox:s=ne.viewBox,variant:p=ne.variant,icon:c,...g}=t;if(!c)return(0,_.jsx)(_.Fragment,{});if(c==="none")return(0,_.jsx)("span",{...g,className:l(t.className,se,W("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let y=typeof c=="object"&&c.name&&c.name,u=typeof c=="object"?p&&((M=c.variants)==null?void 0:M[p])||((b=c.variants)==null?void 0:b.outline)||c.content:void 0;return(0,_.jsx)("span",{...g,className:l(t.className,se,W("k-icon",{size:e}),{[`k-svg-i-${y}`]:y,[`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,_.jsx)("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof c=="object"?c.viewBox:s,dangerouslySetInnerHTML:u!==void 0?{__html:u}:void 0,children:c?void 0:t.children})})};J.states=Ue;J.options=qe;J.className=se;J.defaultOptions=ne;var ie=J;var le=_e(require("@progress/kendo-svg-icons"));var be="icon",xe="icons";var ke=require("react");var ve=require("react"),he=(0,ve.createContext)({iconsType:"svg"});var A=require("react/jsx-runtime"),Y="k-icon",Je=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Xe=[],Qe={size:[i.undefined,i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[L.outline,L.solid,L.duotone]},Z={viewBox:"0 0 24 24",type:"svg",variant:L.outline},R=t=>{let{iconsType:e}=(0,ke.useContext)(he),{size:o,themeColor:a,icon:r,type:s=e||Z.type,rotate:p,flip:c,viewBox:g=Z.viewBox,variant:y=Z.variant,...u}=t;if(!r)return(0,A.jsx)(A.Fragment,{});if((e||s)==="svg"){if(r==="none")return(0,A.jsx)(ie,{...u,className:l(t.className,Y),icon:r,size:o,variant:y});let b=le[r]?r:Je(`${r}-icon`);return le[b]?(0,A.jsx)(ie,{...u,className:l(t.className,Y),icon:le[b],size:o,themeColor:a,rotate:p,flip:c,viewBox:g,variant:y}):(0,A.jsx)(A.Fragment,{})}return(0,A.jsx)(ge,{...u,className:l(t.className,Y),icon:r,size:o,themeColor:a,rotate:p,flip:c})};R.states=Xe;R.options=Qe;R.defaultOptions=Z;R.className=Y;R.moduleName=be;R.folderName=xe;R.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 f=require("react/jsx-runtime"),O="k-step",Ye=[S.disabled,S.hover,S.focus,S.invalid,S.valid],Ze={},je={},d=t=>{let{style:e,disabled:o,hover:a,focus:r,invalid:s,valid:p,optional:c,first:g,done:y,current:u,last:M,label:b,text:H,icon:D,stepContent:F,wizardContext:w,ariaControls:T,...Ee}=t,Le=s?"warning-circle":"check-circle",Re=!!(p||s),Oe=b||(H?`Step ${H}`:D?"Step":void 0);return(0,f.jsxs)("li",{...Ee,style:e,className:l(t.className,O,{[`${O}-done`]:y,[`${O}-first`]:g,[`${O}-current`]:u,[`${O}-last`]:M,[`${O}-optional`]:c,[`${O}-success`]:p,[`${O}-error`]:s},G(O,{hover:a,focus:r,disabled:o})),...w&&{role:"none"},children:[(0,f.jsxs)("a",{href:"#",className:"k-step-link",...w&&{role:"tab"},...T&&{"aria-controls":T},...u&&{"aria-current":w?"true":"step"},...u&&w&&{"aria-selected":"true"},...o&&{"aria-disabled":"true"},tabIndex:r||u?0:-1,"aria-label":Oe,children:[H&&!D&&(0,f.jsx)("span",{className:"k-step-indicator",children:(0,f.jsx)("span",{className:"k-step-indicator-text",children:H})}),D&&(0,f.jsx)("span",{className:"k-step-indicator",children:(0,f.jsx)(R,{className:"k-step-indicator-icon",icon:D})}),c&&!b&&(0,f.jsx)("span",{className:"k-step-label",children:(0,f.jsx)("span",{className:"k-step-label-optional",children:"(Optional)"})}),b&&(0,f.jsxs)("span",{className:"k-step-label",children:[(0,f.jsx)("span",{className:"k-step-text",children:b}),Re&&(0,f.jsx)(R,{icon:Le}),c&&(0,f.jsx)("span",{className:"k-step-label-optional",children:"(Optional)"})]})]}),F&&(0,f.jsx)("div",{className:"k-step-content",style:{height:"140px"},children:F})]})};d.options=Ze;d.states=Ye;d.className=O;d.defaultOptions=je;var X="progressbar",j=X;var z=require("react/jsx-runtime"),N="k-progressbar",et=[S.disabled,S.indeterminate],tt={orientation:["horizontal","vertical"]},$={indeterminate:!1,label:!0,labelPosition:"start",orientation:"horizontal",reverse:!1,value:"0"},k=t=>{let{disabled:e,height:o,indeterminate:a=$.indeterminate,label:r=$.label,labelPosition:s=$.labelPosition,orientation:p=$.orientation,reverse:c=$.reverse,value:g=$.value,width:y,style:u,ariaLabel:M,...b}=t;return(0,z.jsxs)("div",{...b,className:l(t.className,N,G(N,{disabled:e}),{[`${N}-${p}`]:p,[`${N}-indeterminate`]:a,[`${N}-reverse`]:c}),style:{...u,"--kendo-progressbar-value":g,[p==="horizontal"?"height":"width"]:p==="horizontal"?o:y},role:"progressbar","aria-label":M||"progress","aria-valuenow":a?void 0:Number(g),"aria-valuemin":0,"aria-valuemax":100,children:[(0,z.jsx)("span",{className:l("k-progress-status-wrap",{[`k-progress-${s}`]:s&&!a}),children:r&&(0,z.jsxs)("span",{className:"k-progress-status",children:[g,"%"]})}),!a&&(0,z.jsx)("div",{className:"k-progressbar-value k-selected",children:(0,z.jsx)("span",{className:l("k-progress-status-wrap",{[`k-progress-${s}`]:s}),children:r&&(0,z.jsxs)("span",{className:"k-progress-status",children:[t.value,"%"]})})})]})};k.states=et;k.options=tt;k.className=N;k.defaultOptions=$;k.moduleName=X;k.folderName=j;k.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 ye=k;var te=require("react/jsx-runtime"),Se="k-chunk-progressbar",ot=(t,e)=>e<=t-1,rt=[S.disabled,S.indeterminate],at={},ee={chunkCount:5,orientation:"horizontal",progress:0},I=t=>{let{disabled:e,chunkCount:o=ee.chunkCount,indeterminate:a,orientation:r=ee.orientation,progress:s=ee.progress,reverse:p,ariaLabel:c,...g}=t;return(0,te.jsx)("div",{...g,className:l(t.className,N,Se,G(N,{disabled:e}),{[`${N}-${r}`]:r,[`${N}-indeterminate`]:a,[`${N}-reverse`]:p}),role:"progressbar","aria-label":c||"progress","aria-valuenow":a?void 0:s,"aria-valuemin":0,"aria-valuemax":o,children:(0,te.jsx)("ul",{className:"k-progressbar-chunks k-reset",children:[...Array(o)].map((y,u)=>(0,te.jsx)("li",{className:l("k-progressbar-chunk",{"k-first":u===0,"k-last":u===[...Array(o)].length-1,"k-selected":ot(s,u)})},u))})})};I.states=rt;I.options=at;I.className=Se;I.defaultOptions=ee;I.moduleName=X;I.folderName=j;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 Ne=require("react/jsx-runtime"),v=t=>(0,Ne.jsx)(ye,{...t});var st=require("react/jsx-runtime");var B=require("react/jsx-runtime"),nt=k.options,it=k.states,Ce={...k.defaultOptions,variant:"start"},lt=[{name:"start",title:"Label start"},{name:"center",title:"Label center"},{name:"end",title:"Label end"},{name:"empty",title:"No label"}],pt=[],V=t=>{let{variant:e,modifiers:o,...a}={...Ce,...t},r={},s={style:{width:"324px"}};switch(Object.keys(o||{}).forEach(p=>{switch(p){case"reverse":r.reverse=!!(o!=null&&o[p]);break;case"vertical":r.orientation=o!=null&&o[p]?"vertical":void 0,s.style=o!=null&&o[p]?void 0:{width:"324px"};break}}),e){case"end":return(0,B.jsx)("div",{...s,children:(0,B.jsx)(v,{...a,...r,labelPosition:"end",value:"50"})});case"center":return(0,B.jsx)("div",{...s,children:(0,B.jsx)(v,{...a,...r,labelPosition:"center",value:"50"})});case"empty":return(0,B.jsx)("div",{...s,children:(0,B.jsx)(v,{...a,...r,label:!1,value:"50"})});default:return(0,B.jsx)("div",{...s,children:(0,B.jsx)(v,{...a,...r,labelPosition:"start",value:"50"})})}};V.options=nt;V.states=it;V.variants=lt;V.defaultOptions=Ce;V.modifiers=pt;V.className=k.className;var C=require("react/jsx-runtime"),ct=({gridTemplateColumns:t="repeat(6, 1fr)",...e})=>(0,C.jsx)(m,{style:{display:"grid",gridTemplateColumns:t},children:(0,C.jsxs)(C.Fragment,{children:[(0,C.jsxs)(x,{style:{gridColumnStart:"1",gridColumnEnd:"-1"},children:[(0,C.jsx)(d,{first:!0,done:!0,icon:"check",style:{maxWidth:"33.333%"}}),(0,C.jsx)(d,{current:!0,focus:!0,text:"2",style:{maxWidth:"33.333%"}}),(0,C.jsx)(d,{last:!0,optional:!0,text:"3",style:{maxWidth:"33.333%"}})]}),(0,C.jsx)(v,{label:!1,value:"50"})]}),...e});var P=require("react/jsx-runtime"),dt=({gridTemplateRows:t="repeat(3, 1fr)",...e})=>(0,P.jsx)(m,{style:{display:"grid",gridTemplateRows:t},children:(0,P.jsxs)(P.Fragment,{children:[(0,P.jsxs)(x,{orientation:"vertical",style:{gridRowStart:"1",gridRowEnd:"-1"},children:[(0,P.jsx)(d,{first:!0,done:!0,icon:"check",style:{maxHeight:"33.333%"}}),(0,P.jsx)(d,{current:!0,focus:!0,text:"2",style:{maxHeight:"33.333%"}}),(0,P.jsx)(d,{last:!0,optional:!0,text:"3",style:{maxHeight:"33.333%"}})]}),(0,P.jsx)(v,{orientation:"vertical",reverse:!0,label:!1,value:"50"})]}),...e});var E=require("react/jsx-runtime"),mt=({gridTemplateColumns:t="repeat(6, 1fr)",...e})=>(0,E.jsx)(m,{style:{display:"grid",gridTemplateColumns:t},children:(0,E.jsxs)(E.Fragment,{children:[(0,E.jsxs)(x,{style:{gridColumnStart:"1",gridColumnEnd:"-1"},children:[(0,E.jsx)(d,{first:!0,done:!0,icon:"check",style:{maxWidth:"33.333%"}}),(0,E.jsx)(d,{current:!0,focus:!0,text:"2",style:{maxWidth:"33.333%"}}),(0,E.jsx)(d,{last:!0,disabled:!0,text:"3",style:{maxWidth:"33.333%"}})]}),(0,E.jsx)(v,{label:!1,value:"50"})]}),...e});var h=require("react/jsx-runtime"),ut=m.options,ft=m.states,Pe={...m.defaultOptions,variant:"horizontal"},gt=[{name:"horizontal",title:"Horizontal"},{name:"vertical",title:"Vertical"}],bt=[{name:"label",title:"Label"},{name:"optional",title:"Optional"}],K=t=>{let{variant:e,modifiers:o,...a}={...Pe,...t},r={};return Object.keys(o||{}).forEach(s=>{switch(s){case"label":{r.label=o!=null&&o[s]?"Label":void 0;break}case"optional":{r.optional=!!(o!=null&&o[s]);break}}}),e==="vertical"?(0,h.jsxs)(m,{style:{display:"grid",gridTemplateRows:"repeat(3, 1fr)"},...a,children:[(0,h.jsxs)(x,{orientation:"vertical",style:{gridRowStart:"1",gridRowEnd:"-1"},children:[(0,h.jsx)(d,{first:!0,done:!0,icon:"check",label:r.label,style:{maxHeight:"33.333%"}}),(0,h.jsx)(d,{current:!0,focus:!0,text:"2",label:r.label,style:{maxHeight:"33.333%"}}),(0,h.jsx)(d,{last:!0,optional:r.optional,text:"3",label:r.label,style:{maxHeight:"33.333%"}})]}),(0,h.jsx)(v,{className:"k-top-5 k-row-start-1 k-row-end-3",orientation:"vertical",reverse:!0,label:!1,value:"50"})]}):(0,h.jsxs)(m,{style:{display:"grid",gridTemplateColumns:"repeat(6, 1fr)"},...a,children:[(0,h.jsxs)(x,{style:{gridColumnStart:"1",gridColumnEnd:"-1"},children:[(0,h.jsx)(d,{first:!0,done:!0,icon:"check",label:r.label,style:{maxWidth:"33.333%"}}),(0,h.jsx)(d,{current:!0,focus:!0,text:"2",label:r.label,style:{maxWidth:"33.333%"}}),(0,h.jsx)(d,{last:!0,optional:r.optional,text:"3",label:r.label,style:{maxWidth:"33.333%"}})]}),(0,h.jsx)(v,{className:"k-col-start-2 k-col-end-6",style:{width:"400px"},label:!1,value:"50"})]})};K.options=ut;K.states=ft;K.variants=gt;K.defaultOptions=Pe;K.modifiers=bt;K.className=m.className;