@aurodesignsystem-dev/auro-dialog 0.0.0-pr106.2 → 0.0.0-pr106.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -7,7 +7,7 @@ function initBasicExample() {
7
7
  document.querySelector("#closeBasic"),
8
8
  ];
9
9
  const dialog = document.querySelector("#defaultDialog");
10
- if (buttons.length === 0 || !dialog) {
10
+ if (!buttons[0] || !buttons[1] || !dialog) {
11
11
  return;
12
12
  }
13
13
  initBasicExample._initialized = true;
@@ -3419,7 +3419,7 @@ class ComponentBase extends i$2 {
3419
3419
 
3420
3420
  if (!ComponentBase._mobileBreakpointValue) {
3421
3421
  const docStyle = getComputedStyle(document.documentElement);
3422
- ComponentBase._mobileBreakpointValue = docStyle.getPropertyValue(MOBILE_BREAKPOINT).replace('px', '') - 0;
3422
+ ComponentBase._mobileBreakpointValue = Number(docStyle.getPropertyValue(MOBILE_BREAKPOINT).replace('px', ''));
3423
3423
  }
3424
3424
  }
3425
3425
 
@@ -3445,7 +3445,7 @@ class ComponentBase extends i$2 {
3445
3445
  // lock page when dialog is full-bleed on mobile to prevent background scroll,
3446
3446
  // but allow scroll when dialog is a smaller popover that doesn't cover the entire viewport.
3447
3447
  const bWidth = document.body.offsetWidth;
3448
- if (bWidth < ComponentBase._mobileBreakpointValue ) {
3448
+ if (bWidth < ComponentBase._mobileBreakpointValue) {
3449
3449
  this._lockPageScroll();
3450
3450
  }
3451
3451
 
@@ -3453,7 +3453,7 @@ class ComponentBase extends i$2 {
3453
3453
  clearTimeout(this._resizeTimer);
3454
3454
  this._resizeTimer = setTimeout(() => {
3455
3455
  const bWidth = document.body.offsetWidth;
3456
- if (bWidth < ComponentBase._mobileBreakpointValue ) {
3456
+ if (bWidth < ComponentBase._mobileBreakpointValue) {
3457
3457
  if (!this._scrollLocked) {
3458
3458
  this._lockPageScroll();
3459
3459
  }
package/demo/index.md CHANGED
@@ -138,7 +138,7 @@ export function initBasicExample() {
138
138
  document.querySelector("#closeBasic"),
139
139
  ];
140
140
  const dialog = document.querySelector("#defaultDialog");
141
- if (buttons.length === 0 || !dialog) {
141
+ if (!buttons[0] || !buttons[1] || !dialog) {
142
142
  return;
143
143
  }
144
144
  initBasicExample._initialized = true;
@@ -79,7 +79,7 @@ import{css as e,LitElement as t,html as o}from"lit";import{classMap as s}from"li
79
79
  `,St=e`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{--insetPaddingXl: 0 var(--ds-size-400, 2rem) var(--ds-size-400, 2rem) var(--ds-size-400, 2rem);--insetPaddingXxl: 0 var(--ds-size-600, 3rem) var(--ds-size-600, 3rem) var(--ds-size-600, 3rem);--insetPaddingXxxl: 0 var(--ds-size-800, 4rem) var(--ds-size-800, 4rem) var(--ds-size-800, 4rem)}[auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}.dialogOverlay{position:fixed;z-index:-1;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.dialogOverlay--open{z-index:var(--ds-depth-overlay);pointer-events:unset;transition:background .3s cubic-bezier(.4,0,.2,0)}.dialogOverlay--modal{z-index:var(--ds-depth-overlay);transition:background .3s cubic-bezier(.4,0,.5,0)}.dialog{position:fixed;z-index:-1;top:unset;right:0;bottom:-100%;left:0;box-sizing:border-box;display:flex;flex-direction:column;visibility:hidden;overflow:visible;width:calc(100% - var(--insetPaddingXl) - var(--insetPaddingXl));max-height:90%;padding:var(--insetPaddingXl);opacity:0;border:0;margin:0;max-width:none}.dialog::backdrop{background:transparent}.dialog{transition:opacity .3s ease-in-out,visibility .3s ease-in-out,bottom .3s ease-in-out}.dialog--open{z-index:var(--ds-depth-modal, 300);visibility:visible;bottom:0;opacity:1}@media screen and (min-width:768px){.dialog{top:10%;bottom:unset;left:0;right:0;max-width:80%;max-height:80%;margin:auto;padding:var(--insetPaddingXxxl);opacity:0;width:calc(100% - var(--insetPaddingXxxl) - var(--insetPaddingXxxl));height:auto;overflow:visible}.dialog--open{opacity:1}}@media screen and (min-width:1024px){.dialog{max-width:986px}}.dialog-footer{padding-top:var(--ds-size-400, 2rem)}@media screen and (min-width:768px){.dialog-footer ::slotted(*){display:flex;justify-content:flex-end}}.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;padding-top:var(--ds-size-800, 4rem);margin-bottom:var(--ds-size-300, 1.5rem)}.dialog-header--action{margin:0;padding:0}.dialog-header--action:hover{cursor:pointer}.dialog-header .heading{flex:1;margin-block:0}.dialog-content{flex:1;overflow:auto;overscroll-behavior:contain;margin:calc(-1 * var(--ds-size-100));padding:var(--ds-size-100)}::slotted([slot=content]){position:relative}:host([unformatted]) .dialog-header--action{position:absolute;top:var(--ds-size-400, 2rem);bottom:unset;right:var(--ds-size-400, 2rem)}@media screen and (min-width:768px){:host([unformatted]) .dialog-header--action{top:var(--ds-size-800, 4rem);bottom:unset;right:var(--ds-size-800, 4rem)}}:host([sm]) .dialog{max-height:30%}@media screen and (min-width:768px){:host([sm]) .dialog{top:10%;bottom:unset;max-width:40%;max-height:80%;padding:var(--insetPaddingXxl)}}@media screen and (min-width:1024px){:host([sm]) .dialog{max-width:740px}}:host([md]) .dialog{max-height:50%}@media screen and (min-width:768px){:host([md]) .dialog{top:10%;bottom:unset;max-width:70%;max-height:80%}}@media screen and (min-width:1024px){:host([md]) .dialog{top:10%;bottom:unset;max-width:986px}}@media screen and (min-width:768px){:host([sm][lg]) .dialog,:host([md][lg]) .dialog{max-height:80%}}:host([sm][lg]) .dialog,:host([md][lg]) .dialog{max-height:90%}:host([unformatted]) .dialog{padding:0}
80
80
  `,At=e`[unformatted] .unformattedWrapper{padding:var(--ds-size-400, 2rem)}@media screen and (min-width:768px){[unformatted] .unformattedWrapper{padding:var(--ds-size-800, 4rem);padding-top:var(--ds-size-400, 2rem)}}
81
81
  `,Bt=e`:host{--ds-auro-dialog-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dialog-boxshadow-color: var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, .2));--ds-auro-dialog-overlay-modal-background-color: var(--ds-advanced-color-shared-scrim, rgba(0, 0, 0, .5));--ds-auro-dialog-overlay-open-background-color: var(--ds-advanced-color-shared-scrim, rgba(0, 0, 0, .5));--ds-auro-dialog-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}
82
- `;class Tt extends t{constructor(){super(),this._initializeDefaults()}_initializeDefaults(){this.modal=!1,this.unformatted=!1,this.closeButtonAppearance="default",this.isPopoverVisible=!1,this.isBibFullscreen=!1,this.floater=new Ue;const e=new c;this.buttonTag=e.generateTag("auro-button","12.3.2",pt),this.iconTag=e.generateTag("auro-icon","9.1.2",zt),this.runtimeUtils=new l}static get properties(){return{closeButtonAppearance:{type:String,attribute:"close-button-appearance",reflect:!0},lg:{type:Boolean,reflect:!0},md:{type:Boolean,reflect:!0},modal:{type:Boolean},onDark:{type:Boolean,reflect:!0},isPopoverVisible:{type:Boolean,reflect:!0,attribute:"open"},isBibFullscreen:{type:Boolean,reflect:!0},sm:{type:Boolean,reflect:!0},triggerElement:{type:Object,attribute:!1},unformatted:{type:Boolean,reflect:!0}}}get open(){return this.isPopoverVisible}set open(e){this.isPopoverVisible=e}get floaterConfig(){return{}}firstUpdated(){this.runtimeUtils.handleComponentTagRename(this,"auro-dialog");const e=this.shadowRoot.querySelector("#footer"),t=this.shadowRoot.querySelector("#footerWrapper");this.dialog=this.shadowRoot.getElementById("dialog"),this.unformatted||0!==e.assignedNodes().length||t.classList.remove("dialog-footer"),this.floater.configure(this,"auroDialog"),this.floater.position=()=>{},this.addEventListener("auroDialog-toggled",e=>{e.detail.expanded||this.dispatchToggleEvent()}),this.dialog.addEventListener("cancel",e=>{e.preventDefault(),this.modal||this.floater.hideBib()}),this.dialog.addEventListener("click",e=>{e.target===this.dialog&&this.handleOverlayClick()})}updated(e){this.floater.handleUpdate(e),e.has("isPopoverVisible")&&(this.isPopoverVisible?(this.floater.showing||this.floater.showBib(),this.openDialog()):(this.floater.showing&&this.floater.hideBib(),this.closeDialog())),e.has("triggerElement")&&(this.floater.configure(this,"auroDialog"),this.floater.position=()=>{})}connectedCallback(){if(super.connectedCallback(),!Tt._mobileBreakpointValue){const e=getComputedStyle(document.documentElement);Tt._mobileBreakpointValue=e.getPropertyValue("--ds-grid-breakpoint-md").replace("px","")-0}}disconnectedCallback(){super.disconnectedCallback(),this.floater.disconnect()}openDialog(){if(this.defaultTrigger=document.activeElement,this.modal)this._lockPageScroll(),this.dialog.showModal(),this._lockTouchScroll();else{this.dialog.showPopover();document.body.offsetWidth<Tt._mobileBreakpointValue&&this._lockPageScroll(),this._boundResizeHandler=()=>{clearTimeout(this._resizeTimer),this._resizeTimer=setTimeout(()=>{document.body.offsetWidth<Tt._mobileBreakpointValue?this._scrollLocked||this._lockPageScroll():this._restorePageScroll()},50)},window.addEventListener("resize",this._boundResizeHandler)}this.focusTrap=new b(this.dialog)}onDialogTransitionEnd(){this.isPopoverVisible&&this.focusTrap&&this.focusTrap.focusFirstElement()}closeDialog(){this._restorePageScroll(),this._unlockTouchScroll(),this.focusTrap&&(this.focusTrap.disconnect(),this.focusTrap=void 0),this.modal?this.dialog?.open&&this.dialog.close():(this._boundResizeHandler&&(window.removeEventListener("resize",this._boundResizeHandler),this._boundResizeHandler=void 0),clearTimeout(this._resizeTimer),setTimeout(()=>{this.dialog?.hidePopover?.()},300)),this.defaultTrigger&&(this.defaultTrigger.focus(),this.defaultTrigger=void 0)}_restorePageScroll(){this._scrollLocked&&(document.body.style.position="",document.body.style.top="",document.body.style.width="",document.body.style.overflow="",document.documentElement.style.overflow="",window.scrollTo(0,this._savedScrollY||0),this._savedScrollY=void 0,this._scrollLocked=!1)}_lockPageScroll(){this._scrollLocked||(this._savedScrollY=window.scrollY,document.body.style.position="fixed",document.body.style.top=`-${this._savedScrollY}px`,document.body.style.width="100%",document.body.style.overflow="hidden",document.documentElement.style.overflow="hidden",this._scrollLocked=!0)}_lockTouchScroll(){this._boundTouchMoveHandler||(this._boundTouchMoveHandler=e=>{e.composedPath().some(e=>e!==document&&e.scrollHeight>e.clientHeight)||e.preventDefault()},document.addEventListener("touchmove",this._boundTouchMoveHandler,{passive:!1}))}_unlockTouchScroll(){this._boundTouchMoveHandler&&(document.removeEventListener("touchmove",this._boundTouchMoveHandler,{passive:!1}),this._boundTouchMoveHandler=void 0)}dispatchToggleEvent(){const e=new Event("toggle",{bubbles:!0,cancelable:!1});this.dispatchEvent(e)}handleOverlayClick(){if(this.isPopoverVisible&&!this.modal){const e=[...this.querySelectorAll("auro-combobox, [auro-combobox], auro-select, [auro-select], auro-datepicker, [auro-datepicker]")];[...this.querySelectorAll("auro-dropdown, [auro-dropdown]"),...e.map(e=>e.dropdown)].some(e=>e.isPopoverVisible)||this.floater.hideBib()}}handleCloseButtonClick(){this.floater.hideBib()}focus(){this.isPopoverVisible&&this.dialog.focus()}show(){this.floater.showBib()}hide(){this.floater.hideBib()}static get styles(){return[St,At,kt,Bt]}getCloseButton(){return this.modal?n``:n`
82
+ `;class Tt extends t{constructor(){super(),this._initializeDefaults()}_initializeDefaults(){this.modal=!1,this.unformatted=!1,this.closeButtonAppearance="default",this.isPopoverVisible=!1,this.isBibFullscreen=!1,this.floater=new Ue;const e=new c;this.buttonTag=e.generateTag("auro-button","12.3.2",pt),this.iconTag=e.generateTag("auro-icon","9.1.2",zt),this.runtimeUtils=new l}static get properties(){return{closeButtonAppearance:{type:String,attribute:"close-button-appearance",reflect:!0},lg:{type:Boolean,reflect:!0},md:{type:Boolean,reflect:!0},modal:{type:Boolean},onDark:{type:Boolean,reflect:!0},isPopoverVisible:{type:Boolean,reflect:!0,attribute:"open"},isBibFullscreen:{type:Boolean,reflect:!0},sm:{type:Boolean,reflect:!0},triggerElement:{type:Object,attribute:!1},unformatted:{type:Boolean,reflect:!0}}}get open(){return this.isPopoverVisible}set open(e){this.isPopoverVisible=e}get floaterConfig(){return{}}firstUpdated(){this.runtimeUtils.handleComponentTagRename(this,"auro-dialog");const e=this.shadowRoot.querySelector("#footer"),t=this.shadowRoot.querySelector("#footerWrapper");this.dialog=this.shadowRoot.getElementById("dialog"),this.unformatted||0!==e.assignedNodes().length||t.classList.remove("dialog-footer"),this.floater.configure(this,"auroDialog"),this.floater.position=()=>{},this.addEventListener("auroDialog-toggled",e=>{e.detail.expanded||this.dispatchToggleEvent()}),this.dialog.addEventListener("cancel",e=>{e.preventDefault(),this.modal||this.floater.hideBib()}),this.dialog.addEventListener("click",e=>{e.target===this.dialog&&this.handleOverlayClick()})}updated(e){this.floater.handleUpdate(e),e.has("isPopoverVisible")&&(this.isPopoverVisible?(this.floater.showing||this.floater.showBib(),this.openDialog()):(this.floater.showing&&this.floater.hideBib(),this.closeDialog())),e.has("triggerElement")&&(this.floater.configure(this,"auroDialog"),this.floater.position=()=>{})}connectedCallback(){if(super.connectedCallback(),!Tt._mobileBreakpointValue){const e=getComputedStyle(document.documentElement);Tt._mobileBreakpointValue=Number(e.getPropertyValue("--ds-grid-breakpoint-md").replace("px",""))}}disconnectedCallback(){super.disconnectedCallback(),this.floater.disconnect()}openDialog(){if(this.defaultTrigger=document.activeElement,this.modal)this._lockPageScroll(),this.dialog.showModal(),this._lockTouchScroll();else{this.dialog.showPopover();document.body.offsetWidth<Tt._mobileBreakpointValue&&this._lockPageScroll(),this._boundResizeHandler=()=>{clearTimeout(this._resizeTimer),this._resizeTimer=setTimeout(()=>{document.body.offsetWidth<Tt._mobileBreakpointValue?this._scrollLocked||this._lockPageScroll():this._restorePageScroll()},50)},window.addEventListener("resize",this._boundResizeHandler)}this.focusTrap=new b(this.dialog)}onDialogTransitionEnd(){this.isPopoverVisible&&this.focusTrap&&this.focusTrap.focusFirstElement()}closeDialog(){this._restorePageScroll(),this._unlockTouchScroll(),this.focusTrap&&(this.focusTrap.disconnect(),this.focusTrap=void 0),this.modal?this.dialog?.open&&this.dialog.close():(this._boundResizeHandler&&(window.removeEventListener("resize",this._boundResizeHandler),this._boundResizeHandler=void 0),clearTimeout(this._resizeTimer),setTimeout(()=>{this.dialog?.hidePopover?.()},300)),this.defaultTrigger&&(this.defaultTrigger.focus(),this.defaultTrigger=void 0)}_restorePageScroll(){this._scrollLocked&&(document.body.style.position="",document.body.style.top="",document.body.style.width="",document.body.style.overflow="",document.documentElement.style.overflow="",window.scrollTo(0,this._savedScrollY||0),this._savedScrollY=void 0,this._scrollLocked=!1)}_lockPageScroll(){this._scrollLocked||(this._savedScrollY=window.scrollY,document.body.style.position="fixed",document.body.style.top=`-${this._savedScrollY}px`,document.body.style.width="100%",document.body.style.overflow="hidden",document.documentElement.style.overflow="hidden",this._scrollLocked=!0)}_lockTouchScroll(){this._boundTouchMoveHandler||(this._boundTouchMoveHandler=e=>{e.composedPath().some(e=>e!==document&&e.scrollHeight>e.clientHeight)||e.preventDefault()},document.addEventListener("touchmove",this._boundTouchMoveHandler,{passive:!1}))}_unlockTouchScroll(){this._boundTouchMoveHandler&&(document.removeEventListener("touchmove",this._boundTouchMoveHandler,{passive:!1}),this._boundTouchMoveHandler=void 0)}dispatchToggleEvent(){const e=new Event("toggle",{bubbles:!0,cancelable:!1});this.dispatchEvent(e)}handleOverlayClick(){if(this.isPopoverVisible&&!this.modal){const e=[...this.querySelectorAll("auro-combobox, [auro-combobox], auro-select, [auro-select], auro-datepicker, [auro-datepicker]")];[...this.querySelectorAll("auro-dropdown, [auro-dropdown]"),...e.map(e=>e.dropdown)].some(e=>e.isPopoverVisible)||this.floater.hideBib()}}handleCloseButtonClick(){this.floater.hideBib()}focus(){this.isPopoverVisible&&this.dialog.focus()}show(){this.floater.showBib()}hide(){this.floater.hideBib()}static get styles(){return[St,At,kt,Bt]}getCloseButton(){return this.modal?n``:n`
83
83
  <${this.buttonTag}
84
84
  aria-label="${this.runtimeUtils.getSlotText(this,"ariaLabel.dialog.close")||"Close"}"
85
85
  variant="ghost"
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- export{A as AuroDialog}from"./auro-dialog-B958j-eu.js";import"lit";import"lit/directives/class-map.js";import"lit/directives/if-defined.js";import"lit/static-html.js";
1
+ export{A as AuroDialog}from"./auro-dialog-DMisOOkB.js";import"lit";import"lit/directives/class-map.js";import"lit/directives/if-defined.js";import"lit/static-html.js";
@@ -1 +1 @@
1
- import{A as i}from"./auro-dialog-B958j-eu.js";import"lit";import"lit/directives/class-map.js";import"lit/directives/if-defined.js";import"lit/static-html.js";i.register();
1
+ import{A as i}from"./auro-dialog-DMisOOkB.js";import"lit";import"lit/directives/class-map.js";import"lit/directives/if-defined.js";import"lit/static-html.js";i.register();
package/package.json CHANGED
@@ -7,7 +7,7 @@
7
7
  "================================================================================"
8
8
  ],
9
9
  "name": "@aurodesignsystem-dev/auro-dialog",
10
- "version": "0.0.0-pr106.2",
10
+ "version": "0.0.0-pr106.4",
11
11
  "description": "auro-dialog HTML custom element",
12
12
  "repository": {
13
13
  "type": "git",