@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 6.32 kB
JavaScript
var a=(...o)=>o.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?a(...t):typeof t=="object"?Object.keys(t).map((r,i)=>t[i]||t[r]&&r||null).filter(r=>r!==null).join(" "):t).filter(t=>!!t).join(" ");var p=(o,t)=>a({[`${o}-xs`]:t.size==="xsmall",[`${o}-sm`]:t.size==="small",[`${o}-md`]:t.size==="medium",[`${o}-lg`]:t.size==="large",[`${o}-xl`]:t.size==="xlarge",[`${o}-xxl`]:t.size==="xxlarge",[`${o}-xxxl`]:t.size==="xxxlarge"},{[`${o}-${t.fillMode}`]:t.fillMode},{[`${o}-${t.fillMode}-${t.themeColor}`]:t.fillMode&&t.themeColor},{[`${o}-${t.themeColor}`]:t.themeColor&&t.fillMode===void 0},{"k-rounded-sm":t.rounded==="small","k-rounded-md":t.rounded==="medium","k-rounded-lg":t.rounded==="large","k-rounded-full":t.rounded==="full"});var n={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"};var b={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"};import{Fragment as J,jsx as w}from"react/jsx-runtime";var M="k-icon k-font-icon",j=[],q={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]},D={},g=o=>{let{size:t,themeColor:r,icon:i,rotate:d,flip:s,...l}=o;return i?w("span",{...l,className:a(o.className,M,p(M,{size:t}),{[`k-i-${i}`]:i,[`k-color-${r}`]:r,[`k-rotate-${d}`]:d,"k-flip-h":s==="h"||s==="both","k-flip-v":s==="v"||s==="both"})}):w(J,{})};g.states=j;g.options=q;g.className=M;g.defaultOptions=D;var O=g;import{Fragment as Q,jsx as N}from"react/jsx-runtime";var C="k-icon k-svg-icon",U=[],X={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"},k=o=>{let{size:t,themeColor:r,rotate:i,flip:d,viewBox:s=B.viewBox,icon:l,...c}=o;if(!l)return N(Q,{});l==="none"&&{...c,className:a(o.className,C,"k-none")};let m=typeof l=="object"&&l.name&&l.name;return N("span",{...c,className:a(o.className,C,p("k-icon",{size:t}),{[`k-svg-i-${m}`]:m,[`k-color-${r}`]:r,[`k-rotate-${i}`]:i,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"}),children:N("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof l=="object"?l.viewBox:s,dangerouslySetInnerHTML:typeof l=="object"?{__html:l.content}:void 0,children:l?void 0:o.children})})};k.states=U;k.options=X;k.className=C;k.defaultOptions=B;var $=k;import*as L from"@progress/kendo-svg-icons";import{Fragment as P,jsx as v}from"react/jsx-runtime";var Y=o=>o.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),Z=[],tt={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]},A={viewBox:"0 0 24 24",type:"svg"},f=o=>{let{size:t,themeColor:r,icon:i,type:d=A.type,rotate:s,flip:l,viewBox:c=A.viewBox,...m}=o;if(!i)return v(P,{});if(d==="svg"){if(i==="none")return v($,{...m,icon:i,size:t});let h=Y(`${i}-icon`);return L[h]?v($,{...m,icon:L[h],size:t,themeColor:r,rotate:s,flip:l,viewBox:c}):v(P,{})}return v(O,{...m,icon:i,size:t,themeColor:r,rotate:s,flip:l})};f.states=Z;f.options=tt;f.defaultOptions=A;import{jsx as rt}from"react/jsx-runtime";var E="k-tabstrip-items",et=[],ot={},nt={tabAlignment:"start"},y=o=>{let{children:t,tabAlignment:r,...i}=o;return rt("ul",{...i,className:a(o.className,E,"k-reset",`k-tabstrip-items-${r}`),children:t})};y.states=et;y.options=ot;y.className=E;y.defaultOptions=nt;var R=y;import{jsx as at}from"react/jsx-runtime";var H="k-tabstrip-items-wrapper",it=[],st={},_={orientation:"horizontal"},S=o=>{let{children:t,orientation:r=_.orientation,...i}=o;return at("div",{...i,className:a(o.className,H,{"k-hstack":r==="horizontal","k-vstack":r==="vertical"}),children:t})};S.states=it;S.options=st;S.className=H;S.defaultOptions=_;var F=S;import{jsx as u,jsxs as K}from"react/jsx-runtime";var x="k-tabstrip",lt=[],ct={size:[n.small,n.medium,n.large]},T={size:n.medium,position:"top",tabAlignment:"start",scrollButtons:"around"},I=o=>{let{size:t=T.size,scrollable:r,children:i,tabStripItems:d,position:s=T.position,tabAlignment:l=T.tabAlignment,scrollButtons:c=T.scrollButtons,dir:m,scrollingPosition:h,...G}=o,z={top:{prev:m!=="rtl"?"left":"right",next:m!=="rtl"?"right":"left"},bottom:{prev:m!=="rtl"?"left":"right",next:m!=="rtl"?"right":"left"},right:{prev:"up",next:"down"},left:{prev:"up",next:"down"}},V={top:"horizontal",bottom:"horizontal",left:"vertical",right:"vertical"},W={start:"start",center:"center",end:"end",justify:"justify",stretched:"stretched"};return K("div",{dir:m,...G,className:a(x,o.className,{[`${x}-${s}`]:s,[`${x}-scrollable`]:r,[`${x}-scrollable-overlay`]:r&&(c==="hidden"||!c),[`${x}-scrollable-${h}`]:h&&h!=="both"},p(x,{size:t})),children:[s==="bottom"&&i,K(F,{orientation:V[s],children:[r&&(c==="around"||c==="start")&&u("span",{className:a("k-tabstrip-prev","k-button",p("k-button",{size:t,fillMode:b.flat,themeColor:e.base,rounded:null}),"k-icon-button"),children:u(f,{className:"k-button-icon",icon:`caret-alt-${z[s].prev}`})}),r&&c==="start"&&u("span",{className:a("k-tabstrip-next","k-button",p("k-button",{size:t,fillMode:b.flat,themeColor:e.base,rounded:null}),"k-icon-button"),children:u(f,{className:"k-button-icon",icon:`caret-alt-${z[s].next}`})}),u(R,{className:a({"k-tabstrip-items-scroll":r&&c==="hidden"}),tabAlignment:W[l],children:d}),r&&c==="end"&&u("span",{className:a("k-tabstrip-prev","k-button",p("k-button",{size:t,fillMode:b.flat,themeColor:e.base,rounded:null}),"k-icon-button"),children:u(f,{className:"k-button-icon",icon:`caret-alt-${z[s].prev}`})}),r&&(c==="around"||c==="end")&&u("span",{className:a("k-tabstrip-next","k-button",p("k-button",{size:t,fillMode:b.flat,themeColor:e.base,rounded:null}),"k-icon-button"),children:u(f,{className:"k-button-icon",icon:`caret-alt-${z[s].next}`})})]}),s!=="bottom"&&i]})};I.states=lt;I.options=ct;I.className=x;I.defaultOptions=T;var Vt=I;export{x as TABSTRIP_CLASSNAME,I as TabStrip,Vt as default};