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

A collection of HTML helpers used for developing Kendo UI themes

var r=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?r(...t):typeof t=="object"?Object.keys(t).map((a,n)=>t[n]||t[a]&&a||null).filter(a=>a!==null).join(" "):t).filter(t=>!!t).join(" ");var M=(e,t)=>r({[`${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.fillMode}-${t.themeColor}`]:t.fillMode&&t.themeColor},{[`${e}-${t.themeColor}`]:t.themeColor&&t.fillMode===void 0},{"k-rounded-sm":t.rounded==="small","k-rounded-md":t.rounded==="medium","k-rounded-lg":t.rounded==="large","k-rounded-full":t.rounded==="full"}),N=(e,t)=>{let{valid:a,invalid:n,hover:l,focus:m,checked:i,active:C,selected:u,disabled:T,indeterminate:X,loading:Y,empty:Q,readonly:R,highlighted:E,...B}=t;return r({"k-valid":a,"k-invalid":n,"k-hover":l,"k-focus":m,"k-checked":i,"k-active":C,"k-selected":u,"k-disabled":T,"k-indeterminate":X&&!i,"k-loading":Y,"k-empty":Q,"k-readonly":R,"k-highlighted":E},Object.keys(B).reduce((H,b)=>(b.startsWith("k-")?H[b]=B[b]:H[`k-${b}`]=B[b],H),{}))};function ce(e,t){if(!t)return{};let a=Array.isArray(t)?t:[t];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"},g={small:"small",medium:"medium",large:"large",full:"full"},v={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"},me={calloutMap:{top:"n",bottom:"s",left:"w",right:"e"},orientationMap:{vertical:"vstack",horizontal:"hstack"}};import{jsx as _e}from"react/jsx-runtime";var ke="k-card-callout",pe=e=>{let{callout:t,...a}=e;return _e("span",{...a,className:r(e.className,ke,{[`k-callout-${me.calloutMap[t]||t}`]:t})})};var p="card",f=p;import{Fragment as Be,jsx as ue,jsxs as He}from"react/jsx-runtime";var G="k-card",De=[d.hover,d.focus,d.selected,d.disabled],Ke={themeColor:[o.primary,o.success,o.warning,o.error,o.info]},Re={},x=e=>{let{orientation:t,themeColor:a,callout:n,hover:l,focus:m,selected:i,disabled:C,...u}=e;return He("div",{...u,className:r(e.className,G,M(G,{themeColor:a}),N(G,{hover:l,focus:m,disabled:C,selected:i}),{[`k-card-${t}`]:t,"k-card-with-callout":n}),children:[n&&n!=="true"&&ue(pe,{callout:n}),ue(Be,{children:e.children})]})};x.states=De;x.options=Ke;x.className=G;x.defaultOptions=Re;x.moduleName=p;x.folderName=f;import{Fragment as Pe,jsx as fe}from"react/jsx-runtime";var Z="k-card-list",Ie=[],we={},ze={},S=e=>{let{...t}=e;return fe("div",{...t,className:r(e.className,Z,N(Z,{})),children:fe(Pe,{children:e.children})})};S.states=Ie;S.options=we;S.className=Z;S.defaultOptions=ze;S.moduleName=p;S.folderName=f;import{jsx as Ge}from"react/jsx-runtime";var Ce="k-card-group",Ue=[],$e={},Fe={},y=e=>{let{...t}=e;return Ge("div",{...t,className:r(e.className,Ce),children:e.children})};y.states=Ue;y.options=$e;y.className=Ce;y.defaultOptions=Fe;y.moduleName=p;y.folderName=f;import{jsx as Je}from"react/jsx-runtime";var j="k-card-wrap",We=[d.focus,d.selected],Ve={},qe={},O=e=>{let{focus:t,selected:a,...n}=e;return Je("div",{...n,className:r(e.className,j,N(j,{focus:t,selected:a})),children:e.children})};O.states=We;O.options=Ve;O.className=j;O.defaultOptions=qe;O.moduleName=p;O.folderName=f;import{jsx as Ye}from"react/jsx-runtime";var ee="k-card-title",Xe=[d.hover,d.focus],k=e=>{let{hover:t,focus:a,...n}=e;return Ye("div",{...n,className:r(e.className,ee,N(ee,{hover:t,focus:a})),children:e.children})};k.states=Xe;k.className=ee;import{jsx as Ze}from"react/jsx-runtime";var Qe="k-card-subtitle",W=e=>{let{...t}=e;return Ze("div",{...t,className:r(e.className,Qe),children:e.children})};import{Fragment as No,jsx as Co}from"react/jsx-runtime";import{Fragment as ot,jsx as Ne}from"react/jsx-runtime";var te="k-font-icon",je=[],et={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]},tt={},I=e=>{let{size:t,themeColor:a,icon:n,rotate:l,flip:m,...i}=e;return n?Ne("span",{...i,className:r(e.className,te,M(te,{size:t}),{[`k-i-${n}`]:n,[`k-color-${a}`]:a,[`k-rotate-${l}`]:l,"k-flip-h":m==="h"||m==="both","k-flip-v":m==="v"||m==="both"})}):Ne(ot,{})};I.states=je;I.options=et;I.className=te;I.defaultOptions=tt;var xe=I;import{Fragment as at,jsx as V}from"react/jsx-runtime";var oe="k-svg-icon",rt=[],nt={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]},he={viewBox:"0 0 24 24"},w=e=>{let{size:t,themeColor:a,rotate:n,flip:l,viewBox:m=he.viewBox,icon:i,...C}=e;if(!i)return V(at,{});i==="none"&&{...C,className:r(e.className,oe,"k-none")};let u=typeof i=="object"&&i.name&&i.name;return V("span",{...C,className:r(e.className,oe,M("k-icon",{size:t}),{[`k-svg-i-${u}`]:u,[`k-color-${a}`]:a,[`k-rotate-${n}`]:n,"k-flip-h":l==="h"||l==="both","k-flip-v":l==="v"||l==="both"}),children:V("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof i=="object"?i.viewBox:m,dangerouslySetInnerHTML:typeof i=="object"?{__html:i.content}:void 0,children:i?void 0:e.children})})};w.states=rt;w.options=nt;w.className=oe;w.defaultOptions=he;var re=w;import*as ne from"@progress/kendo-svg-icons";var Ae="icon",Me="icons";import{Fragment as be,jsx as z}from"react/jsx-runtime";var q="k-icon",st=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),it=[],lt={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]},ae={viewBox:"0 0 24 24",type:"svg"},h=e=>{let{size:t,themeColor:a,icon:n,type:l=ae.type,rotate:m,flip:i,viewBox:C=ae.viewBox,...u}=e;if(!n)return z(be,{});if(l==="svg"){if(n==="none")return z(re,{...u,className:r(e.className,q),icon:n,size:t});let T=ne[n]?n:st(`${n}-icon`);return ne[T]?z(re,{...u,className:r(e.className,q),icon:ne[T],size:t,themeColor:a,rotate:m,flip:i,viewBox:C}):z(be,{})}return z(xe,{...u,className:r(e.className,q),icon:n,size:t,themeColor:a,rotate:m,flip:i})};h.states=it;h.options=lt;h.defaultOptions=ae;h.className=q;h.moduleName=Ae;h.folderName=Me;var se="button",ve=se;import{Fragment as pt,jsx as P,jsxs as Le}from"react/jsx-runtime";var U="k-button",dt=["icon-button"],ct=[d.hover,d.focus,d.active,d.selected,d.disabled,d.generating],mt={size:[s.small,s.medium,s.large],rounded:[g.small,g.medium,g.large,g.full],fillMode:[v.solid,v.flat,v.outline,v.clear,v.link],themeColor:[o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.light,o.dark,o.inverse]},L={size:s.medium,rounded:g.medium,fillMode:v.solid,themeColor:o.base,showArrow:!1,arrowIconName:"caret-alt-down"},c=e=>{let{size:t=L.size,rounded:a=L.rounded,fillMode:n=L.fillMode,themeColor:l=L.themeColor,showArrow:m=L.showArrow,arrowIconName:i=L.arrowIconName,variant:C,hover:u,focus:T,active:X,selected:Y,disabled:Q,icon:R,text:E,iconClassName:B,...H}=e,b=R!==void 0,Oe=e.children!==void 0;return Le("button",{...H,className:r(e.className,U,ce(U,C),M(U,{size:t,rounded:a,fillMode:n,themeColor:l}),N(U,{hover:u,focus:T,active:X,disabled:Q,selected:Y}),{"k-icon-button":!E&&!Oe&&b}),children:[R&&P(h,{className:r(B,"k-button-icon"),icon:R}),E?Le(pt,{children:[E&&P("span",{className:"k-button-text",children:E}),e.children]}):e.children&&P("span",{className:"k-button-text",children:e.children}),m&&P("span",{className:"k-menu-button-arrow k-button-arrow",children:P(h,{icon:i})})]})};c.states=ct;c.options=mt;c.variants=dt;c.className=U;c.defaultOptions=L;c.moduleName=se;c.folderName=ve;import{jsx as Fo}from"react/jsx-runtime";import{jsx as qo}from"react/jsx-runtime";import{jsx as Qo}from"react/jsx-runtime";import{Fragment as ft,jsx as $,jsxs as Ct}from"react/jsx-runtime";var ut="k-card-header",Te=e=>{let{title:t,subtitle:a,details:n,...l}=e;return Ct("div",{...l,className:r(e.className,ut),children:[t&&$(k,{children:t}),a&&$(W,{children:a}),$(ft,{children:e.children}),n&&$("span",{className:"k-card-header-actions",children:$(c,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as pr}from"react/jsx-runtime";import{Fragment as xt,jsx as F,jsxs as ht}from"react/jsx-runtime";var Nt="k-card-body",ie=e=>{let{title:t,subtitle:a,details:n,...l}=e;return ht("div",{...l,className:r(e.className,Nt),children:[t&&F(k,{children:t}),a&&F(W,{children:a}),F(xt,{children:e.children}),n&&F("span",{className:"k-card-header-actions",children:F(c,{className:"k-card-details",icon:"more-vertical",rounded:"medium",size:"medium",fillMode:"flat",themeColor:"base"})})]})};import{jsx as vt}from"react/jsx-runtime";var Ee="k-card-deck",At=[],Mt={},bt={},_=e=>{let{...t}=e;return vt("div",{...t,className:r(e.className,Ee),children:e.children})};_.states=At;_.options=Mt;_.className=Ee;_.defaultOptions=bt;_.moduleName=p;_.folderName=f;import{jsx as gt}from"react/jsx-runtime";var ge="k-card-deck-scrollwrap",Lt=[],Tt={},Et={},D=e=>{let{...t}=e;return gt("div",{...t,className:r(e.className,ge),children:e.children})};D.states=Lt;D.options=Tt;D.className=ge;D.defaultOptions=Et;D.moduleName=p;D.folderName=f;var le="action-buttons",Se=le;import{jsx as Ot}from"react/jsx-runtime";var J="k-actions",St=[],yt={},de={alignment:"start",orientation:"horizontal"},A=e=>{let{alignment:t=de.alignment,orientation:a=de.orientation,...n}=e;return Ot("div",{...n,className:r(J,{[`${J}-${t}`]:t,[`${J}-${a}`]:a},e.className),children:e.children})};A.states=St;A.options=yt;A.className=J;A.defaultOptions=de;A.moduleName=le;A.folderName=Se;import{Fragment as Ur,jsx as zr,jsxs as Pr}from"react/jsx-runtime";import{Fragment as kt,jsx as K,jsxs as ye}from"react/jsx-runtime";var dn=e=>K(x,{orientation:"vertical",children:ye(kt,{children:[K(Te,{children:"Card Header"}),K(ie,{children:K("p",{children:"Some quick example text to build on the card title and make up the bulk of the card's content."})}),ye(A,{className:"k-card-actions",children:[K(c,{fillMode:"flat",themeColor:"primary",children:"Action 1"}),K(c,{fillMode:"flat",themeColor:"primary",children:"Action 2"})]})]}),...e});export{dn as CardNormal};