{
  "_copyright": "Copyright (c) 2026, Salesforce, Inc., All rights reserved. For full license text, see the LICENSE.txt file",
  "$schema": "https://slds.lightningdesignsystem.com/schemas/uif-system.v1.json",
  "apiVersion": "1.0.0",
  "name": "Notifications",
  "description": "Fixed-position stack of transient, dismissible notification cards (event and task reminders) that surface at the top inline-end of the viewport, each composed of a media row (icon + heading + supporting text) and a close button.",
  "extensions": {
    "com.salesforce-ux": {
      "genReady": false
    }
  },
  "cssSource": "./notifications.css",
  "styleApi": {
    "status": "stable",
    "ready": true
  },
  "structure": {
    "name": "container",
    "restrict": [
      "div"
    ],
    "description": "Fixed-position outer wrapper that anchors the notification stack to the top inline-end of the viewport and constrains its width.",
    "attributes": {
      "static": {
        "class": "slds-notification-container"
      }
    },
    "children": [
      {
        "name": "liveRegion",
        "restrict": [
          "div"
        ],
        "description": "Visually hidden assertive live region that announces each incoming notification to assistive technology.",
        "attributes": {
          "static": {
            "class": "slds-assistive-text",
            "aria-live": "assertive",
            "aria-atomic": "true"
          }
        }
      },
      {
        "name": "notification",
        "restrict": [
          "section"
        ],
        "description": "Individual notification card. Multiple notification children stack vertically; the stylesheet handles offset, z-order, overflow, and fade for cards beyond the first few.",
        "attributes": {
          "static": {
            "class": "slds-notification",
            "role": "dialog"
          }
        },
        "children": [
          {
            "name": "body",
            "restrict": [
              "div"
            ],
            "description": "Inner wrapper referenced by aria-describedby that groups the clickable target and the dismiss button.",
            "attributes": {
              "static": {
                "class": "slds-notification__body"
              }
            },
            "children": [
              {
                "name": "target",
                "restrict": [
                  "a",
                  "button"
                ],
                "description": "Primary interactive surface (typically a link) that opens the notification's underlying record. Lays out as an SLDS media object with a leading icon figure and a stacked text body.",
                "attributes": {
                  "static": {
                    "class": "slds-notification__target slds-media"
                  }
                },
                "children": [
                  {
                    "name": "iconContainer",
                    "restrict": [
                      "span"
                    ],
                    "description": "Standard-icon container rendered as the media figure. The specific slds-icon-standard-* class is supplied per notification type (e.g. event, task).",
                    "attributes": {
                      "static": {
                        "class": "slds-icon_container slds-media__figure"
                      }
                    },
                    "children": [
                      {
                        "name": "icon",
                        "restrict": [
                          "svg"
                        ],
                        "description": "Small standard icon SVG glyph.",
                        "attributes": {
                          "static": {
                            "class": "slds-icon slds-icon_small",
                            "aria-hidden": "true"
                          }
                        }
                      },
                      {
                        "name": "iconAssistiveText",
                        "restrict": [
                          "span"
                        ],
                        "description": "Visually hidden description of the icon for assistive technology.",
                        "attributes": {
                          "static": {
                            "class": "slds-assistive-text"
                          }
                        }
                      }
                    ]
                  },
                  {
                    "name": "mediaBody",
                    "restrict": [
                      "div"
                    ],
                    "description": "Media-object body containing the notification heading and supporting text. The stylesheet fades this body's opacity for stacked notifications beyond the visible threshold.",
                    "attributes": {
                      "static": {
                        "class": "slds-media__body"
                      }
                    },
                    "children": [
                      {
                        "name": "heading",
                        "restrict": [
                          "h2"
                        ],
                        "description": "Notification title referenced by the section's aria-labelledby.",
                        "attributes": {
                          "static": {
                            "class": "slds-text-heading_small slds-m-bottom_xx-small"
                          }
                        },
                        "children": [
                          {
                            "name": "headingPrefix",
                            "restrict": [
                              "span"
                            ],
                            "description": "Visually hidden prefix announcing the notification type (e.g. 'event notification:', 'task notification:').",
                            "attributes": {
                              "static": {
                                "class": "slds-assistive-text"
                              }
                            }
                          }
                        ]
                      },
                      {
                        "name": "supportingText",
                        "restrict": [
                          "p"
                        ],
                        "description": "Supporting line of body copy describing the notification (e.g. time, due date)."
                      }
                    ]
                  }
                ]
              },
              {
                "name": "close",
                "restrict": [
                  "button"
                ],
                "description": "Icon button absolutely positioned at the inline-end top corner of the notification that dismisses it.",
                "attributes": {
                  "static": {
                    "class": "slds-button slds-button_icon slds-button_icon-container slds-notification__close"
                  }
                },
                "children": [
                  {
                    "name": "closeIcon",
                    "description": "Close (x) glyph rendered inside the dismiss button.",
                    "attributes": {
                      "static": {
                        "class": "slds-button__icon"
                      }
                    },
                    "component": "PrimitiveIcon"
                  },
                  {
                    "name": "closeAssistiveText",
                    "restrict": [
                      "span"
                    ],
                    "description": "Visually hidden label announcing the dismiss action for the specific notification.",
                    "attributes": {
                      "static": {
                        "class": "slds-assistive-text"
                      }
                    }
                  }
                ]
              },
              {
                "name": "footer",
                "restrict": [
                  "div",
                  "footer"
                ],
                "description": "Optional footer below the notification body for secondary actions or metadata.",
                "attributes": {
                  "static": {
                    "class": "slds-notification__footer"
                  }
                }
              }
            ]
          }
        ]
      }
    ]
  },
  "componentRefs": {
    "PrimitiveIcon": {
      "description": "Bare SVG icon composed directly inside the component. The host node supplies the SVG class (e.g. slds-button__icon, slds-menu__item-icon) via componentProps; PrimitiveIcon contributes the sprite-href binding.",
      "props": {
        "iconName": {
          "type": "string",
          "required": true,
          "description": "Sprite reference for the icon glyph"
        }
      }
    }
  }
}