@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 36.6 kB
JavaScript
var a=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?a(...t):typeof t=="object"?Object.keys(t).map((o,i)=>t[i]||t[o]&&o||null).filter(o=>o!==null).join(" "):t).filter(t=>!!t).join(" ");var A=(e,t)=>a({[`${e}-xs`]:t.size==="xsmall",[`${e}-sm`]:t.size==="small",[`${e}-md`]:t.size==="medium",[`${e}-lg`]:t.size==="large",[`${e}-xl`]:t.size==="xlarge",[`${e}-xxl`]:t.size==="xxlarge",[`${e}-xxxl`]:t.size==="xxxlarge"},{[`${e}-${t.fillMode}`]:t.fillMode},{[`${e}-${t.themeColor}`]:t.themeColor},{"k-rounded-sm":t.rounded==="small","k-rounded-md":t.rounded==="medium","k-rounded-lg":t.rounded==="large","k-rounded-full":t.rounded==="full","k-rounded-none":t.rounded==="none"}),M=(e,t)=>{let{valid:o,invalid:i,hover:n,focus:r,checked:c,active:d,selected:b,disabled:x,indeterminate:h,loading:L,empty:y,readonly:$,highlighted:H,...v}=t;return a({"k-valid":o,"k-invalid":i,"k-hover":n,"k-focus":r,"k-checked":c,"k-active":d,"k-selected":b,"k-disabled":x,"k-indeterminate":h&&!c,"k-loading":L,"k-empty":y,"k-readonly":$,"k-highlighted":H},Object.keys(v).reduce((E,I)=>(I.startsWith("k-")?E[I]=v[I]:E[`k-${I}`]=v[I],E),{}))};function Jt(e,t){if(!t)return{};let o=Array.isArray(t)?t:[t];return Object.fromEntries(o.map(i=>[`k-${i}`,!0]))}var l={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"},T={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},X={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},u={undefined:void 0,inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",inverse:"inverse"},s={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 et={};function Wt(e){return et[e]=(et[e]||0)+1,`k-${e}-${et[e]}`}import{Fragment as ta,jsx as qt}from"react/jsx-runtime";var tt="k-font-icon",Zo=[],jo={size:[l.undefined,l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[u.undefined,u.base,u.primary,u.secondary,u.tertiary,u.success,u.warning,u.error,u.info]},ea={},Re=e=>{let{size:t,themeColor:o,icon:i,rotate:n,flip:r,...c}=e;return i?qt("span",{...c,className:a(e.className,tt,A(tt,{size:t}),{[`k-i-${i}`]:i,[`k-color-${o}`]:o,[`k-rotate-${n}`]:n,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),"aria-hidden":"true"}):qt(ta,{})};Re.states=Zo;Re.options=jo;Re.className=tt;Re.defaultOptions=ea;var Yt=Re;import{Fragment as na,jsx as ze}from"react/jsx-runtime";var ot="k-svg-icon",oa=[],aa={size:[l.undefined,l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[u.undefined,u.base,u.primary,u.secondary,u.tertiary,u.success,u.warning,u.error,u.info],variant:[X.outline,X.solid,X.duotone]},at={viewBox:"0 0 24 24",variant:X.outline},Oe=e=>{let{size:t,themeColor:o,rotate:i,flip:n,viewBox:r=at.viewBox,variant:c=at.variant,icon:d,...b}=e;if(!d)return ze(na,{});if(d==="none")return ze("span",{...b,className:a(e.className,ot,A("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let x=typeof d=="object"&&d.name&&d.name,h=typeof d=="object"?c&&d.variants?.[c]||d.variants?.outline||d.content:void 0;return ze("span",{...b,className:a(e.className,ot,A("k-icon",{size:t}),{[`k-svg-i-${x}`]:x,[`k-color-${o}`]:o,[`k-rotate-${i}`]:i,"k-flip-h":n==="h"||n==="both","k-flip-v":n==="v"||n==="both"}),"aria-hidden":"true",children:ze("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof d=="object"?d.viewBox:r,dangerouslySetInnerHTML:h!==void 0?{__html:h}:void 0,children:d?void 0:e.children})})};Oe.states=oa;Oe.options=aa;Oe.className=ot;Oe.defaultOptions=at;var nt=Oe;import*as st from"@progress/kendo-svg-icons";var Qt="icon",Zt="icons";import{useContext as ia}from"react";import{createContext as sa}from"react";var jt=sa({iconsType:"svg"});import{Fragment as eo,jsx as we}from"react/jsx-runtime";var Fe="k-icon",la=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),ra=[],da={size:[l.undefined,l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[u.undefined,u.base,u.primary,u.secondary,u.tertiary,u.success,u.warning,u.error,u.info],variant:[X.outline,X.solid,X.duotone]},Ue={viewBox:"0 0 24 24",type:"svg",variant:X.outline},N=e=>{let{iconsType:t}=ia(jt),{size:o,themeColor:i,icon:n,type:r=t||Ue.type,rotate:c,flip:d,viewBox:b=Ue.viewBox,variant:x=Ue.variant,...h}=e;if(!n)return we(eo,{});if((t||r)==="svg"){if(n==="none")return we(nt,{...h,className:a(e.className,Fe),icon:n,size:o,variant:x});let y=st[n]?n:la(`${n}-icon`);return st[y]?we(nt,{...h,className:a(e.className,Fe),icon:st[y],size:o,themeColor:i,rotate:c,flip:d,viewBox:b,variant:x}):we(eo,{})}return we(Yt,{...h,className:a(e.className,Fe),icon:n,size:o,themeColor:i,rotate:c,flip:d})};N.states=ra;N.options=da;N.defaultOptions=Ue;N.className=Fe;N.moduleName=Qt;N.folderName=Zt;N.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 it="button",to=it;import{Fragment as oo,jsx as ue,jsxs as ao}from"react/jsx-runtime";var ke="k-button",ca=["icon-button"],pa=[s.hover,s.focus,s.active,s.selected,s.disabled,s.generating],ma={size:[l.undefined,l.xsmall,l.small,l.medium,l.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[T.undefined,T.solid,T.flat,T.outline,T.clear,T.link],themeColor:[u.undefined,u.base,u.primary,u.secondary,u.tertiary,u.success,u.warning,u.error,u.info,u.inverse]},lt={showArrow:!1,arrowIconName:"chevron-down"},f=e=>{let{as:t="button",size:o,rounded:i,fillMode:n,themeColor:r,showArrow:c=lt.showArrow,arrowIconName:d=lt.arrowIconName,variant:b,hover:x,focus:h,active:L,selected:y,disabled:$,togglable:H,ariaDisabled:v,icon:E,iconSize:I,text:K,iconClassName:me,className:Me,...ge}=e,Ie=E!=null,te=e.children!==void 0;return ao(t,{className:a(Me,ke,Jt(ke,b),A(ke,{size:o,rounded:i,fillMode:n,themeColor:r}),M(ke,{hover:x,focus:h,active:L,disabled:$||v,selected:y}),{"k-icon-button":!K&&!te&&Ie}),"aria-pressed":H?y?"true":"false":void 0,...ge,"aria-disabled":v?"true":void 0,disabled:$||void 0,children:[typeof E=="string"&&E&&ue(N,{className:a(me,"k-button-icon"),icon:E,size:I}),E&&typeof E!="string"&&ue(oo,{children:E}),K?ao(oo,{children:[K&&ue("span",{className:"k-button-text",children:K}),e.children]}):e.children&&ue("span",{className:"k-button-text",children:e.children}),c&&ue("span",{className:"k-menu-button-arrow k-button-arrow",children:ue(N,{icon:d})})]})};f.states=pa;f.options=ma;f.variants=ca;f.className=ke;f.defaultOptions=lt;f.moduleName=it;f.folderName=to;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."}]};import{jsx as ua}from"react/jsx-runtime";var Ve=e=>ua(f,{icon:"folder",...e,"aria-label":e["aria-label"]||"Folder",children:void 0});import{jsx as ba}from"react/jsx-runtime";var no=e=>ba(f,{icon:"folder",children:"Button",...e});import{jsx as Ta}from"react/jsx-runtime";var pe=e=>Ta(f,{children:"Button",...e});import{jsx as rt}from"react/jsx-runtime";var fa=f.options,xa=f.states,ha={...f.defaultOptions,variant:"text"},Na=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],La=[],be=e=>{let{variant:t,...o}=e;switch(t){case"icon-only":return rt(Ve,{...o,icon:"star"});case"icon-and-text":return rt(no,{...o,icon:"star",children:"Button"});default:return rt(pe,{...o,children:"Button"})}};be.options=fa;be.states=xa;be.variants=Na;be.defaultOptions=ha;be.modifiers=La;be.className=f.className;var De="input",Ge=De;import{jsx as va}from"react/jsx-runtime";var $e="k-input",Aa=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading,s.readonly],Sa={size:[l.undefined,l.small,l.medium,l.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[T.undefined,T.solid,T.flat,T.outline]},ya={},g=e=>{let{hover:t,focus:o,disabled:i,invalid:n,valid:r,loading:c,readonly:d,size:b,rounded:x,fillMode:h,...L}=e;return va("span",{...L,className:a(e.className,$e,A($e,{size:b,rounded:x,fillMode:h}),M($e,{hover:t,focus:o,disabled:i,invalid:n,valid:r,loading:c,readonly:d}))})};g.states=Aa;g.options=Sa;g.className=$e;g.defaultOptions=ya;g.moduleName=De;g.folderName=Ge;import{jsx as Ia}from"react/jsx-runtime";var Xe="k-picker",Ea=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading,s.readonly],Ma={size:[l.undefined,l.small,l.medium,l.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[T.undefined,T.solid,T.flat,T.outline]},ga={},Te=e=>{let{hover:t,focus:o,disabled:i,invalid:n,valid:r,loading:c,readonly:d,size:b,rounded:x,fillMode:h,...L}=e;return Ia("span",{...L,className:a(e.className,Xe,A(Xe,{size:b,rounded:x,fillMode:h}),M(Xe,{hover:t,focus:o,disabled:i,invalid:n,valid:r,loading:c,readonly:d})),children:e.children})};Te.states=Ea;Te.options=Ma;Te.className=Xe;Te.defaultOptions=ga;Te.moduleName=De;Te.folderName=Ge;import{Fragment as wa,jsx as dt}from"react/jsx-runtime";var so="k-clear-value",Ra=[s.disabled,s.loading,s.readonly],Oa={},_=e=>{let{disabled:t,loading:o,readonly:i,value:n}=e;return t||i||o||!n?dt(wa,{}):dt("span",{className:a(e.className,so),children:dt(N,{icon:"x"})})};_.states=Ra;_.options=Oa;_.className=so;import{jsx as Ca}from"react/jsx-runtime";var ct="k-input-inner",ka=[],Da={},Je={type:"text",autocomplete:"off",value:"",placeholder:""},P=e=>{let{value:t=Je.value,type:o=Je.type,placeholder:i=Je.placeholder,autocomplete:n=Je.autocomplete,disabled:r,readOnly:c,...d}=e;return Ca("input",{...d,type:o,className:a(e.className,ct,A(ct,e)),placeholder:i,autoComplete:n,defaultValue:t,disabled:r||void 0,readOnly:c||void 0})};P.states=ka;P.options=Da;P.className=ct;import{jsx as io,jsxs as _a}from"react/jsx-runtime";var pt="k-input-inner",Ha=[],Ka={},mt=e=>{let{value:t,placeholder:o,showValue:i,valueIcon:n,valueIconName:r,...c}=e;return _a("span",{...c,className:a(e.className,pt,A(pt,e)),children:[n,!n&&r&&io(N,{className:"k-input-value-icon",icon:r}),i&&!t&&o,i&&t&&io("span",{className:"k-input-value-text",children:t})]})};mt.states=Ha;mt.options=Ka;mt.className=pt;import{jsx as za}from"react/jsx-runtime";var ut="k-input-inner",Pa=[],Ba={},lo={value:"",placeholder:""},bt=e=>{let{value:t=lo.value,placeholder:o=lo.placeholder,rows:i,disabled:n,...r}=e;return za("textarea",{...r,className:a(e.className,ut,A(ut,e)),placeholder:o,rows:i,defaultValue:t,disabled:n||void 0})};bt.states=Pa;bt.options=Ba;bt.className=ut;import{Fragment as Ua,jsx as ro}from"react/jsx-runtime";var co="k-input-loading-icon",Fa=[s.disabled,s.loading],J=e=>{let{disabled:t,loading:o}=e;return t||!o?ro(Ua,{}):ro("span",{className:a(e.className,co,"k-icon k-i-loading")})};J.states=Fa;J.className=co;import{Fragment as $a,jsx as po}from"react/jsx-runtime";var mo="k-input-validation-icon",Va=[s.valid,s.invalid,s.disabled,s.loading],Ga={},B=e=>{let{valid:t,invalid:o,disabled:i,loading:n}=e,r=o?"warning-circle":"check-circle";return i||n||!!!(t||o)?po($a,{}):po(N,{className:a(mo),icon:r})};B.states=Va;B.options=Ga;B.className=mo;import{Fragment as Wa,jsx as uo}from"react/jsx-runtime";var Xa="k-input-prefix",Ja={direction:"horizontal"},fe=e=>{let{direction:t=Ja.direction,...o}=e;return e.children?uo("span",{...o,className:a(Xa,e.className,{[`k-input-prefix-${t}`]:t}),children:e.children}):uo(Wa,{})};import{Fragment as Qa,jsx as bo}from"react/jsx-runtime";var qa="k-input-suffix",Ya={direction:"horizontal"},xe=e=>{let{direction:t=Ya.direction,...o}=e;return e.children?bo("span",{...o,className:a(qa,e.className,{[`k-input-suffix-${t}`]:t}),children:e.children}):bo(Qa,{})};import{jsx as Kl}from"react/jsx-runtime";import{jsx as zl}from"react/jsx-runtime";import{jsx as ja}from"react/jsx-runtime";var To="k-input-separator",Za={direction:"vertical"},j=e=>{let{direction:t=Za.direction,...o}=e;return ja("span",{...o,className:a(To,e.className,{[`${To}-${t}`]:t})})};import{Fragment as fo,jsx as W,jsxs as Tt}from"react/jsx-runtime";var en=g.states,tn=g.defaultOptions,on=g.options,an=[{name:"prefix",title:"Prefix"},{name:"suffix",title:"Suffix"},{name:"clear-button",title:"`Clear` Button"},{name:"validation-icon",title:"Validation Icon"},{name:"separators",title:"Separators"}],nn=[],he=e=>{let{modifiers:t,valid:o,invalid:i,loading:n,disabled:r,readonly:c,...d}=e,b=t?.prefix,x=t?.suffix,h=t?.["clear-button"],L=t?.["validation-icon"],y=t?.separators;return Tt(g,{...d,valid:o,invalid:i,loading:n,disabled:r,readonly:c,style:{width:300},children:[b&&Tt(fo,{children:[W(fe,{children:W(N,{icon:"lock"})}),y&&W(j,{})]}),W(P,{placeholder:"Placeholder",value:"Value"}),L&&W(B,{valid:o,invalid:i,loading:n,disabled:r}),W(J,{loading:n,disabled:r}),h&&W(_,{loading:n,disabled:r,readonly:c,value:"Value"}),x&&Tt(fo,{children:[y&&W(j,{}),W(xe,{children:W(pe,{size:d.size,fillMode:"clear",children:"Send"})})]})]})};he.options=on;he.states=en;he.variants=nn;he.defaultOptions=tn;he.modifiers=an;he.className=g.className;var ft="popup",xo=ft;import{jsx as ho}from"react/jsx-runtime";var No="k-animation-container",sn=[],ln={},xt={positionMode:"absolute",shown:!0},q=e=>{let{positionMode:t=xt.positionMode,shown:o=xt.shown,animationStyle:i,offset:n,...r}=e;return ho("div",{...r,style:{...n,...e.style},className:a(e.className,No,{"k-animation-container-shown":o,"k-animation-container-fixed":t==="fixed"}),children:ho("div",{className:"k-child-animation-container",style:i,children:e.children})})};q.states=sn;q.options=ln;q.className=No;q.defaultOptions=xt;q.moduleName=ft;q.folderName=xo;var ht="popup",Lo=ht;import{jsx as Ao}from"react/jsx-runtime";var So="k-popup",rn=[],dn={},yo={positionMode:"absolute"},ee=e=>{let{offset:t,positionMode:o=yo.positionMode,animationStyle:i,containerClassName:n,containerRole:r,containerAriaLabel:c,...d}=e;return Ao(q,{positionMode:o,offset:t,animationStyle:i,className:n,role:r,"aria-label":c,children:Ao("div",{...d,className:a(e.className,So),children:e.children})})};ee.states=rn;ee.options=dn;ee.className=So;ee.defaultOptions=yo;ee.moduleName=ht;ee.folderName=Lo;ee.ariaSpec={selector:".k-popup",rules:[{selector:".k-animation-container",attribute:"role (when appended to body)",usage:'Container gets role="region" when appended to document body. Popup is a building block \u2014 ARIA semantics come from consuming components.'}]};var Nt="action-buttons",vo=Nt;import{jsx as mn}from"react/jsx-runtime";var We="k-actions",cn=[],pn={},Lt={alignment:"start",orientation:"horizontal"},oe=e=>{let{alignment:t=Lt.alignment,orientation:o=Lt.orientation,...i}=e;return mn("div",{...i,className:a(We,{[`${We}-${t}`]:t,[`${We}-${o}`]:o},e.className),children:e.children})};oe.states=cn;oe.options=pn;oe.className=We;oe.defaultOptions=Lt;oe.moduleName=Nt;oe.folderName=vo;import{jsx as bn}from"react/jsx-runtime";var un="k-actionsheet-footer",Eo={alignment:"stretched",orientation:"horizontal"},Ne=e=>{let{alignment:t=Eo.alignment,orientation:o=Eo.orientation,template:i,as:n=i?"div":oe,...r}=e;return bn(n,{...r,...!i&&{alignment:t,orientation:o},className:a(e.className,un),children:e.children})};var At="searchbox",Mo=At;import{jsx as Ce,jsxs as xn}from"react/jsx-runtime";var go="k-searchbox",Tn=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading],fn={size:[l.undefined,l.small,l.medium,l.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[T.undefined,T.solid,T.flat,T.outline]},St={showIcon:!0,icon:"search"},ae=e=>{let{value:t,placeholder:o,size:i,rounded:n,fillMode:r,hover:c,focus:d,valid:b,invalid:x,required:h,loading:L,disabled:y,showIcon:$=St.showIcon,icon:H=St.icon,"aria-label":v,...E}=e;return xn(g,{...E,size:i,rounded:n,fillMode:r,hover:c,focus:d,valid:b,invalid:x,required:h,loading:L,disabled:y,className:a(e.className,go),children:[$&&Ce(N,{className:"k-input-icon",icon:H}),Ce(P,{placeholder:o,value:t,"aria-label":v}),Ce(J,{...e}),Ce(B,{...e}),Ce(_,{...e})]})};ae.states=Tn;ae.options=fn;ae.className=go;ae.defaultOptions=St;ae.moduleName=At;ae.folderName=Mo;import{jsx as od}from"react/jsx-runtime";var yt="textbox",Io=yt;import{Fragment as Ro,jsx as ne,jsxs as vt}from"react/jsx-runtime";var Oo="k-textbox",hn=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading,s.readonly],Nn={size:[l.undefined,l.small,l.medium,l.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[T.undefined,T.solid,T.flat,T.outline]},qe={showClearButton:!0,showValidationIcon:!0,separators:!0},D=e=>{let{size:t,rounded:o,fillMode:i,separators:n=qe.separators,showClearButton:r=qe.showClearButton,showValidationIcon:c=qe.showValidationIcon,prefix:d,suffix:b,type:x,value:h,placeholder:L,hover:y,focus:$,valid:H,invalid:v,required:E,loading:I,disabled:K,readonly:me,id:Me,"aria-label":ge,"aria-describedby":Ie,...te}=e;return vt(g,{...te,size:t,rounded:o,fillMode:i,hover:y,focus:$,valid:H,invalid:v,required:E,loading:I,disabled:K,readonly:me,className:a(e.className,Oo),children:[d&&vt(Ro,{children:[ne(fe,{children:d}),n&&ne(j,{})]}),ne(P,{id:Me,placeholder:L,value:h,type:x,disabled:K,"aria-label":ge,"aria-describedby":Ie,"aria-invalid":v?"true":void 0}),c&&ne(B,{valid:H,invalid:v,loading:I,disabled:K}),ne(J,{loading:I,disabled:K}),r&&ne(_,{loading:I,disabled:K,readonly:me,value:h}),b&&vt(Ro,{children:[n&&ne(j,{}),ne(xe,{children:b})]})]})};D.states=hn;D.options=Nn;D.className=Oo;D.defaultOptions=qe;D.moduleName=yt;D.folderName=Io;D.ariaSpec={selector:".k-textbox",rules:[{selector:".k-textbox > .k-input-inner",attribute:"role=textbox or nodeName=input",usage:"Describes the role of the component."},{selector:".k-textbox > .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-textbox > .k-input-inner",attribute:"aria-invalid=true (when invalid)",usage:"Rendered when the TextBox is in an invalid state."},{selector:".k-textbox > .k-input-inner",attribute:"aria-describedby (when has hint or error)",usage:"Points to the hint or error message for the input."},{selector:".k-textbox.k-disabled > .k-input-inner",attribute:"disabled=disabled or aria-disabled=true",usage:"Rendered when the TextBox is disabled."}]};var He=D;import{jsx as Ln}from"react/jsx-runtime";var wo=e=>Ln(He,{...e});import{Fragment as Ld,jsx as Nd}from"react/jsx-runtime";import{Fragment as Md,jsx as Ed}from"react/jsx-runtime";import{jsx as Od}from"react/jsx-runtime";import{jsx as Et}from"react/jsx-runtime";var An=D.states,Sn=D.defaultOptions,yn=D.options,vn=[{name:"prefix",title:"Prefix"},{name:"suffix",title:"Suffix"},{name:"clear-button",title:"`Clear` Button"}],En=[],Le=e=>{let{modifiers:t,...o}=e,i={};return Object.keys(t||{}).forEach(n=>{switch(n){case"prefix":i.prefix=t?.[n]?Et(N,{icon:"lock"}):void 0;break;case"suffix":i.suffix=t?.[n]?Et(pe,{size:o.size,fillMode:"clear",children:"Send"}):void 0;break;case"clear-button":i.showClearButton=t?.[n];break;default:break}}),Et(wo,{value:"Value",style:{width:300},...o,...i})};Le.options=yn;Le.states=An;Le.variants=En;Le.defaultOptions=Sn;Le.modifiers=vn;Le.className=D.className;import{jsx as se,jsxs as Mt}from"react/jsx-runtime";var ko="k-actionsheet-titlebar",Mn={},z=e=>{let{title:t,subtitle:o,actionsStart:i,actionsEnd:n,filter:r,input:c,inputValue:d,inputPlaceholder:b,adaptive:x,titleId:h,children:L,...y}=e;return Mt("div",{...y,className:a(e.className,ko),children:[Mt("div",{className:"k-actionsheet-titlebar-group",children:[i&&se("div",{className:"k-actionsheet-actions",children:i}),!L&&Mt("div",{className:"k-actionsheet-title",id:h,children:[t&&se("div",{className:"k-text-center",children:t}),o&&se("div",{className:"k-actionsheet-subtitle k-text-center",children:o})]}),L&&se("div",{className:"k-actionsheet-title",id:h,children:L}),n&&se("div",{className:"k-actionsheet-actions",children:n})]}),(c||r)&&se("div",{className:"k-actionsheet-titlebar-group k-actionsheet-filter",children:c?se(D,{value:d,placeholder:b,size:x?"large":"medium","aria-label":t||b||"Input"}):se(ae,{placeholder:"Filter",size:x?"large":"medium","aria-label":"Filter options"})})]})};z.className=ko;z.defaultOptions=Mn;import{jsx as gt,jsxs as On}from"react/jsx-runtime";var It="k-actionsheet-view",gn=[],In={},Rn={},Ae=e=>{let{adaptive:t,animated:o,children:i,header:n,footer:r,titleId:c,...d}=e,b=n?.type===z&>(z,{adaptive:t,titleId:c,...n?.props}),x=r?.type===Ne&>(Ne,{...r?.props});return On("div",{...d,className:a(e.className,It,{[`${It}-animated`]:o}),children:[b,gt("div",{className:"k-actionsheet-content",children:i}),x]})};Ae.states=gn;Ae.options=In;Ae.className=It;Ae.defaultOptions=Rn;var Ke="action-sheet",Ye=Ke;var Rt="overlay",Do=Rt;import{jsx as Cn}from"react/jsx-runtime";var Co="k-overlay",wn=[],kn={},Dn={},ie=e=>{let{...t}=e;return Cn("div",{...t,className:a(e.className,Co),children:e.children})};ie.states=wn;ie.options=kn;ie.className=Co;ie.defaultOptions=Dn;ie.moduleName=Rt;ie.folderName=Do;import{jsx as Qe,jsxs as _n}from"react/jsx-runtime";var Ho="k-actionsheet",Hn=[],Kn={},_e={side:"bottom",fullscreen:!1,adaptive:!1,overlay:!0},R=e=>{let{side:t=_e.side,fullscreen:o=_e.fullscreen,adaptive:i=_e.adaptive,overlay:n=_e.overlay,template:r,children:c,header:d,footer:b,id:x,...h}=e,L=x&&!r&&d?`${x}-title`:void 0;return _n("div",{className:"k-actionsheet-container",children:[n&&Qe(ie,{}),Qe(q,{animationStyle:{[`${o===!0?"top":t}`]:0,[`${o===!0?"width":null}`]:"100%",[`${o===!0?"height":null}`]:"100%",[`${t==="top"||t==="bottom"?"width":null}`]:"100%",[`${t==="left"||t==="right"?"height":null}`]:"100%"},children:Qe("div",{...h,id:x,role:"dialog","aria-modal":n?"true":void 0,"aria-labelledby":L,className:a(e.className,Ho,{[`k-actionsheet-${t}`]:o===!1,"k-actionsheet-fullscreen":o===!0,"k-adaptive-actionsheet":i}),children:r||Qe(Ae,{header:d,footer:b,adaptive:i,titleId:L,...e,children:c})})})]})};R.states=Hn;R.options=Kn;R.className=Ho;R.defaultOptions=_e;R.moduleName=Ke;R.folderName=Ye;R.ariaSpec={selector:".k-actionsheet",rules:[{selector:".k-actionsheet",attribute:"role=dialog",usage:"Announces the dialog role of the component."},{selector:".k-actionsheet",attribute:"aria-labelledby (when has title)",usage:"Associates the title of the action sheet."},{selector:".k-actionsheet",attribute:"aria-hidden=true/false (when hidden)",usage:"Announces the hidden state of the ActionSheet container."},{selector:".k-actionsheet",attribute:"aria-modal=true (when modal)",usage:"Announces that the action sheet is modal."},{selector:".k-actionsheet .k-actionsheet-title",attribute:"id",usage:"Used to associate the title with the action sheet wrapper element."}]};import{jsx as Fn}from"react/jsx-runtime";var Ko="k-actionsheet-container",Pn=[],Bn={},zn={},Se=e=>{let{children:t,...o}=e;return Fn("div",{...o,className:Ko,children:t})};Se.states=Pn;Se.options=Bn;Se.className=Ko;Se.defaultOptions=zn;Se.moduleName=Ke;Se.folderName=Ye;import{jsx as Un}from"react/jsx-runtime";var Ot=e=>{let{...t}=e;return Un("div",{...t,className:a(e.className,"k-list-ul"),children:e.children})};import{Fragment as Gn,jsx as Pe,jsxs as wt}from"react/jsx-runtime";var kt="k-actionsheet-item",Vn=[s.hover,s.focus,s.selected,s.disabled],le=e=>{let{iconName:t,text:o,description:i,hover:n,focus:r,selected:c,disabled:d,...b}=e;return wt("span",{...b,className:a(e.className,kt,M(kt,{hover:n,focus:r,selected:c,disabled:d})),children:[!e.children&&Pe(Gn,{children:wt("span",{className:"k-actionsheet-action",children:[t&&Pe("span",{className:"k-icon-wrap",children:Pe(N,{className:"k-actionsheet-item-icon",icon:t})}),wt("span",{className:"k-actionsheet-item-text",children:[o&&Pe("span",{className:"k-actionsheet-item-title",children:o}),i&&Pe("span",{className:"k-actionsheet-item-description",children:i})]})]})}),e.children]})};le.states=Vn;le.className=kt;import{jsx as Rc,jsxs as Oc}from"react/jsx-runtime";import{jsx as Cc}from"react/jsx-runtime";import{jsx as Pc}from"react/jsx-runtime";import{jsx as Uc}from"react/jsx-runtime";import{jsx as O,jsxs as Dt}from"react/jsx-runtime";var $n=R.options,Xn=R.states,Po={...R.defaultOptions,variant:"normal"},Jn=[{name:"normal",title:"Normal"},{name:"adaptive",title:"Adaptive"},{name:"fullScreen",title:"Full Screen"}],Wn=[{name:"actions",title:"Titlebar Actions",type:"boolean"},{name:"subtitle",title:"Subtitle",type:"boolean"},{name:"footer",title:"Footer",type:"boolean"}],ye=e=>{let{variant:t,modifiers:o,...i}={...Po,...e},n={},r=Dt(Ot,{children:[O(le,{text:"Edit Item",description:"Click to edit",iconName:"edit-tools"}),O(le,{text:"Add to Favorites",iconName:"heart"}),O(le,{text:"Upload New",iconName:"upload",disabled:!0}),O("hr",{className:"k-hr"}),O(le,{text:"Cancel",iconName:"cancel"})]}),c="Choose from the items below",d="Select Item";return t==="fullScreen"&&(n.fullScreen=!0),Object.keys(o||{}).forEach(b=>{switch(b){case"actions":n.actionsStart=!!o?.[b],n.actionsEnd=!!o?.[b];break;case"subtitle":n.subtitle=o?.[b]?c:void 0;break;case"footer":n.footer=!!o?.[b];break;default:break}}),t==="adaptive"?O(R,{...i,adaptive:!0,fullscreen:n.fullScreen,header:O(z,{actionsStart:n.actionsStart?O(f,{icon:"chevron-left",size:"large",fillMode:"flat"}):void 0,actionsEnd:n.actionsEnd?O(f,{icon:"x",size:"large",fillMode:"flat"}):void 0,title:d,subtitle:n.subtitle}),footer:n.footer?Dt(Ne,{alignment:"stretched",children:[O(f,{text:"Cancel",size:"large",themeColor:"base"}),O(f,{text:"Apply",size:"large",themeColor:"primary"})]}):void 0,children:r}):O(R,{...i,fullscreen:n.fullScreen,header:O(z,{actionsStart:n.actionsStart?O(f,{icon:"chevron-left",fillMode:"flat"}):void 0,actionsEnd:n.actionsEnd?O(f,{icon:"x",fillMode:"flat"}):void 0,title:"Select Item",subtitle:n.subtitle}),footer:n.footer?Dt(Ne,{alignment:"stretched",children:[O(f,{text:"Apply",themeColor:"primary"}),O(f,{text:"Cancel",themeColor:"base"})]}):void 0,children:r})};ye.options=$n;ye.states=Xn;ye.variants=Jn;ye.defaultOptions=Po;ye.modifiers=Wn;ye.className=R.className;var w="table",k=w;import{jsx as Zn}from"react/jsx-runtime";var Bo="k-data-table",qn=[],Yn={size:[l.undefined,l.small,l.medium,l.large]},Qn={},F=e=>{let{size:t,...o}=e;return Zn("div",{...o,className:a(e.className,Bo,A("k-table",{size:t})),children:e.children})};F.states=qn;F.options=Yn;F.className=Bo;F.defaultOptions=Qn;F.moduleName=w;F.folderName=k;import{jsx as os}from"react/jsx-runtime";var Ct="k-table-header-wrap",jn=[s.hover,s.focus,s.disabled],es={},ts={},re=e=>{let{children:t,hover:o,focus:i,disabled:n,...r}=e;return os("div",{...r,className:a(e.className,Ct,M(Ct,{hover:o,focus:i,disabled:n})),children:t})};re.states=jn;re.options=es;re.className=Ct;re.defaultOptions=ts;re.moduleName=w;re.folderName=k;import{jsx as is}from"react/jsx-runtime";var Ht="k-table",as=[],ns={size:[l.undefined,l.small,l.medium,l.large]},ss={},Y=e=>{let{size:t,...o}=e;return is("table",{...o,className:a(e.className,Ht,A(Ht,{size:t})),children:e.children})};Y.states=as;Y.options=ns;Y.className=Ht;Y.defaultOptions=ss;Y.moduleName=w;Y.folderName=k;import{jsx as Kt}from"react/jsx-runtime";var _t="k-table-header",ls=[s.hover,s.focus,s.disabled],rs={},ds={},U=e=>{let{children:t,hover:o,focus:i,disabled:n,...r}=e;return Kt("div",{...r,className:a(e.className,_t,M(_t,{hover:o,focus:i,disabled:n})),children:Kt(re,{children:Kt(Y,{children:t})})})};U.states=ls;U.options=rs;U.className=_t;U.defaultOptions=ds;U.moduleName=w;U.folderName=k;import{jsx as us}from"react/jsx-runtime";var zo="k-table-scroller",cs=[],ps={},ms={},ve=e=>{let{children:t,...o}=e;return us("div",{...o,className:a(e.className,zo),children:t})};ve.states=cs;ve.options=ps;ve.className=zo;ve.defaultOptions=ms;ve.moduleName=w;ve.folderName=k;import{jsx as Ts}from"react/jsx-runtime";var bs="k-table-body",Be=e=>Ts("div",{className:a(e.className,bs,"k-table-scroller"),children:e.children});import{jsx as Ns}from"react/jsx-runtime";var Fo="k-table-footer",fs=[],xs={},hs={},Q=e=>{let{children:t,...o}=e;return Ns("div",{...o,className:a(e.className,Fo),children:t})};Q.states=fs;Q.options=xs;Q.className=Fo;Q.defaultOptions=hs;Q.moduleName=w;Q.folderName=k;import{jsx as ys}from"react/jsx-runtime";var Pt="k-table-list",Ls=[],As={size:[l.undefined,l.small,l.medium,l.large]},Ss={},Z=e=>{let{size:t,virtualization:o,...i}=e;return ys("ul",{...i,className:a(e.className,"k-table",Pt,A(Pt,{size:t}),{"k-virtual-table":o}),children:e.children})};Z.states=Ls;Z.options=As;Z.className=Pt;Z.defaultOptions=Ss;Z.moduleName=w;Z.folderName=k;import{jsx as Es}from"react/jsx-runtime";var vs="k-table-thead",Ee=e=>Es("thead",{className:a(e.className,vs),children:e.children});import{jsx as Qp}from"react/jsx-runtime";import{jsx as tm}from"react/jsx-runtime";import{jsx as gs}from"react/jsx-runtime";var Bt="k-table-row",Ms=[s.hover,s.focus,s.selected,s.disabled,s.highlighted],de=e=>{let{hover:t,focus:o,selected:i,highlighted:n,disabled:r,alt:c,...d}=e;return gs("tr",{...d,className:a(e.className,Bt,{"k-table-alt-row":c},M(Bt,{hover:t,focus:o,disabled:r,selected:i,highlighted:n})),children:e.children})};de.states=Ms;de.className=Bt;import{jsx as Rs}from"react/jsx-runtime";var zt="k-table-row",Is=[s.hover,s.focus,s.selected,s.disabled],V=e=>{let{hover:t,focus:o,selected:i,disabled:n,alt:r,...c}=e;return Rs("li",{...c,className:a(e.className,zt,{"k-table-alt-row":r},M(zt,{hover:t,focus:o,disabled:n,selected:i})),children:e.children})};V.states=Is;V.className=zt;import{jsx as Os}from"react/jsx-runtime";var Uo="k-table-th",G=e=>{let{text:t,colspan:o,rowspan:i,...n}=e,r=t||e.children;return Os("th",{colSpan:o,rowSpan:i,...n,className:a(e.className,Uo),children:r})};G.className=Uo;G.moduleName=w;G.folderName=k;import{jsx as ks}from"react/jsx-runtime";var ws="k-table-th",Ze=e=>{let{text:t,...o}=e,i=t||e.children;return ks("span",{...o,className:a(e.className,ws),children:i})};import{jsx as Cs}from"react/jsx-runtime";var Ft="k-table-td",Ds=[s.focus,s.selected,s.highlighted],je=e=>{let{focus:t,selected:o,highlighted:i,text:n,colspan:r,rowspan:c,...d}=e,b=n||e.children;return Cs("td",{colSpan:r,rowSpan:c,...d,className:a(e.className,Ft,M(Ft,{focus:t,selected:o,highlighted:i})),children:b})};je.states=Ds;je.className=Ft;import{jsx as Ks}from"react/jsx-runtime";var Hs="k-table-td",S=e=>{let{text:t,...o}=e,i=t||e.children;return Ks("span",{...o,className:a(e.className,Hs),children:i})};import{jsx as vm}from"react/jsx-runtime";import{jsx as Ps}from"react/jsx-runtime";var _s="k-table-group-sticky-header",Ut=e=>Ps("div",{className:a(e.className,_s),children:e.children});import{jsx as wm}from"react/jsx-runtime";import{jsx as zs}from"react/jsx-runtime";var Bs="k-table-group-row",Vt=e=>{let{className:t,children:o,...i}=e;return zs("li",{...i,className:a(t,Bs),children:o})};import{jsx as Pm,jsxs as Bm}from"react/jsx-runtime";import{jsx as Vm,jsxs as Gm}from"react/jsx-runtime";import{jsx as Wm,jsxs as qm}from"react/jsx-runtime";import{Fragment as tu,jsx as jm,jsxs as eu}from"react/jsx-runtime";var Vo="dropdown-grid",Go="dropdowngrid";import{Fragment as Gt,jsx as p,jsxs as C}from"react/jsx-runtime";var $o="k-dropdowngrid",Gs=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading,s.readonly],$s={size:[l.undefined,l.small,l.medium,l.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[T.undefined,T.solid,T.flat,T.outline]},Xo={separators:!0},ce=e=>{let{size:t,rounded:o,fillMode:i,separators:n=Xo.separators,prefix:r,suffix:c,value:d,placeholder:b,hover:x,focus:h,valid:L,invalid:y,required:$,loading:H,disabled:v,popup:E,opened:I,readonly:K,adaptive:me,adaptiveSettings:Me,adaptiveTitle:ge,adaptiveSubtitle:Ie,id:te,ariaAutocomplete:Wo,activeDescendant:Xt,"aria-label":qo,...Yo}=e,Qo=te?`${te}-table-list`:void 0;return C(Gt,{children:[C(g,{...Yo,size:t,rounded:o,fillMode:i,hover:x,focus:h,valid:L,invalid:y,required:$,loading:H,disabled:v,readonly:K,className:a(e.className,$o,"k-combobox"),children:[r&&C(Gt,{children:[p(fe,{children:r}),n&&p(j,{})]}),p(P,{placeholder:b,value:d,role:"combobox","aria-haspopup":"listbox","aria-expanded":I?"true":"false","aria-controls":I?Qo:void 0,"aria-activedescendant":I&&Xt?Xt:void 0,"aria-autocomplete":Wo,"aria-invalid":y?"true":void 0,"aria-busy":H?"true":void 0,"aria-label":qo,disabled:v,readOnly:K}),p(B,{valid:L,invalid:y,loading:H,disabled:v}),p(J,{loading:H,disabled:v}),p(_,{loading:H,disabled:v,readonly:K,value:d}),c&&C(Gt,{children:[n&&p(j,{}),p(xe,{children:c})]}),p(f,{className:"k-input-button",icon:"chevron-down",size:t,fillMode:i,"aria-label":"Open popup",tabIndex:-1,disabled:v})]}),I&&E&&p(ee,{className:"k-dropdowngrid-popup",children:E}),me&&p(R,{adaptive:!0,...Me,header:p(z,{actionsEnd:p(f,{icon:"check",themeColor:"primary",size:"large",fillMode:"flat","aria-label":"Apply selection"}),input:!0,inputValue:d,inputPlaceholder:b,title:ge,subtitle:Ie}),children:p("div",{className:"k-list-container",children:C(F,{size:"large",children:[C(U,{children:[C("colgroup",{children:[p("col",{style:{width:"50px"}}),p("col",{style:{width:"160px"}}),p("col",{})]}),p(Ee,{children:C(de,{children:[p(G,{text:"ID"}),p(G,{text:"Name"}),p(G,{text:"Job Title"})]})})]}),p(Ut,{children:p(Ze,{text:"Initial group"})}),p(Be,{children:C(Z,{role:"listbox",id:te?`${te}-table-list`:void 0,"aria-label":"Options",children:[C(V,{role:"option",children:[p(S,{text:"1",style:{width:"50px"}}),p(S,{text:"Data 1.2",style:{width:"160px"}}),p(S,{text:"Data 1.3"})]}),C(V,{role:"option",alt:!0,children:[p(S,{text:"2",style:{width:"50px"}}),p(S,{text:"Data 2.2 (alt)",style:{width:"160px"}}),p(S,{text:"Data 2.3"})]}),C(V,{role:"option",children:[p(S,{text:"3",style:{width:"50px"}}),p(S,{text:"Data 3.2",style:{width:"160px"}}),p(S,{text:"Data 3.3"})]}),p(Vt,{role:"presentation",children:p(Ze,{text:"Group"})}),C(V,{role:"option",children:[p(S,{text:"4",style:{width:"50px"}}),p(S,{text:"Data 4.2",style:{width:"160px"}}),p(S,{text:"Data 4.3"})]}),C(V,{role:"option",alt:!0,children:[p(S,{text:"5",style:{width:"50px"}}),p(S,{text:"Data 5.2 (alt)",style:{width:"160px"}}),p(S,{text:"Data 5.3"})]}),C(V,{role:"option",children:[p(S,{text:"6",style:{width:"50px"}}),p(S,{text:"Data 6.2",style:{width:"160px"}}),p(S,{text:"Data 6.3"})]})]})}),p(Q,{children:p(S,{text:"30 records in total"})})]})})})]})};ce.states=Gs;ce.options=$s;ce.className=$o;ce.defaultOptions=Xo;ce.moduleName=Vo;ce.folderName=Go;ce.ariaSpec={rules:[{selector:".k-combobox .k-input-inner",attribute:"role=combobox",usage:"Identifies the input as a combobox."},{selector:".k-combobox .k-input-inner",attribute:"aria-haspopup=listbox",usage:"Indicates the combobox has a listbox popup."},{selector:".k-combobox .k-input-inner",attribute:"aria-expanded",usage:"Indicates whether the popup is open."},{selector:".k-combobox .k-input-inner",attribute:"aria-label",usage:"Accessible name for the combobox."},{selector:".k-combobox .k-input-button",attribute:"aria-label",usage:"Accessible name for the dropdown button."},{selector:".k-combobox .k-input-button",attribute:"tabindex=-1",usage:"Dropdown button is not in the tab order."},{selector:".k-dropdowngrid-popup .k-table-list",attribute:"role=listbox",usage:"Table list has listbox role."},{selector:'.k-dropdowngrid-popup .k-table-list[role="listbox"]',attribute:"aria-label or aria-labelledby",usage:"Table listbox must have an accessible name. Consuming code is responsible for associating with the component label via aria-labelledby."},{selector:".k-dropdowngrid-popup .k-table-list .k-table-row",attribute:"role=option",usage:"Each table row is an option."}]};var Jo=ce;import{Fragment as Xs,jsx as $t}from"react/jsx-runtime";var Vu=e=>$t(Jo,{id:Wt("ddg"),"aria-label":"Select option",suffix:$t(Xs,{children:$t(Ve,{icon:"copy",fillMode:"clear","aria-label":"Copy"})}),...e});export{Vu as DropdownGridSuffix};