@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 8.83 kB
JavaScript
var r=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?r(...e):typeof e=="object"?Object.keys(e).map((s,i)=>e[i]||e[s]&&s||null).filter(s=>s!==null).join(" "):e).filter(e=>!!e).join(" ");var p=(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"}),I=(t,e)=>r({"k-valid":e.valid,"k-invalid":e.invalid,"k-hover":e.hover,"k-focus":e.focus,"k-checked":e.checked,"k-active":e.active,"k-selected":e.selected,"k-disabled":e.disabled,"k-indeterminate":e.indeterminate&&!e.checked,"k-loading":e.loading,"k-empty":e.empty,"k-readonly":e.readonly,"k-highlighted":e.highlighted});var n={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},y={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"},f={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"};import{Fragment as X,jsx as x,jsxs as E}from"react/jsx-runtime";var fe=[f.focus],R=t=>{let{type:e,focus:s,separator:i,...m}=t,l,a=["00","01","02","03","04","05","06","07","08","09"];switch(e){case"dd":l="Day";break;case"HH":l="Hour";break;case"mm":l="Minute";break;case"ss":l="Second";break;case"SSS":l="Millisecond",a=["000","001","002","003","004","005","006","007","008","009"];break;case"tt":l="AM/PM",a=["AM","PM"];break;default:l="Column Name";break}let u=a.map(c=>x(X,{children:x("li",{className:"k-item",children:x("span",{children:c})})}));return E(X,{children:[i&&x("div",{className:"k-time-separator",children:":"}),E("div",{...m,className:r(t.className,"k-time-list-wrapper",I("k-time-list-wrapper",{focus:s})),children:[x("span",{className:"k-title",children:l}),x("div",{className:"k-time-list",children:E("div",{className:"k-content k-scrollable k-time-container",children:[x("ul",{className:"k-reset",style:{transform:"translateY(97px)"},children:u}),x("div",{className:"k-scrollable-placeholder"})]})})]})]})};R.states=fe;import{jsx as Qe,jsxs as We}from"react/jsx-runtime";import{jsx as ke}from"react/jsx-runtime";var P="k-actions",xe=[],he={},_={alignment:"start",orientation:"horizontal"},h=t=>{let{alignment:e=_.alignment,orientation:s=_.orientation,...i}=t;return ke("div",{...i,className:r(P,{[`${P}-${e}`]:e,[`${P}-${s}`]:s},t.className),children:t.children})};h.states=xe;h.options=he;h.className=P;h.defaultOptions=_;import{Fragment as ye,jsx as Y}from"react/jsx-runtime";var F="k-icon k-font-icon",Se=[],ge={size:[n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},Ne={},T=t=>{let{size:e,themeColor:s,icon:i,rotate:m,flip:l,...a}=t;return i?Y("span",{...a,className:r(t.className,F,p(F,{size:e}),{[`k-i-${i}`]:i,[`k-color-${s}`]:s,[`k-rotate-${m}`]:m,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"})}):Y(ye,{})};T.states=Se;T.options=ge;T.className=F;T.defaultOptions=Ne;var Q=T;import{Fragment as Te,jsx as L}from"react/jsx-runtime";var D="k-icon k-svg-icon",ve=[],be={size:[n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},W={viewBox:"0 0 24 24"},C=t=>{let{size:e,themeColor:s,rotate:i,flip:m,viewBox:l=W.viewBox,icon:a,...u}=t;if(!a)return L(Te,{});a==="none"&&{...u,className:r(t.className,D,"k-none")};let c=typeof a=="object"&&a.name&&a.name;return L("span",{...u,className:r(t.className,D,p("k-icon",{size:e}),{[`k-svg-i-${c}`]:c,[`k-color-${s}`]:s,[`k-rotate-${i}`]:i,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"}),children:L("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof a=="object"?a.viewBox:l,dangerouslySetInnerHTML:typeof a=="object"?{__html:a.content}:void 0,children:a?void 0:t.children})})};C.states=ve;C.options=be;C.className=D;C.defaultOptions=W;var G=C;import*as Z from"@progress/kendo-svg-icons";import{Fragment as j,jsx as M}from"react/jsx-runtime";var Ce=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Me=[],Be={size:[n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},V={viewBox:"0 0 24 24",type:"svg"},v=t=>{let{size:e,themeColor:s,icon:i,type:m=V.type,rotate:l,flip:a,viewBox:u=V.viewBox,...c}=t;if(!i)return M(j,{});if(m==="svg"){if(i==="none")return M(G,{...c,icon:i,size:e});let N=Ce(`${i}-icon`);return Z[N]?M(G,{...c,icon:Z[N],size:e,themeColor:s,rotate:l,flip:a,viewBox:u}):M(j,{})}return M(Q,{...c,icon:i,size:e,themeColor:s,rotate:l,flip:a})};v.states=Me;v.options=Be;v.defaultOptions=V;import{Fragment as He,jsx as B,jsxs as ee}from"react/jsx-runtime";var K="k-button",Ae=[f.hover,f.focus,f.active,f.selected,f.disabled],we={size:[n.small,n.medium,n.large],rounded:[y.small,y.medium,y.large,y.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]},S={size:n.medium,rounded:y.medium,fillMode:k.solid,themeColor:o.base,showArrow:!1,arrowIconName:"caret-alt-down"},d=t=>{let{size:e=S.size,rounded:s=S.rounded,fillMode:i=S.fillMode,themeColor:m=S.themeColor,showArrow:l=S.showArrow,arrowIconName:a=S.arrowIconName,hover:u,focus:c,active:N,selected:H,disabled:z,icon:$,text:O,iconClassName:ce,...de}=t,ue=$!==void 0,pe=t.children!==void 0;return ee("button",{...de,className:r(t.className,K,p(K,{size:e,rounded:s,fillMode:i,themeColor:m}),I(K,{hover:u,focus:c,active:N,disabled:z,selected:H}),{"k-icon-button":!O&&!pe&&ue}),children:[$&&B(v,{className:r(ce,"k-button-icon"),icon:$}),O?ee(He,{children:[O&&B("span",{className:"k-button-text",children:O}),t.children]}):t.children&&B("span",{className:"k-button-text",children:t.children}),l&&B("span",{className:"k-menu-button-arrow k-button-arrow",children:B(v,{icon:a})})]})};d.states=Ae;d.options=we;d.className=K;d.defaultOptions=S;import{jsx as Ct}from"react/jsx-runtime";import{jsx as wt}from"react/jsx-runtime";import{jsx as It}from"react/jsx-runtime";import{jsx as Vt,jsxs as Ut}from"react/jsx-runtime";import{jsx as te}from"react/jsx-runtime";var oe="k-animation-container",ze=[],Oe={},ne={positionMode:"absolute"},b=t=>{let{positionMode:e=ne.positionMode,animationStyle:s,offset:i,...m}=t;return te("div",{...m,style:{...i,...t.style},className:r(t.className,oe,"k-animation-container-shown",{"k-animation-container-fixed":e==="fixed"}),children:te("div",{className:"k-child-animation-container",style:s,children:t.children})})};b.states=ze;b.options=Oe;b.className=oe;b.defaultOptions=ne;import{jsx as se}from"react/jsx-runtime";var ie="k-popup",Ie=[],Pe={},re={positionMode:"absolute"},g=t=>{let{offset:e,positionMode:s=re.positionMode,animationStyle:i,...m}=t;return se(b,{positionMode:s,offset:e,animationStyle:i,children:se("div",{...m,className:r(t.className,ie),children:t.children})})};g.states=Ie;g.options=Pe;g.className=ie;g.defaultOptions=re;import{Fragment as po,jsx as co,jsxs as uo}from"react/jsx-runtime";import{Fragment as bo,jsx as yo,jsxs as vo}from"react/jsx-runtime";import{Fragment as Io,jsx as zo,jsxs as Oo}from"react/jsx-runtime";import{Fragment as q,jsx as A,jsxs as le}from"react/jsx-runtime";var J="k-timeselector",Le=[],Ke={size:[n.small,n.medium,n.large]},me={size:n.medium},w=t=>{let{size:e=me.size,header:s,fastSelection:i,columns:m,focusedColumn:l,...a}=t,u=m.map(function(c,N){let H=!1,z=!0;return c===l&&(H=!0),(N===0||c==="tt")&&(z=!1),A(q,{children:A(R,{type:c,focus:H,separator:z})})});return le("div",{...a,className:r(t.className,J,p(J,{size:e})),children:[A(q,{children:s}),A(q,{children:i}),le("div",{className:"k-time-list-container",children:[A("span",{className:"k-time-highlight"}),u]})]})};w.states=Le;w.options=Ke;w.className=J;w.defaultOptions=me;var U=w;export{w as TimeSelector,U as default};