@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 24.3 kB
JavaScript
var i=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?i(...t):typeof t=="object"?Object.keys(t).map((o,r)=>t[r]||t[o]&&o||null).filter(o=>o!==null).join(" "):t).filter(t=>!!t).join(" ");var K=(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"}),H=(e,t)=>{let{valid:o,invalid:r,hover:s,focus:u,checked:l,active:c,selected:x,disabled:f,indeterminate:d,loading:M,empty:h,readonly:C,highlighted:R,...O}=t;return i({"k-valid":o,"k-invalid":r,"k-hover":s,"k-focus":u,"k-checked":l,"k-active":c,"k-selected":x,"k-disabled":f,"k-indeterminate":d&&!l,"k-loading":M,"k-empty":h,"k-readonly":C,"k-highlighted":R},Object.keys(O).reduce((I,A)=>(A.startsWith("k-")?I[A]=O[A]:I[`k-${A}`]=O[A],I),{}))};function Pe(e,t){if(!t)return{};let o=Array.isArray(t)?t:[t];return Object.fromEntries(o.map(r=>[`k-${r}`,!0]))}var a={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},g={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"},E={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},_={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},n={undefined:void 0,inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",inverse:"inverse"},p={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"};import{jsx as Re}from"react/jsx-runtime";var re="k-file-box-wrapper",Ke={layout:"horizontal"},se=e=>{let{layout:t=Ke.layout,scrollingPosition:o,...r}=e;return Re("ul",{role:"list","aria-label":"Attached files",...r,className:i(e.className,re,{"k-files-vertical":t==="vertical","k-files-wrap":t==="wrap",[`${re}-scrollable-start`]:t==="horizontal"&&(o==="start"||o==="both"),[`${re}-scrollable-end`]:t==="horizontal"&&(o==="end"||o==="both")}),children:t==="horizontal"?Re("div",{className:"k-files-scroll",role:"presentation",children:e.children}):e.children})};se.className=re;se.defaultOptions=Ke;import{Fragment as Lt,jsx as ze}from"react/jsx-runtime";var pe="k-font-icon",kt=[],gt={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},Et={},Y=e=>{let{size:t,themeColor:o,icon:r,rotate:s,flip:u,...l}=e;return r?ze("span",{...l,className:i(e.className,pe,K(pe,{size:t}),{[`k-i-${r}`]:r,[`k-color-${o}`]:o,[`k-rotate-${s}`]:s,"k-flip-h":u==="h"||u==="both","k-flip-v":u==="v"||u==="both"}),"aria-hidden":"true"}):ze(Lt,{})};Y.states=kt;Y.options=gt;Y.className=pe;Y.defaultOptions=Et;var Ue=Y;import{Fragment as wt,jsx as ae}from"react/jsx-runtime";var de="k-svg-icon",At=[],yt={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[_.outline,_.solid,_.duotone]},fe={viewBox:"0 0 24 24",variant:_.outline},Z=e=>{let{size:t,themeColor:o,rotate:r,flip:s,viewBox:u=fe.viewBox,variant:l=fe.variant,icon:c,...x}=e;if(!c)return ae(wt,{});if(c==="none")return ae("span",{...x,className:i(e.className,de,K("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let f=typeof c=="object"&&c.name&&c.name,d=typeof c=="object"?l&&c.variants?.[l]||c.variants?.outline||c.content:void 0;return ae("span",{...x,className:i(e.className,de,K("k-icon",{size:t}),{[`k-svg-i-${f}`]:f,[`k-color-${o}`]:o,[`k-rotate-${r}`]:r,"k-flip-h":s==="h"||s==="both","k-flip-v":s==="v"||s==="both"}),"aria-hidden":"true",children:ae("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof c=="object"?c.viewBox:u,dangerouslySetInnerHTML:d!==void 0?{__html:d}:void 0,children:c?void 0:e.children})})};Z.states=At;Z.options=yt;Z.className=de;Z.defaultOptions=fe;var be=Z;import*as xe from"@progress/kendo-svg-icons";var He="icon",De="icons";import{useContext as St}from"react";import{createContext as Ot}from"react";var Fe=Ot({iconsType:"svg"});import{Fragment as $e,jsx as j}from"react/jsx-runtime";var ie="k-icon",Bt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),Tt=[],Ct={size:[a.undefined,a.xsmall,a.small,a.medium,a.large,a.xlarge,a.xxlarge,a.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[_.outline,_.solid,_.duotone]},le={viewBox:"0 0 24 24",type:"svg",variant:_.outline},b=e=>{let{iconsType:t}=St(Fe),{size:o,themeColor:r,icon:s,type:u=t||le.type,rotate:l,flip:c,viewBox:x=le.viewBox,variant:f=le.variant,...d}=e;if(!s)return j($e,{});if((t||u)==="svg"){if(s==="none")return j(be,{...d,className:i(e.className,ie),icon:s,size:o,variant:f});let h=xe[s]?s:Bt(`${s}-icon`);return xe[h]?j(be,{...d,className:i(e.className,ie),icon:xe[h],size:o,themeColor:r,rotate:l,flip:c,viewBox:x,variant:f}):j($e,{})}return j(Ue,{...d,className:i(e.className,ie),icon:s,size:o,themeColor:r,rotate:l,flip:c})};b.states=Tt;b.options=Ct;b.defaultOptions=le;b.className=ie;b.moduleName=He;b.folderName=De;b.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 Me="button",Ve=Me;import{Fragment as We,jsx as V,jsxs as Xe}from"react/jsx-runtime";var ee="k-button",_t=["icon-button"],Pt=[p.hover,p.focus,p.active,p.selected,p.disabled,p.generating],Rt={size:[a.undefined,a.xsmall,a.small,a.medium,a.large],rounded:[g.undefined,g.none,g.small,g.medium,g.large,g.full],fillMode:[E.undefined,E.solid,E.flat,E.outline,E.clear,E.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},he={showArrow:!1,arrowIconName:"chevron-down"},m=e=>{let{as:t="button",size:o,rounded:r,fillMode:s,themeColor:u,showArrow:l=he.showArrow,arrowIconName:c=he.arrowIconName,variant:x,hover:f,focus:d,active:M,selected:h,disabled:C,togglable:R,ariaDisabled:O,icon:I,iconSize:A,text:z,iconClassName:Mt,className:ht,...Nt}=e,It=I!=null,vt=e.children!==void 0;return Xe(t,{className:i(ht,ee,Pe(ee,x),K(ee,{size:o,rounded:r,fillMode:s,themeColor:u}),H(ee,{hover:f,focus:d,active:M,disabled:C||O,selected:h}),{"k-icon-button":!z&&!vt&&It}),"aria-pressed":R?h?"true":"false":void 0,...Nt,"aria-disabled":O?"true":void 0,disabled:C||void 0,children:[typeof I=="string"&&I&&V(b,{className:i(Mt,"k-button-icon"),icon:I,size:A}),I&&typeof I!="string"&&V(We,{children:I}),z?Xe(We,{children:[z&&V("span",{className:"k-button-text",children:z}),e.children]}):e.children&&V("span",{className:"k-button-text",children:e.children}),l&&V("span",{className:"k-menu-button-arrow k-button-arrow",children:V(b,{icon:c})})]})};m.states=Pt;m.options=Rt;m.variants=_t;m.className=ee;m.defaultOptions=he;m.moduleName=Me;m.folderName=Ve;m.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 Kt}from"react/jsx-runtime";var Ge=e=>Kt(m,{icon:"folder",...e,"aria-label":e["aria-label"]||"Folder",children:void 0});import{jsx as zt}from"react/jsx-runtime";var Je=e=>zt(m,{icon:"folder",children:"Button",...e});import{jsx as Ut}from"react/jsx-runtime";var qe=e=>Ut(m,{children:"Button",...e});import{jsx as Ne}from"react/jsx-runtime";var Ht=m.options,Dt=m.states,Ft={...m.defaultOptions,variant:"text"},$t=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],Vt=[],W=e=>{let{variant:t,...o}=e;switch(t){case"icon-only":return Ne(Ge,{...o,icon:"star"});case"icon-and-text":return Ne(Je,{...o,icon:"star",children:"Button"});default:return Ne(qe,{...o,children:"Button"})}};W.options=Ht;W.states=Dt;W.variants=$t;W.defaultOptions=Ft;W.modifiers=Vt;W.className=m.className;var Ie="menu-button",Qe=Ie;import{jsx as Gt}from"react/jsx-runtime";var Ye="k-menu-button",Wt=[p.hover,p.focus,p.active,p.selected,p.disabled],Xt={size:[a.undefined,a.xsmall,a.small,a.medium,a.large],rounded:[g.undefined,g.none,g.small,g.medium,g.large,g.full],fillMode:[E.undefined,E.solid,E.flat,E.outline,E.clear,E.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},ve={showArrow:!0,arrowIconName:"chevron-down"},L=e=>{let{size:t,rounded:o,fillMode:r,themeColor:s,hover:u,focus:l,active:c,selected:x,disabled:f,icon:d,text:M,showArrow:h=ve.showArrow,arrowIconName:C=ve.arrowIconName,expanded:R,...O}=e;return Gt(m,{...O,className:i(e.className,Ye),text:M,size:t,rounded:o,fillMode:r,themeColor:s,hover:u,focus:l,active:c,selected:x,disabled:f,ariaDisabled:f||void 0,icon:d,showArrow:h,arrowIconName:C,"aria-expanded":R?"true":"false",...!M&&d&&!e["aria-label"]&&{"aria-label":"Menu"}})};L.states=Wt;L.options=Xt;L.className=Ye;L.defaultOptions=ve;L.moduleName=Ie;L.folderName=Qe;L.ariaSpec={selector:".k-menu-button",rules:[{selector:".k-menu-button",attribute:"role=button or nodeName=button",usage:"Omitted if the button DOM element is used."},{selector:".k-menu-button",attribute:"aria-label (when icon-only)",usage:"Required when no text is visible in the button."},{selector:".k-menu-button",attribute:"aria-expanded=true/false",usage:"Announces the state of the popup visibility."},{selector:".k-menu-button",attribute:"aria-controls=.k-menu-group id (when open)",usage:"Points to the popup element. Builds a relationship between the button and the popup."},{selector:".k-menu-button.k-disabled",attribute:"aria-disabled=true",usage:"Rendered only when the button is disabled."},{selector:".k-menu-group",attribute:"role=list",usage:"Announces the list role of the popup."},{selector:".k-menu-item",attribute:"role=listitem",usage:"Announces the listitem role of the popup items."}]};import{jsx as Xn}from"react/jsx-runtime";import{jsx as Qn}from"react/jsx-runtime";import{jsx as er}from"react/jsx-runtime";var y="menu",S=y;import{jsx as te,jsxs as Ze}from"react/jsx-runtime";var ke="k-menu-item",Jt=[p.hover,p.focus,p.active,p.selected,p.disabled],qt={},je={iconPosition:"before"},v=e=>{let{hover:t,focus:o,active:r,selected:s,disabled:u,icon:l,text:c,first:x,last:f,showArrow:d,arrowIconName:M,iconPosition:h=je.iconPosition,dir:C,children:R,expanded:O,...I}=e,A=M;return A||(A=C==="rtl"?"chevron-left":"chevron-right"),Ze("li",{...I,className:i(e.className,ke,"k-item",H(ke,{focus:o,disabled:u,hover:t,active:r,selected:s}),{"k-first":x,"k-last":f}),role:"menuitem",...d&&{"aria-haspopup":"menu"},...d&&{"aria-expanded":O?"true":"false"},...u&&{"aria-disabled":"true"},...o&&{tabIndex:0},children:[Ze("span",{className:i("k-link k-menu-link"),children:[l&&h==="before"&&te(b,{className:"k-menu-link-icon",icon:l}),te("span",{className:"k-menu-link-text",children:c}),l&&h==="after"&&te(b,{className:"k-menu-link-icon",icon:l}),d&&te("span",{className:"k-menu-expand-arrow","aria-hidden":"true",children:te(b,{icon:A})})]}),R]})};v.states=Jt;v.options=qt;v.className=ke;v.defaultOptions=je;v.moduleName=y;v.folderName=S;import{jsx as oe,jsxs as et}from"react/jsx-runtime";var ge="k-menu-item",Qt=[p.hover,p.focus,p.active,p.selected,p.disabled],Yt={},Ee={dir:"ltr",iconPosition:"before"},k=e=>{let{hover:t,focus:o,active:r,selected:s,disabled:u,icon:l,text:c,first:x,last:f,showArrow:d,arrowIconName:M,iconPosition:h=Ee.iconPosition,dir:C=Ee.dir,children:R,popup:O,expanded:I,...A}=e,z=M;return z||(z=C==="rtl"?"chevron-left":"chevron-right"),et("li",{role:"menuitem",...A,className:i(e.className,ge,"k-item",H(ge,{focus:o,disabled:u}),{"k-first":x,"k-last":f}),...d&&{"aria-haspopup":"menu"},...d&&{"aria-expanded":I?"true":"false"},...u&&{"aria-disabled":"true"},...o&&{tabIndex:0},children:[et("span",{className:i("k-link k-menu-link",H("k-menu-link",{hover:t,active:r,selected:s,disabled:u})),children:[l&&h==="before"&&oe(b,{className:"k-menu-link-icon",icon:l}),oe("span",{className:"k-menu-link-text",children:c}),l&&h==="after"&&oe(b,{className:"k-menu-link-icon",icon:l}),d&&oe("span",{className:"k-menu-expand-arrow","aria-hidden":"true",children:oe(b,{icon:z})})]}),R,O]})};k.states=Qt;k.options=Yt;k.className=ge;k.defaultOptions=Ee;k.moduleName=y;k.folderName=S;import{jsx as to}from"react/jsx-runtime";var tt="k-menu-scroll-wrapper",Zt=[],jt={},eo={},D=e=>{let{className:t,children:o,orientation:r,...s}=e;return to("div",{...s,className:i(t,tt,{"k-menu-scroll-wrapper-vertical":r==="vertical"}),children:o})};D.states=Zt;D.options=jt;D.className=tt;D.defaultOptions=eo;D.moduleName=y;D.folderName=S;var ot=D;import{Fragment as Le,jsx as F,jsxs as me}from"react/jsx-runtime";var Ae="k-menu",oo=[],no={},ce={orientation:"horizontal",header:!0,scrollButtonsPosition:"around"},N=e=>{let{children:t,orientation:o=ce.orientation,header:r=ce.header,scrollable:s,scrollButtonsPosition:u=ce.scrollButtonsPosition,wrapperStyles:l,dir:c,popup:x,contextMenu:f,...d}=e,M={horizontal:{prev:c!=="rtl"?"left":"right",next:c!=="rtl"?"right":"left"},vertical:{prev:"up",next:"down"}},h=F("ul",{dir:c,...d,className:i(e.className,"k-reset",Ae,{[`${Ae}-${o}`]:o,"k-header":r}),role:f?"menu":"menubar",...o==="vertical"&&{"aria-orientation":"vertical"},children:t});return me(Le,{children:[s?me(ot,{orientation:o,style:l,dir:e.dir,children:[u==="start"&&me(Le,{children:[F(m,{fillMode:"flat",icon:`chevron-${M[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),F(m,{fillMode:"flat",icon:`chevron-${M[o].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next",tabIndex:-1,"aria-label":"Scroll next"})]}),u==="around"&&F(m,{fillMode:"flat",icon:`chevron-${M[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),h,u==="end"&&me(Le,{children:[F(m,{fillMode:"flat",icon:`chevron-${M[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),F(m,{fillMode:"flat",icon:`chevron-${M[o].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next",tabIndex:-1,"aria-label":"Scroll next"})]}),u==="around"&&F(m,{fillMode:"flat",icon:`chevron-${M[o].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next",tabIndex:-1,"aria-label":"Scroll next"})]}):h,x]})};N.states=oo;N.options=no;N.className=Ae;N.defaultOptions=ce;N.moduleName=y;N.folderName=S;N.ariaSpec={selector:".k-menu",rules:[{selector:".k-menu:not(.k-context-menu)",attribute:"role=menubar",usage:"Announces the Menu menubar role."},{selector:".k-menu.k-menu-vertical",attribute:"aria-orientation=vertical",usage:"Announces the Menu orientation when vertical."},{selector:".k-menu-item",attribute:"role=menuitem",usage:"Announces the Menu item role."},{selector:".k-menu-item",attribute:"aria-haspopup=menu (when present)",usage:"Indicates a popup menu is associated with the item."},{selector:".k-menu-item",attribute:"aria-expanded=true/false (when present)",usage:"Indicates whether the submenu is expanded."},{selector:".k-menu-item.k-disabled",attribute:"aria-disabled=true",usage:"Informs assistive technologies that a Menu item is disabled."},{selector:".k-menu-expand-arrow",attribute:"aria-hidden=true",usage:"Expand arrow elements are hidden from assistive technologies."},{selector:".k-menu-popup .k-menu-group",attribute:"role=menu",usage:"The role of the nested menu displayed in a popup."},{selector:".k-menu-scroll-button",attribute:"tabindex=-1",usage:"Scroll buttons are removed from the tab sequence."},{selector:".k-menu-scroll-button",attribute:"aria-label",usage:"Scroll buttons have an accessible label."},{selector:".k-menu-item.k-focus",attribute:"tabindex=0",usage:"The focused item has tabindex 0."},{selector:".k-menu-item",attribute:"aria-controls=ul.k-menu-group id (when present)",usage:"Points to the ID of the submenu. Only present when the item controls a submenu element."},{selector:".k-menu-popup .k-menu-group",attribute:"id",usage:"Each nested menu has a deterministic id linked to the parent aria-controls."}]};import{jsx as ro}from"react/jsx-runtime";var ye="k-separator",nt={orientation:"horizontal"},X=e=>{let{orientation:t=nt.orientation,...o}=e;return ro("li",{...o,className:i(e.className,"k-item",ye,{[`${ye}-${t}`]:t}),role:"separator"})};X.className=ye;X.defaultOptions=nt;X.moduleName=y;X.folderName=S;import{Fragment as Or,jsx as Sr}from"react/jsx-runtime";import{jsx as lo}from"react/jsx-runtime";var we="k-menu-group",so=[],ao={size:[a.undefined,a.small,a.medium,a.large]},io={},B=e=>{let{children:t,size:o,...r}=e;return lo("ul",{role:"menu",...r,className:i(e.className,we,K(we,{size:o})),children:t})};B.states=so;B.options=ao;B.className=we;B.defaultOptions=io;B.moduleName=y;B.folderName=S;import{Fragment as uo,jsx as G,jsxs as mo}from"react/jsx-runtime";var Oe=e=>G(N,{children:mo(uo,{children:[G(v,{first:!0,text:"Item 1"}),G(v,{showArrow:!0,arrowIconName:"chevron-down",text:"Item 2"}),G(v,{showArrow:!0,arrowIconName:"chevron-down",text:"Item 3"}),G(v,{text:"Item 4"}),G(v,{last:!0,text:"Item 5"})]}),...e});var Se="popup",rt=Se;import{jsx as st}from"react/jsx-runtime";var at="k-animation-container",co=[],po={},Be={positionMode:"absolute",shown:!0},U=e=>{let{positionMode:t=Be.positionMode,shown:o=Be.shown,animationStyle:r,offset:s,...u}=e;return st("div",{...u,style:{...s,...e.style},className:i(e.className,at,{"k-animation-container-shown":o,"k-animation-container-fixed":t==="fixed"}),children:st("div",{className:"k-child-animation-container",style:r,children:e.children})})};U.states=co;U.options=po;U.className=at;U.defaultOptions=Be;U.moduleName=Se;U.folderName=rt;var Te="popup",it=Te;import{jsx as lt}from"react/jsx-runtime";var ut="k-popup",fo=[],bo={},mt={positionMode:"absolute"},w=e=>{let{offset:t,positionMode:o=mt.positionMode,animationStyle:r,containerClassName:s,containerRole:u,containerAriaLabel:l,...c}=e;return lt(U,{positionMode:o,offset:t,animationStyle:r,className:s,role:u,"aria-label":l,children:lt("div",{...c,className:i(e.className,ut),children:e.children})})};w.states=fo;w.options=bo;w.className=ut;w.defaultOptions=mt;w.moduleName=Te;w.folderName=it;w.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.'}]};import{Fragment as ss,jsx as ns,jsxs as rs}from"react/jsx-runtime";import{Fragment as ms,jsx as us,jsxs as cs}from"react/jsx-runtime";import{Fragment as xs,jsx as bs,jsxs as Ms}from"react/jsx-runtime";import{Fragment as ks,jsx as vs,jsxs as gs}from"react/jsx-runtime";import{jsx as $,jsxs as Io}from"react/jsx-runtime";var xo={...N.options,scrollable:{type:"boolean"}},Mo=N.states,ct={...N.defaultOptions,variant:"horizontal"},ho=[{name:"horizontal",title:"Horizontal"},{name:"vertical",title:"Vertical"}],No=[{name:"opened",title:"Opened"}],J=e=>{let{variant:t,modifiers:o,...r}={...ct,...e},s={},u=t==="vertical"?{left:"200px",top:"30px"}:{left:"90px",top:"auto"};return Object.keys(o||{}).forEach(l=>{l==="opened"&&(s.opened=!!o?.[l],s.popup=o?.[l]?$(w,{className:"k-menu-popup",offset:u,children:Io(B,{children:[$(k,{text:"Item 1"}),$(k,{text:"Item 2"}),$(X,{}),$(k,{text:"Item 3"})]})}):null)}),t==="vertical"?$(Oe,{...r,...s,orientation:"vertical",style:{width:"200px"}}):$(Oe,{...r,...s})};J.options=xo;J.states=Mo;J.variants=ho;J.defaultOptions=ct;J.modifiers=No;J.className=N.className;import{Fragment as oa,jsx as ea,jsxs as ta}from"react/jsx-runtime";import{jsx as aa}from"react/jsx-runtime";import{Fragment as Lo,jsx as P,jsxs as pt}from"react/jsx-runtime";var vo=m.states,dt={...m.defaultOptions,variant:"text"},ko=m.options,go=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],Eo=[{name:"opened",title:"Opened"}],q=e=>{let{variant:t,modifiers:o,...r}={...dt,...e},s={},u=P(w,{className:"k-menu-popup",children:pt(B,{size:r.size,children:[P(k,{first:!0,text:"Menu Item"}),P(k,{text:"Menu Item"}),P(k,{last:!0,text:"Menu Item"})]})}),l;switch(t){case"icon-only":l=P("div",{children:P(L,{...r,...s,icon:"star"})});break;case"icon-and-text":l=P("div",{children:P(L,{...r,...s,icon:"star",children:"Dropdown Button"})});break;default:l=P("div",{children:P(L,{...r,...s,children:"Dropdown Button"})});break}return pt(Lo,{children:[l,o?.opened&&u]})};q.options=ko;q.states=vo;q.variants=go;q.defaultOptions=dt;q.modifiers=Eo;q.className=L.className;var Ce="file-box",ft=Ce;import{jsx as Q,jsxs as bt}from"react/jsx-runtime";var xt="k-file-box",Ao=[p.selected],yo={},ne={icon:"file-pdf",name:"FileName.pdf",size:"2MB",showButton:"true"},T=e=>{let{icon:t=ne.icon,name:o=ne.name,size:r=ne.size,status:s,deleted:u,removeButton:l,showButton:c=ne.showButton,...x}=e,f=[o,r].filter(Boolean).join(" ");return bt("li",{role:"listitem",tabIndex:0,"aria-label":f||void 0,...x,className:i(xt,e.className,{"k-file-deleted":u}),children:[Q(b,{icon:t,size:"xlarge","aria-hidden":"true"}),bt("div",{className:"k-file-info",children:[o&&Q("span",{className:"k-file-name",children:o}),r&&Q("span",{className:"k-file-size",children:r}),s&&Q("span",{className:"k-file-status",children:s})]}),c&&(l?Q(m,{as:"span",icon:"x-circle",fillMode:"flat",size:"xsmall","aria-hidden":"true"}):Q(L,{icon:"more-vertical",fillMode:"flat",size:"xsmall",showArrow:!1,"aria-label":"File actions"}))]})};T.states=Ao;T.options=yo;T.className=xt;T.defaultOptions=ne;T.moduleName=Ce;T.folderName=ft;T.ariaSpec={selector:".k-file-box-wrapper",rules:[{selector:".k-file-box-wrapper",attribute:"role=list",usage:"Explicitly sets the UL role to list."},{selector:".k-file-box-wrapper",attribute:"aria-label",usage:'Provides an accessible name for the file list (e.g. "Attached files").'},{selector:".k-file-box-wrapper .k-files-scroll",attribute:"role=presentation",usage:"The scrollable container between the list and its items is presentational, ensuring the list\u2192listitem relationship is preserved in the accessibility tree."},{selector:".k-file-box-wrapper .k-file-box",attribute:"role=listitem",usage:"Explicitly sets the LI role to listitem."},{selector:".k-file-box-wrapper .k-file-box",attribute:"tabindex",usage:"Makes the file box focusable. Uses roving tabindex: 0 for the focused item, -1 for the rest."},{selector:".k-file-box-wrapper .k-file-box",attribute:"aria-label",usage:'Provides an accessible name describing the file. Can include the file name and size (e.g. "FileName.pdf 2MB").'},{selector:".k-file-box-wrapper .k-file-box .k-icon",attribute:"aria-hidden=true",usage:"The file type icon is decorative and hidden from screen readers."},{selector:".k-file-box-wrapper .k-file-box span.k-button",attribute:"aria-hidden=true",usage:"The remove button is rendered as a decorative span and hidden from screen readers. File removal is handled by keyboard interaction on the listitem itself."}]};import{jsx as _e,jsxs as wo}from"react/jsx-runtime";var _a=e=>wo(se,{...e,children:[_e(T,{tabIndex:0}),_e(T,{icon:"file-image",name:"Photo.png",size:"5MB",tabIndex:-1}),_e(T,{icon:"file-txt",name:"Notes.txt",size:"1KB",tabIndex:-1})]});export{_a as FileBoxMultiple};