@progress/kendo-themes-html/dist/esm/suggestion/templates/suggestion-group-wrap.mjs

A collection of HTML helpers used for developing Kendo UI themes

var l=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?l(...e):typeof e=="object"?Object.keys(e).map((s,a)=>e[a]||e[s]&&s||null).filter(s=>s!==null).join(" "):e).filter(e=>!!e).join(" ");var y=(t,e)=>l({[`${t}-xs`]:e.size==="xsmall",[`${t}-sm`]:e.size==="small",[`${t}-md`]:e.size==="medium",[`${t}-lg`]:e.size==="large",[`${t}-xl`]:e.size==="xlarge",[`${t}-xxl`]:e.size==="xxlarge",[`${t}-xxxl`]:e.size==="xxxlarge"},{[`${t}-${e.fillMode}`]:e.fillMode},{[`${t}-${e.themeColor}`]:e.themeColor},{"k-rounded-sm":e.rounded==="small","k-rounded-md":e.rounded==="medium","k-rounded-lg":e.rounded==="large","k-rounded-full":e.rounded==="full","k-rounded-none":e.rounded==="none"}),K=(t,e)=>{let{valid:s,invalid:a,hover:r,focus:u,checked:d,active:c,selected:N,disabled:v,indeterminate:f,loading:z,empty:S,readonly:_,highlighted:F,...T}=e;return l({"k-valid":s,"k-invalid":a,"k-hover":r,"k-focus":u,"k-checked":d,"k-active":c,"k-selected":N,"k-disabled":v,"k-indeterminate":f&&!d,"k-loading":z,"k-empty":S,"k-readonly":_,"k-highlighted":F},Object.keys(T).reduce((m,C)=>(C.startsWith("k-")?m[C]=T[C]:m[`k-${C}`]=T[C],m),{}))};function ee(t,e){if(!e)return{};let s=Array.isArray(e)?e:[e];return Object.fromEntries(s.map(a=>[`k-${a}`,!0]))}var n={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"},O={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},g={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},o={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 Ce,jsx as te}from"react/jsx-runtime";var V="k-font-icon",ye=[],Ne={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info]},Se={},M=t=>{let{size:e,themeColor:s,icon:a,rotate:r,flip:u,...d}=t;return a?te("span",{...d,className:l(t.className,V,y(V,{size:e}),{[`k-i-${a}`]:a,[`k-color-${s}`]:s,[`k-rotate-${r}`]:r,"k-flip-h":u==="h"||u==="both","k-flip-v":u==="v"||u==="both"}),"aria-hidden":"true"}):te(Ce,{})};M.states=ye;M.options=Ne;M.className=V;M.defaultOptions=Se;var oe=M;import{Fragment as Te,jsx as G}from"react/jsx-runtime";var q="k-svg-icon",ke=[],Oe={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info],variant:[g.outline,g.solid,g.duotone]},W={viewBox:"0 0 24 24",variant:g.outline},w=t=>{let{size:e,themeColor:s,rotate:a,flip:r,viewBox:u=W.viewBox,variant:d=W.variant,icon:c,...N}=t;if(!c)return G(Te,{});if(c==="none")return G("span",{...N,className:l(t.className,q,y("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let v=typeof c=="object"&&c.name&&c.name,f=typeof c=="object"?d&&c.variants?.[d]||c.variants?.outline||c.content:void 0;return G("span",{...N,className:l(t.className,q,y("k-icon",{size:e}),{[`k-svg-i-${v}`]:v,[`k-color-${s}`]:s,[`k-rotate-${a}`]:a,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),"aria-hidden":"true",children:G("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof c=="object"?c.viewBox:u,dangerouslySetInnerHTML:f!==void 0?{__html:f}:void 0,children:c?void 0:t.children})})};w.states=ke;w.options=Oe;w.className=q;w.defaultOptions=W;var J=w;import*as Q from"@progress/kendo-svg-icons";var ne="icon",se="icons";import{useContext as Ie}from"react";import{createContext as Be}from"react";var re=Be({iconsType:"svg"});import{Fragment as ie,jsx as A}from"react/jsx-runtime";var R="k-icon",Me=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),we=[],Ae={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info],variant:[g.outline,g.solid,g.duotone]},$={viewBox:"0 0 24 24",type:"svg",variant:g.outline},x=t=>{let{iconsType:e}=Ie(re),{size:s,themeColor:a,icon:r,type:u=e||$.type,rotate:d,flip:c,viewBox:N=$.viewBox,variant:v=$.variant,...f}=t;if(!r)return A(ie,{});if((e||u)==="svg"){if(r==="none")return A(J,{...f,className:l(t.className,R),icon:r,size:s,variant:v});let S=Q[r]?r:Me(`${r}-icon`);return Q[S]?A(J,{...f,className:l(t.className,R),icon:Q[S],size:s,themeColor:a,rotate:d,flip:c,viewBox:N,variant:v}):A(ie,{})}return A(oe,{...f,className:l(t.className,R),icon:r,size:s,themeColor:a,rotate:d,flip:c})};x.states=we;x.options=Ae;x.defaultOptions=$;x.className=R;x.moduleName=ne;x.folderName=se;x.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 X="button",ae=X;import{Fragment as le,jsx as B,jsxs as ce}from"react/jsx-runtime";var E="k-button",Ee=["icon-button"],ze=[p.hover,p.focus,p.active,p.selected,p.disabled,p.generating],_e={size:[n.undefined,n.xsmall,n.small,n.medium,n.large],rounded:[k.undefined,k.none,k.small,k.medium,k.large,k.full],fillMode:[O.undefined,O.solid,O.flat,O.outline,O.clear,O.link],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.inverse]},Y={showArrow:!1,arrowIconName:"chevron-down"},i=t=>{let{as:e="button",size:s,rounded:a,fillMode:r,themeColor:u,showArrow:d=Y.showArrow,arrowIconName:c=Y.arrowIconName,variant:N,hover:v,focus:f,active:z,selected:S,disabled:_,togglable:F,ariaDisabled:T,icon:m,iconSize:C,text:L,iconClassName:ge,className:xe,...he}=t,be=m!=null,ve=t.children!==void 0;return ce(e,{className:l(xe,E,ee(E,N),y(E,{size:s,rounded:a,fillMode:r,themeColor:u}),K(E,{hover:v,focus:f,active:z,disabled:_||T,selected:S}),{"k-icon-button":!L&&!ve&&be}),"aria-pressed":F?S?"true":"false":void 0,...he,"aria-disabled":T?"true":void 0,disabled:_||void 0,children:[typeof m=="string"&&m&&B(x,{className:l(ge,"k-button-icon"),icon:m,size:C}),m&&typeof m!="string"&&B(le,{children:m}),L?ce(le,{children:[L&&B("span",{className:"k-button-text",children:L}),t.children]}):t.children&&B("span",{className:"k-button-text",children:t.children}),d&&B("span",{className:"k-menu-button-arrow k-button-arrow",children:B(x,{icon:c})})]})};i.states=ze;i.options=_e;i.variants=Ee;i.className=E;i.defaultOptions=Y;i.moduleName=X;i.folderName=ae;i.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 Le}from"react/jsx-runtime";var ue=t=>Le(i,{icon:"folder",...t,"aria-label":t["aria-label"]||"Folder",children:void 0});import{jsx as Ke}from"react/jsx-runtime";var de=t=>Ke(i,{icon:"folder",children:"Button",...t});import{jsx as Ge}from"react/jsx-runtime";var me=t=>Ge(i,{children:"Button",...t});import{jsx as Z}from"react/jsx-runtime";var Re=i.options,$e=i.states,Pe={...i.defaultOptions,variant:"text"},Ue=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],He=[],I=t=>{let{variant:e,...s}=t;switch(e){case"icon-only":return Z(ue,{...s,icon:"star"});case"icon-and-text":return Z(de,{...s,icon:"star",children:"Button"});default:return Z(me,{...s,children:"Button"})}};I.options=Re;I.states=$e;I.variants=Ue;I.defaultOptions=Pe;I.modifiers=He;I.className=i.className;var j="suggestion",pe=j;import{jsx as P,jsxs as Ve}from"react/jsx-runtime";var U="k-suggestion-group",De=[],Fe={},fe={layout:"scrollable",scrollingPosition:"start"},h=t=>{let{layout:e=fe.layout,scrollingPosition:s,...a}=t,r=P("div",{...a,className:l(U,{"k-suggestion-group-scrollable":e=="scrollable",[`${U}-scrollable-start`]:s==="start"||s==="both",[`${U}-scrollable-end`]:s==="end"||s==="both"},t.className),role:"group",children:e==="scrollable"||e==="scrollButtons"?P("div",{className:"k-suggestions-scroll",children:t.children}):t.children});return e=="scrollButtons"?Ve("div",{className:"k-suggestion-scrollwrap",children:[P(i,{fillMode:"flat",icon:"chevron-left",size:"xsmall","aria-label":"Scroll left"}),r,P(i,{fillMode:"flat",icon:"chevron-right",size:"xsmall","aria-label":"Scroll right"})]}):r};h.states=De;h.options=Fe;h.className=U;h.defaultOptions=fe;h.moduleName=j;h.folderName=pe;import{jsx as Qe}from"react/jsx-runtime";var H="k-suggestion",qe=[p.active,p.hover,p.focus],We={themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary]},Je={text:"Suggestion"},b=t=>{let{themeColor:e,active:s,hover:a,focus:r,text:u,...d}=t;return Qe("span",{...d,className:l(t.className,H,K(H,{hover:a,active:s,focus:r}),y(H,{themeColor:e})),role:"button",tabIndex:0,"aria-label":u,children:u})};b.states=qe;b.options=We;b.className=H;b.item=Je;import{Fragment as xo,jsx as go,jsxs as ho}from"react/jsx-runtime";import{Fragment as So,jsx as No,jsxs as Co}from"react/jsx-runtime";import{Fragment as Xe,jsx as D,jsxs as Ye}from"react/jsx-runtime";var Eo=t=>D(h,{layout:"wrap",children:Ye(Xe,{children:[D(b,{text:"Suggestion"}),D(b,{text:"Suggestion"}),D(b,{text:"Suggestion"})]}),...t});export{Eo as SuggestionGroupWrap};