@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 18.2 kB
JavaScript
var ct=Object.create;var ae=Object.defineProperty;var mt=Object.getOwnPropertyDescriptor;var ft=Object.getOwnPropertyNames;var bt=Object.getPrototypeOf,xt=Object.prototype.hasOwnProperty;var Nt=(t,e)=>{for(var o in e)ae(t,o,{get:e[o],enumerable:!0})},Le=(t,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of ft(e))!xt.call(t,n)&&n!==o&&ae(t,n,{get:()=>e[n],enumerable:!(s=mt(e,n))||s.enumerable});return t};var ht=(t,e,o)=>(o=t!=null?ct(bt(t)):{},Le(e||!t||!t.__esModule?ae(o,"default",{value:t,enumerable:!0}):o,t)),It=t=>Le(ae({},"__esModule",{value:!0}),t);var To={};Nt(To,{DateinputDemo:()=>P,default:()=>So});module.exports=It(To);var r=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?r(...e):typeof e=="object"?Object.keys(e).map((o,s)=>e[s]||e[o]&&o||null).filter(o=>o!==null).join(" "):e).filter(e=>!!e).join(" ");var y=(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.themeColor}`]:e.themeColor},{"k-rounded-sm":e.rounded==="small","k-rounded-md":e.rounded==="medium","k-rounded-lg":e.rounded==="large","k-rounded-full":e.rounded==="full","k-rounded-none":e.rounded==="none"}),K=(t,e)=>{let{valid:o,invalid:s,hover:n,focus:d,checked:c,active:u,selected:v,disabled:x,indeterminate:N,loading:h,empty:b,readonly:w,highlighted:G,...E}=e;return r({"k-valid":o,"k-invalid":s,"k-hover":n,"k-focus":d,"k-checked":c,"k-active":u,"k-selected":v,"k-disabled":x,"k-indeterminate":N&&!c,"k-loading":h,"k-empty":b,"k-readonly":w,"k-highlighted":G},Object.keys(E).reduce((M,L)=>(L.startsWith("k-")?M[L]=E[L]:M[`k-${L}`]=E[L],M),{}))};function Ce(t,e){if(!e)return{};let o=Array.isArray(e)?e:[e];return Object.fromEntries(o.map(s=>[`k-${s}`,!0]))}var a={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},m={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"},p={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},O={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},l={undefined:void 0,inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",inverse:"inverse"},i={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"};var W="input",se=W;var Ee=require("react/jsx-runtime"),ie="k-input",gt=[i.hover,i.focus,i.valid,i.invalid,i.required,i.disabled,i.loading,i.readonly],vt={size:[a.undefined,a.small,a.medium,a.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[p.undefined,p.solid,p.flat,p.outline]},yt={},S=t=>{let{hover:e,focus:o,disabled:s,invalid:n,valid:d,loading:c,readonly:u,size:v,rounded:x,fillMode:N,...h}=t;return(0,Ee.jsx)("span",{...h,className:r(t.className,ie,y(ie,{size:v,rounded:x,fillMode:N}),K(ie,{hover:e,focus:o,disabled:s,invalid:n,valid:d,loading:c,readonly:u}))})};S.states=gt;S.options=vt;S.className=ie;S.defaultOptions=yt;S.moduleName=W;S.folderName=se;var Ae=require("react/jsx-runtime"),re="k-picker",Mt=[i.hover,i.focus,i.valid,i.invalid,i.required,i.disabled,i.loading,i.readonly],St={size:[a.undefined,a.small,a.medium,a.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[p.undefined,p.solid,p.flat,p.outline]},Tt={},U=t=>{let{hover:e,focus:o,disabled:s,invalid:n,valid:d,loading:c,readonly:u,size:v,rounded:x,fillMode:N,...h}=t;return(0,Ae.jsx)("span",{...h,className:r(t.className,re,y(re,{size:v,rounded:x,fillMode:N}),K(re,{hover:e,focus:o,disabled:s,invalid:n,valid:d,loading:c,readonly:u})),children:t.children})};U.states=Mt;U.options=St;U.className=re;U.defaultOptions=Tt;U.moduleName=W;U.folderName=se;var J=require("react/jsx-runtime"),fe="k-font-icon",kt=[],Ot={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[l.undefined,l.base,l.primary,l.secondary,l.tertiary,l.success,l.warning,l.error,l.info]},Lt={},Q=t=>{let{size:e,themeColor:o,icon:s,rotate:n,flip:d,...c}=t;return s?(0,J.jsx)("span",{...c,className:r(t.className,fe,y(fe,{size:e}),{[`k-i-${s}`]:s,[`k-color-${o}`]:o,[`k-rotate-${n}`]:n,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"}),"aria-hidden":"true"}):(0,J.jsx)(J.Fragment,{})};Q.states=kt;Q.options=Ot;Q.className=fe;Q.defaultOptions=Lt;var Be=Q;var z=require("react/jsx-runtime"),be="k-svg-icon",Ct=[],Et={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[l.undefined,l.base,l.primary,l.secondary,l.tertiary,l.success,l.warning,l.error,l.info],variant:[O.outline,O.solid,O.duotone]},xe={viewBox:"0 0 24 24",variant:O.outline},X=t=>{var h,b;let{size:e,themeColor:o,rotate:s,flip:n,viewBox:d=xe.viewBox,variant:c=xe.variant,icon:u,...v}=t;if(!u)return(0,z.jsx)(z.Fragment,{});if(u==="none")return(0,z.jsx)("span",{...v,className:r(t.className,be,y("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let x=typeof u=="object"&&u.name&&u.name,N=typeof u=="object"?c&&((h=u.variants)==null?void 0:h[c])||((b=u.variants)==null?void 0:b.outline)||u.content:void 0;return(0,z.jsx)("span",{...v,className:r(t.className,be,y("k-icon",{size:e}),{[`k-svg-i-${x}`]:x,[`k-color-${o}`]:o,[`k-rotate-${s}`]:s,"k-flip-h":n==="h"||n==="both","k-flip-v":n==="v"||n==="both"}),"aria-hidden":"true",children:(0,z.jsx)("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof u=="object"?u.viewBox:d,dangerouslySetInnerHTML:N!==void 0?{__html:N}:void 0,children:u?void 0:t.children})})};X.states=Ct;X.options=Et;X.className=be;X.defaultOptions=xe;var Ne=X;var he=ht(require("@progress/kendo-svg-icons"));var Pe="icon",we="icons";var Re=require("react");var ze=require("react"),_e=(0,ze.createContext)({iconsType:"svg"});var C=require("react/jsx-runtime"),le="k-icon",At=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),Bt=[],Pt={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[l.undefined,l.base,l.primary,l.secondary,l.tertiary,l.success,l.warning,l.error,l.info],variant:[O.outline,O.solid,O.duotone]},de={viewBox:"0 0 24 24",type:"svg",variant:O.outline},I=t=>{let{iconsType:e}=(0,Re.useContext)(_e),{size:o,themeColor:s,icon:n,type:d=e||de.type,rotate:c,flip:u,viewBox:v=de.viewBox,variant:x=de.variant,...N}=t;if(!n)return(0,C.jsx)(C.Fragment,{});if((e||d)==="svg"){if(n==="none")return(0,C.jsx)(Ne,{...N,className:r(t.className,le),icon:n,size:o,variant:x});let b=he[n]?n:At(`${n}-icon`);return he[b]?(0,C.jsx)(Ne,{...N,className:r(t.className,le),icon:he[b],size:o,themeColor:s,rotate:c,flip:u,viewBox:v,variant:x}):(0,C.jsx)(C.Fragment,{})}return(0,C.jsx)(Be,{...N,className:r(t.className,le),icon:n,size:o,themeColor:s,rotate:c,flip:u})};I.states=Bt;I.options=Pt;I.defaultOptions=de;I.className=le;I.moduleName=Pe;I.folderName=we;I.ariaSpec={selector:".k-icon, .k-svg-icon",rules:[{selector:".k-icon, .k-svg-icon",attribute:"aria-hidden=true",usage:"Hides the icon element and all its children from assistive technologies."}]};var V=require("react/jsx-runtime"),De="k-clear-value",wt=[i.disabled,i.loading,i.readonly],zt={},_=t=>{let{disabled:e,loading:o,readonly:s,value:n}=t;return e||s||o||!n?(0,V.jsx)(V.Fragment,{}):(0,V.jsx)("span",{className:r(t.className,De),children:(0,V.jsx)(I,{icon:"x"})})};_.states=wt;_.options=zt;_.className=De;var He=require("react/jsx-runtime"),Ie="k-input-inner",_t=[],Rt={},ue={type:"text",autocomplete:"off",value:"",placeholder:""},R=t=>{let{value:e=ue.value,type:o=ue.type,placeholder:s=ue.placeholder,autocomplete:n=ue.autocomplete,disabled:d,readOnly:c,...u}=t;return(0,He.jsx)("input",{...u,type:o,className:r(t.className,Ie,y(Ie,t)),placeholder:s,autoComplete:n,defaultValue:e,disabled:d||void 0,readOnly:c||void 0})};R.states=_t;R.options=Rt;R.className=Ie;var Y=require("react/jsx-runtime"),ge="k-input-inner",Dt=[],Ht={},ve=t=>{let{value:e,placeholder:o,showValue:s,valueIcon:n,valueIconName:d,...c}=t;return(0,Y.jsxs)("span",{...c,className:r(t.className,ge,y(ge,t)),children:[n,!n&&d&&(0,Y.jsx)(I,{className:"k-input-value-icon",icon:d}),s&&!e&&o,s&&e&&(0,Y.jsx)("span",{className:"k-input-value-text",children:e})]})};ve.states=Dt;ve.options=Ht;ve.className=ge;var Ue=require("react/jsx-runtime"),ye="k-input-inner",Kt=[],Ut={},Ke={value:"",placeholder:""},Me=t=>{let{value:e=Ke.value,placeholder:o=Ke.placeholder,rows:s,disabled:n,...d}=t;return(0,Ue.jsx)("textarea",{...d,className:r(t.className,ye,y(ye,t)),placeholder:o,rows:s,defaultValue:e,disabled:n||void 0})};Me.states=Kt;Me.options=Ut;Me.className=ye;var Z=require("react/jsx-runtime"),Ve="k-input-loading-icon",Vt=[i.disabled,i.loading],$=t=>{let{disabled:e,loading:o}=t;return e||!o?(0,Z.jsx)(Z.Fragment,{}):(0,Z.jsx)("span",{className:r(t.className,Ve,"k-icon k-i-loading")})};$.states=Vt;$.className=Ve;var j=require("react/jsx-runtime"),$e="k-input-validation-icon",$t=[i.valid,i.invalid,i.disabled,i.loading],Ft={},D=t=>{let{valid:e,invalid:o,disabled:s,loading:n}=t,d=o?"warning-circle":"check-circle";return s||n||!!!(e||o)?(0,j.jsx)(j.Fragment,{}):(0,j.jsx)(I,{className:r($e),icon:d})};D.states=$t;D.options=Ft;D.className=$e;var ee=require("react/jsx-runtime"),qt="k-input-prefix",Gt={direction:"horizontal"},Fe=t=>{let{direction:e=Gt.direction,...o}=t;return t.children?(0,ee.jsx)("span",{...o,className:r(qt,t.className,{[`k-input-prefix-${e}`]:e}),children:t.children}):(0,ee.jsx)(ee.Fragment,{})};var te=require("react/jsx-runtime"),Wt="k-input-suffix",Jt={direction:"horizontal"},qe=t=>{let{direction:e=Jt.direction,...o}=t;return t.children?(0,te.jsx)("span",{...o,className:r(Wt,t.className,{[`k-input-suffix-${e}`]:e}),children:t.children}):(0,te.jsx)(te.Fragment,{})};var Qt=require("react/jsx-runtime");var Xt=require("react/jsx-runtime");var We=require("react/jsx-runtime"),Ge="k-input-separator",Yt={direction:"vertical"},Se=t=>{let{direction:e=Yt.direction,...o}=t;return(0,We.jsx)("span",{...o,className:r(Ge,t.className,{[`${Ge}-${e}`]:e})})};var Te="button",Je=Te;var T=require("react/jsx-runtime"),oe="k-button",Zt=["icon-button"],jt=[i.hover,i.focus,i.active,i.selected,i.disabled,i.generating],eo={size:[a.undefined,a.xsmall,a.small,a.medium,a.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[p.undefined,p.solid,p.flat,p.outline,p.clear,p.link],themeColor:[l.undefined,l.base,l.primary,l.secondary,l.tertiary,l.success,l.warning,l.error,l.info,l.inverse]},ke={showArrow:!1,arrowIconName:"chevron-down"},f=t=>{let{as:e="button",size:o,rounded:s,fillMode:n,themeColor:d,showArrow:c=ke.showArrow,arrowIconName:u=ke.arrowIconName,variant:v,hover:x,focus:N,active:h,selected:b,disabled:w,togglable:G,ariaDisabled:E,icon:M,iconSize:L,text:H,iconClassName:me,className:lt,...dt}=t,ut=M!=null,pt=t.children!==void 0;return(0,T.jsxs)(e,{className:r(lt,oe,Ce(oe,v),y(oe,{size:o,rounded:s,fillMode:n,themeColor:d}),K(oe,{hover:x,focus:N,active:h,disabled:w||E,selected:b}),{"k-icon-button":!H&&!pt&&ut}),"aria-pressed":G?b?"true":"false":void 0,...dt,"aria-disabled":E?"true":void 0,disabled:w||void 0,children:[typeof M=="string"&&M&&(0,T.jsx)(I,{className:r(me,"k-button-icon"),icon:M,size:L}),M&&typeof M!="string"&&(0,T.jsx)(T.Fragment,{children:M}),H?(0,T.jsxs)(T.Fragment,{children:[H&&(0,T.jsx)("span",{className:"k-button-text",children:H}),t.children]}):t.children&&(0,T.jsx)("span",{className:"k-button-text",children:t.children}),c&&(0,T.jsx)("span",{className:"k-menu-button-arrow k-button-arrow",children:(0,T.jsx)(I,{icon:u})})]})};f.states=jt;f.options=eo;f.variants=Zt;f.className=oe;f.defaultOptions=ke;f.moduleName=Te;f.folderName=Je;f.ariaSpec={selector:".k-button",rules:[{selector:".k-button",attribute:"role=button or nodeName=button",usage:"The button role is implicit from the native <button> element."},{selector:".k-button",attribute:"aria-label (when icon-only)",usage:"Required for icon-only buttons that have no visible text."},{selector:".k-button",attribute:"aria-pressed (when togglable)",usage:"Indicates the pressed state of a toggle button."},{selector:".k-button",attribute:"disabled (when disabled)",usage:"Rendered when the button is disabled."}]};var Qe=require("react/jsx-runtime"),pe=t=>(0,Qe.jsx)(f,{children:"Button",...t});var g=require("react/jsx-runtime"),to=S.states,oo=S.defaultOptions,no=S.options,ao=[{name:"prefix",title:"Prefix"},{name:"suffix",title:"Suffix"},{name:"clear-button",title:"`Clear` Button"},{name:"validation-icon",title:"Validation Icon"},{name:"separators",title:"Separators"}],so=[],F=t=>{let{modifiers:e,valid:o,invalid:s,loading:n,disabled:d,readonly:c,...u}=t,v=e==null?void 0:e.prefix,x=e==null?void 0:e.suffix,N=e==null?void 0:e["clear-button"],h=e==null?void 0:e["validation-icon"],b=e==null?void 0:e.separators;return(0,g.jsxs)(S,{...u,valid:o,invalid:s,loading:n,disabled:d,readonly:c,style:{width:300},children:[v&&(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(Fe,{children:(0,g.jsx)(I,{icon:"lock"})}),b&&(0,g.jsx)(Se,{})]}),(0,g.jsx)(R,{placeholder:"Placeholder",value:"Value"}),h&&(0,g.jsx)(D,{valid:o,invalid:s,loading:n,disabled:d}),(0,g.jsx)($,{loading:n,disabled:d}),N&&(0,g.jsx)(_,{loading:n,disabled:d,readonly:c,value:"Value"}),x&&(0,g.jsxs)(g.Fragment,{children:[b&&(0,g.jsx)(Se,{}),(0,g.jsx)(qe,{children:(0,g.jsx)(pe,{size:u.size,fillMode:"clear",children:"Send"})})]})]})};F.options=no;F.states=to;F.variants=so;F.defaultOptions=oo;F.modifiers=ao;F.className=S.className;var Ye=require("react/jsx-runtime"),Xe=t=>(0,Ye.jsx)(f,{icon:"folder",...t,"aria-label":t["aria-label"]||"Folder",children:void 0});var je=require("react/jsx-runtime"),Ze=t=>(0,je.jsx)(f,{icon:"folder",children:"Button",...t});var ce=require("react/jsx-runtime"),io=f.options,ro=f.states,lo={...f.defaultOptions,variant:"text"},uo=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],po=[],q=t=>{let{variant:e,...o}=t;switch(e){case"icon-only":return(0,ce.jsx)(Xe,{...o,icon:"star"});case"icon-and-text":return(0,ce.jsx)(Ze,{...o,icon:"star",children:"Button"});default:return(0,ce.jsx)(pe,{...o,children:"Button"})}};q.options=io;q.states=ro;q.variants=uo;q.defaultOptions=lo;q.modifiers=po;q.className=f.className;var ne=require("react/jsx-runtime"),et="k-spin-button",fo=[],bo={size:[a.undefined,a.small,a.medium,a.large],fillMode:[p.undefined,p.solid,p.flat,p.outline,p.clear,p.link]},Oe={increaseLabel:"Increase value",decreaseLabel:"Decrease value"},A=t=>{let{size:e,fillMode:o,disabled:s,increaseLabel:n=Oe.increaseLabel,decreaseLabel:d=Oe.decreaseLabel,...c}=t;return(0,ne.jsxs)("span",{...c,className:r(et,t.className),children:[(0,ne.jsx)(f,{className:"k-spinner-increase",icon:"chevron-up",size:e,fillMode:o,disabled:s,"aria-label":n}),(0,ne.jsx)(f,{className:"k-spinner-decrease",icon:"chevron-down",size:e,fillMode:o,disabled:s,"aria-label":d})]})};A.states=fo;A.options=bo;A.className=et;A.defaultOptions=Oe;A.moduleName=null;A.folderName=null;var tt="date-input",ot="dateinput";var B=require("react/jsx-runtime"),nt="k-dateinput",xo=[i.hover,i.focus,i.valid,i.invalid,i.required,i.disabled,i.loading,i.readonly],No={size:[a.undefined,a.small,a.medium,a.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[p.undefined,p.solid,p.flat,p.outline]},ho={},k=t=>{let{size:e,rounded:o,fillMode:s,value:n,placeholder:d,hover:c,focus:u,valid:v,invalid:x,required:N,loading:h,disabled:b,readonly:w,showClearButton:G,showSpinButton:E,id:M,"aria-label":L,"aria-describedby":H,...me}=t;return(0,B.jsxs)(S,{...me,size:e,rounded:o,fillMode:s,hover:c,focus:u,valid:v,invalid:x,required:N,loading:h,disabled:b,readonly:w,className:r(t.className,nt),children:[(0,B.jsx)(R,{id:M,placeholder:d,value:n,disabled:b,"aria-label":L,"aria-describedby":H,"aria-invalid":x?"true":void 0}),(0,B.jsx)(D,{valid:v,invalid:x,loading:h,disabled:b}),(0,B.jsx)($,{loading:h,disabled:b}),G&&(0,B.jsx)(_,{loading:h,disabled:b,readonly:w,value:n}),E&&(0,B.jsx)(A,{className:"k-input-spinner",size:e,fillMode:s,disabled:b})]})};k.states=xo;k.options=No;k.className=nt;k.defaultOptions=ho;k.moduleName=tt;k.folderName=ot;k.ariaSpec={selector:".k-dateinput",rules:[{selector:".k-dateinput > .k-input-inner",attribute:"role=textbox or nodeName=input",usage:'The element should be an input or have role="textbox".'},{selector:".k-dateinput > .k-input-inner",attribute:"label for or aria-label or aria-labelledby (when has accessible name)",usage:"The input requires an accessible name (provided by consuming app)."},{selector:".k-dateinput > .k-input-inner",attribute:"tabindex=0",usage:"The element should be focusable."},{selector:".k-dateinput > .k-input-inner",attribute:"aria-invalid=true (when invalid)",usage:"Rendered when the DateInput is in an invalid state."},{selector:".k-dateinput > .k-input-inner",attribute:"aria-describedby (when has hint or error)",usage:"Points to the hint or error message."},{selector:".k-dateinput > .k-input-inner",attribute:"readonly=readonly or aria-readonly=true (when readonly)",usage:"Rendered when the DateInput is readonly."},{selector:".k-dateinput.k-disabled > .k-input-inner",attribute:"disabled=disabled or aria-disabled=true",usage:"Rendered when the DateInput is disabled."}]};var at=k;var it=require("react/jsx-runtime"),st=t=>(0,it.jsx)(at,{...t});var rt=require("react/jsx-runtime"),Io=k.options,go=k.states,vo=k.defaultOptions,yo=[{name:"spin-button",title:"`Spin` Button"}],Mo=[],P=t=>{let{modifiers:e,...o}=t,s={};return Object.keys(e||{}).forEach(n=>{n==="spin-button"&&(s.showSpinButton=!!(e!=null&&e[n]))}),(0,rt.jsx)(st,{value:"2/04/2021",style:{width:"300px"},...o,...s})};P.options=Io;P.states=go;P.variants=Mo;P.defaultOptions=vo;P.modifiers=yo;P.className=k.className;var So=P;