UNPKG

@progress/kendo-themes-html

Version:

A collection of HTML helpers used for developing Kendo UI themes

2 lines (1 loc) 22.2 kB
var Mt=Object.create;var re=Object.defineProperty;var ht=Object.getOwnPropertyDescriptor;var Nt=Object.getOwnPropertyNames;var It=Object.getPrototypeOf,vt=Object.prototype.hasOwnProperty;var gt=(e,t)=>{for(var o in t)re(e,o,{get:t[o],enumerable:!0})},Pe=(e,t,o,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of Nt(t))!vt.call(e,r)&&r!==o&&re(e,r,{get:()=>t[r],enumerable:!(a=ht(t,r))||a.enumerable});return e};var kt=(e,t,o)=>(o=e!=null?Mt(It(e)):{},Pe(t||!e||!e.__esModule?re(o,"default",{value:e,enumerable:!0}):o,e)),St=e=>Pe(re({},"__esModule",{value:!0}),e);var bo={};gt(bo,{SplitButtonDemo:()=>X,default:()=>fo});module.exports=St(bo);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 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"}),G=(e,t)=>{let{valid:o,invalid:a,hover:r,focus:u,checked:l,active:m,selected:v,disabled:x,indeterminate:d,loading:f,empty:b,readonly:P,highlighted:B,...w}=t;return i({"k-valid":o,"k-invalid":a,"k-hover":r,"k-focus":u,"k-checked":l,"k-active":m,"k-selected":v,"k-disabled":x,"k-indeterminate":d&&!l,"k-loading":f,"k-empty":b,"k-readonly":P,"k-highlighted":B},Object.keys(w).reduce((M,E)=>(E.startsWith("k-")?M[E]=w[E]:M[`k-${E}`]=w[E],M),{}))};function Be(e,t){if(!t)return{};let o=Array.isArray(t)?t:[t];return Object.fromEntries(o.map(a=>[`k-${a}`,!0]))}var s={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},A={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"},L={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},U={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"};var ee=require("react/jsx-runtime"),ue="k-font-icon",At=[],Lt={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},Et={},te=e=>{let{size:t,themeColor:o,icon:a,rotate:r,flip:u,...l}=e;return a?(0,ee.jsx)("span",{...l,className:i(e.className,ue,K(ue,{size:t}),{[`k-i-${a}`]:a,[`k-color-${o}`]:o,[`k-rotate-${r}`]:r,"k-flip-h":u==="h"||u==="both","k-flip-v":u==="v"||u==="both"}),"aria-hidden":"true"}):(0,ee.jsx)(ee.Fragment,{})};te.states=At;te.options=Lt;te.className=ue;te.defaultOptions=Et;var Ke=te;var q=require("react/jsx-runtime"),me="k-svg-icon",yt=[],Ot={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[U.outline,U.solid,U.duotone]},ce={viewBox:"0 0 24 24",variant:U.outline},oe=e=>{var f,b;let{size:t,themeColor:o,rotate:a,flip:r,viewBox:u=ce.viewBox,variant:l=ce.variant,icon:m,...v}=e;if(!m)return(0,q.jsx)(q.Fragment,{});if(m==="none")return(0,q.jsx)("span",{...v,className:i(e.className,me,K("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let x=typeof m=="object"&&m.name&&m.name,d=typeof m=="object"?l&&((f=m.variants)==null?void 0:f[l])||((b=m.variants)==null?void 0:b.outline)||m.content:void 0;return(0,q.jsx)("span",{...v,className:i(e.className,me,K("k-icon",{size:t}),{[`k-svg-i-${x}`]:x,[`k-color-${o}`]:o,[`k-rotate-${a}`]:a,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),"aria-hidden":"true",children:(0,q.jsx)("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof m=="object"?m.viewBox:u,dangerouslySetInnerHTML:d!==void 0?{__html:d}:void 0,children:m?void 0:e.children})})};oe.states=yt;oe.options=Ot;oe.className=me;oe.defaultOptions=ce;var pe=oe;var de=kt(require("@progress/kendo-svg-icons"));var Re="icon",ze="icons";var De=require("react");var Ue=require("react"),He=(0,Ue.createContext)({iconsType:"svg"});var D=require("react/jsx-runtime"),ae="k-icon",wt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),Tt=[],Ct={size:[s.undefined,s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[U.outline,U.solid,U.duotone]},se={viewBox:"0 0 24 24",type:"svg",variant:U.outline},h=e=>{let{iconsType:t}=(0,De.useContext)(He),{size:o,themeColor:a,icon:r,type:u=t||se.type,rotate:l,flip:m,viewBox:v=se.viewBox,variant:x=se.variant,...d}=e;if(!r)return(0,D.jsx)(D.Fragment,{});if((t||u)==="svg"){if(r==="none")return(0,D.jsx)(pe,{...d,className:i(e.className,ae),icon:r,size:o,variant:x});let b=de[r]?r:wt(`${r}-icon`);return de[b]?(0,D.jsx)(pe,{...d,className:i(e.className,ae),icon:de[b],size:o,themeColor:a,rotate:l,flip:m,viewBox:v,variant:x}):(0,D.jsx)(D.Fragment,{})}return(0,D.jsx)(Ke,{...d,className:i(e.className,ae),icon:r,size:o,themeColor:a,rotate:l,flip:m})};h.states=Tt;h.options=Ct;h.defaultOptions=se;h.className=ae;h.moduleName=Re;h.folderName=ze;h.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 fe="button",$e=fe;var y=require("react/jsx-runtime"),ne="k-button",_t=["icon-button"],Pt=[p.hover,p.focus,p.active,p.selected,p.disabled,p.generating],Bt={size:[s.undefined,s.xsmall,s.small,s.medium,s.large],rounded:[A.undefined,A.none,A.small,A.medium,A.large,A.full],fillMode:[L.undefined,L.solid,L.flat,L.outline,L.clear,L.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},be={showArrow:!1,arrowIconName:"chevron-down"},c=e=>{let{as:t="button",size:o,rounded:a,fillMode:r,themeColor:u,showArrow:l=be.showArrow,arrowIconName:m=be.arrowIconName,variant:v,hover:x,focus:d,active:f,selected:b,disabled:P,togglable:B,ariaDisabled:w,icon:M,iconSize:E,text:W,iconClassName:pt,className:dt,...ft}=e,bt=M!=null,xt=e.children!==void 0;return(0,y.jsxs)(t,{className:i(dt,ne,Be(ne,v),K(ne,{size:o,rounded:a,fillMode:r,themeColor:u}),G(ne,{hover:x,focus:d,active:f,disabled:P||w,selected:b}),{"k-icon-button":!W&&!xt&&bt}),"aria-pressed":B?b?"true":"false":void 0,...ft,"aria-disabled":w?"true":void 0,disabled:P||void 0,children:[typeof M=="string"&&M&&(0,y.jsx)(h,{className:i(pt,"k-button-icon"),icon:M,size:E}),M&&typeof M!="string"&&(0,y.jsx)(y.Fragment,{children:M}),W?(0,y.jsxs)(y.Fragment,{children:[W&&(0,y.jsx)("span",{className:"k-button-text",children:W}),e.children]}):e.children&&(0,y.jsx)("span",{className:"k-button-text",children:e.children}),l&&(0,y.jsx)("span",{className:"k-menu-button-arrow k-button-arrow",children:(0,y.jsx)(h,{icon:m})})]})};c.states=Pt;c.options=Bt;c.variants=_t;c.className=ne;c.defaultOptions=be;c.moduleName=fe;c.folderName=$e;c.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 Ve=require("react/jsx-runtime"),Fe=e=>(0,Ve.jsx)(c,{icon:"folder",...e,"aria-label":e["aria-label"]||"Folder",children:void 0});var Je=require("react/jsx-runtime"),We=e=>(0,Je.jsx)(c,{icon:"folder",children:"Button",...e});var Ge=require("react/jsx-runtime"),Xe=e=>(0,Ge.jsx)(c,{children:"Button",...e});var ie=require("react/jsx-runtime"),Kt=c.options,Rt=c.states,zt={...c.defaultOptions,variant:"text"},Ut=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],Ht=[],Y=e=>{let{variant:t,...o}=e;switch(t){case"icon-only":return(0,ie.jsx)(Fe,{...o,icon:"star"});case"icon-and-text":return(0,ie.jsx)(We,{...o,icon:"star",children:"Button"});default:return(0,ie.jsx)(Xe,{...o,children:"Button"})}};Y.options=Kt;Y.states=Rt;Y.variants=Ut;Y.defaultOptions=zt;Y.modifiers=Ht;Y.className=c.className;var xe="popup",qe=xe;var he=require("react/jsx-runtime"),Qe="k-animation-container",Dt=[],$t={},Me={positionMode:"absolute",shown:!0},J=e=>{let{positionMode:t=Me.positionMode,shown:o=Me.shown,animationStyle:a,offset:r,...u}=e;return(0,he.jsx)("div",{...u,style:{...r,...e.style},className:i(e.className,Qe,{"k-animation-container-shown":o,"k-animation-container-fixed":t==="fixed"}),children:(0,he.jsx)("div",{className:"k-child-animation-container",style:a,children:e.children})})};J.states=Dt;J.options=$t;J.className=Qe;J.defaultOptions=Me;J.moduleName=xe;J.folderName=qe;var Ne="popup",Ye=Ne;var Ie=require("react/jsx-runtime"),Ze="k-popup",Ft=[],Vt={},je={positionMode:"absolute"},T=e=>{let{offset:t,positionMode:o=je.positionMode,animationStyle:a,containerClassName:r,containerRole:u,containerAriaLabel:l,...m}=e;return(0,Ie.jsx)(J,{positionMode:o,offset:t,animationStyle:a,className:r,role:u,"aria-label":l,children:(0,Ie.jsx)("div",{...m,className:i(e.className,Ze),children:e.children})})};T.states=Ft;T.options=Vt;T.className=Ze;T.defaultOptions=je;T.moduleName=Ne;T.folderName=Ye;T.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 ve="split-button",et=ve;var $=require("react/jsx-runtime"),ge="k-split-button",Wt=[p.hover,p.focus,p.active,p.selected,p.disabled],Jt={size:[s.undefined,s.small,s.medium,s.large],rounded:[A.undefined,A.none,A.small,A.medium,A.large,A.full],fillMode:[L.undefined,L.solid,L.flat,L.outline,L.clear,L.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},tt={arrowIconName:"chevron-down"},k=e=>{let{size:t,rounded:o,fillMode:a,themeColor:r,hover:u,focus:l,active:m,selected:v,disabled:x,icon:d,text:f,arrowIconName:b=tt.arrowIconName,popup:P,opened:B,popupId:w,...M}=e;return(0,$.jsxs)($.Fragment,{children:[(0,$.jsxs)("div",{...M,className:i(e.className,ge,"k-button-group",K(ge,{rounded:o})),children:[(0,$.jsx)(c,{text:f,icon:d,size:t,rounded:o,fillMode:a,themeColor:r,hover:u,focus:l,active:m,selected:v,disabled:x,...!f&&!e.children&&d&&{"aria-label":"Action"},children:e.children}),(0,$.jsx)(c,{className:"k-split-button-arrow",icon:b,size:t,rounded:o,fillMode:a,disabled:x,ariaDisabled:x||void 0,"aria-label":"Toggle dropdown","aria-expanded":B?"true":"false","aria-controls":B?w:void 0,tabIndex:-1})]}),B&&P&&(0,$.jsx)(T,{className:"k-menu-popup",children:P})]})};k.states=Wt;k.options=Jt;k.className=ge;k.defaultOptions=tt;k.moduleName=ve;k.folderName=et;k.ariaSpec={selector:".k-split-button",rules:[{selector:".k-split-button-arrow",attribute:"role=button or nodeName=button",usage:"Omitted if the <button> DOM element is used."},{selector:".k-split-button-arrow",attribute:"aria-label",usage:"The attribute must be present when no text is initially visible in the button."},{selector:".k-split-button-arrow",attribute:"aria-expanded=true/false",usage:"Announces the state of the popup visibility."},{selector:".k-split-button-arrow",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-split-button-arrow",attribute:"tabindex=-1",usage:"The arrow button is removed from the tab sequence."},{selector:".k-split-button-arrow.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."}]};var O="menu",C=O;var F=require("react/jsx-runtime"),ke="k-menu-item",Xt=[p.hover,p.focus,p.active,p.selected,p.disabled],Gt={},ot={iconPosition:"before"},g=e=>{let{hover:t,focus:o,active:a,selected:r,disabled:u,icon:l,text:m,first:v,last:x,showArrow:d,arrowIconName:f,iconPosition:b=ot.iconPosition,dir:P,children:B,expanded:w,...M}=e,E=f;return E||(E=P==="rtl"?"chevron-left":"chevron-right"),(0,F.jsxs)("li",{...M,className:i(e.className,ke,"k-item",G(ke,{focus:o,disabled:u,hover:t,active:a,selected:r}),{"k-first":v,"k-last":x}),role:"menuitem",...d&&{"aria-haspopup":"menu"},...d&&{"aria-expanded":w?"true":"false"},...u&&{"aria-disabled":"true"},...o&&{tabIndex:0},children:[(0,F.jsxs)("span",{className:i("k-link k-menu-link"),children:[l&&b==="before"&&(0,F.jsx)(h,{className:"k-menu-link-icon",icon:l}),(0,F.jsx)("span",{className:"k-menu-link-text",children:m}),l&&b==="after"&&(0,F.jsx)(h,{className:"k-menu-link-icon",icon:l}),d&&(0,F.jsx)("span",{className:"k-menu-expand-arrow","aria-hidden":"true",children:(0,F.jsx)(h,{icon:E})})]}),B]})};g.states=Xt;g.options=Gt;g.className=ke;g.defaultOptions=ot;g.moduleName=O;g.folderName=C;var V=require("react/jsx-runtime"),Se="k-menu-item",qt=[p.hover,p.focus,p.active,p.selected,p.disabled],Qt={},Ae={dir:"ltr",iconPosition:"before"},S=e=>{let{hover:t,focus:o,active:a,selected:r,disabled:u,icon:l,text:m,first:v,last:x,showArrow:d,arrowIconName:f,iconPosition:b=Ae.iconPosition,dir:P=Ae.dir,children:B,popup:w,expanded:M,...E}=e,W=f;return W||(W=P==="rtl"?"chevron-left":"chevron-right"),(0,V.jsxs)("li",{role:"menuitem",...E,className:i(e.className,Se,"k-item",G(Se,{focus:o,disabled:u}),{"k-first":v,"k-last":x}),...d&&{"aria-haspopup":"menu"},...d&&{"aria-expanded":M?"true":"false"},...u&&{"aria-disabled":"true"},...o&&{tabIndex:0},children:[(0,V.jsxs)("span",{className:i("k-link k-menu-link",G("k-menu-link",{hover:t,active:a,selected:r,disabled:u})),children:[l&&b==="before"&&(0,V.jsx)(h,{className:"k-menu-link-icon",icon:l}),(0,V.jsx)("span",{className:"k-menu-link-text",children:m}),l&&b==="after"&&(0,V.jsx)(h,{className:"k-menu-link-icon",icon:l}),d&&(0,V.jsx)("span",{className:"k-menu-expand-arrow","aria-hidden":"true",children:(0,V.jsx)(h,{icon:W})})]}),B,w]})};S.states=qt;S.options=Qt;S.className=Se;S.defaultOptions=Ae;S.moduleName=O;S.folderName=C;var at=require("react/jsx-runtime"),nt="k-menu-scroll-wrapper",Yt=[],Zt={},jt={},Q=e=>{let{className:t,children:o,orientation:a,...r}=e;return(0,at.jsx)("div",{...r,className:i(t,nt,{"k-menu-scroll-wrapper-vertical":a==="vertical"}),children:o})};Q.states=Yt;Q.options=Zt;Q.className=nt;Q.defaultOptions=jt;Q.moduleName=O;Q.folderName=C;var rt=Q;var I=require("react/jsx-runtime"),Le="k-menu",eo=[],to={},le={orientation:"horizontal",header:!0,scrollButtonsPosition:"around"},N=e=>{let{children:t,orientation:o=le.orientation,header:a=le.header,scrollable:r,scrollButtonsPosition:u=le.scrollButtonsPosition,wrapperStyles:l,dir:m,popup:v,contextMenu:x,...d}=e,f={horizontal:{prev:m!=="rtl"?"left":"right",next:m!=="rtl"?"right":"left"},vertical:{prev:"up",next:"down"}},b=(0,I.jsx)("ul",{dir:m,...d,className:i(e.className,"k-reset",Le,{[`${Le}-${o}`]:o,"k-header":a}),role:x?"menu":"menubar",...o==="vertical"&&{"aria-orientation":"vertical"},children:t});return(0,I.jsxs)(I.Fragment,{children:[r?(0,I.jsxs)(rt,{orientation:o,style:l,dir:e.dir,children:[u==="start"&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(c,{fillMode:"flat",icon:`chevron-${f[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),(0,I.jsx)(c,{fillMode:"flat",icon:`chevron-${f[o].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next",tabIndex:-1,"aria-label":"Scroll next"})]}),u==="around"&&(0,I.jsx)(c,{fillMode:"flat",icon:`chevron-${f[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),b,u==="end"&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(c,{fillMode:"flat",icon:`chevron-${f[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),(0,I.jsx)(c,{fillMode:"flat",icon:`chevron-${f[o].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next",tabIndex:-1,"aria-label":"Scroll next"})]}),u==="around"&&(0,I.jsx)(c,{fillMode:"flat",icon:`chevron-${f[o].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next",tabIndex:-1,"aria-label":"Scroll next"})]}):b,v]})};N.states=eo;N.options=to;N.className=Le;N.defaultOptions=le;N.moduleName=O;N.folderName=C;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."}]};var it=require("react/jsx-runtime"),Ee="k-separator",st={orientation:"horizontal"},Z=e=>{let{orientation:t=st.orientation,...o}=e;return(0,it.jsx)("li",{...o,className:i(e.className,"k-item",Ee,{[`${Ee}-${t}`]:t}),role:"separator"})};Z.className=Ee;Z.defaultOptions=st;Z.moduleName=O;Z.folderName=C;var lt=require("react/jsx-runtime");var ut=require("react/jsx-runtime"),ye="k-menu-group",oo=[],no={size:[s.undefined,s.small,s.medium,s.large]},ro={},R=e=>{let{children:t,size:o,...a}=e;return(0,ut.jsx)("ul",{role:"menu",...a,className:i(e.className,ye,K(ye,{size:o})),children:t})};R.states=oo;R.options=no;R.className=ye;R.defaultOptions=ro;R.moduleName=O;R.folderName=C;var z=require("react/jsx-runtime"),Oe=e=>(0,z.jsx)(N,{children:(0,z.jsxs)(z.Fragment,{children:[(0,z.jsx)(g,{first:!0,text:"Item 1"}),(0,z.jsx)(g,{showArrow:!0,arrowIconName:"chevron-down",text:"Item 2"}),(0,z.jsx)(g,{showArrow:!0,arrowIconName:"chevron-down",text:"Item 3"}),(0,z.jsx)(g,{text:"Item 4"}),(0,z.jsx)(g,{last:!0,text:"Item 5"})]}),...e});var we=require("react/jsx-runtime");var Te=require("react/jsx-runtime");var Ce=require("react/jsx-runtime");var _e=require("react/jsx-runtime");var H=require("react/jsx-runtime"),ao={...N.options,scrollable:{type:"boolean"}},so=N.states,mt={...N.defaultOptions,variant:"horizontal"},io=[{name:"horizontal",title:"Horizontal"},{name:"vertical",title:"Vertical"}],lo=[{name:"opened",title:"Opened"}],j=e=>{let{variant:t,modifiers:o,...a}={...mt,...e},r={},u=t==="vertical"?{left:"200px",top:"30px"}:{left:"90px",top:"auto"};return Object.keys(o||{}).forEach(l=>{l==="opened"&&(r.opened=!!(o!=null&&o[l]),r.popup=o!=null&&o[l]?(0,H.jsx)(T,{className:"k-menu-popup",offset:u,children:(0,H.jsxs)(R,{children:[(0,H.jsx)(S,{text:"Item 1"}),(0,H.jsx)(S,{text:"Item 2"}),(0,H.jsx)(Z,{}),(0,H.jsx)(S,{text:"Item 3"})]})}):null)}),t==="vertical"?(0,H.jsx)(Oe,{...a,...r,orientation:"vertical",style:{width:"200px"}}):(0,H.jsx)(Oe,{...a,...r})};j.options=ao;j.states=so;j.variants=io;j.defaultOptions=mt;j.modifiers=lo;j.className=N.className;var _=require("react/jsx-runtime"),uo=k.states,ct={...k.defaultOptions,variant:"text"},mo=k.options,co=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],po=[{name:"opened",title:"Opened"}],X=e=>{let{variant:t,modifiers:o,...a}={...ct,...e},r={},u=(0,_.jsxs)(R,{size:a.size,children:[(0,_.jsx)(S,{first:!0,text:"Menu Item"}),(0,_.jsx)(S,{text:"Menu Item"}),(0,_.jsx)(S,{last:!0,text:"Menu Item"})]});switch(Object.keys(o||{}).forEach(l=>{l==="opened"&&(r.opened=!!(o!=null&&o[l]),r.popup=o!=null&&o[l]?u:"")}),t){case"icon-only":return(0,_.jsx)("div",{children:(0,_.jsx)(k,{...a,...r,icon:"star"})});case"icon-and-text":return(0,_.jsx)("div",{children:(0,_.jsx)(k,{...a,...r,icon:"star",children:"Split Button"})});default:return(0,_.jsx)("div",{children:(0,_.jsx)(k,{...a,...r,children:"Split Button"})})}};X.options=mo;X.states=uo;X.variants=co;X.defaultOptions=ct;X.modifiers=po;X.className=k.className;var fo=X;