@mortenbrudvik/waveui 0.7.0 → 0.8.0

package/dist/components/feedback/MessageBar.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/children.cjs"),r=require("../../lib/dev.cjs"),i=require("../../lib/slot.cjs"),a=require("../../hooks/useMergedRefs.cjs"),o=require("../../lib/styles.cjs"),s=require("../button/Button.cjs"),c=require("../../lib/icons.cjs"),l=require("../../lib/mergeProps.cjs"),u=require("../button/Button.slots.cjs"),d=require("../../lib/labelInName.cjs"),f=require("./MessageBar.status.cjs");let p=require("react");p=e.__toESM(p,1);let m=require("react/jsx-runtime");var h={info:`bg-info-tint`,success:`bg-success-tint`,warning:`bg-warning-tint`,error:`bg-error-tint`},g=`Dismiss`,_=new Set([`type`,`disabled`,`autoFocus`,`form`,`formAction`,`formEncType`,`formMethod`,`formNoValidate`,`formTarget`,`name`,`value`,`popoverTarget`,`popoverTargetAction`]),v=new Set([`aria-label`,`aria-labelledby`,`title`]),y=/^on[A-Z]/,b=`inline-flex items-center justify-center`,x=()=>{};function S(){return(0,m.jsx)(c.DismissIcon,{})}function C(e){return e===`button`||e===s.Button}function w(){return{buttonProps:{},content:S(),contentMayName:!1,literalTextLabel:!1,disabledFocusable:!1,warning:null}}function T(e){if(e===null)return null;if(e===void 0||typeof e==`boolean`)return w();let r=e;if(n.isElementOfType(r,`button`,s.Button)){let e={};for(let[t,n]of Object.entries(r.props))t!==`children`&&t!==`dangerouslySetInnerHTML`&&!u.BUTTON_OWN_PROP_KEYS.has(t)&&(e[t]=n);let t=n.isElementOfType(r,s.Button),a=r.props.dangerouslySetInnerHTML,o=a==null?i.materialiseSlotContent(r.props.children):(0,m.jsx)(`span`,{className:b,dangerouslySetInnerHTML:a}),c=r.props.icon,l=t&&i.slotRendersContent(c)?i.renderSlot(c,`span`,b,{"aria-hidden":!0}):null;return{buttonProps:e,content:l||i.slotRendersContent(o)?u.placeButtonIcon(l,o,r.props.iconPosition):S(),contentMayName:!0,literalTextLabel:d.hasTextLabel(o),disabledFocusable:t&&!!r.props.disabledFocusable,warning:`button-element`}}let a=i.resolveSlot(e,`span`);if(!a)return w();let{Component:o,props:c,children:l}=a,f=C(o),h=f||Object.keys(c).some(e=>_.has(e)||y.test(e)),g={},x={},T=null;for(let[e,t]of Object.entries(c))o===s.Button&&u.BUTTON_OWN_PROP_KEYS.has(e)?e===`icon`&&i.slotRendersContent(t)&&(T=i.renderSlot(t,`span`,b,{"aria-hidden":!0})):_.has(e)||y.test(e)||v.has(e)||h&&(e===`className`||e===`style`||e===`ref`)?g[e]=t:x[e]=t;let E=f?`span`:o,D={"aria-hidden":!0,...x,className:t.cn(b,x.className)},O=null;return T||i.slotRendersContent(l)?O=u.placeButtonIcon(T,l,o===s.Button&&c.iconPosition):i.slotWrapsDefaultContent(E,{...x,children:l})&&(O=S()),{buttonProps:g,content:O===null?p.createElement(E,D):p.createElement(E,D,O),contentMayName:!1,literalTextLabel:!1,disabledFocusable:o===s.Button&&!!c.disabledFocusable,warning:h?`button-object`:null}}var E=({status:e=`info`,statusLabel:n,onDismiss:s,icon:c,dismiss:_,children:y,className:b,ref:S,...C})=>{let w=t.cn(`mt-0.5 inline-flex shrink-0`,f.STATUS_ICON_COLOR[e]),E=c===void 0?(0,m.jsx)(`span`,{"aria-hidden":`true`,className:w,children:(0,m.jsx)(f.StatusIcon,{status:e,size:20})}):i.renderSlot(c,`span`,w,{"aria-hidden":!0}),D=s!==void 0||_!==void 0&&typeof _!=`boolean`?T(_):null,O=D?.warning??null;p.useEffect(()=>{O===`button-element`?r.warnOnce(`MessageBar:dismiss-button-element`,"MessageBar: `dismiss` received a button element; its props were merged into the built-in dismiss button (buttons cannot be nested). Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`."):O===`button-object`&&r.warnOnce(`MessageBar:dismiss-button-object`,"MessageBar: the button-object form of `dismiss` is deprecated and will be removed in 1.0; its button props were merged into the built-in dismiss button. Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`.")},[O]);let{ref:k,...A}=D?.buttonProps??{},j=Object.keys(A).some(e=>v.has(e)&&A[e]!=null),M=D!==null&&D.contentMayName&&!j,N=D?.literalTextLabel??!1,[P,F]=p.useState(null),I=p.useCallback(e=>P?d.observeTextLabel(P,e):x,[P]),L=p.useSyncExternalStore(I,()=>P?d.hasRenderedTextLabel(P):N,()=>N),R=M&&L,z=a.useMergedRefs(k,M?F:void 0),B=null;if(D){let e=l.mergeProps({"aria-label":j||R?void 0:g,onClick:()=>s?.(),className:t.cn(`ms-auto inline-flex shrink-0 cursor-pointer items-center justify-center rounded border-none bg-transparent p-1 text-muted-foreground`,`not-disabled:not-aria-disabled:hover:bg-subtle-hover not-disabled:not-aria-disabled:hover:text-foreground`,`not-disabled:not-aria-disabled:active:bg-subtle-pressed`,o.focusRing,`disabled:cursor-not-allowed disabled:opacity-50`,u.mergedAriaDisabledClasses)},A);B=(0,m.jsx)(`button`,{...e,ref:z,type:e.type??`button`,...D.disabledFocusable?u.MERGED_DISABLED_FOCUSABLE_PROPS:void 0,children:D.content})}return(0,m.jsxs)(`div`,{ref:S,role:e===`error`||e===`warning`?`alert`:`status`,...C,className:t.cn(`flex items-start gap-3 rounded border-s-4 px-4 py-3 text-foreground`,h[e],f.STATUS_BORDER[e],b),children:[E,(0,m.jsxs)(`div`,{className:`min-w-0 flex-1 text-body-1`,children:[(0,m.jsx)(f.StatusText,{label:f.getStatusLabel(e,n)}),y]}),B]})};E.displayName=`MessageBar`,exports.MessageBar=E;
+"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/children.cjs"),r=require("../../lib/dev.cjs"),i=require("../../lib/slot.cjs"),a=require("../../lib/classNames.cjs"),o=require("../../hooks/useId.cjs"),s=require("../../hooks/useMergedRefs.cjs"),c=require("../../lib/aria.cjs"),l=require("../../lib/styles.cjs"),u=require("../button/Button.cjs"),d=require("../button/Button.slots.cjs"),f=require("../../lib/icons.cjs"),p=require("../../lib/mergeProps.cjs"),m=require("../../lib/labelInName.cjs"),h=require("./MessageBar.reflow.cjs"),g=require("./MessageBar.status.cjs"),_=require("./MessageBar.parts.cjs");let v=require("react");v=e.__toESM(v,1);let y=require("react/jsx-runtime");var b={info:`bg-info-tint`,success:`bg-success-tint`,warning:`bg-warning-tint`,error:`bg-error-tint`},x=`Dismiss`,S=new Set([`type`,`disabled`,`autoFocus`,`form`,`formAction`,`formEncType`,`formMethod`,`formNoValidate`,`formTarget`,`name`,`value`,`popoverTarget`,`popoverTargetAction`]),C=new Set([`aria-label`,`aria-labelledby`,`title`]),w=/^on[A-Z]/,T=`inline-flex items-center justify-center`,E=new Set([`alert`,`status`,`log`,`marquee`,`timer`]),D=new Set([`none`,`presentation`,`generic`]);function O(e){return e?.trim().split(/\s+/)[0]||void 0}function ee(e){let t=O(e);return t!==void 0&&!E.has(t)&&!D.has(t)}var te=()=>{};function k(e){return(0,y.jsx)(f.DismissIcon,{className:e})}function A(e){return e===`button`||e===u.Button}function j(){return{buttonProps:{},content:k(a.messageBarClassNames.dismissIcon),contentMayName:!1,literalTextLabel:!1,disabledFocusable:!1,warning:null}}function ne(e){if(e===null)return null;if(e===void 0||typeof e==`boolean`)return j();let r=e;if(n.isElementOfType(r,`button`,u.Button)){let e={};for(let[t,n]of Object.entries(r.props))t!==`children`&&t!==`dangerouslySetInnerHTML`&&!d.BUTTON_OWN_PROP_KEYS.has(t)&&(e[t]=n);let o=n.isElementOfType(r,u.Button),s=r.props.dangerouslySetInnerHTML,c=s==null?i.materialiseSlotContent(r.props.children):(0,y.jsx)(`span`,{className:T,dangerouslySetInnerHTML:s}),l=r.props.icon,f=o&&i.slotRendersContent(l)?i.renderSlot(l,`span`,t.cn(a.messageBarClassNames.dismissIcon,T),{"aria-hidden":!0}):null;return{buttonProps:e,content:f||i.slotRendersContent(c)?d.placeButtonIcon(f,c,r.props.iconPosition):k(a.messageBarClassNames.dismissIcon),contentMayName:!0,literalTextLabel:m.hasTextLabel(c),disabledFocusable:o&&!!r.props.disabledFocusable,warning:`button-element`}}let o=i.resolveSlot(e,`span`);if(!o)return j();let{Component:s,props:c,children:l}=o,f=A(s),p=f||Object.keys(c).some(e=>S.has(e)||w.test(e)),h={},g={},_=null;for(let[e,n]of Object.entries(c))s===u.Button&&d.BUTTON_OWN_PROP_KEYS.has(e)?e===`icon`&&i.slotRendersContent(n)&&(_=i.renderSlot(n,`span`,t.cn(a.messageBarClassNames.dismissIcon,T),{"aria-hidden":!0})):S.has(e)||w.test(e)||C.has(e)||p&&(e===`className`||e===`style`||e===`ref`)?h[e]=n:g[e]=n;let b=f?`span`:s,x={"aria-hidden":!0,...g,className:t.cn(_===null&&a.messageBarClassNames.dismissIcon,T,g.className)},E=null;return _||i.slotRendersContent(l)?E=d.placeButtonIcon(_,l,s===u.Button&&c.iconPosition):i.slotWrapsDefaultContent(b,{...g,children:l})&&(E=k()),{buttonProps:h,content:E===null?v.createElement(b,x):v.createElement(b,x,E),contentMayName:!1,literalTextLabel:!1,disabledFocusable:s===u.Button&&!!c.disabledFocusable,warning:p?`button-object`:null}}var M=({status:e=`info`,statusLabel:n,onDismiss:u,icon:f,dismiss:S,layout:w=`auto`,children:T,className:E,ref:D,...k})=>{let A=t.cn(a.messageBarClassNames.icon,`mt-0.5 inline-flex shrink-0`,g.STATUS_ICON_COLOR[e]),j=f===void 0?(0,y.jsx)(`span`,{"aria-hidden":`true`,className:A,children:(0,y.jsx)(g.StatusIcon,{status:e,size:20})}):i.slotRendersContent(f)?i.renderSlot(f,`span`,A,{"aria-hidden":!0}):null,M=u!==void 0||S!==void 0&&typeof S!=`boolean`?ne(S):null,N=M?.warning??null;v.useEffect(()=>{N===`button-element`?r.warnOnce(`MessageBar:dismiss-button-element`,"MessageBar: `dismiss` received a button element; its props were merged into the built-in dismiss button (buttons cannot be nested). Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`."):N===`button-object`&&r.warnOnce(`MessageBar:dismiss-button-object`,"MessageBar: the button-object form of `dismiss` is deprecated and will be removed in 1.0; its button props were merged into the built-in dismiss button. Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`.")},[N]);let{ref:re,...P}=M?.buttonProps??{},F=Object.keys(P).some(e=>C.has(e)&&P[e]!=null),I=M!==null&&M.contentMayName&&!F,L=M?.literalTextLabel??!1,[R,ie]=v.useState(null),ae=v.useCallback(e=>R?m.observeTextLabel(R,e):te,[R]),oe=v.useSyncExternalStore(ae,()=>R?m.hasRenderedTextLabel(R):L,()=>L),se=I&&oe,ce=s.useMergedRefs(re,I?ie:void 0),z=null;if(M){let e=p.mergeProps({"aria-label":F||se?void 0:x,onClick:()=>u?.(),className:t.cn(a.messageBarClassNames.dismissButton,`ms-auto inline-flex shrink-0 cursor-pointer items-center justify-center rounded border-none bg-transparent p-1 text-muted-foreground`,`not-disabled:not-aria-disabled:hover:bg-subtle-hover not-disabled:not-aria-disabled:hover:text-foreground`,`not-disabled:not-aria-disabled:active:bg-subtle-pressed`,l.focusRing,`disabled:cursor-not-allowed disabled:opacity-50`,d.mergedAriaDisabledClasses)},P);z=(0,y.jsx)(`button`,{...e,ref:ce,type:e.type??`button`,...M.disabledFocusable?d.MERGED_DISABLED_FOCUSABLE_PROPS:void 0,children:M.content})}let{title:B,ownTitleId:le,actions:V,body:ue}=_.partitionMessageBarChildren(T),de=o.useId(`wave-message-bar-title`),H=_.useTitlePlacement(le,de),fe=H.titleId,U=e===`error`||e===`warning`?`alert`:`status`,W=`role`in k?k.role:U,G=k[`aria-label`]!==void 0||k[`aria-labelledby`]!==void 0,K=g.getStatusLabel(e,n),q=o.useId(`wave-message-bar-status`),J=B!==void 0&&!G&&ee(W),pe=G?k[`aria-labelledby`]:J?c.joinIds(K?q:void 0,fe):void 0,Y=O(W)===`region`&&B===void 0&&!G;v.useEffect(()=>{Y&&r.warnOnce(`MessageBar:region-name`,`MessageBar: a bar with role="region" is a landmark only when it has a name. Add a MessageBar.Title, or pass aria-label or aria-labelledby.`)},[Y]);let X=V.length>0,Z=w===`auto`&&X,[me,he]=v.useState(null),[ge,_e]=v.useState(null),ve=s.useMergedRefs(D,Z?he:void 0),ye=h.useMessageBarReflow(me,ge,Z),Q=w===`auto`?X?ye:`multiline`:w,be=Z&&Q===`singleline`,$=(0,y.jsxs)(`div`,{ref:Z?_e:void 0,className:t.cn(a.messageBarClassNames.body,`min-w-0 flex-1 text-body-1`,be&&`whitespace-nowrap`),children:[(0,y.jsx)(g.StatusText,{id:J&&K?q:void 0,label:K}),B&&(0,y.jsx)(_.MessageBarPartContext.Provider,{value:H,children:B.element}),B&&` `,ue.map(({key:e,node:t,extraTitle:n})=>n?(0,y.jsx)(_.MessageBarPartContext.Provider,{value:_.EXTRA_TITLE_PLACEMENT,children:t},e):(0,y.jsx)(v.Fragment,{children:t},e))]});return(0,y.jsx)(`div`,{ref:ve,role:U,"data-layout":Q,...k,"aria-labelledby":pe,className:t.cn(a.messageBarClassNames.root,`flex items-start gap-3 rounded border-s-4 px-4 py-3 text-foreground`,b[e],g.STATUS_BORDER[e],E),children:(0,y.jsxs)(_.MessageBarPartContext.Provider,{value:_.CONTENT_PLACEMENT,children:[j,X?(0,y.jsxs)(`div`,{className:t.cn(`flex min-w-0 flex-1 gap-x-3 gap-y-2`,Q===`multiline`?`flex-col`:`items-start`),children:[$,(0,y.jsx)(_.MessageBarPartContext.Provider,{value:_.ACTIONS_PLACEMENT,children:V.map(({key:e,element:t})=>(0,y.jsx)(v.Fragment,{children:t},e))})]}):$,z]})})};M.displayName=`MessageBar`;var N=Object.assign(M,{Title:_.MessageBarTitle,Actions:_.MessageBarActions});exports.MessageBar=N,exports.MessageBarActions=_.MessageBarActions,exports.MessageBarTitle=_.MessageBarTitle;
 //# sourceMappingURL=MessageBar.cjs.map

