@progress/kendo-themes-html/dist/esm/dialog/templates/dialog-non-modal.mjs

A collection of HTML helpers used for developing Kendo UI themes

var a=(...e)=>e.filter(t=>t!==!0&&!!t).map(t=>Array.isArray(t)?a(...t):typeof t=="object"?Object.keys(t).map((n,s)=>t[s]||t[n]&&n||null).filter(n=>n!==null).join(" "):t).filter(t=>!!t).join(" ");var C=(e,t)=>a({[`${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"}),le=(e,t)=>{let{valid:n,invalid:s,hover:d,focus:c,checked:m,active:l,selected:f,disabled:u,indeterminate:g,loading:K,empty:O,readonly:R,highlighted:W,...B}=t;return a({"k-valid":n,"k-invalid":s,"k-hover":d,"k-focus":c,"k-checked":m,"k-active":l,"k-selected":f,"k-disabled":u,"k-indeterminate":g&&!m,"k-loading":K,"k-empty":O,"k-readonly":R,"k-highlighted":W},Object.keys(B).reduce((p,A)=>(A.startsWith("k-")?p[A]=B[A]:p[`k-${A}`]=B[A],p),{}))};function de(e,t){if(!t)return{};let n=Array.isArray(t)?t:[t];return Object.fromEntries(n.map(s=>[`k-${s}`,!0]))}var i={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"},M={undefined:void 0,solid:"solid",flat:"flat",outline:"outline",clear:"clear",link:"link"},x={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"},T={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 V={};function G(e){return V[e]=(V[e]||0)+1,`k-${e}-${V[e]}`}import{Fragment as He,jsx as ce}from"react/jsx-runtime";var Y="k-font-icon",Ke=[],Re={size:[i.undefined,i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info]},ze={},_=e=>{let{size:t,themeColor:n,icon:s,rotate:d,flip:c,...m}=e;return s?ce("span",{...m,className:a(e.className,Y,C(Y,{size:t}),{[`k-i-${s}`]:s,[`k-color-${n}`]:n,[`k-rotate-${d}`]:d,"k-flip-h":c==="h"||c==="both","k-flip-v":c==="v"||c==="both"}),"aria-hidden":"true"}):ce(He,{})};_.states=Ke;_.options=Re;_.className=Y;_.defaultOptions=ze;var me=_;import{Fragment as Ue,jsx as H}from"react/jsx-runtime";var q="k-svg-icon",Pe=[],$e={size:[i.undefined,i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info],variant:[x.outline,x.solid,x.duotone]},J={viewBox:"0 0 24 24",variant:x.outline},I=e=>{let{size:t,themeColor:n,rotate:s,flip:d,viewBox:c=J.viewBox,variant:m=J.variant,icon:l,...f}=e;if(!l)return H(Ue,{});if(l==="none")return H("span",{...f,className:a(e.className,q,C("k-icon",{size:t}),"k-none"),"aria-hidden":"true"});let u=typeof l=="object"&&l.name&&l.name,g=typeof l=="object"?m&&l.variants?.[m]||l.variants?.outline||l.content:void 0;return H("span",{...f,className:a(e.className,q,C("k-icon",{size:t}),{[`k-svg-i-${u}`]:u,[`k-color-${n}`]:n,[`k-rotate-${s}`]:s,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"}),"aria-hidden":"true",children:H("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof l=="object"?l.viewBox:c,dangerouslySetInnerHTML:g!==void 0?{__html:g}:void 0,children:l?void 0:e.children})})};I.states=Pe;I.options=$e;I.className=q;I.defaultOptions=J;var X=I;import*as Q from"@progress/kendo-svg-icons";var ue="icon",pe="icons";import{useContext as We}from"react";import{createContext as Fe}from"react";var fe=Fe({iconsType:"svg"});import{Fragment as ge,jsx as S}from"react/jsx-runtime";var P="k-icon",Ve=e=>e.replace(/([-_][a-z0-9])/gi,t=>t.toUpperCase().replace("-","").replace("_","")),Ge=[],Ye={size:[i.undefined,i.xsmall,i.small,i.medium,i.large,i.xlarge,i.xxlarge,i.xxxlarge],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info],variant:[x.outline,x.solid,x.duotone]},$={viewBox:"0 0 24 24",type:"svg",variant:x.outline},N=e=>{let{iconsType:t}=We(fe),{size:n,themeColor:s,icon:d,type:c=t||$.type,rotate:m,flip:l,viewBox:f=$.viewBox,variant:u=$.variant,...g}=e;if(!d)return S(ge,{});if((t||c)==="svg"){if(d==="none")return S(X,{...g,className:a(e.className,P),icon:d,size:n,variant:u});let O=Q[d]?d:Ve(`${d}-icon`);return Q[O]?S(X,{...g,className:a(e.className,P),icon:Q[O],size:n,themeColor:s,rotate:m,flip:l,viewBox:f,variant:u}):S(ge,{})}return S(me,{...g,className:a(e.className,P),icon:d,size:n,themeColor:s,rotate:m,flip:l})};N.states=Ge;N.options=Ye;N.defaultOptions=$;N.className=P;N.moduleName=ue;N.folderName=pe;N.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 Z="button",xe=Z;import{Fragment as Ne,jsx as w,jsxs as he}from"react/jsx-runtime";var D="k-button",qe=["icon-button"],Je=[T.hover,T.focus,T.active,T.selected,T.disabled,T.generating],Xe={size:[i.undefined,i.xsmall,i.small,i.medium,i.large],rounded:[k.undefined,k.none,k.small,k.medium,k.large,k.full],fillMode:[M.undefined,M.solid,M.flat,M.outline,M.clear,M.link],themeColor:[o.undefined,o.base,o.primary,o.secondary,o.tertiary,o.success,o.warning,o.error,o.info,o.inverse]},j={showArrow:!1,arrowIconName:"chevron-down"},r=e=>{let{as:t="button",size:n,rounded:s,fillMode:d,themeColor:c,showArrow:m=j.showArrow,arrowIconName:l=j.arrowIconName,variant:f,hover:u,focus:g,active:K,selected:O,disabled:R,togglable:W,ariaDisabled:B,icon:p,iconSize:A,text:z,iconClassName:Le,className:_e,...Ie}=e,Se=p!=null,De=e.children!==void 0;return he(t,{className:a(_e,D,de(D,f),C(D,{size:n,rounded:s,fillMode:d,themeColor:c}),le(D,{hover:u,focus:g,active:K,disabled:R||B,selected:O}),{"k-icon-button":!z&&!De&&Se}),"aria-pressed":W?O?"true":"false":void 0,...Ie,"aria-disabled":B?"true":void 0,disabled:R||void 0,children:[typeof p=="string"&&p&&w(N,{className:a(Le,"k-button-icon"),icon:p,size:A}),p&&typeof p!="string"&&w(Ne,{children:p}),z?he(Ne,{children:[z&&w("span",{className:"k-button-text",children:z}),e.children]}):e.children&&w("span",{className:"k-button-text",children:e.children}),m&&w("span",{className:"k-menu-button-arrow k-button-arrow",children:w(N,{icon:l})})]})};r.states=Je;r.options=Xe;r.variants=qe;r.className=D;r.defaultOptions=j;r.moduleName=Z;r.folderName=xe;r.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."}]};import{jsx as Qe}from"react/jsx-runtime";var be=e=>Qe(r,{icon:"folder",...e,"aria-label":e["aria-label"]||"Folder",children:void 0});import{jsx as Ze}from"react/jsx-runtime";var ve=e=>Ze(r,{icon:"folder",children:"Button",...e});import{jsx as je}from"react/jsx-runtime";var ye=e=>je(r,{children:"Button",...e});import{jsx as ee}from"react/jsx-runtime";var et=r.options,tt=r.states,ot={...r.defaultOptions,variant:"text"},nt=[{name:"icon-only",title:"Icon Only"},{name:"icon-and-text",title:"Icon & Text"},{name:"text",title:"Text"}],it=[],L=e=>{let{variant:t,...n}=e;switch(t){case"icon-only":return ee(be,{...n,icon:"star"});case"icon-and-text":return ee(ve,{...n,icon:"star",children:"Button"});default:return ee(ye,{...n,children:"Button"})}};L.options=et;L.states=tt;L.variants=nt;L.defaultOptions=ot;L.modifiers=it;L.className=r.className;var te="action-buttons",Oe=te;import{jsx as st}from"react/jsx-runtime";var U="k-actions",at=[],rt={},oe={alignment:"start",orientation:"horizontal"},h=e=>{let{alignment:t=oe.alignment,orientation:n=oe.orientation,...s}=e;return st("div",{...s,className:a(U,{[`${U}-${t}`]:t,[`${U}-${n}`]:n},e.className),children:e.children})};h.states=at;h.options=rt;h.className=U;h.defaultOptions=oe;h.moduleName=te;h.folderName=Oe;var ne="window",Ae=ne;import{jsx as mt}from"react/jsx-runtime";var Ce="k-window-content",lt=[],dt={},ct={},b=e=>{let{children:t,...n}=e;return mt("div",{...n,className:a(Ce,e.className),children:t})};b.states=lt;b.options=dt;b.className=Ce;b.defaultOptions=ct;b.moduleName=ne;b.folderName=Ae;var ie="dialog",ke=ie;var ae="overlay",Me=ae;import{jsx as gt}from"react/jsx-runtime";var Te="k-overlay",ut=[],pt={},ft={},v=e=>{let{...t}=e;return gt("div",{...t,className:a(e.className,Te),children:e.children})};v.states=ut;v.options=pt;v.className=Te;v.defaultOptions=ft;v.moduleName=ae;v.folderName=Me;import{Fragment as ht,jsx as E,jsxs as re}from"react/jsx-runtime";var Ee="k-dialog",xt=[],Nt={},se={actionButtonsAlign:"stretched",modal:!0},y=e=>{let{title:t,actions:n,actionButtons:s,actionButtonsAlign:d=se.actionButtonsAlign,modal:c=se.modal,...m}=e,l=t!==void 0?G("dialog-titlebar"):void 0,f=G("dialog-content");return re("div",{className:"k-dialog-wrapper",children:[c&&E(v,{}),re("div",{...m,className:a(e.className,Ee,"k-window"),role:"dialog","aria-labelledby":l,"aria-describedby":f,...c&&{"aria-modal":"true"},children:[(t!==void 0||n)&&re("div",{className:"k-window-titlebar k-dialog-titlebar",id:l,children:[t!==void 0&&E("span",{className:"k-window-title k-dialog-title",children:t}),n&&E(ht,{children:E("div",{className:"k-window-titlebar-actions k-dialog-titlebar-actions",children:n.map(u=>E(r,{icon:u,fillMode:"flat",size:"xsmall",className:"k-window-titlebar-action k-dialog-titlebar-action","aria-label":u},u))})})]}),E(b,{className:"k-dialog-content",id:f,children:e.children}),s&&E(h,{alignment:d,className:"k-window-actions k-dialog-actions",children:s})]})]})};y.states=xt;y.options=Nt;y.className=Ee;y.defaultOptions=se;y.moduleName=ie;y.folderName=ke;y.ariaSpec={selector:".k-dialog",rules:[{selector:".k-dialog",attribute:"role=dialog or role=alertdialog",usage:"Announces the dialog or alertdialog role of the component."},{selector:".k-dialog",attribute:"aria-labelledby",usage:"Associate the title of the dialog."},{selector:".k-dialog",attribute:"aria-describedby",usage:"Associate the dialog content to the wrap element."},{selector:".k-overlay + .k-dialog",attribute:"aria-modal=true",usage:"Announces that the dialog is modal. Attribute is added only when the dialog is modal."}]};var Be=y;import{Fragment as we,jsx as F,jsxs as bt}from"react/jsx-runtime";var on=e=>F(Be,{title:"Title",children:F(we,{children:"Dialog content"}),actionButtons:bt(we,{children:[F(r,{children:"Action"}),F(r,{themeColor:"primary",children:"Primary"})]}),actions:["x"],modal:!1,...e});export{on as DialogNonModal};