UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 13 kB
var s=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?s(...e):typeof e=="object"?Object.keys(e).map((n,i)=>e[i]||e[n]&&n||null).filter(n=>n!==null).join(" "):e).filter(e=>!!e).join(" ");var v=(t,e)=>s({[`${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"}),P=(t,e)=>{let{valid:n,invalid:i,hover:m,focus:l,checked:r,active:p,selected:f,disabled:I,indeterminate:M,loading:k,empty:g,readonly:C,highlighted:E,...S}=e;return s({"k-valid":n,"k-invalid":i,"k-hover":m,"k-focus":l,"k-checked":r,"k-active":p,"k-selected":f,"k-disabled":I,"k-indeterminate":M&&!r,"k-loading":k,"k-empty":g,"k-readonly":C,"k-highlighted":E},Object.keys(S).reduce((O,N)=>(N.startsWith("k-")?O[N]=S[N]:O[`k-${N}`]=S[N],O),{}))};function he(t,e){if(!e)return{};let n=Array.isArray(e)?e:[e];return Object.fromEntries(n.map(i=>[`k-${i}`,!0]))}var a={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},D={small:"small",medium:"medium",large:"large",full:"full"},K={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"},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 Je,jsx as Ie}from"react/jsx-runtime";var te="k-font-icon",Xe=[],Ve={size:[a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},We={},X=t=>{let{size:e,themeColor:n,icon:i,rotate:m,flip:l,...r}=t;return i?Ie("span",{...r,className:s(t.className,te,v(te,{size:e}),{[`k-i-${i}`]:i,[`k-color-${n}`]:n,[`k-rotate-${m}`]:m,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"})}):Ie(Je,{})};X.states=Xe;X.options=Ve;X.className=te;X.defaultOptions=We;var Ee=X;import{Fragment as Qe,jsx as q}from"react/jsx-runtime";var oe="k-svg-icon",Ge=[],qe={size:[a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},be={viewBox:"0 0 24 24"},V=t=>{let{size:e,themeColor:n,rotate:i,flip:m,viewBox:l=be.viewBox,icon:r,...p}=t;if(!r)return q(Qe,{});r==="none"&&{...p,className:s(t.className,oe,"k-none")};let f=typeof r=="object"&&r.name&&r.name;return q("span",{...p,className:s(t.className,oe,v("k-icon",{size:e}),{[`k-svg-i-${f}`]:f,[`k-color-${n}`]:n,[`k-rotate-${i}`]:i,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"}),children:q("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})})};V.states=Ge;V.options=qe;V.className=oe;V.defaultOptions=be;var ne=V;import*as re from"@progress/kendo-svg-icons";var Le="icon",Ae="icons";import{Fragment as ke,jsx as W}from"react/jsx-runtime";var Q="k-icon",Ye=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Ze=[],je={size:[a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},se={viewBox:"0 0 24 24",type:"svg"},u=t=>{let{size:e,themeColor:n,icon:i,type:m=se.type,rotate:l,flip:r,viewBox:p=se.viewBox,...f}=t;if(!i)return W(ke,{});if(m==="svg"){if(i==="none")return W(ne,{...f,className:s(t.className,Q),icon:i,size:e});let I=re[i]?i:Ye(`${i}-icon`);return re[I]?W(ne,{...f,className:s(t.className,Q),icon:re[I],size:e,themeColor:n,rotate:l,flip:r,viewBox:p}):W(ke,{})}return W(Ee,{...f,className:s(t.className,Q),icon:i,size:e,themeColor:n,rotate:l,flip:r})};u.states=Ze;u.options=je;u.defaultOptions=se;u.className=Q;u.moduleName=Le;u.folderName=Ae;var h="menu",b=h;import{Fragment as ot,jsx as $,jsxs as Oe}from"react/jsx-runtime";var ie="k-menu-item",et=[c.hover,c.focus,c.active,c.selected,c.disabled],tt={},ge={iconPosition:"before"},L=t=>{let{hover:e,focus:n,active:i,selected:m,disabled:l,icon:r,text:p,first:f,last:I,showArrow:M,arrowIconName:k,iconPosition:g=ge.iconPosition,dir:C,children:E,...S}=t,O=$(ot,{});E&&E.forEach(_=>{if(_.type==="MenuItemContent"){O.props.children.push(_);return}});let N=k;return N||(N=C==="rtl"?"caret-alt-left":"caret-alt-right"),Oe("li",{...S,className:s(t.className,ie,"k-item",P(ie,{focus:n,disabled:l,hover:e,active:i,selected:m}),{"k-first":f,"k-last":I}),children:[Oe("span",{className:s("k-link k-menu-link"),children:[r&&g==="before"&&$(u,{className:"k-menu-link-icon",icon:r}),$("span",{className:"k-menu-link-text",children:p}),r&&g==="after"&&$(u,{className:"k-menu-link-icon",icon:r}),M&&$("span",{className:"k-menu-expand-arrow",children:$(u,{icon:N})})]}),O]})};L.states=et;L.options=tt;L.className=ie;L.defaultOptions=ge;L.moduleName=h;L.folderName=b;import{Fragment as st,jsx as F,jsxs as Ce}from"react/jsx-runtime";var ae="k-menu-item",nt=[c.hover,c.focus,c.active,c.selected,c.disabled],rt={},le={dir:"ltr",iconPosition:"before"},x=t=>{let{hover:e,focus:n,active:i,selected:m,disabled:l,icon:r,text:p,first:f,last:I,showArrow:M,arrowIconName:k,iconPosition:g=le.iconPosition,dir:C=le.dir,children:E,popup:S,...O}=t,N=F(st,{});E&&E.forEach(ee=>{if(ee.type==="MenuListItemContent"){N.props.children.push(ee);return}});let _=k;return _||(_=C==="rtl"?"caret-alt-left":"caret-alt-right"),Ce("li",{...O,className:s(t.className,ae,"k-item",P(ae,{focus:n,disabled:l}),{"k-first":f,"k-last":I}),children:[Ce("span",{className:s("k-link k-menu-link",P("k-menu-link",{hover:e,active:i,selected:m,disabled:l})),children:[r&&g==="before"&&F(u,{className:"k-menu-link-icon",icon:r}),F("span",{className:"k-menu-link-text",children:p}),r&&g==="after"&&F(u,{className:"k-menu-link-icon",icon:r}),M&&F("span",{className:"k-menu-expand-arrow",children:F(u,{icon:_})})]}),N,S]})};x.states=nt;x.options=rt;x.className=ae;x.defaultOptions=le;x.moduleName=h;x.folderName=b;var me="button",Se=me;import{Fragment as mt,jsx as J,jsxs as Te}from"react/jsx-runtime";var G="k-button",it=["icon-button"],at=[c.hover,c.focus,c.active,c.selected,c.disabled,c.generating],lt={size:[a.small,a.medium,a.large],rounded:[D.small,D.medium,D.large,D.full],fillMode:[K.solid,K.flat,K.outline,K.clear,K.link],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark,o.inverse]},R={size:a.medium,rounded:D.medium,fillMode:K.solid,themeColor:o.base,showArrow:!1,arrowIconName:"caret-alt-down"},d=t=>{let{size:e=R.size,rounded:n=R.rounded,fillMode:i=R.fillMode,themeColor:m=R.themeColor,showArrow:l=R.showArrow,arrowIconName:r=R.arrowIconName,variant:p,hover:f,focus:I,active:M,selected:k,disabled:g,icon:C,text:E,iconClassName:S,...O}=t,N=C!==void 0,_=t.children!==void 0;return Te("button",{...O,className:s(t.className,G,he(G,p),v(G,{size:e,rounded:n,fillMode:i,themeColor:m}),P(G,{hover:f,focus:I,active:M,disabled:g,selected:k}),{"k-icon-button":!E&&!_&&N}),children:[C&&J(u,{className:s(S,"k-button-icon"),icon:C}),E?Te(mt,{children:[E&&J("span",{className:"k-button-text",children:E}),t.children]}):t.children&&J("span",{className:"k-button-text",children:t.children}),l&&J("span",{className:"k-menu-button-arrow k-button-arrow",children:J(u,{icon:r})})]})};d.states=at;d.options=lt;d.variants=it;d.className=G;d.defaultOptions=R;d.moduleName=me;d.folderName=Se;import{jsx as Eo}from"react/jsx-runtime";import{jsx as ko}from"react/jsx-runtime";import{jsx as So}from"react/jsx-runtime";import{jsx as dt}from"react/jsx-runtime";var _e="k-menu-scroll-wrapper",ct=[],pt={},ut={},U=t=>{let{className:e,children:n,orientation:i,...m}=t;return dt("div",{...m,className:s(e,_e,{"k-menu-scroll-wrapper-vertical":i==="vertical"}),children:n})};U.states=ct;U.options=pt;U.className=_e;U.defaultOptions=ut;U.moduleName=h;U.folderName=b;var ve=U;import{Fragment as ce,jsx as z,jsxs as Y}from"react/jsx-runtime";var pe="k-menu",ft=[],Mt={},Z={orientation:"horizontal",header:!0,scrollButtonsPosition:"around"},A=t=>{let{children:e,orientation:n=Z.orientation,header:i=Z.header,scrollable:m,scrollButtonsPosition:l=Z.scrollButtonsPosition,wrapperStyles:r,dir:p,popup:f,...I}=t,M={horizontal:{prev:p!=="rtl"?"left":"right",next:p!=="rtl"?"right":"left"},vertical:{prev:"up",next:"down"}},k=z("ul",{dir:p,...I,className:s(t.className,"k-reset",pe,{[`${pe}-${n}`]:n,"k-header":i}),children:e});return Y(ce,{children:[m?Y(ve,{orientation:n,style:r,dir:t.dir,children:[l==="start"&&Y(ce,{children:[z(d,{fillMode:"flat",rounded:null,size:"medium",icon:`caret-alt-${M[n].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev"}),z(d,{fillMode:"flat",rounded:null,size:"medium",icon:`caret-alt-${M[n].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next"})]}),l==="around"&&z(d,{fillMode:"flat",rounded:null,size:"medium",icon:`caret-alt-${M[n].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev"}),k,l==="end"&&Y(ce,{children:[z(d,{fillMode:"flat",rounded:null,size:"medium",icon:`caret-alt-${M[n].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev"}),z(d,{fillMode:"flat",rounded:null,size:"medium",icon:`caret-alt-${M[n].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next"})]}),l==="around"&&z(d,{fillMode:"flat",rounded:null,size:"medium",icon:`caret-alt-${M[n].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next"})]}):k,f]})};A.states=ft;A.options=Mt;A.className=pe;A.defaultOptions=Z;A.moduleName=h;A.folderName=b;import{jsx as Nt}from"react/jsx-runtime";var ue="k-separator",ye={orientation:"horizontal"},B=t=>{let{orientation:e=ye.orientation,...n}=t;return Nt("li",{...n,className:s(t.className,"k-item",ue,{[`${ue}-${e}`]:e})})};B.className=ue;B.defaultOptions=ye;B.moduleName=h;B.folderName=b;import{Fragment as Yo,jsx as Zo}from"react/jsx-runtime";import{jsx as we}from"react/jsx-runtime";import{createElement as It}from"react";var de="k-menu-group",xt=[],ht={size:[a.small,a.medium,a.large]},fe={size:a.medium,dir:"ltr"},T=t=>{let{children:e,size:n=fe.size,dir:i=fe.dir,...m}=t,l=[];return e&&Array.isArray(e)&&e.map((r,p)=>{r.type===x?l.push(It(x,{...r.props,dir:i,key:p})):r.type===B?l.push(we(B,{})):l.push(r)}),we("ul",{...m,className:s(t.className,de,v(de,{size:n})),children:l})};T.states=xt;T.options=ht;T.className=de;T.defaultOptions=fe;T.moduleName=h;T.folderName=b;import{Fragment as cn,jsx as mn,jsxs as pn}from"react/jsx-runtime";var Me="popup",Pe=Me;import{jsx as Ke}from"react/jsx-runtime";var Re="k-animation-container",Et=[],bt={},Ue={positionMode:"absolute"},y=t=>{let{positionMode:e=Ue.positionMode,animationStyle:n,offset:i,...m}=t;return Ke("div",{...m,style:{...i,...t.style},className:s(t.className,Re,"k-animation-container-shown",{"k-animation-container-fixed":e==="fixed"}),children:Ke("div",{className:"k-child-animation-container",style:n,children:t.children})})};y.states=Et;y.options=bt;y.className=Re;y.defaultOptions=Ue;y.moduleName=Me;y.folderName=Pe;var Ne="popup",ze=Ne;import{jsx as Be}from"react/jsx-runtime";var He="k-popup",Lt=[],At={},De={positionMode:"absolute"},H=t=>{let{offset:e,positionMode:n=De.positionMode,animationStyle:i,...m}=t;return Be(y,{positionMode:n,offset:e,animationStyle:i,children:Be("div",{...m,className:s(t.className,He),children:t.children})})};H.states=Lt;H.options=At;H.className=He;H.defaultOptions=De;H.moduleName=Ne;H.folderName=ze;import{Fragment as wn,jsx as vn,jsxs as yn}from"react/jsx-runtime";import{Fragment as zn,jsx as Un,jsxs as Bn}from"react/jsx-runtime";import{Fragment as Xn,jsx as Fn,jsxs as Vn}from"react/jsx-runtime";import{Fragment as Qn,jsx as qn,jsxs as Yn}from"react/jsx-runtime";var xe="context-menu",$e=xe;import{jsx as Ct}from"react/jsx-runtime";var Fe="k-context-menu",kt=[],Ot={},gt={},w=t=>{let{children:e,...n}=t;return Ct(T,{...n,className:s(t.className,Fe),children:e})};w.states=kt;w.options=Ot;w.className=Fe;w.defaultOptions=gt;w.moduleName=xe;w.folderName=$e;import{jsx as j}from"react/jsx-runtime";var br=t=>j(w,{children:[j(x,{first:!0,text:"Item 1",showArrow:!0},"menu-item-1"),j(x,{text:"Item 2"},"menu-item-2"),j(x,{last:!0,text:"Item 3"},"menu-item-3")],...t});export{br as ContextMenuNormal};