{
  "_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": "ScopedNotifications",
  "description": "Inline scoped notification banner that pairs a small status icon with a short message inside a contained surface, used to surface info, success, warning, or error messaging within a region of the page.",
  "extensions": {
    "com.salesforce-ux": {
      "genReady": false
    }
  },
  "cssSource": "./scopedNotifications.css",
  "styleApi": {
    "status": "stable",
    "ready": true
  },
  "structure": {
    "name": "scopedNotification",
    "restrict": [
      "div"
    ],
    "description": "Notification container that lays out the icon and message body using the media object pattern. Carries a role of status (or alert for higher-severity messages) for assistive technology.",
    "attributes": {
      "static": {
        "class": "slds-scoped-notification slds-media slds-media_center"
      }
    },
    "variants": [
      {
        "name": "tone",
        "description": "Mutually exclusive visual tone for the notification. Light and dark are neutral surfaces; info, success, warning, and error map to the standard SLDS theme palette.",
        "options": [
          {
            "value": "light",
            "class": "slds-scoped-notification_light",
            "description": "Light neutral surface with on-surface text and underlined links."
          },
          {
            "value": "dark",
            "class": "slds-scoped-notification_dark",
            "description": "Dark neutral surface with inverted text. Not available in the Cosmos theme."
          },
          {
            "value": "info",
            "class": "slds-theme_info",
            "description": "Informational tone using the SLDS info theme palette."
          },
          {
            "value": "success",
            "class": "slds-theme_success",
            "description": "Success tone using the SLDS success theme palette."
          },
          {
            "value": "warning",
            "class": "slds-theme_warning",
            "description": "Warning tone using the SLDS warning theme palette."
          },
          {
            "value": "error",
            "class": "slds-theme_error",
            "description": "Error tone using the SLDS error theme palette."
          }
        ]
      }
    ],
    "children": [
      {
        "name": "figure",
        "restrict": [
          "div"
        ],
        "description": "Media-object figure that holds the leading status icon.",
        "attributes": {
          "static": {
            "class": "slds-media__figure"
          }
        },
        "children": [
          {
            "name": "iconContainer",
            "restrict": [
              "span"
            ],
            "description": "Icon container that frames the utility status glyph. The trailing slds-icon-utility-* class identifies the specific icon (info, success, warning, error) and is applied per usage.",
            "attributes": {
              "static": {
                "class": "slds-icon_container"
              }
            },
            "children": [
              {
                "name": "icon",
                "restrict": [
                  "svg"
                ],
                "description": "Small status icon. The light tone additionally applies slds-icon-text-default so the glyph picks up the on-surface text color.",
                "attributes": {
                  "static": {
                    "class": "slds-icon slds-icon_small"
                  }
                }
              },
              {
                "name": "iconAssistiveText",
                "restrict": [
                  "span"
                ],
                "description": "Visually hidden label announcing the notification tone (for example, information, success, warning, error).",
                "attributes": {
                  "static": {
                    "class": "slds-assistive-text"
                  }
                }
              }
            ]
          }
        ]
      },
      {
        "name": "body",
        "restrict": [
          "div"
        ],
        "description": "Media-object body that holds the notification message and any inline links.",
        "attributes": {
          "static": {
            "class": "slds-media__body"
          }
        }
      }
    ]
  }
}