@progress/kendo-themes-html/dist/esm/notification/index.mjs

A collection of HTML helpers used for developing Kendo UI themes

var c=(...e)=>e.filter(o=>o!==!0&&!!o).map(o=>Array.isArray(o)?c(...o):typeof o=="object"?Object.keys(o).map((a,l)=>o[l]||o[a]&&a||null).filter(a=>a!==null).join(" "):o).filter(o=>!!o).join(" ");var u=(e,o)=>c({[`${e}-xs`]:o.size==="xsmall",[`${e}-sm`]:o.size==="small",[`${e}-md`]:o.size==="medium",[`${e}-lg`]:o.size==="large",[`${e}-xl`]:o.size==="xlarge",[`${e}-xxl`]:o.size==="xxlarge",[`${e}-xxxl`]:o.size==="xxxlarge"},{[`${e}-${o.fillMode}`]:o.fillMode},{[`${e}-${o.themeColor}`]:o.themeColor},{"k-rounded-sm":o.rounded==="small","k-rounded-md":o.rounded==="medium","k-rounded-lg":o.rounded==="large","k-rounded-full":o.rounded==="full","k-rounded-none":o.rounded==="none"});var n={undefined:void 0,xsmall:"xsmall",small:"small",medium:"medium",large:"large",xlarge:"xlarge",xxlarge:"xxlarge",xxxlarge:"xxxlarge"};var f={undefined:void 0,outline:"outline",solid:"solid",duotone:"duotone"},t={undefined:void 0,inherit:"inherit",base:"base",primary:"primary",secondary:"secondary",tertiary:"tertiary",info:"info",success:"success",warning:"warning",error:"error",inverse:"inverse"};var A={};function R(e){return A[e]=(A[e]||0)+1,`k-${e}-${A[e]}`}import{Fragment as Z,jsx as H}from"react/jsx-runtime";var M="k-font-icon",j=[],Q={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[t.undefined,t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info]},Y={},b=e=>{let{size:o,themeColor:a,icon:l,rotate:i,flip:d,...p}=e;return l?H("span",{...p,className:c(e.className,M,u(M,{size:o}),{[`k-i-${l}`]:l,[`k-color-${a}`]:a,[`k-rotate-${i}`]:i,"k-flip-h":d==="h"||d==="both","k-flip-v":d==="v"||d==="both"}),"aria-hidden":"true"}):H(Z,{})};b.states=j;b.options=Q;b.className=M;b.defaultOptions=Y;var B=b;import{Fragment as te,jsx as C}from"react/jsx-runtime";var S="k-svg-icon",ee=[],oe={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[t.undefined,t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info],variant:[f.outline,f.solid,f.duotone]},E={viewBox:"0 0 24 24",variant:f.outline},y=e=>{let{size:o,themeColor:a,rotate:l,flip:i,viewBox:d=E.viewBox,variant:p=E.variant,icon:s,...x}=e;if(!s)return C(te,{});if(s==="none")return C("span",{...x,className:c(e.className,S,u("k-icon",{size:o}),"k-none"),"aria-hidden":"true"});let v=typeof s=="object"&&s.name&&s.name,g=typeof s=="object"?p&&s.variants?.[p]||s.variants?.outline||s.content:void 0;return C("span",{...x,className:c(e.className,S,u("k-icon",{size:o}),{[`k-svg-i-${v}`]:v,[`k-color-${a}`]:a,[`k-rotate-${l}`]:l,"k-flip-h":i==="h"||i==="both","k-flip-v":i==="v"||i==="both"}),"aria-hidden":"true",children:C("svg",{"aria-hidden":!0,focusable:!1,xmlns:"http://www.w3.org/2000/svg",viewBox:typeof s=="object"?s.viewBox:d,dangerouslySetInnerHTML:g!==void 0?{__html:g}:void 0,children:s?void 0:e.children})})};y.states=ee;y.options=oe;y.className=S;y.defaultOptions=E;var w=y;import*as z from"@progress/kendo-svg-icons";var P="icon",K="icons";import{useContext as ie}from"react";import{createContext as ne}from"react";var D=ne({iconsType:"svg"});import{Fragment as V,jsx as k}from"react/jsx-runtime";var I="k-icon",ae=e=>e.replace(/([-_][a-z0-9])/gi,o=>o.toUpperCase().replace("-","").replace("_","")),re=[],se={size:[n.undefined,n.xsmall,n.small,n.medium,n.large,n.xlarge,n.xxlarge,n.xxxlarge],themeColor:[t.undefined,t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info],variant:[f.outline,f.solid,f.duotone]},O={viewBox:"0 0 24 24",type:"svg",variant:f.outline},m=e=>{let{iconsType:o}=ie(D),{size:a,themeColor:l,icon:i,type:d=o||O.type,rotate:p,flip:s,viewBox:x=O.viewBox,variant:v=O.variant,...g}=e;if(!i)return k(V,{});if((o||d)==="svg"){if(i==="none")return k(w,{...g,className:c(e.className,I),icon:i,size:a,variant:v});let F=z[i]?i:ae(`${i}-icon`);return z[F]?k(w,{...g,className:c(e.className,I),icon:z[F],size:a,themeColor:l,rotate:p,flip:s,viewBox:x,variant:v}):k(V,{})}return k(B,{...g,className:c(e.className,I),icon:i,size:a,themeColor:l,rotate:p,flip:s})};m.states=re;m.options=se;m.defaultOptions=O;m.className=I;m.moduleName=P;m.folderName=K;m.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 L="notification",U=L;import{Fragment as de,jsx as T,jsxs as G}from"react/jsx-runtime";var _="k-notification",le=[],ce={themeColor:[t.undefined,t.base,t.primary,t.secondary,t.tertiary,t.success,t.warning,t.error,t.info,t.inverse]},q={closable:!1},r=e=>{let{actions:o,themeColor:a,text:l,icon:i,closable:d=q.closable,...p}=e,s=R("notification-content"),x=!!(l||e.children);return G("div",{...p,className:c(e.className,_,u(_,{themeColor:a}),{"k-notification-closable":d}),role:"status","aria-live":"polite","aria-describedby":x?s:void 0,children:[i&&T(m,{className:"k-notification-status",icon:i}),e.children?G("div",{id:s,className:"k-notification-content",children:[l,e.children]}):T(de,{children:l&&T("div",{id:s,className:"k-notification-content",children:l})}),o&&T("span",{className:"k-notification-actions",children:o})]})};r.states=le;r.options=ce;r.className=_;r.defaultOptions=q;r.moduleName=L;r.folderName=U;r.ariaSpec={selector:".k-notification",rules:[{selector:".k-notification",attribute:"role=status",usage:"Notification element should be marked as a status. Uses status instead of alert to avoid interrupting screen reader workflow."},{selector:".k-notification",attribute:"aria-live=polite",usage:"The aria-live value must be polite so it will not obscure other essential information."},{selector:".k-notification",attribute:"aria-describedby=.k-notification-content id",usage:"Used so that the content of the Notification will be announced by assistive technologies."},{selector:".k-notification .k-svg-i-x, .k-notification .k-i-x",attribute:"aria-hidden=true",usage:"The close button icon should not be present in the accessibility tree."}]};import{jsx as $}from"react/jsx-runtime";var me="k-notification-action",h=e=>{let{type:o}=e,a;if(o==="close")a=$(m,{icon:"x"});else return $(m,{icon:o});return $("span",{className:c(e.className,me,`k-notification-${o}-action`),children:a})};import{jsx as fe}from"react/jsx-runtime";var lo=e=>fe(r,{text:"Notification",icon:"exclamation-circle",...e});import{jsx as J}from"react/jsx-runtime";var po=e=>J(r,{closable:!0,text:"Notification",icon:"exclamation-circle",actions:J(h,{type:"close"}),...e});import{jsx as X}from"react/jsx-runtime";var ho=e=>X(r,{closable:!0,text:"Notification",actions:X(h,{type:"close"}),...e});import{jsx as pe}from"react/jsx-runtime";var yo=e=>pe(r,{text:"Notification",...e});import{jsx as W}from"react/jsx-runtime";var ue=r.states,xe=r.defaultOptions,ge={...r.options,closable:{type:"boolean"}},he=[{name:"icon",title:"Icon before"}],Ne=[],N=e=>{let{modifiers:o,closable:a,...l}=e,i={};return a&&(i.closable=!0,i.actions=W(h,{type:"close"})),Object.keys(o||{}).forEach(d=>{d==="icon"&&(i.icon=o?.[d]?"info-circle":"")}),W(r,{text:"Notification",...l,...i})};N.options=ge;N.states=ue;N.variants=Ne;N.defaultOptions=xe;N.modifiers=he;N.className=r.className;export{lo as IconNotification,po as IconNotificationClosable,_ as NOTIFICATION_CLASSNAME,r as Notification,h as NotificationAction,ho as NotificationClosable,N as NotificationDemo,yo as NotificationNormal};