@progress/kendo-themes-html/dist/esm/orgchart/templates/orgchart-group-normal.mjs

A collection of HTML helpers used for developing Kendo UI themes

var r=(...t)=>t.filter(e=>e!==!0&&!!e).map(e=>Array.isArray(e)?r(...e):typeof e=="object"?Object.keys(e).map((a,n)=>e[n]||e[a]&&a||null).filter(a=>a!==null).join(" "):e).filter(e=>!!e).join(" ");var A=(t,e)=>r({[`${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.fillMode}-${e.themeColor}`]:e.fillMode&&e.themeColor},{[`${t}-${e.themeColor}`]:e.themeColor&&e.fillMode===void 0},{"k-rounded-sm":e.rounded==="small","k-rounded-md":e.rounded==="medium","k-rounded-lg":e.rounded==="large","k-rounded-full":e.rounded==="full"}),h=(t,e)=>{let{valid:a,invalid:n,hover:c,focus:l,checked:i,active:m,selected:u,disabled:b,indeterminate:_,loading:$,empty:it,readonly:U,highlighted:B,...F}=e;return r({"k-valid":a,"k-invalid":n,"k-hover":c,"k-focus":l,"k-checked":i,"k-active":m,"k-selected":u,"k-disabled":b,"k-indeterminate":_&&!i,"k-loading":$,"k-empty":it,"k-readonly":U,"k-highlighted":B},Object.keys(F).reduce((V,k)=>(k.startsWith("k-")?V[k]=F[k]:V[`k-${k}`]=F[k],V),{}))};function Ot(t,e){if(!e)return{};let a=Array.isArray(e)?e:[e];return Object.fromEntries(a.map(n=>[`k-${n}`,!0]))}var s={xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},C={small:"small",medium:"medium",large:"large",full:"full"},N={solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},o={inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",dark:"dark",light:"light",inverse:"inverse"},d={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"},L={calloutMap:{top:"n",bottom:"s",left:"w",right:"e"},orientationMap:{vertical:"vstack",horizontal:"hstack"}};var lt="orgchart",Mt=lt;import{jsx as yt}from"react/jsx-runtime";var Et="k-orgchart",te=[],ee={},dt={width:"100%",height:"300px"},v=t=>{let{width:e=dt.width,height:a=dt.height,...n}=t;return yt("div",{...n,className:r(t.className,Et),children:yt("div",{className:"k-orgchart-container",style:{width:e,height:a},children:t.children})})};v.states=te;v.options=ee;v.className=Et;v.defaultOptions=dt;v.moduleName=lt;v.folderName=Mt;import{jsx as re}from"react/jsx-runtime";var oe="k-card-callout",St=t=>{let{callout:e,...a}=t;return re("span",{...a,className:r(t.className,oe,{[`k-callout-${L.calloutMap[e]||e}`]:e})})};var f="card",x=f;import{Fragment as ie,jsx as kt,jsxs as le}from"react/jsx-runtime";var ot="k-card",ae=[d.hover,d.focus,d.selected,d.disabled],ne={themeColor:[o.primary,o.success,o.warning,o.error,o.info]},se={},g=t=>{let{orientation:e,themeColor:a,callout:n,hover:c,focus:l,selected:i,disabled:m,...u}=t;return le("div",{...u,className:r(t.className,ot,A(ot,{themeColor:a}),h(ot,{hover:c,focus:l,disabled:m,selected:i}),{[`k-card-${e}`]:e,"k-card-with-callout":n}),children:[n&&n!=="true"&&kt(St,{callout:n}),kt(ie,{children:t.children})]})};g.states=ae;g.options=ne;g.className=ot;g.defaultOptions=se;g.moduleName=f;g.folderName=x;import{Fragment as pe,jsx as Lt}from"react/jsx-runtime";var ct="k-card-list",de=[],ce={},me={},H=t=>{let{...e}=t;return Lt("div",{...e,className:r(t.className,ct,h(ct,{})),children:Lt(pe,{children:t.children})})};H.states=de;H.options=ce;H.className=ct;H.defaultOptions=me;H.moduleName=f;H.folderName=x;import{jsx as Ce}from"react/jsx-runtime";var Kt="k-card-group",ue=[],fe={},he={},I=t=>{let{...e}=t;return Ce("div",{...e,className:r(t.className,Kt),children:t.children})};I.states=ue;I.options=fe;I.className=Kt;I.defaultOptions=he;I.moduleName=f;I.folderName=x;import{jsx as ve}from"react/jsx-runtime";var mt="k-card-wrap",Ne=[d.focus,d.selected],xe={},be={},G=t=>{let{focus:e,selected:a,...n}=t;return ve("div",{...n,className:r(t.className,mt,h(mt,{focus:e,selected:a})),children:t.children})};G.states=Ne;G.options=xe;G.className=mt;G.defaultOptions=be;G.moduleName=f;G.folderName=x;import{jsx as ge}from"react/jsx-runtime";var pt="k-card-title",Ae=[d.hover,d.focus],K=t=>{let{hover:e,focus:a,...n}=t;return ge("div",{...n,className:r(t.className,pt,h(pt,{hover:e,focus:a})),children:t.children})};K.states=Ae;K.className=pt;import{jsx as Oe}from"react/jsx-runtime";var Te="k-card-subtitle",W=t=>{let{...e}=t;return Oe("div",{...e,className:r(t.className,Te),children:t.children})};import{Fragment as Qo,jsx as Yo}from"react/jsx-runtime";import{Fragment as Se,jsx as Rt}from"react/jsx-runtime";var ut="k-font-icon",Me=[],ye={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},Ee={},X=t=>{let{size:e,themeColor:a,icon:n,rotate:c,flip:l,...i}=t;return n?Rt("span",{...i,className:r(t.className,ut,A(ut,{size:e}),{[`k-i-${n}`]:n,[`k-color-${a}`]:a,[`k-rotate-${c}`]:c,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"})}):Rt(Se,{})};X.states=Me;X.options=ye;X.className=ut;X.defaultOptions=Ee;var Dt=X;import{Fragment as Ke,jsx as rt}from"react/jsx-runtime";var ft="k-svg-icon",ke=[],Le={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},_t={viewBox:"0 0 24 24"},J=t=>{let{size:e,themeColor:a,rotate:n,flip:c,viewBox:l=_t.viewBox,icon:i,...m}=t;if(!i)return rt(Ke,{});i==="none"&&{...m,className:r(t.className,ft,"k-none")};let u=typeof i=="object"&&i.name&&i.name;return rt("span",{...m,className:r(t.className,ft,A("k-icon",{size:e}),{[`k-svg-i-${u}`]:u,[`k-color-${a}`]:a,[`k-rotate-${n}`]:n,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"}),children:rt("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof i=="object"?i.viewBox:l,dangerouslySetInnerHTML:typeof i=="object"?{__html:i.content}:void 0,children:i?void 0:t.children})})};J.states=ke;J.options=Le;J.className=ft;J.defaultOptions=_t;var ht=J;import*as Ct from"@progress/kendo-svg-icons";var Bt="icon",Ht="icons";import{Fragment as It,jsx as q}from"react/jsx-runtime";var at="k-icon",Re=t=>t.replace(/([-_][a-z0-9])/gi,e=>e.toUpperCase().replace("-","").replace("_","")),De=[],_e={size:[s.xsmall,s.small,s.medium,s.large,s.xlarge,s.xxlarge,s.xxxlarge],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark]},Nt={viewBox:"0 0 24 24",type:"svg"},M=t=>{let{size:e,themeColor:a,icon:n,type:c=Nt.type,rotate:l,flip:i,viewBox:m=Nt.viewBox,...u}=t;if(!n)return q(It,{});if(c==="svg"){if(n==="none")return q(ht,{...u,className:r(t.className,at),icon:n,size:e});let b=Ct[n]?n:Re(`${n}-icon`);return Ct[b]?q(ht,{...u,className:r(t.className,at),icon:Ct[b],size:e,themeColor:a,rotate:l,flip:i,viewBox:m}):q(It,{})}return q(Dt,{...u,className:r(t.className,at),icon:n,size:e,themeColor:a,rotate:l,flip:i})};M.states=De;M.options=_e;M.defaultOptions=Nt;M.className=at;M.moduleName=Bt;M.folderName=Ht;var xt="button",Gt=xt;import{Fragment as Ge,jsx as Y,jsxs as wt}from"react/jsx-runtime";var Q="k-button",Be=["icon-button"],He=[d.hover,d.focus,d.active,d.selected,d.disabled,d.generating],Ie={size:[s.small,s.medium,s.large],rounded:[C.small,C.medium,C.large,C.full],fillMode:[N.solid,N.flat,N.outline,N.clear,N.link],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark,o.inverse]},R={size:s.medium,rounded:C.medium,fillMode:N.solid,themeColor:o.base,showArrow:!1,arrowIconName:"caret-alt-down"},p=t=>{let{size:e=R.size,rounded:a=R.rounded,fillMode:n=R.fillMode,themeColor:c=R.themeColor,showArrow:l=R.showArrow,arrowIconName:i=R.arrowIconName,variant:m,hover:u,focus:b,active:_,selected:$,disabled:it,icon:U,text:B,iconClassName:F,...V}=t,k=U!==void 0,jt=t.children!==void 0;return wt("button",{...V,className:r(t.className,Q,Ot(Q,m),A(Q,{size:e,rounded:a,fillMode:n,themeColor:c}),h(Q,{hover:u,focus:b,active:_,disabled:it,selected:$}),{"k-icon-button":!B&&!jt&&k}),children:[U&&Y(M,{className:r(F,"k-button-icon"),icon:U}),B?wt(Ge,{children:[B&&Y("span",{className:"k-button-text",children:B}),t.children]}):t.children&&Y("span",{className:"k-button-text",children:t.children}),l&&Y("span",{className:"k-menu-button-arrow k-button-arrow",children:Y(M,{icon:i})})]})};p.states=He;p.options=Ie;p.variants=Be;p.className=Q;p.defaultOptions=R;p.moduleName=xt;p.folderName=Gt;import{jsx as Or}from"react/jsx-runtime";import{jsx as Sr}from"react/jsx-runtime";import{jsx as Rr}from"react/jsx-runtime";import{Fragment as Vr,jsx as Fr,jsxs as Wr}from"react/jsx-runtime";import{jsx as Yr}from"react/jsx-runtime";import{Fragment as ze,jsx as Z,jsxs as Pe}from"react/jsx-runtime";var we="k-card-body",nt=t=>{let{title:e,subtitle:a,details:n,...c}=t;return Pe("div",{...c,className:r(t.className,we),children:[e&&Z(K,{children:e}),a&&Z(W,{children:a}),Z(ze,{children:t.children}),n&&Z("span",{className:"k-card-header-actions",children:Z(p,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as Ve}from"react/jsx-runtime";var zt="k-card-deck",$e=[],Ue={},Fe={},w=t=>{let{...e}=t;return Ve("div",{...e,className:r(t.className,zt),children:t.children})};w.states=$e;w.options=Ue;w.className=zt;w.defaultOptions=Fe;w.moduleName=f;w.folderName=x;import{jsx as qe}from"react/jsx-runtime";var Pt="k-card-deck-scrollwrap",We=[],Xe={},Je={},z=t=>{let{...e}=t;return qe("div",{...e,className:r(t.className,Pt),children:t.children})};z.states=We;z.options=Xe;z.className=Pt;z.defaultOptions=Je;z.moduleName=f;z.folderName=x;var bt="action-buttons",$t=bt;import{jsx as Ze}from"react/jsx-runtime";var st="k-actions",Ye=[],Qe={},vt={alignment:"start",orientation:"horizontal"},E=t=>{let{alignment:e=vt.alignment,orientation:a=vt.orientation,...n}=t;return Ze("div",{...n,className:r(st,{[`${st}-${e}`]:e,[`${st}-${a}`]:a},t.className),children:t.children})};E.states=Ye;E.options=Qe;E.className=st;E.defaultOptions=vt;E.moduleName=bt;E.folderName=$t;import{Fragment as ya,jsx as Oa,jsxs as Ma}from"react/jsx-runtime";import{Fragment as _a,jsx as Ra,jsxs as Da}from"react/jsx-runtime";var At="avatar",Ut=At;import{jsx as Ft}from"react/jsx-runtime";var j="k-avatar";var je=[d.hover,d.focus,d.active,d.selected,d.disabled],to={size:[s.small,s.medium,s.large],rounded:[C.small,C.medium,C.large,C.full],fillMode:[N.solid,N.flat,N.outline],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark,o.inverse]},D={type:"text",size:s.medium,rounded:C.full,fillMode:N.solid,themeColor:o.primary,border:!1},S=t=>{let{size:e=D.size,rounded:a=D.rounded,fillMode:n=D.fillMode,themeColor:c=D.themeColor,type:l=D.type,border:i=D.border,...m}=t;return Ft("div",{...m,className:r(t.className,j,A(j,{size:e,rounded:a,fillMode:n,themeColor:c}),{[`${j}-bordered`]:i}),children:Ft("span",{className:`${j}-${l}`,children:t.children})})};S.states=je;S.options=to;S.className=j;S.defaultOptions=D;S.moduleName=At;S.folderName=Ut;import{jsx as nn}from"react/jsx-runtime";import{jsx as cn}from"react/jsx-runtime";import{jsx as fn}from"react/jsx-runtime";import{jsx as T,jsxs as gt}from"react/jsx-runtime";var eo="k-orgchart-node",Wt={buttonIcon:"plus",details:!0},O=t=>{let{title:e,subtitle:a,details:n=Wt.details,color:c,lineBottom:l,lineTop:i,button:m,buttonIcon:u=Wt.buttonIcon,avatar:b,avatarType:_,...$}=t;return gt("div",{...$,className:r(t.className,eo,"k-vstack","k-align-items-center"),children:[i&&T("div",{className:"k-orgchart-line k-orgchart-line-v"}),T(g,{className:"k-orgchart-card",children:gt(nt,{className:"k-hstack",details:n,style:{borderTopColor:c},children:[T(S,{type:_,themeColor:"secondary",children:_==="image"?T("img",{src:b}):b}),gt("div",{className:"k-card-title-wrap k-vstack",children:[T(K,{className:"k-text-ellipsis",children:e}),T("span",{className:"k-spacer"}),T(W,{className:"k-text-ellipsis",children:a})]}),T("span",{className:"k-spacer"})]})}),l&&T("div",{className:"k-orgchart-line k-orgchart-line-v"}),m&&T(p,{className:"k-orgchart-button",icon:u})]})};import{Fragment as Xt,jsx as Tt,jsxs as ao}from"react/jsx-runtime";var Jt="k-orgchart-group",oo=[],ro={},qt={orientation:"horizontal"},y=t=>{let{children:e,orientation:a=qt.orientation,justifyContent:n,...c}=t,l=[],i=[];return e&&(Array.isArray(e)?e.map(m=>{m.type===O?l.push(m):i.push(m)}):e.type===O?l.push(e):i.push(e)),ao("div",{...c,className:r(Jt,"k-pos-absolute",{[`k-${L.orientationMap[a]||a}`]:a,[`k-justify-content-${n}`]:n}),style:{width:"100%"},children:[l.length>0&&Tt("div",{className:r("k-orgchart-node-container","k-justify-content-around",{[`k-${L.orientationMap[a]||a}`]:a}),children:Tt(Xt,{children:l})}),Tt(Xt,{children:i})]})};y.states=oo;y.options=ro;y.className=Jt;y.defaultOptions=qt;import{jsx as P,jsxs as Qt}from"react/jsx-runtime";var no="k-orgchart-node-group",so=[d.focus],Yt={orientation:"horizontal",buttonIcon:"plus"},tt=t=>{let{title:e,subtitle:a,lineBottom:n,lineTop:c,button:l,buttonIcon:i=Yt.buttonIcon,focus:m,orientation:u=Yt.orientation,...b}=t;return Qt("div",{...b,className:r(t.className,no,"k-vstack","k-align-items-center"),children:[c&&P("div",{className:"k-orgchart-line k-orgchart-line-v"}),Qt("div",{className:r("k-orgchart-node-group-container","k-vstack",h("k-orgchart-node-group-container",{focus:m})),children:[e&&P("div",{className:"k-orgchart-node-group-title",children:e}),a&&P("div",{className:"k-orgchart-node-group-subtitle",children:a}),P("div",{className:r("k-orgchart-node-container",{[`k-${L.orientationMap[u]||u}`]:u}),children:t.children})]}),n&&P("div",{className:"k-orgchart-line k-orgchart-line-v"}),l&&P(p,{className:"k-orgchart-button",icon:i})]})};tt.states=so;import{jsx as In,jsxs as Gn}from"react/jsx-runtime";import{jsx as $n,jsxs as Un}from"react/jsx-runtime";import{jsx as Xn,jsxs as Jn}from"react/jsx-runtime";import{jsx as et,jsxs as Zt}from"react/jsx-runtime";var ss=({details:t,orientation:e,justifyContent:a,...n})=>et(v,{children:Zt(y,{orientation:e,justifyContent:a,children:[Zt(tt,{title:"Group Title",subtitle:"Group SubTitle",lineBottom:!0,button:!0,children:[et(O,{title:"Card Title",subtitle:"Card, Subtitle",details:t,avatar:"DK",avatarType:"text",color:"#0275d8"}),et(O,{title:"Card Title",subtitle:"Card, Subtitle",details:t,avatar:"DK",avatarType:"text",color:"#0275d8"})]}),et(tt,{title:"Group Title",subtitle:"Group SubTitle",lineBottom:!0,button:!0,children:et(O,{title:"Card Title",subtitle:"Card, Subtitle",details:t,avatar:"DK",avatarType:"text",color:"#0275d8"})})]}),...n});export{ss as OrgchartGroupNormal};