UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 6.75 kB
var i=(...t)=>t.filter(o=>o!==!0&&!!o).map(o=>Array.isArray(o)?i(...o):typeof o=="object"?Object.keys(o).map((a,s)=>o[s]||o[a]&&a||null).filter(a=>a!==null).join(" "):o).filter(o=>!!o).join(" ");var x=(t,o)=>i({[`${t}-xs`]:o.size==="xsmall",[`${t}-sm`]:o.size==="small",[`${t}-md`]:o.size==="medium",[`${t}-lg`]:o.size==="large",[`${t}-xl`]:o.size==="xlarge",[`${t}-xxl`]:o.size==="xxlarge",[`${t}-xxxl`]:o.size==="xxxlarge"},{[`${t}-${o.fillMode}`]:o.fillMode},{[`${t}-${o.fillMode}-${o.themeColor}`]:o.fillMode&&o.themeColor},{[`${t}-${o.themeColor}`]:o.themeColor&&o.fillMode===void 0},{"k-rounded-sm":o.rounded==="small","k-rounded-md":o.rounded==="medium","k-rounded-lg":o.rounded==="large","k-rounded-full":o.rounded==="full"}),U=(t,o)=>{let{valid:a,invalid:s,hover:m,focus:l,checked:r,active:p,selected:f,disabled:C,indeterminate:_,loading:L,empty:w,readonly:$,highlighted:K,...N}=o;return i({"k-valid":a,"k-invalid":s,"k-hover":m,"k-focus":l,"k-checked":r,"k-active":p,"k-selected":f,"k-disabled":C,"k-indeterminate":_&&!r,"k-loading":L,"k-empty":w,"k-readonly":$,"k-highlighted":K},Object.keys(N).reduce((R,M)=>(M.startsWith("k-")?R[M]=N[M]:R[`k-${M}`]=N[M],R),{}))};var n={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},d={small:"small",medium:"medium",large:"large",full:"full"},u={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},e={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},c={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 ae,jsx as X}from"react/jsx-runtime";var H="k-font-icon",ne=[],re={size:[n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[e.base,e.primary,e.secondary,e.tertiary,e.success,e.warning,e.error,e.info,e.light,e.dark]},se={},k=t=>{let{size:o,themeColor:a,icon:s,rotate:m,flip:l,...r}=t;return s?X("span",{...r,className:i(t.className,H,x(H,{size:o}),{[`k-i-${s}`]:s,[`k-color-${a}`]:a,[`k-rotate-${m}`]:m,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"})}):X(ae,{})};k.states=ne;k.options=re;k.className=H;k.defaultOptions=se;var q=k;import{Fragment as me,jsx as S}from"react/jsx-runtime";var P="k-svg-icon",ie=[],le={size:[n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[e.base,e.primary,e.secondary,e.tertiary,e.success,e.warning,e.error,e.info,e.light,e.dark]},j={viewBox:"0 0 24 24"},O=t=>{let{size:o,themeColor:a,rotate:s,flip:m,viewBox:l=j.viewBox,icon:r,...p}=t;if(!r)return S(me,{});r==="none"&&{...p,className:i(t.className,P,"k-none")};let f=typeof r=="object"&&r.name&&r.name;return S("span",{...p,className:i(t.className,P,x("k-icon",{size:o}),{[`k-svg-i-${f}`]:f,[`k-color-${a}`]:a,[`k-rotate-${s}`]:s,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"}),children:S("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof r=="object"?r.viewBox:l,dangerouslySetInnerHTML:typeof r=="object"?{__html:r.content}:void 0,children:r?void 0:t.children})})};O.states=ie;O.options=le;O.className=P;O.defaultOptions=j;var D=O;import*as F from"@progress/kendo-svg-icons";var J="icon",W="icons";import{Fragment as Q,jsx as I}from"react/jsx-runtime";var E="k-icon",de=t=>t.replace(/([-_][a-z0-9])/gi,o=>o.toUpperCase().replace("-","").replace("_","")),ce=[],pe={size:[n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[e.base,e.primary,e.secondary,e.tertiary,e.success,e.warning,e.error,e.info,e.light,e.dark]},B={viewBox:"0 0 24 24",type:"svg"},h=t=>{let{size:o,themeColor:a,icon:s,type:m=B.type,rotate:l,flip:r,viewBox:p=B.viewBox,...f}=t;if(!s)return I(Q,{});if(m==="svg"){if(s==="none")return I(D,{...f,className:i(t.className,E),icon:s,size:o});let C=F[s]?s:de(`${s}-icon`);return F[C]?I(D,{...f,className:i(t.className,E),icon:F[C],size:o,themeColor:a,rotate:l,flip:r,viewBox:p}):I(Q,{})}return I(q,{...f,className:i(t.className,E),icon:s,size:o,themeColor:a,rotate:l,flip:r})};h.states=ce;h.options=pe;h.defaultOptions=B;h.className=E;h.moduleName=J;h.folderName=W;var V="avatar",Y=V;import{jsx as Z}from"react/jsx-runtime";var z="k-avatar";var fe=[c.hover,c.focus,c.active,c.selected,c.disabled],ue={size:[n.small,n.medium,n.large],rounded:[d.small,d.medium,d.large,d.full],fillMode:[u.solid,u.flat,u.outline],themeColor:[e.base,e.primary,e.secondary,e.tertiary,e.success,e.warning,e.error,e.info,e.light,e.dark,e.inverse]},v={type:"text",size:n.medium,rounded:d.full,fillMode:u.solid,themeColor:e.primary,border:!1},g=t=>{let{size:o=v.size,rounded:a=v.rounded,fillMode:s=v.fillMode,themeColor:m=v.themeColor,type:l=v.type,border:r=v.border,...p}=t;return Z("div",{...p,className:i(t.className,z,x(z,{size:o,rounded:a,fillMode:s,themeColor:m}),{[`${z}-bordered`]:r}),children:Z("span",{className:`${z}-${l}`,children:t.children})})};g.states=fe;g.options=ue;g.className=z;g.defaultOptions=v;g.moduleName=V;g.folderName=Y;import{jsx as Qe}from"react/jsx-runtime";import{jsx as oo}from"react/jsx-runtime";import{jsx as so}from"react/jsx-runtime";var G="chip",oe=G;import{jsx as A,jsxs as ge}from"react/jsx-runtime";var T="k-chip",xe=[c.hover,c.focus,c.active,c.selected,c.disabled],he={size:[n.small,n.medium,n.large],rounded:[d.small,d.medium,d.large,d.full],fillMode:[u.solid,u.outline],themeColor:[e.base,e.success,e.warning,e.error,e.info]},b={size:n.medium,rounded:d.medium,fillMode:u.solid,themeColor:e.base,avatarImage:"/packages/html/assets/avatar.jpg"},y=t=>{let{size:o=b.size,rounded:a=b.rounded,fillMode:s=b.fillMode,themeColor:m=b.themeColor,text:l,icon:r,actions:p,showAvatar:f,avatarImage:C=b.avatarImage,hover:_,focus:L,active:w,selected:$,disabled:K,...N}=t;return ge("div",{...N,className:i(t.className,T,x(T,{size:o,rounded:a,fillMode:s,themeColor:m}),U(T,{hover:_,focus:L,active:w,disabled:K,selected:$})),children:[r&&A(h,{className:"k-chip-icon",icon:r,size:"small"}),f&&A(g,{className:"k-chip-avatar",type:"image",children:A("img",{src:C})}),A("span",{className:"k-chip-content",children:t.children?t.children:l&&A("span",{className:"k-chip-label",children:l})}),p&&A("span",{className:"k-chip-actions",children:p})]})};y.states=xe;y.options=he;y.className=T;y.defaultOptions=b;y.moduleName=G;y.folderName=oe;var te=y;import{jsx as ve}from"react/jsx-runtime";var Ao=t=>ve(te,{text:"text",...t});export{Ao as ChipNormal};