@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 9.04 kB
JavaScript
var i=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?i(...e):typeof e=="object"?Object.keys(e).map((r,a)=>e[a]||e[r]&&r||null).filter(r=>r!==null).join(" "):e).filter(e=>!!e).join(" ");var x=(t,e)=>i({[`${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"}),R=(t,e)=>{let{valid:r,invalid:a,hover:s,focus:u,checked:c,active:l,selected:y,disabled:h,indeterminate:f,loading:_,empty:k,readonly:E,highlighted:$,...T}=e;return i({"k-valid":r,"k-invalid":a,"k-hover":s,"k-focus":u,"k-checked":c,"k-active":l,"k-selected":y,"k-disabled":h,"k-indeterminate":f&&!c,"k-loading":_,"k-empty":k,"k-readonly":E,"k-highlighted":$},Object.keys(T).reduce((m,C)=>(C.startsWith("k-")?m[C]=T[C]:m[`k-${C}`]=T[C],m),{}))};function W(t,e){if(!e)return{};let r=Array.isArray(e)?e:[e];return Object.fromEntries(r.map(a=>[`k-${a}`,!0]))}var n={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},O={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"},d={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},b={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},o={undefined:void 0,inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",inverse:"inverse"},N={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 ge,jsx as J}from"react/jsx-runtime";var H="k-font-icon",pe=[],fe={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info]},be={},B=t=>{let{size:e,themeColor:r,icon:a,rotate:s,flip:u,...c}=t;return a?J("span",{...c,className:i(t.className,H,x(H,{size:e}),{[`k-i-${a}`]:a,[`k-color-${r}`]:r,[`k-rotate-${s}`]:s,"k-flip-h":u==="h"||u==="both","k-flip-v":u==="v"||u==="both"}),"aria-hidden":"true"}):J(ge,{})};B.states=pe;B.options=fe;B.className=H;B.defaultOptions=be;var Q=B;import{Fragment as Ne,jsx as K}from"react/jsx-runtime";var P="k-svg-icon",he=[],xe={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info],variant:[b.outline,b.solid,b.duotone]},D={viewBox:"0 0 24 24",variant:b.outline},S=t=>{let{size:e,themeColor:r,rotate:a,flip:s,viewBox:u=D.viewBox,variant:c=D.variant,icon:l,...y}=t;if(!l)return K(Ne,{});if(l==="none")return K("span",{...y,className:i(t.className,P,x("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let h=typeof l=="object"&&l.name&&l.name,f=typeof l=="object"?c&&l.variants?.[c]||l.variants?.outline||l.content:void 0;return K("span",{...y,className:i(t.className,P,x("k-icon",{size:e}),{[`k-svg-i-${h}`]:h,[`k-color-${r}`]:r,[`k-rotate-${a}`]:a,"k-flip-h":s==="h"||s==="both","k-flip-v":s==="v"||s==="both"}),"aria-hidden":"true",children:K("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof l=="object"?l.viewBox:u,dangerouslySetInnerHTML:f!==void 0?{__html:f}:void 0,children:l?void 0:t.children})})};S.states=he;S.options=xe;S.className=P;S.defaultOptions=D;var F=S;import*as V from"@progress/kendo-svg-icons";var X="icon",Y="icons";import{useContext as ye}from"react";import{createContext as ve}from"react";var ee=ve({iconsType:"svg"});import{Fragment as te,jsx as w}from"react/jsx-runtime";var U="k-icon",ke=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Ce=[],Oe={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info],variant:[b.outline,b.solid,b.duotone]},G={viewBox:"0 0 24 24",type:"svg",variant:b.outline},g=t=>{let{iconsType:e}=ye(ee),{size:r,themeColor:a,icon:s,type:u=e||G.type,rotate:c,flip:l,viewBox:y=G.viewBox,variant:h=G.variant,...f}=t;if(!s)return w(te,{});if((e||u)==="svg"){if(s==="none")return w(F,{...f,className:i(t.className,U),icon:s,size:r,variant:h});let k=V[s]?s:ke(`${s}-icon`);return V[k]?w(F,{...f,className:i(t.className,U),icon:V[k],size:r,themeColor:a,rotate:c,flip:l,viewBox:y,variant:h}):w(te,{})}return w(Q,{...f,className:i(t.className,U),icon:s,size:r,themeColor:a,rotate:c,flip:l})};g.states=Ce;g.options=Oe;g.defaultOptions=G;g.className=U;g.moduleName=X;g.folderName=Y;g.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 Z="button",oe=Z;import{Fragment as ne,jsx as M,jsxs as re}from"react/jsx-runtime";var A="k-button",Te=["icon-button"],Me=[N.hover,N.focus,N.active,N.selected,N.disabled,N.generating],Be={size:[n.undefined,n.xsmall,n.small,n.medium,n.large],rounded:[O.undefined,O.none,O.small,O.medium,O.large,O.full],fillMode:[d.undefined,d.solid,d.flat,d.outline,d.clear,d.link],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.inverse]},j={showArrow:!1,arrowIconName:"chevron-down"},p=t=>{let{as:e="button",size:r,rounded:a,fillMode:s,themeColor:u,showArrow:c=j.showArrow,arrowIconName:l=j.arrowIconName,variant:y,hover:h,focus:f,active:_,selected:k,disabled:E,togglable:$,ariaDisabled:T,icon:m,iconSize:C,text:L,iconClassName:le,className:de,...ue}=t,ce=m!=null,me=t.children!==void 0;return re(e,{className:i(de,A,W(A,y),x(A,{size:r,rounded:a,fillMode:s,themeColor:u}),R(A,{hover:h,focus:f,active:_,disabled:E||T,selected:k}),{"k-icon-button":!L&&!me&&ce}),"aria-pressed":$?k?"true":"false":void 0,...ue,"aria-disabled":T?"true":void 0,disabled:E||void 0,children:[typeof m=="string"&&m&&M(g,{className:i(le,"k-button-icon"),icon:m,size:C}),m&&typeof m!="string"&&M(ne,{children:m}),L?re(ne,{children:[L&&M("span",{className:"k-button-text",children:L}),t.children]}):t.children&&M("span",{className:"k-button-text",children:t.children}),c&&M("span",{className:"k-menu-button-arrow k-button-arrow",children:M(g,{icon:l})})]})};p.states=Me;p.options=Be;p.variants=Te;p.className=A;p.defaultOptions=j;p.moduleName=Z;p.folderName=oe;p.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 q="button",se=q;import{jsx as ze}from"react/jsx-runtime";var z="k-button-group",Se=[N.disabled],we={fillMode:[d.undefined,d.solid,d.flat,d.outline,d.clear,d.link]},Ae={},v=t=>{let{fillMode:e,disabled:r,stretched:a,...s}=t;return ze("div",{role:"group",...s,className:i(t.className,z,x(z,{fillMode:e}),R(z,{disabled:r}),{[`${z}-stretched`]:a}),...r&&{"aria-disabled":"true"},children:t.children})};v.states=Se;v.options=we;v.className=z;v.defaultOptions=Ae;v.moduleName=q;v.folderName=se;v.ariaSpec={selector:".k-button-group",rules:[{selector:".k-button-group:not(.k-split-button)",attribute:"role=group",usage:"Sets the proper role for the group of buttons."},{selector:".k-button-group.k-disabled",attribute:"aria-disabled=true",usage:"The attribute is rendered only when the entire button group is disabled."},{selector:".k-button-group:not(.k-split-button):not(.k-scheduler-navigation):not(.k-zoom-control) .k-button",attribute:"aria-pressed (when selected)",usage:"Specifies the current state of the ButtonGroup. Only the selected button within the group will have this attribute set to true."}]};import{jsx as ie,jsxs as Le}from"react/jsx-runtime";var ae="k-zoom-control",Ie=[],_e={},Ee={},I=t=>{let{...e}=t;return Le(v,{...e,className:i(t.className,"k-group-horizontal",ae),children:[ie(p,{icon:"plus",className:"k-zoom-in","aria-label":"Zoom in"}),ie(p,{icon:"minus",className:"k-zoom-out","aria-label":"Zoom out"})]})};I.states=Ie;I.options=_e;I.className=ae;I.defaultOptions=Ee;var Bt=I;export{ae as ZOOMCONTROL_CLASSNAME,I as ZoomControl,Bt as default};