@progress/kendo-themes-html/dist/esm/action-sheet/demos/action-sheet.mjs

A collection of HTML helpers used for developing Kendo UI themes

var i=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?i(...t):typeof t=="object"?Object.keys(t).map((o,a)=>t[a]||t[o]&&o||null).filter(o=>o!==null).join(" "):t).filter(t=>!!t).join(" ");var S=(e,t)=>i({[`${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"}),P=(e,t)=>{let{valid:o,invalid:a,hover:n,focus:l,checked:p,active:d,selected:u,disabled:f,indeterminate:b,loading:v,empty:A,readonly:w,highlighted:K,...M}=t;return i({"k-valid":o,"k-invalid":a,"k-hover":n,"k-focus":l,"k-checked":p,"k-active":d,"k-selected":u,"k-disabled":f,"k-indeterminate":b&&!p,"k-loading":v,"k-empty":A,"k-readonly":w,"k-highlighted":K},Object.keys(M).reduce((g,O)=>(O.startsWith("k-")?g[O]=M[O]:g[`k-${O}`]=M[O],g),{}))};function rt(e,t){if(!t)return{};let o=Array.isArray(t)?t:[t];return Object.fromEntries(o.map(a=>[`k-${a}`,!0]))}var r={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"},h={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},C={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},c={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 ke="popup",lt=ke;import{jsx as dt}from"react/jsx-runtime";var ct="k-animation-container",Gt=[],Yt={},Ce={positionMode:"absolute",shown:!0},B=e=>{let{positionMode:t=Ce.positionMode,shown:o=Ce.shown,animationStyle:a,offset:n,...l}=e;return dt("div",{...l,style:{...n,...e.style},className:i(e.className,ct,{"k-animation-container-shown":o,"k-animation-container-fixed":t==="fixed"}),children:dt("div",{className:"k-child-animation-container",style:a,children:e.children})})};B.states=Gt;B.options=Yt;B.className=ct;B.defaultOptions=Ce;B.moduleName=ke;B.folderName=lt;var Le="action-buttons",pt=Le;import{jsx as Zt}from"react/jsx-runtime";var ue="k-actions",Wt=[],Qt={},Re={alignment:"start",orientation:"horizontal"},z=e=>{let{alignment:t=Re.alignment,orientation:o=Re.orientation,...a}=e;return Zt("div",{...a,className:i(ue,{[`${ue}-${t}`]:t,[`${ue}-${o}`]:o},e.className),children:e.children})};z.states=Wt;z.options=Qt;z.className=ue;z.defaultOptions=Re;z.moduleName=Le;z.folderName=pt;import{jsx as eo}from"react/jsx-runtime";var jt="k-actionsheet-footer",mt={alignment:"stretched",orientation:"horizontal"},Y=e=>{let{alignment:t=mt.alignment,orientation:o=mt.orientation,template:a,as:n=a?"div":z,...l}=e;return eo(n,{...l,...!a&&{alignment:t,orientation:o},className:i(e.className,jt),children:e.children})};var ne="input",fe=ne;import{jsx as ao}from"react/jsx-runtime";var xe="k-input",to=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading,s.readonly],oo={size:[r.undefined,r.small,r.medium,r.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[h.undefined,h.solid,h.flat,h.outline]},no={},T=e=>{let{hover:t,focus:o,disabled:a,invalid:n,valid:l,loading:p,readonly:d,size:u,rounded:f,fillMode:b,...v}=e;return ao("span",{...v,className:i(e.className,xe,S(xe,{size:u,rounded:f,fillMode:b}),P(xe,{hover:t,focus:o,disabled:a,invalid:n,valid:l,loading:p,readonly:d}))})};T.states=to;T.options=oo;T.className=xe;T.defaultOptions=no;T.moduleName=ne;T.folderName=fe;import{jsx as lo}from"react/jsx-runtime";var he="k-picker",io=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading,s.readonly],so={size:[r.undefined,r.small,r.medium,r.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[h.undefined,h.solid,h.flat,h.outline]},ro={},W=e=>{let{hover:t,focus:o,disabled:a,invalid:n,valid:l,loading:p,readonly:d,size:u,rounded:f,fillMode:b,...v}=e;return lo("span",{...v,className:i(e.className,he,S(he,{size:u,rounded:f,fillMode:b}),P(he,{hover:t,focus:o,disabled:a,invalid:n,valid:l,loading:p,readonly:d})),children:e.children})};W.states=io;W.options=so;W.className=he;W.defaultOptions=ro;W.moduleName=ne;W.folderName=fe;import{Fragment as uo,jsx as ut}from"react/jsx-runtime";var _e="k-font-icon",co=[],po={size:[r.undefined,r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[c.undefined,c.base,c.primary,c.secondary,c.tertiary,c.success,c.warning,c.error,c.info]},mo={},ae=e=>{let{size:t,themeColor:o,icon:a,rotate:n,flip:l,...p}=e;return a?ut("span",{...p,className:i(e.className,_e,S(_e,{size:t}),{[`k-i-${a}`]:a,[`k-color-${o}`]:o,[`k-rotate-${n}`]:n,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"}),"aria-hidden":"true"}):ut(uo,{})};ae.states=co;ae.options=po;ae.className=_e;ae.defaultOptions=mo;var ft=ae;import{Fragment as ho,jsx as be}from"react/jsx-runtime";var He="k-svg-icon",fo=[],xo={size:[r.undefined,r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[c.undefined,c.base,c.primary,c.secondary,c.tertiary,c.success,c.warning,c.error,c.info],variant:[C.outline,C.solid,C.duotone]},we={viewBox:"0 0 24 24",variant:C.outline},ie=e=>{let{size:t,themeColor:o,rotate:a,flip:n,viewBox:l=we.viewBox,variant:p=we.variant,icon:d,...u}=e;if(!d)return be(ho,{});if(d==="none")return be("span",{...u,className:i(e.className,He,S("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let f=typeof d=="object"&&d.name&&d.name,b=typeof d=="object"?p&&d.variants?.[p]||d.variants?.outline||d.content:void 0;return be("span",{...u,className:i(e.className,He,S("k-icon",{size:t}),{[`k-svg-i-${f}`]:f,[`k-color-${o}`]:o,[`k-rotate-${a}`]:a,"k-flip-h":n==="h"||n==="both","k-flip-v":n==="v"||n==="both"}),"aria-hidden":"true",children:be("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof d=="object"?d.viewBox:l,dangerouslySetInnerHTML:b!==void 0?{__html:b}:void 0,children:d?void 0:e.children})})};ie.states=fo;ie.options=xo;ie.className=He;ie.defaultOptions=we;var Ke=ie;import*as Pe from"@progress/kendo-svg-icons";var xt="icon",ht="icons";import{useContext as No}from"react";import{createContext as bo}from"react";var bt=bo({iconsType:"svg"});import{Fragment as Nt,jsx as se}from"react/jsx-runtime";var Ne="k-icon",vo=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),So=[],Io={size:[r.undefined,r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[c.undefined,c.base,c.primary,c.secondary,c.tertiary,c.success,c.warning,c.error,c.info],variant:[C.outline,C.solid,C.duotone]},ve={viewBox:"0 0 24 24",type:"svg",variant:C.outline},N=e=>{let{iconsType:t}=No(bt),{size:o,themeColor:a,icon:n,type:l=t||ve.type,rotate:p,flip:d,viewBox:u=ve.viewBox,variant:f=ve.variant,...b}=e;if(!n)return se(Nt,{});if((t||l)==="svg"){if(n==="none")return se(Ke,{...b,className:i(e.className,Ne),icon:n,size:o,variant:f});let A=Pe[n]?n:vo(`${n}-icon`);return Pe[A]?se(Ke,{...b,className:i(e.className,Ne),icon:Pe[A],size:o,themeColor:a,rotate:p,flip:d,viewBox:u,variant:f}):se(Nt,{})}return se(ft,{...b,className:i(e.className,Ne),icon:n,size:o,themeColor:a,rotate:p,flip:d})};N.states=So;N.options=Io;N.defaultOptions=ve;N.className=Ne;N.moduleName=xt;N.folderName=ht;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."}]};import{Fragment as To,jsx as Be}from"react/jsx-runtime";var vt="k-clear-value",Ao=[s.disabled,s.loading,s.readonly],go={},R=e=>{let{disabled:t,loading:o,readonly:a,value:n}=e;return t||a||o||!n?Be(To,{}):Be("span",{className:i(e.className,vt),children:Be(N,{icon:"x"})})};R.states=Ao;R.options=go;R.className=vt;import{jsx as Mo}from"react/jsx-runtime";var ze="k-input-inner",yo=[],Eo={},Se={type:"text",autocomplete:"off",value:"",placeholder:""},_=e=>{let{value:t=Se.value,type:o=Se.type,placeholder:a=Se.placeholder,autocomplete:n=Se.autocomplete,disabled:l,readOnly:p,...d}=e;return Mo("input",{...d,type:o,className:i(e.className,ze,S(ze,e)),placeholder:a,autoComplete:n,defaultValue:t,disabled:l||void 0,readOnly:p||void 0})};_.states=yo;_.options=Eo;_.className=ze;import{jsx as St,jsxs as Co}from"react/jsx-runtime";var De="k-input-inner",Oo=[],ko={},Ve=e=>{let{value:t,placeholder:o,showValue:a,valueIcon:n,valueIconName:l,...p}=e;return Co("span",{...p,className:i(e.className,De,S(De,e)),children:[n,!n&&l&&St(N,{className:"k-input-value-icon",icon:l}),a&&!t&&o,a&&t&&St("span",{className:"k-input-value-text",children:t})]})};Ve.states=Oo;Ve.options=ko;Ve.className=De;import{jsx as _o}from"react/jsx-runtime";var Fe="k-input-inner",Lo=[],Ro={},It={value:"",placeholder:""},Ue=e=>{let{value:t=It.value,placeholder:o=It.placeholder,rows:a,disabled:n,...l}=e;return _o("textarea",{...l,className:i(e.className,Fe,S(Fe,e)),placeholder:o,rows:a,defaultValue:t,disabled:n||void 0})};Ue.states=Lo;Ue.options=Ro;Ue.className=Fe;import{Fragment as wo,jsx as At}from"react/jsx-runtime";var gt="k-input-loading-icon",Ho=[s.disabled,s.loading],D=e=>{let{disabled:t,loading:o}=e;return t||!o?At(wo,{}):At("span",{className:i(e.className,gt,"k-icon k-i-loading")})};D.states=Ho;D.className=gt;import{Fragment as Bo,jsx as Tt}from"react/jsx-runtime";var yt="k-input-validation-icon",Ko=[s.valid,s.invalid,s.disabled,s.loading],Po={},H=e=>{let{valid:t,invalid:o,disabled:a,loading:n}=e,l=o?"warning-circle":"check-circle";return a||n||!!!(t||o)?Tt(Bo,{}):Tt(N,{className:i(yt),icon:l})};H.states=Ko;H.options=Po;H.className=yt;import{Fragment as Vo,jsx as Et}from"react/jsx-runtime";var zo="k-input-prefix",Do={direction:"horizontal"},Ie=e=>{let{direction:t=Do.direction,...o}=e;return e.children?Et("span",{...o,className:i(zo,e.className,{[`k-input-prefix-${t}`]:t}),children:e.children}):Et(Vo,{})};import{Fragment as $o,jsx as Mt}from"react/jsx-runtime";var Fo="k-input-suffix",Uo={direction:"horizontal"},Ae=e=>{let{direction:t=Uo.direction,...o}=e;return e.children?Mt("span",{...o,className:i(Fo,e.className,{[`k-input-suffix-${t}`]:t}),children:e.children}):Mt($o,{})};import{jsx as vi}from"react/jsx-runtime";import{jsx as gi}from"react/jsx-runtime";import{jsx as qo}from"react/jsx-runtime";var Ot="k-input-separator",Xo={direction:"vertical"},Q=e=>{let{direction:t=Xo.direction,...o}=e;return qo("span",{...o,className:i(Ot,e.className,{[`${Ot}-${t}`]:t})})};var $e="button",kt=$e;import{Fragment as Ct,jsx as Z,jsxs as Lt}from"react/jsx-runtime";var re="k-button",Jo=["icon-button"],Go=[s.hover,s.focus,s.active,s.selected,s.disabled,s.generating],Yo={size:[r.undefined,r.xsmall,r.small,r.medium,r.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[h.undefined,h.solid,h.flat,h.outline,h.clear,h.link],themeColor:[c.undefined,c.base,c.primary,c.secondary,c.tertiary,c.success,c.warning,c.error,c.info,c.inverse]},Xe={showArrow:!1,arrowIconName:"chevron-down"},x=e=>{let{as:t="button",size:o,rounded:a,fillMode:n,themeColor:l,showArrow:p=Xe.showArrow,arrowIconName:d=Xe.arrowIconName,variant:u,hover:f,focus:b,active:v,selected:A,disabled:w,togglable:K,ariaDisabled:M,icon:g,iconSize:O,text:k,iconClassName:me,className:ye,...Ee}=e,Me=g!=null,Oe=e.children!==void 0;return Lt(t,{className:i(ye,re,rt(re,u),S(re,{size:o,rounded:a,fillMode:n,themeColor:l}),P(re,{hover:f,focus:b,active:v,disabled:w||M,selected:A}),{"k-icon-button":!k&&!Oe&&Me}),"aria-pressed":K?A?"true":"false":void 0,...Ee,"aria-disabled":M?"true":void 0,disabled:w||void 0,children:[typeof g=="string"&&g&&Z(N,{className:i(me,"k-button-icon"),icon:g,size:O}),g&&typeof g!="string"&&Z(Ct,{children:g}),k?Lt(Ct,{children:[k&&Z("span",{className:"k-button-text",children:k}),e.children]}):e.children&&Z("span",{className:"k-button-text",children:e.children}),p&&Z("span",{className:"k-menu-button-arrow k-button-arrow",children:Z(N,{icon:d})})]})};x.states=Go;x.options=Yo;x.variants=Jo;x.className=re;x.defaultOptions=Xe;x.moduleName=$e;x.folderName=kt;x.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 Wo}from"react/jsx-runtime";var q=e=>Wo(x,{children:"Button",...e});import{Fragment as Rt,jsx as L,jsxs as qe}from"react/jsx-runtime";var Qo=T.states,Zo=T.defaultOptions,jo=T.options,en=[{name:"prefix",title:"Prefix"},{name:"suffix",title:"Suffix"},{name:"clear-button",title:"`Clear` Button"},{name:"validation-icon",title:"Validation Icon"},{name:"separators",title:"Separators"}],tn=[],j=e=>{let{modifiers:t,valid:o,invalid:a,loading:n,disabled:l,readonly:p,...d}=e,u=t?.prefix,f=t?.suffix,b=t?.["clear-button"],v=t?.["validation-icon"],A=t?.separators;return qe(T,{...d,valid:o,invalid:a,loading:n,disabled:l,readonly:p,style:{width:300},children:[u&&qe(Rt,{children:[L(Ie,{children:L(N,{icon:"lock"})}),A&&L(Q,{})]}),L(_,{placeholder:"Placeholder",value:"Value"}),v&&L(H,{valid:o,invalid:a,loading:n,disabled:l}),L(D,{loading:n,disabled:l}),b&&L(R,{loading:n,disabled:l,readonly:p,value:"Value"}),f&&qe(Rt,{children:[A&&L(Q,{}),L(Ae,{children:L(q,{size:d.size,fillMode:"clear",children:"Send"})})]})]})};j.options=jo;j.states=Qo;j.variants=tn;j.defaultOptions=Zo;j.modifiers=en;j.className=T.className;var Je="searchbox",_t=Je;import{jsx as le,jsxs as an}from"react/jsx-runtime";var Ht="k-searchbox",on=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading],nn={size:[r.undefined,r.small,r.medium,r.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[h.undefined,h.solid,h.flat,h.outline]},Ge={showIcon:!0,icon:"search"},V=e=>{let{value:t,placeholder:o,size:a,rounded:n,fillMode:l,hover:p,focus:d,valid:u,invalid:f,required:b,loading:v,disabled:A,showIcon:w=Ge.showIcon,icon:K=Ge.icon,"aria-label":M,...g}=e;return an(T,{...g,size:a,rounded:n,fillMode:l,hover:p,focus:d,valid:u,invalid:f,required:b,loading:v,disabled:A,className:i(e.className,Ht),children:[w&&le(N,{className:"k-input-icon",icon:K}),le(_,{placeholder:o,value:t,"aria-label":M}),le(D,{...e}),le(H,{...e}),le(R,{...e})]})};V.states=on;V.options=nn;V.className=Ht;V.defaultOptions=Ge;V.moduleName=Je;V.folderName=_t;import{jsx as As}from"react/jsx-runtime";var Ye="textbox",wt=Ye;import{Fragment as Kt,jsx as F,jsxs as We}from"react/jsx-runtime";var Pt="k-textbox",sn=[s.hover,s.focus,s.valid,s.invalid,s.required,s.disabled,s.loading,s.readonly],rn={size:[r.undefined,r.small,r.medium,r.large],rounded:[m.undefined,m.none,m.small,m.medium,m.large,m.full],fillMode:[h.undefined,h.solid,h.flat,h.outline]},ge={showClearButton:!0,showValidationIcon:!0,separators:!0},y=e=>{let{size:t,rounded:o,fillMode:a,separators:n=ge.separators,showClearButton:l=ge.showClearButton,showValidationIcon:p=ge.showValidationIcon,prefix:d,suffix:u,type:f,value:b,placeholder:v,hover:A,focus:w,valid:K,invalid:M,required:g,loading:O,disabled:k,readonly:me,id:ye,"aria-label":Ee,"aria-describedby":Me,...Oe}=e;return We(T,{...Oe,size:t,rounded:o,fillMode:a,hover:A,focus:w,valid:K,invalid:M,required:g,loading:O,disabled:k,readonly:me,className:i(e.className,Pt),children:[d&&We(Kt,{children:[F(Ie,{children:d}),n&&F(Q,{})]}),F(_,{id:ye,placeholder:v,value:b,type:f,disabled:k,"aria-label":Ee,"aria-describedby":Me,"aria-invalid":M?"true":void 0}),p&&F(H,{valid:K,invalid:M,loading:O,disabled:k}),F(D,{loading:O,disabled:k}),l&&F(R,{loading:O,disabled:k,readonly:me,value:b}),u&&We(Kt,{children:[n&&F(Q,{}),F(Ae,{children:u})]})]})};y.states=sn;y.options=rn;y.className=Pt;y.defaultOptions=ge;y.moduleName=Ye;y.folderName=wt;y.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 de=y;import{jsx as ln}from"react/jsx-runtime";var Bt=e=>ln(de,{...e});import{Fragment as Ds,jsx as zs}from"react/jsx-runtime";import{jsx as dn}from"react/jsx-runtime";var zt=e=>dn(x,{icon:"folder",...e,"aria-label":e["aria-label"]||"Folder",children:void 0});import{jsx as cn}from"react/jsx-runtime";var Dt=e=>cn(x,{icon:"folder",children:"Button",...e});import{jsx as Qe}from"react/jsx-runtime";var pn=x.options,mn=x.states,un={...x.defaultOptions,variant:"text"},fn=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],xn=[],ee=e=>{let{variant:t,...o}=e;switch(t){case"icon-only":return Qe(zt,{...o,icon:"star"});case"icon-and-text":return Qe(Dt,{...o,icon:"star",children:"Button"});default:return Qe(q,{...o,children:"Button"})}};ee.options=pn;ee.states=mn;ee.variants=fn;ee.defaultOptions=un;ee.modifiers=xn;ee.className=x.className;import{Fragment as pr,jsx as cr}from"react/jsx-runtime";import{jsx as xr}from"react/jsx-runtime";import{jsx as Ze}from"react/jsx-runtime";var hn=y.states,bn=y.defaultOptions,Nn=y.options,vn=[{name:"prefix",title:"Prefix"},{name:"suffix",title:"Suffix"},{name:"clear-button",title:"`Clear` Button"}],Sn=[],te=e=>{let{modifiers:t,...o}=e,a={};return Object.keys(t||{}).forEach(n=>{switch(n){case"prefix":a.prefix=t?.[n]?Ze(N,{icon:"lock"}):void 0;break;case"suffix":a.suffix=t?.[n]?Ze(q,{size:o.size,fillMode:"clear",children:"Send"}):void 0;break;case"clear-button":a.showClearButton=t?.[n];break;default:break}}),Ze(Bt,{value:"Value",style:{width:300},...o,...a})};te.options=Nn;te.states=hn;te.variants=Sn;te.defaultOptions=bn;te.modifiers=vn;te.className=y.className;import{jsx as U,jsxs as je}from"react/jsx-runtime";var Vt="k-actionsheet-titlebar",In={},$=e=>{let{title:t,subtitle:o,actionsStart:a,actionsEnd:n,filter:l,input:p,inputValue:d,inputPlaceholder:u,adaptive:f,titleId:b,children:v,...A}=e;return je("div",{...A,className:i(e.className,Vt),children:[je("div",{className:"k-actionsheet-titlebar-group",children:[a&&U("div",{className:"k-actionsheet-actions",children:a}),!v&&je("div",{className:"k-actionsheet-title",id:b,children:[t&&U("div",{className:"k-text-center",children:t}),o&&U("div",{className:"k-actionsheet-subtitle k-text-center",children:o})]}),v&&U("div",{className:"k-actionsheet-title",id:b,children:v}),n&&U("div",{className:"k-actionsheet-actions",children:n})]}),(p||l)&&U("div",{className:"k-actionsheet-titlebar-group k-actionsheet-filter",children:p?U(y,{value:d,placeholder:u,size:f?"large":"medium","aria-label":t||u||"Input"}):U(V,{placeholder:"Filter",size:f?"large":"medium","aria-label":"Filter options"})})]})};$.className=Vt;$.defaultOptions=In;import{jsx as et,jsxs as yn}from"react/jsx-runtime";var tt="k-actionsheet-view",An=[],gn={},Tn={},oe=e=>{let{adaptive:t,animated:o,children:a,header:n,footer:l,titleId:p,...d}=e,u=n?.type===$&&et($,{adaptive:t,titleId:p,...n?.props}),f=l?.type===Y&&et(Y,{...l?.props});return yn("div",{...d,className:i(e.className,tt,{[`${tt}-animated`]:o}),children:[u,et("div",{className:"k-actionsheet-content",children:a}),f]})};oe.states=An;oe.options=gn;oe.className=tt;oe.defaultOptions=Tn;var ot="action-sheet",Ft=ot;var nt="overlay",Ut=nt;import{jsx as kn}from"react/jsx-runtime";var $t="k-overlay",En=[],Mn={},On={},X=e=>{let{...t}=e;return kn("div",{...t,className:i(e.className,$t),children:e.children})};X.states=En;X.options=Mn;X.className=$t;X.defaultOptions=On;X.moduleName=nt;X.folderName=Ut;import{jsx as Te,jsxs as Rn}from"react/jsx-runtime";var Xt="k-actionsheet",Cn=[],Ln={},ce={side:"bottom",fullscreen:!1,adaptive:!1,overlay:!0},E=e=>{let{side:t=ce.side,fullscreen:o=ce.fullscreen,adaptive:a=ce.adaptive,overlay:n=ce.overlay,template:l,children:p,header:d,footer:u,id:f,...b}=e,v=f&&!l&&d?`${f}-title`:void 0;return Rn("div",{className:"k-actionsheet-container",children:[n&&Te(X,{}),Te(B,{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:Te("div",{...b,id:f,role:"dialog","aria-modal":n?"true":void 0,"aria-labelledby":v,className:i(e.className,Xt,{[`k-actionsheet-${t}`]:o===!1,"k-actionsheet-fullscreen":o===!0,"k-adaptive-actionsheet":a}),children:l||Te(oe,{header:d,footer:u,adaptive:a,titleId:v,...e,children:p})})})]})};E.states=Cn;E.options=Ln;E.className=Xt;E.defaultOptions=ce;E.moduleName=ot;E.folderName=Ft;E.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 _n}from"react/jsx-runtime";var qt=e=>{let{...t}=e;return _n("div",{...t,className:i(e.className,"k-list-ul"),children:e.children})};import{Fragment as wn,jsx as pe,jsxs as at}from"react/jsx-runtime";var it="k-actionsheet-item",Hn=[s.hover,s.focus,s.selected,s.disabled],J=e=>{let{iconName:t,text:o,description:a,hover:n,focus:l,selected:p,disabled:d,...u}=e;return at("span",{...u,className:i(e.className,it,P(it,{hover:n,focus:l,selected:p,disabled:d})),children:[!e.children&&pe(wn,{children:at("span",{className:"k-actionsheet-action",children:[t&&pe("span",{className:"k-icon-wrap",children:pe(N,{className:"k-actionsheet-item-icon",icon:t})}),at("span",{className:"k-actionsheet-item-text",children:[o&&pe("span",{className:"k-actionsheet-item-title",children:o}),a&&pe("span",{className:"k-actionsheet-item-description",children:a})]})]})}),e.children]})};J.states=Hn;J.className=it;import{jsx as I,jsxs as st}from"react/jsx-runtime";var Kn=E.options,Pn=E.states,Jt={...E.defaultOptions,variant:"normal"},Bn=[{name:"normal",title:"Normal"},{name:"adaptive",title:"Adaptive"},{name:"fullScreen",title:"Full Screen"}],zn=[{name:"actions",title:"Titlebar Actions",type:"boolean"},{name:"subtitle",title:"Subtitle",type:"boolean"},{name:"footer",title:"Footer",type:"boolean"}],G=e=>{let{variant:t,modifiers:o,...a}={...Jt,...e},n={},l=st(qt,{children:[I(J,{text:"Edit Item",description:"Click to edit",iconName:"edit-tools"}),I(J,{text:"Add to Favorites",iconName:"heart"}),I(J,{text:"Upload New",iconName:"upload",disabled:!0}),I("hr",{className:"k-hr"}),I(J,{text:"Cancel",iconName:"cancel"})]}),p="Choose from the items below",d="Select Item";return t==="fullScreen"&&(n.fullScreen=!0),Object.keys(o||{}).forEach(u=>{switch(u){case"actions":n.actionsStart=!!o?.[u],n.actionsEnd=!!o?.[u];break;case"subtitle":n.subtitle=o?.[u]?p:void 0;break;case"footer":n.footer=!!o?.[u];break;default:break}}),t==="adaptive"?I(E,{...a,adaptive:!0,fullscreen:n.fullScreen,header:I($,{actionsStart:n.actionsStart?I(x,{icon:"chevron-left",size:"large",fillMode:"flat"}):void 0,actionsEnd:n.actionsEnd?I(x,{icon:"x",size:"large",fillMode:"flat"}):void 0,title:d,subtitle:n.subtitle}),footer:n.footer?st(Y,{alignment:"stretched",children:[I(x,{text:"Cancel",size:"large",themeColor:"base"}),I(x,{text:"Apply",size:"large",themeColor:"primary"})]}):void 0,children:l}):I(E,{...a,fullscreen:n.fullScreen,header:I($,{actionsStart:n.actionsStart?I(x,{icon:"chevron-left",fillMode:"flat"}):void 0,actionsEnd:n.actionsEnd?I(x,{icon:"x",fillMode:"flat"}):void 0,title:"Select Item",subtitle:n.subtitle}),footer:n.footer?st(Y,{alignment:"stretched",children:[I(x,{text:"Apply",themeColor:"primary"}),I(x,{text:"Cancel",themeColor:"base"})]}):void 0,children:l})};G.options=Kn;G.states=Pn;G.variants=Bn;G.defaultOptions=Jt;G.modifiers=zn;G.className=E.className;var hl=G;export{G as ActionSheetDemo,hl as default};