package/dist/components/feedback/MessageBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBar.cjs","names":["DismissIcon","Button","isElementOfType","BUTTON_OWN_PROP_KEYS","materialiseSlotContent","slotRendersContent","renderSlot","placeButtonIcon","hasTextLabel","resolveSlot","cn","slotWrapsDefaultContent","React","STATUS_ICON_COLOR","StatusIcon","observeTextLabel","hasRenderedTextLabel","useMergedRefs","mergeProps","focusRing","mergedAriaDisabledClasses","MERGED_DISABLED_FOCUSABLE_PROPS","STATUS_BORDER","StatusText","getStatusLabel","require_runtime","require_cn","require_children","require_dev","require_slot","require_useMergedRefs","require_styles","require_Button","require_icons","require_mergeProps","require_Button_slots","require_labelInName","require_MessageBar_status","react","react_jsx_runtime","tintClasses","DEFAULT_DISMISS_LABEL","BUTTON_ONLY_KEYS","NAMING_KEYS","HANDLER_KEY","dismissContentClassName","noop","defaultDismissContent","isButtonType","type","defaultDismiss","resolveDismiss","dismiss","element","buttonProps","key","value","isWaveButton","markup","children","icon","iconNode","resolved","asButton","Component","isButtonObject","props","contentProps","ContentTag","elementProps","inner","MessageBar","rest","iconClassName","status","renderedIcon","dismissParts","onDismiss","dismissWarning","slotRef","slotButtonProps","hasOwnName","checksContent","literalTextLabel","labelTarget","setLabelTarget","subscribeToContent","onChange","contentHasTextLabel","namedByContent","dismissRef","renderedDismiss","className","statusLabel"],"sources":["../../../src/components/feedback/MessageBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { isElementOfType } from '../../lib/children';\nimport { cn } from '../../lib/cn';\nimport { warnOnce } from '../../lib/dev';\nimport { DismissIcon } from '../../lib/icons';\nimport { hasRenderedTextLabel, hasTextLabel, observeTextLabel } from '../../lib/labelInName';\nimport { mergeProps } from '../../lib/mergeProps';\nimport {\n  materialiseSlotContent,\n  renderSlot,\n  resolveSlot,\n  slotRendersContent,\n  slotWrapsDefaultContent,\n} from '../../lib/slot';\nimport { focusRing } from '../../lib/styles';\nimport type { Status, Slot, SlotObject } from '../../lib/types';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { Button } from '../button/Button';\nimport {\n  BUTTON_OWN_PROP_KEYS,\n  MERGED_DISABLED_FOCUSABLE_PROPS,\n  mergedAriaDisabledClasses,\n  placeButtonIcon,\n} from '../button/Button.slots';\nimport {\n  STATUS_BORDER,\n  STATUS_ICON_COLOR,\n  StatusIcon,\n  StatusText,\n  getStatusLabel,\n} from './MessageBar.status';\n\n/** Properties for the MessageBar component. */\nexport interface MessageBarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Status level controlling the color, icon, status text and role of the message bar.\n   * `warning` and `error` render `role=\"alert\"`, `info` and `success` `role=\"status\"` (a consumer\n   * `role` wins).\n   * @default 'info'\n   */\n  status?: Status;\n  /**\n   * Visually hidden text read before the message so screen-reader users hear the severity\n   * (`'Info:'`, `'Success:'`, `'Warning:'`, `'Error:'` by default). Pass a translation for other\n   * languages, or `''` when the message text already states the severity.\n   */\n  statusLabel?: string;\n  /**\n   * Called when the dismiss button is activated. Passing it renders the dismiss button (unless\n   * `dismiss` is `null`).\n   */\n  onDismiss?: () => void;\n  /**\n   * Custom status icon, rendered decoratively (`aria-hidden=\"true\"`, a slot object can override\n   * it) in the status color. `null` renders no icon.\n   */\n  icon?: Slot<'span'>;\n  /**\n   * Content of the dismiss button (replaces the default dismiss icon). It always renders **inside**\n   * the built-in `<button type=\"button\" aria-label=\"Dismiss\">`, which calls `onDismiss`; passing\n   * content shows the dismiss button even without `onDismiss`. `null` is the only value that hides\n   * the button. A boolean counts as no slot, so the conditional idiom\n   * `dismiss={useBrandIcon && <BrandCloseIcon />}` keeps the default button: the default icon with\n   * `onDismiss`, no button without it. Content that renders nothing (`''`, or an array or Fragment\n   * of only `null`, `false`, `true` and `''`, also as the children of a slot object or a merged\n   * button) keeps the default icon, so the button is never empty; a slot object that renders a\n   * component or a void element (`{ as: CloseIcon }`, `{ as: 'img', src, alt: '' }`) or sets\n   * `dangerouslySetInnerHTML` is the icon itself. The content is\n   * decorative (`aria-hidden`), so the button keeps the name \"Dismiss\": when the content is\n   * visible text, pass a slot object whose `aria-label` matches it\n   * (`{ children: 'Close', 'aria-label': 'Close' }`) so the name contains the visible label. An\n   * `aria-label`, `aria-labelledby` or `title` on a slot object names the button instead of\n   * \"Dismiss\".\n   *\n   * A `<button>` element or a Wave `Button` passed here is not nested: its props are merged into\n   * the built-in button (its `onClick` runs first and can call `preventDefault()` to cancel\n   * `onDismiss`; its `aria-label` and an explicit `type` win over the defaults) and its content\n   * (children, or `dangerouslySetInnerHTML` markup) is used as is, with a development warning.\n   * A Wave `Button`'s own props are not attributes: its `icon` becomes decorative content before\n   * its children (after them with `iconPosition=\"after\"`), `disabledFocusable` makes the dismiss\n   * button unavailable but focusable as on the Button (`onDismiss` is not called), and\n   * `appearance` and `size` are ignored.\n   * When the rendered content has a text label (at least two letters or digits:\n   * `<button>Close</button>`, or text rendered by a component such as a translation), that text\n   * names the button, as in 0.4. An icon, a lone character (`X`, `×`,\n   * `+`: a symbol, not a label) and text that is `aria-hidden` or `hidden` keep the name\n   * \"Dismiss\". Text hidden only with CSS still counts as the label: a responsive label such as\n   * `<span className=\"hidden sm:inline\">Close</span>` drops the default name, so the button has\n   * no name wherever that text is not displayed. Give such a button an explicit `aria-label`\n   * (`<button aria-label=\"Close\">…</button>`). An `aria-label`, `aria-labelledby` or `title` on\n   * the element names the button.\n   *\n   * The 0.4 button-object form (`{ as: 'button', onClick, … }`, `{ as: Button, … }` or an object\n   * with button props) is **deprecated**: its button props (`type` included), `className` and\n   * `style` are merged the same way, and a Wave Button's own props apply as for the element form.\n   * Pass icon content instead, e.g. `dismiss={<CloseIcon />}`.\n   */\n  dismiss?: Slot<'span'> | SlotObject<'button'>;\n  /** Message content to display. */\n  children: React.ReactNode;\n  /** Ref to the root `<div>`. */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\nconst tintClasses: Record<Status, string> = {\n  info: 'bg-info-tint',\n  success: 'bg-success-tint',\n  warning: 'bg-warning-tint',\n  error: 'bg-error-tint',\n};\n\ntype UnknownProps = Record<string, unknown>;\n\n/** Name of the dismiss button when nothing else names it. */\nconst DEFAULT_DISMISS_LABEL = 'Dismiss';\n\n/** Attributes that only make sense on the dismiss `<button>` itself. */\nconst BUTTON_ONLY_KEYS: ReadonlySet<string> = new Set([\n  'type',\n  'disabled',\n  'autoFocus',\n  'form',\n  'formAction',\n  'formEncType',\n  'formMethod',\n  'formNoValidate',\n  'formTarget',\n  'name',\n  'value',\n  'popoverTarget',\n  'popoverTargetAction',\n]);\n\n/**\n * Attributes that name the dismiss button. On a slot object they go to the button (its content is\n * decorative); on the merged button, any of them replaces the default `aria-label`.\n */\nconst NAMING_KEYS: ReadonlySet<string> = new Set(['aria-label', 'aria-labelledby', 'title']);\n\nconst HANDLER_KEY = /^on[A-Z]/;\n\nconst dismissContentClassName = 'inline-flex items-center justify-center';\n\ninterface DismissParts {\n  /** Props merged onto the wired dismiss button. */\n  buttonProps: UnknownProps;\n  /** What renders inside the dismiss button. */\n  content: React.ReactNode;\n  /**\n   * `true` when the content is rendered as is (a merged `<button>`/`Button`), so a text label in it\n   * names the button (C-SLOTS naming, WCAG 2.5.3 Label in Name); `false` when the content is\n   * decorative (`aria-hidden`).\n   */\n  contentMayName: boolean;\n  /**\n   * Whether the content's literal children contain a text label. Used for the server render and\n   * the first client render; after mount, the rendered button's text decides (see\n   * {@link hasRenderedTextLabel}).\n   */\n  literalTextLabel: boolean;\n  /**\n   * Whether a merged Wave `Button` set `disabledFocusable`: the dismiss button is then unavailable\n   * but focusable, as the Button would be.\n   */\n  disabledFocusable: boolean;\n  /** Which development warning the slot needs. */\n  warning: 'button-element' | 'button-object' | null;\n}\n\nconst noop = () => {};\n\n/** The decorative default dismiss glyph. */\nfunction defaultDismissContent(): React.ReactNode {\n  return <DismissIcon />;\n}\n\nfunction isButtonType(type: unknown): boolean {\n  return type === 'button' || type === Button;\n}\n\n/** The dismiss button without a slot: the default icon and name. */\nfunction defaultDismiss(): DismissParts {\n  return {\n    buttonProps: {},\n    content: defaultDismissContent(),\n    contentMayName: false,\n    literalTextLabel: false,\n    disabledFocusable: false,\n    warning: null,\n  };\n}\n\n/**\n * Splits the `dismiss` slot into props for the wired dismiss button and the content rendered\n * inside it (C-SLOTS dismiss semantics). `null` means: no dismiss button. A boolean is no slot\n * (the default dismiss button), and content that renders nothing keeps the default icon.\n */\nfunction resolveDismiss(dismiss: MessageBarProps['dismiss']): DismissParts | null {\n  if (dismiss === null) return null;\n  if (dismiss === undefined || typeof dismiss === 'boolean') return defaultDismiss();\n\n  // A merged `<button>`/`Button` keeps its content accessible (as in 0.4): a text label names the\n  // button, anything else (an icon, a lone character such as `X` or `×`) gets the default name.\n  // The type is compared through `isElementOfType`, so a Button written in a Server Component\n  // (a lazy client reference) is merged too.\n  const element = dismiss as React.ReactNode;\n  if (isElementOfType<UnknownProps>(element, 'button', Button)) {\n    const buttonProps: UnknownProps = {};\n    for (const [key, value] of Object.entries(element.props)) {\n      if (\n        key !== 'children' &&\n        key !== 'dangerouslySetInnerHTML' &&\n        !BUTTON_OWN_PROP_KEYS.has(key)\n      ) {\n        buttonProps[key] = value;\n      }\n    }\n    const isWaveButton = isElementOfType(element, Button);\n    // A generator is read once by the check; its items are what renders (and names the button).\n    // Markup of the merged button (`dangerouslySetInnerHTML`) is its content as well, rendered in\n    // a span inside the dismiss button (the button itself also holds the icon).\n    const markup = element.props.dangerouslySetInnerHTML as\n      React.HTMLAttributes<HTMLElement>['dangerouslySetInnerHTML'] | undefined;\n    const children =\n      markup != null ? (\n        <span className={dismissContentClassName} dangerouslySetInnerHTML={markup} />\n      ) : (\n        materialiseSlotContent(element.props.children)\n      );\n    // Wave Button's icon becomes decorative content before its children (after them with\n    // `iconPosition=\"after\"`).\n    const icon = element.props.icon as Slot<'span'>;\n    const iconNode =\n      isWaveButton && slotRendersContent(icon)\n        ? renderSlot(icon, 'span', dismissContentClassName, { 'aria-hidden': true })\n        : null;\n    const content =\n      iconNode || slotRendersContent(children)\n        ? placeButtonIcon(iconNode, children, element.props.iconPosition)\n        : defaultDismissContent();\n    return {\n      buttonProps,\n      content,\n      contentMayName: true,\n      literalTextLabel: hasTextLabel(children),\n      disabledFocusable: isWaveButton && Boolean(element.props.disabledFocusable),\n      warning: 'button-element',\n    };\n  }\n\n  // Everything else is classified by the slot system (F2): shorthand content resolves to the\n  // default `span` with no attributes; a slot object resolves to its element and attributes.\n  const resolved = resolveSlot(dismiss as Slot<'span'>, 'span');\n  if (!resolved) return defaultDismiss();\n  const { Component, props, children } = resolved;\n  const asButton = isButtonType(Component);\n  const isButtonObject =\n    asButton ||\n    Object.keys(props).some((key) => BUTTON_ONLY_KEYS.has(key) || HANDLER_KEY.test(key));\n  const buttonProps: UnknownProps = {};\n  const contentProps: UnknownProps = {};\n  let iconNode: React.ReactNode = null;\n  for (const [key, value] of Object.entries(props)) {\n    if (Component === Button && BUTTON_OWN_PROP_KEYS.has(key)) {\n      // Wave Button's own props are not attributes: `icon`, `iconPosition` and\n      // `disabledFocusable` are applied below, the others (`appearance`, `size`) are dropped.\n      if (key === 'icon' && slotRendersContent(value)) {\n        iconNode = renderSlot(value as Slot<'span'>, 'span', dismissContentClassName, {\n          'aria-hidden': true,\n        });\n      }\n    } else if (\n      BUTTON_ONLY_KEYS.has(key) ||\n      HANDLER_KEY.test(key) ||\n      NAMING_KEYS.has(key) ||\n      // 0.4 rendered the object as the button itself: its className, style and ref stay there.\n      (isButtonObject && (key === 'className' || key === 'style' || key === 'ref'))\n    ) {\n      buttonProps[key] = value;\n    } else {\n      contentProps[key] = value;\n    }\n  }\n\n  // The content element: the object's own element, or a span for the button-object form. An\n  // object whose children render nothing styles the default icon\n  // (e.g. `{ className: 'text-error' }`), unless its element is the icon itself.\n  const ContentTag: React.ElementType = asButton ? 'span' : Component;\n  const elementProps = {\n    'aria-hidden': true,\n    ...contentProps,\n    className: cn(dismissContentClassName, contentProps.className as string | undefined),\n  };\n  let inner: React.ReactNode = null;\n  if (iconNode || slotRendersContent(children)) {\n    inner = placeButtonIcon(iconNode, children, Component === Button && props.iconPosition);\n  } else if (slotWrapsDefaultContent(ContentTag, { ...contentProps, children })) {\n    inner = defaultDismissContent();\n  }\n  return {\n    buttonProps,\n    content:\n      inner === null\n        ? React.createElement(ContentTag, elementProps)\n        : React.createElement(ContentTag, elementProps, inner),\n    contentMayName: false,\n    literalTextLabel: false,\n    disabledFocusable: Component === Button && Boolean(props.disabledFocusable),\n    warning: isButtonObject ? 'button-object' : null,\n  };\n}\n\n/**\n * An inline message that tells the user about the state of a page or task: a status icon, a\n * visually hidden status label (\"Warning:\"), the message and an optional dismiss button.\n *\n * - The status sets the tint, the logical start border, the icon and the role (`alert` for\n *   `warning`/`error`, `status` otherwise). Screen readers hear the severity through `statusLabel`.\n * - The dismiss button is always the MessageBar's own `<button>` wired to `onDismiss`\n *   (`type=\"button\"` unless a merged button slot sets its own `type`); the `dismiss` slot only\n *   replaces its content (see {@link MessageBarProps.dismiss}).\n *\n * @example\n * <MessageBar status=\"warning\" onDismiss={() => setVisible(false)}>\n *   Your subscription expires in 3 days.\n * </MessageBar>\n */\nexport const MessageBar = ({\n  status = 'info',\n  statusLabel,\n  onDismiss,\n  icon,\n  dismiss,\n  children,\n  className,\n  ref,\n  ...rest\n}: MessageBarProps) => {\n  const iconClassName = cn('mt-0.5 inline-flex shrink-0', STATUS_ICON_COLOR[status]);\n  const renderedIcon =\n    icon !== undefined ? (\n      renderSlot(icon, 'span', iconClassName, { 'aria-hidden': true })\n    ) : (\n      <span aria-hidden=\"true\" className={iconClassName}>\n        <StatusIcon status={status} size={20} />\n      </span>\n    );\n\n  // A boolean `dismiss` is no slot (`dismiss={cond && <CloseIcon />}`): only `onDismiss` shows it.\n  const showDismiss =\n    onDismiss !== undefined || (dismiss !== undefined && typeof dismiss !== 'boolean');\n  const dismissParts = showDismiss ? resolveDismiss(dismiss) : null;\n  const dismissWarning = dismissParts?.warning ?? null;\n  React.useEffect(() => {\n    if (dismissWarning === 'button-element') {\n      warnOnce(\n        'MessageBar:dismiss-button-element',\n        'MessageBar: `dismiss` received a button element; its props were merged into the built-in dismiss button (buttons cannot be nested). Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`.',\n      );\n    } else if (dismissWarning === 'button-object') {\n      warnOnce(\n        'MessageBar:dismiss-button-object',\n        'MessageBar: the button-object form of `dismiss` is deprecated and will be removed in 1.0; its button props were merged into the built-in dismiss button. Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`.',\n      );\n    }\n  }, [dismissWarning]);\n\n  // The slot's ref joins ours through a stable merged ref (never a new callback per render).\n  const { ref: slotRef, ...slotButtonProps } = dismissParts?.buttonProps ?? {};\n  const hasOwnName = Object.keys(slotButtonProps).some(\n    (key) => NAMING_KEYS.has(key) && slotButtonProps[key] != null,\n  );\n\n  // C-SLOTS naming (WCAG 2.5.3 Label in Name): a merged button's content names it when it renders\n  // a text label (at least two letters or digits; a lone `X` or `×` is a glyph), and the default\n  // `aria-label` would hide that label. The literal children decide on the server and on the first\n  // render; after mount, the rendered button's text does (text from components, e.g. translations,\n  // and later changes).\n  const checksContent = dismissParts !== null && dismissParts.contentMayName && !hasOwnName;\n  const literalTextLabel = dismissParts?.literalTextLabel ?? false;\n  const [labelTarget, setLabelTarget] = React.useState<HTMLButtonElement | null>(null);\n  const subscribeToContent = React.useCallback(\n    (onChange: () => void) => (labelTarget ? observeTextLabel(labelTarget, onChange) : noop),\n    [labelTarget],\n  );\n  const contentHasTextLabel = React.useSyncExternalStore(\n    subscribeToContent,\n    () => (labelTarget ? hasRenderedTextLabel(labelTarget) : literalTextLabel),\n    () => literalTextLabel,\n  );\n  const namedByContent = checksContent && contentHasTextLabel;\n  const dismissRef = useMergedRefs<HTMLButtonElement>(\n    slotRef as React.Ref<HTMLButtonElement> | undefined,\n    checksContent ? setLabelTarget : undefined,\n  );\n\n  let renderedDismiss: React.ReactNode = null;\n  if (dismissParts) {\n    const buttonProps = mergeProps(\n      {\n        'aria-label': hasOwnName || namedByContent ? undefined : DEFAULT_DISMISS_LABEL,\n        onClick: () => onDismiss?.(),\n        className: cn(\n          'ms-auto inline-flex shrink-0 cursor-pointer items-center justify-center rounded border-none bg-transparent p-1 text-muted-foreground',\n          'not-disabled:not-aria-disabled:hover:bg-subtle-hover not-disabled:not-aria-disabled:hover:text-foreground',\n          'not-disabled:not-aria-disabled:active:bg-subtle-pressed',\n          focusRing,\n          'disabled:cursor-not-allowed disabled:opacity-50',\n          mergedAriaDisabledClasses,\n        ),\n      },\n      slotButtonProps,\n    ) as React.ComponentPropsWithoutRef<'button'>;\n    renderedDismiss = (\n      // `type` is \"button\" unless the slot sets one (`null`, from JavaScript callers, means the\n      // default too, so the button never submits an enclosing form by accident). A merged\n      // `disabledFocusable` Button makes it unavailable but focusable (spread last: it wins).\n      <button\n        {...buttonProps}\n        ref={dismissRef}\n        type={buttonProps.type ?? 'button'}\n        {...(dismissParts.disabledFocusable ? MERGED_DISABLED_FOCUSABLE_PROPS : undefined)}\n      >\n        {dismissParts.content}\n      </button>\n    );\n  }\n\n  return (\n    <div\n      ref={ref}\n      role={status === 'error' || status === 'warning' ? 'alert' : 'status'}\n      {...rest}\n      className={cn(\n        'flex items-start gap-3 rounded border-s-4 px-4 py-3 text-foreground',\n        tintClasses[status],\n        STATUS_BORDER[status],\n        className,\n      )}\n    >\n      {renderedIcon}\n      <div className=\"min-w-0 flex-1 text-body-1\">\n        <StatusText label={getStatusLabel(status, statusLabel)} />\n        {children}\n      </div>\n      {renderedDismiss}\n    </div>\n  );\n};\n\nMessageBar.displayName = 'MessageBar';\n"],"mappings":"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"}
+{"version":3,"file":"MessageBar.cjs","names":["DismissIcon","Button","messageBarClassNames","isElementOfType","BUTTON_OWN_PROP_KEYS","materialiseSlotContent","slotRendersContent","renderSlot","cn","placeButtonIcon","hasTextLabel","resolveSlot","slotWrapsDefaultContent","React","STATUS_ICON_COLOR","StatusIcon","observeTextLabel","hasRenderedTextLabel","useMergedRefs","mergeProps","focusRing","mergedAriaDisabledClasses","MERGED_DISABLED_FOCUSABLE_PROPS","partitionMessageBarChildren","useId","useTitlePlacement","getStatusLabel","joinIds","useMessageBarReflow","StatusText","MessageBarPartContext","EXTRA_TITLE_PLACEMENT","STATUS_BORDER","CONTENT_PLACEMENT","ACTIONS_PLACEMENT","MessageBarTitle","MessageBarActions","require_runtime","require_cn","require_children","require_dev","require_slot","require_classNames","require_useId","require_useMergedRefs","require_aria","require_styles","require_Button","require_Button_slots","require_icons","require_mergeProps","require_labelInName","require_MessageBar_reflow","require_MessageBar_status","require_MessageBar_parts","react","react_jsx_runtime","tintClasses","DEFAULT_DISMISS_LABEL","BUTTON_ONLY_KEYS","NAMING_KEYS","HANDLER_KEY","dismissContentClassName","LIVE_REGION_ROLES","UNNAMED_ROLES","firstRoleToken","role","isNamedByTitle","token","noop","defaultDismissContent","isButtonType","type","defaultDismiss","resolveDismiss","dismiss","element","buttonProps","key","value","isWaveButton","markup","children","icon","iconNode","resolved","asButton","Component","isButtonObject","props","contentProps","ContentTag","elementProps","inner","MessageBarRoot","rest","iconClassName","status","renderedIcon","dismissParts","onDismiss","dismissWarning","slotRef","slotButtonProps","hasOwnName","checksContent","literalTextLabel","labelTarget","setLabelTarget","subscribeToContent","onChange","contentHasTextLabel","namedByContent","dismissRef","renderedDismiss","generatedTitleId","titlePlacement","ownTitleId","titleId","defaultRole","ownName","statusText","statusLabel","statusTextId","namedByTitle","title","labelledBy","missingRegionName","hasActions","actions","measuring","layout","rootElement","setRootElement","textElement","setTextElement","rootRef","ref","measuredLayout","resolvedLayout","unwrapped","text","body","extraTitle","node","className","MessageBar"],"sources":["../../../src/components/feedback/MessageBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { joinIds } from '../../lib/aria';\nimport { isElementOfType } from '../../lib/children';\nimport { messageBarClassNames } from '../../lib/classNames';\nimport { cn } from '../../lib/cn';\nimport { warnOnce } from '../../lib/dev';\nimport { DismissIcon } from '../../lib/icons';\nimport { hasRenderedTextLabel, hasTextLabel, observeTextLabel } from '../../lib/labelInName';\nimport { mergeProps } from '../../lib/mergeProps';\nimport {\n  materialiseSlotContent,\n  renderSlot,\n  resolveSlot,\n  slotRendersContent,\n  slotWrapsDefaultContent,\n} from '../../lib/slot';\nimport { focusRing } from '../../lib/styles';\nimport type { Status, Slot, SlotObject } from '../../lib/types';\nimport { useId } from '../../hooks/useId';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { Button } from '../button/Button';\nimport { useMessageBarReflow } from './MessageBar.reflow';\nimport {\n  BUTTON_OWN_PROP_KEYS,\n  MERGED_DISABLED_FOCUSABLE_PROPS,\n  mergedAriaDisabledClasses,\n  placeButtonIcon,\n} from '../button/Button.slots';\nimport {\n  STATUS_BORDER,\n  STATUS_ICON_COLOR,\n  StatusIcon,\n  StatusText,\n  getStatusLabel,\n} from './MessageBar.status';\nimport {\n  ACTIONS_PLACEMENT,\n  CONTENT_PLACEMENT,\n  EXTRA_TITLE_PLACEMENT,\n  MessageBarActions,\n  MessageBarPartContext,\n  MessageBarTitle,\n  partitionMessageBarChildren,\n  useTitlePlacement,\n} from './MessageBar.parts';\n\n/** Properties for the MessageBar component. */\nexport interface MessageBarProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Status level controlling the color, icon, status text and role of the message bar.\n   * `warning` and `error` render `role=\"alert\"`, `info` and `success` `role=\"status\"` (a consumer\n   * `role` wins).\n   * @default 'info'\n   */\n  status?: Status;\n  /**\n   * Visually hidden text read before the message so screen-reader users hear the severity\n   * (`'Info:'`, `'Success:'`, `'Warning:'`, `'Error:'` by default). Pass a translation for other\n   * languages, or `''` when the message text already states the severity.\n   */\n  statusLabel?: string;\n  /**\n   * Called when the dismiss button is activated. Passing it renders the dismiss button (unless\n   * `dismiss` is `null`).\n   */\n  onDismiss?: () => void;\n  /**\n   * Custom status icon, rendered decoratively (`aria-hidden=\"true\"`, a slot object can override\n   * it) in the status color. Only `undefined` keeps the default status icon; `null`, or anything that\n   * renders nothing (`false`, `''`), shows no icon.\n   */\n  icon?: Slot<'span'>;\n  /**\n   * Content of the dismiss button (replaces the default dismiss icon). It always renders **inside**\n   * the built-in `<button type=\"button\" aria-label=\"Dismiss\">`, which calls `onDismiss`; passing\n   * content shows the dismiss button even without `onDismiss`. `null` is the only value that hides\n   * the button. A boolean counts as no slot, so the conditional idiom\n   * `dismiss={useBrandIcon && <BrandCloseIcon />}` keeps the default button: the default icon with\n   * `onDismiss`, no button without it. Content that renders nothing (`''`, or an array or Fragment\n   * of only `null`, `false`, `true` and `''`, also as the children of a slot object or a merged\n   * button) keeps the default icon, so the button is never empty; a slot object that renders a\n   * component or a void element (`{ as: CloseIcon }`, `{ as: 'img', src, alt: '' }`) or sets\n   * `dangerouslySetInnerHTML` is the icon itself. The content is\n   * decorative (`aria-hidden`), so the button keeps the name \"Dismiss\": when the content is\n   * visible text, pass a slot object whose `aria-label` matches it\n   * (`{ children: 'Close', 'aria-label': 'Close' }`) so the name contains the visible label. An\n   * `aria-label`, `aria-labelledby` or `title` on a slot object names the button instead of\n   * \"Dismiss\".\n   *\n   * A `<button>` element or a Wave `Button` passed here is not nested: its props are merged into\n   * the built-in button (its `onClick` runs first and can call `preventDefault()` to cancel\n   * `onDismiss`; its `aria-label` and an explicit `type` win over the defaults) and its content\n   * (children, or `dangerouslySetInnerHTML` markup) is used as is, with a development warning.\n   * A Wave `Button`'s own props are not attributes: its `icon` becomes decorative content before\n   * its children (after them with `iconPosition=\"after\"`), `disabledFocusable` makes the dismiss\n   * button unavailable but focusable as on the Button (`onDismiss` is not called), and\n   * `appearance` and `size` are ignored.\n   * When the rendered content has a text label (at least two letters or digits:\n   * `<button>Close</button>`, or text rendered by a component such as a translation), that text\n   * names the button, as in 0.4. An icon, a lone character (`X`, `×`,\n   * `+`: a symbol, not a label) and text that is `aria-hidden` or `hidden` keep the name\n   * \"Dismiss\". Text hidden only with CSS still counts as the label: a responsive label such as\n   * `<span className=\"hidden sm:inline\">Close</span>` drops the default name, so the button has\n   * no name wherever that text is not displayed. Give such a button an explicit `aria-label`\n   * (`<button aria-label=\"Close\">…</button>`). An `aria-label`, `aria-labelledby` or `title` on\n   * the element names the button.\n   *\n   * The 0.4 button-object form (`{ as: 'button', onClick, … }`, `{ as: Button, … }` or an object\n   * with button props) is **deprecated**: its button props (`type` included), `className` and\n   * `style` are merged the same way, and a Wave Button's own props apply as for the element form.\n   * Pass icon content instead, e.g. `dismiss={<CloseIcon />}`.\n   */\n  dismiss?: Slot<'span'> | SlotObject<'button'>;\n  /**\n   * How the text and the actions share the bar. `'singleline'`: the actions sit on the text's row\n   * (the text wraps inside its column; it is never cut off). `'multiline'`: the actions get a row of\n   * their own under the text. `'auto'`: the actions stay on the text's row while the text fits on\n   * one line, measured after mount (the server renders one row), and move below it otherwise; a bar\n   * without `MessageBar.Actions` is `'multiline'`, the 0.7 look. The root renders the layout in use\n   * as `data-layout` (`singleline` or `multiline`). Fluent's `layout`.\n   * @default 'auto'\n   */\n  layout?: 'auto' | 'singleline' | 'multiline';\n  /**\n   * The message: body text, with the parts `MessageBar.Title` and `MessageBar.Actions` as direct\n   * children (see the component docs).\n   */\n  children: React.ReactNode;\n  /** Ref to the root `<div>`. */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\nconst tintClasses: Record<Status, string> = {\n  info: 'bg-info-tint',\n  success: 'bg-success-tint',\n  warning: 'bg-warning-tint',\n  error: 'bg-error-tint',\n};\n\ntype UnknownProps = Record<string, unknown>;\n\n/** Name of the dismiss button when nothing else names it. */\nconst DEFAULT_DISMISS_LABEL = 'Dismiss';\n\n/** Attributes that only make sense on the dismiss `<button>` itself. */\nconst BUTTON_ONLY_KEYS: ReadonlySet<string> = new Set([\n  'type',\n  'disabled',\n  'autoFocus',\n  'form',\n  'formAction',\n  'formEncType',\n  'formMethod',\n  'formNoValidate',\n  'formTarget',\n  'name',\n  'value',\n  'popoverTarget',\n  'popoverTargetAction',\n]);\n\n/**\n * Attributes that name the dismiss button. On a slot object they go to the button (its content is\n * decorative); on the merged button, any of them replaces the default `aria-label`.\n */\nconst NAMING_KEYS: ReadonlySet<string> = new Set(['aria-label', 'aria-labelledby', 'title']);\n\nconst HANDLER_KEY = /^on[A-Z]/;\n\nconst dismissContentClassName = 'inline-flex items-center justify-center';\n\n/** Live-region roles: a title is read as the start of their content, never as their name. */\nconst LIVE_REGION_ROLES: ReadonlySet<string> = new Set([\n  'alert',\n  'status',\n  'log',\n  'marquee',\n  'timer',\n]);\n\n/** Roles that take no name. */\nconst UNNAMED_ROLES: ReadonlySet<string> = new Set(['none', 'presentation', 'generic']);\n\n/** The first token of a `role` value (a list of fallback roles is read by its first). */\nfunction firstRoleToken(role: string | undefined): string | undefined {\n  return role?.trim().split(/\\s+/)[0] || undefined;\n}\n\n/** Whether a title names a bar with this role (spec D16: a non-live role, such as region or group). */\nfunction isNamedByTitle(role: string | undefined): boolean {\n  const token = firstRoleToken(role);\n  return token !== undefined && !LIVE_REGION_ROLES.has(token) && !UNNAMED_ROLES.has(token);\n}\n\ninterface DismissParts {\n  /** Props merged onto the wired dismiss button. */\n  buttonProps: UnknownProps;\n  /** What renders inside the dismiss button. */\n  content: React.ReactNode;\n  /**\n   * `true` when the content is rendered as is (a merged `<button>`/`Button`), so a text label in it\n   * names the button (C-SLOTS naming, WCAG 2.5.3 Label in Name); `false` when the content is\n   * decorative (`aria-hidden`).\n   */\n  contentMayName: boolean;\n  /**\n   * Whether the content's literal children contain a text label. Used for the server render and\n   * the first client render; after mount, the rendered button's text decides (see\n   * {@link hasRenderedTextLabel}).\n   */\n  literalTextLabel: boolean;\n  /**\n   * Whether a merged Wave `Button` set `disabledFocusable`: the dismiss button is then unavailable\n   * but focusable, as the Button would be.\n   */\n  disabledFocusable: boolean;\n  /** Which development warning the slot needs. */\n  warning: 'button-element' | 'button-object' | null;\n}\n\nconst noop = () => {};\n\n/**\n * The decorative default dismiss glyph. It carries the dismiss icon part class when it is the\n * dismiss button's own content, not when the element of a slot object wraps it.\n */\nfunction defaultDismissContent(className?: string): React.ReactNode {\n  return <DismissIcon className={className} />;\n}\n\nfunction isButtonType(type: unknown): boolean {\n  return type === 'button' || type === Button;\n}\n\n/** The dismiss button without a slot: the default icon and name. */\nfunction defaultDismiss(): DismissParts {\n  return {\n    buttonProps: {},\n    content: defaultDismissContent(messageBarClassNames.dismissIcon),\n    contentMayName: false,\n    literalTextLabel: false,\n    disabledFocusable: false,\n    warning: null,\n  };\n}\n\n/**\n * Splits the `dismiss` slot into props for the wired dismiss button and the content rendered\n * inside it (C-SLOTS dismiss semantics). `null` means: no dismiss button. A boolean is no slot\n * (the default dismiss button), and content that renders nothing keeps the default icon.\n */\nfunction resolveDismiss(dismiss: MessageBarProps['dismiss']): DismissParts | null {\n  if (dismiss === null) return null;\n  if (dismiss === undefined || typeof dismiss === 'boolean') return defaultDismiss();\n\n  // A merged `<button>`/`Button` keeps its content accessible (as in 0.4): a text label names the\n  // button, anything else (an icon, a lone character such as `X` or `×`) gets the default name.\n  // The type is compared through `isElementOfType`, so a Button written in a Server Component\n  // (a lazy client reference) is merged too.\n  const element = dismiss as React.ReactNode;\n  if (isElementOfType<UnknownProps>(element, 'button', Button)) {\n    const buttonProps: UnknownProps = {};\n    for (const [key, value] of Object.entries(element.props)) {\n      if (\n        key !== 'children' &&\n        key !== 'dangerouslySetInnerHTML' &&\n        !BUTTON_OWN_PROP_KEYS.has(key)\n      ) {\n        buttonProps[key] = value;\n      }\n    }\n    const isWaveButton = isElementOfType(element, Button);\n    // A generator is read once by the check; its items are what renders (and names the button).\n    // Markup of the merged button (`dangerouslySetInnerHTML`) is its content as well, rendered in\n    // a span inside the dismiss button (the button itself also holds the icon).\n    const markup = element.props.dangerouslySetInnerHTML as\n      React.HTMLAttributes<HTMLElement>['dangerouslySetInnerHTML'] | undefined;\n    const children =\n      markup != null ? (\n        <span className={dismissContentClassName} dangerouslySetInnerHTML={markup} />\n      ) : (\n        materialiseSlotContent(element.props.children)\n      );\n    // Wave Button's icon becomes decorative content before its children (after them with\n    // `iconPosition=\"after\"`).\n    const icon = element.props.icon as Slot<'span'>;\n    const iconNode =\n      isWaveButton && slotRendersContent(icon)\n        ? renderSlot(icon, 'span', cn(messageBarClassNames.dismissIcon, dismissContentClassName), {\n            'aria-hidden': true,\n          })\n        : null;\n    const content =\n      iconNode || slotRendersContent(children)\n        ? placeButtonIcon(iconNode, children, element.props.iconPosition)\n        : defaultDismissContent(messageBarClassNames.dismissIcon);\n    return {\n      buttonProps,\n      content,\n      contentMayName: true,\n      literalTextLabel: hasTextLabel(children),\n      disabledFocusable: isWaveButton && Boolean(element.props.disabledFocusable),\n      warning: 'button-element',\n    };\n  }\n\n  // Everything else is classified by the slot system (F2): shorthand content resolves to the\n  // default `span` with no attributes; a slot object resolves to its element and attributes.\n  const resolved = resolveSlot(dismiss as Slot<'span'>, 'span');\n  if (!resolved) return defaultDismiss();\n  const { Component, props, children } = resolved;\n  const asButton = isButtonType(Component);\n  const isButtonObject =\n    asButton ||\n    Object.keys(props).some((key) => BUTTON_ONLY_KEYS.has(key) || HANDLER_KEY.test(key));\n  const buttonProps: UnknownProps = {};\n  const contentProps: UnknownProps = {};\n  let iconNode: React.ReactNode = null;\n  for (const [key, value] of Object.entries(props)) {\n    if (Component === Button && BUTTON_OWN_PROP_KEYS.has(key)) {\n      // Wave Button's own props are not attributes: `icon`, `iconPosition` and\n      // `disabledFocusable` are applied below, the others (`appearance`, `size`) are dropped.\n      if (key === 'icon' && slotRendersContent(value)) {\n        iconNode = renderSlot(\n          value as Slot<'span'>,\n          'span',\n          cn(messageBarClassNames.dismissIcon, dismissContentClassName),\n          { 'aria-hidden': true },\n        );\n      }\n    } else if (\n      BUTTON_ONLY_KEYS.has(key) ||\n      HANDLER_KEY.test(key) ||\n      NAMING_KEYS.has(key) ||\n      // 0.4 rendered the object as the button itself: its className, style and ref stay there.\n      (isButtonObject && (key === 'className' || key === 'style' || key === 'ref'))\n    ) {\n      buttonProps[key] = value;\n    } else {\n      contentProps[key] = value;\n    }\n  }\n\n  // The content element: the object's own element, or a span for the button-object form. An\n  // object whose children render nothing styles the default icon\n  // (e.g. `{ className: 'text-error' }`), unless its element is the icon itself.\n  const ContentTag: React.ElementType = asButton ? 'span' : Component;\n  const elementProps = {\n    'aria-hidden': true,\n    ...contentProps,\n    className: cn(\n      iconNode === null && messageBarClassNames.dismissIcon,\n      dismissContentClassName,\n      contentProps.className as string | undefined,\n    ),\n  };\n  let inner: React.ReactNode = null;\n  if (iconNode || slotRendersContent(children)) {\n    inner = placeButtonIcon(iconNode, children, Component === Button && props.iconPosition);\n  } else if (slotWrapsDefaultContent(ContentTag, { ...contentProps, children })) {\n    inner = defaultDismissContent();\n  }\n  return {\n    buttonProps,\n    content:\n      inner === null\n        ? React.createElement(ContentTag, elementProps)\n        : React.createElement(ContentTag, elementProps, inner),\n    contentMayName: false,\n    literalTextLabel: false,\n    disabledFocusable: Component === Button && Boolean(props.disabledFocusable),\n    warning: isButtonObject ? 'button-object' : null,\n  };\n}\n\n// The MessageBar root, documented on the exported `MessageBar` const.\nconst MessageBarRoot = ({\n  status = 'info',\n  statusLabel,\n  onDismiss,\n  icon,\n  dismiss,\n  layout = 'auto',\n  children,\n  className,\n  ref,\n  ...rest\n}: MessageBarProps) => {\n  const iconClassName = cn(\n    messageBarClassNames.icon,\n    'mt-0.5 inline-flex shrink-0',\n    STATUS_ICON_COLOR[status],\n  );\n  const renderedIcon =\n    icon !== undefined ? (\n      slotRendersContent(icon) ? (\n        renderSlot(icon, 'span', iconClassName, { 'aria-hidden': true })\n      ) : null\n    ) : (\n      <span aria-hidden=\"true\" className={iconClassName}>\n        <StatusIcon status={status} size={20} />\n      </span>\n    );\n\n  // A boolean `dismiss` is no slot (`dismiss={cond && <CloseIcon />}`): only `onDismiss` shows it.\n  const showDismiss =\n    onDismiss !== undefined || (dismiss !== undefined && typeof dismiss !== 'boolean');\n  const dismissParts = showDismiss ? resolveDismiss(dismiss) : null;\n  const dismissWarning = dismissParts?.warning ?? null;\n  React.useEffect(() => {\n    if (dismissWarning === 'button-element') {\n      warnOnce(\n        'MessageBar:dismiss-button-element',\n        'MessageBar: `dismiss` received a button element; its props were merged into the built-in dismiss button (buttons cannot be nested). Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`.',\n      );\n    } else if (dismissWarning === 'button-object') {\n      warnOnce(\n        'MessageBar:dismiss-button-object',\n        'MessageBar: the button-object form of `dismiss` is deprecated and will be removed in 1.0; its button props were merged into the built-in dismiss button. Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`.',\n      );\n    }\n  }, [dismissWarning]);\n\n  // The slot's ref joins ours through a stable merged ref (never a new callback per render).\n  const { ref: slotRef, ...slotButtonProps } = dismissParts?.buttonProps ?? {};\n  const hasOwnName = Object.keys(slotButtonProps).some(\n    (key) => NAMING_KEYS.has(key) && slotButtonProps[key] != null,\n  );\n\n  // C-SLOTS naming (WCAG 2.5.3 Label in Name): a merged button's content names it when it renders\n  // a text label (at least two letters or digits; a lone `X` or `×` is a glyph), and the default\n  // `aria-label` would hide that label. The literal children decide on the server and on the first\n  // render; after mount, the rendered button's text does (text from components, e.g. translations,\n  // and later changes).\n  const checksContent = dismissParts !== null && dismissParts.contentMayName && !hasOwnName;\n  const literalTextLabel = dismissParts?.literalTextLabel ?? false;\n  const [labelTarget, setLabelTarget] = React.useState<HTMLButtonElement | null>(null);\n  const subscribeToContent = React.useCallback(\n    (onChange: () => void) => (labelTarget ? observeTextLabel(labelTarget, onChange) : noop),\n    [labelTarget],\n  );\n  const contentHasTextLabel = React.useSyncExternalStore(\n    subscribeToContent,\n    () => (labelTarget ? hasRenderedTextLabel(labelTarget) : literalTextLabel),\n    () => literalTextLabel,\n  );\n  const namedByContent = checksContent && contentHasTextLabel;\n  const dismissRef = useMergedRefs<HTMLButtonElement>(\n    slotRef as React.Ref<HTMLButtonElement> | undefined,\n    checksContent ? setLabelTarget : undefined,\n  );\n\n  let renderedDismiss: React.ReactNode = null;\n  if (dismissParts) {\n    const buttonProps = mergeProps(\n      {\n        'aria-label': hasOwnName || namedByContent ? undefined : DEFAULT_DISMISS_LABEL,\n        onClick: () => onDismiss?.(),\n        className: cn(\n          messageBarClassNames.dismissButton,\n          'ms-auto inline-flex shrink-0 cursor-pointer items-center justify-center rounded border-none bg-transparent p-1 text-muted-foreground',\n          'not-disabled:not-aria-disabled:hover:bg-subtle-hover not-disabled:not-aria-disabled:hover:text-foreground',\n          'not-disabled:not-aria-disabled:active:bg-subtle-pressed',\n          focusRing,\n          'disabled:cursor-not-allowed disabled:opacity-50',\n          mergedAriaDisabledClasses,\n        ),\n      },\n      slotButtonProps,\n    ) as React.ComponentPropsWithoutRef<'button'>;\n    renderedDismiss = (\n      // `type` is \"button\" unless the slot sets one (`null`, from JavaScript callers, means the\n      // default too, so the button never submits an enclosing form by accident). A merged\n      // `disabledFocusable` Button makes it unavailable but focusable (spread last: it wins).\n      <button\n        {...buttonProps}\n        ref={dismissRef}\n        type={buttonProps.type ?? 'button'}\n        {...(dismissParts.disabledFocusable ? MERGED_DISABLED_FOCUSABLE_PROPS : undefined)}\n      >\n        {dismissParts.content}\n      </button>\n    );\n  }\n\n  // Parts (D15): a static scan of the direct children (Fragments flattened, Server Component\n  // references included), so the title and the actions are placed in the server HTML too.\n  const { title, ownTitleId, actions, body } = partitionMessageBarChildren(children);\n  const generatedTitleId = useId('wave-message-bar-title');\n  const titlePlacement = useTitlePlacement(ownTitleId, generatedTitleId);\n  const titleId = titlePlacement.titleId;\n\n  // Labelling (D16). The role the bar renders: the consumer's when the prop is given (it is spread\n  // after the default, as in 0.7), else the status role. A live bar is read once, title included,\n  // and gets no name; a bar with a non-live role is named by the severity text and the title.\n  const defaultRole = status === 'error' || status === 'warning' ? 'alert' : 'status';\n  const role = 'role' in rest ? rest.role : defaultRole;\n  // A prop that holds `undefined` (a wrapper forwarding it) is no name of the consumer's.\n  const ownName = rest['aria-label'] !== undefined || rest['aria-labelledby'] !== undefined;\n  const statusText = getStatusLabel(status, statusLabel);\n  const statusTextId = useId('wave-message-bar-status');\n  const namedByTitle = title !== undefined && !ownName && isNamedByTitle(role);\n  // Written after the spread, so a forwarded `aria-labelledby={undefined}` cannot remove it.\n  const labelledBy = ownName\n    ? rest['aria-labelledby']\n    : namedByTitle\n      ? joinIds(statusText ? statusTextId : undefined, titleId)\n      : undefined;\n  const missingRegionName = firstRoleToken(role) === 'region' && title === undefined && !ownName;\n  React.useEffect(() => {\n    if (missingRegionName) {\n      warnOnce(\n        'MessageBar:region-name',\n        'MessageBar: a bar with role=\"region\" is a landmark only when it has a name. Add a MessageBar.Title, or pass aria-label or aria-labelledby.',\n      );\n    }\n  }, [missingRegionName]);\n\n  // Layout (D17): one DOM order in every layout (icon, text, actions, Dismiss), so a layout change\n  // never moves a focused element; only classes change. Without actions the bar keeps 0.7's markup.\n  const hasActions = actions.length > 0;\n  // `'auto'` with actions measures its text (MessageBar.reflow.ts); the elements it reads are held\n  // in state through callback refs, attached only while it measures (no extra render otherwise).\n  const measuring = layout === 'auto' && hasActions;\n  const [rootElement, setRootElement] = React.useState<HTMLDivElement | null>(null);\n  const [textElement, setTextElement] = React.useState<HTMLDivElement | null>(null);\n  const rootRef = useMergedRefs<HTMLDivElement>(ref, measuring ? setRootElement : undefined);\n  const measuredLayout = useMessageBarReflow(rootElement, textElement, measuring);\n  const resolvedLayout: 'singleline' | 'multiline' =\n    layout === 'auto' ? (hasActions ? measuredLayout : 'multiline') : layout;\n  // While it measures one row, the text column does not wrap, so text that does not fit overflows\n  // the column (never cut off) and the measurement sees it.\n  const unwrapped = measuring && resolvedLayout === 'singleline';\n\n  // The text column: the severity text, the title (and a space, so the two never run together),\n  // then the body in its order.\n  const text = (\n    <div\n      ref={measuring ? setTextElement : undefined}\n      className={cn(\n        messageBarClassNames.body,\n        'min-w-0 flex-1 text-body-1',\n        unwrapped && 'whitespace-nowrap',\n      )}\n    >\n      <StatusText id={namedByTitle && statusText ? statusTextId : undefined} label={statusText} />\n      {title && (\n        <MessageBarPartContext.Provider value={titlePlacement}>\n          {title.element}\n        </MessageBarPartContext.Provider>\n      )}\n      {title && ' '}\n      {body.map(({ key, node, extraTitle }) =>\n        extraTitle ? (\n          <MessageBarPartContext.Provider key={key} value={EXTRA_TITLE_PLACEMENT}>\n            {node}\n          </MessageBarPartContext.Provider>\n        ) : (\n          <React.Fragment key={key}>{node}</React.Fragment>\n        ),\n      )}\n    </div>\n  );\n\n  return (\n    <div\n      ref={rootRef}\n      role={defaultRole}\n      data-layout={resolvedLayout}\n      {...rest}\n      aria-labelledby={labelledBy}\n      className={cn(\n        messageBarClassNames.root,\n        'flex items-start gap-3 rounded border-s-4 px-4 py-3 text-foreground',\n        tintClasses[status],\n        STATUS_BORDER[status],\n        className,\n      )}\n    >\n      <MessageBarPartContext.Provider value={CONTENT_PLACEMENT}>\n        {renderedIcon}\n        {hasActions ? (\n          // A layout wrapper (not a part): the text column and the actions, in this DOM order.\n          <div\n            className={cn(\n              'flex min-w-0 flex-1 gap-x-3 gap-y-2',\n              resolvedLayout === 'multiline' ? 'flex-col' : 'items-start',\n            )}\n          >\n            {text}\n            <MessageBarPartContext.Provider value={ACTIONS_PLACEMENT}>\n              {actions.map(({ key, element }) => (\n                <React.Fragment key={key}>{element}</React.Fragment>\n              ))}\n            </MessageBarPartContext.Provider>\n          </div>\n        ) : (\n          text\n        )}\n        {renderedDismiss}\n      </MessageBarPartContext.Provider>\n    </div>\n  );\n};\nMessageBarRoot.displayName = 'MessageBar';\n\n/**\n * An inline message that tells the user about the state of a page or task: a status icon, a\n * visually hidden status label (\"Warning:\"), an optional title, the message, optional actions and\n * an optional dismiss button.\n *\n * - The status sets the tint, the logical start border, the icon and the role (`alert` for\n *   `warning`/`error`, `status` otherwise). Screen readers hear the severity through `statusLabel`.\n * - Parts, as direct children: `MessageBar.Title` (a semibold lead-in, read first after the\n *   severity) and `MessageBar.Actions` (buttons after the text on one row, or below it with\n *   `layout=\"multiline\"`). The built-in Dismiss button stays the bar's own.\n * - With its default roles the bar is a live region and the title is read as the start of its\n *   content; give the bar `role=\"region\"` (a notice that stays on the page) and the title names it.\n * - The dismiss button is always the MessageBar's own `<button>` wired to `onDismiss`\n *   (`type=\"button\"` unless a merged button slot sets its own `type`); the `dismiss` slot only\n *   replaces its content (see {@link MessageBarProps.dismiss}).\n *\n * React Server Components cannot dot into a client module: import the flat names\n * `MessageBarTitle` and `MessageBarActions` there; `MessageBar.Title` and `MessageBar.Actions`\n * work in client files.\n *\n * @example\n * <MessageBar status=\"warning\" onDismiss={() => setVisible(false)}>\n *   <MessageBar.Title>Update available</MessageBar.Title>\n *   A new version is ready to install.\n *   <MessageBar.Actions>\n *     <Button size=\"small\">Update now</Button>\n *   </MessageBar.Actions>\n * </MessageBar>\n */\nexport const MessageBar = /* @__PURE__ */ Object.assign(MessageBarRoot, {\n  Title: MessageBarTitle,\n  Actions: MessageBarActions,\n});\n\nexport { MessageBarTitle, MessageBarActions };\nexport type { MessageBarTitleProps, MessageBarActionsProps } from './MessageBar.parts';\n"],"mappings":"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"}

package/dist/components/feedback/MessageBar.mjs

@@ -3,23 +3,28 @@ import { cn as e } from "../../lib/cn.mjs";
 import { isElementOfType as t } from "../../lib/children.mjs";
 import { warnOnce as n } from "../../lib/dev.mjs";
 import { materialiseSlotContent as r, renderSlot as i, resolveSlot as a, slotRendersContent as o, slotWrapsDefaultContent as s } from "../../lib/slot.mjs";
-import { useMergedRefs as c } from "../../hooks/useMergedRefs.mjs";
-import { focusRing as l } from "../../lib/styles.mjs";
-import { Button as u } from "../button/Button.mjs";
-import { DismissIcon as d } from "../../lib/icons.mjs";
-import { mergeProps as f } from "../../lib/mergeProps.mjs";
-import { BUTTON_OWN_PROP_KEYS as p, MERGED_DISABLED_FOCUSABLE_PROPS as m, mergedAriaDisabledClasses as h, placeButtonIcon as g } from "../button/Button.slots.mjs";
-import { hasRenderedTextLabel as _, hasTextLabel as v, observeTextLabel as y } from "../../lib/labelInName.mjs";
-import { STATUS_BORDER as b, STATUS_ICON_COLOR as x, StatusIcon as S, StatusText as C, getStatusLabel as w } from "./MessageBar.status.mjs";
-import * as T from "react";
-import { jsx as E, jsxs as D } from "react/jsx-runtime";
+import { messageBarClassNames as c } from "../../lib/classNames.mjs";
+import { useId as l } from "../../hooks/useId.mjs";
+import { useMergedRefs as u } from "../../hooks/useMergedRefs.mjs";
+import { joinIds as d } from "../../lib/aria.mjs";
+import { focusRing as f } from "../../lib/styles.mjs";
+import { Button as p } from "../button/Button.mjs";
+import { BUTTON_OWN_PROP_KEYS as m, MERGED_DISABLED_FOCUSABLE_PROPS as h, mergedAriaDisabledClasses as g, placeButtonIcon as _ } from "../button/Button.slots.mjs";
+import { DismissIcon as v } from "../../lib/icons.mjs";
+import { mergeProps as y } from "../../lib/mergeProps.mjs";
+import { hasRenderedTextLabel as b, hasTextLabel as ee, observeTextLabel as x } from "../../lib/labelInName.mjs";
+import { useMessageBarReflow as S } from "./MessageBar.reflow.mjs";
+import { STATUS_BORDER as C, STATUS_ICON_COLOR as w, StatusIcon as te, StatusText as ne, getStatusLabel as re } from "./MessageBar.status.mjs";
+import { ACTIONS_PLACEMENT as ie, CONTENT_PLACEMENT as ae, EXTRA_TITLE_PLACEMENT as oe, MessageBarActions as T, MessageBarPartContext as E, MessageBarTitle as D, partitionMessageBarChildren as se, useTitlePlacement as ce } from "./MessageBar.parts.mjs";
+import * as O from "react";
+import { jsx as k, jsxs as A } from "react/jsx-runtime";
 //#region src/components/feedback/MessageBar.tsx
-var O = {
+var le = {
 	info: "bg-info-tint",
 	success: "bg-success-tint",
 	warning: "bg-warning-tint",
 	error: "bg-error-tint"
-}, k = "Dismiss", A = /* @__PURE__ */ new Set([
+}, ue = "Dismiss", j = /* @__PURE__ */ new Set([
 	"type",
 	"disabled",
 	"autoFocus",
@@ -33,112 +38,165 @@ var O = {
 	"value",
 	"popoverTarget",
 	"popoverTargetAction"
-]), j = /* @__PURE__ */ new Set([
+]), de = /* @__PURE__ */ new Set([
 	"aria-label",
 	"aria-labelledby",
 	"title"
-]), M = /^on[A-Z]/, N = "inline-flex items-center justify-center", P = () => {};
-function F() {
-	return /* @__PURE__ */ E(d, {});
-}
+]), M = /^on[A-Z]/, N = "inline-flex items-center justify-center", P = /* @__PURE__ */ new Set([
+	"alert",
+	"status",
+	"log",
+	"marquee",
+	"timer"
+]), F = /* @__PURE__ */ new Set([
+	"none",
+	"presentation",
+	"generic"
+]);
 function I(e) {
-	return e === "button" || e === u;
+	return e?.trim().split(/\s+/)[0] || void 0;
+}
+function fe(e) {
+	let t = I(e);
+	return t !== void 0 && !P.has(t) && !F.has(t);
+}
+var pe = () => {};
+function L(e) {
+	return /* @__PURE__ */ k(v, { className: e });
+}
+function R(e) {
+	return e === "button" || e === p;
 }
-function L() {
+function z() {
 	return {
 		buttonProps: {},
-		content: F(),
+		content: L(c.dismissIcon),
 		contentMayName: !1,
 		literalTextLabel: !1,
 		disabledFocusable: !1,
 		warning: null
 	};
 }
-function R(n) {
+function me(n) {
 	if (n === null) return null;
-	if (n === void 0 || typeof n == "boolean") return L();
-	let c = n;
-	if (t(c, "button", u)) {
-		let e = {};
-		for (let [t, n] of Object.entries(c.props)) t !== "children" && t !== "dangerouslySetInnerHTML" && !p.has(t) && (e[t] = n);
-		let n = t(c, u), a = c.props.dangerouslySetInnerHTML, s = a == null ? r(c.props.children) : /* @__PURE__ */ E("span", {
+	if (n === void 0 || typeof n == "boolean") return z();
+	let l = n;
+	if (t(l, "button", p)) {
+		let n = {};
+		for (let [e, t] of Object.entries(l.props)) e !== "children" && e !== "dangerouslySetInnerHTML" && !m.has(e) && (n[e] = t);
+		let a = t(l, p), s = l.props.dangerouslySetInnerHTML, u = s == null ? r(l.props.children) : /* @__PURE__ */ k("span", {
 			className: N,
-			dangerouslySetInnerHTML: a
-		}), l = c.props.icon, d = n && o(l) ? i(l, "span", N, { "aria-hidden": !0 }) : null;
+			dangerouslySetInnerHTML: s
+		}), d = l.props.icon, f = a && o(d) ? i(d, "span", e(c.dismissIcon, N), { "aria-hidden": !0 }) : null;
 		return {
-			buttonProps: e,
-			content: d || o(s) ? g(d, s, c.props.iconPosition) : F(),
+			buttonProps: n,
+			content: f || o(u) ? _(f, u, l.props.iconPosition) : L(c.dismissIcon),
 			contentMayName: !0,
-			literalTextLabel: v(s),
-			disabledFocusable: n && !!c.props.disabledFocusable,
+			literalTextLabel: ee(u),
+			disabledFocusable: a && !!l.props.disabledFocusable,
 			warning: "button-element"
 		};
 	}
-	let l = a(n, "span");
-	if (!l) return L();
-	let { Component: d, props: f, children: m } = l, h = I(d), _ = h || Object.keys(f).some((e) => A.has(e) || M.test(e)), y = {}, b = {}, x = null;
-	for (let [e, t] of Object.entries(f)) d === u && p.has(e) ? e === "icon" && o(t) && (x = i(t, "span", N, { "aria-hidden": !0 })) : A.has(e) || M.test(e) || j.has(e) || _ && (e === "className" || e === "style" || e === "ref") ? y[e] = t : b[e] = t;
-	let S = h ? "span" : d, C = {
+	let u = a(n, "span");
+	if (!u) return z();
+	let { Component: d, props: f, children: h } = u, g = R(d), v = g || Object.keys(f).some((e) => j.has(e) || M.test(e)), y = {}, b = {}, x = null;
+	for (let [t, n] of Object.entries(f)) d === p && m.has(t) ? t === "icon" && o(n) && (x = i(n, "span", e(c.dismissIcon, N), { "aria-hidden": !0 })) : j.has(t) || M.test(t) || de.has(t) || v && (t === "className" || t === "style" || t === "ref") ? y[t] = n : b[t] = n;
+	let S = g ? "span" : d, C = {
 		"aria-hidden": !0,
 		...b,
-		className: e(N, b.className)
+		className: e(x === null && c.dismissIcon, N, b.className)
 	}, w = null;
-	return x || o(m) ? w = g(x, m, d === u && f.iconPosition) : s(S, {
+	return x || o(h) ? w = _(x, h, d === p && f.iconPosition) : s(S, {
 		...b,
-		children: m
-	}) && (w = F()), {
+		children: h
+	}) && (w = L()), {
 		buttonProps: y,
-		content: w === null ? T.createElement(S, C) : T.createElement(S, C, w),
+		content: w === null ? O.createElement(S, C) : O.createElement(S, C, w),
 		contentMayName: !1,
 		literalTextLabel: !1,
-		disabledFocusable: d === u && !!f.disabledFocusable,
-		warning: _ ? "button-object" : null
+		disabledFocusable: d === p && !!f.disabledFocusable,
+		warning: v ? "button-object" : null
 	};
 }
-var z = ({ status: t = "info", statusLabel: r, onDismiss: a, icon: o, dismiss: s, children: u, className: d, ref: p, ...g }) => {
-	let v = e("mt-0.5 inline-flex shrink-0", x[t]), A = o === void 0 ? /* @__PURE__ */ E("span", {
+var B = ({ status: t = "info", statusLabel: r, onDismiss: a, icon: s, dismiss: p, layout: m = "auto", children: _, className: v, ref: ee, ...T }) => {
+	let D = e(c.icon, "mt-0.5 inline-flex shrink-0", w[t]), j = s === void 0 ? /* @__PURE__ */ k("span", {
 		"aria-hidden": "true",
-		className: v,
-		children: /* @__PURE__ */ E(S, {
+		className: D,
+		children: /* @__PURE__ */ k(te, {
 			status: t,
 			size: 20
 		})
-	}) : i(o, "span", v, { "aria-hidden": !0 }), M = a !== void 0 || s !== void 0 && typeof s != "boolean" ? R(s) : null, N = M?.warning ?? null;
-	T.useEffect(() => {
+	}) : o(s) ? i(s, "span", D, { "aria-hidden": !0 }) : null, M = a !== void 0 || p !== void 0 && typeof p != "boolean" ? me(p) : null, N = M?.warning ?? null;
+	O.useEffect(() => {
 		N === "button-element" ? n("MessageBar:dismiss-button-element", "MessageBar: `dismiss` received a button element; its props were merged into the built-in dismiss button (buttons cannot be nested). Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`.") : N === "button-object" && n("MessageBar:dismiss-button-object", "MessageBar: the button-object form of `dismiss` is deprecated and will be removed in 1.0; its button props were merged into the built-in dismiss button. Pass icon content instead, e.g. `dismiss={<CloseIcon />}`, and use `onDismiss`.");
 	}, [N]);
-	let { ref: F, ...I } = M?.buttonProps ?? {}, L = Object.keys(I).some((e) => j.has(e) && I[e] != null), z = M !== null && M.contentMayName && !L, B = M?.literalTextLabel ?? !1, [V, H] = T.useState(null), U = T.useCallback((e) => V ? y(V, e) : P, [V]), W = T.useSyncExternalStore(U, () => V ? _(V) : B, () => B), G = z && W, K = c(F, z ? H : void 0), q = null;
+	let { ref: P, ...F } = M?.buttonProps ?? {}, L = Object.keys(F).some((e) => de.has(e) && F[e] != null), R = M !== null && M.contentMayName && !L, z = M?.literalTextLabel ?? !1, [B, V] = O.useState(null), he = O.useCallback((e) => B ? x(B, e) : pe, [B]), ge = O.useSyncExternalStore(he, () => B ? b(B) : z, () => z), _e = R && ge, ve = u(P, R ? V : void 0), H = null;
 	if (M) {
-		let t = f({
-			"aria-label": L || G ? void 0 : k,
+		let t = y({
+			"aria-label": L || _e ? void 0 : ue,
 			onClick: () => a?.(),
-			className: e("ms-auto inline-flex shrink-0 cursor-pointer items-center justify-center rounded border-none bg-transparent p-1 text-muted-foreground", "not-disabled:not-aria-disabled:hover:bg-subtle-hover not-disabled:not-aria-disabled:hover:text-foreground", "not-disabled:not-aria-disabled:active:bg-subtle-pressed", l, "disabled:cursor-not-allowed disabled:opacity-50", h)
-		}, I);
-		q = /* @__PURE__ */ E("button", {
+			className: e(c.dismissButton, "ms-auto inline-flex shrink-0 cursor-pointer items-center justify-center rounded border-none bg-transparent p-1 text-muted-foreground", "not-disabled:not-aria-disabled:hover:bg-subtle-hover not-disabled:not-aria-disabled:hover:text-foreground", "not-disabled:not-aria-disabled:active:bg-subtle-pressed", f, "disabled:cursor-not-allowed disabled:opacity-50", g)
+		}, F);
+		H = /* @__PURE__ */ k("button", {
 			...t,
-			ref: K,
+			ref: ve,
 			type: t.type ?? "button",
-			...M.disabledFocusable ? m : void 0,
+			...M.disabledFocusable ? h : void 0,
 			children: M.content
 		});
 	}
-	return /* @__PURE__ */ D("div", {
-		ref: p,
-		role: t === "error" || t === "warning" ? "alert" : "status",
-		...g,
-		className: e("flex items-start gap-3 rounded border-s-4 px-4 py-3 text-foreground", O[t], b[t], d),
+	let { title: U, ownTitleId: ye, actions: W, body: be } = se(_), xe = l("wave-message-bar-title"), G = ce(ye, xe), Se = G.titleId, K = t === "error" || t === "warning" ? "alert" : "status", q = "role" in T ? T.role : K, J = T["aria-label"] !== void 0 || T["aria-labelledby"] !== void 0, Y = re(t, r), X = l("wave-message-bar-status"), Ce = U !== void 0 && !J && fe(q), we = J ? T["aria-labelledby"] : Ce ? d(Y ? X : void 0, Se) : void 0, Te = I(q) === "region" && U === void 0 && !J;
+	O.useEffect(() => {
+		Te && n("MessageBar:region-name", "MessageBar: a bar with role=\"region\" is a landmark only when it has a name. Add a MessageBar.Title, or pass aria-label or aria-labelledby.");
+	}, [Te]);
+	let Z = W.length > 0, Q = m === "auto" && Z, [Ee, De] = O.useState(null), [Oe, ke] = O.useState(null), Ae = u(ee, Q ? De : void 0), je = S(Ee, Oe, Q), $ = m === "auto" ? Z ? je : "multiline" : m, Me = Q && $ === "singleline", Ne = /* @__PURE__ */ A("div", {
+		ref: Q ? ke : void 0,
+		className: e(c.body, "min-w-0 flex-1 text-body-1", Me && "whitespace-nowrap"),
 		children: [
-			A,
-			/* @__PURE__ */ D("div", {
-				className: "min-w-0 flex-1 text-body-1",
-				children: [/* @__PURE__ */ E(C, { label: w(t, r) }), u]
+			/* @__PURE__ */ k(ne, {
+				id: Ce && Y ? X : void 0,
+				label: Y
 			}),
-			q
+			U && /* @__PURE__ */ k(E.Provider, {
+				value: G,
+				children: U.element
+			}),
+			U && " ",
+			be.map(({ key: e, node: t, extraTitle: n }) => n ? /* @__PURE__ */ k(E.Provider, {
+				value: oe,
+				children: t
+			}, e) : /* @__PURE__ */ k(O.Fragment, { children: t }, e))
 		]
 	});
+	return /* @__PURE__ */ k("div", {
+		ref: Ae,
+		role: K,
+		"data-layout": $,
+		...T,
+		"aria-labelledby": we,
+		className: e(c.root, "flex items-start gap-3 rounded border-s-4 px-4 py-3 text-foreground", le[t], C[t], v),
+		children: /* @__PURE__ */ A(E.Provider, {
+			value: ae,
+			children: [
+				j,
+				Z ? /* @__PURE__ */ A("div", {
+					className: e("flex min-w-0 flex-1 gap-x-3 gap-y-2", $ === "multiline" ? "flex-col" : "items-start"),
+					children: [Ne, /* @__PURE__ */ k(E.Provider, {
+						value: ie,
+						children: W.map(({ key: e, element: t }) => /* @__PURE__ */ k(O.Fragment, { children: t }, e))
+					})]
+				}) : Ne,
+				H
+			]
+		})
+	});
 };
-z.displayName = "MessageBar";
+B.displayName = "MessageBar";
+var V = /* @__PURE__ */ Object.assign(B, {
+	Title: D,
+	Actions: T
+});
 //#endregion
-export { z as MessageBar };
+export { V as MessageBar, T as MessageBarActions, D as MessageBarTitle };
 
 //# sourceMappingURL=MessageBar.mjs.map