@progress/kendo-themes-html/dist/esm/chat/chat-message-group.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((a,s)=>e[s]||e[a]&&a||null).filter(a=>a!==null).join(" "):e).filter(e=>!!e).join(" ");var g=(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"}),q=(t,e)=>{let{valid:a,invalid:s,hover:r,focus:c,checked:m,active:i,selected:A,disabled:x,indeterminate:f,loading:j,empty:z,readonly:se,highlighted:ie,...K}=e;return l({"k-valid":a,"k-invalid":s,"k-hover":r,"k-focus":c,"k-checked":m,"k-active":i,"k-selected":A,"k-disabled":x,"k-indeterminate":f&&!m,"k-loading":j,"k-empty":z,"k-readonly":se,"k-highlighted":ie},Object.keys(K).reduce((H,k)=>(k.startsWith("k-")?H[k]=K[k]:H[`k-${k}`]=K[k],H),{}))};var n={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},h={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"},p={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"},v={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 B="avatar",X=B;import{jsx as J}from"react/jsx-runtime";var N="k-avatar";var le=[v.hover,v.focus,v.active,v.selected,v.disabled],de={size:[n.undefined,n.small,n.medium,n.large],rounded:[h.undefined,h.none,h.small,h.medium,h.large,h.full],fillMode:[L.undefined,L.solid,L.outline],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary]},P={type:"text",border:!1},d=t=>{let{size:e,rounded:a,fillMode:s,themeColor:r,type:c=P.type,border:m=P.border,...i}=t;return J("div",{...i,className:l(t.className,N,g(N,{size:e,rounded:a,fillMode:s,themeColor:r}),{[`${N}-bordered`]:m}),children:J("span",{className:`${N}-${c}`,children:t.children})})};d.states=le;d.options=de;d.className=N;d.defaultOptions=P;d.moduleName=B;d.folderName=X;d.ariaSpec={selector:".k-avatar",rules:[{selector:".k-avatar img",attribute:"alt",usage:"Images inside Avatar must have alt text for screen readers."}]};var y=d;import{jsx as ce}from"react/jsx-runtime";var Q=t=>ce(y,{type:"icon",...t});import{jsx as me}from"react/jsx-runtime";var Y=t=>me(y,{type:"text",...t});import{jsx as pe}from"react/jsx-runtime";var Z=t=>pe(y,{type:"image",...t});import{jsx as at}from"react/jsx-runtime";import{Fragment as xe,jsx as ee}from"react/jsx-runtime";var G="k-font-icon",ue=[],fe={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]},ve={},M=t=>{let{size:e,themeColor:a,icon:s,rotate:r,flip:c,...m}=t;return s?ee("span",{...m,className:l(t.className,G,g(G,{size:e}),{[`k-i-${s}`]:s,[`k-color-${a}`]:a,[`k-rotate-${r}`]:r,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"}),"aria-hidden":"true"}):ee(xe,{})};M.states=ue;M.options=fe;M.className=G;M.defaultOptions=ve;var te=M;import{Fragment as ye,jsx as $}from"react/jsx-runtime";var V="k-svg-icon",ge=[],he={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:[p.outline,p.solid,p.duotone]},F={viewBox:"0 0 24 24",variant:p.outline},I=t=>{let{size:e,themeColor:a,rotate:s,flip:r,viewBox:c=F.viewBox,variant:m=F.variant,icon:i,...A}=t;if(!i)return $(ye,{});if(i==="none")return $("span",{...A,className:l(t.className,V,g("k-icon",{size:e}),"k-none"),"aria-hidden":"true"});let x=typeof i=="object"&&i.name&&i.name,f=typeof i=="object"?m&&i.variants?.[m]||i.variants?.outline||i.content:void 0;return $("span",{...A,className:l(t.className,V,g("k-icon",{size:e}),{[`k-svg-i-${x}`]:x,[`k-color-${a}`]:a,[`k-rotate-${s}`]:s,"k-flip-h":r==="h"||r==="both","k-flip-v":r==="v"||r==="both"}),"aria-hidden":"true",children:$("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof i=="object"?i.viewBox:c,dangerouslySetInnerHTML:f!==void 0?{__html:f}:void 0,children:i?void 0:t.children})})};I.states=ge;I.options=he;I.className=V;I.defaultOptions=F;var D=I;import*as U from"@progress/kendo-svg-icons";var oe="icon",ne="icons";import{useContext as be}from"react";import{createContext as Ae}from"react";var ae=Ae({iconsType:"svg"});import{Fragment as re,jsx as S}from"react/jsx-runtime";var _="k-icon",Ce=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),ke=[],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],variant:[p.outline,p.solid,p.duotone]},w={viewBox:"0 0 24 24",type:"svg",variant:p.outline},u=t=>{let{iconsType:e}=be(ae),{size:a,themeColor:s,icon:r,type:c=e||w.type,rotate:m,flip:i,viewBox:A=w.viewBox,variant:x=w.variant,...f}=t;if(!r)return S(re,{});if((e||c)==="svg"){if(r==="none")return S(D,{...f,className:l(t.className,_),icon:r,size:a,variant:x});let z=U[r]?r:Ce(`${r}-icon`);return U[z]?S(D,{...f,className:l(t.className,_),icon:U[z],size:a,themeColor:s,rotate:m,flip:i,viewBox:A,variant:x}):S(re,{})}return S(te,{...f,className:l(t.className,_),icon:r,size:a,themeColor:s,rotate:m,flip:i})};u.states=ke;u.options=Ne;u.defaultOptions=w;u.className=_;u.moduleName=oe;u.folderName=ne;u.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 O}from"react/jsx-runtime";var Me=d.options,Ie=d.states,Se={...d.defaultOptions,variant:"image"},Oe=[{name:"image",title:"Image"},{name:"icon",title:"Icon Avatar"},{name:"text",title:"Text Avatar"}],Te=[],b=t=>{let{variant:e,...a}=t;switch(e){case"icon":return O(Q,{...a,children:O(u,{icon:"star"})});case"text":return O(Y,{...a,children:"JO"});default:return O(Z,{...a,children:O("img",{src:"https://demos.telerik.com/kendo-ui/content/web/Customers/RICSU.jpg"})})}};b.options=Me;b.states=Ie;b.variants=Oe;b.defaultOptions=Se;b.modifiers=Te;b.className=d.className;import{jsx as C,jsxs as W}from"react/jsx-runtime";var T="k-message-group",Ee=[v.selected],ze={},R={author:"Bruv",avatar:"/packages/html/assets/avatar.jpg",type:"receiver"},E=t=>{let{type:e=R.type,author:a=R.author,avatar:s=R.avatar,status:r,selected:c,fullWidth:m,...i}=t;return W("div",{...i,className:l(T,t.className,q(T,{selected:c}),{[`${T}-${e}`]:e,"k-no-avatar":!s,[`${T}-full-width`]:m}),children:[s&&!r&&C(d,{type:"image",children:C("img",{src:s,alt:a||""})}),r&&s&&W("div",{className:"k-chat-user-status-wrapper",children:[C(d,{type:"image",children:C("img",{src:s,alt:a||""})}),C("div",{className:"k-chat-user-status"})]}),W("div",{className:"k-message-group-content",children:[a&&C("span",{className:"k-message-author",children:a}),t.children]})]})};E.states=Ee;E.options=ze;E.className=T;E.defaultOptions=R;var Dt=E;export{T as CHATMESSAGEGROUP_CLASSNAME,E as ChatMessageGroup,Dt as default};