@progress/kendo-themes-html
Version:
A collection of HTML helpers used for developing Kendo UI themes
2 lines (1 loc) • 22.4 kB
JavaScript
var Rt=Object.create;var ue=Object.defineProperty;var Bt=Object.getOwnPropertyDescriptor;var _t=Object.getOwnPropertyNames;var Kt=Object.getPrototypeOf,Ht=Object.prototype.hasOwnProperty;var Dt=(e,t)=>{for(var o in t)ue(e,o,{get:t[o],enumerable:!0})},ze=(e,t,o,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of _t(t))!Ht.call(e,a)&&a!==o&&ue(e,a,{get:()=>t[a],enumerable:!(s=Bt(t,a))||s.enumerable});return e};var Pe=(e,t,o)=>(o=e!=null?Rt(Kt(e)):{},ze(t||!e||!e.__esModule?ue(o,"default",{value:e,enumerable:!0}):o,e)),It=e=>ze(ue({},"__esModule",{value:!0}),e);var Vo={};Dt(Vo,{TileLayoutNormal:()=>be});module.exports=It(Vo);var r=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?r(...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 $=(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.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"}),T=(e,t)=>{let{valid:o,invalid:s,hover:a,focus:m,checked:c,active:d,selected:D,disabled:K,indeterminate:k,loading:U,empty:M,readonly:me,highlighted:ye,...J}=t;return r({"k-valid":o,"k-invalid":s,"k-hover":a,"k-focus":m,"k-checked":c,"k-active":d,"k-selected":D,"k-disabled":K,"k-indeterminate":k&&!c,"k-loading":U,"k-empty":M,"k-readonly":me,"k-highlighted":ye},Object.keys(J).reduce((y,F)=>(F.startsWith("k-")?y[F]=J[F]:y[`k-${F}`]=J[F],y),{}))};function Ue(e,t){if(!t)return{};let o=Array.isArray(t)?t:[t];return Object.fromEntries(o.map(s=>[`k-${s}`,!0]))}var l={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"},W={undefined:void 0,none:"none",small:"small",medium:"medium",large:"large",full:"full"},V={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},E={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"},u={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"},Fe={calloutMap:{top:"n",bottom:"s",left:"w",right:"e"},orientationMap:{vertical:"vstack",horizontal:"hstack"}};var Te={};function Ae(e){return Te[e]=(Te[e]||0)+1,`k-${e}-${Te[e]}`}var X="tile-layout",Q="tilelayout";var We=require("react/jsx-runtime"),$e="k-tilelayout",wt=[],zt={},Pt={},C=e=>{let{gap:t,columns:o,columnWidth:s,rowHeight:a,style:m,children:c}=e,d={gridTemplateColumns:`repeat(${o}, minmax(0px, ${s}))`,gridAutoRows:`minmax(0px, ${a})`,gap:t,...m};return(0,We.jsx)("div",{className:r(e.className,$e),style:d,role:"list",children:c})};C.states=wt;C.options=zt;C.className=$e;C.defaultOptions=Pt;C.moduleName=X;C.folderName=Q;C.ariaSpec={selector:".k-tilelayout",rules:[{selector:".k-tilelayout",attribute:"role=list",usage:"Sets list role to the TileLayout wrapper."},{selector:".k-tilelayout-item",attribute:"role=listitem",usage:"Sets listitem role to the TileLayout items."},{selector:".k-tilelayout-item",attribute:"aria-labelledby",usage:"Associates the focusable item wrapper with the respective header text element."},{selector:".k-tilelayout-item",attribute:"tabindex=0",usage:"Makes the item wrapper element focusable."},{selector:".k-tilelayout-item",attribute:"aria-keyshortcuts=Enter",usage:"Announces Enter as an available key shortcut when the item is focused."},{selector:".k-tilelayout-item-header .k-card-title",attribute:"id",usage:"Unique identifier to link the header text element to the focusable wrapper."}]};var vt=Pe(require("react"));var Ge=require("react/jsx-runtime"),Ut="k-card-callout",Ve=e=>{let{callout:t,...o}=e;return(0,Ge.jsx)("span",{...o,className:r(e.className,Ut,{[`k-callout-${Fe.calloutMap[t]||t}`]:t})})};var N="card",A=N;var G=require("react/jsx-runtime"),ve="k-card",Ft=[u.hover,u.focus,u.selected,u.disabled],$t={},Wt={},f=e=>{let{orientation:t,callout:o,hover:s,focus:a,selected:m,disabled:c,...d}=e;return(0,G.jsxs)("div",{...d,className:r(e.className,ve,T(ve,{hover:s,focus:a,disabled:c,selected:m}),{[`k-card-${t}`]:t,"k-card-with-callout":o}),children:[o&&o!=="true"&&(0,G.jsx)(Ve,{callout:o}),(0,G.jsx)(G.Fragment,{children:e.children})]})};f.states=Ft;f.options=$t;f.className=ve;f.defaultOptions=Wt;f.moduleName=N;f.folderName=A;f.ariaSpec={selector:".k-card",rules:[{selector:".k-card-list .k-card",attribute:"role=listitem",usage:"When the card is located in a list, it should have the listitem role."},{selector:".k-card-list .k-card",attribute:"tabindex=0",usage:"The card component is focusable when navigatable."},{selector:".k-card-list .k-card",attribute:"aria-describedby=.k-card-title id",usage:"Associate the card to the title element."},{selector:".k-card-list .k-card",attribute:"aria-keyshortcuts=Enter",usage:"Announces the bound Enter key that enables navigation inside the card."}]};var se=require("react/jsx-runtime"),ge="k-card-list",Vt=[],Gt={},Yt={},I=e=>{let{...t}=e;return(0,se.jsx)("div",{...t,className:r(e.className,ge,T(ge,{})),role:"list",children:(0,se.jsx)(se.Fragment,{children:e.children})})};I.states=Vt;I.options=Gt;I.className=ge;I.defaultOptions=Yt;I.moduleName=N;I.folderName=A;I.ariaSpec={selector:".k-card-list",rules:[{selector:".k-card-list",attribute:"role=list",usage:"The card list container announces its list role."},{selector:".k-card-list .k-card",attribute:"role=listitem",usage:"Each card in the list has the listitem role."},{selector:".k-card-list .k-card",attribute:"tabindex=0",usage:"The card is focusable when navigatable."},{selector:".k-card-list .k-card",attribute:"aria-describedby=.k-card-title id",usage:"Associate the card to its title element."},{selector:".k-card-list .k-card",attribute:"aria-keyshortcuts=Enter",usage:"Announces the Enter key for navigation inside the card."}]};var qe=require("react/jsx-runtime"),Ye="k-card-group",qt=[],Jt={},Xt={},Z=e=>{let{...t}=e;return(0,qe.jsx)("div",{...t,className:r(e.className,Ye),children:e.children})};Z.states=qt;Z.options=Jt;Z.className=Ye;Z.defaultOptions=Xt;Z.moduleName=N;Z.folderName=A;var Je=require("react/jsx-runtime"),Le="k-card-wrap",Qt=[u.focus,u.selected],Zt={},jt={},j=e=>{let{focus:t,selected:o,...s}=e;return(0,Je.jsx)("div",{...s,className:r(e.className,Le,T(Le,{focus:t,selected:o})),children:e.children})};j.states=Qt;j.options=Zt;j.className=Le;j.defaultOptions=jt;j.moduleName=N;j.folderName=A;var Xe=require("react/jsx-runtime"),ke="k-card-title",eo=[u.hover,u.focus],Y=e=>{let{hover:t,focus:o,...s}=e;return(0,Xe.jsx)("div",{...s,className:r(e.className,ke,T(ke,{hover:t,focus:o})),children:e.children})};Y.states=eo;Y.className=ke;var Qe=require("react/jsx-runtime"),to="k-card-subtitle",fe=e=>{let{...t}=e;return(0,Qe.jsx)("div",{...t,className:r(e.className,to),children:e.children})};var w=require("react/jsx-runtime"),Ze="k-card-media",Me=e=>{let{src:t,...o}=e;return(0,w.jsx)(w.Fragment,{children:t?(0,w.jsx)("img",{...o,className:r(e.className,Ze),src:t}):(0,w.jsx)("span",{...o,className:r(e.className,Ze),children:(0,w.jsx)(w.Fragment,{children:e.children})})})};var ie=require("react/jsx-runtime"),Ee="k-font-icon",oo=[],ro={size:[l.undefined,l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info]},ao={},le=e=>{let{size:t,themeColor:o,icon:s,rotate:a,flip:m,...c}=e;return s?(0,ie.jsx)("span",{...c,className:r(e.className,Ee,$(Ee,{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"}):(0,ie.jsx)(ie.Fragment,{})};le.states=oo;le.options=ro;le.className=Ee;le.defaultOptions=ao;var je=le;var q=require("react/jsx-runtime"),Se="k-svg-icon",no=[],so={size:[l.undefined,l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[E.outline,E.solid,E.duotone]},Oe={viewBox:"0 0 24 24",variant:E.outline},de=e=>{var U,M;let{size:t,themeColor:o,rotate:s,flip:a,viewBox:m=Oe.viewBox,variant:c=Oe.variant,icon:d,...D}=e;if(!d)return(0,q.jsx)(q.Fragment,{});if(d==="none")return(0,q.jsx)("span",{...D,className:r(e.className,Se,$("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let K=typeof d=="object"&&d.name&&d.name,k=typeof d=="object"?c&&((U=d.variants)==null?void 0:U[c])||((M=d.variants)==null?void 0:M.outline)||d.content:void 0;return(0,q.jsx)("span",{...D,className:r(e.className,Se,$("k-icon",{size:t}),{[`k-svg-i-${K}`]:K,[`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:(0,q.jsx)("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof d=="object"?d.viewBox:m,dangerouslySetInnerHTML:k!==void 0?{__html:k}:void 0,children:d?void 0:e.children})})};de.states=no;de.options=so;de.className=Se;de.defaultOptions=Oe;var Re=de;var Be=Pe(require("@progress/kendo-svg-icons"));var et="icon",tt="icons";var at=require("react");var ot=require("react"),rt=(0,ot.createContext)({iconsType:"svg"});var H=require("react/jsx-runtime"),he="k-icon",io=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),lo=[],co={size:[l.undefined,l.xsmall,l.small,l.medium,l.large,l.xlarge,l.xxlarge,l.xxxlarge],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info],variant:[E.outline,E.solid,E.duotone]},Ce={viewBox:"0 0 24 24",type:"svg",variant:E.outline},S=e=>{let{iconsType:t}=(0,at.useContext)(rt),{size:o,themeColor:s,icon:a,type:m=t||Ce.type,rotate:c,flip:d,viewBox:D=Ce.viewBox,variant:K=Ce.variant,...k}=e;if(!a)return(0,H.jsx)(H.Fragment,{});if((t||m)==="svg"){if(a==="none")return(0,H.jsx)(Re,{...k,className:r(e.className,he),icon:a,size:o,variant:K});let M=Be[a]?a:io(`${a}-icon`);return Be[M]?(0,H.jsx)(Re,{...k,className:r(e.className,he),icon:Be[M],size:o,themeColor:s,rotate:c,flip:d,viewBox:D,variant:K}):(0,H.jsx)(H.Fragment,{})}return(0,H.jsx)(je,{...k,className:r(e.className,he),icon:a,size:o,themeColor:s,rotate:c,flip:d})};S.states=lo;S.options=co;S.defaultOptions=Ce;S.className=he;S.moduleName=et;S.folderName=tt;S.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 _e="button",nt=_e;var b=require("react/jsx-runtime"),ce="k-button",mo=["icon-button"],po=[u.hover,u.focus,u.active,u.selected,u.disabled,u.generating],uo={size:[l.undefined,l.xsmall,l.small,l.medium,l.large],rounded:[W.undefined,W.none,W.small,W.medium,W.large,W.full],fillMode:[V.undefined,V.solid,V.flat,V.outline,V.clear,V.link],themeColor:[n.undefined,n.base,n.primary,n.secondary,n.tertiary,n.success,n.warning,n.error,n.info,n.inverse]},Ke={showArrow:!1,arrowIconName:"chevron-down"},i=e=>{let{as:t="button",size:o,rounded:s,fillMode:a,themeColor:m,showArrow:c=Ke.showArrow,arrowIconName:d=Ke.arrowIconName,variant:D,hover:K,focus:k,active:U,selected:M,disabled:me,togglable:ye,ariaDisabled:J,icon:y,iconSize:F,text:pe,iconClassName:kt,className:Mt,...Et}=e,St=y!=null,Ot=e.children!==void 0;return(0,b.jsxs)(t,{className:r(Mt,ce,Ue(ce,D),$(ce,{size:o,rounded:s,fillMode:a,themeColor:m}),T(ce,{hover:K,focus:k,active:U,disabled:me||J,selected:M}),{"k-icon-button":!pe&&!Ot&&St}),"aria-pressed":ye?M?"true":"false":void 0,...Et,"aria-disabled":J?"true":void 0,disabled:me||void 0,children:[typeof y=="string"&&y&&(0,b.jsx)(S,{className:r(kt,"k-button-icon"),icon:y,size:F}),y&&typeof y!="string"&&(0,b.jsx)(b.Fragment,{children:y}),pe?(0,b.jsxs)(b.Fragment,{children:[pe&&(0,b.jsx)("span",{className:"k-button-text",children:pe}),e.children]}):e.children&&(0,b.jsx)("span",{className:"k-button-text",children:e.children}),c&&(0,b.jsx)("span",{className:"k-menu-button-arrow k-button-arrow",children:(0,b.jsx)(S,{icon:d})})]})};i.states=po;i.options=uo;i.variants=mo;i.className=ce;i.defaultOptions=Ke;i.moduleName=_e;i.folderName=nt;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."}]};var it=require("react/jsx-runtime"),st=e=>(0,it.jsx)(i,{icon:"folder",...e,"aria-label":e["aria-label"]||"Folder",children:void 0});var dt=require("react/jsx-runtime"),lt=e=>(0,dt.jsx)(i,{icon:"folder",children:"Button",...e});var mt=require("react/jsx-runtime"),ct=e=>(0,mt.jsx)(i,{children:"Button",...e});var xe=require("react/jsx-runtime"),fo=i.options,ho=i.states,Co={...i.defaultOptions,variant:"text"},xo=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],No=[],ee=e=>{let{variant:t,...o}=e;switch(t){case"icon-only":return(0,xe.jsx)(st,{...o,icon:"star"});case"icon-and-text":return(0,xe.jsx)(lt,{...o,icon:"star",children:"Button"});default:return(0,xe.jsx)(ct,{...o,children:"Button"})}};ee.options=fo;ee.states=ho;ee.variants=xo;ee.defaultOptions=Co;ee.modifiers=No;ee.className=i.className;var O=require("react/jsx-runtime"),bo="k-card-header",z=e=>{let{title:t,subtitle:o,details:s,...a}=e;return(0,O.jsxs)("div",{...a,className:r(e.className,bo),children:[t&&(0,O.jsx)(Y,{children:t}),o&&(0,O.jsx)(fe,{children:o}),(0,O.jsx)(O.Fragment,{children:e.children}),s&&(0,O.jsx)("span",{className:"k-card-header-actions",children:(0,O.jsx)(i,{className:"k-card-details",icon:"more-vertical",fillMode:"flat","aria-label":"Card details"})})]})};var pt=require("react/jsx-runtime"),yo="k-card-footer",He=e=>{let{...t}=e;return(0,pt.jsx)("div",{...t,className:r(e.className,yo),children:e.children})};var R=require("react/jsx-runtime"),To="k-card-body",B=e=>{let{title:t,subtitle:o,details:s,...a}=e;return(0,R.jsxs)("div",{...a,className:r(e.className,To),children:[t&&(0,R.jsx)(Y,{children:t}),o&&(0,R.jsx)(fe,{children:o}),(0,R.jsx)(R.Fragment,{children:e.children}),s&&(0,R.jsx)("span",{className:"k-card-header-actions",children:(0,R.jsx)(i,{className:"k-card-details",icon:"more-vertical",fillMode:"flat","aria-label":"Card details"})})]})};var ft=require("react/jsx-runtime"),ut="k-card-deck",Ao=[],vo={},go={},te=e=>{let{...t}=e;return(0,ft.jsx)("div",{...t,className:r(e.className,ut),children:e.children})};te.states=Ao;te.options=vo;te.className=ut;te.defaultOptions=go;te.moduleName=N;te.folderName=A;var Ct=require("react/jsx-runtime"),ht="k-card-deck-scrollwrap",Lo=[],ko={},Mo={},oe=e=>{let{...t}=e;return(0,Ct.jsx)("div",{...t,className:r(e.className,ht),children:e.children})};oe.states=Lo;oe.options=ko;oe.className=ht;oe.defaultOptions=Mo;oe.moduleName=N;oe.folderName=A;var De="action-buttons",xt=De;var Nt=require("react/jsx-runtime"),Ne="k-actions",Eo=[],So={},Ie={alignment:"start",orientation:"horizontal"},x=e=>{let{alignment:t=Ie.alignment,orientation:o=Ie.orientation,...s}=e;return(0,Nt.jsx)("div",{...s,className:r(Ne,{[`${Ne}-${t}`]:t,[`${Ne}-${o}`]:o},e.className),children:e.children})};x.states=Eo;x.options=So;x.className=Ne;x.defaultOptions=Ie;x.moduleName=De;x.folderName=xt;var v=require("react/jsx-runtime"),bt=e=>(0,v.jsx)(f,{orientation:"vertical",children:(0,v.jsxs)(v.Fragment,{children:[(0,v.jsx)(z,{children:"Card Header"}),(0,v.jsx)(B,{children:(0,v.jsx)("p",{children:"Some quick example text to build on the card title and make up the bulk of the card's content."})}),(0,v.jsxs)(x,{className:"k-card-actions",children:[(0,v.jsx)(i,{fillMode:"flat",themeColor:"primary",children:"Action 1"}),(0,v.jsx)(i,{fillMode:"flat",themeColor:"primary",children:"Action 2"})]})]}),...e});var g=require("react/jsx-runtime"),yt=e=>(0,g.jsx)(f,{orientation:"horizontal",children:(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(B,{title:"Card Title",children:(0,g.jsx)("p",{children:"Some quick example text to build on the card title and make up the bulk of the card's content."})}),(0,g.jsxs)(x,{orientation:"vertical",className:"k-card-actions",children:[(0,g.jsx)(i,{fillMode:"flat",themeColor:"primary",children:"Action 1"}),(0,g.jsx)(i,{fillMode:"flat",themeColor:"primary",children:"Action 2"})]})]}),...e});var Tt=require("react/jsx-runtime");var p=require("react/jsx-runtime"),Oo=f.options,Ro=f.states,At={...f.defaultOptions,variant:"vertical"},Bo=[{name:"vertical",title:"Vertical"},{name:"horizontal",title:"Horizontal"}],_o=[{name:"media",title:"Card with Media"},{name:"header",title:"Card with Header"},{name:"footer",title:"Card with Footer"}],re=e=>{let{variant:t,modifiers:o,...s}={...At,...e},a=!1,m=!1,c=!1;return Object.keys(o||{}).forEach(d=>{switch(d){case"media":{a=!!(o!=null&&o[d]);break}case"header":{m=!!(o!=null&&o[d]);break}case"footer":{c=!!(o!=null&&o[d]);break}}}),t==="horizontal"?(0,p.jsxs)(yt,{style:{maxWidth:"420px"},...s,children:[a&&(0,p.jsx)(Me,{src:"https://demos.telerik.com/kendo-ui/content/web/cards/rome.jpg"}),(0,p.jsxs)("div",{children:[m&&(0,p.jsx)(z,{title:"Header Title",subtitle:"Header Subtitle"}),(0,p.jsx)(B,{title:"Title",subtitle:"Subtitle",children:(0,p.jsx)("p",{children:"Some quick example text to build on the card title and make up the bulk of the card's content."})}),c&&(0,p.jsx)(He,{children:"Card Footer"})]}),(m||c)&&(0,p.jsx)("span",{className:"k-separator k-separator-vertical"}),(0,p.jsxs)(x,{orientation:"vertical",alignment:"stretched",className:"k-card-actions",children:[(0,p.jsx)(i,{fillMode:"flat",themeColor:"primary",children:"Button"}),(0,p.jsx)(i,{fillMode:"flat",themeColor:"primary",children:"Button"})]})]}):(0,p.jsxs)(bt,{style:{maxHeight:"450px",width:"300px"},...s,children:[m&&(0,p.jsx)(z,{title:"Header Title",subtitle:"Header Subtitle"}),a&&(0,p.jsx)(Me,{src:"https://demos.telerik.com/kendo-ui/content/web/cards/rome.jpg"}),(0,p.jsx)(B,{title:"Title",subtitle:"Subtitle",children:(0,p.jsx)("p",{children:"Some quick example text to build on the card title and make up the bulk of the card's content."})}),c&&(0,p.jsx)(He,{children:"Card Footer"}),(0,p.jsxs)(x,{className:"k-card-actions",children:[(0,p.jsx)(i,{fillMode:"flat",themeColor:"primary",children:"Button"}),(0,p.jsx)(i,{fillMode:"flat",themeColor:"primary",children:"Button"})]})]})};re.options=Oo;re.states=Ro;re.variants=Bo;re.defaultOptions=At;re.modifiers=_o;re.className=f.className;var P=require("react/jsx-runtime"),we="k-tilelayout-item",Ko=[u.focus],Ho={},Do={},h=e=>{let{header:t,body:o,focus:s,resize:a,style:m}=e,c=Ae("tilelayout-title");return(0,P.jsxs)(f,{className:r(e.className,we,T(we,{focus:s}),{"k-resize":a===!0,"k-resize-x":a==="horizontal","k-resize-y":a==="vertical"}),style:m,role:"listitem","aria-labelledby":c,tabIndex:0,"aria-keyshortcuts":"Enter",children:[t&&vt.default.isValidElement(t)?(0,P.jsx)(z,{className:"k-tilelayout-item-header k-cursor-move",children:(0,P.jsx)("div",{className:"k-card-title",id:c,children:t})}):(0,P.jsx)(z,{className:"k-tilelayout-item-header k-cursor-move",children:(0,P.jsx)("div",{className:"k-card-title",id:c,children:t})}),o&&(0,P.jsx)(B,{className:"k-tilelayout-item-body",children:o})]})};h.states=Ko;h.options=Ho;h.className=we;h.defaultOptions=Do;h.moduleName=X;h.folderName=Q;var Lt=require("react/jsx-runtime"),gt="k-layout-item-hint",Io=[],wo={},zo={},ae=e=>{let{style:t}=e;return(0,Lt.jsx)("div",{className:gt,style:t})};ae.states=Io;ae.options=wo;ae.className=gt;ae.defaultOptions=zo;ae.moduleName=X;ae.folderName=Q;var L=require("react/jsx-runtime"),Po=C.options,Uo=C.states,Fo={...C.defaultOptions,variant:"normal"},$o=[{name:"normal",title:"Normal"},{name:"resizable",title:"Resizable"}],Wo=[],ne=e=>{let{variant:t,...o}=e;return t==="resizable"?(0,L.jsxs)(be,{columns:2,columnWidth:"1fr",rowHeight:"1fr",gap:"4px",style:{width:"467px",height:"365px"},...o,children:[(0,L.jsx)(h,{resize:"vertical",header:"Title",body:"Vertically resizable card",style:{order:"0",gridColumnEnd:"span 1",gridRowEnd:"span 2"}}),(0,L.jsx)(h,{resize:"horizontal",header:"Title",body:"Horizontally resizable card",style:{order:"1",gridColumnEnd:"span 1",gridRowEnd:"span 1"}}),(0,L.jsx)(h,{resize:!0,header:"Title",body:"Horizontally and Vertically resizable card",style:{order:"2",gridColumnEnd:"span 0",gridRowEnd:"span 0"}})]}):(0,L.jsxs)(be,{columns:3,columnWidth:"1fr",rowHeight:"1fr",gap:"4px",style:{width:"467px",height:"365px"},...o,children:[(0,L.jsx)(h,{header:"Title",body:"Card Content",style:{order:"0",gridColumnEnd:"span 2",gridRowEnd:"span 1",width:"100%",height:"100%"}}),(0,L.jsx)(h,{header:"Title",body:"Card Content",style:{order:"1",gridColumnEnd:"span 1",gridRowEnd:"span 2",width:"100%",height:"100%"}}),(0,L.jsx)(h,{header:"Title",body:"Card Content",style:{order:"3",gridColumnEnd:"span 1",gridRowEnd:"span 1",width:"100%",height:"100%"}}),(0,L.jsx)(h,{header:"Title",body:"Card Content",style:{order:"4",gridColumnEnd:"span 1",gridRowEnd:"span 1",width:"100%",height:"100%"}})]})};ne.options=Po;ne.states=Uo;ne.variants=$o;ne.defaultOptions=Fo;ne.modifiers=Wo;ne.className=C.className;var _=require("react/jsx-runtime"),be=e=>(0,_.jsx)(C,{children:(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(h,{header:"Title goes here",body:"Content goes here"}),(0,_.jsx)(h,{header:"Title goes here",body:"Content goes here"}),(0,_.jsx)(h,{header:"Title goes here",body:"Content goes here"}),(0,_.jsx)(h,{header:"Title goes here",body:"Content goes here"})]}),...e});