@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 21.5 kB
JavaScript
var l=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?l(...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 R=(e,t)=>l({[`${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"}),U=(e,t)=>{let{valid:o,invalid:a,hover:s,focus:u,checked:i,active:c,selected:N,disabled:f,indeterminate:d,loading:M,empty:x,readonly:C,highlighted:_,...O}=t;return l({"k-valid":o,"k-invalid":a,"k-hover":s,"k-focus":u,"k-checked":i,"k-active":c,"k-selected":N,"k-disabled":f,"k-indeterminate":d&&!i,"k-loading":M,"k-empty":x,"k-readonly":C,"k-highlighted":_},Object.keys(O).reduce((I,L)=>(L.startsWith("k-")?I[L]=O[L]:I[`k-${L}`]=O[L],I),{}))};function Se(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"},k={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"},A={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},B={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{Fragment as xt,jsx as Te}from"react/jsx-runtime";var le="k-font-icon",dt=[],ft={size:[r.undefined,r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},Mt={},q=e=>{let{size:t,themeColor:o,icon:a,rotate:s,flip:u,...i}=e;return a?Te("span",{...i,className:l(e.className,le,R(le,{size:t}),{[`k-i-${a}`]:a,[`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"}):Te(xt,{})};q.states=dt;q.options=ft;q.className=le;q.defaultOptions=Mt;var Ce=q;import{Fragment as Nt,jsx as te}from"react/jsx-runtime";var ue="k-svg-icon",bt=[],ht={size:[r.undefined,r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[B.outline,B.solid,B.duotone]},me={viewBox:"0 0 24 24",variant:B.outline},Q=e=>{let{size:t,themeColor:o,rotate:a,flip:s,viewBox:u=me.viewBox,variant:i=me.variant,icon:c,...N}=e;if(!c)return te(Nt,{});if(c==="none")return te("span",{...N,className:l(e.className,ue,R("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let f=typeof c=="object"&&c.name&&c.name,d=typeof c=="object"?i&&c.variants?.[i]||c.variants?.outline||c.content:void 0;return te("span",{...N,className:l(e.className,ue,R("k-icon",{size:t}),{[`k-svg-i-${f}`]:f,[`k-color-${o}`]:o,[`k-rotate-${a}`]:a,"k-flip-h":s==="h"||s==="both","k-flip-v":s==="v"||s==="both"}),"aria-hidden":"true",children:te("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})})};Q.states=bt;Q.options=ht;Q.className=ue;Q.defaultOptions=me;var ce=Q;import*as pe from"@progress/kendo-svg-icons";var Be="icon",Pe="icons";import{useContext as vt}from"react";import{createContext as It}from"react";var _e=It({iconsType:"svg"});import{Fragment as Re,jsx as Y}from"react/jsx-runtime";var oe="k-icon",gt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),kt=[],At={size:[r.undefined,r.xsmall,r.small,r.medium,r.large,r.xlarge,r.xxlarge,r.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[B.outline,B.solid,B.duotone]},ne={viewBox:"0 0 24 24",type:"svg",variant:B.outline},b=e=>{let{iconsType:t}=vt(_e),{size:o,themeColor:a,icon:s,type:u=t||ne.type,rotate:i,flip:c,viewBox:N=ne.viewBox,variant:f=ne.variant,...d}=e;if(!s)return Y(Re,{});if((t||u)==="svg"){if(s==="none")return Y(ce,{...d,className:l(e.className,oe),icon:s,size:o,variant:f});let x=pe[s]?s:gt(`${s}-icon`);return pe[x]?Y(ce,{...d,className:l(e.className,oe),icon:pe[x],size:o,themeColor:a,rotate:i,flip:c,viewBox:N,variant:f}):Y(Re,{})}return Y(Ce,{...d,className:l(e.className,oe),icon:s,size:o,themeColor:a,rotate:i,flip:c})};b.states=kt;b.options=At;b.defaultOptions=ne;b.className=oe;b.moduleName=Be;b.folderName=Pe;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 de="button",Ke=de;import{Fragment as ze,jsx as F,jsxs as Ue}from"react/jsx-runtime";var Z="k-button",Et=["icon-button"],Lt=[p.hover,p.focus,p.active,p.selected,p.disabled,p.generating],yt={size:[r.undefined,r.xsmall,r.small,r.medium,r.large],rounded:[k.undefined,k.none,k.small,k.medium,k.large,k.full],fillMode:[A.undefined,A.solid,A.flat,A.outline,A.clear,A.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},fe={showArrow:!1,arrowIconName:"chevron-down"},m=e=>{let{as:t="button",size:o,rounded:a,fillMode:s,themeColor:u,showArrow:i=fe.showArrow,arrowIconName:c=fe.arrowIconName,variant:N,hover:f,focus:d,active:M,selected:x,disabled:C,togglable:_,ariaDisabled:O,icon:I,iconSize:L,text:K,iconClassName:lt,className:ut,...mt}=e,ct=I!=null,pt=e.children!==void 0;return Ue(t,{className:l(ut,Z,Se(Z,N),R(Z,{size:o,rounded:a,fillMode:s,themeColor:u}),U(Z,{hover:f,focus:d,active:M,disabled:C||O,selected:x}),{"k-icon-button":!K&&!pt&&ct}),"aria-pressed":_?x?"true":"false":void 0,...mt,"aria-disabled":O?"true":void 0,disabled:C||void 0,children:[typeof I=="string"&&I&&F(b,{className:l(lt,"k-button-icon"),icon:I,size:L}),I&&typeof I!="string"&&F(ze,{children:I}),K?Ue(ze,{children:[K&&F("span",{className:"k-button-text",children:K}),e.children]}):e.children&&F("span",{className:"k-button-text",children:e.children}),i&&F("span",{className:"k-menu-button-arrow k-button-arrow",children:F(b,{icon:c})})]})};m.states=Lt;m.options=yt;m.variants=Et;m.className=Z;m.defaultOptions=fe;m.moduleName=de;m.folderName=Ke;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 wt}from"react/jsx-runtime";var He=e=>wt(m,{icon:"folder",...e,"aria-label":e["aria-label"]||"Folder",children:void 0});import{jsx as Ot}from"react/jsx-runtime";var De=e=>Ot(m,{icon:"folder",children:"Button",...e});import{jsx as St}from"react/jsx-runtime";var $e=e=>St(m,{children:"Button",...e});import{jsx as Me}from"react/jsx-runtime";var Tt=m.options,Ct=m.states,Bt={...m.defaultOptions,variant:"text"},Pt=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],_t=[],V=e=>{let{variant:t,...o}=e;switch(t){case"icon-only":return Me(He,{...o,icon:"star"});case"icon-and-text":return Me(De,{...o,icon:"star",children:"Button"});default:return Me($e,{...o,children:"Button"})}};V.options=Tt;V.states=Ct;V.variants=Pt;V.defaultOptions=Bt;V.modifiers=_t;V.className=m.className;var xe="menu-button",Fe=xe;import{jsx as zt}from"react/jsx-runtime";var Ve="k-menu-button",Rt=[p.hover,p.focus,p.active,p.selected,p.disabled],Kt={size:[r.undefined,r.xsmall,r.small,r.medium,r.large],rounded:[k.undefined,k.none,k.small,k.medium,k.large,k.full],fillMode:[A.undefined,A.solid,A.flat,A.outline,A.clear,A.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},be={showArrow:!0,arrowIconName:"chevron-down"},E=e=>{let{size:t,rounded:o,fillMode:a,themeColor:s,hover:u,focus:i,active:c,selected:N,disabled:f,icon:d,text:M,showArrow:x=be.showArrow,arrowIconName:C=be.arrowIconName,expanded:_,...O}=e;return zt(m,{...O,className:l(e.className,Ve),text:M,size:t,rounded:o,fillMode:a,themeColor:s,hover:u,focus:i,active:c,selected:N,disabled:f,ariaDisabled:f||void 0,icon:d,showArrow:x,arrowIconName:C,"aria-expanded":_?"true":"false",...!M&&d&&!e["aria-label"]&&{"aria-label":"Menu"}})};E.states=Rt;E.options=Kt;E.className=Ve;E.defaultOptions=be;E.moduleName=xe;E.folderName=Fe;E.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 _n}from"react/jsx-runtime";import{jsx as Un}from"react/jsx-runtime";import{jsx as Fn}from"react/jsx-runtime";var y="menu",S=y;import{jsx as j,jsxs as We}from"react/jsx-runtime";var he="k-menu-item",Ut=[p.hover,p.focus,p.active,p.selected,p.disabled],Ht={},Ge={iconPosition:"before"},v=e=>{let{hover:t,focus:o,active:a,selected:s,disabled:u,icon:i,text:c,first:N,last:f,showArrow:d,arrowIconName:M,iconPosition:x=Ge.iconPosition,dir:C,children:_,expanded:O,...I}=e,L=M;return L||(L=C==="rtl"?"chevron-left":"chevron-right"),We("li",{...I,className:l(e.className,he,"k-item",U(he,{focus:o,disabled:u,hover:t,active:a,selected:s}),{"k-first":N,"k-last":f}),role:"menuitem",...d&&{"aria-haspopup":"menu"},...d&&{"aria-expanded":O?"true":"false"},...u&&{"aria-disabled":"true"},...o&&{tabIndex:0},children:[We("span",{className:l("k-link k-menu-link"),children:[i&&x==="before"&&j(b,{className:"k-menu-link-icon",icon:i}),j("span",{className:"k-menu-link-text",children:c}),i&&x==="after"&&j(b,{className:"k-menu-link-icon",icon:i}),d&&j("span",{className:"k-menu-expand-arrow","aria-hidden":"true",children:j(b,{icon:L})})]}),_]})};v.states=Ut;v.options=Ht;v.className=he;v.defaultOptions=Ge;v.moduleName=y;v.folderName=S;import{jsx as ee,jsxs as Je}from"react/jsx-runtime";var Ne="k-menu-item",Dt=[p.hover,p.focus,p.active,p.selected,p.disabled],$t={},Ie={dir:"ltr",iconPosition:"before"},g=e=>{let{hover:t,focus:o,active:a,selected:s,disabled:u,icon:i,text:c,first:N,last:f,showArrow:d,arrowIconName:M,iconPosition:x=Ie.iconPosition,dir:C=Ie.dir,children:_,popup:O,expanded:I,...L}=e,K=M;return K||(K=C==="rtl"?"chevron-left":"chevron-right"),Je("li",{role:"menuitem",...L,className:l(e.className,Ne,"k-item",U(Ne,{focus:o,disabled:u}),{"k-first":N,"k-last":f}),...d&&{"aria-haspopup":"menu"},...d&&{"aria-expanded":I?"true":"false"},...u&&{"aria-disabled":"true"},...o&&{tabIndex:0},children:[Je("span",{className:l("k-link k-menu-link",U("k-menu-link",{hover:t,active:a,selected:s,disabled:u})),children:[i&&x==="before"&&ee(b,{className:"k-menu-link-icon",icon:i}),ee("span",{className:"k-menu-link-text",children:c}),i&&x==="after"&&ee(b,{className:"k-menu-link-icon",icon:i}),d&&ee("span",{className:"k-menu-expand-arrow","aria-hidden":"true",children:ee(b,{icon:K})})]}),_,O]})};g.states=Dt;g.options=$t;g.className=Ne;g.defaultOptions=Ie;g.moduleName=y;g.folderName=S;import{jsx as Gt}from"react/jsx-runtime";var Xe="k-menu-scroll-wrapper",Ft=[],Vt={},Wt={},H=e=>{let{className:t,children:o,orientation:a,...s}=e;return Gt("div",{...s,className:l(t,Xe,{"k-menu-scroll-wrapper-vertical":a==="vertical"}),children:o})};H.states=Ft;H.options=Vt;H.className=Xe;H.defaultOptions=Wt;H.moduleName=y;H.folderName=S;var qe=H;import{Fragment as ve,jsx as D,jsxs as se}from"react/jsx-runtime";var ge="k-menu",Jt=[],Xt={},ae={orientation:"horizontal",header:!0,scrollButtonsPosition:"around"},h=e=>{let{children:t,orientation:o=ae.orientation,header:a=ae.header,scrollable:s,scrollButtonsPosition:u=ae.scrollButtonsPosition,wrapperStyles:i,dir:c,popup:N,contextMenu:f,...d}=e,M={horizontal:{prev:c!=="rtl"?"left":"right",next:c!=="rtl"?"right":"left"},vertical:{prev:"up",next:"down"}},x=D("ul",{dir:c,...d,className:l(e.className,"k-reset",ge,{[`${ge}-${o}`]:o,"k-header":a}),role:f?"menu":"menubar",...o==="vertical"&&{"aria-orientation":"vertical"},children:t});return se(ve,{children:[s?se(qe,{orientation:o,style:i,dir:e.dir,children:[u==="start"&&se(ve,{children:[D(m,{fillMode:"flat",icon:`chevron-${M[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),D(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"&&D(m,{fillMode:"flat",icon:`chevron-${M[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),x,u==="end"&&se(ve,{children:[D(m,{fillMode:"flat",icon:`chevron-${M[o].prev}`,className:"k-menu-scroll-button k-menu-scroll-button-prev",tabIndex:-1,"aria-label":"Scroll previous"}),D(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"&&D(m,{fillMode:"flat",icon:`chevron-${M[o].next}`,className:"k-menu-scroll-button k-menu-scroll-button-next",tabIndex:-1,"aria-label":"Scroll next"})]}):x,N]})};h.states=Jt;h.options=Xt;h.className=ge;h.defaultOptions=ae;h.moduleName=y;h.folderName=S;h.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 qt}from"react/jsx-runtime";var ke="k-separator",Qe={orientation:"horizontal"},W=e=>{let{orientation:t=Qe.orientation,...o}=e;return qt("li",{...o,className:l(e.className,"k-item",ke,{[`${ke}-${t}`]:t}),role:"separator"})};W.className=ke;W.defaultOptions=Qe;W.moduleName=y;W.folderName=S;import{Fragment as hr,jsx as Nr}from"react/jsx-runtime";import{jsx as jt}from"react/jsx-runtime";var Ae="k-menu-group",Qt=[],Yt={size:[r.undefined,r.small,r.medium,r.large]},Zt={},T=e=>{let{children:t,size:o,...a}=e;return jt("ul",{role:"menu",...a,className:l(e.className,Ae,R(Ae,{size:o})),children:t})};T.states=Qt;T.options=Yt;T.className=Ae;T.defaultOptions=Zt;T.moduleName=y;T.folderName=S;import{Fragment as eo,jsx as G,jsxs as to}from"react/jsx-runtime";var Ee=e=>G(h,{children:to(eo,{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 Le="popup",Ye=Le;import{jsx as Ze}from"react/jsx-runtime";var je="k-animation-container",oo=[],no={},ye={positionMode:"absolute",shown:!0},z=e=>{let{positionMode:t=ye.positionMode,shown:o=ye.shown,animationStyle:a,offset:s,...u}=e;return Ze("div",{...u,style:{...s,...e.style},className:l(e.className,je,{"k-animation-container-shown":o,"k-animation-container-fixed":t==="fixed"}),children:Ze("div",{className:"k-child-animation-container",style:a,children:e.children})})};z.states=oo;z.options=no;z.className=je;z.defaultOptions=ye;z.moduleName=Le;z.folderName=Ye;var we="popup",et=we;import{jsx as tt}from"react/jsx-runtime";var ot="k-popup",ro=[],so={},nt={positionMode:"absolute"},w=e=>{let{offset:t,positionMode:o=nt.positionMode,animationStyle:a,containerClassName:s,containerRole:u,containerAriaLabel:i,...c}=e;return tt(z,{positionMode:o,offset:t,animationStyle:a,className:s,role:u,"aria-label":i,children:tt("div",{...c,className:l(e.className,ot),children:e.children})})};w.states=ro;w.options=so;w.className=ot;w.defaultOptions=nt;w.moduleName=we;w.folderName=et;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 Xr,jsx as Gr,jsxs as Jr}from"react/jsx-runtime";import{Fragment as jr,jsx as Zr,jsxs as es}from"react/jsx-runtime";import{Fragment as ss,jsx as rs,jsxs as as}from"react/jsx-runtime";import{Fragment as cs,jsx as ms,jsxs as ps}from"react/jsx-runtime";import{jsx as $,jsxs as mo}from"react/jsx-runtime";var ao={...h.options,scrollable:{type:"boolean"}},io=h.states,rt={...h.defaultOptions,variant:"horizontal"},lo=[{name:"horizontal",title:"Horizontal"},{name:"vertical",title:"Vertical"}],uo=[{name:"opened",title:"Opened"}],J=e=>{let{variant:t,modifiers:o,...a}={...rt,...e},s={},u=t==="vertical"?{left:"200px",top:"30px"}:{left:"90px",top:"auto"};return Object.keys(o||{}).forEach(i=>{i==="opened"&&(s.opened=!!o?.[i],s.popup=o?.[i]?$(w,{className:"k-menu-popup",offset:u,children:mo(T,{children:[$(g,{text:"Item 1"}),$(g,{text:"Item 2"}),$(W,{}),$(g,{text:"Item 3"})]})}):null)}),t==="vertical"?$(Ee,{...a,...s,orientation:"vertical",style:{width:"200px"}}):$(Ee,{...a,...s})};J.options=ao;J.states=io;J.variants=lo;J.defaultOptions=rt;J.modifiers=uo;J.className=h.className;import{Fragment as Ws,jsx as Fs,jsxs as Vs}from"react/jsx-runtime";import{jsx as qs}from"react/jsx-runtime";import{Fragment as xo,jsx as P,jsxs as st}from"react/jsx-runtime";var co=m.states,at={...m.defaultOptions,variant:"text"},po=m.options,fo=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],Mo=[{name:"opened",title:"Opened"}],X=e=>{let{variant:t,modifiers:o,...a}={...at,...e},s={},u=P(w,{className:"k-menu-popup",children:st(T,{size:a.size,children:[P(g,{first:!0,text:"Menu Item"}),P(g,{text:"Menu Item"}),P(g,{last:!0,text:"Menu Item"})]})}),i;switch(t){case"icon-only":i=P("div",{children:P(E,{...a,...s,icon:"star"})});break;case"icon-and-text":i=P("div",{children:P(E,{...a,...s,icon:"star",children:"Dropdown Button"})});break;default:i=P("div",{children:P(E,{...a,...s,children:"Dropdown Button"})});break}return st(xo,{children:[i,o?.opened&&u]})};X.options=po;X.states=co;X.variants=fo;X.defaultOptions=at;X.modifiers=Mo;X.className=E.className;import{Fragment as No,jsx as Oe,jsxs as Io}from"react/jsx-runtime";var bo=[],ho={},it={buttonText:"Export"},ie=e=>{let{buttonText:t=it.buttonText,children:o}=e;return Io(No,{children:[Oe("div",{className:"k-preview-pane-header",children:Oe(E,{fillMode:"flat",icon:"export",showArrow:!1,children:t})}),Oe("div",{className:"k-preview-pane-content",children:o})]})};ie.states=bo;ie.options=ho;ie.defaultOptions=it;var fa=ie;export{ie as ChartWizardPreviewPanelContent,fa as default};