UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 11.2 kB
import Dt from"react";var r=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?r(...e):typeof e=="object"?Object.keys(e).map((n,a)=>e[a]||e[n]&&n||null).filter(n=>n!==null).join(" "):e).filter(e=>!!e).join(" ");var A=(t,e)=>r({[`${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.fillMode}-${e.themeColor}`]:e.fillMode&&e.themeColor},{[`${t}-${e.themeColor}`]:e.themeColor&&e.fillMode===void 0},{"k-rounded-sm":e.rounded==="small","k-rounded-md":e.rounded==="medium","k-rounded-lg":e.rounded==="large","k-rounded-full":e.rounded==="full"}),f=(t,e)=>{let{valid:n,invalid:a,hover:i,focus:c,checked:l,active:N,selected:u,disabled:y,indeterminate:Q,loading:Z,empty:j,readonly:K,highlighted:v,...B}=e;return r({"k-valid":n,"k-invalid":a,"k-hover":i,"k-focus":c,"k-checked":l,"k-active":N,"k-selected":u,"k-disabled":y,"k-indeterminate":Q&&!l,"k-loading":Z,"k-empty":j,"k-readonly":K,"k-highlighted":v},Object.keys(B).reduce((H,L)=>(L.startsWith("k-")?H[L]=B[L]:H[`k-${L}`]=B[L],H),{}))};function ue(t,e){if(!e)return{};let n=Array.isArray(e)?e:[e];return Object.fromEntries(n.map(a=>[`k-${a}`,!0]))}var s={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},O={small:"small",medium:"medium",large:"large",full:"full"},T={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},o={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},d={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"},fe={calloutMap:{top:"n",bottom:"s",left:"w",right:"e"},orientationMap:{vertical:"vstack",horizontal:"hstack"}};import{jsx as Ke}from"react/jsx-runtime";var De="k-card-callout",Ce=t=>{let{callout:e,...n}=t;return Ke("span",{...n,className:r(t.className,De,{[`k-callout-${fe.calloutMap[e]||e}`]:e})})};var p="card",C=p;import{Fragment as ze,jsx as Ne,jsxs as we}from"react/jsx-runtime";var G="k-card",Be=[d.hover,d.focus,d.selected,d.disabled],He={themeColor:[o.primary,o.success,o.warning,o.error,o.info]},Ie={},x=t=>{let{orientation:e,themeColor:n,callout:a,hover:i,focus:c,selected:l,disabled:N,...u}=t;return we("div",{...u,className:r(t.className,G,A(G,{themeColor:n}),f(G,{hover:i,focus:c,disabled:N,selected:l}),{[`k-card-${e}`]:e,"k-card-with-callout":a}),children:[a&&a!=="true"&&Ne(Ce,{callout:a}),Ne(ze,{children:t.children})]})};x.states=Be;x.options=He;x.className=G;x.defaultOptions=Ie;x.moduleName=p;x.folderName=C;import{Fragment as Fe,jsx as xe}from"react/jsx-runtime";var ee="k-card-list",Pe=[],Ue={},$e={},S=t=>{let{...e}=t;return xe("div",{...e,className:r(t.className,ee,f(ee,{})),children:xe(Fe,{children:t.children})})};S.states=Pe;S.options=Ue;S.className=ee;S.defaultOptions=$e;S.moduleName=p;S.folderName=C;import{jsx as Ye}from"react/jsx-runtime";var he="k-card-group",Ge=[],We={},Ve={},g=t=>{let{...e}=t;return Ye("div",{...e,className:r(t.className,he),children:t.children})};g.states=Ge;g.options=We;g.className=he;g.defaultOptions=Ve;g.moduleName=p;g.folderName=C;import{jsx as Qe}from"react/jsx-runtime";var te="k-card-wrap",qe=[d.focus,d.selected],Je={},Xe={},k=t=>{let{focus:e,selected:n,...a}=t;return Qe("div",{...a,className:r(t.className,te,f(te,{focus:e,selected:n})),children:t.children})};k.states=qe;k.options=Je;k.className=te;k.defaultOptions=Xe;k.moduleName=p;k.folderName=C;import{jsx as je}from"react/jsx-runtime";var oe="k-card-title",Ze=[d.hover,d.focus],_=t=>{let{hover:e,focus:n,...a}=t;return je("div",{...a,className:r(t.className,oe,f(oe,{hover:e,focus:n})),children:t.children})};_.states=Ze;_.className=oe;import{jsx as tt}from"react/jsx-runtime";var et="k-card-subtitle",W=t=>{let{...e}=t;return tt("div",{...e,className:r(t.className,et),children:t.children})};import{Fragment as Eo,jsx as To}from"react/jsx-runtime";import{Fragment as at,jsx as Ae}from"react/jsx-runtime";var re="k-font-icon",ot=[],rt={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},nt={},I=t=>{let{size:e,themeColor:n,icon:a,rotate:i,flip:c,...l}=t;return a?Ae("span",{...l,className:r(t.className,re,A(re,{size:e}),{[`k-i-${a}`]:a,[`k-color-${n}`]:n,[`k-rotate-${i}`]:i,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"})}):Ae(at,{})};I.states=ot;I.options=rt;I.className=re;I.defaultOptions=nt;var Me=I;import{Fragment as lt,jsx as V}from"react/jsx-runtime";var ne="k-svg-icon",st=[],it={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},Le={viewBox:"0 0 24 24"},z=t=>{let{size:e,themeColor:n,rotate:a,flip:i,viewBox:c=Le.viewBox,icon:l,...N}=t;if(!l)return V(lt,{});l==="none"&&{...N,className:r(t.className,ne,"k-none")};let u=typeof l=="object"&&l.name&&l.name;return V("span",{...N,className:r(t.className,ne,A("k-icon",{size:e}),{[`k-svg-i-${u}`]:u,[`k-color-${n}`]:n,[`k-rotate-${a}`]:a,"k-flip-h":i==="h"||i==="both","k-flip-v":i==="v"||i==="both"}),children:V("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof l=="object"?l.viewBox:c,dangerouslySetInnerHTML:typeof l=="object"?{__html:l.content}:void 0,children:l?void 0:t.children})})};z.states=st;z.options=it;z.className=ne;z.defaultOptions=Le;var ae=z;import*as se from"@progress/kendo-svg-icons";var Te="icon",Ee="icons";import{Fragment as be,jsx as w}from"react/jsx-runtime";var Y="k-icon",dt=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),ct=[],mt={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},ie={viewBox:"0 0 24 24",type:"svg"},h=t=>{let{size:e,themeColor:n,icon:a,type:i=ie.type,rotate:c,flip:l,viewBox:N=ie.viewBox,...u}=t;if(!a)return w(be,{});if(i==="svg"){if(a==="none")return w(ae,{...u,className:r(t.className,Y),icon:a,size:e});let y=se[a]?a:dt(`${a}-icon`);return se[y]?w(ae,{...u,className:r(t.className,Y),icon:se[y],size:e,themeColor:n,rotate:c,flip:l,viewBox:N}):w(be,{})}return w(Me,{...u,className:r(t.className,Y),icon:a,size:e,themeColor:n,rotate:c,flip:l})};h.states=ct;h.options=mt;h.defaultOptions=ie;h.className=Y;h.moduleName=Te;h.folderName=Ee;var le="button",ye=le;import{Fragment as Ct,jsx as P,jsxs as ve}from"react/jsx-runtime";var U="k-button",pt=["icon-button"],ut=[d.hover,d.focus,d.active,d.selected,d.disabled,d.generating],ft={size:[s.small,s.medium,s.large],rounded:[O.small,O.medium,O.large,O.full],fillMode:[T.solid,T.flat,T.outline,T.clear,T.link],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark,o.inverse]},E={size:s.medium,rounded:O.medium,fillMode:T.solid,themeColor:o.base,showArrow:!1,arrowIconName:"caret-alt-down"},m=t=>{let{size:e=E.size,rounded:n=E.rounded,fillMode:a=E.fillMode,themeColor:i=E.themeColor,showArrow:c=E.showArrow,arrowIconName:l=E.arrowIconName,variant:N,hover:u,focus:y,active:Q,selected:Z,disabled:j,icon:K,text:v,iconClassName:B,...H}=t,L=K!==void 0,Re=t.children!==void 0;return ve("button",{...H,className:r(t.className,U,ue(U,N),A(U,{size:e,rounded:n,fillMode:a,themeColor:i}),f(U,{hover:u,focus:y,active:Q,disabled:j,selected:Z}),{"k-icon-button":!v&&!Re&&L}),children:[K&&P(h,{className:r(B,"k-button-icon"),icon:K}),v?ve(Ct,{children:[v&&P("span",{className:"k-button-text",children:v}),t.children]}):t.children&&P("span",{className:"k-button-text",children:t.children}),c&&P("span",{className:"k-menu-button-arrow k-button-arrow",children:P(h,{icon:l})})]})};m.states=ut;m.options=ft;m.variants=pt;m.className=U;m.defaultOptions=E;m.moduleName=le;m.folderName=ye;import{jsx as Xo}from"react/jsx-runtime";import{jsx as er}from"react/jsx-runtime";import{jsx as nr}from"react/jsx-runtime";import{Fragment as xt,jsx as $,jsxs as ht}from"react/jsx-runtime";var Nt="k-card-header",q=t=>{let{title:e,subtitle:n,details:a,...i}=t;return ht("div",{...i,className:r(t.className,Nt),children:[e&&$(_,{children:e}),n&&$(W,{children:n}),$(xt,{children:t.children}),a&&$("span",{className:"k-card-header-actions",children:$(m,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as Ar}from"react/jsx-runtime";import{Fragment as Mt,jsx as F,jsxs as Lt}from"react/jsx-runtime";var At="k-card-body",J=t=>{let{title:e,subtitle:n,details:a,...i}=t;return Lt("div",{...i,className:r(t.className,At),children:[e&&F(_,{children:e}),n&&F(W,{children:n}),F(Mt,{children:t.children}),a&&F("span",{className:"k-card-header-actions",children:F(m,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as yt}from"react/jsx-runtime";var Oe="k-card-deck",Tt=[],Et={},bt={},R=t=>{let{...e}=t;return yt("div",{...e,className:r(t.className,Oe),children:t.children})};R.states=Tt;R.options=Et;R.className=Oe;R.defaultOptions=bt;R.moduleName=p;R.folderName=C;import{jsx as gt}from"react/jsx-runtime";var Se="k-card-deck-scrollwrap",vt=[],Ot={},St={},D=t=>{let{...e}=t;return gt("div",{...e,className:r(t.className,Se),children:t.children})};D.states=vt;D.options=Ot;D.className=Se;D.defaultOptions=St;D.moduleName=p;D.folderName=C;var de="action-buttons",ge=de;import{jsx as Rt}from"react/jsx-runtime";var X="k-actions",kt=[],_t={},ce={alignment:"start",orientation:"horizontal"},M=t=>{let{alignment:e=ce.alignment,orientation:n=ce.orientation,...a}=t;return Rt("div",{...a,className:r(X,{[`${X}-${e}`]:e,[`${X}-${n}`]:n},t.className),children:t.children})};M.states=kt;M.options=_t;M.className=X;M.defaultOptions=ce;M.moduleName=de;M.folderName=ge;import{Fragment as qr,jsx as Vr,jsxs as Yr}from"react/jsx-runtime";import{Fragment as on,jsx as en,jsxs as tn}from"react/jsx-runtime";var ke="tile-layout",_e="tilelayout";import{jsx as me,jsxs as It}from"react/jsx-runtime";var pe="k-tilelayout-item",Kt=[d.focus],Bt={},Ht={},b=t=>{let{header:e,body:n,focus:a,resize:i,style:c}=t;return It(x,{className:r(t.className,pe,f(pe,{focus:a}),{"k-resize":i===!0,"k-resize-x":i==="horizontal","k-resize-y":i==="vertical"}),style:c,children:[e&&Dt.isValidElement(e)?me(q,{className:"k-tilelayout-item-header k-cursor-move",children:e}):me(q,{className:"k-tilelayout-item-header k-cursor-move",title:e}),n&&me(J,{className:"k-tilelayout-item-body",children:n})]})};b.states=Kt;b.options=Bt;b.className=pe;b.defaultOptions=Ht;b.moduleName=ke;b.folderName=_e;var vn=b;export{pe as TILELAYOUTITEM_CLASSNAME,b as TileLayoutItem,vn as default};