@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 9.36 kB
JavaScript
var c=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?c(...e):typeof e=="object"?Object.keys(e).map((o,l)=>e[l]||e[o]&&o||null).filter(o=>o!==null).join(" "):e).filter(e=>!!e).join(" ");var C=(t,e)=>c({[`${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"}),A=(t,e)=>{let{valid:o,invalid:l,hover:r,focus:m,checked:d,active:i,selected:p,disabled:u,indeterminate:f,loading:O,empty:k,readonly:v,highlighted:ie,..._}=e;return c({"k-valid":o,"k-invalid":l,"k-hover":r,"k-focus":m,"k-checked":d,"k-active":i,"k-selected":p,"k-disabled":u,"k-indeterminate":f&&!d,"k-loading":O,"k-empty":k,"k-readonly":v,"k-highlighted":ie},Object.keys(_).reduce(($,I)=>(I.startsWith("k-")?$[I]=_[I]:$[`k-${I}`]=_[I],$),{}))};var a={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"};var g={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"},h={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 ce,jsx as W}from"react/jsx-runtime";var B="k-font-icon",re=[],se={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},le={},S=t=>{let{size:e,themeColor:o,icon:l,rotate:r,flip:m,...d}=t;return l?W("span",{...d,className:c(t.className,B,C(B,{size:e}),{[`k-i-${l}`]:l,[`k-color-${o}`]:o,[`k-rotate-${r}`]:r,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"}),"aria-hidden":"true"}):W(ce,{})};S.states=re;S.options=se;S.className=B;S.defaultOptions=le;var q=S;import{Fragment as pe,jsx as z}from"react/jsx-runtime";var H="k-svg-icon",de=[],me={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[g.outline,g.solid,g.duotone]},P={viewBox:"0 0 24 24",variant:g.outline},x=t=>{let{size:e,themeColor:o,rotate:l,flip:r,viewBox:m=P.viewBox,variant:d=P.variant,icon:i,...p}=t;if(!i)return z(pe,{});if(i==="none")return z("span",{...p,className:c(t.className,H,C("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let u=typeof i=="object"&&i.name&&i.name,f=typeof i=="object"?d&&i.variants?.[d]||i.variants?.outline||i.content:void 0;return z("span",{...p,className:c(t.className,H,C("k-icon",{size:e}),{[`k-svg-i-${u}`]:u,[`k-color-${o}`]:o,[`k-rotate-${l}`]:l,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),"aria-hidden":"true",children:z("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof i=="object"?i.viewBox:m,dangerouslySetInnerHTML:f!==void 0?{__html:f}:void 0,children:i?void 0:t.children})})};x.states=de;x.options=me;x.className=H;x.defaultOptions=P;var D=x;import*as F from"@progress/kendo-svg-icons";var J="icon",X="icons";import{useContext as fe}from"react";import{createContext as ue}from"react";var Q=ue({iconsType:"svg"});import{Fragment as Y,jsx as T}from"react/jsx-runtime";var L="k-icon",ge=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),xe=[],he={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[g.outline,g.solid,g.duotone]},w={viewBox:"0 0 24 24",type:"svg",variant:g.outline},y=t=>{let{iconsType:e}=fe(Q),{size:o,themeColor:l,icon:r,type:m=e||w.type,rotate:d,flip:i,viewBox:p=w.viewBox,variant:u=w.variant,...f}=t;if(!r)return T(Y,{});if((e||m)==="svg"){if(r==="none")return T(D,{...f,className:c(t.className,L),icon:r,size:o,variant:u});let k=F[r]?r:ge(`${r}-icon`);return F[k]?T(D,{...f,className:c(t.className,L),icon:F[k],size:o,themeColor:l,rotate:d,flip:i,viewBox:p,variant:u}):T(Y,{})}return T(q,{...f,className:c(t.className,L),icon:r,size:o,themeColor:l,rotate:d,flip:i})};y.states=xe;y.options=he;y.defaultOptions=w;y.className=L;y.moduleName=J;y.folderName=X;y.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."}]};import{Fragment as ye,jsx as b,jsxs as ke}from"react/jsx-runtime";var G="k-rating-item",be=[h.hover,h.focus,h.selected,h.disabled],ve={},ee={iconType:"solid"},Z={name:"star",content:'<path d="M256 391.5 117.2 480 154 314.1 32 202.4 192.9 188 256 32l63.1 156L480 202.4 358 314.1 394.8 480z"></path>',viewBox:"0 0 512 512"},j={name:"star-outline",content:'<path d="M480 202.4 319.1 188 256 32l-63.1 156L32 202.4l122 111.7L117.2 480 256 391.5 394.8 480 358 314.1zM256 353.6l-90.8 57.9 24-108.5-82.1-75.2 108.1-9.7L256 117.3l40.8 100.8 108.1 9.7-82.1 75.2 24.1 108.5z"></path>',viewBox:"0 0 512 512"},M=t=>{let{iconType:e=ee.iconType,hover:o,focus:l,selected:r,disabled:m,dir:d,...i}=t,p;switch(e){case"split":p=ke(ye,{children:[b("span",{className:"k-rating-precision-complement",children:b(x,{className:"k-icon",icon:j,size:"xlarge"})}),b("span",{className:"k-rating-precision-part",style:{clipPath:`inset(${d==="rtl"?"0px 0px 0px 50%":"0px 50% 0px 0px"})`},children:b(x,{className:"k-icon",icon:Z,size:"xlarge"})}),b("span",{style:{width:"24px",height:"24px",display:"block"}})]});break;case"outline":p=b(x,{className:"k-icon",icon:j,size:"xlarge"});break;case"solid":p=b(x,{className:"k-icon",icon:Z,size:"xlarge"});break;default:return}return b("span",{...i,className:c(G,A(G,{hover:o,focus:l,selected:r,disabled:m})),dir:d,children:p})};M.states=be;M.options=ve;M.className=G;M.defaultOptions=ee;var E=M;var V="rating",te=V;import{jsx as N,jsxs as Ie}from"react/jsx-runtime";var K="k-rating",Ne=[h.disabled,h.readonly],Re={},U={max:5,min:0},s=t=>{let{value:e,max:o=U.max,min:l=U.min,disabled:r,readonly:m,label:d,dir:i,...p}=t,u=[],f=Math.floor(e),O=e%1===.5,k=o-Math.ceil(e);for(let v=0;v<f;v++)u.push(N(E,{dir:i,iconType:"solid",selected:!0}));O&&u.push(N(E,{dir:i,iconType:"split",selected:!0}));for(let v=0;v<k;v++)u.push(N(E,{dir:i,iconType:"outline"}));return Ie("span",{...p,className:c(t.className,K,A(K,{disabled:r,readonly:m})),dir:i,role:"slider",tabIndex:r?void 0:0,"aria-valuenow":e,"aria-valuemin":l,"aria-valuemax":o,"aria-disabled":r?"true":void 0,"aria-readonly":m?"true":void 0,children:[N("span",{className:"k-rating-container",children:u}),d&&N("span",{className:"k-rating-label",children:N("span",{children:d})})]})};s.states=Ne;s.options=Re;s.className=K;s.defaultOptions=U;s.moduleName=V;s.folderName=te;s.ariaSpec={selector:".k-rating",rules:[{selector:".k-rating",attribute:"role=slider",usage:"Announces the slider role of the Rating element."},{selector:".k-rating",attribute:"aria-label or aria-labelledby or title",usage:"The Rating needs an accessible name to be assigned to it."},{selector:".k-rating",attribute:"aria-valuenow",usage:"Specifies the currently selected value in the Rating."},{selector:".k-rating",attribute:"aria-valuemin",usage:"Specifies the minimum available value in the Rating."},{selector:".k-rating",attribute:"aria-valuemax",usage:"Specifies the maximum available value in the Rating."},{selector:".k-rating:not(.k-disabled)",attribute:"tabindex=0",usage:"The element must be focusable. Disabled ratings are removed from tab order."},{selector:".k-rating.k-disabled",attribute:"aria-disabled=true",usage:"Rendered only when the Rating is disabled."},{selector:".k-rating.k-readonly",attribute:"aria-readonly=true (when readonly)",usage:"Rendered only when the Rating is readonly. Readonly ratings remain focusable but their value cannot be changed."}]};import{jsx as Ce}from"react/jsx-runtime";var ne=({value:t=2.5,...e})=>Ce(s,{value:t,...e,"aria-label":e["aria-label"]||"Rating"});import{jsx as Se}from"react/jsx-runtime";var oe=({value:t=2.5,max:e=5,...o})=>Se(s,{label:`${t} / ${e}`,value:t,max:e,...o,"aria-label":o["aria-label"]||"Rating"});import{jsx as Mt}from"react/jsx-runtime";import{jsx as ae}from"react/jsx-runtime";var Te=s.options,Me=s.states,Oe={...s.defaultOptions,variant:"normal"},Ae=[{name:"normal",title:"Normal"},{name:"label",title:"With label"}],ze=[],R=t=>{let{variant:e,...o}=t;return e==="label"?ae(oe,{...o}):ae(ne,{...o})};R.options=Te;R.states=Me;R.variants=Ae;R.defaultOptions=Oe;R.modifiers=ze;R.className=s.className;import{jsx as Le}from"react/jsx-runtime";var Ut=({value:t=2.5,...e})=>Le(s,{disabled:!0,value:t,"aria-label":e["aria-label"]||"Disabled rating",...e});export{Ut as RatingDisabled};