@progress/kendo-themes-html/dist/esm/list/list-group.mjs

A collection of HTML helpers used for developing Kendo UI themes

import ae from"react";var i=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?i(...t):typeof t=="object"?Object.keys(t).map((o,s)=>t[s]||t[o]&&o||null).filter(o=>o!==null).join(" "):t).filter(t=>!!t).join(" ");var M=(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"}),y=(e,t)=>{let{valid:o,invalid:s,hover:a,focus:m,checked:d,active:c,selected:p,disabled:h,indeterminate:u,loading:S,empty:C,readonly:E,highlighted:ie,...B}=t;return i({"k-valid":o,"k-invalid":s,"k-hover":a,"k-focus":m,"k-checked":d,"k-active":c,"k-selected":p,"k-disabled":h,"k-indeterminate":u&&!d,"k-loading":S,"k-empty":C,"k-readonly":E,"k-highlighted":ie},Object.keys(B).reduce((F,z)=>(z.startsWith("k-")?F[z]=B[z]:F[`k-${z}`]=B[z],F),{}))};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"};var O={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"},l={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 se={};function x(e){return se[e]=(se[e]||0)+1,`k-${e}-${se[e]}`}import{jsx as Ce}from"react/jsx-runtime";var we="k-list-group-sticky-header",q=e=>Ce("div",{className:i(we,e.className),children:Ce("div",{className:"k-list-header-text",children:e.children})});import{jsx as Pe}from"react/jsx-runtime";var De="k-no-data",re=e=>{let{live:t,...o}=e;return Pe("span",{...o,className:i(De,e.className),"aria-live":t?"polite":void 0,children:e.children})};var H="list",w=H;import{jsx as ge,jsxs as ve}from"react/jsx-runtime";var ne="k-list",Ge=[],Ue={size:[r.undefined,r.small,r.medium,r.large]},Be={},k=e=>{let{size:t,virtualization:o,children:s,header:a,selectAll:m,optionLabel:d,customValue:c,noData:p,screenReaders:h,...u}=e,C=ae.Children.toArray(s)[0],E=C?.props?.children?ae.Children.count(C.props.children):ae.Children.count(s);return ve("div",{...u,className:i(e.className,ne,M(ne,{size:t}),{"k-virtual-list":o}),children:[d,m,c,a&&ge(q,{children:a}),s||(p!==void 0?p:ge(re,{live:!0,children:"No data found."})),h&&s&&ve(re,{className:"k-sr-only",live:!0,children:[E," items found."]})]})};k.states=Ge;k.options=Ue;k.className=ne;k.defaultOptions=Be;k.moduleName=H;k.folderName=w;k.ariaSpec={selector:".k-list",rules:[{selector:".k-list .k-no-data",attribute:"aria-live=polite",usage:'Announces "No data found" to screen readers.'}]};import{jsx as We}from"react/jsx-runtime";var Ne="k-list-container",Fe=[],$e={},Ve={},D=e=>{let{...t}=e;return We("div",{...t,className:i(e.className,Ne),children:e.children})};D.states=Fe;D.options=$e;D.className=Ne;D.defaultOptions=Ve;D.moduleName=H;D.folderName=w;var R="checkbox",P=R;import{jsx as Ie}from"react/jsx-runtime";var J="k-checkbox",Xe=[l.hover,l.focus,l.valid,l.invalid,l.required,l.disabled,l.checked,l.indeterminate],qe={size:[r.undefined,r.small,r.medium,r.large],rounded:[K.undefined,K.none,K.small,K.medium,K.large,K.full]},Je={},L=e=>{let{id:t,checked:o,indeterminate:s,hover:a,focus:m,disabled:d,invalid:c,valid:p,required:h,size:u,rounded:S,wrapperRole:C,...E}=e;return Ie("span",{className:"k-checkbox-wrap",role:C,children:Ie("input",{...E,id:t,type:"checkbox",defaultChecked:o,required:h,disabled:d||void 0,"aria-invalid":c?"true":void 0,className:i(e.className,J,M(J,{size:u,rounded:S}),y(J,{hover:a,focus:m,disabled:d,invalid:c,valid:p,indeterminate:s,checked:o}))})})};L.states=Xe;L.options=qe;L.className=J;L.defaultOptions=Je;L.moduleName=R;L.folderName=P;L.ariaSpec={selector:".k-checkbox",rules:[{selector:".k-checkbox",attribute:"role=checkbox or type=checkbox",usage:"Announces the checkbox role of the element."},{selector:".k-checkbox",attribute:"label for or aria-label or aria-labelledby (when has accessible name)",usage:"The input requires an accessible name to which it will be assigned."},{selector:".k-checkbox",attribute:"aria-checked=true/false/mixed or checked",usage:"For native checkboxes the checked state is handled by the browser. aria-checked is used for custom implementations."},{selector:".k-checkbox",attribute:"aria-describedby (when has hint or error)",usage:"Points to the hint or error message for the checkbox."},{selector:".k-checkbox",attribute:"disabled or aria-disabled=true (when disabled)",usage:"For native checkboxes use the HTML disabled attribute. aria-disabled for custom implementations."},{selector:".k-invalid, .ng-invalid",attribute:"aria-invalid=true (when invalid)",usage:"Rendered only when the CheckBox is in a form and announces the invalid state."}]};var N=L;import{jsx as Ze}from"react/jsx-runtime";var ye="k-checkbox-list",Qe=[],Ye={},Oe={layout:"vertical"},b=e=>{let{layout:t=Oe.layout,...o}=e;return Ze("ul",{...o,className:i(e.className,ye,{[`k-list-${t}`]:t}),children:e.children})};b.states=Qe;b.options=Ye;b.className=ye;b.defaultOptions=Oe;b.moduleName=R;b.folderName=P;import{jsx as ot}from"react/jsx-runtime";var Me="k-checkbox-list-item",je=[],et={},tt={},f=e=>{let{...t}=e;return ot("li",{...t,className:i(e.className,Me),children:e.children})};f.states=je;f.options=et;f.className=Me;f.defaultOptions=tt;f.moduleName=R;f.folderName=P;import{Fragment as it,jsx as Ae,jsxs as st}from"react/jsx-runtime";var A=({children:e="Label",id:t="cb-label-after",...o})=>st(it,{children:[Ae(N,{id:t,...o}),Ae("label",{className:"k-checkbox-label",htmlFor:t,children:e})]});import{Fragment as Jo,jsx as qo,jsxs as Qo}from"react/jsx-runtime";import{Fragment as ti,jsx as ei,jsxs as oi}from"react/jsx-runtime";import{Fragment as ni,jsx as ai,jsxs as li}from"react/jsx-runtime";import{jsx as pi}from"react/jsx-runtime";import{jsx as hi}from"react/jsx-runtime";import{jsx as Ci}from"react/jsx-runtime";import{jsx as g,jsxs as Se}from"react/jsx-runtime";var rt=b.options,at=b.states,nt={...b.defaultOptions,variant:"vertical"},lt=[{name:"vertical",title:"Vertical"},{name:"horizontal",title:"Horizontal"}],ct=[],G=e=>{let{variant:t,...o}=e;return t==="horizontal"?Se(b,{layout:"horizontal",...o,children:[g(f,{children:g(A,{id:x("cb"),defaultChecked:!0,children:"Label"})}),g(f,{children:g(A,{id:x("cb"),children:"Label"})}),g(f,{children:g(A,{id:x("cb"),children:"Label"})})]}):Se(b,{...o,children:[g(f,{children:g(A,{id:x("cb"),defaultChecked:!0,children:"Label"})}),g(f,{children:g(A,{id:x("cb"),children:"Label"})}),g(f,{children:g(A,{id:x("cb"),children:"Label"})})]})};G.options=rt;G.states=at;G.variants=lt;G.defaultOptions=nt;G.modifiers=ct;G.className=b.className;import{jsx as ft}from"react/jsx-runtime";var mt=N.options,dt=N.states,pt=N.defaultOptions,ut=[],bt=[],U=e=>ft(A,{id:x("checkbox"),...e,defaultChecked:!0,children:"Label"});U.options=mt;U.states=dt;U.variants=ut;U.defaultOptions=pt;U.modifiers=bt;U.className=N.className;import{Fragment as kt,jsx as Ee}from"react/jsx-runtime";var le="k-font-icon",ht=[],xt={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]},Lt={},$=e=>{let{size:t,themeColor:o,icon:s,rotate:a,flip:m,...d}=e;return s?Ee("span",{...d,className:i(e.className,le,M(le,{size:t}),{[`k-i-${s}`]:s,[`k-color-${o}`]:o,[`k-rotate-${a}`]:a,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"}),"aria-hidden":"true"}):Ee(kt,{})};$.states=ht;$.options=xt;$.className=le;$.defaultOptions=Lt;var Te=$;import{Fragment as vt,jsx as Q}from"react/jsx-runtime";var ce="k-svg-icon",Ct=[],gt={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:[O.outline,O.solid,O.duotone]},me={viewBox:"0 0 24 24",variant:O.outline},V=e=>{let{size:t,themeColor:o,rotate:s,flip:a,viewBox:m=me.viewBox,variant:d=me.variant,icon:c,...p}=e;if(!c)return Q(vt,{});if(c==="none")return Q("span",{...p,className:i(e.className,ce,M("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let h=typeof c=="object"&&c.name&&c.name,u=typeof c=="object"?d&&c.variants?.[d]||c.variants?.outline||c.content:void 0;return Q("span",{...p,className:i(e.className,ce,M("k-icon",{size:t}),{[`k-svg-i-${h}`]:h,[`k-color-${o}`]:o,[`k-rotate-${s}`]:s,"k-flip-h":a==="h"||a==="both","k-flip-v":a==="v"||a==="both"}),"aria-hidden":"true",children:Q("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof c=="object"?c.viewBox:m,dangerouslySetInnerHTML:u!==void 0?{__html:u}:void 0,children:c?void 0:e.children})})};V.states=Ct;V.options=gt;V.className=ce;V.defaultOptions=me;var de=V;import*as pe from"@progress/kendo-svg-icons";var Ke="icon",He="icons";import{useContext as It}from"react";import{createContext as Nt}from"react";var Re=Nt({iconsType:"svg"});import{Fragment as _e,jsx as W}from"react/jsx-runtime";var Y="k-icon",yt=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),Ot=[],Mt={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:[O.outline,O.solid,O.duotone]},Z={viewBox:"0 0 24 24",type:"svg",variant:O.outline},I=e=>{let{iconsType:t}=It(Re),{size:o,themeColor:s,icon:a,type:m=t||Z.type,rotate:d,flip:c,viewBox:p=Z.viewBox,variant:h=Z.variant,...u}=e;if(!a)return W(_e,{});if((t||m)==="svg"){if(a==="none")return W(de,{...u,className:i(e.className,Y),icon:a,size:o,variant:h});let C=pe[a]?a:yt(`${a}-icon`);return pe[C]?W(de,{...u,className:i(e.className,Y),icon:pe[C],size:o,themeColor:s,rotate:d,flip:c,viewBox:p,variant:h}):W(_e,{})}return W(Te,{...u,className:i(e.className,Y),icon:a,size:o,themeColor:s,rotate:d,flip:c})};I.states=Ot;I.options=Mt;I.defaultOptions=Z;I.className=Y;I.moduleName=Ke;I.folderName=He;I.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{jsx as _,jsxs as Tt}from"react/jsx-runtime";var ue="k-list-item",At=[l.hover,l.focus,l.selected,l.disabled],St={},Et={},v=e=>{let{text:t,groupLabel:o,group:s,iconName:a,iconClassName:m,showCheckbox:d,checked:c,hover:p,focus:h,selected:u,disabled:S,actions:C,description:E,id:ie,...B}=e,F=t||e.children;return Tt("li",{...B,id:ie,role:s?"presentation":"option",tabIndex:s?void 0:h?0:-1,"aria-selected":!s&&u?"true":s?void 0:"false","aria-disabled":!s&&S?"true":void 0,className:i(e.className,s?"k-list-group-item":ue,y(ue,{hover:p,focus:h,disabled:S,selected:u})),children:[d&&_(L,{checked:c}),a&&_("span",{className:"k-list-item-icon-wrapper",children:_(I,{icon:a,className:i("k-list-item-icon",m)})}),_("span",{className:"k-list-item-text",children:F}),C&&_("div",{className:"k-list-item-actions",children:C}),E&&_("span",{className:"k-list-item-description",children:E}),o&&o!==""&&_("div",{className:"k-list-item-group-label",children:o})]})};v.states=At;v.options=St;v.className=ue;v.defaultOptions=Et;v.moduleName=H;v.folderName=w;v.ariaSpec={selector:".k-list-item",rules:[{selector:".k-list-item",attribute:"role=option",usage:"Each list item is an option in the listbox."},{selector:".k-list-item",attribute:"id",usage:"ID for aria-activedescendant reference."},{selector:".k-list-item",attribute:"aria-selected (when selectable)",usage:"Indicates the selected state of the option."},{selector:".k-list-group-item",attribute:"role=presentation",usage:"Group headers are presentational, not selectable options."},{selector:".k-list-item-icon",attribute:"aria-hidden=true",usage:"Decorative icons are hidden from assistive technology."}]};import{jsx as Ht}from"react/jsx-runtime";var Kt="k-list-ul",X=e=>{let{children:t,role:o,id:s,...a}=e;return Ht("ul",{...a,id:s,role:o,className:i(Kt,e.className),children:t})};X.ariaSpec={selector:".k-list-ul",rules:[{selector:'.k-list-ul[role="listbox"]',attribute:"role=listbox",usage:"For ungrouped lists, the UL has the listbox role."},{selector:'.k-list-ul[role="listbox"]',attribute:"aria-label or aria-labelledby (when has accessible name)",usage:"Accessible name for the listbox."},{selector:'.k-list-ul[role="group"]',attribute:"role=group",usage:"For grouped sublists under a group header."},{selector:'.k-list-ul[role="group"]',attribute:"aria-labelledby (when grouped)",usage:"References the group header ID."}]};import{jsx as be,jsxs as _t}from"react/jsx-runtime";var Rt="k-list-content",T=e=>{let{virtualization:t,grouping:o,"aria-label":s,"aria-labelledby":a,listboxId:m,...d}=e;return _t("div",{...d,className:i(Rt,e.className),role:o?"listbox":void 0,id:o?m:void 0,"aria-label":o?s:void 0,"aria-labelledby":o?a:void 0,children:[o?e.children:be(X,{role:"listbox",id:m,"aria-label":s,"aria-labelledby":a,children:e.children}),t&&be("div",{className:"k-height-container",children:be("div",{})})]})};T.ariaSpec={selector:".k-list-content",rules:[{selector:'.k-list-content[role="listbox"]',attribute:"role=listbox",usage:"For grouped lists, the list content container has the listbox role."},{selector:'.k-list-content[role="listbox"]',attribute:"aria-label or aria-labelledby (when has accessible name)",usage:"Accessible name for the listbox."}]};import{jsx as fe,jsxs as Pt}from"react/jsx-runtime";var j="k-list-sticky-header",zt=[l.hover,l.focus,l.selected],wt={},Dt={},ee=e=>{let{label:t="Select all",showCheckbox:o=!0,checked:s,indeterminate:a,hover:m,focus:d,selected:c,...p}=e;return fe("div",{...p,className:i(j,e.className),children:Pt("div",{className:i(`${j}-item`,y(`${j}-item`,{hover:m,focus:d,selected:c})),children:[o&&fe(L,{checked:s,indeterminate:a,"aria-label":t}),fe("span",{className:"k-list-item-text",children:t})]})})};ee.states=zt;ee.options=wt;ee.className=j;ee.defaultOptions=Dt;import{jsx as he,jsxs as Ut}from"react/jsx-runtime";var Gt="k-list-group-item",xe=e=>{let{groupIconName:t,...o}=e;return Ut("li",{...o,role:"presentation",className:i(Gt,e.className),children:[t&&he("span",{className:"k-list-item-icon-wrapper",children:he(I,{icon:t,className:"k-list-item-icon"})}),he("span",{className:"k-list-item-text",children:e.children})]})};xe.ariaSpec={selector:".k-list-group-item",rules:[{selector:".k-list-group-item",attribute:"role=presentation",usage:"Group headers are presentational, not selectable options."},{selector:".k-list-group-item",attribute:"id (when referenced)",usage:"ID for aria-labelledby on the parent group UL."}]};import{jsx as Vt}from"react/jsx-runtime";var Le="k-list-optionlabel",Bt=[l.hover,l.focus,l.selected,l.disabled],Ft={},$t={},te=e=>{let{text:t,hover:o,focus:s,selected:a,disabled:m,...d}=e;return Vt("div",{...d,className:i(Le,y(Le,{hover:o,focus:s,selected:a,disabled:m})),children:t})};te.states=Bt;te.options=Ft;te.className=Le;te.defaultOptions=$t;import{jsx as Jt}from"react/jsx-runtime";var ke="k-list-custom-value",Wt=[l.hover,l.focus,l.selected,l.disabled],Xt={},qt={},oe=e=>{let{text:t,hover:o,focus:s,selected:a,disabled:m,...d}=e;return Jt("div",{...d,className:i(ke,y(ke,{hover:o,focus:s,selected:a,disabled:m})),children:t})};oe.states=Wt;oe.options=Xt;oe.className=ke;oe.defaultOptions=qt;import{Fragment as Ws,jsx as Vs,jsxs as Xs}from"react/jsx-runtime";import{Fragment as js,jsx as Zs,jsxs as er}from"react/jsx-runtime";import{Fragment as nr,jsx as rr,jsxs as ar}from"react/jsx-runtime";import{Fragment as br,jsx as pr,jsxs as ur}from"react/jsx-runtime";import{jsx as Lr}from"react/jsx-runtime";import{Fragment as Ir,jsx as Nr,jsxs as yr}from"react/jsx-runtime";import{Fragment as Qt,jsx as ze,jsxs as Yt}from"react/jsx-runtime";var Wr=e=>{let{virtualization:t,label:o}=e;return Yt(Qt,{children:[o&&ze(q,{children:o}),e.children&&ze(T,{virtualization:t,children:e.children})]})};export{Wr as ListGroup};