@govbr-ds/webcomponents 2.1.0 → 2.1.1

package/dist/esm/br-notification-header.entry.js

@@ -0,0 +1,46 @@
+/*!
+ * Construído por SERPRO
+ * © https://serpro.gov.br/ - MIT License.
+ */
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-C2RBydfd.js';
+import { g as generateUniqueId } from './id-BkS6ujyf.js';
+
+const notificationHeaderCss = () => `*,*::before,*::after{box-sizing:border-box}:host{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:rgba(0,0,0,0)}b,strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.d-none{display:none !important}@media (min-width: 576px){.d-sm-block{display:block !important}.d-sm-flex{display:flex !important}}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown>.br-notification{left:auto;right:0}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter)*.5);padding-right:calc(var(--grid-gutter)*.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.col-2{flex-basis:16.6666666667%;max-width:16.6666666667%}.container,.container-fluid,.container-lg{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter)*-0.5);margin-right:calc(var(--grid-gutter)*-0.5)}@media (min-width: 576px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.ease{animation-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1)}.ease-in-out{animation-timing-function:cubic-bezier(0.42, 0, 0.58, 1)}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mb-1{margin-bottom:var(--spacing-scale-half) !important}.ml-1{margin-left:var(--spacing-scale-half) !important}.mx-3{margin-left:var(--spacing-scale-2x) !important;margin-right:var(--spacing-scale-2x) !important}.mb-4{margin-bottom:var(--spacing-scale-3x) !important}.ml-auto{margin-left:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}@media (min-width: 576px){.ml-sm-0{margin-left:var(--spacing-scale-default) !important}}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}.text-center{text-align:center !important}.text-right{text-align:right !important}.text-nowrap{white-space:nowrap !important}.text-uppercase{text-transform:uppercase !important}.text-bold{font-weight:700 !important}.text-base{font-size:var(--font-size-scale-base) !important}.text-down-01{font-size:var(--font-size-scale-down-01) !important}@media (min-width: 576px){.text-sm-center{text-align:center !important}.text-sm-left{text-align:left !important}.text-sm-right{text-align:right !important}}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media (min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset:var(--spacing-scale-half)}a:focus{outline:none}a.focus-visible,a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}a{color:var(--interactive);text-decoration:none}.main-content a{text-decoration:underline}button{cursor:pointer}img{max-width:100%;vertical-align:middle}h2,.h2{color:var(--color);font-size:var(--font-size-scale-up-03);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2xh);margin-top:var(--spacing-scale-3xh);padding-bottom:var(--spacing-scale-2xh)}@media (min-width: 576px){.h2,h2{font-size:var(--font-size-scale-up-05);font-weight:var(--font-weight-regular)}}ul,ol{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}table{--table-background:var(--background);--table-color:var(--color);--table-border-color:var(--gray-20);--table-border-style:solid;--table-border-width:1px;--table-hover:var(--color-rgb);--table-padding:var(--spacing-scale-3x);--table-font-weight:var(--font-weight-medium);--table-th-background:var(--background-alternative);--table-th-font-weight:var(--font-weight-semi-bold);--table-row-size:var(--spacing-scale-2x);border-collapse:collapse;width:100%}tr.selected,tr.is-selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}fieldset,.fieldset{border:var(--surface-width-none);margin-bottom:var(--spacing-scale-5x);margin-top:0;padding:0}legend,.legend{color:var(--color);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2x);margin-top:var(--spacing-scale-2x)}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}.help{font-size:var(--font-size-scale-base)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}*[data-toggle=collapse]:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}*[data-toggle=collapse]:focus{outline:none}*[data-toggle=collapse].focus-visible,*[data-toggle=collapse]:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}:host{display:block}.br-notification-header{display:flex;align-items:flex-start;gap:var(--spacing-scale-2x, 16px);width:100%}.br-notification-header__avatar{flex-shrink:0}.br-notification-header__avatar:empty{display:none}.br-notification-header__content{display:flex;flex-direction:column;flex:1;min-width:0}.br-notification-header__title{font-weight:var(--font-weight-semi-bold, 600);font-size:var(--font-size-scale-up-01, 1.25rem);color:var(--text-color, #333);line-height:var(--line-height-tight, 1.2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.br-notification-header__subtitle{font-size:var(--font-size-scale-base, 1rem);color:var(--interactive-color-default, #1351b4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:var(--spacing-scale-half, 4px)}.br-notification-header__actions{flex-shrink:0;display:flex;align-items:flex-start;gap:var(--spacing-scale-base, 8px);margin-left:auto}`;
+
+const NotificationHeader = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.brNotificationHeaderClose = createEvent(this, "brNotificationHeaderClose", 7);
+        /**
+         * Identificador único do componente.
+         * Quando omitido, um valor é gerado automaticamente.
+         *
+         * > **Padrão:** valor único gerado por generateUniqueId().
+         *
+         */
+        this.customId = generateUniqueId();
+        /**
+         * Exibe botão de fechar dentro do cabeçalho.
+         */
+        this.showCloseButton = true;
+        /**
+         * Texto acessível do botão de fechar. Permite internacionalização.
+         */
+        this.closeLabel = 'Fechar notificações';
+        this.handleCloseClick = () => {
+            this.brNotificationHeaderClose.emit();
+        };
+        this.getCssClassMap = () => {
+            return {
+                'br-notification-header': true,
+            };
+        };
+    }
+    render() {
+        return (h(Host, { key: 'b7e0ec1319321a8eaa7d61d4cad8cc4de88d7434' }, h("div", { key: '80c5b3d77dc7790d0ef46c7452dec146c3863a1b', class: this.getCssClassMap() }, h("div", { key: 'cad30c2a596caf595c777b824a0a201c96bc4b36', class: "br-notification-header__avatar" }, h("slot", { key: '313f4e79921de4b5b6bb956984d7e49b24120291', name: "avatar" })), h("div", { key: '83b5c5fd016f285e1cd4e67936c374ad4365edf2', class: "br-notification-header__content" }, h("div", { key: '1ddc27560eb70f570ab23ab7d06c1103eafb49aa', class: "br-notification-header__title" }, h("slot", { key: '395dc23af2edfe82bd87bfd2e567eb76d3b3547c', name: "title" }, this.label)), this.subtitle !== undefined && this.subtitle !== null && (h("div", { key: '53444fa9eb1b26a37ae9450da134b203319ffcbc', class: "br-notification-header__subtitle" }, h("slot", { key: 'ecfa509cbeaea4c173a4a13f9143a21e4676a405', name: "subtitle" }, this.subtitle)))), h("div", { key: '29052eb4034b6fa8f47ee4f34b5e846f8f263dd1', class: "br-notification-header__actions" }, h("slot", { key: '9a1f8a1fc9f55557e22b3595bec087ff472d9bc2', name: "actions" }, this.showCloseButton && (h("br-button", { key: '2d13f123e3559f170231e28fa3f757b694c1f387', shape: "circle", density: "small", "aria-label": this.closeLabel, onClick: this.handleCloseClick }, h("br-icon", { key: '9872614c76655cb8623029ce88ae531ceb40fd02', iconName: "fa-solid:times", width: "16", height: "16" }))))))));
+    }
+    get el() { return getElement(this); }
+};
+NotificationHeader.style = notificationHeaderCss();
+
+export { NotificationHeader as br_notification_header };

package/dist/esm/br-notification-item.entry.js

@@ -0,0 +1,108 @@
+/*!
+ * Construído por SERPRO
+ * © https://serpro.gov.br/ - MIT License.
+ */
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-C2RBydfd.js';
+import { g as generateUniqueId } from './id-BkS6ujyf.js';
+
+const notificationItemCss = () => `*,*::before,*::after{box-sizing:border-box}:host{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:rgba(0,0,0,0)}b,strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.d-none{display:none !important}@media (min-width: 576px){.d-sm-block{display:block !important}.d-sm-flex{display:flex !important}}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown>.br-notification{left:auto;right:0}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter)*.5);padding-right:calc(var(--grid-gutter)*.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.col-2{flex-basis:16.6666666667%;max-width:16.6666666667%}.container,.container-fluid,.container-lg{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter)*-0.5);margin-right:calc(var(--grid-gutter)*-0.5)}@media (min-width: 576px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.ease{animation-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1)}.ease-in-out{animation-timing-function:cubic-bezier(0.42, 0, 0.58, 1)}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mb-1{margin-bottom:var(--spacing-scale-half) !important}.ml-1{margin-left:var(--spacing-scale-half) !important}.mx-3{margin-left:var(--spacing-scale-2x) !important;margin-right:var(--spacing-scale-2x) !important}.mb-4{margin-bottom:var(--spacing-scale-3x) !important}.ml-auto{margin-left:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}@media (min-width: 576px){.ml-sm-0{margin-left:var(--spacing-scale-default) !important}}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}.text-center{text-align:center !important}.text-right{text-align:right !important}.text-nowrap{white-space:nowrap !important}.text-uppercase{text-transform:uppercase !important}.text-bold{font-weight:700 !important}.text-base{font-size:var(--font-size-scale-base) !important}.text-down-01{font-size:var(--font-size-scale-down-01) !important}@media (min-width: 576px){.text-sm-center{text-align:center !important}.text-sm-left{text-align:left !important}.text-sm-right{text-align:right !important}}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media (min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset:var(--spacing-scale-half)}a:focus{outline:none}a.focus-visible,a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}a{color:var(--interactive);text-decoration:none}.main-content a{text-decoration:underline}button{cursor:pointer}img{max-width:100%;vertical-align:middle}h2,.h2{color:var(--color);font-size:var(--font-size-scale-up-03);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2xh);margin-top:var(--spacing-scale-3xh);padding-bottom:var(--spacing-scale-2xh)}@media (min-width: 576px){.h2,h2{font-size:var(--font-size-scale-up-05);font-weight:var(--font-weight-regular)}}ul,ol{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}table{--table-background:var(--background);--table-color:var(--color);--table-border-color:var(--gray-20);--table-border-style:solid;--table-border-width:1px;--table-hover:var(--color-rgb);--table-padding:var(--spacing-scale-3x);--table-font-weight:var(--font-weight-medium);--table-th-background:var(--background-alternative);--table-th-font-weight:var(--font-weight-semi-bold);--table-row-size:var(--spacing-scale-2x);border-collapse:collapse;width:100%}tr.selected,tr.is-selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}fieldset,.fieldset{border:var(--surface-width-none);margin-bottom:var(--spacing-scale-5x);margin-top:0;padding:0}legend,.legend{color:var(--color);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2x);margin-top:var(--spacing-scale-2x)}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}.help{font-size:var(--font-size-scale-base)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}*[data-toggle=collapse]:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}*[data-toggle=collapse]:focus{outline:none}*[data-toggle=collapse].focus-visible,*[data-toggle=collapse]:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}:host{display:block}:host(:not(:first-of-type)) br-item{border-top:1px solid var(--border-color, #ccc)}br-item{--item-padding:var(--notification-padding, var(--spacing-scale-base, 8px) var(--spacing-scale-2x, 16px));--interactive-rgb:var(--rgb-secondary-08);--item-color:var(--text-color);white-space:normal;width:100%}.br-notification-item__row{display:flex;align-items:flex-start;gap:var(--spacing-scale-base, 8px)}.br-notification-item__unread{flex-shrink:0;padding-top:var(--spacing-scale-half, 4px)}.br-notification-item__content{flex:1;min-width:0}.br-notification-item__title{font-size:var(--font-size-scale-base, 1rem);font-weight:var(--font-weight-semi-bold, 600);color:var(--text-color, var(--color-neutral-dark-90, #333));line-height:1.4}.br-notification-item__meta{display:flex;align-items:center;margin-top:2px}.br-notification-item__meta:empty{display:none}.br-notification-item__datetime{font-size:var(--font-size-scale-down-01, 0.875rem);color:var(--text-color-secondary, var(--color-neutral-dark-70, #555))}.br-notification-item__description{font-size:var(--font-size-scale-down-01, 0.875rem);color:var(--text-color-secondary, var(--color-neutral-dark-70, #555));line-height:1.5;margin-top:var(--spacing-scale-half, 4px)}.br-notification-item__description:empty{display:none}.br-notification-item__status{margin-top:var(--spacing-scale-half, 4px)}.br-notification-item__status:empty{display:none}.br-notification-item__actions{display:flex;align-items:center;gap:var(--spacing-scale-base, 8px);margin-top:var(--spacing-scale-base, 8px)}.br-notification-item__actions:empty{display:none}`;
+
+const NotificationItem = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.brNotificationItemSelect = createEvent(this, "brNotificationItemSelect", 7);
+        this.brNotificationItemRead = createEvent(this, "brNotificationItemRead", 7);
+        /**
+         * Identificador único do item.
+         * Quando omitido, um valor é gerado automaticamente.
+         *
+         * > **Padrão:** valor único gerado por generateUniqueId().
+         */
+        this.itemId = generateUniqueId();
+        /**
+         * Indica se a notificação ainda não foi lida.
+         */
+        this.unread = false;
+        /**
+         * Define se o item é interativo.
+         */
+        this.clickable = true;
+        this.getAriaLabel = () => {
+            if (!this.unread && !this.state)
+                return undefined;
+            const parts = [];
+            if (this.unread)
+                parts.push('Não lida');
+            if (this.state)
+                parts.push(this.getStateLabel());
+            if (this.label)
+                parts.push(this.label);
+            if (this.description)
+                parts.push(this.description);
+            return parts.join('. ');
+        };
+        this.getStateColor = () => {
+            switch (this.state) {
+                case 'success':
+                    return 'var(--color-success, #168821)';
+                case 'danger':
+                    return 'var(--color-danger, #e1173f)';
+                case 'warning':
+                    return 'var(--color-warning, #ffcd07)';
+                case 'info':
+                    return 'var(--color-info, #155bcb)';
+                default:
+                    return '';
+            }
+        };
+        this.getStateLabel = () => {
+            switch (this.state) {
+                case 'success':
+                    return 'Sucesso';
+                case 'danger':
+                    return 'Erro';
+                case 'warning':
+                    return 'Alerta';
+                case 'info':
+                    return 'Informação';
+                default:
+                    return '';
+            }
+        };
+    }
+    handleHostClick() {
+        this.handleSelect();
+    }
+    /**
+     * Move o foco para o elemento interativo do item.
+     */
+    async callFocus() {
+        const brItem = this.el.shadowRoot?.querySelector('br-item');
+        brItem?.focus();
+    }
+    handleSelect() {
+        if (!this.clickable)
+            return;
+        if (this.unread) {
+            this.unread = false;
+            this.brNotificationItemRead.emit({ itemId: this.itemId });
+        }
+        this.brNotificationItemSelect.emit({ itemId: this.itemId });
+    }
+    handleKeydown(event) {
+        if (!this.clickable)
+            return;
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            this.handleSelect();
+        }
+    }
+    render() {
+        const ariaLabel = this.getAriaLabel();
+        return (h(Host, { key: '23103c3bc4f24f5935a5c6e06e7ba9aee60a94fa', unread: this.unread, state: this.state }, h("br-item", { key: '7cc764191e4b0a9ed881248823841062b181f28e', "is-interactive": this.clickable, "is-button": this.clickable, onKeyDown: (e) => this.handleKeydown(e), role: ariaLabel ? 'article' : undefined, "aria-label": ariaLabel }, h("div", { key: '2d1a554c98da67fd6553817e0ea709fde4c6703e', class: "br-notification-item__row" }, this.unread && (h("div", { key: '9905d7b816dbd0075a5e14fcd518cb6cf965fdc1', class: "br-notification-item__unread" }, h("br-tag", { key: '38d222173daa4e0410b925cf7c325dbfc5e51680', status: true, density: "small", "bg-color": "var(--color-danger, #e1173f)", "aria-hidden": "true" }))), h("div", { key: '2989c87614e46ae5c6c105ffa4a19e80ab93f231', class: "br-notification-item__content" }, h("div", { key: 'b85edb802ea630c5bda7c25c3c2c4668a2286dbf', class: "br-notification-item__title" }, h("slot", { key: 'f8f96606389203c60bf2c7a0ca86fa2f57f8b5d4', name: "title" }, this.label)), h("div", { key: '22657ce9540cb669b7a202ccb7c2e766ac946824', class: "br-notification-item__meta" }, h("slot", { key: '7938aea4bdaa6bb03faa8b87f1c93b3c5fc8ceab', name: "meta" }, this.datetime && (h("time", { key: 'd6a6b4949f83b657370b9f09f3983e84f2db1cb9', class: "br-notification-item__datetime", dateTime: this.datetime }, this.datetime)))), h("div", { key: '141a0392a68cbd4c7b314b7ecfb3374398ff47aa', class: "br-notification-item__description" }, h("slot", { key: 'f74984f199535b757af124c53d8223d1e7019706' }, this.description)), h("div", { key: '6a91a2c2cde5ef38a6fbb08abe9dd12347f55867', class: "br-notification-item__status" }, h("slot", { key: '47a588fede9a0c0f6e8d0da8cc40b17014bbe729', name: "status" }, this.state && (h("br-tag", { key: '821a326d99aa7daabe35a41dd5642f01c11a7b06', status: true, density: "small", label: this.getStateLabel(), "bg-color": this.getStateColor(), "aria-hidden": "true" })))), h("div", { key: '4502915116d8b8a24b6842597018c5b0a935f473', class: "br-notification-item__actions" }, h("slot", { key: '5d167253deaa74d557ee4bb28944a6e0724eed36', name: "actions" })))))));
+    }
+    get el() { return getElement(this); }
+};
+NotificationItem.style = notificationItemCss();
+
+export { NotificationItem as br_notification_item };

package/dist/esm/br-notification.entry.js

@@ -0,0 +1,332 @@
+/*!
+ * Construído por SERPRO
+ * © https://serpro.gov.br/ - MIT License.
+ */
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-C2RBydfd.js';
+import { g as getEventPath } from './event-DFN_so7I.js';
+import { l as listenForExternalBlockingSurface } from './floating-surface-dismiss-BWXfdbQH.js';
+import { g as generateUniqueId } from './id-BkS6ujyf.js';
+
+const notificationCss = () => `*,*::before,*::after{box-sizing:border-box}:host{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:rgba(0,0,0,0)}b,strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.d-none{display:none !important}@media (min-width: 576px){.d-sm-block{display:block !important}.d-sm-flex{display:flex !important}}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown>.br-notification{left:auto;right:0}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter)*.5);padding-right:calc(var(--grid-gutter)*.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.col-2{flex-basis:16.6666666667%;max-width:16.6666666667%}.container,.container-fluid,.container-lg{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter)*-0.5);margin-right:calc(var(--grid-gutter)*-0.5)}@media (min-width: 576px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container,.container-lg,.container-fluid{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container,.container-lg{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.ease{animation-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1)}.ease-in-out{animation-timing-function:cubic-bezier(0.42, 0, 0.58, 1)}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mb-1{margin-bottom:var(--spacing-scale-half) !important}.ml-1{margin-left:var(--spacing-scale-half) !important}.mx-3{margin-left:var(--spacing-scale-2x) !important;margin-right:var(--spacing-scale-2x) !important}.mb-4{margin-bottom:var(--spacing-scale-3x) !important}.ml-auto{margin-left:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}@media (min-width: 576px){.ml-sm-0{margin-left:var(--spacing-scale-default) !important}}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}.text-center{text-align:center !important}.text-right{text-align:right !important}.text-nowrap{white-space:nowrap !important}.text-uppercase{text-transform:uppercase !important}.text-bold{font-weight:700 !important}.text-base{font-size:var(--font-size-scale-base) !important}.text-down-01{font-size:var(--font-size-scale-down-01) !important}@media (min-width: 576px){.text-sm-center{text-align:center !important}.text-sm-left{text-align:left !important}.text-sm-right{text-align:right !important}}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media (min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset:var(--spacing-scale-half)}a:focus{outline:none}a.focus-visible,a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}a{color:var(--interactive);text-decoration:none}.main-content a{text-decoration:underline}button{cursor:pointer}img{max-width:100%;vertical-align:middle}h2,.h2{color:var(--color);font-size:var(--font-size-scale-up-03);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2xh);margin-top:var(--spacing-scale-3xh);padding-bottom:var(--spacing-scale-2xh)}@media (min-width: 576px){.h2,h2{font-size:var(--font-size-scale-up-05);font-weight:var(--font-weight-regular)}}ul,ol{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}table{--table-background:var(--background);--table-color:var(--color);--table-border-color:var(--gray-20);--table-border-style:solid;--table-border-width:1px;--table-hover:var(--color-rgb);--table-padding:var(--spacing-scale-3x);--table-font-weight:var(--font-weight-medium);--table-th-background:var(--background-alternative);--table-th-font-weight:var(--font-weight-semi-bold);--table-row-size:var(--spacing-scale-2x);border-collapse:collapse;width:100%}tr.selected,tr.is-selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}fieldset,.fieldset{border:var(--surface-width-none);margin-bottom:var(--spacing-scale-5x);margin-top:0;padding:0}legend,.legend{color:var(--color);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2x);margin-top:var(--spacing-scale-2x)}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}.help{font-size:var(--font-size-scale-base)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}*[data-toggle=collapse]:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}*[data-toggle=collapse]:focus{outline:none}*[data-toggle=collapse].focus-visible,*[data-toggle=collapse]:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}:host{display:block;position:relative}.br-notification__trigger{display:inline-block;cursor:pointer}.br-notification__trigger:empty{display:none}.br-notification{--notification-padding:var(--spacing-scale-2x, 16px) var(--spacing-scale-4x, 32px);--notification-width:50vw;--notification-height:calc(100vh - 86px);display:flex;flex-direction:column;background-color:var(--background, var(--background-color, #fff));box-shadow:var(--surface-shadow-md);border-radius:0;position:absolute;z-index:var(--z-index-layer-1);max-width:var(--notification-width);max-height:var(--notification-height);overflow:auto;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease-in-out,visibility .2s}.br-notification.is-open{opacity:1;visibility:visible;pointer-events:auto}.br-notification.placement-bottom-end{top:100%;right:0;margin-top:var(--spacing-scale-base, 8px)}.br-notification.placement-bottom-start{top:100%;left:0;margin-top:var(--spacing-scale-base, 8px)}.br-notification.placement-top-end{bottom:100%;right:0;margin-bottom:var(--spacing-scale-base, 8px)}.br-notification.placement-top-start{bottom:100%;left:0;margin-bottom:var(--spacing-scale-base, 8px)}.br-notification.is-static{position:relative;top:auto;right:auto;bottom:auto;left:auto;margin:0;opacity:1;visibility:visible;pointer-events:auto}@media (width <= 575.98px){.br-notification.mobile-fullscreen{--notification-padding:var(--spacing-scale-base, 8px) var(--spacing-scale-2x, 16px);--notification-width:100vw;position:fixed;z-index:var(--z-index-layer-1);inset:0;width:100vw;max-width:var(--notification-width);min-height:var(--notification-height);max-height:100dvh;border-radius:0;margin:0;overflow:hidden;opacity:1;visibility:visible;pointer-events:auto;box-shadow:var(--surface-shadow-md)}}.br-notification__header{border-bottom:1px solid var(--border-color, #ccc);padding:var(--notification-padding);flex-shrink:0;border-radius:0}.br-notification__header:empty,.br-notification__header.d-none{display:none !important}.br-notification__tabs{display:flex;flex-direction:column;flex-shrink:0}.br-notification__tabs:empty,.br-notification__tabs.d-none{display:none !important}.br-notification__tabs ::slotted(br-tab){width:100%;margin:0}@media (width <= 575.98px){.br-notification__tabs ::slotted(br-tab){--tab-size:var(--tab-small)}}.br-notification__body{display:flex;flex-direction:column;flex:1;min-height:0;overflow-y:visible}.internal-scroll .br-notification__body{overflow-y:auto;overscroll-behavior:contain}.br-notification__footer{flex-shrink:0;border-top:1px solid var(--border-color, #ccc);border-radius:0}.br-notification__footer:empty,.br-notification__footer.d-none{display:none !important}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}`;
+
+const Notification = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.brOpenChange = createEvent(this, "brOpenChange", 7);
+        this.brNotificationOpen = createEvent(this, "brNotificationOpen", 7);
+        this.brNotificationClose = createEvent(this, "brNotificationClose", 7);
+        this.brNotificationItemClick = createEvent(this, "brNotificationItemClick", 7);
+        this.brNotificationTabChange = createEvent(this, "brNotificationTabChange", 7);
+        this.hasFooter = false;
+        this.hasHeader = false;
+        this.hasTabs = false;
+        this.hasTrigger = false;
+        /**
+         * Identificador único do componente.
+         * Quando omitido, um valor é gerado automaticamente.
+         *
+         * > **Padrão:** valor único gerado por generateUniqueId().
+         *
+         */
+        this.customId = generateUniqueId();
+        /**
+         * Controla se o painel de notificações está aberto.
+         */
+        this.open = false;
+        /**
+         * Fecha o painel ao clicar fora da superfície.
+         */
+        this.closeOnOutsideClick = true;
+        /**
+         * Fecha o painel ao clicar novamente no acionador.
+         */
+        this.closeOnTriggerClick = true;
+        /**
+         * Faz o painel ocupar toda a largura disponível em viewports pequenas.
+         */
+        this.mobileFullscreen = true;
+        /**
+         * Habilita rolagem apenas na região de itens, preservando cabeçalho e abas fixos.
+         */
+        this.internalScroll = true;
+        /**
+         * Define o posicionamento do painel em relação ao acionador.
+         */
+        this.placement = 'bottom-end';
+        /**
+         * Define se o painel de notificações deve ser renderizado de forma estática (inline).
+         * Quando verdadeiro, o posicionamento absoluto é desativado. Ideal para centrais de notificações fixas ou documentação.
+         */
+        this.isStatic = false;
+        this.handleKeyDown = (event) => {
+            if (!this.isPanelVisible())
+                return;
+            if (event.key === 'Escape') {
+                this.hide('escape');
+                return;
+            }
+            if (event.key === 'Tab') {
+                this.handleFocusTrap(event);
+            }
+        };
+        this.handleOutsideClick = (event) => {
+            if (!this.isPanelVisible())
+                return;
+            const target = event.target;
+            const isClickInside = this.el.contains(target);
+            if (!isClickInside && this.closeOnOutsideClick) {
+                this.hide('outside-click');
+            }
+        };
+        this.windowListenersAttached = false;
+        this.pendingCloseReason = 'programmatic';
+        this.previousFocus = null;
+        this.getFocusableElements = () => {
+            const selector = [
+                'a[href]:not([tabindex="-1"])',
+                'button:not([disabled]):not([tabindex="-1"])',
+                'input:not([disabled]):not([tabindex="-1"])',
+                'select:not([disabled]):not([tabindex="-1"])',
+                'textarea:not([disabled]):not([tabindex="-1"])',
+                '[tabindex="0"]',
+            ].join(', ');
+            const collect = (root) => {
+                const found = [];
+                root.querySelectorAll(selector).forEach((el) => {
+                    found.push(el);
+                });
+                root.querySelectorAll('*').forEach((el) => {
+                    if (el.shadowRoot) {
+                        found.push(...collect(el.shadowRoot));
+                    }
+                });
+                return found;
+            };
+            const fromShadow = this.el.shadowRoot ? collect(this.el.shadowRoot) : [];
+            const fromLight = collect(this.el);
+            return [...new Set([...fromShadow, ...fromLight])].filter((el) => {
+                const style = window.getComputedStyle(el);
+                return style.display !== 'none' && style.visibility !== 'hidden';
+            });
+        };
+        this.handleFocusTrap = (event) => {
+            const focusable = this.getFocusableElements();
+            if (!focusable.length)
+                return;
+            const first = focusable[0];
+            const last = focusable[focusable.length - 1];
+            const path = getEventPath(event);
+            const activeIndex = focusable.findIndex((el) => path.includes(el));
+            if (activeIndex === -1)
+                return;
+            if (event.shiftKey && activeIndex === 0) {
+                event.preventDefault();
+                last.focus();
+            }
+            else if (!event.shiftKey && activeIndex === focusable.length - 1) {
+                event.preventDefault();
+                first.focus();
+            }
+        };
+        this.isPanelVisible = () => {
+            if (this.open)
+                return true;
+            if (!this.isStatic)
+                return false;
+            const panel = this.el.shadowRoot?.querySelector('.br-notification');
+            return panel ? panel.offsetWidth > 0 && panel.offsetHeight > 0 : false;
+        };
+        this.getTriggerElements = () => {
+            const triggerSlot = this.el.shadowRoot?.querySelector('slot[name="trigger"]');
+            if (!triggerSlot)
+                return [];
+            return triggerSlot.assignedNodes().filter((node) => node.nodeType === Node.ELEMENT_NODE);
+        };
+        this.updateTriggerAria = (expanded) => {
+            const triggers = this.getTriggerElements();
+            for (const trigger of triggers) {
+                trigger.setAttribute('aria-expanded', String(expanded));
+            }
+        };
+        this.getCssClassMap = () => {
+            return {
+                'br-notification': true,
+                'mobile-fullscreen': this.mobileFullscreen,
+                'internal-scroll': this.internalScroll,
+                'is-open': this.open,
+                'is-static': this.isStatic,
+                [`placement-${this.placement}`]: true,
+            };
+        };
+        this.checkSlotVisibility = (slotName) => {
+            const slot = this.el.shadowRoot?.querySelector(`slot[name="${slotName}"]`);
+            if (!slot)
+                return;
+            const nodes = slot.assignedNodes();
+            const hasContent = nodes.some((node) => {
+                if (node.nodeType === Node.ELEMENT_NODE)
+                    return true;
+                if (node.nodeType === Node.TEXT_NODE)
+                    return node.textContent.trim() !== '';
+                return false;
+            });
+            if (slotName === 'header')
+                this.hasHeader = hasContent;
+            if (slotName === 'tabs')
+                this.hasTabs = hasContent;
+            if (slotName === 'footer')
+                this.hasFooter = hasContent;
+            if (slotName === 'trigger')
+                this.hasTrigger = hasContent;
+        };
+    }
+    handleOpenChange(newValue) {
+        this.brOpenChange.emit({ open: newValue });
+        this.updateTriggerAria(newValue);
+        if (newValue) {
+            this.attachBlockingSurfaceListener();
+            this.attachWindowListeners();
+            this.brNotificationOpen.emit();
+            this.previousFocus = document.activeElement;
+            requestAnimationFrame(() => {
+                const focusable = this.getFocusableElements();
+                focusable[0]?.focus();
+            });
+        }
+        else {
+            this.detachBlockingSurfaceListener();
+            this.detachWindowListeners();
+            this.brNotificationClose.emit({ reason: this.pendingCloseReason });
+            this.pendingCloseReason = 'programmatic';
+            this.previousFocus?.focus();
+            this.previousFocus = null;
+        }
+    }
+    componentDidLoad() {
+        this.checkSlotVisibility('header');
+        this.checkSlotVisibility('tabs');
+        this.checkSlotVisibility('footer');
+        this.checkSlotVisibility('trigger');
+        this.updateTriggerAria(this.open);
+        if (this.open) {
+            this.attachBlockingSurfaceListener();
+            this.attachWindowListeners();
+        }
+    }
+    disconnectedCallback() {
+        this.detachWindowListeners();
+        this.detachBlockingSurfaceListener();
+    }
+    attachBlockingSurfaceListener() {
+        this.cleanupBlockingSurfaceDismissal ?? (this.cleanupBlockingSurfaceDismissal = listenForExternalBlockingSurface(this.el, () => {
+            if (!this.isStatic)
+                void this.hide('programmatic');
+        }));
+    }
+    detachBlockingSurfaceListener() {
+        this.cleanupBlockingSurfaceDismissal?.();
+        this.cleanupBlockingSurfaceDismissal = undefined;
+    }
+    attachWindowListeners() {
+        if (this.windowListenersAttached)
+            return;
+        window.addEventListener('keydown', this.handleKeyDown);
+        window.addEventListener('click', this.handleOutsideClick);
+        this.windowListenersAttached = true;
+    }
+    detachWindowListeners() {
+        if (!this.windowListenersAttached)
+            return;
+        window.removeEventListener('keydown', this.handleKeyDown);
+        window.removeEventListener('click', this.handleOutsideClick);
+        this.windowListenersAttached = false;
+    }
+    handleNotificationItemSelect(event) {
+        this.brNotificationItemClick.emit({ itemId: event.detail?.itemId });
+    }
+    handleNotificationHeaderClose() {
+        this.hide('close-button');
+    }
+    handleNotificationTabChange(event) {
+        this.brNotificationTabChange.emit({ value: event.detail?.value });
+    }
+    /**
+     * Abre o painel de notificações.
+     */
+    async show() {
+        if (this.open)
+            return;
+        this.open = true;
+    }
+    /**
+     * Fecha o painel de notificações.
+     */
+    async hide(reason = 'programmatic') {
+        if (this.isStatic) {
+            this.brNotificationClose.emit({ reason });
+            const parentDropdown = this.el.closest('br-dropdown');
+            if (parentDropdown?.hide) {
+                await parentDropdown.hide();
+            }
+            return;
+        }
+        if (!this.open)
+            return;
+        this.pendingCloseReason = reason;
+        this.open = false;
+    }
+    /**
+     * Alterna o estado aberto/fechado.
+     */
+    async toggle() {
+        if (this.open) {
+            await this.hide('trigger-click');
+        }
+        else {
+            await this.show();
+        }
+    }
+    /**
+     * Move o foco de volta para o acionador.
+     */
+    async focusTrigger() {
+        const triggerSlot = this.el.shadowRoot?.querySelector('slot[name="trigger"]');
+        if (triggerSlot) {
+            const nodes = triggerSlot.assignedNodes().filter((node) => node.nodeType === Node.ELEMENT_NODE);
+            if (nodes.length > 0) {
+                nodes[0].focus();
+            }
+        }
+    }
+    /**
+     * Move o foco para o primeiro item interativo da lista.
+     */
+    async focusFirstItem() {
+        const firstItem = this.el.querySelector('br-notification-item[clickable]');
+        await firstItem?.callFocus?.();
+    }
+    render() {
+        const style = {};
+        if (this.width)
+            style.width = this.width;
+        if (this.maxWidth)
+            style['--notification-width'] = this.maxWidth;
+        if (this.maxHeight)
+            style['--notification-height'] = this.maxHeight;
+        return (h(Host, { key: 'a7fcc9ae9c1e1cdc0b88d0bb6db305cbbb4e6890', "mobile-fullscreen": this.mobileFullscreen, "internal-scroll": this.internalScroll, open: this.open, style: !this.isStatic ? { zIndex: 'var(--z-index-layer-1)' } : undefined }, h("div", { key: '380869cab4e10b463fea8db4f37fa4eff9755fd8', class: { 'br-notification__trigger': true, 'd-none': !this.hasTrigger }, role: "button", tabIndex: 0, onClick: () => this.toggle(), onKeyDown: (event) => {
+                if (event.key === 'Enter' || event.key === ' ') {
+                    event.preventDefault();
+                    this.toggle();
+                }
+            } }, h("slot", { key: 'b62966800264826e5ec3d0ed207111b5a966caf5', name: "trigger", onSlotchange: () => this.checkSlotVisibility('trigger') })), h("div", { key: '51644f60967640e10b3cf1042f24ff8e61e2cee0', class: this.getCssClassMap(), id: this.customId, style: style, part: "base", "aria-label": this.label, "aria-hidden": !this.open ? 'true' : null, role: "dialog", "aria-modal": "true" }, h("div", { key: '143b970dd46d04409f51d019a11220a026100e51', part: "header", class: { 'br-notification__header': true, 'd-none': !this.hasHeader } }, h("slot", { key: 'dbb0f9f4888f51c2850d7cefaa13aded21f77bd5', name: "header", onSlotchange: () => this.checkSlotVisibility('header') })), h("div", { key: 'd6d6d3cc55d97d4a35214100e78332c7ae1e45e4', part: "tabs", class: { 'br-notification__tabs': true, 'd-none': !this.hasTabs } }, h("slot", { key: '8e243f393e351e68f77ac96085d25b92309de3a1', name: "tabs", onSlotchange: () => this.checkSlotVisibility('tabs') })), h("div", { key: '2b627ef82f4c3ff6f1208df0d50348d558a23734', part: "body", class: "br-notification__body" }, h("slot", { key: 'f0168490a486c2436213ffd6097979335707dc1e' })), h("div", { key: '53938c47cb8c0dc6547d56d0fe218cb51c233465', part: "footer", class: { 'br-notification__footer': true, 'd-none': !this.hasFooter } }, h("slot", { key: 'a594a95fe233a415885ec0b2f5477b5313eab20c', name: "footer", onSlotchange: () => this.checkSlotVisibility('footer') })))));
+    }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "open": [{
+                "handleOpenChange": 0
+            }]
+    }; }
+};
+Notification.style = notificationCss();
+
+export { Notification as br_notification };